@extends('layouts.app')
@section('title', 'New Payslip')
@section('content')
<div class="card mb-4">
    <div class="card-header pb-0"><h6 class="mb-0">Select Staff & Period</h6></div>
    <div class="card-body">
        <form method="GET" class="row g-2 align-items-end">
            <div class="col-md-6"><label class="form-label text-xs">Staff *</label>
                <select name="staff_id" class="form-select form-select-sm searchable" onchange="this.form.submit()">
                    <option value="">— choose staff —</option>
                    @foreach($staffList as $s)<option value="{{ $s->id }}" @selected($staff && $staff->id==$s->id)>{{ $s->name }} ({{ $s->passport_no }})</option>@endforeach
                </select></div>
            <div class="col-md-3"><label class="form-label text-xs">Month</label>
                <select name="month" class="form-select form-select-sm">
                    @for($m=1;$m<=12;$m++)<option value="{{ $m }}" @selected($month==$m)>{{ \Carbon\Carbon::create()->month($m)->format('F') }}</option>@endfor
                </select></div>
            <div class="col-md-2"><label class="form-label text-xs">Year</label><input type="number" name="year" value="{{ $year }}" class="form-control form-control-sm"></div>
            <div class="col-md-1"><button class="btn btn-sm btn-outline-primary mb-0 w-100">Go</button></div>
        </form>
    </div>
</div>

@if($staff)
<form action="{{ route('payroll.store') }}" method="POST">
    @csrf
    <input type="hidden" name="staff_id" value="{{ $staff->id }}">
    <input type="hidden" name="period_month" value="{{ $month }}">
    <input type="hidden" name="period_year" value="{{ $year }}">
    <div class="card mb-3"><div class="card-body py-2 d-flex justify-content-between align-items-center">
        <div><strong>{{ $staff->name }}</strong> · {{ $staff->passport_no }} · {{ $staff->site?->name }}
            <span class="text-muted text-sm">— {{ \Carbon\Carbon::create()->month($month)->format('F') }} {{ $year }}</span></div>
        <button class="btn btn-primary btn-sm mb-0">Save Payslip</button>
    </div></div>
    @include('payroll._form')
    <div class="text-end mt-3"><button class="btn btn-primary">Save Payslip</button></div>
</form>
@endif
@endsection