<?= $this->session->flashdata('pesan'); ?>
<div class="card">
    <div class="card-header d-flex justify-content-between align-items-center w-100">
        <h3 class="card-title mb-1" style="margin-top: 5px;">Halaman Pelanggaran Santri</h3>
        <div class="ml-auto">
            <a href="<?= base_url('PelanggaranSantri/tambah') ?>" class="btn btn-success btn-sm custom-button">
                Tambah Pelanggaran Santri
            </a>
            <button class="btn btn-info btn-sm custom-button" data-toggle="modal" data-target="#modalFilterPrintPelanggaran">
                <i class="fas fa-print"></i> Print
            </button>
            <button class="btn btn-success btn-sm custom-button" data-toggle="modal" data-target="#modalFilterPdfPelanggaran">
                <i class="fas fa-file"></i> Cetak PDF
            </button>
            <a href="<?= base_url('PelanggaranSantri/rekap_pdf') ?>" class="btn btn-info btn-sm custom-button">
                Rekap Pelanggaran
            </a>
        </div>
    </div>
    <!-- /.card-header -->
    <?php
    $kelas_diniyah = [
        1 => 'Al-Wadhih Banin',
        2 => 'Al-Wadhih Banat',
        3 => 'Al-Jurūmiyyah Banin',
        4 => 'Al-Jurūmiyyah Banat',
        5 => 'Al-Imriti Banin',
        6 => 'Al-Imriti Banat',
        7 => 'Alfiyah Ula Banin',
        8 => 'Alfiyah Ula Banat',
        9 => 'Alfiyah Tsani Banin',
        10 => 'Alfiyah Tsani Banat',
        11 => 'Alfiyah Tsalits Banin',
        12 => 'Alfiyah Tsalits Banat'
    ];
    ?>
    <div class="card-body">
        <table id="tb_santri" class="table table-bordered table-striped">
            <thead>
                <tr class="text-center">
                    <th>No</th>
                    <th>NIS</th>
                    <th>Nama Santri</th>
                    <th>Kelas Diniah</th>
                    <th>Kategori Pelanggaran</th>
                    <th>Tanggal</th>
                    <th>Sanksi</th>
                    <th>Keterangan</th>
                    <th>Aksi</th>
                </tr>
            </thead>
            <tbody>
                <?php $no = 1;
                foreach ($pelanggaransantri as $pgnstr) : ?>
                    <tr class="text-center">
                        <td><?= $no++ ?></td>
                        <td><?= $pgnstr->NIS ?></td>
                        <td><?= $pgnstr->nama_santri ?></td>
                        <td><?= $kelas_diniyah[$pgnstr->kelas_diniyah] ?? 'Kelas Diniyah Tidak Valid' ?></td>
                        <td><?= $pgnstr->pelanggaran ?></td>
                        <td><?= date('d/m/Y', strtotime($pgnstr->tanggal)) ?></td>
                        <td><?= $pgnstr->sanksi ?></td>
                        <td><?= $pgnstr->keterangan ?></td>
                        <td>
                            <button data-toggle="modal" data-target="#edit<?= $pgnstr->id_pelanggaran_santri ?>" class="btn btn-warning btn-sm"><i class="fas fa-edit"></i></button>
                            <a href="<?= base_url('PelanggaranSantri/delete/' . $pgnstr->id_pelanggaran_santri) ?>" class="btn btn-danger btn-sm" onclick="return confirm('Apakah anda yakin menghapus data ini?')"><i class="fas fa-trash"></i></a>
                        </td>
                    </tr>
                <?php endforeach ?>
            </tbody>
        </table>
    </div>
</div>

<!-- Modal Filter Print Pelanggaran -->
<div class="modal fade" id="modalFilterPrintPelanggaran" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <form method="GET" action="<?= base_url('PelanggaranSantri/print') ?>" target="_blank">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="modalLabel">Filter Tanggal Pelanggaran</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Tutup">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label for="start_date">Dari Tanggal</label>
                        <input type="text" id="start_date" name="start_date" class="form-control" placeholder="dd/mm/yyyy" required>
                    </div>
                    <div class="form-group">
                        <label for="end_date">Sampai Tanggal</label>
                        <input type="text" id="end_date" name="end_date" class="form-control" placeholder="dd/mm/yyyy" required>
                    </div>
                </div>
                <div class="modal-footer">
                    <!-- Tombol print semua data tanpa filter -->
                    <a href="<?= base_url('PelanggaranSantri/print') ?>" target="_blank" class="btn btn-primary">
                        Print Semua
                    </a>
                    <!-- Tombol filter print berdasarkan tanggal -->
                    <button type="submit" class="btn btn-info">Print Sesuai Filter</button>
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Batal</button>
                </div>
            </div>
        </form>
    </div>
