@extends('layouts.app')
@section('title', 'Locum Payroll | ' . $batch->batch_label)
@section('content')
{{-- Header --}}
<div class="bg-white rounded-xl border border-gray-200 p-5 mb-4 flex flex-wrap items-center justify-between gap-3">
    <div>
        <h2 class="text-lg font-bold text-gray-900">{{ $batch->batch_label }}</h2>
        <p class="text-xs text-gray-500">
            Period: {{ $batch->period_from?->format('d M Y') }} – {{ $batch->period_to?->format('d M Y') }}
            · Prepared by {{ $batch->preparedBy->name ?? '-' }} · {{ $batch->created_at->format('d M Y H:i') }}
            @if($batch->approvedBy) · Approved by {{ $batch->approvedBy->name }} on {{ $batch->approved_at->format('d M Y') }}@endif
        </p>
    </div>
    <div class="flex gap-2 items-center flex-wrap">
        @php $sc = ['draft'=>'badge-gray','approved'=>'badge-success','paid'=>'badge-success','cancelled'=>'badge-danger']; @endphp
        <span class="badge {{ $sc[$batch->status] ?? 'badge-gray' }}">{{ ucfirst($batch->status) }}</span>
        @if($batch->status === 'draft')
            <form method="POST" action="{{ route('locum.payroll.approve', $batch) }}">@csrf @method('PUT')
                <button class="btn-success text-xs" onclick="return confirm('Approve this payroll run? It will move to Payments.')">Approve Payroll</button>
            </form>
            <form method="POST" action="{{ route('locum.payroll.delete', $batch) }}">@csrf @method('DELETE')
                <button class="btn-danger text-xs" onclick="return confirm('Delete this run? Shifts will return to the unpaid pool.')">Delete Run</button>
            </form>
        @endif
        <button onclick="printPayroll()" class="btn-secondary text-xs">Print</button>
        <a href="{{ route('locum.payroll') }}" class="btn-secondary text-xs">← Back</a>
    </div>
</div>

{{-- Summary --}}
<div class="grid grid-cols-2 md:grid-cols-5 gap-3 mb-4">
    <div class="stat-card text-center"><p class="text-xs text-gray-400 uppercase">Locums</p><p class="text-xl font-bold">{{ $batch->items->count() }}</p></div>
    <div class="stat-card text-center"><p class="text-xs text-gray-400 uppercase">Total Shifts</p><p class="text-xl font-bold">{{ $batch->items->sum('total_shifts') }}</p></div>
    <div class="stat-card text-center"><p class="text-xs text-gray-400 uppercase">Gross Pay</p><p class="text-xl font-bold">KES {{ number_format($batch->items->sum('gross_pay')) }}</p></div>
    <div class="stat-card text-center" style="border-left:3px solid #ef4444"><p class="text-xs text-gray-400 uppercase">WHT (5%)</p><p class="text-xl font-bold text-red-600">KES {{ number_format($batch->items->sum('wht_amount')) }}</p></div>
    <div class="stat-card text-center" style="border-left:3px solid #22c55e"><p class="text-xs text-gray-400 uppercase">Net Pay</p><p class="text-xl font-bold text-green-600">KES {{ number_format($batch->items->sum('net_pay')) }}</p></div>
</div>

