@extends('layouts.app')

@section('title', $canManage ? 'Warnings' : 'My Warnings')
@section('heading', $canManage ? 'Warnings' : 'My Warnings')

@section('content')
@if($canManage)
 @include('hr.top-submenu')
@endif

    <div class="mb-5 grid grid-cols-1 gap-4 sm:grid-cols-2 xl:grid-cols-4">
        <x-kpi-card
            :title="$canManage ? 'Total warnings' : 'My warnings'"
            :value="$kpis['total'] ?? 0"
            tone="{{ ($kpis['total'] ?? 0) > 0 ? 'warning' : 'positive' }}"
            accent="amber"
            :subtitle="$canManage ? 'Company disciplinary records' : 'Warnings on your file'"
        />
        <x-kpi-card title="High severity" :value="$kpis['high'] ?? 0" tone="critical" accent="rose" subtitle="High priority" />
        <x-kpi-card title="Medium severity" :value="$kpis['medium'] ?? 0" tone="warning" accent="orange" subtitle="Medium priority" />
        <x-kpi-card title="Low severity" :value="$kpis['low'] ?? 0" accent="slate" subtitle="Low priority" />
    </div>

    <x-card>
        <div class="mb-4 flex justify-between items-center">
            <p class="text-slate-600">
                @if($canManage)
                    Employee warnings and disciplinary records.
                @else
                    Warnings issued to you, including subject and severity.
                @endif
            </p>
            @if($canManage)
            <a href="{{ route('warnings.create') }}" class="inline-flex items-center rounded-lg bg-slate-800 px-4 py-2 text-sm font-medium text-white hover:bg-slate-700"><i class="bi bi-plus-lg me-1"></i>Add Warning</a>
            @endif
        </div>
        <x-table>
            <x-slot name="head">
                <tr>
                    @if($canManage)
                    <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">Employee</th>
                    @endif
                    <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">Description</th>
                    <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">Date</th>
                    <th class="px-4 py-3 text-left text-xs font-medium uppercase text-slate-500">Severity</th>
                </tr>
            </x-slot>
            @forelse($warnings as $w)
                <tr>
                    @if($canManage)
                    <td class="whitespace-nowrap px-4 py-3 text-sm text-slate-900">{{ $w->user?->name ?? '—' }}</td>
                    @endif
                    <td class="px-4 py-3 text-sm text-slate-900 font-medium">{{ $w->subject }}</td>
                    <td class="px-4 py-3 text-sm text-slate-600 max-w-md">{{ \Illuminate\Support\Str::limit((string) ($w->description ?? '—'), 120) }}</td>
                    <td class="whitespace-nowrap px-4 py-3 text-sm text-slate-600">{{ $w->warning_date?->format('M d, Y') }}</td>
                    <td class="whitespace-nowrap px-4 py-3 text-sm">
                        @php
                            $sevVariant = match ($w->severity) {
                                'high' => 'danger',
                                'low' => 'default',
                                default => 'warning',
                            };
                        @endphp
                        <x-badge :variant="$sevVariant">{{ ucfirst((string) $w->severity) }}</x-badge>
                    </td>
                </tr>
            @empty
                <tr><td colspan="{{ $canManage ? 5 : 4 }}" class="px-4 py-8 text-center text-sm text-slate-500">No warnings yet.</td></tr>
            @endforelse
        </x-table>
        @if($warnings->hasPages())<div class="mt-4">{{ $warnings->links() }}</div>@endif
    </x-card>
@endsection
