<?php include __DIR__ . '/../../views/layouts/header.php'; ?>
<div class="wrapper">
<?php include __DIR__ . '/../../views/layouts/sidebar.php'; ?>
<div class="main-content">
<?php include __DIR__ . '/../../views/layouts/topbar.php'; ?>

<div class="page-content">
  <div class="page-header">
    <h1><i class="bi bi-file-earmark-excel me-2 text-success"></i>Import Nilai Rapor dari Excel</h1>
    <nav aria-label="breadcrumb">
      <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="<?= BASE_URL ?>/index.php?page=nilai">Nilai Rapor</a></li>
        <li class="breadcrumb-item active">Import Excel</li>
      </ol>
    </nav>
  </div>

  <?php if ($flash): ?>
  <div class="alert alert-<?= $flash['type'] ?> alert-dismissible alert-auto-dismiss fade show">
    <i class="bi bi-check-circle-fill me-2"></i><?= e($flash['message']) ?>
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
  </div>
  <?php endif; ?>

  <?php if (!empty($errors)): ?>
  <div class="alert alert-danger">
    <?php foreach ($errors as $err): ?><div><i class="bi bi-x-circle me-1"></i><?= e($err) ?></div><?php endforeach; ?>
  </div>
  <?php endif; ?>

  <div class="row g-3">

    <!-- STEP 1: Download Template -->
    <div class="col-12">
      <div class="card" style="border-color:#2563eb;">
        <div class="card-header" style="background:#2563eb;color:#fff;">
          <h6 class="mb-0"><i class="bi bi-1-circle-fill me-2"></i>Step 1 — Download Template Excel</h6>
        </div>
        <div class="card-body">
          <p class="text-muted mb-3" style="font-size:.875rem;">
            Pilih kelas dan semester, download template. Template berisi daftar siswa dan
            <strong>satu kolom nilai rapor per mata pelajaran</strong>.
          </p>
          <form method="GET" action="<?= BASE_URL ?>/index.php" class="row g-2 align-items-end">
            <input type="hidden" name="page" value="nilai_template">
            <div class="col-12 col-md-3">
              <label class="form-label">Kelas <span class="text-danger">*</span></label>
              <select class="form-select" name="kelas_id" required>
                <option value="">-- Pilih Kelas --</option>
                <?php foreach ($kelasList as $k): ?>
                <option value="<?= $k['id'] ?>" <?= $kelasId == $k['id'] ? 'selected' : '' ?>>
                  <?= e($k['nama_kelas']) ?>
                </option>
                <?php endforeach; ?>
              </select>
            </div>
            <div class="col-12 col-md-3">
              <label class="form-label">Semester</label>
              <select class="form-select" name="semester_no">
                <?php foreach ($semesterList as $no => $label): ?>
                <option value="<?= $no ?>" <?= $semesterNo == $no ? 'selected' : '' ?>>
                  <?= e($label) ?>
                </option>
                <?php endforeach; ?>
              </select>
            </div>
            <div class="col-12 col-md-3">
              <label class="form-label">Tahun Ajaran</label>
              <input type="text" class="form-control" name="tahun_ajaran"
                     value="<?= e($tahunAjaran) ?>" placeholder="2024/2025">
            </div>
            <div class="col-12 col-md-3">
              <button type="submit" class="btn btn-success w-100">
                <i class="bi bi-download me-1"></i> Download Template
              </button>
            </div>
          </form>

          <!-- Contoh format -->
          <div class="mt-3 p-3 rounded" style="background:#f0fdf4;border:1px solid #bbf7d0;font-size:.82rem;">
            <strong style="color:#15803d;"><i class="bi bi-table me-1"></i>Format Template:</strong><br>
            <span style="color:#166534;">
              <code>No | NIS | Nama Siswa | Matematika | Bahasa Indonesia | IPA | IPS | ...</code><br>
              Satu kolom = satu mata pelajaran (nama lengkap) = satu nilai rapor (0–100)
            </span>
          </div>
        </div>
      </div>
    </div>

    <!-- STEP 2: Upload -->
    <div class="col-12 col-lg-6">
      <div class="card" style="border-color:#d97706;">
        <div class="card-header" style="background:#fef9c3;">
          <h6 class="mb-0" style="color:#92400e;">
            <i class="bi bi-2-circle-fill me-2"></i>Step 2 — Isi Nilai, lalu Upload
          </h6>
        </div>
        <div class="card-body">
          <div class="alert alert-warning py-2 px-3 mb-3" style="font-size:.82rem;">
            <i class="bi bi-exclamation-triangle me-1"></i>
            Jangan ubah baris header dan kolom No/NIS/Nama.
            Isi nilai <strong>0–100</strong>. Kosongkan jika belum ada.
          </div>

          <form method="POST" enctype="multipart/form-data">
            <input type="hidden" name="csrf_token" value="<?= e($csrfToken) ?>">
            <div class="row g-2 mb-3">
              <div class="col-md-6">
                <label class="form-label">Kelas <span class="text-danger">*</span></label>
                <select class="form-select" name="kelas_id" required>
                  <option value="">-- Pilih Kelas --</option>
                  <?php foreach ($kelasList as $k): ?>
                  <option value="<?= $k['id'] ?>" <?= $kelasId == $k['id'] ? 'selected' : '' ?>>
                    <?= e($k['nama_kelas']) ?>
                  </option>
                  <?php endforeach; ?>
                </select>
              </div>
              <div class="col-md-6">
                <label class="form-label">Semester</label>
                <select class="form-select" name="semester_no">
                  <?php foreach ($semesterList as $no => $label): ?>
                  <option value="<?= $no ?>" <?= $semesterNo == $no ? 'selected' : '' ?>>
                    Semester <?= $no ?>
                  </option>
                  <?php endforeach; ?>
                </select>
              </div>
              <div class="col-md-6">
                <label class="form-label">Tahun Ajaran</label>
                <input type="text" class="form-control" name="tahun_ajaran"
                       value="<?= e($tahunAjaran) ?>">
              </div>
              <div class="col-md-6">
                <label class="form-label">File CSV <span class="text-danger">*</span></label>
                <input type="file" class="form-control" name="file" accept=".csv" required>
              </div>
            </div>
            <div class="d-flex gap-2">
              <button type="submit" class="btn btn-primary flex-fill">
                <i class="bi bi-upload me-1"></i> Import Nilai
              </button>
              <a href="<?= BASE_URL ?>/index.php?page=nilai" class="btn btn-outline-secondary">Batal</a>
            </div>
          </form>
        </div>
      </div>
    </div>

    <!-- Panduan -->
    <div class="col-12 col-lg-6">
      <div class="card h-100">
        <div class="card-header">
          <h6 class="mb-0"><i class="bi bi-question-circle me-2 text-info"></i>Panduan</h6>
        </div>
        <div class="card-body">
          <ol style="font-size:.875rem;" class="ps-3">
            <li class="mb-2">Download template sesuai kelas & semester</li>
            <li class="mb-2">Buka dengan <strong>Microsoft Excel</strong> atau Google Sheets</li>
            <li class="mb-2">Isi nilai rapor (0–100) untuk setiap siswa dan mata pelajaran</li>
            <li class="mb-2">Simpan: <strong>File → Save As → CSV UTF-8</strong></li>
            <li class="mb-2">Upload di Step 2</li>
          </ol>

          <div class="p-3 rounded mt-2" style="background:#eff6ff;border:1px solid #bfdbfe;font-size:.82rem;">
            <strong style="color:#1d4ed8;"><i class="bi bi-info-circle me-1"></i>Predikat Otomatis:</strong><br>
            <span style="color:#1e40af;">
              A = 90–100 &nbsp;|&nbsp; B = 80–89 &nbsp;|&nbsp; C = 70–79 &nbsp;|&nbsp; D = &lt;70
            </span>
          </div>

          <div class="mt-3">
            <strong style="font-size:.85rem;">6 Semester:</strong>
            <div class="row g-1 mt-1">
              <?php foreach ($semesterList as $no => $label): ?>
              <div class="col-12">
                <div class="d-flex align-items-center gap-2 p-2 rounded"
                     style="background:#f8fafc;border:1px solid #e2e8f0;font-size:.78rem;">
                  <span class="badge bg-primary" style="min-width:28px;">Smt <?= $no ?></span>
                  <span><?= e($label) ?></span>
                </div>
              </div>
              <?php endforeach; ?>
            </div>
          </div>
        </div>
      </div>
    </div>

  </div>
</div>

<?php include __DIR__ . '/../../views/layouts/footer.php'; ?>
</div>
</div>
