@extends('layouts.app')

@section('title', 'Audit Log')
@section('heading', 'Audit Log')

@section('content')
<div class="mx-auto max-w-5xl space-y-4">
    @include('settings.partials.nav', ['settingsActive' => 'audit'])

    <x-card class="!p-0 overflow-hidden">
        <div class="flex flex-wrap items-center justify-between gap-3 border-b border-slate-100 bg-slate-50/50 px-5 py-3">
            <div>
                <h2 class="text-sm font-semibold text-slate-800">Audit log</h2>
                <p class="text-xs text-slate-500">Sensitive actions across payroll, roles, HR, and finance</p>
            </div>
            <a href="{{ route('reports.audit.export', ['days' => $days]) }}" class="rounded-lg bg-slate-800 px-3 py-2 text-sm font-medium text-white hover:bg-slate-700">Export CSV</a>
        </div>
        <div class="p-5">
            <form method="get" class="mb-4 flex flex-wrap gap-3">
                <input type="number" name="days" value="{{ $days }}" min="1" max="365" class="w-24 rounded-lg border border-slate-300 px-3 py-2 text-sm" placeholder="Days">
                <input type="text" name="action" value="{{ request('action') }}" class="min-w-[180px] flex-1 rounded-lg border border-slate-300 px-3 py-2 text-sm" placeholder="Filter action">
                <button type="submit" class="rounded-lg border border-slate-300 bg-white px-4 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50">Apply</button>
            </form>

            <x-table>
                <x-slot name="head">
                    <tr>
                        <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">When</th>
                        <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">Actor</th>
                        <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">Action</th>
                        <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">Subject</th>
                        <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">IP</th>
                    </tr>
                </x-slot>
                @forelse($logs as $log)
                    <tr>
                        <td class="whitespace-nowrap px-4 py-3 text-sm text-slate-600">{{ $log->created_at?->format('d M Y H:i') }}</td>
                        <td class="px-4 py-3 text-sm text-slate-900">{{ $log->actor?->name ?? '—' }}</td>
                        <td class="px-4 py-3 text-sm font-mono text-slate-800">{{ $log->action }}</td>
                        <td class="px-4 py-3 text-sm text-slate-600">{{ $log->subject_type ? class_basename($log->subject_type) . ' #' . $log->subject_id : '—' }}</td>
                        <td class="px-4 py-3 text-sm text-slate-500">{{ $log->ip_address ?? '—' }}</td>
                    </tr>
                @empty
                    <tr><td colspan="5" class="px-4 py-8 text-center text-sm text-slate-500">No audit entries in this period.</td></tr>
                @endforelse
            </x-table>
            @if($logs->hasPages())<div class="mt-4">{{ $logs->links() }}</div>@endif
        </div>
    </x-card>
</div>
@endsection
