@extends('layouts.app')

@section('title', 'Paket Soal Ujian')

@section('content')
<div class="pkbm-master-page mx-auto max-w-6xl space-y-5">
    <header class="pkbm-dashboard__heading">
        <div>
            <p class="pkbm-dashboard__breadcrumb"><a href="{{ route('pkbm.ujian.schedules', ['tahun_pelajaran' => $schedule->tahun_pelajaran, 'ujian' => $schedule->nama_ujian]) }}" class="no-underline">Manajemen Ujian</a> <i class="bi bi-chevron-right" aria-hidden="true"></i>Paket Soal</p>
            <h1 class="pkbm-dashboard__title">Pilih Soal untuk {{ $schedule->nama_ujian }}</h1>
            <p class="pkbm-dashboard__subtitle">{{ $subject->nama_mapel }} · {{ $schedule->nama_kelas }} · {{ $semester }} {{ $year }}</p>
        </div>
        <a href="{{ route('pkbm.ujian.questions', ['tahun_pelajaran' => $year, 'semester' => $semester, 'id_kelas' => $schedule->kelas_id, 'id_mapel' => $subject->id, 'jenis' => $jenis]) }}" class="sp-btn-secondary">Kembali ke bank soal</a>
    </header>

    @if (session('status'))<div role="status" class="settings-notice settings-notice--success"><i class="bi bi-check-circle-fill" aria-hidden="true"></i><span>{{ session('status') }}</span></div>@endif
    @if ($errors->any())<div role="alert" class="settings-notice settings-notice--error"><i class="bi bi-exclamation-circle-fill" aria-hidden="true"></i><div><p class="font-semibold">Paket soal belum berhasil disimpan.</p><ul class="mt-1 list-inside list-disc">@foreach ($errors->all() as $error)<li>{{ $error }}</li>@endforeach</ul></div></div>@endif

    <section class="sp-card overflow-hidden">
        <div class="sp-card-header"><h2 class="sp-section-title">Rakit paket dari bank soal</h2><p class="mt-1 text-xs text-slate-500">Pilih soal per BAB. Paket dibuat sebagai salinan khusus jadwal agar perubahan bank tidak mengubah ujian yang sudah disusun.</p></div>
        @if ($hasAnswers)
            <div class="m-5 rounded-xl border border-amber-200 bg-amber-50 p-4 text-sm text-amber-900">Paket ini sudah memiliki jawaban siswa dan dikunci agar soal serta penilaian tetap konsisten.</div>
        @endif
        <form method="POST" action="{{ route('pkbm.ujian.questions.package.save', $schedule->id) }}" class="space-y-5 p-5">
            @csrf
            @forelse ($bankQuestions->groupBy(fn ($question) => $question->bab_ke ?? 'unassigned') as $chapterNumber => $chapterQuestions)
                @php($chapterId = $chapterNumber === 'unassigned' ? null : (int) $chapterNumber)
                <section class="rounded-xl border border-slate-200">
                    <label class="flex items-center gap-3 border-b border-slate-100 bg-slate-50 px-4 py-3 text-sm font-semibold text-slate-800">
                        <input type="checkbox" class="size-4 rounded border-slate-300 text-blue-600" data-chapter-toggle="{{ $chapterId ?? 'unassigned' }}" @disabled($hasAnswers)>
                        {{ $chapterId ? 'BAB '.$chapterId.' · '.($chapterNames->get($chapterId) ?: 'Materi peta') : 'Belum ditandai BAB' }}
                        <span class="ml-auto text-xs font-normal text-slate-500">{{ $chapterQuestions->count() }} soal</span>
                    </label>
                    <div class="divide-y divide-slate-100">
                        @foreach ($chapterQuestions as $question)
                            @php($isSelected = in_array((int) $question->id, array_map('intval', old('selected', $selectedSourceIds)), true))
                            <label class="flex items-start gap-3 px-4 py-4">
                                <input type="checkbox" name="selected[]" value="{{ $question->id }}" class="mt-1 size-4 rounded border-slate-300 text-blue-600" data-question-chapter="{{ $chapterId ?? 'unassigned' }}" @checked($isSelected) @disabled($hasAnswers)>
                                <span class="min-w-0 flex-1">
                                    <span class="mb-1 block text-xs font-semibold uppercase tracking-wide text-blue-700">{{ str_replace('_', ' ', $question->tipe_soal) }} · Soal #{{ $question->id }}</span>
                                    <span class="block whitespace-pre-line text-sm text-slate-800">{{ $question->pertanyaan ?: 'Arsip soal terlampir' }}</span>
                                    @if ($question->file_upload)<span class="mt-1 block text-xs text-slate-500">Berkas soal tersedia</span>@endif
                                </span>
                            </label>
                        @endforeach
                    </div>
                </section>
            @empty
                <p class="rounded-xl border border-slate-200 bg-slate-50 p-4 text-sm text-slate-600">Belum ada soal bank untuk kelas, mapel, jenis ujian, tahun, dan semester ini.</p>
            @endforelse
            <div class="flex flex-wrap items-center gap-3 border-t border-slate-100 pt-4">
                <button type="submit" class="sp-btn-primary" @disabled($hasAnswers || $bankQuestions->isEmpty())><i class="bi bi-check2-circle" aria-hidden="true"></i>Simpan paket soal</button>
                <span class="text-xs text-slate-500">Pilih minimal satu soal. Paket dapat diubah sebelum ada jawaban siswa.</span>
            </div>
        </form>
        @if ($selectedSourceIds !== [] && ! $hasAnswers)
            <form method="POST" action="{{ route('pkbm.ujian.questions.package.clear', $schedule->id) }}" class="border-t border-slate-100 px-5 py-4" onsubmit="return confirm('Kosongkan paket soal ini?')">
                @csrf @method('DELETE')
                <button type="submit" class="sp-btn-danger"><i class="bi bi-trash" aria-hidden="true"></i>Kosongkan paket</button>
            </form>
        @endif
    </section>
</div>
@push('scripts')
<script>
document.querySelectorAll('[data-chapter-toggle]').forEach((toggle) => {
    toggle.addEventListener('change', () => {
        document.querySelectorAll(`[data-question-chapter="${toggle.dataset.chapterToggle}"]`).forEach((question) => {
            question.checked = toggle.checked;
        });
    });
});
</script>
@endpush
@endsection