@php use App\Models\advance_salary; @endphp
@extends('employee.layouts.app')
@section('title', get_setting('site_name').' | '.__('Advance Salary'))
@section('content')
    <style>
        .emp-advance-wrap .card {
            border-radius: 14px;
            border: 1px solid #edf0f6;
            box-shadow: 0 0.125rem 0.5rem rgba(15, 23, 42, 0.04);
        }
        .emp-advance-wrap .card-header {
            background: #fff;
            border-bottom: 1px solid #edf0f6;
            font-weight: 700;
            padding: 0.9rem 1.15rem;
        }
        .emp-advance-wrap .card-body.p-2 { padding: 0.5rem !important; }
        .emp-advance-wrap .card-footer {
            background: #fff;
            border-top: 1px solid #edf0f6;
            padding: 0.75rem 1.15rem;
        }
        .emp-advance-filters {
            background: #f8fafc;
            border-bottom: 1px solid #edf0f6;
            padding: 14px 16px;
        }
        .emp-advance-filters label {
            font-weight: 700;
            font-size: 12px;
            text-transform: uppercase;
            letter-spacing: .06em;
            color: rgba(15, 23, 42, .55);
            margin-bottom: 6px;
        }
        .emp-advance-filters .form-group { margin-bottom: 10px; }
        @media (min-width: 992px) { .emp-advance-filters .form-group { margin-bottom: 0; } }
        .emp-advance-stat {
            background: #fff;
            border: 1px solid #edf0f6;
            border-radius: 10px;
            padding: 10px 14px;
            text-align: center;
            height: 100%;
        }
        .emp-advance-stat .num { font-size: 1.25rem; font-weight: 800; line-height: 1.2; }
        .emp-advance-stat .lbl {
            font-size: 11px;
            text-transform: uppercase;
            letter-spacing: .06em;
            color: #64748b;
        }
        .emp-advance-table { margin-bottom: 0; font-size: 13px; }
        .emp-advance-table thead th {
            font-size: 11px;
            text-transform: uppercase;
            letter-spacing: .06em;
            color: rgba(15, 23, 42, .65);
            border-top: 0;
            white-space: nowrap;
            padding: 0.75rem 0.85rem;
        }
        .emp-advance-table tbody td {
            vertical-align: middle;
            padding: 0.85rem;
        }
        .emp-advance-table .emp-advance-empty {
            padding: 2rem 1rem !important;
            text-align: center;
            color: #64748b;
        }
        .emp-advance-money { font-variant-numeric: tabular-nums; white-space: nowrap; }
        .emp-advance-badge {
            display: inline-flex;
            align-items: center;
            padding: 4px 10px;
            border-radius: 999px;
            font-size: 11px;
            font-weight: 800;
            white-space: nowrap;
        }
        .emp-advance-badge.approved { background: rgba(34, 197, 94, .12); color: #166534; }
        .emp-advance-badge.pending { background: rgba(245, 158, 11, .14); color: #b45309; }
        .emp-advance-badge.rejected { background: rgba(239, 68, 68, .12); color: #991b1b; }
        .emp-advance-actions { display: inline-flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
        .emp-advance-modal .modal-content {
            border: none;
            border-radius: 12px;
            box-shadow: 0 0.5rem 2rem rgba(15, 23, 42, 0.15);
        }
        .emp-advance-modal .modal-header,
        .emp-advance-modal .modal-footer { border-color: #edf0f6; }
        .emp-advance-label {
            display: block;
            font-size: 12px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: .06em;
            color: rgba(15, 23, 42, .55);
            margin-bottom: 6px;
        }
        .emp-advance-modal-section {
            background: #f8fafc;
            border: 1px solid #edf0f6;
            border-radius: 10px;
            padding: 1rem;
            margin-bottom: 1rem;
        }
        .emp-advance-modal .emp-advance-modal-row {
            margin-bottom: 1rem;
        }
        .emp-advance-modal .emp-advance-modal-row .emp-advance-modal-section {
            margin-bottom: 0;
        }
        .emp-advance-modal .emp-advance-modal-section:last-of-type {
            margin-bottom: 1rem;
        }
        .emp-advance-modal-section-title {
            font-size: 11px;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .08em;
            color: rgba(15, 23, 42, .55);
            margin-bottom: 0.75rem;
        }
        .emp-advance-apply-date {
            font-size: 13px;
            color: #64748b;
            text-align: right;
            margin-bottom: 1rem;
        }
        .emp-advance-apply-date strong { color: #0f172a; }
    </style>

    <div class="container-fluid emp-advance-wrap">
        <div class="row mt-3">
            <div class="col-12 col-xl-11 mx-auto">

                <div class="d-flex flex-wrap justify-content-between align-items-center mb-3">
                    <div>
                        <h4 class="page-title mb-0">{{ __('My advance salary') }}</h4>
                        <p class="text-muted mb-0 small">{{ __('Apply for advance salary and track approval status.') }}</p>
                    </div>
                    <button type="button" class="btn btn-primary" onclick="advance_salary()">
                        <i class="fas fa-plus mr-1"></i> {{ __('New application') }}
                    </button>
                </div>

                @if (session()->has('message'))
                    <div class="alert alert-success">{{ session('message') }}</div>
                @endif
                @if (session()->has('error'))
                    <div class="alert alert-danger">{{ session('error') }}</div>
                @endif

                <div class="form-row mb-3">
                    <div class="col-6 col-md-3 mb-2">
                        <div class="emp-advance-stat">
                            <div class="num text-primary">{{ (int) ($advanceStats->total ?? 0) }}</div>
                            <div class="lbl">{{ __('Total') }}</div>
                        </div>
                    </div>
                    <div class="col-6 col-md-3 mb-2">
                        <div class="emp-advance-stat">
                            <div class="num text-warning">{{ (int) ($advanceStats->pending ?? 0) }}</div>
                            <div class="lbl">{{ __('Pending') }}</div>
                        </div>
                    </div>
                    <div class="col-6 col-md-3 mb-2">
                        <div class="emp-advance-stat">
                            <div class="num text-success">{{ (int) ($advanceStats->approved ?? 0) }}</div>
                            <div class="lbl">{{ __('Approved') }}</div>
                        </div>
                    </div>
                    <div class="col-6 col-md-3 mb-2">
                        <div class="emp-advance-stat">
                            <div class="num text-danger">{{ (int) ($advanceStats->rejected ?? 0) }}</div>
                            <div class="lbl">{{ __('Rejected') }}</div>
                        </div>
                    </div>
                </div>

                <div class="card">
                    <div class="card-header d-flex flex-wrap align-items-center justify-content-between">
                        <span><i class="fas fa-money-check-alt mr-1 text-muted"></i> {{ __('My applications') }}</span>
                        @if($hasFilters ?? false)
                            <a href="{{ route('employee.advance.salarys') }}" class="btn btn-sm btn-outline-secondary">{{ __('Clear filters') }}</a>
                        @endif
                    </div>

                    <form method="get">
                        <div class="emp-advance-filters">
                            <div class="form-row align-items-end">
                                <div class="form-group col-6 col-md-3">
                                    <label for="filter_year">{{ __('Year') }}</label>
                                    <select name="year" id="filter_year" class="form-control">
                                        <option value="">{{ __('All years') }}</option>
                                        @for($i = 2023; $i <= date('Y'); $i++)
                                            <option value="{{ $i }}" @selected((string) request('year') === (string) $i)>{{ $i }}</option>
                                        @endfor
                                    </select>
                                </div>
                                <div class="form-group col-6 col-md-3">
                                    <label for="filter_month">{{ __('Month') }}</label>
                                    <select name="month" id="filter_month" class="form-control">
                                        <option value="">{{ __('All months') }}</option>
                                        @for($i = 1; $i <= 12; $i++)
                                            <option value="{{ $i }}" @selected((string) request('month') === (string) $i)>
                                                {{ date('F', mktime(0, 0, 0, $i, 1)) }}
                                            </option>
                                        @endfor
                                    </select>
                                </div>
                                <div class="form-group col-6 col-md-3">
                                    <label for="filter_approval">{{ __('Status') }}</label>
                                    <select name="approval" id="filter_approval" class="form-control">
                                        <option value="">{{ __('All status') }}</option>
                                        <option value="{{ advance_salary::STATUS_PENDING }}" @selected((string) request('approval') === (string) advance_salary::STATUS_PENDING)>{{ __('Pending') }}</option>
                                        <option value="{{ advance_salary::STATUS_APPROVED }}" @selected((string) request('approval') === (string) advance_salary::STATUS_APPROVED)>{{ __('Approved') }}</option>
                                        <option value="{{ advance_salary::STATUS_REJECTED }}" @selected((string) request('approval') === (string) advance_salary::STATUS_REJECTED)>{{ __('Rejected') }}</option>
                                    </select>
                                </div>
                                <div class="form-group col-6 col-md-3 mb-0">
                                    <label class="d-none d-md-block">&nbsp;</label>
                                    <button type="submit" class="btn btn-primary btn-block">
                                        <i class="fas fa-filter"></i> {{ __('Filter') }}
                                    </button>
                                </div>
                            </div>
                        </div>
                    </form>

                    <div class="card-body p-2">
                        <div class="table-responsive">
                            <table class="table table-hover emp-advance-table">
                                <thead class="thead-light">
                                <tr>
                                    <th>{{ __('Apply date') }}</th>
                                    <th>{{ __('Payment starts') }}</th>
                                    <th>{{ __('Duration') }}</th>
                                    <th class="text-right">{{ __('Advance amount') }}</th>
                                    <th class="text-right">{{ __('Due amount') }}</th>
                                    <th>{{ __('Type') }}</th>
                                    <th class="text-center">{{ __('Status') }}</th>
                                    <th class="text-right">{{ __('Action') }}</th>
                                </tr>
                                </thead>
                                <tbody>
                                @forelse($advance_salary as $salary)
                                    @php
                                        $paidAmount = (float) ($salary->paid_amount ?? 0);
                                        $dueAmount = (int) $salary->status === advance_salary::STATUS_APPROVED
                                            ? max(0, (float) $salary->amount - $paidAmount)
                                            : 0;
                                    @endphp
                                    <tr>
                                        <td style="font-variant-numeric: tabular-nums;">{{ $salary->apply_date }}</td>
                                        <td>{{ date('F', mktime(0, 0, 0, (int) $salary->month, 1)) }}{{ __('-') }}{{ $salary->year }}</td>
                                        <td>{{ $salary->duration }} {{ __('Month') }}</td>
                                        <td class="emp-advance-money text-right font-weight-bold">{{ number_format((float) $salary->amount, 2) }}</td>
                                        <td class="emp-advance-money text-right">{{ number_format($dueAmount, 2) }}</td>
                                        <td>{{ __('Advance Salary') }}</td>
                                        <td class="text-center">
                                            @if((int) $salary->status === advance_salary::STATUS_APPROVED)
                                                <span class="emp-advance-badge approved">{{ __('Approved') }}</span>
                                            @elseif((int) $salary->status === advance_salary::STATUS_REJECTED)
                                                <span class="emp-advance-badge rejected">{{ __('Rejected') }}</span>
                                            @else
                                                <span class="emp-advance-badge pending">{{ __('Pending') }}</span>
                                            @endif
                                        </td>
                                        <td class="text-right emp-advance-actions">
                                            @if((int) $salary->status === advance_salary::STATUS_APPROVED)
                                                <a href="{{ route('advance.salary.view', $salary->id) }}" target="_blank"
                                                   class="btn btn-sm btn-primary" title="{{ __('PDF') }}">
                                                    <i class="fas fa-file-pdf"></i>
                                                </a>
                                            @elseif((int) $salary->status === advance_salary::STATUS_PENDING)
                                                <button type="button" class="btn btn-sm btn-light btn-advance-edit"
                                                        data-advance='@json($salary)'
                                                        title="{{ __('Edit') }}">
                                                    <i class="fas fa-edit"></i>
                                                </button>
                                                <a class="btn btn-sm btn-danger delete_modal"
                                                   data-href="{{ route('advance.salary.application.destroy', $salary->id) }}"
                                                   href="javascript:void(0)" title="{{ __('Delete') }}">
                                                    <i class="fas fa-trash"></i>
                                                </a>
                                            @else
                                                <span class="text-muted small">—</span>
                                            @endif
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="8" class="emp-advance-empty">
                                            @if($hasFilters ?? false)
                                                {{ __('No applications match your filters.') }}
                                            @else
                                                {{ __('No advance salary applications yet.') }}
                                            @endif
                                        </td>
                                    </tr>
                                @endforelse
                                </tbody>
                            </table>
                        </div>
                    </div>

                    @if($advance_salary->hasPages())
                        <div class="card-footer">{{ $advance_salary->links() }}</div>
                    @endif
                </div>

            </div>
        </div>
    </div>
@endsection

@section('modal')
    @include('modals.delete_modal')

    <div class="modal fade emp-advance-modal" id="advance_salary_modal">
        <form action="{{ route('employee.advance.salary') }}" method="POST">
            @csrf
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title font-weight-bold">{{ __('New advance salary application') }}</h5>
                        <button type="button" class="close" data-dismiss="modal"></button>
                    </div>
                    <div class="modal-body">
                        <div class="emp-advance-apply-date">
                            {{ __('Apply date') }}: <strong>{{ date('d-m-Y') }}</strong>
                        </div>

                        <input type="hidden" name="staff_id" value="{{ auth()->user()->staff->id }}">

                        <div class="row emp-advance-modal-row">
                            <div class="col-md-6 mb-3 mb-md-0">
                                <div class="emp-advance-modal-section h-100 mb-0">
                                    <div class="emp-advance-modal-section-title">{{ __('Amount') }}</div>
                                    <div class="form-group mb-0">
                                        <label class="emp-advance-label">{{ __('Advance amount') }} <span class="text-danger">*</span></label>
                                        <input class="form-control" type="number" step="0.01" min="0" name="amount" placeholder="{{ __('Enter amount') }}" required>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="emp-advance-modal-section h-100 mb-0">
                                    <div class="emp-advance-modal-section-title">{{ __('Payment method') }}</div>
                                    <div class="form-group mb-0">
                                        <label class="emp-advance-label">{{ __('Method') }} <span class="text-danger">*</span></label>
                                        <select name="payment_method" class="form-control" required>
                                            <option value="">{{ __('Select payment method') }}</option>
                                            <option value="salary_deduction">{{ __('Salary deduction') }}</option>
                                            <option value="cash">{{ __('By cash') }}</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="emp-advance-modal-section">
                            <div class="emp-advance-modal-section-title">{{ __('Repayment schedule') }}</div>
                            <div class="row">
                                <div class="col-md-4 form-group">
                                    <label class="emp-advance-label">{{ __('Duration (months)') }} <span class="text-danger">*</span></label>
                                    <input class="form-control" type="number" min="1" name="duration" placeholder="{{ __('e.g. 3') }}" required>
                                </div>
                                <div class="col-md-4 form-group">
                                    <label class="emp-advance-label">{{ __('Start month') }}</label>
                                    <select name="month" class="form-control">
                                        <option value="">{{ __('Select month') }}</option>
                                        @for($i = 1; $i <= 12; $i++)
                                            <option value="{{ $i }}">{{ date('F', mktime(0, 0, 0, $i, 1)) }}</option>
                                        @endfor
                                    </select>
                                </div>
                                <div class="col-md-4 form-group mb-md-0">
                                    <label class="emp-advance-label">{{ __('Start year') }}</label>
                                    <select name="year" class="form-control">
                                        <option value="">{{ __('Select year') }}</option>
                                        @for($i = date('Y'); $i <= date('Y') + 2; $i++)
                                            <option value="{{ $i }}">{{ $i }}</option>
                                        @endfor
                                    </select>
                                </div>
                            </div>
                        </div>

                        <div class="form-group mb-0">
                            <label class="emp-advance-label">{{ __('Reason') }} <span class="text-danger">*</span></label>
                            <textarea name="reason" rows="3" class="form-control" placeholder="{{ __('Explain why you need advance salary') }}" required></textarea>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-light" data-dismiss="modal">{{ __('Cancel') }}</button>
                        <button type="submit" class="btn btn-primary"><i class="fas fa-paper-plane mr-1"></i> {{ __('Submit') }}</button>
                    </div>
                </div>
            </div>
        </form>
    </div>

    <div class="modal fade emp-advance-modal" id="advance_salary_modal_update">
        <form action="{{ route('employee.advance.salary.update') }}" method="POST">
            @csrf
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title font-weight-bold">{{ __('Update advance salary application') }}</h5>
                        <button type="button" class="close" data-dismiss="modal"></button>
                    </div>
                    <div class="modal-body">
                        <div class="emp-advance-apply-date">
                            {{ __('Apply date') }}: <strong id="apply_date"></strong>
                        </div>

                        <input type="hidden" name="apply_date" id="apply_dates">
                        <input type="hidden" name="id" id="id">
                        <input type="hidden" name="staff_id" value="{{ auth()->user()->staff->id }}">

                        <div class="row emp-advance-modal-row">
                            <div class="col-md-6 mb-3 mb-md-0">
                                <div class="emp-advance-modal-section h-100 mb-0">
                                    <div class="emp-advance-modal-section-title">{{ __('Amount') }}</div>
                                    <div class="form-group mb-0">
                                        <label class="emp-advance-label">{{ __('Advance amount') }} <span class="text-danger">*</span></label>
                                        <input class="form-control" type="number" step="0.01" min="0" name="amount" id="amount" required>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="emp-advance-modal-section h-100 mb-0">
                                    <div class="emp-advance-modal-section-title">{{ __('Payment method') }}</div>
                                    <div class="form-group mb-0">
                                        <label class="emp-advance-label">{{ __('Method') }} <span class="text-danger">*</span></label>
                                        <select name="payment_method" id="payment_method" class="form-control" required>
                                            <option value="">{{ __('Select payment method') }}</option>
                                            <option value="salary_deduction">{{ __('Salary deduction') }}</option>
                                            <option value="cash">{{ __('By cash') }}</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="emp-advance-modal-section">
                            <div class="emp-advance-modal-section-title">{{ __('Repayment schedule') }}</div>
                            <div class="row">
                                <div class="col-md-4 form-group">
                                    <label class="emp-advance-label">{{ __('Duration (months)') }} <span class="text-danger">*</span></label>
                                    <input class="form-control" type="number" min="1" name="duration" id="duration" required>
                                </div>
                                <div class="col-md-4 form-group">
                                    <label class="emp-advance-label">{{ __('Start month') }}</label>
                                    <select name="month" id="month" class="form-control">
                                        <option value="">{{ __('Select month') }}</option>
                                        @for($i = 1; $i <= 12; $i++)
                                            <option value="{{ $i }}">{{ date('F', mktime(0, 0, 0, $i, 1)) }}</option>
                                        @endfor
                                    </select>
                                </div>
                                <div class="col-md-4 form-group mb-md-0">
                                    <label class="emp-advance-label">{{ __('Start year') }}</label>
                                    <select name="year" id="year" class="form-control">
                                        <option value="">{{ __('Select year') }}</option>
                                        @for($i = date('Y'); $i <= date('Y') + 2; $i++)
                                            <option value="{{ $i }}">{{ $i }}</option>
                                        @endfor
                                    </select>
                                </div>
                            </div>
                        </div>

                        <div class="form-group mb-0">
                            <label class="emp-advance-label">{{ __('Reason') }} <span class="text-danger">*</span></label>
                            <textarea name="reason" id="reason" rows="3" class="form-control" required></textarea>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-light" data-dismiss="modal">{{ __('Cancel') }}</button>
                        <button type="submit" class="btn btn-primary">{{ __('Update') }}</button>
                    </div>
                </div>
            </div>
        </form>
    </div>
@endsection

@section('script')
    <script>
        function advance_salary() {
            $('#advance_salary_modal').modal('show');
        }

        function advance_salary_update(el) {
            var s = $(el).data('advance');
            $('#payment_method').val(s.payment_method || '');
            $('#duration').val(s.duration || '');
            $('#amount').val(s.amount || '');
            $('#month').val(s.month || '');
            $('#year').val(s.year || '');
            $('#reason').val(s.reason || '');
            $('#apply_date').text(s.apply_date || '');
            $('#apply_dates').val(s.apply_date || '');
            $('#id').val(s.id);
            $('#advance_salary_modal_update').modal('show');
        }

        $(document).on('click', '.btn-advance-edit', function () {
            advance_salary_update(this);
        });
    </script>
@endsection