@extends('admin.layout')

@section('content')

<!-- HEADER -->
<div class="d-flex justify-content-between align-items-center mb-3">
    <h4 class="mb-0">
        <i data-feather="users"></i> Data Mahasiswa
    </h4>

    <div class="d-flex gap-2">
        <a href="/admin/mahasiswa/tambah" class="btn btn-custom btn-icon">
            <i data-feather="plus"></i> Tambah
        </a>

        <a href="/admin/mahasiswa/import" class="btn btn-custom btn-icon">
            <i data-feather="download"></i>
        </a>

        <a href="/template_import_mahasiswa.xlsx" class="btn btn-success btn-icon">
            <i data-feather="upload"></i>
        </a>
    </div>
</div>

<!-- CARD TABLE -->
<div class="card-modern">

    <!-- DATATABLE HEADER -->
    <div class="d-flex justify-content-between align-items-center mb-2">
        <div>
            <small class="text-muted">Data Mahasiswa</small>
        </div>
    </div>

    <!-- TABLE -->
    <div class="table-responsive">
        <table id="datatable" class="table table-modern align-middle">
            <thead>
                <tr>
                    <th>No</th>
                    <th>NIM</th>
                    <th>Nama</th>
                    <th>Orang Tua</th>
                    <th>Prodi</th>
                    <th>Angkatan</th>
                    <th width="120">Aksi</th>
                </tr>
            </thead>
            <tbody>
                @forelse($data as $d)
                <tr>
                    <td>{{ $loop->iteration }}</td>

                    <td>
                        <span class="fw-semibold">{{ $d->nim }}</span>
                    </td>

                    <td>{{ $d->nama }}</td>

                    <td>
                        {{ $d->orangTua->nama ?? '-' }}
                    </td>

                    <td>
                        <span class="badge bg-light text-dark">
                            {{ $d->prodi }}
                        </span>
                    </td>

                    <td>{{ $d->angkatan }}</td>

                    <td>
                        <div class="d-flex gap-1">

                            <!-- EDIT -->
                            <a href="/admin/mahasiswa/edit/{{ $d->id }}" class="btn btn-warning btn-aksi">

                                <i data-feather="edit"></i>

                            </a>

                            <!-- HAPUS -->
                            <a href="/admin/mahasiswa/hapus/{{ $d->id }}" class="btn btn-danger btn-aksi"
                                onclick="return confirm('Yakin ingin menghapus data ini?')">

                                <i data-feather="trash-2"></i>

                            </a>

                        </div>
                    </td>
                </tr>
                @empty
                <tr>
                    <td colspan="6" class="text-center text-muted">
                        <i data-feather="inbox"></i><br>
                        Data belum ada
                    </td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>

</div>

@endsection

{{-- SCRIPT --}}
@section('scripts')
<script>
    $(document).ready(function() {
        $('#datatable').DataTable({
            pageLength: 10,
            lengthMenu: [5, 10, 25, 50, 100, 150, 200, 250, 300, 350],
            language: {
                search: "🔍 Cari:",
                lengthMenu: "Tampilkan _MENU_ data",
                zeroRecords: "Data tidak ditemukan",
                info: "Menampilkan _START_ - _END_ dari _TOTAL_ data",
                paginate: {
                    next: "›",
                    previous: "‹"
                }
            }
        });

        feather.replace()
    });
</script>
@endsection