@extends('layouts.admin')

@section('title','Add Scholarship')

@section('content')
<div class="container-fluid p-0">

    <!--title-->
    <div class="mb-3 d-flex align-items-center justify-content-between">

        <div>
            <h1 class="h3 mb-0">Add Scholarship</h1>
            <p class="mb-0">You can create scholarship from here</p>
        </div>

        <a href="{{ url()->previous() }}" class="btn btn-primary">
            Back
        </a>

    </div>
    <!--title-->

    <!--content-->
    <div class="row">

        <!--1-->
        <div class="col-12 col-xl-12">
            <div class="card">
                <div class="card-body">
                    <form method="post" id="submit_Scholarship">

                        <div class="row">
                            <div class="col-12 col-xl-12">

                                <!--1 card-->
                                <div class="card">
                                    <div class="card-body">
                                        <h4 class="card-title mb-3">Scholarship Details</h4>
                                        <div class="list-card-cont">
                                            <div class="row">

                                                <div class="mb-4 col-md-6">
                                                    <label class="form-label">Scholarship Name <span class="text-danger">*</span></label>
                                                    <input id="scholarship_name" type="text" name="scholarship_name" class="form-control">
                                                    <label style="color:red" id="scholarship_name_error"></label>
                                                </div>

                                                <div class="mb-4 col-md-6">
                                                    <label class="form-label">Status</label>
                                                    <div class="form-check form-switch">
                                                        <input class="form-check-input" type="checkbox" role="switch"
                                                            id="status" name="status" value="1" checked>
                                                        <label class="form-check-label" for="status">Active</label>
                                                    </div>
                                                </div>

                                                <div class="mb-4 col-md-6">
                                                    <label class="form-label">From Date <span class="text-danger">*</span></label>
                                                    <input id="from_date" type="date" name="from_date" class="form-control">
                                                    <label style="color:red" id="from_date_error"></label>
                                                </div>

                                                <div class="mb-4 col-md-6">
                                                    <label class="form-label">To Date <span class="text-danger">*</span></label>
                                                    <input id="to_date" type="date" name="to_date" class="form-control">
                                                    <label style="color:red" id="to_date_error"></label>
                                                </div>

                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!--1 card-->

                            </div>
                        </div>
                        <!--fields row-->

                        <div class="col-12 text-end mt-3">
                            <button type="submit" class="btn btn-primary">Save Scholarship</button>
                            <button type="button" class="btn btn-secondary me-2" onclick="window.location.href='{{ route('admin.scholarships.index') }}'">Cancel</button>
                        </div>

                    </form>
                </div>
            </div>
        </div>
        <!--1-->

    </div>
    <!--content-->

</div>
@endsection

@push('scripts')
<script>
    $(document).ready(function() {

        $('#submit_Scholarship').on('submit', function(e) {
            e.preventDefault();

        // Clear previous errors
            $('#scholarship_name_error').text('');
            $('#from_date_error').text('');
            $('#to_date_error').text('');

            let scholarship_name = $('input[name="scholarship_name"]').val().trim();
            let from_date = $('input[name="from_date"]').val();
            let to_date = $('input[name="to_date"]').val();
            let status = $('input[name="status"]').is(':checked') ? 1 : 0;

        // Basic validation before sending request

// Required
            if (scholarship_name === '') {
                $('#scholarship_name_error').text('Scholarship name is required');
                return;
            }

// Length
            if (scholarship_name.length > 255) {
                $('#scholarship_name_error').text('Scholarship name must not exceed 255 characters');
                return;
            }

// Pattern (letters, numbers, spaces & common punctuation)
            if (!/^[A-Za-z0-9\s.,&\-()]+$/.test(scholarship_name)) {
                $('#scholarship_name_error').text('Scholarship name contains invalid characters');
                return;
            }

// Required
            if (from_date === '') {
                $('#from_date_error').text('From date is required');
                return;
            }

// Required
            if (to_date === '') {
                $('#to_date_error').text('To date is required');
                return;
            }

// To date should not be before from date
            if (to_date < from_date) {
                $('#to_date_error').text('To date must be on or after the from date');
                return;
            }

            $.ajax({
            url: "{{ route('admin.scholarships.store') }}",  // your store route
            method: "POST",
            data: {
                _token: '{{ csrf_token() }}',
                scholarship_name: scholarship_name,
                from_date: from_date,
                to_date: to_date,
                status: status
            },
            beforeSend: function() {
                Swal.fire({
                    title: 'Please wait...',
                    text: 'Submitting data...',
                    allowOutsideClick: false,
                    didOpen: () => Swal.showLoading()
                });
            },
            success: function(response) {
                Swal.close();

                if (response.success) {
                    Swal.fire({
                        icon: 'success',
                        title: 'Success!',
                        text: response.message || 'Scholarship added successfully!',
                        confirmButtonText: 'OK',
                    }).then((result) => {
                        if (result.isConfirmed) {
                            window.location.href = "{{ route('admin.scholarships.index') }}";
                        }
                    });
                } else {
                // Handle unexpected success responses
                    Swal.fire({
                        icon: 'success',
                        title: 'Added successfully!',
                        text: 'Redirecting...',
                        confirmButtonText: 'OK',
                    }).then((result) => {
                        if (result.isConfirmed) {
                            window.location.href = "{{ route('admin.scholarships.index') }}";
                        }
                    });
                }
            },
            error: function(xhr) {
                Swal.close();

                if (xhr.status === 422) {
                    // Laravel validation errors
                    let errors = xhr.responseJSON.errors;
                    if (errors.scholarship_name) {
                        $('#scholarship_name_error').text(errors.scholarship_name[0]);
                    }
                    if (errors.from_date) {
                        $('#from_date_error').text(errors.from_date[0]);
                    }
                    if (errors.to_date) {
                        $('#to_date_error').text(errors.to_date[0]);
                    }
                } else {
                    Swal.fire('Error', 'Something went wrong while submitting.', 'error');
                }
            }
        });
        });

    });
</script>
@endpush