@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="layers"></i> Data Blok
    </h4>

    <a href="/admin/blok/create" class="btn btn-custom btn-icon">
        <i data-feather="plus"></i> Tambah
    </a>
</div>

@if(session('success'))
<div class="alert alert-success">
    <i data-feather="check-circle"></i> {{ session('success') }}
</div>
@endif

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

    <div class="table-responsive">
        <table id="datatable" class="table table-modern align-middle">
            <thead>
                <tr>
                    <th>No</th>
                    <th>Nama Blok</th>
                    <th>SKS</th>
                    <th>Tahun Akademik</th>
                    <th width="120">Aksi</th>
                </tr>
            </thead>

            <tbody>
                @forelse($bloks as $key => $b)
                <tr>
                    <td>{{ $key+1 }}</td>

                    <td>
                        <span class="fw-semibold">{{ $b->nama_blok }}</span>
                    </td>

                    <td>
                        <span class="badge bg-primary">
                            {{ $b->sks }} SKS
                        </span>
                    </td>

                    <td>
                        @if($b->tahunAkademik)
                        <span class="badge bg-light text-dark">
                            {{ $b->tahunAkademik->tahun }} -
                            {{ ucfirst($b->tahunAkademik->semester) }}
                        </span>
                        @else
                        <span class="text-muted">-</span>
                        @endif
                    </td>

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

                            <a href="/admin/blok/edit/{{ $b->id }}" class="btn btn-sm btn-warning" title="Edit">
                                <i data-feather="edit"></i>
                            </a>

                            <a href="/admin/blok/delete/{{ $b->id }}" class="btn btn-sm btn-danger" title="Hapus"
                                onclick="return confirm('Yakin hapus?')">
                                <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],
            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