</div>

<!-- Modal Filter Pdf Pelanggaran -->
<div class="modal fade" id="modalFilterPdfPelanggaran" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <form method="GET" action="<?= base_url('PelanggaranSantri/pdf') ?>" target="_blank">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="modalLabel">Filter Tanggal Pelanggaran</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Tutup">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label for="start_date">Dari Tanggal</label>
                        <input type="text" id="start_date" name="start_date" class="form-control" placeholder="dd/mm/yyyy" required>
                    </div>
                    <div class="form-group">
                        <label for="end_date">Sampai Tanggal</label>
                        <input type="text" id="end_date" name="end_date" class="form-control" placeholder="dd/mm/yyyy" required>
                    </div>
                </div>
                <div class="modal-footer">
                    <!-- Tombol print semua data tanpa filter -->
                    <a href="<?= base_url('PelanggaranSantri/pdf') ?>" target="_blank" class="btn btn-primary">
                        Cetak PDF Semua
                    </a>
                    <!-- Tombol filter print berdasarkan tanggal -->
                    <button type="submit" class="btn btn-info">Cetak PDF Sesuai Filter</button>
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Batal</button>
                </div>
            </div>
        </form>
    </div>
</div>

<!-- Modal Edit -->
<?php foreach ($pelanggaransantri as $pgnstr) {
    $list_kelas_diniyah = [
        1 => 'Al-Wadhih Banin',
        2 => 'Al-Wadhih Banat',
        3 => 'Al-Jurūmiyyah Banin',
        4 => 'Al-Jurūmiyyah Banat',
        5 => 'Al-Imriti Banin',
        6 => 'Al-Imriti Banat',
        7 => 'Alfiyah Ula Banin',
        8 => 'Alfiyah Ula Banat',
        9 => 'Alfiyah Tsani Banin',
        10 => 'Alfiyah Tsani Banat',
        11 => 'Alfiyah Tsalits Banin',
        12 => 'Alfiyah Tsalits Banat'
    ];

    $kelas_terpilih = isset($pgnstr->kelas_diniyah) ? $pgnstr->kelas_diniyah : set_value('kelas_diniyah');
?>
    <div class="modal fade" id="edit<?= $pgnstr->id_pelanggaran_santri ?>" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Edit Pelanggaran Santri</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <form id="editPelanggaranSantriForm<?= $pgnstr->id_pelanggaran_santri ?>" action="<?= base_url('PelanggaranSantri/edit/' . $pgnstr->id_pelanggaran_santri) ?>" method="POST">
                        <input type="hidden" name="id_kegiatan" value="<?= $pgnstr->id_pelanggaran_santri ?>" data-default="<?= $pgnstr->id_pelanggaran_santri ?>">
                        <input type="hidden" name="id_santri" value="<?= $pgnstr->id_santri ?>"> <!-- ini penting -->
                        <div class="form-group">
                            <label>NIS</label>
                            <input type="text" name="NIS" class="form-control" value="<?= $pgnstr->NIS ?>">
                            <?= form_error('NIS', '<div class="text-small text-danger">', '</div>'); ?>
                        </div>
                        <div class="form-group">
                            <label>Nama Santri</label>
                            <input type="text" name="nama_santri" class="form-control" value="<?= $pgnstr->nama_santri ?>">
                            <?= form_error('nama_santri', '<div class="text-small text-danger">', '</div>'); ?>
                        </div>
                        <div class="form-group">
                            <label>Kelas Diniyah</label>
                            <select class="custom-select" name="kelas_diniyah">
                                <option value="">Pilih Kelas Diniah</option>
                                <?php foreach ($list_kelas_diniyah as $key => $label): ?>
                                    <option value="<?= $key ?>" <?= ($kelas_terpilih == $key) ? 'selected' : '' ?>>
                                        <?= $label ?>
                                    </option>
                                <?php endforeach; ?>
                            </select>
                            <?= form_error('kelas_diniyah', '<div class="text-small text-danger">', '</div>'); ?>
                        </div>
                        <div class="form-group">
                            <label>Pelanggaran</label>
                            <input type="text" name="pelanggaran" class="form-control" value="<?= $pgnstr->pelanggaran ?>">
                            <?= form_error('pelanggaran', '<div class="text-small text-danger">', '</div>'); ?>
                        </div>
                        <div class="form-group">
                            <label>Tanggal</label>
                            <input type="text" id="tanggal" name="tanggal" class="form-control"
                                value="<?= date('d/m/Y', strtotime($pgnstr->tanggal)) ?>">
                            <?= form_error('tanggal', '<div class="text-small text-danger">', '</div>'); ?>
                        </div>
                        <div class="form-group">
                            <label>Sanksi</label>
                            <input type="text" name="sanksi" class="form-control" value="<?= $pgnstr->sanksi ?>">
                            <?= form_error('sanksi', '<div class="text-small text-danger">', '</div>'); ?>
                        </div>
                        <div class="form-group">
                            <label>Keterangan</label>
                            <select name="keterangan" class="form-control">
                                <option value="">-- Pilih Keterangan --</option>
                                <option value="Belum Disanksi" <?= ($pgnstr->keterangan == 'Belum Disanksi') ? 'selected' : '' ?>>Belum Disanksi</option>
                                <option value="Sudah Disanksi" <?= ($pgnstr->keterangan == 'Sudah Disanksi') ? 'selected' : '' ?>>Sudah Disanksi</option>
                            </select>
                            <?= form_error('keterangan', '<div class="text-small text-danger">', '</div>'); ?>
                        </div>
                        <div class="modal-footer">
                            <button type="submit" class="btn btn-primary btn-sm"><i class="fas fa-save"></i> Simpan </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
<?php } ?>

