@php
    $gradeRange = match ($selectedPackage) {
        'A' => range(1, 6),
        'B' => range(7, 9),
        'C' => range(10, 12),
    };
@endphp
<div class="space-y-3">
    <div class="flex flex-wrap items-center justify-between gap-3">
        <p class="text-sm text-slate-600">{{ $selectedAssignmentYear->tahun_pelajaran }} · {{ $selectedAssignmentExam->nama_ujian }} · {{ $packageTabs[$selectedPackage][0] }}</p>
    </div>
    <nav class="flex gap-2 overflow-x-auto border-b border-slate-200 pb-2" aria-label="Pilih kelas">
        @foreach ($assignmentGrades as $grade)
            <a href="{{ route('fk.ujian.index', ['tab' => 'pembagian', 'paket' => $selectedPackage, 'tahun_tugas' => $selectedAssignmentYearId, 'jenis_tugas' => $selectedAssignmentTypeId, 'tingkatan' => $grade]) }}" class="sp-btn-secondary shrink-0" @if ($selectedAssignmentGrade === $grade) aria-current="page" @endif>Kelas {{ $grade }}</a>
        @endforeach
    </nav>
    <div class="overflow-x-auto rounded-lg border border-slate-200 bg-white">
        <table class="sp-table min-w-[110rem]">
            <thead>
                <tr>
                    <th>Mata Pelajaran</th>
                    <th>PKBM</th>
                    <th>Kelas</th>
                    <th>Penyusun</th>
                    <th>Kontak</th>
                    <th>Tenggat</th>
                    <th>Progres</th>
                    <th>Catatan</th>
                    <th>Aksi</th>
                </tr>
            </thead>
            <tbody>
                <tr class="bg-blue-50/50">
                    <td>
                        <form id="manual-assignment-create" method="POST" action="{{ route('fk.ujian.pemetaan.store') }}">
                            @csrf
                            <input type="hidden" name="paket" value="{{ $selectedPackage }}">
                            <input type="hidden" name="tahun_id" value="{{ $selectedAssignmentYearId }}">
                            <input type="hidden" name="jenis_id" value="{{ $selectedAssignmentTypeId }}">
                        </form>
                        <input form="manual-assignment-create" name="nama_mapel" required maxlength="150" placeholder="Ketik nama mapel" aria-label="Nama mata pelajaran baru" class="sp-form-control min-w-44 px-2 py-1.5 text-sm">
                    </td>
                    <td><select form="manual-assignment-create" name="id_pkbm" required aria-label="PKBM pemetaan baru" class="sp-form-control min-w-40 px-2 py-1.5 text-sm"><option value="">Pilih PKBM</option>@foreach ($institutions as $institution)<option value="{{ $institution->id }}">{{ $institution->nama_pkbm }}</option>@endforeach</select></td>
                    <td><select form="manual-assignment-create" name="tingkatan" required aria-label="Kelas pemetaan baru" class="sp-form-control min-w-24 px-2 py-1.5 text-sm">@foreach ($gradeRange as $grade)<option value="{{ $grade }}" @selected($selectedAssignmentGrade === $grade)>{{ $grade }}</option>@endforeach</select></td>
                    <td><input form="manual-assignment-create" name="nama_penyusun" required maxlength="150" placeholder="Nama penyusun" aria-label="Nama penyusun baru" class="sp-form-control min-w-40 px-2 py-1.5 text-sm"></td>
                    <td><input form="manual-assignment-create" name="kontak_penyusun" maxlength="30" placeholder="Kontak" aria-label="Kontak penyusun baru" class="sp-form-control min-w-32 px-2 py-1.5 text-sm"></td>
                    <td><input form="manual-assignment-create" name="tenggat" type="date" aria-label="Tenggat pemetaan baru" class="sp-form-control min-w-36 px-2 py-1.5 text-sm"></td>
                    <td><select form="manual-assignment-create" name="status" required class="sp-form-control min-w-32 px-2 py-1.5 text-sm"><option value="ditugaskan">Ditugaskan</option><option value="dikerjakan">Dikerjakan</option><option value="selesai">Selesai</option></select></td>
                    <td><input form="manual-assignment-create" name="catatan" maxlength="2000" placeholder="Catatan" aria-label="Catatan pemetaan baru" class="sp-form-control min-w-40 px-2 py-1.5 text-sm"></td>
                    <td><button form="manual-assignment-create" class="sp-btn-primary whitespace-nowrap px-3 py-2 text-sm"><i class="bi bi-plus-lg" aria-hidden="true"></i>Tambah</button></td>
                </tr>
                @forelse ($assignments as $assignment)
                    @php $updateForm = 'manual-assignment-update-'.$assignment->id; @endphp
                    <tr>
                        <td>
                            <form id="{{ $updateForm }}" method="POST" action="{{ route('fk.ujian.pemetaan.update', $assignment->id) }}">
                                @csrf
                                @method('PUT')
                                <input type="hidden" name="paket" value="{{ $selectedPackage }}">
                                <input type="hidden" name="tahun_id" value="{{ $selectedAssignmentYearId }}">
                                <input type="hidden" name="jenis_id" value="{{ $selectedAssignmentTypeId }}">
                            </form>
                            <input form="{{ $updateForm }}" name="nama_mapel" required maxlength="150" value="{{ $assignment->nama_mapel }}" aria-label="Mata pelajaran" class="sp-form-control min-w-44 px-2 py-1.5 text-sm">
                        </td>
                        <td><select form="{{ $updateForm }}" name="id_pkbm" required aria-label="PKBM" class="sp-form-control min-w-40 px-2 py-1.5 text-sm">@foreach ($institutions as $institution)<option value="{{ $institution->id }}" @selected((int) $assignment->id_pkbm === (int) $institution->id)>{{ $institution->nama_pkbm }}</option>@endforeach</select></td>
                        <td><select form="{{ $updateForm }}" name="tingkatan" required aria-label="Kelas" class="sp-form-control min-w-24 px-2 py-1.5 text-sm">@foreach ($gradeRange as $grade)<option value="{{ $grade }}" @selected((int) $assignment->tingkatan === $grade)>{{ $grade }}</option>@endforeach</select></td>
                        <td><input form="{{ $updateForm }}" name="nama_penyusun" required maxlength="150" value="{{ $assignment->nama_penyusun }}" aria-label="Penyusun" class="sp-form-control min-w-40 px-2 py-1.5 text-sm"></td>
                        <td><input form="{{ $updateForm }}" name="kontak_penyusun" maxlength="30" value="{{ $assignment->kontak_penyusun }}" aria-label="Kontak penyusun" class="sp-form-control min-w-32 px-2 py-1.5 text-sm"></td>
                        <td><input form="{{ $updateForm }}" name="tenggat" type="date" value="{{ $assignment->tenggat }}" aria-label="Tenggat" class="sp-form-control min-w-36 px-2 py-1.5 text-sm"></td>
                        <td><select form="{{ $updateForm }}" name="status" required class="sp-form-control min-w-32 px-2 py-1.5 text-sm"><option value="ditugaskan" @selected($assignment->status === 'ditugaskan')>Ditugaskan</option><option value="dikerjakan" @selected($assignment->status === 'dikerjakan')>Dikerjakan</option><option value="selesai" @selected($assignment->status === 'selesai')>Selesai</option></select></td>
                        <td><input form="{{ $updateForm }}" name="catatan" maxlength="2000" value="{{ $assignment->catatan }}" aria-label="Catatan" class="sp-form-control min-w-40 px-2 py-1.5 text-sm"></td>
                        <td><div class="flex items-center gap-1"><button form="{{ $updateForm }}" class="sp-btn-secondary px-2 py-1.5 text-sm" title="Simpan perubahan"><i class="bi bi-check2" aria-hidden="true"></i></button><form method="POST" action="{{ route('fk.ujian.pemetaan.destroy', $assignment->id) }}" onsubmit="return confirm('Hapus pemetaan mapel {{ $assignment->nama_mapel }}?')">@csrf @method('DELETE')<input type="hidden" name="paket" value="{{ $selectedPackage }}"><input type="hidden" name="tahun_tugas" value="{{ $selectedAssignmentYearId }}"><input type="hidden" name="jenis_tugas" value="{{ $selectedAssignmentTypeId }}"><input type="hidden" name="tingkatan" value="{{ $selectedAssignmentGrade }}"><button class="settings-icon-action settings-icon-action--delete" aria-label="Hapus pemetaan {{ $assignment->nama_mapel }}"><i class="bi bi-trash3" aria-hidden="true"></i></button></form></div></td>
                    </tr>
                @empty
                    <tr><td colspan="9" class="py-8 text-center text-sm text-slate-500">Belum ada data pemetaan. Isi baris kosong di atas untuk menambahkan mapel dan kolom lainnya secara manual.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>