@extends('layouts.app')
@section('title', ($workerType ?? 'locum') === 'volunteer' ? 'Volunteers' : 'Locum Register')
@section('content')
@php $isVolunteersView = ($workerType ?? 'locum') === 'volunteer'; @endphp
@include('locum.partials.payroll-tabs', ['active' => $isVolunteersView ? 'volunteers' : 'register'])

{{-- Type tabs (Locums | Volunteers) --}}
<div class="flex gap-2 mb-3">
    <a href="{{ route('locum.index') }}"
       class="px-3 py-1.5 rounded-lg text-xs font-semibold {{ !$isVolunteersView ? 'bg-cr-600 text-white' : 'bg-white border text-gray-600 hover:bg-gray-50' }}">
        Locums @if(isset($stats['paid_count'])) <span class="ml-1 opacity-75">({{ $stats['paid_count'] }})</span> @endif
    </a>
    <a href="{{ route('locum.index', ['worker_type' => 'volunteer']) }}"
       class="px-3 py-1.5 rounded-lg text-xs font-semibold {{ $isVolunteersView ? 'bg-purple-600 text-white' : 'bg-white border text-gray-600 hover:bg-gray-50' }}">
        Volunteers @if(isset($stats['volunteer_count'])) <span class="ml-1 opacity-75">({{ $stats['volunteer_count'] }})</span> @endif
    </a>
</div>

<div class="bg-white rounded-xl border border-gray-200 overflow-hidden">
    <div class="px-5 py-3 border-b flex flex-wrap items-center justify-between gap-3">
        <form method="GET" class="flex flex-wrap gap-2 items-end">
            <input type="hidden" name="worker_type" value="{{ $workerType }}">
            <input type="text" name="search" value="{{ request('search') }}" placeholder="Name, ID, phone, license..." class="form-input text-xs w-48">
            <select name="status" class="form-input text-xs w-32">
                @php $_sf = $statusFilter ?? 'active'; @endphp
                <option value="active"   {{ $_sf==='active'?'selected':'' }}>Active</option>
                <option value="inactive" {{ $_sf==='inactive'?'selected':'' }}>Inactive @if(($stats['inactive_count'] ?? 0) > 0)({{ $stats['inactive_count'] }})@endif</option>
                <option value="all"      {{ $_sf==='all'?'selected':'' }}>All statuses</option>
            </select>
            <select name="department_id" class="form-input text-xs w-36">
                <option value="">All Departments</option>
                @include('partials._department-options', ['selected' => request('department_id')])
            </select>
            <button class="btn-primary text-xs">Filter</button>
            @if(request()->hasAny(['search','status','department_id']))
                <a href="{{ route('locum.index', ['worker_type' => $workerType]) }}" class="btn-secondary text-xs">Clear</a>
            @endif
        </form>
        @if($isVolunteersView)
            <a href="{{ route('people.create', ['type' => 'volunteer']) }}" class="btn-success text-xs" style="background:#7c3aed">+ Register Volunteer</a>
        @else
            <a href="{{ route('people.create', ['type' => 'locum']) }}" class="btn-success text-xs">+ Register Locum</a>
        @endif
    </div>

    <table class="w-full">
        <thead class="bg-gray-50"><tr>
            <th class="table-header">{{ $isVolunteersView ? 'Volunteer No.' : 'Staff No.' }}</th>
            <th class="table-header">Name</th>
            <th class="table-header">Role</th>
            <th class="table-header">Department</th>
            <th class="table-header">License</th>
            <th class="table-header">Phone</th>
            @if(!$isVolunteersView && Auth::user()->activeRoleName() !== 'Receptionist')
            <th class="table-header">Rate</th>
            @endif
            <th class="table-header">Actions</th>
        </tr></thead>
        <tbody class="divide-y divide-gray-50">
        @forelse($locums as $locum)
            @php $rowIsVol = ($locum->worker_type ?? 'locum') === 'volunteer'; @endphp
            <tr class="hover:bg-blue-50/30 {{ $locum->is_license_expired ? 'bg-red-50/30' : '' }}">
                <td class="table-cell font-mono text-xs {{ $rowIsVol ? 'text-purple-700' : 'text-cr-700' }} font-semibold">{{ $locum->staff_number ?? '-' }}</td>
                <td class="table-cell">
                    <a href="{{ route('locum.show', $locum) }}" class="text-sm font-medium {{ $rowIsVol ? 'text-purple-700' : 'text-cr-700' }} hover:underline">{{ $locum->full_name }}</a>
                    @if($rowIsVol)<span class="ml-1 text-[10px] font-bold text-purple-700 bg-purple-100 px-1 rounded align-middle">V</span>@endif
                </td>
                <td class="table-cell text-xs">{{ $locum->role_designation ?? '-' }}</td>
                <td class="table-cell text-xs">{{ $locum->department->name ?? '-' }}</td>
                <td class="table-cell text-xs">
                    @if($locum->license_no)
                        <span>{{ $locum->license_no }}</span>
                        @if($locum->license_expiry)
                            <br>
                            @if($locum->is_license_expired)
                                <span class="badge badge-danger text-xs">Expired {{ $locum->license_expiry->format('d M Y') }}</span>
                            @elseif($locum->is_license_expiring_soon)
                                <span class="badge badge-warning text-xs">Exp {{ $locum->license_expiry->format('d M Y') }}</span>
                            @else
                                <span class="text-xs text-gray-400">Exp {{ $locum->license_expiry->format('d M Y') }}</span>
                            @endif
                        @endif
                    @else
                        —
                    @endif
                </td>
                <td class="table-cell text-xs">{{ $locum->phone ?? '-' }}</td>
                @if(!$isVolunteersView && Auth::user()->activeRoleName() !== 'Receptionist')
                <td class="table-cell text-xs font-semibold">
                    @if($locum->rate_type==='percentage'){{ $locum->default_rate }}%@else KES {{ number_format($locum->default_rate) }}/shift @endif
                </td>
                @endif
                <td class="table-cell">
                    <div class="flex gap-1 flex-wrap">
                        <a href="{{ route('locum.show', $locum) }}" class="text-xs text-cr-600 bg-cr-50 px-2 py-1 rounded hover:bg-cr-100">View</a>
                        <a href="{{ route('locum.edit', $locum) }}" class="text-xs text-gray-500 bg-gray-100 px-2 py-1 rounded hover:bg-gray-200">Edit</a>
                        <form method="POST" action="{{ route('locum.toggle-status', $locum) }}" class="inline">@csrf @method('PUT')
                            <button class="text-xs {{ $locum->status==='active' ? 'text-red-500' : 'text-green-600' }} bg-gray-100 px-2 py-1 rounded hover:bg-gray-200">{{ $locum->status==='active' ? 'Deactivate' : 'Activate' }}</button>
                        </form>
                        {{-- Convert buttons (locum↔volunteer, locum→staff) live on
                             the Edit page only — keeping the table row clean. --}}
                    </div>
                </td>
            </tr>
        @empty
            <tr>
                <td colspan="{{ (!$isVolunteersView && Auth::user()->activeRoleName() !== 'Receptionist') ? 8 : 7 }}" class="table-cell text-center text-gray-400 py-10">
                    No {{ $isVolunteersView ? 'volunteers' : 'locums' }} registered yet. Click "+ Register {{ $isVolunteersView ? 'Volunteer' : 'Locum' }}" to add.
                </td>
            </tr>
        @endforelse
        </tbody>
    </table>
    @if($locums->hasPages())<div class="px-4 py-3 border-t bg-gray-50">{{ $locums->links() }}</div>@endif
</div>
@endsection