@extends('layouts.app')
@section('title', 'Shift Entries')
@section('content')
@include('locum.partials.payroll-tabs', ['active' => 'shifts'])

<div class="bg-white rounded-xl border border-gray-200 overflow-hidden">
    {{-- Filter Bar --}}
    <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-center">
            <input type="text" name="search" value="{{ request('search') }}" placeholder="Locum name..." class="form-input text-xs w-40">
            <select name="status" class="form-input text-xs w-28">
                <option value="">All Status</option>
                @foreach(['draft','submitted','verified','approved','rejected'] as $st)
                <option value="{{ $st }}" {{ request('status')===$st?'selected':'' }}>{{ ucfirst($st) }}</option>
                @endforeach
            </select>
            <input type="date" name="date_from" value="{{ request('date_from') }}" class="form-input text-xs w-32 no-flatpickr" placeholder="From">
            <input type="date" name="date_to" value="{{ request('date_to') }}" class="form-input text-xs w-32 no-flatpickr" placeholder="To">
            <button class="btn-primary text-xs">Filter</button>
            @if(request()->hasAny(['search','status','date_from','date_to']))
                <a href="{{ route('locum.shifts') }}" class="btn-secondary text-xs">Clear</a>
            @endif
        </form>
        <a href="{{ route('locum.shifts.create') }}" class="btn-success text-xs">+ Record Shift</a>
    </div>

    {{-- Shifts Table --}}
    @php $activeRole = Auth::user()->activeRoleName(); @endphp
    <div class="overflow-x-auto">
    <table class="w-full">
        <thead class="bg-gray-50"><tr>
            <th class="table-header w-8"><input type="checkbox" onclick="toggleAll(this)" class="rounded"></th>
            <th class="table-header">Date</th>
            <th class="table-header">Locum</th>
            <th class="table-header">Shift</th>
            @if($activeRole !== 'Receptionist')
            <th class="table-header">Rate Type</th>
            <th class="table-header text-right">Rate</th>
            <th class="table-header text-center">Sessions</th>
            <th class="table-header text-right">Gross Pay</th>
            @endif
            <th class="table-header">Status</th>
            <th class="table-header">Actions</th>
        </tr></thead>
        <tbody class="divide-y divide-gray-50">
        @forelse($shifts as $s)
            @php $sc = ['draft'=>'badge-gray','submitted'=>'badge-info','verified'=>'badge-info','approved'=>'badge-success','rejected'=>'badge-danger'];
                 $hasSessions = $s->rate_type === 'percentage' && !empty($s->session_items);
                 $colCount = $activeRole !== 'Receptionist' ? 10 : 6;
            @endphp
            <tr class="hover:bg-blue-50/30 {{ in_array($s->approval_status, ['approved','rejected']) ? 'opacity-60' : '' }}">
                <td class="table-cell">
                    @if(in_array($s->approval_status, ['draft','submitted','verified']))
                        <input type="checkbox" name="shift_ids[]" value="{{ $s->id }}" form="bulk-submit-form" class="shift-cb rounded">
                    @else
                        <input type="checkbox" disabled class="rounded opacity-30" title="Already {{ $s->approval_status }}">
                    @endif
                </td>
                <td class="table-cell text-xs">{{ $s->work_date->format('d M Y') }}</td>
                <td class="table-cell">
                    <a href="{{ route('locum.show', $s->locum_id) }}" class="text-sm font-medium text-cr-700 hover:underline">{{ $s->locum->full_name ?? '' }}</a>
                </td>
                <td class="table-cell text-xs capitalize">{{ $s->shift_type }}</td>
                @if($activeRole !== 'Receptionist')
                <td class="table-cell text-xs capitalize">{{ $s->rate_type === 'percentage' ? 'Percentage' : 'Per Shift' }}</td>
                <td class="table-cell text-xs text-right">
                    @if($s->rate_type === 'percentage'){{ $s->rate_applied }}%@else KES {{ number_format($s->rate_applied) }}@endif
                </td>
                <td class="table-cell text-center">
                    @if($s->rate_type === 'percentage')
                        <button type="button" onclick="toggleSessions('sessions-{{ $s->id }}')"
                            class="badge badge-info cursor-pointer hover:opacity-80">
                            {{ $s->session_count ?? 1 }} session{{ ($s->session_count ?? 1) > 1 ? 's' : '' }}
                            <span class="ml-1 text-xs">▾</span>
                        </button>
                    @else
                        <span class="text-gray-300 text-xs">—</span>
                    @endif
                </td>
                <td class="table-cell text-xs text-right font-semibold">KES {{ number_format($s->gross_amount) }}</td>
                @endif
                <td class="table-cell"><span class="badge {{ $sc[$s->approval_status] ?? 'badge-gray' }}">{{ ucfirst($s->approval_status) }}</span></td>
                <td class="table-cell">
                    @php
                        $canDelete = $s->approval_status !== 'approved' && empty($s->payroll_batch_id);
                        $canEdit   = $s->approval_status !== 'approved' && empty($s->payroll_batch_id);
                    @endphp
                    <div class="flex gap-1 flex-wrap items-center">
                        @if($canEdit)
                            <a href="{{ route('locum.shifts.edit', $s) }}" title="Edit this shift entry"
                                class="inline-flex items-center justify-center w-7 h-7 text-blue-600 bg-blue-50 rounded hover:bg-blue-100 hover:text-blue-800 transition">
                                <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                                    <path stroke-linecap="round" stroke-linejoin="round" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/>
                                </svg>
                            </a>
                        @endif
                        @if(in_array($s->approval_status, ['submitted','verified']))
                            @if(in_array($activeRole, ['Super Admin', 'Hospital Admin']))
                            <form method="POST" action="{{ route('locum.shifts.approve', $s) }}">@csrf @method('PUT')
                                <button class="text-xs text-green-600 bg-green-50 px-2 py-1 rounded hover:bg-green-100">Approve</button>
                            </form>
                            <form method="POST" action="{{ route('locum.shifts.reject', $s) }}">@csrf @method('PUT')
                                <button class="text-xs text-red-500 bg-red-50 px-2 py-1 rounded hover:bg-red-100">Reject</button>
                            </form>
                            @else
                            <span class="text-xs text-blue-600 bg-blue-50 px-2 py-1 rounded">Awaiting Approval</span>
                            @endif
                        @endif
                        @if($s->approval_status === 'approved')
                            <span class="text-xs text-green-600">✓ Done</span>
                        @endif

                        {{-- Bin: delete a shift entry that is NOT yet approved (draft, submitted, verified, rejected) --}}
                        @if($canDelete)
                            <form method="POST" action="{{ route('locum.shifts.delete', $s) }}" class="inline">@csrf @method('DELETE')
                                <button type="submit" title="Delete this shift entry"
                                    onclick="return confirm('Delete this shift entry? This cannot be undone.')"
                                    class="inline-flex items-center justify-center w-7 h-7 text-red-500 bg-red-50 rounded hover:bg-red-100 hover:text-red-700 transition">
                                    <svg xmlns="http://www.w3.org/2000/svg" class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
                                        <path stroke-linecap="round" stroke-linejoin="round" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/>
                                    </svg>
                                </button>
                            </form>
                        @endif
                    </div>
                </td>
            </tr>
            {{-- Session breakdown row (percentage-based shifts only) --}}
            @if($hasSessions)
            <tr id="sessions-{{ $s->id }}" style="display:none;">
                <td colspan="{{ $colCount }}" class="px-6 py-3 bg-indigo-50/40 border-b border-indigo-100">
                    <p class="text-xs font-semibold text-indigo-700 mb-2">Session Breakdown — {{ $s->work_date->format('d M Y') }} · {{ $s->locum->full_name ?? '' }}</p>
                    <table class="w-full text-xs">
                        <thead><tr class="border-b border-indigo-100">
                            <th class="text-left py-1 pr-3 font-semibold text-gray-500">Procedure / Type</th>
                            <th class="text-left py-1 pr-3 font-semibold text-gray-500">Patient</th>
                            <th class="text-right py-1 pr-3 font-semibold text-gray-500">Billed (KES)</th>
                            @if($activeRole !== 'Receptionist')
                            <th class="text-right py-1 font-semibold text-gray-500">Locum Earns (KES)</th>
                            @endif
                        </tr></thead>
                        <tbody>
                        @foreach($s->session_items as $sess)
                        @php
                            $hasOverride = isset($sess['override_billed_amount']);
                        @endphp
                        <tr class="border-b border-indigo-50">
                            <td class="py-1 pr-3">
                                {{ $sess['imaging_type'] ?? '—' }}
                                @if(!empty($sess['is_anc_covered']))
                                    <span class="text-[10px] font-bold text-emerald-700 bg-emerald-100 px-1.5 py-0.5 rounded ml-1">ANC pkg</span>
                                @endif
                                @if(!empty($sess['is_unbilled']))
                                    <span class="text-[10px] font-bold text-rose-700 bg-rose-100 px-1.5 py-0.5 rounded ml-1" title="No invoice item exists for this scan. Verify with reception before approving.">⚠ NO INVOICE ITEM</span>
                                @endif
                                @if($hasOverride)
                                    <span class="text-[10px] font-bold text-amber-800 bg-amber-100 px-1.5 py-0.5 rounded ml-1" title="{{ $sess['override_reason'] ?? 'Admin override applied' }}">⚙ Override</span>
                                @endif
                                @if(!empty($sess['voided_after_verification']))
                                    <span class="text-[10px] font-bold text-rose-800 bg-rose-200 px-1.5 py-0.5 rounded ml-1" title="{{ $sess['voided_reason'] ?? 'Voided after sonographer verified' }}">⚠ VOIDED</span>
                                @endif
                            </td>
                            <td class="py-1 pr-3">{{ $sess['patient_name'] ?? '—' }}</td>
                            <td class="py-1 pr-3 text-right">
                                @if($hasOverride)
                                    <span class="text-[11px] text-gray-400 line-through">{{ number_format($sess['source_billed_amount'] ?? 0) }}</span>
                                    <span class="text-amber-800 font-semibold ml-1">{{ number_format($sess['billed_amount'] ?? 0) }}</span>
                                @else
                                    {{ number_format($sess['billed_amount'] ?? 0) }}@if(!empty($sess['is_unbilled']))<span class="text-rose-600 font-bold ml-1" title="Paid at fallback rate — invoice item missing">?</span>@endif
                                @endif
                            </td>
                            @if($activeRole !== 'Receptionist')
                            <td class="py-1 text-right font-semibold text-purple-700">{{ number_format($sess['locum_amount'] ?? 0) }}</td>
                            @endif
                        </tr>
                        @endforeach
                        @if($activeRole !== 'Receptionist')
                        <tr>
                            <td colspan="2" class="pt-2 text-right font-bold text-gray-600">Total</td>
                            <td class="pt-2 text-right font-bold">{{ number_format(collect($s->session_items)->sum('billed_amount')) }}</td>
                            <td class="pt-2 text-right font-bold text-purple-700">{{ number_format($s->gross_amount) }}</td>
                        </tr>
                        @endif
                        </tbody>
                    </table>
                </td>
            </tr>
            @endif
        @empty
            <tr><td colspan="{{ $colCount ?? 10 }}" class="table-cell text-center text-gray-400 py-10">No shift entries found.</td></tr>
        @endforelse
        </tbody>
    </table>
    </div>

    {{-- Bulk Actions --}}
    @if($shifts->count())
    <div class="px-5 py-3 border-t bg-gray-50 flex flex-wrap gap-2 items-center">
        <span class="text-xs text-gray-500">With selected:</span>
        <form method="POST" action="{{ route('locum.shifts.submit') }}" id="bulk-submit-form" class="inline">@csrf
            <button type="submit" class="btn-primary text-xs">Submit for Approval</button>
        </form>
        @if(in_array($activeRole, ['Super Admin', 'Hospital Admin']))
        <form method="POST" action="{{ route('locum.shifts.bulk-approve') }}" id="bulk-approve-form" class="inline">@csrf
            <button type="submit" class="btn-success text-xs" onclick="copyChecked('bulk-approve-form')">Bulk Approve</button>
        </form>
        @endif
    </div>
    @endif

    @if($shifts->hasPages())<div class="px-4 py-3 border-t">{{ $shifts->links() }}</div>@endif
</div>
@endsection
@section('scripts')
<script>
function toggleAll(el){ document.querySelectorAll('.shift-cb').forEach(cb=>cb.checked=el.checked); }
function toggleSessions(id) {
    const row = document.getElementById(id);
    if (row) row.style.display = row.style.display === 'none' ? 'table-row' : 'none';
}
function copyChecked(targetFormId){
    const form = document.getElementById(targetFormId);
    form.querySelectorAll('input[name="shift_ids[]"]').forEach(el=>el.remove());
    document.querySelectorAll('.shift-cb:checked').forEach(cb=>{
        const hidden = document.createElement('input');
        hidden.type='hidden'; hidden.name='shift_ids[]'; hidden.value=cb.value;
        form.appendChild(hidden);
    });
}
</script>
@endsection