@extends('layouts.admin')

@section('pageTitle', isset($pageTitle) ? $pageTitle : '')

@section('breadcrumb')
    @include('admin.partials.crumb', [
        'crumbs' => [
            route('admin.dashboard') => __('default.dashboard'),
            route('admin.student.sessions') => 'Acara',
            '#' => isset($pageTitle) ? $pageTitle : '',
        ],
    ])
@endsection

@section('content')
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                <div>
                    <a class="btn btn-success btn-sm float-right" href="{{ adminUrl(array('controller'=>'session','action'=>'addgroup')) }}"><i class="fa fa-plus"></i> {{ __lang('add-category') }}</a>
                    <br />
                    <br />
                    <div class="card table-responsive">
                        <table id="kategori-table" class="table">
                            <thead>
                                <tr>
                                    <th>No</th>
                                    <th>Nama</th>
                                    <th>Status</th>
                                    <th>Tindakan</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($categories as $index => $category)
                                    <tr>
                                        <td>{{ $index + 1 }}</td>
                                        <td>{{ $category->name }}</td>
                                        <td>{!! $category->actions !!}</td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('footer')
<script>
    $(document).ready(function() {
        var table = $('#kategori-table').DataTable({
            processing: true,
            serverSide: true,
            ajax: "{{ route('admin.session.groups') }}",
            columns: [
                { data: null, name: 'id', searchable: false },
                { data: 'name', name: 'name' },
                { data: 'status', name: 'status', orderable: false, searchable: false },
                { data: 'actions', name: 'actions', orderable: false, searchable: false },
            ],
            rowId: 'id',
            bLengthChange: false,
            bInfo: false,
            mark: {
                className: 'mark'
            },
        });

        // Mengatur nomor baris secara otomatis
        table.on('draw.dt', function() {
            var PageInfo = table.page.info(); // Corrected DataTable ID
            table.column(0, { page: 'current' }).nodes().each(function(cell, i) {
                cell.innerHTML = i + 1 + PageInfo.start;
            });
        });
    });
</script>
@endsection