@extends('layouts.examiner')
@section('title', 'Push Questions')

@section('content')
<div class="d-sm-flex align-items-center justify-content-between mb-4">
    <h1 class="h3 mb-0 text-gray-800">Push Questions</h1>
    <a href="{{ route('examiner.questions.index') }}" class="btn btn-sm btn-secondary">
        <i class="fas fa-arrow-left mr-1"></i> Back to Questions
    </a>
</div>

@if(session('pushResult') || isset($pushResult))
<div class="alert alert-info">
    <i class="fas fa-check-circle mr-1"></i>
    {{ session('pushResult') ?? $pushResult }}
</div>
@endif

<div class="row">
    <div class="col-lg-8">
        <div class="card shadow mb-4">
            <div class="card-header py-3">
                <h6 class="m-0 font-weight-bold text-primary">Push Questions</h6>
            </div>
            <div class="card-body">
                <p class="text-muted small mb-3">
                    This assigns questions to candidates as answer slots (<code>pume_answers</code>).
                    Questions are drawn from prescribed subjects for the selected session/department.
                </p>

                @if($errors->any())
                <div class="alert alert-danger">
                    <ul class="mb-0">@foreach($errors->all() as $e)<li>{{ $e }}</li>@endforeach</ul>
                </div>
                @endif

                <form method="POST" action="{{ route('examiner.questions.push.store') }}">
                    @csrf
                    <div class="form-group">
                        <label>Academic Session <span class="text-danger">*</span></label>
                        <select name="session_id" id="session_id" class="form-control" required>
                            <option value="">— Select —</option>
                            @foreach($sessions as $s)
                            <option value="{{ $s->id }}" {{ old('session_id') == $s->id ? 'selected' : '' }}>
                                {{ $s->name }}
                            </option>
                            @endforeach
                        </select>
                    </div>

                    <div class="form-group">
                        <label>Faculty <span class="text-danger">*</span></label>
                        <select name="faculty_id" id="faculty_id" class="form-control" required>
                            <option value="">— Select —</option>
                            @foreach($faculties as $f)
                            <option value="{{ $f->id }}" {{ old('faculty_id') == $f->id ? 'selected' : '' }}>
                                {{ $f->name }}
                            </option>
                            @endforeach
                        </select>
                    </div>

                    <div class="form-group">
                        <label>Department <small class="text-muted">(optional — leave blank for all departments in faculty)</small></label>
                        <select name="dept_id" id="dept_id" class="form-control">
                            <option value="">— All —</option>
                        </select>
                    </div>

                    <button class="btn btn-primary" type="submit" name="submit" value="1">
                        <i class="fas fa-paper-plane mr-1"></i> Push Questions
                    </button>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
$(function () {
    var DEPT_URL = '{{ url('examiner/ajax/departments-by-faculty') }}';

    // Pre-populate dept dropdown if faculty already selected (e.g. after validation fail)
    @if(old('faculty_id'))
    loadDepts({{ (int) old('faculty_id') }}, {{ (int) old('dept_id', 0) }});
    @endif

    $('#faculty_id').on('change', function () {
        loadDepts($(this).val(), 0);
    });

    function loadDepts(facId, selectedDeptId) {
        var $dept = $('#dept_id');
        if (!facId) {
            $dept.html('<option value="">— All —</option>');
            return;
        }
        $dept.html('<option value="">Loading…</option>');
        $.getJSON(DEPT_URL + '/' + facId, function (data) {
            var opts = '<option value="">— All —</option>';
            $.each(data, function (_, d) {
                opts += '<option value="' + d.id + '"' + (d.id == selectedDeptId ? ' selected' : '') + '>'
                      + d.name + '</option>';
            });
            $dept.html(opts);
        });
    }
});
</script>
@endpush