@extends('layouts.app')

@section('title', $run->run_number)

@section('content')
<div class="space-y-6" x-data="{ adjustItem: null }">
    <header class="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm"><div class="flex flex-col gap-4 xl:flex-row xl:items-center xl:justify-between"><div><p class="text-xs font-bold uppercase tracking-[.18em] text-emerald-600">Payroll run</p><h1 class="mt-1 text-3xl font-bold text-slate-950">{{ $run->run_number }}</h1><p class="mt-1 text-sm text-slate-500">{{ $run->period->period_name }} · {{ $run->branch?->name ?? 'All branches' }} · {{ $run->group?->name ?? 'All payroll groups' }}</p></div><div class="flex flex-wrap gap-2"><a href="{{ route('app.payroll.index') }}" class="rounded-xl border border-slate-200 bg-white px-4 py-2.5 text-xs font-bold text-slate-700">Back to payroll</a>@if(in_array($run->status,['draft','calculated'])) @if(auth()->check() && auth()->user()->hasPermission('payroll.process'))<form method="POST" action="{{ route('app.payroll.recalculate',$run) }}">@csrf<button class="rounded-xl border border-emerald-200 bg-emerald-50 px-4 py-2.5 text-xs font-bold text-emerald-700">Recalculate</button></form>@endif @endif
                @if($run->status==='calculated')<form method="POST" action="{{ route('app.payroll.transition',[$run,'hr_review']) }}">@csrf<button class="rounded-xl bg-slate-900 px-4 py-2.5 text-xs font-bold text-white">HR reviewed</button></form>@elseif($run->status==='hr_reviewed')<form method="POST" action="{{ route('app.payroll.transition',[$run,'finance_review']) }}">@csrf<button class="rounded-xl bg-slate-900 px-4 py-2.5 text-xs font-bold text-white">Finance reviewed</button></form>@elseif($run->status==='finance_reviewed') @if(auth()->check() && auth()->user()->hasPermission('payroll.approve'))<form method="POST" action="{{ route('app.payroll.transition',[$run,'approve']) }}">@csrf<button class="rounded-xl bg-emerald-600 px-4 py-2.5 text-xs font-bold text-white">Approve & lock</button></form>@endif @elseif($run->status==='approved') @if(auth()->check() && auth()->user()->hasPermission('payroll.approve'))<form method="POST" action="{{ route('app.payroll.transition',[$run,'pay']) }}">@csrf<button class="rounded-xl bg-emerald-600 px-4 py-2.5 text-xs font-bold text-white">Mark paid</button></form>@endif @endif
            </div></div>
        <div class="mt-5 flex flex-wrap items-center gap-2 text-xs"><span class="rounded-full bg-slate-900 px-3 py-1.5 font-bold uppercase text-white">{{ str_replace('_',' ',$run->status) }}</span>@foreach(['Calculated','HR reviewed','Finance reviewed','Approved & locked','Paid'] as $index=>$label)<span class="text-slate-300">→</span><span class="{{ array_search($run->status,['calculated','hr_reviewed','finance_reviewed','approved','paid']) >= $index ? 'font-bold text-emerald-700' : 'text-slate-400' }}">{{ $label }}</span>@endforeach</div>
    </header>

    <section class="grid gap-3 sm:grid-cols-3"><div class="rounded-2xl border border-slate-200 bg-white p-5"><p class="text-xs font-semibold text-slate-500">Gross payroll</p><p class="mt-2 text-2xl font-bold text-slate-950">AED {{ number_format((float)$run->gross_total,2) }}</p></div><div class="rounded-2xl border border-slate-200 bg-white p-5"><p class="text-xs font-semibold text-slate-500">Deductions</p><p class="mt-2 text-2xl font-bold text-rose-600">AED {{ number_format((float)$run->deduction_total,2) }}</p></div><div class="rounded-2xl border border-emerald-200 bg-emerald-50 p-5"><p class="text-xs font-semibold text-emerald-700">Net payable</p><p class="mt-2 text-2xl font-bold text-emerald-800">AED {{ number_format((float)$run->net_total,2) }}</p></div></section>

    @if($run->validation_warnings)<section class="rounded-2xl border border-amber-200 bg-amber-50 p-5"><h2 class="font-bold text-amber-950">Payroll validation warnings</h2><ul class="mt-3 space-y-2 text-sm text-amber-900">@foreach($run->validation_warnings as $warning)<li class="flex gap-2"><span>•</span><span>{{ $warning }}</span></li>@endforeach</ul></section>@endif

    <section class="overflow-hidden rounded-2xl border border-slate-200 bg-white shadow-sm"><div class="border-b border-slate-200 p-5"><h2 class="text-lg font-bold text-slate-950">Employee calculation breakdown</h2><p class="text-xs text-slate-500">Every amount is stored as a period snapshot; approved payroll cannot be casually edited.</p></div><div class="overflow-x-auto"><table class="erp-table"><thead><tr><th>Employee</th><th>Basic</th><th>Allowances</th><th>OT</th><th>Gross</th><th>Absence</th><th>Unpaid leave</th><th>Loan</th><th>Other deduction</th><th>Net</th><th>Actions</th></tr></thead><tbody>
        @foreach($run->items as $item)<tr><td><a href="{{ route('app.employees.show',$item->employee) }}" class="font-bold text-slate-900">{{ $item->employee->full_name }}</a><small>{{ $item->employee->employee_code }} · {{ $item->working_days }} working / {{ $item->present_days }} present</small></td><td>AED {{ number_format((float)$item->basic_salary,2) }}</td><td>AED {{ number_format((float)$item->housing_allowance+(float)$item->transport_allowance+(float)$item->other_earnings,2) }}</td><td>AED {{ number_format((float)$item->overtime_amount,2) }}<small>{{ $item->overtime_minutes }} min</small></td><td class="font-bold">AED {{ number_format((float)$item->gross_salary,2) }}</td><td class="text-rose-700">AED {{ number_format((float)$item->absence_deduction,2) }}</td><td class="text-rose-700">AED {{ number_format((float)$item->unpaid_leave_deduction,2) }}</td><td class="text-rose-700">AED {{ number_format((float)$item->loan_deduction,2) }}</td><td class="text-rose-700">AED {{ number_format((float)$item->other_deductions,2) }}</td><td class="font-bold text-emerald-700">AED {{ number_format((float)$item->net_salary,2) }}</td><td><div class="flex gap-2"><a href="{{ route('app.payroll.payslip',$item) }}" target="_blank" class="text-xs font-bold text-emerald-700">Payslip</a>@if(in_array($run->status,['draft','calculated'])) @if(auth()->check() && auth()->user()->hasPermission('payroll.process'))<button @click="adjustItem = adjustItem === {{ $item->id }} ? null : {{ $item->id }}" class="text-xs font-bold text-slate-600">Adjust</button>@endif @endif</div></td></tr>
        <tr x-show="adjustItem === {{ $item->id }}" x-cloak><td colspan="11"><form method="POST" action="{{ route('app.payroll.adjustments.store',$item) }}" class="grid gap-2 rounded-xl bg-slate-50 p-3 md:grid-cols-4">@csrf<select name="type" class="erp-input"><option value="earning">Additional earning</option><option value="deduction">Additional deduction</option></select><input type="number" step=".01" min=".01" name="amount" required class="erp-input" placeholder="Amount"><input name="reason" required minlength="5" class="erp-input" placeholder="Mandatory adjustment reason"><button class="rounded-xl bg-slate-900 text-xs font-bold text-white">Record adjustment</button></form></td></tr>
        @endforeach</tbody></table></div></section>

    @if(in_array($run->status,['approved','paid'])) @if(auth()->check() && auth()->user()->hasPermission('payroll.wps.export'))<section class="rounded-2xl border border-slate-200 bg-white p-5"><div class="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between"><div><h2 class="text-lg font-bold text-slate-950">WPS salary batches</h2><p class="text-xs text-slate-500">Prepares a modular salary file only. It does not claim direct bank or government submission.</p></div><form method="POST" action="{{ route('app.payroll.wps.prepare',$run) }}">@csrf<button class="rounded-xl bg-emerald-600 px-4 py-2.5 text-xs font-bold text-white">Prepare WPS batch</button></form></div>@if($run->paymentBatches->isNotEmpty())<div class="mt-4 flex flex-wrap gap-2">@foreach($run->paymentBatches as $batch)<a href="{{ route('app.payroll.wps.download',$batch) }}" class="rounded-xl border border-slate-200 px-3 py-2 text-xs font-bold text-slate-700">{{ $batch->batch_number }} · {{ ucfirst($batch->status) }} ↓</a>@endforeach</div>@endif</section>@endif @endif
</div>
@endsection