@extends('admin.layout')
@section('title','Data Pendaftar')
@section('content')

@php
  $currentUser = auth()->user();
  $canApprovePayments = $currentUser->isSuperAdmin() || $currentUser->hasFeature('can_approve_payments');
  $queryParams = request()->except(['page','sort','direction']);
  $currentSort = request('sort');
  $currentDirection = request('direction', 'desc');
  $sortDirection = fn($column) => ($currentSort === $column && $currentDirection === 'asc') ? 'desc' : 'asc';
  $sortIcon = fn($column) => $currentSort === $column ? ($currentDirection === 'asc' ? '▲' : '▼') : '↕';
@endphp

<div class="page-header">
  <div><h1>Data Pendaftar</h1><p>Tampilkan seluruh data calon peserta didik yang telah mendaftar</p></div>
</div>

<!-- FILTER -->
<div class="card">
  <div class="card-body" style="padding:18px 22px;">
    <form method="GET" style="display:grid;grid-template-columns:1fr 160px 160px 160px auto auto;gap:12px;align-items:center;">
      <div class="search-bar" style="width:100%;">
        <i data-lucide="search" style="width:16px;height:16px;color:var(--gray-400);"></i>
        <input type="text" name="search" placeholder="Cari kode / nama orang tua / nama anak / asal sekolah" class="search-input" value="{{ request('search') }}">
      </div>
      <select name="status" class="form-select" style="width:100%;min-width:0;">
        <option value="">Semua Status</option>
        <option value="bayar_pendaftaran" {{ request('status')=='bayar_pendaftaran'?'selected':'' }}>Bayar Formulir</option>
        <option value="isi_formulir" {{ request('status')=='isi_formulir'?'selected':'' }}>Isi Formulir</option>
        <option value="tes_online" {{ request('status')=='tes_online'?'selected':'' }}>Tes Online</option>
        <option value="selesai" {{ request('status')=='selesai'?'selected':'' }}>Selesai</option>
      </select>
      <select name="jenis_kelamin" class="form-select" style="width:100%;min-width:0;">
        <option value="">Semua Jenis Kelamin</option>
        <option value="Laki-laki" {{ request('jenis_kelamin')=='Laki-laki'?'selected':'' }}>Laki-laki</option>
        <option value="Perempuan" {{ request('jenis_kelamin')=='Perempuan'?'selected':'' }}>Perempuan</option>
      </select>
      <input type="text" name="sekolah_asal" placeholder="Filter asal sekolah" class="form-input" value="{{ request('sekolah_asal') }}">
      <button type="submit" class="btn btn-primary">Terapkan Filter</button>
      <a href="{{ route('admin.pendaftar.index') }}" class="btn btn-outline">Reset</a>
    </form>
  </div>
</div>