{{-- Payment Sheet --}}
<div class="bg-white rounded-xl border border-gray-200 overflow-hidden" id="payroll-table">
    <div class="px-5 py-3 border-b">
        <h3 class="text-sm font-bold text-gray-700">CLARA ROSA HOSPITAL | LOCUM PAYMENT SHEET</h3>
        <p class="text-xs text-gray-400">{{ $batch->batch_label }} · Employment Act, 2007 | KRA WHT Compliance</p>
    </div>
    <div class="overflow-x-auto">
    <table class="w-full">
        <thead class="bg-gray-50"><tr>
            <th class="table-header">S/No.</th>
            <th class="table-header">Full Name</th>
            <th class="table-header">ID No.</th>
            <th class="table-header">KRA PIN</th>
            <th class="table-header">Role</th>
            <th class="table-header text-right">Shifts</th>
            <th class="table-header text-right">Rate</th>
            <th class="table-header text-right">Gross (KES)</th>
            <th class="table-header text-right">WHT 5%</th>
            <th class="table-header text-right">Ded.</th>
            <th class="table-header text-right">Net Pay</th>
            <th class="table-header">Payment</th>
            @if($batch->status === 'draft')<th class="table-header">Adjust</th>@endif
        </tr></thead>
        <tbody class="divide-y divide-gray-50">
        @foreach($batch->items as $i => $item)
            <tr class="hover:bg-blue-50/30">
                <td class="table-cell text-xs text-center">{{ $i + 1 }}</td>
                <td class="table-cell text-sm font-medium"><a href="{{ route('locum.show', $item->locum_id) }}" class="text-cr-700 hover:underline">{{ $item->locum->full_name ?? '' }}</a></td>
                <td class="table-cell text-xs font-mono">{{ $item->locum->id_passport_no ?? '-' }}</td>
                <td class="table-cell text-xs font-mono">{{ $item->locum->kra_pin ?? '-' }}</td>
                <td class="table-cell text-xs">{{ $item->locum->role_designation ?? '-' }}</td>
                <td class="table-cell text-xs text-right">{{ $item->total_shifts }}</td>
                <td class="table-cell text-xs text-right">@if(($item->locum->rate_type ?? 'per_shift')==='percentage'){{ $item->rate_used }}%@else KES {{ number_format($item->rate_used) }}@endif</td>
                <td class="table-cell text-xs text-right font-semibold">{{ number_format($item->gross_pay) }}</td>
                <td class="table-cell text-xs text-right text-red-600">{{ number_format($item->wht_amount) }}</td>
                <td class="table-cell text-xs text-right">{{ $item->other_deductions > 0 ? number_format($item->other_deductions) : '-' }}</td>
                <td class="table-cell text-xs text-right font-bold text-green-700">{{ number_format($item->net_pay) }}</td>
                <td class="table-cell"><span class="badge {{ $item->payment_status==='paid'?'badge-success':'badge-warning' }} text-xs">{{ ucfirst($item->payment_status) }}</span></td>
                @if($batch->status === 'draft')
                <td class="table-cell">
                    <button onclick="openDeductionModal({{ $item->id }}, {{ $item->other_deductions }})" class="text-xs text-gray-500 bg-gray-100 px-2 py-1 rounded hover:bg-gray-200">Edit</button>
                </td>
                @endif
            </tr>
        @endforeach
        </tbody>
        <tfoot class="bg-gray-100 font-bold">
            <tr>
                <td colspan="5" class="table-cell text-xs text-right">TOTALS</td>
                <td class="table-cell text-xs text-right">{{ $batch->items->sum('total_shifts') }}</td>
                <td class="table-cell"></td>
                <td class="table-cell text-xs text-right">KES {{ number_format($batch->items->sum('gross_pay')) }}</td>
                <td class="table-cell text-xs text-right text-red-600">KES {{ number_format($batch->items->sum('wht_amount')) }}</td>
                <td class="table-cell text-xs text-right">KES {{ number_format($batch->items->sum('other_deductions')) }}</td>
                <td class="table-cell text-xs text-right text-green-700">KES {{ number_format($batch->items->sum('net_pay')) }}</td>
                <td class="table-cell" colspan="{{ $batch->status==='draft'?2:1 }}"></td>
            </tr>
        </tfoot>
    </table>
    </div>
</div>

{{-- Deduction Modal --}}
@if($batch->status === 'draft')
<div id="ded-modal" class="fixed inset-0 bg-black/30 z-50 flex items-center justify-center" style="display:none">
    <div class="bg-white rounded-xl p-6 w-96 shadow-xl">
        <h4 class="text-sm font-bold mb-3">Adjust Deductions</h4>
        <form method="POST" id="ded-form">@csrf @method('PUT')
            <div class="space-y-3">
                <div><label class="form-label">Other Deductions (KES)</label><input type="number" step="0.01" name="other_deductions" id="ded-amount" class="form-input" min="0"></div>
                <div><label class="form-label">Remarks</label><input type="text" name="remarks" class="form-input" placeholder="Reason for deduction"></div>
            </div>
            <div class="flex gap-2 mt-4">
                <button type="submit" class="btn-primary text-xs">Save</button>
                <button type="button" onclick="document.getElementById('ded-modal').style.display='none'" class="btn-secondary text-xs">Cancel</button>
            </div>
        </form>
    </div>
</div>
@endif
@endsection
@section('scripts')
<script>
function openDeductionModal(itemId, currentAmount){
    document.getElementById('ded-form').action = `${window.HMIS_BASE}/locum-payroll-item/${itemId}/deduction`;
    document.getElementById('ded-amount').value = currentAmount;
    document.getElementById('ded-modal').style.display = 'flex';
}
function printPayroll(){
    const t = document.getElementById('payroll-table');
    const w = window.open('','_blank','width=1100,height=800');
    w.document.write(`<!DOCTYPE html><html><head><title>{{ $batch->batch_label }}</title>
    <style>*{font-family:Arial,sans-serif;margin:0;padding:0}body{padding:20px;font-size:12px}
    h3{font-size:14px;margin-bottom:2px}p{font-size:12px;color:#888;margin-bottom:10px}
    table{width:100%;border-collapse:collapse}th{background:#f3f4f6;text-align:left;padding:5px 6px;font-size:12px;font-weight:700;text-transform:uppercase;border:1px solid #ddd}
    td{padding:4px 6px;border:1px solid #ddd;font-size:12px}tfoot td{font-weight:700;background:#f3f4f6}
    .text-right{text-align:right}@media print{body{padding:10px}}</style></head><body>`);
    w.document.write(t.innerHTML);
    w.document.write('</body></html>');
    w.document.close();
    setTimeout(()=>w.print(), 300);
}
</script>
@endsection