@extends('adminlte::page')

@section('title', 'Payslips')

@include('partials.ui-polish')

@section('content_header')
    <div class="d-flex align-items-center justify-content-between flex-wrap">
        <div>
            <h1 class="m-0">Payslips</h1>
            <span class="text-muted">View salary breakdowns, monthly payslips, and employee PDF downloads</span>
        </div>
        <a href="{{ route('payroll.runs.index') }}" class="btn btn-outline-primary btn-sm mt-2 mt-sm-0">
            <i class="fas fa-cogs mr-1"></i> Payroll Runs
        </a>
    </div>
@stop

@section('content')
    @if(session('success'))
        <x-adminlte-alert theme="success" title="Done" dismissable>
            {{ session('success') }}
        </x-adminlte-alert>
    @endif

    <div class="row">
        <div class="col-lg-4 col-6">
            <x-adminlte-info-box title="Generated" text="{{ $summary['generated'] }}" icon="fas fa-receipt" theme="success"/>
        </div>
        <div class="col-lg-4 col-6">
            <x-adminlte-info-box title="Available Items" text="{{ $summary['available_items'] }}" icon="fas fa-list" theme="info"/>
        </div>
        <div class="col-lg-4 col-12">
            <x-adminlte-info-box title="Net Pay Total" text="{{ number_format((float) $summary['net_total'], 2) }}" icon="fas fa-wallet" theme="primary"/>
        </div>
    </div>

    <x-adminlte-card title="Payroll Items" icon="fas fa-file-invoice-dollar" theme="primary">
        <form method="GET" action="{{ route('payroll.payslips.index') }}" class="mb-3">
            <div class="row">
                <div class="col-lg-3 col-md-6">
                    <label class="small text-muted mb-1" for="month">Payslip Month</label>
                    <input
                        type="month"
                        id="month"
                        name="month"
                        value="{{ $selectedMonth }}"
                        list="payroll-months"
                        class="form-control form-control-sm"
                    >
                    <datalist id="payroll-months">
                        @foreach($monthOptions as $month)
                            <option value="{{ $month }}"></option>
                        @endforeach
                    </datalist>
                </div>
                <div class="col-lg-3 col-md-6 mt-3 mt-md-0">
                    <label class="small text-muted mb-1" for="payroll_run_id">Payroll Run</label>
                    <x-adminlte-select name="payroll_run_id" igroup-size="sm">
                        <option value="">All approved/paid runs</option>
                        @foreach($runs as $run)
                            <option value="{{ $run->id }}" @selected($selectedRunId === $run->id)>
                                {{ $run->period->name ?? 'Run #'.$run->id }} - {{ $run->status }}
                            </option>
                        @endforeach
                    </x-adminlte-select>
                </div>
                <div class="col-lg-4 col-md-8 mt-3 mt-lg-0">
                    @if($canViewPayroll)
                        <label class="small text-muted mb-1" for="employee_id">Employee</label>
                        <x-adminlte-select name="employee_id" igroup-size="sm">
                            <option value="">All employees</option>
                            @foreach($employees as $employee)
                                <option value="{{ $employee->id }}" @selected($selectedEmployeeId === $employee->id)>
                                    {{ $employee->full_name }} ({{ $employee->employee_code }})
                                </option>
                            @endforeach
                        </x-adminlte-select>
                    @else
                        <label class="small text-muted mb-1">Employee</label>
                        <div class="form-control form-control-sm bg-light">
                            {{ $employees->first()?->full_name ?? 'Your employee record' }}
                        </div>
                    @endif
                </div>
                <div class="col-lg-2 col-md-4 mt-3 mt-lg-0 d-flex align-items-end">
                    <button type="submit" class="btn btn-primary btn-sm btn-block">
                        <i class="fas fa-filter mr-1"></i> Filter
                    </button>
                </div>
            </div>
        </form>

        <div class="table-responsive">
            <table class="table table-hover text-nowrap mb-0">
                <thead>
                    <tr>
                        <th>Employee</th>
                        <th>Period</th>
                        <th>Basic</th>
                        <th>Allowances</th>
                        <th>Gross</th>
                        <th>Deductions</th>
                        <th>Employer</th>
                        <th>Net</th>
                        <th>Payslip</th>
                        <th class="text-right">Action</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($payrollItems as $item)
                        <tr>
                            <td>
                                <strong>{{ $item->employee->full_name ?? 'Unknown employee' }}</strong>
                                <div class="text-muted small">
                                    {{ $item->employee->employee_code ?? '' }}
                                    @if($item->employee?->department)
                                        &middot; {{ $item->employee->department->name }}
                                    @endif
                                </div>
                            </td>
                            <td>
                                {{ $item->run->period->name ?? 'Unknown period' }}
                                <div class="text-muted small">
                                    @if($item->run->period)
                                        {{ $item->run->period->period_start->format('M Y') }}
                                        &middot;
                                    @endif
                                    {{ $item->run->status }}
                                </div>
                            </td>
                            <td>{{ number_format((float) $item->basic_salary, 2) }}</td>
                            <td>{{ number_format((float) $item->total_allowances, 2) }}</td>
                            <td>{{ number_format((float) $item->gross_salary, 2) }}</td>
                            <td>{{ number_format((float) $item->total_deductions, 2) }}</td>
                            <td>{{ number_format((float) $item->total_employer_contributions, 2) }}</td>
                            <td><strong>{{ number_format((float) $item->net_salary, 2) }}</strong></td>
                            <td>
                                @if($item->payslip)
                                    <span class="badge badge-success">{{ $item->payslip->payslip_number }}</span>
                                    <div class="text-muted small">{{ $item->payslip->generated_at?->format('M d, Y') }}</div>
                                @else
                                    <span class="badge badge-secondary">Not generated</span>
                                @endif
                            </td>
                            <td class="text-right">
                                @if($item->payslip)
                                    <a href="{{ route('payroll.payslips.show', $item->payslip) }}" class="btn btn-xs btn-outline-primary mb-1">
                                        <i class="fas fa-eye"></i> View
                                    </a>
                                    <a href="{{ route('payroll.payslips.download', $item->payslip) }}" class="btn btn-xs btn-outline-success mb-1">
                                        <i class="fas fa-file-pdf"></i> Download PDF
                                    </a>
                                @else
                                    @can('payroll.manage')
                                        <form method="POST" action="{{ route('payroll.payslips.generate', $item) }}" class="d-inline">
                                            @csrf
                                            <button type="submit" class="btn btn-xs btn-outline-success">
                                                <i class="fas fa-receipt"></i> Generate
                                            </button>
                                        </form>
                                    @else
                                        <span class="text-muted small">Awaiting HR</span>
                                    @endcan
                                @endif
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="10" class="text-center text-muted py-4">
                                No approved or paid payroll items found.
                            </td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>

        @if($payrollItems->hasPages())
            <div class="mt-3">
                {{ $payrollItems->links() }}
            </div>
        @endif
    </x-adminlte-card>
@stop