@extends('layouts.admin')

@section('title', 'Registration Settings')

@section('content')
@php
    $general = old('general_settings', $settings->general_settings ?? []);
    $wizard = old('wizard_settings', $settings->wizard_settings ?? []);
    $computer = old('computer_number_format', $settings->computer_number_format ?? []);
    $studentNum = old('student_number_format', $settings->student_number_format ?? []);
    $activeTab = request('tab', 'general');
@endphp

<x-ui.page-header
    title="Registration Settings"
    :subtitle="'Configure student registration for ' . ($institution->name ?? 'your institution') . '.'"
    :breadcrumbs="[
        ['label' => 'Home', 'href' => route('dashboard')],
        ['label' => 'Student Registration', 'href' => route('registration.dashboard')],
        ['label' => 'Settings'],
    ]"
/>

@include('institution.partials.flash')

<form method="POST" action="{{ $formAction }}">
    @csrf
    @method($formMethod)

    <ul class="nav nav-tabs bv-tabs__list" role="tablist">
        @foreach([
            'general' => ['General', 'bi-sliders'],
            'wizard' => ['Wizard', 'bi-magic'],
            'computer' => ['Computer number', 'bi-hash'],
            'student' => ['Student number', 'bi-card-heading'],
        ] as $key => [$label, $icon])
            <li class="nav-item" role="presentation">
                <button class="nav-link bv-tabs__link {{ $activeTab === $key ? 'active' : '' }}"
                        id="tab-{{ $key }}-btn"
                        data-bs-toggle="tab"
                        data-bs-target="#tab-{{ $key }}"
                        type="button"
                        role="tab">
                    <i class="bi {{ $icon }} me-1"></i>{{ $label }}
                </button>
            </li>
        @endforeach
    </ul>

    <div class="tab-content mt-4">
        <div class="tab-pane fade {{ $activeTab === 'general' ? 'show active' : '' }}" id="tab-general" role="tabpanel">
            <x-ui.card title="General settings">
                <div class="row g-3">
                    <div class="col-md-6">
                        <div class="bv-form-group">
                            <div class="bv-form-group__field">
                                <i class="bv-form-group__icon bi bi-toggle-on"></i>
                                <div class="form-floating">
                                    <select id="general_auto_approve" name="general_settings[auto_approve]" class="form-select bv-form-control">
                                        <option value="0" @selected(($general['auto_approve'] ?? '0') == '0')>No</option>
                                        <option value="1" @selected(($general['auto_approve'] ?? '0') == '1')>Yes</option>
                                    </select>
                                    <label for="general_auto_approve">Auto-approve registrations</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-envelope"></i>
                                <div class="form-floating">
                                    <select id="general_notify" name="general_settings[notify_on_complete]" class="form-select bv-form-control">
                                        <option value="1" @selected(($general['notify_on_complete'] ?? '1') == '1')>Yes</option>
                                        <option value="0" @selected(($general['notify_on_complete'] ?? '1') == '0')>No</option>
                                    </select>
                                    <label for="general_notify">Notify on completion</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-info-circle"></i>
                                <div class="form-floating">
                                    <textarea id="general_instructions" name="general_settings[instructions]" class="form-control bv-form-control" style="height:100px" placeholder="Instructions">{{ $general['instructions'] ?? '' }}</textarea>
                                    <label for="general_instructions">Registration instructions</label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </x-ui.card>
        </div>

        <div class="tab-pane fade {{ $activeTab === 'wizard' ? 'show active' : '' }}" id="tab-wizard" role="tabpanel">
            <x-ui.card title="Wizard settings">
                <div class="row g-3">
                    <div class="col-md-6">
                        <div class="bv-form-group">
                            <div class="bv-form-group__field">
                                <i class="bv-form-group__icon bi bi-list-check"></i>
                                <div class="form-floating">
                                    <select id="wizard_require_docs" name="wizard_settings[require_documents]" class="form-select bv-form-control">
                                        <option value="1" @selected(($wizard['require_documents'] ?? '1') == '1')>Yes</option>
                                        <option value="0" @selected(($wizard['require_documents'] ?? '1') == '0')>No</option>
                                    </select>
                                    <label for="wizard_require_docs">Require documents</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-journal"></i>
                                <div class="form-floating">
                                    <select id="wizard_require_courses" name="wizard_settings[require_courses]" class="form-select bv-form-control">
                                        <option value="1" @selected(($wizard['require_courses'] ?? '1') == '1')>Yes</option>
                                        <option value="0" @selected(($wizard['require_courses'] ?? '1') == '0')>No</option>
                                    </select>
                                    <label for="wizard_require_courses">Require course registration</label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </x-ui.card>
        </div>

        <div class="tab-pane fade {{ $activeTab === 'computer' ? 'show active' : '' }}" id="tab-computer" role="tabpanel">
            <x-ui.card title="Computer number format">
                <div class="row g-3">
                    <div class="col-md-4">
                        <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" id="cn_prefix" name="computer_number_format[prefix]" class="form-control bv-form-control" placeholder="Prefix" value="{{ $computer['prefix'] ?? 'CN' }}">
                                    <label for="cn_prefix">Prefix</label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <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" id="cn_pad" name="computer_number_format[pad_length]" class="form-control bv-form-control" placeholder="Pad" value="{{ $computer['pad_length'] ?? 5 }}">
                                    <label for="cn_pad">Pad length</label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <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">
                                    <select id="cn_year" name="computer_number_format[include_year]" class="form-select bv-form-control">
                                        <option value="1" @selected(($computer['include_year'] ?? '1') == '1')>Yes</option>
                                        <option value="0" @selected(($computer['include_year'] ?? '1') == '0')>No</option>
                                    </select>
                                    <label for="cn_year">Include year</label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </x-ui.card>
        </div>

        <div class="tab-pane fade {{ $activeTab === 'student' ? 'show active' : '' }}" id="tab-student" role="tabpanel">
            <x-ui.card title="Student number format">
                <div class="row g-3">
                    <div class="col-md-4">
                        <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" id="sn_prefix" name="student_number_format[prefix]" class="form-control bv-form-control" placeholder="Prefix" value="{{ $studentNum['prefix'] ?? 'STU' }}">
                                    <label for="sn_prefix">Prefix</label>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <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" id="sn_pad" name="student_number_format[pad_length]" class="form-control bv-form-control" placeholder="Pad" value="{{ $studentNum['pad_length'] ?? 6 }}">
                                    <label for="sn_pad">Pad length</label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </x-ui.card>
        </div>
    </div>

    <div class="d-flex gap-2 mt-4">
        <x-ui.button type="submit" variant="primary" icon="bi-check-lg">Save settings</x-ui.button>
    </div>
</form>
@endsection