@extends('admin::layouts.plane')

@section('content')
<div class="row" style="margin-left: 20px;">
    <div class="col-lg-12">
        <div class="row mb-3">
            <div class="col-lg-12">
                <h3>Generate School Result</h3>
                <hr>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                {!! Form::open(['id' => 'generate-school-result', 'class' => 'form']) !!}
                    <div class="row">
                        <div class="col-md-4">
                            <div class="form-group">
                                {!! Form::label('session', 'Session', ['class' => 'control-label']) !!}
                                {!! Form::select('session', ['' => 'Select Session'] + $sessions, null, [
                                    'class' => 'form-control required',
                                    'id' => 'session'
                                ]) !!}
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                {!! Form::label('school_id', 'School', ['class' => 'control-label']) !!}
                                {!! Form::select('school_id', ['' => 'Select School'] + $schools, null, [
                                    'class' => 'form-control required',
                                    'id' => 'school_id'
                                ]) !!}
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group">
                                {!! Form::label('class', 'Class', ['class' => 'control-label']) !!}
                                {!! Form::select('class', ['' => 'Select Class'] + $classes, null, [
                                    'class' => 'form-control',
                                    'id' => 'class'
                                ]) !!}
                            </div>
                        </div>

                    </div>
                    <div class="row mt-3">
                        <div class="col-md-12">
                            {!! Form::button('<i class="fas fa-sync-alt"></i>Generate School Result', [
                                'type' => 'submit',
                                'class' => 'btn btn-primary',
                                'id' => 'submit-btn'
                            ]) !!}
                        </div>
                    </div>
                {!! Form::close() !!}
            </div>
        </div>
    </div>
</div>

<script>
$(document).ready(function() {
    $('#school_id').select2();
    $('#class').select2();

    $('#generate-school-result').on('submit', function(e) {
        e.preventDefault();

        let isValid = true;
        $('.required').each(function() {
            if (!$(this).val()) {
                isValid = false;
                $(this).addClass('is-invalid');
            } else {
                $(this).removeClass('is-invalid');
            }
        });

        if (!isValid) {
            alert('Please fill all required fields');
            return;
        }

        const submitBtn = $('#submit-btn');
        submitBtn.prop('disabled', true).html('<i class="fas fa-spinner fa-spin"></i> Processing...');

        $.ajax({
            url: '{{ route("data-to-queue") }}',
            type: 'POST',
            data: $(this).serialize(),
            success: function(response) {
                alert(response.success);
            },
            error: function(xhr) {
                alert(xhr.responseJSON.error || 'Something went wrong!');
            },
            complete: function() {
                submitBtn.prop('disabled', false).html('<i class="fas fa-sync-alt"></i> Refresh Result');
            }
        });
    });
});
</script>
@endsection