@extends('layouts.default')

    @section('content')
<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <div class="card audit-card">
                <div class="card-header audit-header">
                    <h4 class="card-title mb-0">Audit Trail</h4>

                    <div class="audit-table-tools">
                        <select id="auditModuleFilter" class="audit-filter">
                            <option value="">All Modules</option>
                            <option value="Incident">Incidents</option>
                            <option value="Visitors">Visitors</option>
                            <option value="Users">Users</option>
                        </select>

                        <select id="auditActionFilter" class="audit-filter">
                            <option value="">All Actions</option>
                            <option value="CREATE">CREATE</option>
                            <option value="AUTO">EDIT</option>
                            <option value="APPROVE">APPROVE</option>
                            <option value="EXPORT">EXPORT</option>
                        </select>

                        <button type="button" id="auditExportButton" class="btn btn-primary btn-sm">
                            Export
                        </button>
                    </div>
                </div>

                <div class="table-responsive">
                    <table id="example5" class="table audit-table mb-0">
                        <thead>
                            <tr>
                                <th>TIMESTAMP</th>
                                <th>USER</th>
                                <th>ROLE</th>
                                <th>ACTION</th>
                                <th>MODULE</th>
                                <th>RECORD</th>
                                <th>IP / DEVICE</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>03 Sep 2026, 10:41</td>
                                <td>Hassan bin Osman</td>
                                <td><span class="badge badge-info light">GUARD</span></td>
                                <td><span class="badge badge-success light">CREATE</span></td>
                                <td>Incident</td>
                                <td>INC-000246</td>
                                <td>192.168.1.45</td>
                            </tr>
                            <tr>
                                <td>03 Sep 2026, 10:12</td>
                                <td>System</td>
                                <td><span class="badge badge-info light">SYSTEM</span></td>
                                <td><span class="badge badge-dark light">AUTO</span></td>
                                <td>Attendance</td>
                                <td>ATT-VG0042</td>
                                <td>System</td>
                            </tr>
                            <tr>
                                <td>03 Sep 2026, 09:58</td>
                                <td>Razif bin Mansor</td>
                                <td><span class="badge badge-info light">SUPERVISOR</span></td>
                                <td><span class="badge badge-primary light">APPROVE</span></td>
                                <td>Visitors</td>
                                <td>VIS-0091</td>
                                <td>192.168.1.12</td>
                            </tr>
                            <tr>
                                <td>03 Sep 2026, 09:45</td>
                                <td>Admira Sdn Bhd</td>
                                <td><span class="badge badge-info light">SPV ADMIN</span></td>
                                <td><span class="badge badge-success light">CREATE</span></td>
                                <td>Users</td>
                                <td>USR-0182</td>
                                <td>10.0.0.5</td>
                            </tr>
                            <tr>
                                <td>03 Sep 2026, 09:30</td>
                                <td>Finance Team</td>
                                <td><span class="badge badge-info light">FINANCE</span></td>
                                <td><span class="badge badge-secondary light">EXPORT</span></td>
                                <td>Billing</td>
                                <td>INV-0841</td>
                                <td>10.0.0.8</td>
                            </tr>
                            <tr>
                                <td>03 Sep 2026, 08:00</td>
                                <td>System</td>
                                <td><span class="badge badge-info light">SYSTEM</span></td>
                                <td><span class="badge badge-dark light">AUTO</span></td>
                                <td>Patrol</td>
                                <td>PAT-SCHED-003</td>
                                <td>System</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

    @push('scripts')
        <script>
            (function($) {

                var table = $('#example5').DataTable({
                    searching: false,
                    paging:true,
                    select: false,
                    //info: false,
                    lengthChange:false

                });
                $('#example tbody').on('click', 'tr', function () {
                    var data = table.row( this ).data();

                });

            })(jQuery);
        </script>
    @endpush