@extends('layouts.admin')

@section('title', 'Offer Letters')

@section('content')
<x-ui.page-header
    title="Offer Letters"
    subtitle="Generate, email, and track admission offers."
    :breadcrumbs="[
        ['label' => 'Home', 'href' => route('dashboard')],
        ['label' => 'Student Admission', 'href' => route('admission.dashboard')],
        ['label' => 'Offer Letters'],
    ]"
/>

@include('institution.partials.flash')

<div class="row g-4">
    <div class="col-lg-8">
        <x-ui.table-wrapper id="admission-offer-letters" title="Offer letters" :record-count="$letters->total()">
            <x-slot:head>
                <tr>
                    <th>Reference</th>
                    <th>Application</th>
                    <th>Subject</th>
                    <th>Issued</th>
                    <th class="text-end">Actions</th>
                </tr>
            </x-slot:head>
            @forelse($letters as $letter)
                <tr>
                    <td class="text-mono">{{ $letter->reference_number }}</td>
                    <td>{{ $letter->application?->application_number ?? '—' }}</td>
                    <td>{{ $letter->subject ?? '—' }}</td>
                    <td>{{ $letter->issued_at?->format('d M Y') ?? '—' }}</td>
                    <td class="text-end">
                        <a class="bv-btn bv-btn--ghost bv-btn--sm" href="{{ route('admission.offer-letters.show', $letter) }}"><i class="bi bi-eye"></i></a>
                        <a class="bv-btn bv-btn--ghost bv-btn--sm" href="{{ route('admission.offer-letters.download', $letter) }}"><i class="bi bi-download"></i></a>
                    </td>
                </tr>
            @empty
                <tr><td colspan="5"><x-ui.empty-state title="No offer letters" message="Generate an offer from an approved application." icon="bi-envelope-paper" /></td></tr>
            @endforelse
            @if($letters->hasPages())
                <x-slot:footer>{{ $letters->links() }}</x-slot:footer>
            @endif
        </x-ui.table-wrapper>
    </div>
    <div class="col-lg-4">
        <x-ui.card title="Generate offer letter">
            <form method="POST" id="generate-offer-form">
                @csrf
                <div class="row g-3">
                    <div class="col-12">
                        <label class="form-label">Application</label>
                        <select name="application_id" id="generate-application-id" class="form-select" required>
                            <option value="">Select</option>
                            @foreach(\App\Models\Application::query()->orderByDesc('id')->limit(100)->get(['id','application_number']) as $app)
                                <option value="{{ $app->id }}">{{ $app->application_number }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-12">
                        <label class="form-label">Template (optional)</label>
                        <select name="offer_letter_template_id" class="form-select">
                            <option value="">Default template</option>
                            @foreach(\App\Models\OfferLetterTemplate::query()->orderBy('name')->get(['id','name']) as $tpl)
                                <option value="{{ $tpl->id }}">{{ $tpl->name }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-12">
                        <x-ui.button type="submit" variant="primary" icon="bi-magic">Generate</x-ui.button>
                    </div>
                </div>
            </form>
        </x-ui.card>
    </div>
</div>

@push('scripts')
<script>
document.getElementById('generate-offer-form')?.addEventListener('submit', function (e) {
    const id = document.getElementById('generate-application-id')?.value;
    if (!id) { e.preventDefault(); return; }
    this.action = @json(url('/admission/offer-letters/generate')) + '/' + id;
});
</script>
@endpush
@endsection