@extends('layouts.admin')

@section('title', 'Maintenance Requests')

@section('content')
    <x-page-header
        title="Maintenance Requests"
        :breadcrumbs="[
            ['label' => 'Admin', 'href' => route('admin.dashboard')],
            ['label' => 'Approvals'],
            ['label' => 'Maintenance Requests'],
        ]"
        subtitle="Review and approve or reject maintenance requests."
    />

    <x-card class="mb-4" padding="p-5">
        <form method="GET" class="flex flex-col sm:flex-row gap-3 sm:items-end sm:justify-between">
            <div class="w-full sm:max-w-xs">
                <label class="text-xs font-medium text-zinc-600">Status</label>
                <select name="status" class="mt-1 w-full h-10 rounded-xl border-zinc-300 focus:border-indigo-500 focus:ring-indigo-500">
                    @foreach (['pending','approved','rejected','completed'] as $s)
                        <option value="{{ $s }}" @selected($status === $s)>{{ ucfirst($s) }}</option>
                    @endforeach
                </select>
            </div>
            <div class="flex gap-2">
                <x-button type="submit" variant="secondary">Apply</x-button>
            </div>
        </form>
    </x-card>

    <x-table-wrapper>
        <table class="min-w-full text-sm">
            <thead class="text-xs font-semibold uppercase tracking-wider text-zinc-500 bg-zinc-50">
                <tr>
                    <th class="text-left px-4 py-3">Request</th>
                    <th class="text-left px-4 py-3">Equipment</th>
                    <th class="text-left px-4 py-3">Description</th>
                    <th class="text-left px-4 py-3">Status</th>
                    <th class="text-right px-4 py-3">Actions</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-zinc-100">
                @forelse ($requests as $r)
                    @php($state = $r->status?->value ?? (string) $r->status)
                    <tr class="hover:bg-zinc-50/60">
                        <td class="px-4 py-3 whitespace-nowrap">
                            <div class="font-medium text-zinc-900">#{{ $r->id }}</div>
                            <div class="text-xs text-zinc-500">{{ optional($r->created_at)->format('d M Y, H:i') }}</div>
                        </td>
                        <td class="px-4 py-3 text-zinc-900 whitespace-nowrap">
                            {{ $r->equipment?->name ?? $r->equipment_name ?? '-' }}
                        </td>
                        @php($desc = $r->description ?? $r->issue_description ?? '-')
                        <td class="px-4 py-3 text-zinc-900 max-w-xl">
                            <div class="truncate" title="{{ $desc }}">{{ $desc }}</div>
                        </td>
                        <td class="px-4 py-3 whitespace-nowrap">
                            <x-status-badge :value="$state" :label="ucfirst($state)" />
                        </td>
                        <td class="px-4 py-3 text-right">
                            @if ($state === 'pending')
                                <div class="inline-flex items-center justify-end gap-2">
                                    <form method="POST" action="{{ route('admin.approvals.maintenance-requests.approve', $r) }}">
                                        @csrf
                                        @method('PUT')
                                        <x-button type="submit" size="sm">Approve</x-button>
                                    </form>
                                    <form method="POST" action="{{ route('admin.approvals.maintenance-requests.reject', $r) }}" onsubmit="return confirm('Reject this request?');">
                                        @csrf
                                        @method('PUT')
                                        <x-button type="submit" size="sm" variant="danger">Reject</x-button>
                                    </form>
                                </div>
                            @else
                                <span class="text-xs text-zinc-500">No actions</span>
                            @endif
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="5" class="px-4 py-10 text-center text-zinc-500">No requests found.</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </x-table-wrapper>

    <div class="mt-4">
        {{ $requests->links() }}
    </div>
@endsection