ilycats/resources/views/pages/cats/pedigree.blade.php

<x-app-layout>
    <div class="mb-6 flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
        <div>
            <a href="{{ route('cats.show',$cat) }}" class="mb-2 inline-flex items-center gap-2 text-sm text-slate-500 hover:text-slate-800"><i class="fas fa-arrow-left"></i>Kembali ke profil</a>
            <h1 class="text-2xl font-bold text-slate-900">Registrasi & pedigree</h1>
            <p class="mt-1 text-sm text-slate-500">{{ $cat->nama_kucing }} dapat memiliki registrasi dan sertifikat dari beberapa asosiasi.</p>
        </div>
    </div>

    <div class="grid gap-6 xl:grid-cols-[1fr_360px]">
        <div class="space-y-4">
            @forelse($cat->registrations as $registration)
                <section class="overflow-hidden rounded-2xl border border-slate-200 bg-white">
                    <div class="flex flex-wrap items-start justify-between gap-3 border-b border-slate-200 px-5 py-4">
                        <div class="flex items-center gap-3">
                            <div class="flex h-10 min-w-10 items-center justify-center rounded-xl bg-slate-100 px-2 text-sm font-bold text-slate-700">{{ $registration->association->code }}</div>
                            <div><h2 class="font-semibold text-slate-900">{{ $registration->association->name }}</h2><p class="text-xs text-slate-500">{{ $registration->is_primary ? 'Pedigree utama' : 'Registrasi tambahan' }}</p></div>
                        </div>
                        @can('check-access',['cats','update'])
                        <form action="{{ route('cats.registrations.destroy',[$cat,$registration]) }}" method="POST" onsubmit="return confirm('Hapus registrasi ini beserta dokumennya?')">@csrf @method('DELETE')<button class="text-sm font-medium text-rose-600 hover:text-rose-700">Hapus</button></form>
                        @endcan
                    </div>

                    <form action="{{ route('cats.registrations.update',[$cat,$registration]) }}" method="POST" class="grid gap-4 p-5 sm:grid-cols-2 lg:grid-cols-3">@csrf @method('PUT')
                        <div><label class="field-label">Nomor registrasi</label><input name="registration_number" value="{{ $registration->registration_number }}" class="field-input rounded-xl"></div>
                        <div><label class="field-label">Nomor pedigree</label><input name="pedigree_number" value="{{ $registration->pedigree_number }}" class="field-input rounded-xl"></div>
                        <div><label class="field-label">Nomor sertifikat</label><input name="certificate_number" value="{{ $registration->certificate_number }}" class="field-input rounded-xl"></div>
                        <div><label class="field-label">Tanggal terbit</label><input type="date" name="issue_date" value="{{ $registration->issue_date?->format('Y-m-d') }}" class="field-input rounded-xl"></div>
                        <div><label class="field-label">Gelar / title</label><input name="title" value="{{ $registration->title }}" class="field-input rounded-xl" placeholder="Contoh: CH, GCH"></div>
                        <div><label class="field-label">Status kepemilikan</label><select name="ownership_status" class="field-input rounded-xl"><option value="">-</option>@foreach(['milik_sendiri'=>'Milik sendiri','co_own'=>'Co-own','transfer'=>'Transfer','lainnya'=>'Lainnya'] as $v=>$l)<option value="{{ $v }}" @selected($registration->ownership_status===$v)>{{ $l }}</option>@endforeach</select></div>
                        <div class="sm:col-span-2 lg:col-span-3"><label class="field-label">Catatan</label><textarea name="notes" rows="2" class="field-input rounded-xl">{{ $registration->notes }}</textarea></div>
                        <label class="flex items-center gap-2 text-sm text-slate-700"><input type="hidden" name="is_primary" value="0"><input type="checkbox" name="is_primary" value="1" @checked($registration->is_primary) class="rounded border-slate-300 text-indigo-600">Jadikan pedigree utama</label>
                        @can('check-access',['cats','update'])<div class="sm:col-span-2 lg:col-span-3"><button class="rounded-xl bg-slate-800 px-4 py-2 text-sm font-semibold text-white hover:bg-slate-900">Simpan perubahan registrasi</button></div>@endcan
                    </form>

                    <div class="border-t border-slate-200 bg-slate-50/50 p-5">
                        <div class="mb-3 flex items-center justify-between"><h3 class="text-sm font-semibold text-slate-800">Dokumen pedigree</h3><span class="text-xs text-slate-500">PDF/JPG/PNG, maks. 10 MB</span></div>
                        <div class="mb-4 grid gap-2">
                            @forelse($registration->documents as $document)
                                <div class="flex flex-col gap-3 rounded-xl border border-slate-200 bg-white p-3 sm:flex-row sm:items-center sm:justify-between">
                                    <div class="min-w-0"><p class="truncate text-sm font-semibold text-slate-800">{{ $document->label }}</p><p class="text-xs text-slate-500">{{ ucfirst($document->document_type) }}{{ $document->issued_at ? ' · '.$document->issued_at->format('d-m-Y') : '' }}</p></div>
                                    <div class="flex flex-wrap gap-2">
                                        <a href="{{ route('cats.registrations.documents.show',[$cat,$registration,$document]) }}" target="_blank" rel="noopener" class="rounded-lg border border-indigo-200 bg-indigo-50 px-3 py-2 text-xs font-semibold text-indigo-700 hover:bg-indigo-100"><i class="fas fa-eye mr-1"></i>Lihat</a>
                                        <a href="{{ route('cats.registrations.documents.download',[$cat,$registration,$document]) }}" class="rounded-lg border border-slate-200 bg-white px-3 py-2 text-xs font-semibold text-slate-700 hover:bg-slate-50"><i class="fas fa-download mr-1"></i>Unduh</a>
                                        @can('check-access',['cats','update'])<form action="{{ route('cats.registrations.documents.destroy',[$cat,$registration,$document]) }}" method="POST" onsubmit="return confirm('Hapus dokumen ini?')">@csrf @method('DELETE')<button class="rounded-lg border border-rose-200 bg-rose-50 px-3 py-2 text-xs font-semibold text-rose-700 hover:bg-rose-100"><i class="fas fa-trash mr-1"></i>Hapus</button></form>@endcan
                                    </div>
                                </div>
                            @empty
                                <p class="rounded-xl border border-dashed border-slate-300 bg-white p-5 text-center text-sm text-slate-500">Belum ada dokumen pada registrasi ini.</p>
                            @endforelse
                        </div>
                        @can('check-access',['cats','update'])
                        <form action="{{ route('cats.registrations.documents.store',[$cat,$registration]) }}" method="POST" enctype="multipart/form-data" class="grid gap-3 md:grid-cols-[1fr_180px_180px_auto]">@csrf<input type="file" name="document" required class="field-input rounded-xl py-2"><select name="document_type" class="field-input rounded-xl"><option value="pedigree">Pedigree</option><option value="registration">Registrasi</option><option value="ownership">Kepemilikan</option><option value="title">Gelar</option><option value="other">Lainnya</option></select><input name="label" class="field-input rounded-xl" placeholder="Nama dokumen"><button class="rounded-xl bg-slate-800 px-4 py-2 text-sm font-semibold text-white hover:bg-slate-900">Tambah dokumen</button></form>
                        @endcan
                    </div>
                </section>
            @empty
                <div class="rounded-2xl border border-dashed border-slate-300 bg-white p-10 text-center"><i class="fas fa-file-lines mb-3 text-3xl text-slate-300"></i><p class="font-medium text-slate-700">Belum ada registrasi pedigree</p><p class="mt-1 text-sm text-slate-500">Tambahkan asosiasi dari formulir di sebelah kanan.</p></div>
            @endforelse
        </div>

        @can('check-access',['cats','update'])
        <aside class="h-fit rounded-2xl border border-slate-200 bg-white p-5" x-data="{custom:false}">
            <h2 class="font-semibold text-slate-900">Tambah registrasi</h2><p class="mt-1 text-sm text-slate-500">Satu asosiasi dapat ditambahkan satu kali untuk setiap kucing.</p>
            <form action="{{ route('cats.registrations.store',$cat) }}" method="POST" enctype="multipart/form-data" class="mt-5 space-y-4">@csrf
                <div><label class="field-label">Asosiasi</label><select name="association_id" required class="field-input rounded-xl" @change="custom=$event.target.value==='custom'"><option value="">Pilih asosiasi</option>@foreach($associations as $association)<option value="{{ $association->id }}">{{ $association->code }} - {{ $association->name }}</option>@endforeach<option value="custom">Asosiasi lain…</option></select></div>
                <template x-if="custom"><div class="space-y-3"><div><label class="field-label">Kode asosiasi</label><input name="association_code" class="field-input rounded-xl" placeholder="Contoh: TICA"></div><div><label class="field-label">Nama asosiasi</label><input name="association_name" class="field-input rounded-xl"></div></div></template>
                <div><label class="field-label">Nomor registrasi</label><input name="registration_number" class="field-input rounded-xl"></div>
                <div><label class="field-label">Nomor pedigree</label><input name="pedigree_number" class="field-input rounded-xl"></div>
                <div><label class="field-label">Nomor sertifikat</label><input name="certificate_number" class="field-input rounded-xl"></div>
                <div class="grid grid-cols-2 gap-3"><div><label class="field-label">Tanggal terbit</label><input type="date" name="issue_date" class="field-input rounded-xl"></div><div><label class="field-label">Gelar</label><input name="title" class="field-input rounded-xl"></div></div>
                <div><label class="field-label">File sertifikat</label><input type="file" name="certificate_file" accept=".pdf,.jpg,.jpeg,.png" class="field-input rounded-xl py-2"></div>
                <label class="flex items-center gap-2 text-sm text-slate-700"><input type="hidden" name="is_primary" value="0"><input type="checkbox" name="is_primary" value="1" class="rounded border-slate-300 text-indigo-600">Jadikan pedigree utama</label>
                <button class="w-full rounded-xl bg-indigo-600 px-4 py-2.5 text-sm font-semibold text-white hover:bg-indigo-700">Simpan registrasi</button>
            </form>
        </aside>
        @endcan
    </div>
</x-app-layout>