@extends('app')
@section('title_header', 'Log Kehadiran')
@section('header', 'Log Kehadiran')
@push('styles')
   
@endpush
@section('content')
    <div class="card card-outline card-info">
        <div class="card-header"></div>
        <div class="card-body">
            <table id="kehadiranTable" class="display table table-bordered" style="width:100%">
                <thead>
                    <tr>
                        <th style="width: 14px">#</th>
                        <th>Nama User</th>
                        <th>Judul Event</th>
                        <th>Status Kehadiran</th>
                    </tr>
                </thead>
                <tbody></tbody>
            </table>
        </div>
    </div>
@endsection
@push('scripts')
    <script>
        $(document).ready(function () {
            $('#kehadiranTable').DataTable({
                processing: true,
                serverSide: true,
                ajax: {
                    url: '/api/get/kehadiran',
                    type: 'GET',
                    headers: {
                        'Authorization': 'Bearer ' + token
                    }
                },
                columns: [
                    { data: 'DT_RowIndex', name: 'DT_RowIndex' },
                    { data: 'nama_user', name: 'nama_user' },
                    { data: 'judul_event', name: 'judul_event' },
                    { data: 'status_kehadiran', name: 'status_kehadiran' },
                ],
                order: [[1, 'asc']]
            });
        });
    </script>
@endpush