<?php require_once '../auth/cek_login.php';
require_role('admin');
include 'header.php';
$p = $conn->query('SELECT * FROM profil_sekolah LIMIT 1')->fetch_assoc();
$kelasList = $conn->query('SELECT DISTINCT kelas FROM siswa ORDER BY kelas');
$kelas = $_GET['kelas'] ?? '';
$where = $kelas ? "WHERE kelas='" . $conn->real_escape_string($kelas) . "'" : '';
$res = $conn->query("SELECT * FROM siswa $where ORDER BY kelas,nama LIMIT 8");
$siswa = [];
while ($r = $res->fetch_assoc()) $siswa[] = $r;
?>

<form class="filter-card" method="get">
  <div><label>Tahun Ajaran</label><select name="tahun" class="form-select">
      <option><?= e($p['tahun_pelajaran'] ?? '2025/2026') ?></option>
    </select></div>
  <div><label>Kelas</label><select name="kelas" class="form-select">
      <option value="">Semua Kelas</option><?php while ($k = $kelasList->fetch_assoc()): ?><option value="<?= e($k['kelas']) ?>" <?= $kelas == $k['kelas'] ? 'selected' : '' ?>><?= e($k['kelas']) ?></option><?php endwhile; ?>
    </select></div>
  <div><label>Pilih Siswa</label><select class="form-select">
      <option>Semua Siswa</option>
    </select></div>
  <div class="filter-actions"><button class="btn btn-primary"><i class="fa fa-eye"></i> Preview</button><a target="_blank" href="../cetak/kartu_massal.php<?= $kelas ? '?kelas=' . urlencode($kelas) : '' ?>" class="btn btn-success"><i class="fa fa-print"></i> Cetak / Export PDF</a><a target="_blank" href="../cetak/kartu_massal_potret.php<?= $kelas ? '?kelas=' . urlencode($kelas) : '' ?>" class="btn btn-info text-white"><i class="fa fa-id-card"></i> Cetak Potret</a></div>
</form>
<div class="sheet-preview preview-grid">
  <?php for ($i = 0; $i < 8; $i++):
    $s = $siswa[$i] ?? [
      'nama' => 'Nama Siswa',
      'nisn' => '-',
      'kelas' => '-',
      'no_ujian' => '2503000' . ($i + 1),
      'foto' => 'default.png',
      'tahun_pelajaran' => $p['tahun_pelajaran'] ?? '2025/2026'
    ];

    $namaSekolah = $p['nama_sekolah'] ?? 'SDN 3 Mekar Sari';
    $tahun = $s['tahun_pelajaran'] ?? ($p['tahun_pelajaran'] ?? '2025/2026');
    $logo = $p['logo'] ?? 'logo.png';
    $logoKabupaten = $p['logo_kabupaten'] ?? '';
    $foto = $s['foto'] ?? 'default.png';
  ?>
    <div class="preview-card">
      <div class="preview-head">
        <div class="preview-logo-wrap">
          <?php if (!empty($logoKabupaten)) : ?>
            <img src="../assets/uploads/<?= e($logoKabupaten) ?>" alt="Logo Kabupaten/Kota">
          <?php endif; ?>
          <img src="../assets/uploads/<?= e($logo) ?>" alt="Logo Sekolah">
        </div>
        <div>
          <h4><?= e($namaSekolah) ?></h4>
          <h3>KARTU UJIAN</h3>
          <span>TP <?= e($tahun) ?></span>
        </div>
      </div>

      <div class="preview-body">
        <img class="preview-photo" src="../assets/uploads/<?= e($foto) ?>">
        <div class="preview-info">
          <p><b>Nama</b> : <?= e($s['nama']) ?></p>
          <p><b>NISN</b> : <?= e($s['nisn']) ?></p>
          <p><b>Kelas</b> : <?= e($s['kelas']) ?></p>
          <p><b>No.</b> : <?= e($s['no_ujian']) ?></p>
        </div>
      </div>
    </div>
  <?php endfor; ?>
</div>
<style>
  .preview-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    padding: 12px;
    background: #fff;
    overflow: hidden;
  }

  .preview-card {
    height: 155px;
    border: 1px dashed #b8c7dc;
    border-radius: 8px;
    padding: 8px;
    box-sizing: border-box;
    background: white;
    overflow: hidden;
  }

  .preview-head {
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 4px;
    margin-bottom: 6px;
  }

  .preview-logo-wrap {
    display: flex;
    gap: 4px;
  }

  .preview-logo-wrap img {
    width: 32px;
    height: 32px;
    object-fit: contain;
  }

  .preview-head h4 {
    margin: 0;
    font-size: 13px;
    color: #002878;
    line-height: 1;
  }

  .preview-head h3 {
    margin: 2px 0;
    font-size: 15px;
    color: #003399;
    line-height: 1;
  }

  .preview-head span {
    display: inline-block;
    font-size: 10px;
    font-weight: bold;
    background: #ffd400;
    padding: 2px 8px;
  }

  .preview-body {
    display: flex;
    gap: 8px;
  }

  .preview-photo {
    width: 45px;
    height: 58px;
    object-fit: cover;
    border-radius: 4px;
  }

  .preview-info {
    font-size: 11px;
    line-height: 1.25;
    color: #0f172a;
  }

  .preview-info p {
    margin: 2px 0;
  }
</style>
<?php include 'footer.php'; ?>