@extends('layouts.app')

@section('title', 'Verifikasi PKBM')

@section('content')
<div class="pkbm-master-page mx-auto max-w-7xl space-y-5">
    <header class="pkbm-dashboard__heading">
        <div class="min-w-0">
            <p class="pkbm-dashboard__breadcrumb"><span>Admin Kabupaten</span><i class="bi bi-chevron-right" aria-hidden="true"></i>Verifikasi PKBM</p>
            <h1 class="pkbm-dashboard__title">Verifikasi Pendaftaran</h1>
            <p class="pkbm-dashboard__subtitle">Tinjau dan setujui pendaftaran lembaga PKBM baru.</p>
        </div>
    </header>

    @if (session('status'))
        <div role="status" class="settings-notice settings-notice--{{ session('status')['type'] ?? 'success' }}">
            <i class="bi {{ (session('status')['type'] ?? 'success') === 'success' ? 'bi-check-circle-fill' : 'bi-exclamation-circle-fill' }}" aria-hidden="true"></i>
            <span>{{ session('status')['message'] }}</span>
        </div>
    @endif

    <section class="sp-card overflow-hidden">
        <div class="sp-card-header flex flex-wrap items-center justify-between gap-3">
            <div>
                <h2 class="sp-section-title">Antrean pendaftaran</h2>
                <p class="mt-1 text-xs text-slate-500">{{ $pendaftaran->count() }} pendaftaran menunggu keputusan.</p>
            </div>
        </div>
        <div class="overflow-x-auto">
            <table class="sp-table min-w-[46rem]">
                <thead>
                    <tr>
                        <th scope="col">Identitas Lembaga</th>
                        <th scope="col">Kontak &amp; Email</th>
                        <th scope="col">Wilayah</th>
                        <th scope="col" class="text-right">Keputusan</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse ($pendaftaran as $row)
                        <tr>
                            <th scope="row" class="font-normal">
                                <div class="flex items-center gap-3">
                                    <span class="grid size-11 shrink-0 place-items-center overflow-hidden rounded-full border border-slate-200 bg-slate-50">
                                        @if ($row->logo)
                                            <img src="{{ route('fk.verifikasi.logo', $row->id) }}" alt="" class="size-full object-cover">
                                        @else
                                            <i class="bi bi-building text-slate-400" aria-hidden="true"></i>
                                        @endif
                                    </span>
                                    <span class="min-w-0">
                                        <span class="block font-semibold text-slate-800">{{ $row->nama_pkbm }}</span>
                                        @if ($row->npsn)
                                            <span class="mt-0.5 inline-flex rounded-full bg-sky-50 px-2 py-0.5 text-xs font-semibold text-sky-700">NPSN: {{ $row->npsn }}</span>
                                        @endif
                                    </span>
                                </div>
                            </th>
                            <td>
                                <div class="text-sm text-slate-700">{{ $row->kontak ?: '-' }}</div>
                                <div class="text-xs text-slate-500">{{ $row->email ?: '-' }}</div>
                            </td>
                            <td>
                                <div class="text-sm text-slate-700">{{ collect([$row->kecamatan, $row->kabupaten])->filter()->implode(', ') ?: '-' }}</div>
                                <div class="text-xs text-slate-500">{{ $row->provinsi }}</div>
                            </td>
                            <td class="text-right">
                                <div class="inline-flex items-center gap-1">
                                    <form method="POST" action="{{ route('fk.verifikasi.terima', $row->id) }}"
                                          onsubmit="return confirm('Terima lembaga ini dan tambahkan ke sistem?')">
                                        @csrf
                                        <button type="submit" class="sp-btn-primary !px-3 !py-1.5 text-xs">
                                            <i class="bi bi-check2-circle" aria-hidden="true"></i>Terima
                                        </button>
                                    </form>
                                    <form method="POST" action="{{ route('fk.verifikasi.tolak', $row->id) }}"
                                          onsubmit="return confirm('Tolak dan hapus pendaftaran ini?')">
                                        @csrf
                                        <button type="submit" class="sp-btn-secondary !px-3 !py-1.5 text-xs text-rose-600">
                                            <i class="bi bi-x-circle" aria-hidden="true"></i>Tolak
                                        </button>
                                    </form>
                                </div>
                            </td>
                        </tr>
                    @empty
                        <tr><td colspan="4" class="py-12 text-center text-sm text-slate-500">Saat ini tidak ada antrean pendaftaran baru.</td></tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </section>
</div>
@endsection