@extends('admin.layouts.app')
@section('title', get_setting('site_name').' | '.__('Assign appraisal'))
@section('content')
    <style>
        .select2-selection__rendered {
            line-height: 31px !important;
        }
        .select2-container .select2-selection--single {
            height: 35px !important;
        }
        .select2-selection__arrow {
            height: 34px !important;
        }
    </style>
    @php
        $st = $appraisalSettings;
        $allowThree = $st?->enable_three_month ?? true;
        $allowSix = $st?->enable_six_month ?? true;
        $allowAnnual = $st?->enable_annual ?? true;
        $cycleLabels = [
            \App\Models\StaffAppraisalRecord::CYCLE_THREE_MONTH => __('3-month probation review'),
            \App\Models\StaffAppraisalRecord::CYCLE_SIX_MONTH => __('6-month review'),
            \App\Models\StaffAppraisalRecord::CYCLE_ANNUAL => __('Annual appraisal'),
        ];
    @endphp
    <div class="row mt-3 mb-3">
        <div class="col-md-10 col-lg-8 mx-auto">
            <div class="card">
                <div class="card-header">
                    <h5 class="mb-0">{{ __('Assign appraisal to staff') }}</h5>
                </div>
                <div class="card-body">
                    <form method="post" action="{{ route('appraisal.records.store') }}">
                        @csrf
                        <div class="form-group">
                            <label>{{ __('Staff') }}</label>
                            <select name="staff_id" id="staff_id" class="form-control select2 @error('staff_id') is-invalid @enderror" required>
                                <option value="">{{ __('Select…') }}</option>
                                @foreach($staffList as $s)
                                    <option value="{{ $s->id }}" @selected((string) old('staff_id') === (string) $s->id)>
                                        {{ $s->user?->name ?? __('Unknown') }} ({{ $s->user?->id ?? '—' }})
                                    </option>
                                @endforeach
                            </select>
                            @error('staff_id')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        </div>

                        <div class="form-group">
                            <label>{{ __('Template') }}</label>
                            <select name="staff_appraisal_template_id" id="template_id" class="form-control @error('staff_appraisal_template_id') is-invalid @enderror" required>
                                <option value="">{{ __('Select…') }}</option>
                                @foreach($templates as $t)
                                    <option value="{{ $t->id }}" data-cycles='@json($t->cycles ?? [])' @selected((string) old('staff_appraisal_template_id') === (string) $t->id)>{{ $t->name }}</option>
                                @endforeach
                            </select>
                            @error('staff_appraisal_template_id')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        </div>

                        <div class="form-group">
                            <label>{{ __('Cycle type') }}</label>
                            <select name="cycle_type" id="cycle_type" class="form-control @error('cycle_type') is-invalid @enderror" required>
                                <option value="">{{ __('Select…') }}</option>
                                @if($allowThree)
                                    <option value="{{ \App\Models\StaffAppraisalRecord::CYCLE_THREE_MONTH }}" data-cycle="{{ \App\Models\StaffAppraisalRecord::CYCLE_THREE_MONTH }}" @selected(old('cycle_type') === \App\Models\StaffAppraisalRecord::CYCLE_THREE_MONTH)>{{ $cycleLabels[\App\Models\StaffAppraisalRecord::CYCLE_THREE_MONTH] }}</option>
                                @endif
                                @if($allowSix)
                                    <option value="{{ \App\Models\StaffAppraisalRecord::CYCLE_SIX_MONTH }}" data-cycle="{{ \App\Models\StaffAppraisalRecord::CYCLE_SIX_MONTH }}" @selected(old('cycle_type') === \App\Models\StaffAppraisalRecord::CYCLE_SIX_MONTH)>{{ $cycleLabels[\App\Models\StaffAppraisalRecord::CYCLE_SIX_MONTH] }}</option>
                                @endif
                                @if($allowAnnual)
                                    <option value="{{ \App\Models\StaffAppraisalRecord::CYCLE_ANNUAL }}" data-cycle="{{ \App\Models\StaffAppraisalRecord::CYCLE_ANNUAL }}" @selected(old('cycle_type') === \App\Models\StaffAppraisalRecord::CYCLE_ANNUAL)>{{ $cycleLabels[\App\Models\StaffAppraisalRecord::CYCLE_ANNUAL] }}</option>
                                @endif
                            </select>
                            @error('cycle_type')<div class="invalid-feedback">{{ $message }}</div>@enderror
                            <small class="text-muted d-block mt-1" id="cycle_hint"></small>
                        </div>

                        <div class="form-group">
                            <label>{{ __('Period label (optional)') }}</label>
                            <input type="text" name="period_label" class="form-control" value="{{ old('period_label') }}" placeholder="{{ __('e.g. Q1 2026') }}">
                        </div>
                        <div class="form-group">
                            <label>{{ __('Due date (optional)') }}</label>
                            <input type="date" name="due_date" class="form-control" value="{{ old('due_date') }}">
                        </div>

                        <div class="text-right">
                            <a href="{{ route('appraisal.records') }}" class="btn btn-light">{{ __('Cancel') }}</a>
                            <button type="submit" class="btn btn-primary">{{ __('Assign') }}</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <script>
        (function () {
            var selT = document.getElementById('template_id');
            var selC = document.getElementById('cycle_type');
            var hint = document.getElementById('cycle_hint');
            function templateCycles() {
                var opt = selT.options[selT.selectedIndex];
                if (!opt || !opt.dataset.cycles) return [];
                try { return JSON.parse(opt.dataset.cycles) || []; } catch (e) { return []; }
            }
            function refreshHint() {
                var tc = templateCycles();
                if (tc.length === 0) {
                    hint.textContent = @json(__('This template allows all cycles.'));
                    return;
                }
                hint.textContent = @json(__('Template allows: ')) + tc.join(', ');
            }
            function filterCycles() {
                var tc = templateCycles();
                var all = tc.length === 0;
                for (var i = 0; i < selC.options.length; i++) {
                    var o = selC.options[i];
                    if (!o.value) continue;
                    var c = o.getAttribute('data-cycle');
                    o.disabled = !all && tc.indexOf(c) === -1;
                }
            }
            selT.addEventListener('change', function () { refreshHint(); filterCycles(); });
            refreshHint();
            filterCycles();
        })();
    </script>
@endsection