<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
<script>
    flatpickr("#tanggal", {
        dateFormat: "d/m/Y" // Menampilkan dalam format dd/mm/yyyy
    });
    flatpickr("#start_date", {
        dateFormat: "d/m/Y" // Menampilkan dalam format dd/mm/yyyy
    });
    flatpickr("#end_date", {
        dateFormat: "d/m/Y" // Menampilkan dalam format dd/mm/yyyy
    });
</script>

<style>
    /* CSS untuk mengubah background dan border <th> dan <td> */
    /* Ubah warna border tabel menjadi hijau */
    table.table-bordered {
        border: 2px solid green;
        /* Border luar tabel */
    }

    /* Ubah warna background dan border header tabel */
    table.table-bordered th {
        background-color: #e0f7e0;
        /* Hijau muda untuk header */
        border: 1px solid green;
        /* Warna border hijau */
        color: #333;
        /* Warna teks */
    }

    /* Ubah warna background dan border sel tabel */
    table.table-bordered td {
        background-color: #f0fff0;
        /* Hijau sangat muda untuk sel */
        border: 1px solid green;
        /* Warna border hijau */
        color: #333;
        /* Warna teks */
    }

    .form-control:not([size]):not([multiple]) {
        background-image: none !important;
        /* Menghilangkan panah bawaan Bootstrap */
    }

    .custom-button {
        font-family: inherit;
        /* Mengikuti font dari parent */
        font-size: 0.9rem;
        /* Sesuaikan dengan font pada h3 */
        font-weight: bold;
        /* Jika judul pakai bold, tombol juga dibuat bold */
        text-transform: capitalize;
        /* Mengikuti format teks di judul */
        padding: 6px 13px;
        /* Sesuaikan padding agar proporsional */
    }

    .custom-btn {
        font-family: inherit;
        /* Mengikuti font dari parent */
        font-size: 0.9rem;
        /* Sesuaikan dengan font pada h3 */
        font-weight: bold;
        /* Jika judul pakai bold, tombol juga dibuat bold */
        text-transform: capitalize;
        /* Mengikuti format teks di judul */
        padding: 4px 10px;
        /* Sesuaikan padding agar proporsional */
    }

    /* Override panah sorting ganda */
    /* Hapus panah sorting bawaan template atau Bootstrap */
    table.dataTable thead .sorting:after,
    table.dataTable thead .sorting_asc:after,
    table.dataTable thead .sorting_desc:after {
        display: none !important;
    }
</style>

<script>
    $(document).ready(function() {
        $('#tb_santri').DataTable({
            "paging": true, // Enable pagination
            "lengthChange": true, // Allow user to change number of rows shown
            "searching": true, // Enable search
            "ordering": true, // Enable column sorting
            "info": true, // Show table info
            "autoWidth": false, // Disable auto column width adjustment
        });
    });
</script>