<?php include_once __DIR__ . '/../layouts/head.php'; ?>
<div class="container py-4" style="max-width: 1350px; width: 100%;">
  <div class="row">
    <div class="col-lg-12">
      <div class="shadow-sm bg-white rounded overflow-hidden border">
        <div class="p-0">
          <div class="row px-0 m-0">

            <?php include_once __DIR__ . '/../layouts/menu_body.php'; ?>

            <div class="col-12 col-md-9 px-0">
              <div class="tab-content" id="v-pills-tabContent">
                <!-- wates -->
                <div class="tab-pane fade show active" id="v-pills-home" role="tabpanel" aria-labelledby="v-pills-home-tab">
                  <div class="p-4">
                    <div class="mb-4">
                      <h5 class="mb-0 fw-bold">Manajemen Data Gelombang Mahasiswa</h5>
                    </div>

                    <?php if (!empty($pesan)): ?>
                      <div class="alert alert-<?= $status_alert ?> alert-dismissible fade show" role="alert">
                        <?= htmlspecialchars($pesan) ?>
                        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                      </div>
                    <?php endif; ?>

                    <div class="container">
                      <div class="row mb-3">
                        <!-- Form Pencarian -->
                        <div class="col-md-6">
                          <form method="GET">
                            <div class="input-group">
                              <input type="text" class="form-control" placeholder="Cari nama atau NISN..." name="search" value="<?= htmlspecialchars($search ?? '') ?>">
                              <button class="btn btn-outline-primary" type="submit">Cari</button>
                            </div>
                          </form>
                        </div>
                      </div>

                      <table class="table table-bordered">
                        <thead>
                          <tr>
                            <th>No</th>
                            <th>Nama</th>
                            <th>NISN</th>
                            <th>Asal Sekolah</th>
                            <th>Gelombang</th>
                            <th>Tanggal</th>
                            <th>Aksi</th>
                          </tr>
                        </thead>
                        <tbody>
                          <?php if (!empty($data_pmb)): ?>
                            <?php foreach ($data_pmb as $index => $row): ?>
                              <tr>
                                <td><?= (isset($offset) ? (int)$offset : 0) + $index + 1 ?></td>
                                <td><?= htmlspecialchars($row['nama_camaba']) ?></td>
                                <td><?= htmlspecialchars($row['nisn']) ?></td>
                                <td><?= htmlspecialchars($row['asal_sekolah']) ?></td>
                                <td><?= htmlspecialchars($row['gelombang']) ?></td>
                                <td><?= htmlspecialchars($row['tanggal']) ?></td>
                                <td>
                                  <button 
                                    class="btn btn-sm btn-warning btn-edit-gelombang" 
                                    data-id="<?= $row['id_pmb'] ?>"
                                    data-gelombang="<?= htmlspecialchars($row['gelombang']) ?>"
                                    data-tanggal="<?= htmlspecialchars($row['tanggal']) ?>"
                                  >
                                    ✏️ Edit
                                  </button>
                                </td>
                              </tr>
                            <?php endforeach; ?>
                          <?php else: ?>
                            <tr><td colspan="7" class="text-center">Data tidak ditemukan</td></tr>
                          <?php endif; ?>
                        </tbody>
                      </table>

                      <nav>
                        <ul class="pagination justify-content-center">
                          <?php for($p = 1; $p <= $totalPages; $p++): ?>
                            <li class="page-item <?= ($page_no == $p) ? 'active' : '' ?>">
                              <a class="page-link" href="/dashboard/pegawai-ubah_gel_mhs?page_no=<?= $p ?>&search=<?= urlencode($search ?? '') ?>"><?= $p ?></a>
                            </li>
                          <?php endfor; ?>
                        </ul>
                      </nav>
                    </div>
                  </div>
                </div>

              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- Modal Edit Gelombang -->
<div class="modal fade" id="editGelombangModal" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <form method="POST" action="">
        <div class="modal-header">
          <h5 class="modal-title">Edit Gelombang & Tanggal</h5>
          <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
        </div>
        <div class="modal-body">
          <input type="hidden" name="id" id="editId">
          <div class="mb-3">
            <label for="editGelombang" class="form-label">Gelombang</label>
            <input type="text" name="gelombang" id="editGelombang" class="form-control" required>
          </div>
          <div class="mb-3">
            <label for="editTanggal" class="form-label">Tanggal</label>
            <input type="date" name="tanggal" id="editTanggal" class="form-control" required>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
          <button type="submit" class="btn btn-primary">Simpan</button>
        </div>
      </form>
    </div>
  </div>
</div>

<script>
  document.querySelectorAll('.btn-edit-gelombang').forEach(button => {
    button.addEventListener('click', function () {
      const id = this.dataset.id;
      const gelombang = this.dataset.gelombang;
      const tanggal = this.dataset.tanggal;

      document.getElementById('editId').value = id;
      document.getElementById('editGelombang').value = gelombang;
      document.getElementById('editTanggal').value = tanggal;

      const modal = new bootstrap.Modal(document.getElementById('editGelombangModal'));
      modal.show();
    });
  });
</script>

<?php include_once __DIR__ . '/../layouts/footer.php'; ?>
