@extends('layouts.admin')

@section('title', 'Computer Numbers')

@section('content')
<x-ui.page-header
    title="Computer Numbers"
    subtitle="Generate and configure computer number sequences."
    :breadcrumbs="[
        ['label' => 'Home', 'href' => route('dashboard')],
        ['label' => 'Student Registration', 'href' => route('registration.dashboard')],
        ['label' => 'Computer Number'],
    ]"
>
    <x-slot:actions>
        <x-ui.button variant="ghost" icon="bi-search" :href="route('registration.computer-number.search')">Search</x-ui.button>
    </x-slot:actions>
</x-ui.page-header>

@include('institution.partials.flash')

<div class="row g-4">
    <div class="col-lg-5">
        <x-ui.card title="Generate">
            <form method="POST" action="{{ route('registration.computer-number.generate') }}">
                @csrf
                <div class="row g-3">
                    <div class="col-12">
                        <div class="bv-form-group">
                            <div class="bv-form-group__field">
                                <i class="bv-form-group__icon bi bi-calendar"></i>
                                <div class="form-floating">
                                    <input type="number" name="year" id="year" class="form-control bv-form-control" value="{{ date('Y') }}" placeholder="Year">
                                    <label for="year">Year</label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-12">
                        <div class="bv-form-group">
                            <div class="bv-form-group__field">
                                <i class="bv-form-group__icon bi bi-type"></i>
                                <div class="form-floating">
                                    <input type="text" name="prefix" id="prefix" class="form-control bv-form-control" placeholder="Prefix">
                                    <label for="prefix">Prefix (optional)</label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="mt-3">
                    <x-ui.button type="submit" variant="primary" icon="bi-plus-lg">Generate</x-ui.button>
                </div>
            </form>
        </x-ui.card>

        <x-ui.card title="Configure sequence" class="mt-4">
            <form method="POST" action="{{ route('registration.computer-number.configure') }}">
                @csrf
                <div class="row g-3">
                    <div class="col-12">
                        <div class="bv-form-group">
                            <div class="bv-form-group__field">
                                <i class="bv-form-group__icon bi bi-building"></i>
                                <div class="form-floating">
                                    <input type="number" name="institution_id" id="institution_id" class="form-control bv-form-control" value="{{ \App\Models\Institution::current()?->id ?? \App\Models\Institution::query()->value('id') }}" required placeholder="Institution">
                                    <label for="institution_id">Institution ID</label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="bv-form-group">
                            <div class="bv-form-group__field">
                                <i class="bv-form-group__icon bi bi-calendar"></i>
                                <div class="form-floating">
                                    <input type="number" name="year" class="form-control bv-form-control" value="{{ date('Y') }}" required placeholder="Year">
                                    <label>Year</label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="bv-form-group">
                            <div class="bv-form-group__field">
                                <i class="bv-form-group__icon bi bi-123"></i>
                                <div class="form-floating">
                                    <input type="number" name="pad_length" class="form-control bv-form-control" value="5" placeholder="Pad">
                                    <label>Pad length</label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="bv-form-group">
                            <div class="bv-form-group__field">
                                <i class="bv-form-group__icon bi bi-type"></i>
                                <div class="form-floating">
                                    <input type="text" name="prefix" class="form-control bv-form-control" value="CN" placeholder="Prefix">
                                    <label>Prefix</label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="bv-form-group">
                            <div class="bv-form-group__field">
                                <i class="bv-form-group__icon bi bi-hash"></i>
                                <div class="form-floating">
                                    <input type="number" name="last_number" class="form-control bv-form-control" value="0" placeholder="Last">
                                    <label>Last number</label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="mt-3">
                    <x-ui.button type="submit" variant="primary" icon="bi-gear">Configure</x-ui.button>
                </div>
            </form>
        </x-ui.card>
    </div>
    <div class="col-lg-7">
        <x-ui.card title="Sequences">
            <div class="table-responsive">
                <table class="table bv-table align-middle mb-0">
                    <thead>
                        <tr>
                            <th>Year</th>
                            <th>Prefix</th>
                            <th>Last</th>
                            <th>Pad</th>
                            <th>Status</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($records as $record)
                            <tr>
                                <td>{{ $record->year }}</td>
                                <td>{{ $record->prefix }}</td>
                                <td>{{ $record->last_number }}</td>
                                <td>{{ $record->pad_length }}</td>
                                <td>
                                    @php $st = $record->status; @endphp
                                    {{ is_object($st) && method_exists($st, 'label') ? $st->label() : ($st ?? '—') }}
                                </td>
                            </tr>
                        @empty
                            <tr><td colspan="5" class="text-center text-muted-bv py-4">No sequences configured.</td></tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
            @if(method_exists($records, 'links'))
                <div class="mt-3">{{ $records->links() }}</div>
            @endif
        </x-ui.card>
    </div>
</div>
@endsection