<div class="card">
  <div class="table-wrap">
    <table>
      <thead>
        <tr>
          <th>No.</th>
          <th>
            <a href="{{ route('admin.pendaftar.index', array_merge($queryParams, ['sort' => 'id_user', 'direction' => $sortDirection('id_user')])) }}" style="color:inherit;text-decoration:none;display:flex;align-items:center;gap:4px;">
              Kode Pendaftar <span style="font-size:10px;">{{ $sortIcon('id_user') }}</span>
            </a>
          </th>
          <th>
            <a href="{{ route('admin.pendaftar.index', array_merge($queryParams, ['sort' => 'nama_anak', 'direction' => $sortDirection('nama_anak')])) }}" style="color:inherit;text-decoration:none;display:flex;align-items:center;gap:4px;">
              Nama Anak <span style="font-size:10px;">{{ $sortIcon('nama_anak') }}</span>
            </a>
          </th>
          <th>NISN</th>
          <th>No KTP</th>
          <th>
            <a href="{{ route('admin.pendaftar.index', array_merge($queryParams, ['sort' => 'tgl_lahir', 'direction' => $sortDirection('tgl_lahir')])) }}" style="color:inherit;text-decoration:none;display:flex;align-items:center;gap:4px;">
              Tempat, Tgl Lahir <span style="font-size:10px;">{{ $sortIcon('tgl_lahir') }}</span>
            </a>
          </th>
          <th>
            <a href="{{ route('admin.pendaftar.index', array_merge($queryParams, ['sort' => 'nama_pendaftar', 'direction' => $sortDirection('nama_pendaftar')])) }}" style="color:inherit;text-decoration:none;display:flex;align-items:center;gap:4px;">
              Nama Orang Tua/Wali <span style="font-size:10px;">{{ $sortIcon('nama_pendaftar') }}</span>
            </a>
          </th>
          <th>Nomor HP</th>
          <th>Asal Sekolah</th>
          <th>
            <a href="{{ route('admin.pendaftar.index', array_merge($queryParams, ['sort' => 'created_at', 'direction' => $sortDirection('created_at')])) }}" style="color:inherit;text-decoration:none;display:flex;align-items:center;gap:4px;">
              Tgl Pendaftaran <span style="font-size:10px;">{{ $sortIcon('created_at') }}</span>
            </a>
          </th>
          <th>
            <a href="{{ route('admin.pendaftar.index', array_merge($queryParams, ['sort' => 'status_langkah', 'direction' => $sortDirection('status_langkah')])) }}" style="color:inherit;text-decoration:none;display:flex;align-items:center;gap:4px;">
              Status Pendaftaran <span style="font-size:10px;">{{ $sortIcon('status_langkah') }}</span>
            </a>
          </th>
          <th>Aksi</th>
        </tr>
      </thead>
      <tbody>
        @forelse($pendaftar as $i => $p)
        <tr>
          <td style="color:var(--gray-600);">{{ $pendaftar->firstItem() + $i }}</td>
          <td style="font-family:monospace;color:var(--gray-700);font-size:12px;font-weight:600;">{{ $p->id_user }}</td>
          <td>
            <div class="td-name">{{ $p->nama_anak ?? '—' }}</div>
          </td>
          <td style="font-family:monospace;color:var(--gray-600);font-size:12px;">{{ $p->nipsn_nss_nsm ?? '—' }}</td>
          <td style="font-family:monospace;color:var(--gray-600);font-size:12px;">{{ $p->nik ?? '—' }}</td>
          <td style="font-size:12px;color:var(--gray-600);">
            @if($p->tempat_lahir && $p->tgl_lahir)
              {{ $p->tempat_lahir }}, {{ \Carbon\Carbon::parse($p->tgl_lahir)->format('d M Y') }}
            @elseif($p->tgl_lahir_panjang)
              {{ $p->tgl_lahir_panjang }}
            @else
              —
            @endif
          </td>
          <td>
            <div class="td-name">{{ $p->nama_pendaftar }}</div>
            <div class="td-sub">{{ $p->email }}</div>
          </td>
          <td style="font-family:monospace;color:var(--gray-600);font-size:12px;">
            {{ $p->no_hp ?? '—' }}
          </td>
          <td style="font-size:12px;color:var(--gray-600);max-width:180px;overflow:hidden;text-overflow:ellipsis;">
            {{ $p->nama_sekolah_asal ?? '—' }}
          </td>
          <td style="font-size:12px;color:var(--gray-600);">
            {{ \Carbon\Carbon::parse($p->created_at)->format('d M Y') }}
          </td>
          <td>
            @php
              $smap = [
                'bayar_pendaftaran'=>['yellow','Bayar Formulir'],
                'verifikasi_pendaftaran'=>['yellow','Verifikasi Bayar'],
                'isi_formulir'=>['blue','Isi Formulir'],
                'bayar_uang_pangkal'=>['yellow','Bayar Pangkal'],
                'verifikasi_uang_pangkal'=>['yellow','Verif. Pangkal'],
                'tes_online'=>['blue','Tes Online'],
                'tes_offline'=>['blue','Tes Offline'],
                'sesi_verifikasi'=>['purple','Sesi Verif'],
                'verifikasi_berkas'=>['yellow','Verif. Berkas'],
                'pemberkasan_akhir'=>['blue','Pemberkasan'],
                'selesai'=>['green','Selesai'],
              ];
              $step = $smap[$p->status_langkah ?? ''] ?? ['gray', ucfirst(str_replace('_', ' ', $p->status_langkah ?? ''))];
            @endphp
            <span class="badge badge-{{ $step[0] }}">{{ $step[1] }}</span>
          </td>
          <td>
            <div style="display:flex;gap:6px;flex-wrap:wrap;">
              <a href="{{ route('admin.pendaftar.detail', $p->id_user) }}" class="btn btn-outline btn-sm" title="Lihat Detail"><i data-lucide="eye" style="width:12px;height:12px;"></i> Lihat</a>
              <a href="{{ route('admin.pendaftar.detail', $p->id_user) }}" class="btn btn-primary btn-sm" title="Edit Data"><i data-lucide="edit" style="width:12px;height:12px;"></i> Edit</a>
            </div>
          </td>
        </tr>
        @empty
        <tr><td colspan="12" style="text-align:center;padding:40px;color:var(--gray-600);">Tidak ada data pendaftar</td></tr>
        @endforelse
      </tbody>
    </table>
  </div>
  <div style="padding:16px 20px;border-top:1px solid var(--gray-200);">
    {{ $pendaftar->withQueryString()->links() }}
  </div>
</div>

@endsection