@extends('adminlte::page')

@section('title', 'Payslip '.$payslip->payslip_number)

@section('content_header')
    <div class="d-flex align-items-center justify-content-between flex-wrap no-print">
        <div>
            <h1 class="m-0">Payslip</h1>
            <span class="text-muted">{{ $payslip->payslip_number }}</span>
        </div>
        <div class="mt-2 mt-sm-0">
            <button type="button" class="btn btn-primary btn-sm" onclick="window.print()">
                <i class="fas fa-print mr-1"></i> Print
            </button>
            <a href="{{ route('payroll.payslips.download', $payslip) }}" class="btn btn-success btn-sm">
                <i class="fas fa-file-pdf mr-1"></i> Download PDF
            </a>
            <a href="{{ route('payroll.payslips.index') }}" class="btn btn-outline-secondary btn-sm">
                <i class="fas fa-arrow-left mr-1"></i> Back
            </a>
        </div>
    </div>
@stop

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

    <x-adminlte-card theme="light" class="payslip-card">
        <div class="text-center mb-4">
            <h2 class="mb-0">{{ config('adminlte.title', config('app.name')) }}</h2>
            <div class="text-muted">Employee Payslip</div>
            <strong>{{ $payslip->payslip_number }}</strong>
        </div>

        <div class="row mb-4">
            <div class="col-md-6">
                <table class="table table-sm table-borderless">
                    <tr>
                        <th class="pl-0">Employee</th>
                        <td>{{ $payslip->employee->full_name }}</td>
                    </tr>
                    <tr>
                        <th class="pl-0">Code</th>
                        <td>{{ $payslip->employee->employee_code }}</td>
                    </tr>
                    <tr>
                        <th class="pl-0">Department</th>
                        <td>{{ $payslip->employee->department->name ?? 'Unassigned' }}</td>
                    </tr>
                    <tr>
                        <th class="pl-0">Position</th>
                        <td>{{ $payslip->employee->position->title ?? 'Unassigned' }}</td>
                    </tr>
                </table>
            </div>
            <div class="col-md-6">
                <table class="table table-sm table-borderless">
                    <tr>
                        <th class="pl-0">Period</th>
                        <td>{{ $payslip->item->run->period->name ?? 'Unknown period' }}</td>
                    </tr>
                    <tr>
                        <th class="pl-0">Period Dates</th>
                        <td>
                            @if($payslip->item->run->period)
                                {{ $payslip->item->run->period->period_start->format('M d, Y') }}
                                -
                                {{ $payslip->item->run->period->period_end->format('M d, Y') }}
                            @else
                                -
                            @endif
                        </td>
                    </tr>
                    <tr>
                        <th class="pl-0">Generated</th>
                        <td>{{ $payslip->generated_at?->format('M d, Y H:i') }}</td>
                    </tr>
                    <tr>
                        <th class="pl-0">Run Status</th>
                        <td>{{ $payslip->item->run->status }}</td>
                    </tr>
                </table>
            </div>
        </div>

        <div class="row mb-3">
            <div class="col-lg-3 col-6">
                <div class="border rounded p-3 h-100">
                    <div class="text-muted small text-uppercase">Basic</div>
                    <strong>{{ number_format((float) $payslip->item->basic_salary, 2) }}</strong>
                </div>
            </div>
            <div class="col-lg-3 col-6">
                <div class="border rounded p-3 h-100">
                    <div class="text-muted small text-uppercase">Gross</div>
                    <strong>{{ number_format((float) $payslip->item->gross_salary, 2) }}</strong>
                </div>
            </div>
            <div class="col-lg-3 col-6 mt-3 mt-lg-0">
                <div class="border rounded p-3 h-100">
                    <div class="text-muted small text-uppercase">Deductions</div>
                    <strong>{{ number_format((float) $payslip->item->total_deductions, 2) }}</strong>
                </div>
            </div>
            <div class="col-lg-3 col-6 mt-3 mt-lg-0">
                <div class="border rounded p-3 h-100">
                    <div class="text-muted small text-uppercase">Net Pay</div>
                    <strong>{{ number_format((float) $payslip->item->net_salary, 2) }}</strong>
                </div>
            </div>
        </div>

        <table class="table table-bordered payslip-breakdown">
            <thead>
                <tr>
                    <th>Description</th>
                    <th>Type</th>
                    <th class="text-right">Amount</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Basic Salary</td>
                    <td>Earning</td>
                    <td class="text-right">{{ number_format((float) $payslip->item->basic_salary, 2) }}</td>
                </tr>
                <tr class="table-light">
                    <th colspan="3">Allowances</th>
                </tr>
                @foreach($breakdown['allowances'] as $line)
                    <tr>
                        <td>{{ $line['label'] }}</td>
                        <td>{{ $line['type'] }}</td>
                        <td class="text-right">{{ number_format((float) $line['amount'], 2) }}</td>
                    </tr>
                @endforeach
                <tr>
                    <th colspan="2">Total Allowances</th>
                    <td class="text-right">{{ number_format((float) $payslip->item->total_allowances, 2) }}</td>
                </tr>
                <tr class="table-light">
                    <th colspan="3">Deductions</th>
                </tr>
                @foreach($breakdown['deductions'] as $line)
                    <tr>
                        <td>{{ $line['label'] }}</td>
                        <td>{{ $line['type'] }}</td>
                        <td class="text-right">({{ number_format((float) $line['amount'], 2) }})</td>
                    </tr>
                @endforeach
                <tr>
                    <th colspan="2">Total Deductions</th>
                    <td class="text-right">({{ number_format((float) $payslip->item->total_deductions, 2) }})</td>
                </tr>
                <tr class="table-light">
                    <th colspan="3">Employer Contributions</th>
                </tr>
                @foreach($breakdown['employer_contributions'] as $line)
                    <tr>
                        <td>{{ $line['label'] }}</td>
                        <td>{{ $line['type'] }}</td>
                        <td class="text-right">{{ number_format((float) $line['amount'], 2) }}</td>
                    </tr>
                @endforeach
            </tbody>
            <tfoot>
                <tr>
                    <th colspan="2">Gross Salary</th>
                    <th class="text-right">{{ number_format((float) $payslip->item->gross_salary, 2) }}</th>
                </tr>
                <tr>
                    <th colspan="2">Net Salary</th>
                    <th class="text-right">{{ number_format((float) $payslip->item->net_salary, 2) }}</th>
                </tr>
            </tfoot>
        </table>

        <div class="row mt-5">
            <div class="col-md-6">
                <div class="border-top pt-2">Prepared By</div>
            </div>
            <div class="col-md-6">
                <div class="border-top pt-2">Employee Signature</div>
            </div>
        </div>
    </x-adminlte-card>
@stop

@section('css')
    <style>
        @media print {
            .no-print,
            .main-sidebar,
            .main-header,
            .content-header,
            .main-footer {
                display: none !important;
            }

            .content-wrapper {
                margin-left: 0 !important;
                background: #fff !important;
            }

            .payslip-card {
                box-shadow: none !important;
            }

            .payslip-breakdown th,
            .payslip-breakdown td {
                padding: .4rem .55rem !important;
            }
        }
    </style>
@stop