<div class="card shadow">

    <div class="card-header bg-dark text-white d-flex justify-content-between align-items-center">
        <b>Manajemen Pengguna</b>
        <a href="<?= site_url('admin/users/add') ?>" class="btn btn-success btn-sm">
            <i class="fas fa-user-plus"></i> Tambah Pengguna
        </a>
    </div>

    <div class="card-body">

        <table id="userTable" class="table table-bordered table-hover table-striped">
            <thead class="table-dark text-center">
            <tr>
                <th width="25%">Nama</th>
                <th>Email</th>
                <th>Role</th>
                <th width="12%">Status</th>
                <th width="12%">Aksi</th>
            </tr>
            </thead>

            <tbody>
            <?php foreach($users as $u): ?>
            <tr>
                <td><?= $u->name ?></td>
                <td><?= $u->email ?></td>
                <td><span class="badge bg-info"><?= $u->role_name ?></span></td>
                <td class="text-center">
                    <?= $u->status ? 
                        '<span class="badge bg-success">Aktif</span>' : 
                        '<span class="badge bg-danger">Nonaktif</span>' ?>
                </td>
                <td class="text-center">
                    <a href="<?= site_url('admin/users/edit/'.$u->id) ?>" class="btn btn-warning btn-sm">
                        ✏ Edit
                    </a>

                    <a href="<?= site_url('admin/users/delete/'.$u->id) ?>"
                       onclick="return confirm('Hapus pengguna ini?')"
                       class="btn btn-danger btn-sm">
                        🗑 Hapus
                    </a>
                </td>
            </tr>
            <?php endforeach ?>
            </tbody>
        </table>

    </div>
</div>

<script>
$(document).ready(function() {
    $('#userTable').DataTable({
        "pageLength": 10,
        "lengthMenu": [5,10,25,50,100],
        "language": {
            "search": "Cari:",
            "lengthMenu": "Tampilkan _MENU_ data",
            "zeroRecords": "Data tidak ditemukan",
            "info": "Menampilkan _START_ sampai _END_ dari _TOTAL_ data",
            "infoEmpty": "Tidak ada data",
            "paginate": {
                "first": "Awal",
                "last": "Akhir",
                "next": "→",
                "previous": "←"
            }
        }
    });
});
</script>
