<?= $this->extend('layout/admin') ?>
<?= $this->section('content') ?>

<div class="card shadow-sm">
    <div class="card-header d-flex justify-content-between align-items-center bg-success text-white">
        <b>Master Rombel</b>

        <a href="<?= site_url('master/rombel/create') ?>" 
           class="btn btn-warning btn-sm text-dark fw-bold shadow-sm">
            <i class="fas fa-plus me-1"></i> Tambah Rombel
        </a>
    </div>

    <div class="card-body">
        <table id="dt_rombel" class="table table-bordered table-striped w-100">
            <thead class="table-dark">
                <tr>
                    <th width="50">No</th>
                    <th>Kelas</th>
                    <th>Nama Rombel</th>
                    <th>Wali Kelas</th>
                    <th width="200">Aksi</th>
                </tr>
            </thead>
        </table>
    </div>
</div>

<?= $this->endSection() ?>

<?= $this->section('scripts') ?>
<script>
$(function () {
    $('#dt_rombel').DataTable({
        processing: true,
        serverSide: true,
        ajax: {
            url: "<?= site_url('master/rombel/data') ?>",
            type: "GET"
        },
        columns: [
            { 
                data: "id", 
                render: (d, t, r, m) => m.row + 1 
            },
            { data: "nama_kelas" },   // join dari tabel kelas
            { data: "nama_rombel" },  // contoh: 1A
            { data: "wali_kelas" },
            {
                data: "id",
                orderable: false,
                render: function (id) {
                    return `
                        <div class="btn-group">
                            <a href="<?= site_url('master/rombel/view') ?>/${id}"
                               class="btn btn-sm btn-info">View</a>

                            <a href="<?= site_url('master/rombel/edit') ?>/${id}"
                               class="btn btn-sm btn-warning text-white">Edit</a>

                            <a href="<?= site_url('master/rombel/delete') ?>/${id}"
                               onclick="return confirm('Yakin hapus rombel ini?')"
                               class="btn btn-sm btn-danger">Hapus</a>
                        </div>
                    `;
                }
            }
        ]
    });
});
</script>
<?= $this->endSection() ?>
