@extends('layouts/eims_layout')
@section('title', '| ' . $pageTitle)
@section('content')
    @include('successMsg')

    <style>
        .ls-2 {
            letter-spacing: 2px;
        }

        .mt-7 {
            margin-top: 7%;
        }

        .mb-1 {
            margin-bottom: 1%;
        }
    </style>

    <div class="row">
        <div class="col-md-12">
            <!-- Panel for displaying the list of admission fees -->
            <div class="panel panel-default" style="background-color:#708090;">
                <div class="panel-heading" style="padding-bottom:0">
                    <div class="panel-options">
                        <!-- Button to open the admission fees collection modal -->
                        <button class="btn btn-info pull-right addViewBtn admissionQuickFeesCollectionButton"
                                title="Collect Fee">
                            <i class="glyphicon glyphicon-plus-sign addIcon" aria-hidden="true"></i>
                            Collect Fees
                        </button>
                    </div>
                    <!-- Title of the panel -->
                    <h1 class="text-center ls-2 text-white" style="font-family: Antiqua,serif;">
                        {{ $pageTitle }} List
                    </h1>
                </div>
                <div class="panel-body panelBodyView">

                    @php
                        // Define options for the view status filter
                        $viewStatus_options = ['' => 'Select any', 'pending' => 'Pending', 'rejected' => 'Rejected'];

                        // Add search elements based on the company type
                        if($companyType === 'UNV'){
                            $searchElements[] = ['element' => 'fillFacultyId'];
                            $searchElements[] = ['element' => 'fillDepartmentId'];
                        }

                        $searchElements[] = ['element' => 'fillProgramId','label' => $companyType === 'UNV' ? 'Program' : 'Medium/Version'];
                        $searchElements[] = ['element' => 'fillSemesterClassId', 'label' => $companyType === 'UNV' ? 'Semester' : 'Class'];
                        if($companyType !== 'UNV'){
                            $searchElements[] = ['element' => 'fillSemesterClassGroupId', 'label' => 'Group'];
                            $searchElements[] = ['element' => 'fillSectionId'];
                        }
                        $searchElements[] = ['element' => 'custom', 'name' => 'fillStatus', 'type' => 'select', 'label' => 'Status', 'options' => $viewStatus_options];
                        $searchElements[] = ['element' => 'dateRange'];
                    @endphp
                        <!-- Include the search panel with the defined search elements -->
                    @include('partials.searchPanel.main', ['searchElements' => $searchElements])

                    <!-- Table to display the list of admission fees -->
                    <table class="table table-responsive table-bordered first-col-dark" id="datatable">
                        <thead>
                        <tr>
                            <th class="text-center text-nowrap" style="min-width: 30px">Sl</th>
                            <th class="text-center text-nowrap" style="min-width: 95px">Admission Date</th>
                            <th class="text-center text-nowrap" style="min-width: 70px">Admission No</th>
                            <th class="text-center text-nowrap" style="min-width: 60px">
                                {{ $companyType === 'UNV' ? 'Program' : 'Medium/Version' }}
                            </th>
                            <th class="text-center text-nowrap">
                                {{ $companyType === 'UNV' ? 'Semester' : 'Class' }}
                            </th>
                            @if($companyType !== 'UNV')
                                <th class="text-center text-nowrap">
                                    Group
                                </th>
                                <th class="text-center text-nowrap" style="min-width: 50px">Section</th>
                            @endif
                            <th class="text-center text-nowrap">Applicant Name</th>
                            <th class="text-center text-nowrap">Father</th>
                            <th class="text-center text-nowrap" style="min-width: 80px">Date of Birth</th>
                            <th class="text-center text-nowrap" style="min-width: 95px">Phone Number</th>
                            <th class="text-center text-nowrap" style="min-width: 55px">Status</th>
                            <th class="text-center text-nowrap" style="min-width: 130px">Action</th>
                        </tr>
                        </thead>
                        <tbody id="tableBodySection"></tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <script>
        'use strict';

        $(document).ready(function () {
            // Initialize DataTable
            let datatable = $('#datatable').DataTable({
                sDom: "ltipr", // Remove default search bar
                processing: true,
                serverSide: true,
                ordering: false,
                ajax: {
                    "url": "{{ Request::url() }}",
                    "type": "POST",
                    '_token': $('input[name=_token]').val(),
                    "beforeSend": function () {
                        $('#loadingModal').show();
                    },
                    "data": function (d) {
                        let inputs = {};
                        $.each($('form').serializeArray(), function () {
                            inputs[this.name] = this.value;
                        });
                        d.filter = inputs;
                    }
                },
                drawCallback: () => $('#loadingModal').hide(),
                columns: [
                    {
                        data: "sl"
                    },
                    {
                        data: "admission_date",
                        className: "text-align-center"
                    },
                    {
                        data: "admission_no",
                        className: "text-align-center"
                    },
                    {
                        data: "program_code",
                        className: "text-align-center"
                    },
                    {
                        data: "semester_class_name",
                        className: "text-align-center"
                    },
                        @if($companyType !== 'UNV')
                    {
                        data: "semester_class_group_name",
                        className: "text-align-center"
                    },
                    {
                        data: "section_name",
                        className: "text-align-center"
                    },
                        @endif
                    {
                        data: "student_name",
                        className: "text-align-left"
                    },
                    {
                        data: "father_name",
                        className: "text-align-left"
                    },
                    {
                        data: 'dob',
                        className: "text-align-center"
                    },
                    {
                        data: "phone_number",
                        className: "text-align-center"
                    },
                    {
                        data: "status",
                        className: "text-align-center"
                    },
                    {
                        data: "id",
                        className: "text-align-center text-nowrap",
                        render: function (data, type, row) {
                            console.log(row);
                            let action = '';
                            if(row.status_val === `{{\App\Models\eims\student\Student::STATUS_PROMOTION}}`){
                                action += `<a href="{{ route('eims_admission_promotion_fees_create') }}?student_id=${encodeURI(row.encoded_id)}" class="btn btn-info btn-xs" title="Collect Fees">Collect Promotion Fees</a>`;
                            }else{
                                action += `<a href="{{ route('eims_admission_fees_create') }}?admission_id=${encodeURI(row.encoded_id)}" class="btn btn-info btn-xs" title="Collect Fees">Collect Admission Fees</a>`;
                            }
                            return action;
                        }
                    }
                ],
            });

            // Handle form submission for search
            $('#searchForm').on('submit', function (element) {
                element.preventDefault();
                datatable.ajax.reload();
            });
        });//ready function end
    </script>

    <!--
    Modal for collecting admission fees.
    This modal contains a form to collect fees from applicants.
    -->
    <div id="admissionQuickFeesCollectionModal" class="modal fade">
        <div class="modal-dialog modal-lg  mt-7">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title text-center" style="clear:both">
                        Admission Fees Collection Form
                    </h5>
                </div>
                {!! Form::open(['method' => 'post', 'id' => 'admissionQuickFeesCollectionForm', 'class' => 'form-horizontal form-groups', 'autocomplete' => 'off']) !!}

                {!! Form::hidden('config_data', null, ['id' => 'config_data']) !!}
                {!! Form::hidden('fees_bill_no', null, ['id' => 'fees_bill_no']) !!}

                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-8">
                            <!-- Form group for date input -->
                            <div class="row">
                                {!! Form::label('date', 'Date: ', ['class' => 'col-sm-3 control-label'], false) !!}
                                <div class="col-sm-9">
                                    {!! Form::text('date', $branch_campus_active_date ?? date('d-m-Y') , ['class' => 'form-control','id' => 'date','readonly','autocomplete'=>'off']) !!}
                                    <p id='date_error' style="max-height:3px;"></p>
                                </div>
                            </div>

                            <!-- Form group for program/medium/version selection -->
                            <div class="row ">
                                @php($programLabel = $companyType === 'UNV' ? 'Program' : 'Medium/Version')
                                {!! Form::label('modal_program_id', $programLabel , ['class' => 'col-sm-3 control-label'], false) !!}
                                <div class="col-sm-9">
                                    {!! Form::select('', $programs ?? [], null, ['class' => 'form-control custom-select2', 'id' => 'modal_program_id', 'placeholder' => "Select $programLabel"]) !!}
                                    <p id='program_id_error' style="max-height:3px;"></p>
                                </div>
                            </div>

                            {{-- session --}}
                            {{--<div class="row mb-1">
                                {!! Form::label('modal_session_id', 'Session: ', ['class' => 'col-sm-3 control-label'], false) !!}
                                <div class="col-sm-9">
                                    {!! Form::select('', $sessions ?? [], null, ['class' => 'form-control custom-select2', 'id' => 'modal_session_id', 'placeholder' => 'Select Session']) !!}
                                    <p id='session_id_error' style="max-height:3px;"></p>
                                </div>
                            </div>--}}

                            <!-- Form group for semester/class selection -->
                            <div class="row">
                                @php($semesterClassLabel = $companyType === 'UNV' ? 'Semester' : 'Class')
                                {!! Form::label('modal_semester_class_id', $semesterClassLabel , ['class' => 'col-sm-3 control-label'], false) !!}
                                <div class="col-sm-9">
                                    {!! Form::select('', $semesterClasses ?? [], null, ['class' => 'form-control custom-select2', 'id' => 'modal_semester_class_id', 'placeholder' => "Select $semesterClassLabel"]) !!}
                                    <p id='semester_class_id_error' style="max-height:3px;"></p>
                                </div>
                            </div>

                            <!-- Form group for group selection (if applicable) -->
                            @if($companyType === 'SCL')
                                <div class="row mb-1">
                                    {!! Form::label('modal_semester_class_group_id', 'Group: ', ['class' => 'col-sm-3 control-label'], false) !!}
                                    <div class="col-sm-9">
                                        {!! Form::select('', $semesterClassGroups ?? [], null, ['class' => 'form-control custom-select2', 'id' => 'modal_semester_class_group_id', 'placeholder' => 'Select Group']) !!}
                                    </div>
                                </div>
                            @elseif($companyType === 'CLG')
                                <div class="row mb-1">
                                    {!! Form::label('modal_semester_class_group_id', 'Group: ', ['class' => 'col-sm-3 control-label'], false) !!}
                                    <div class="col-sm-9">
                                        {!! Form::select('', $semesterClassGroups ?? [], null, ['class' => 'form-control custom-select2', 'id' => 'modal_semester_class_group_id', 'placeholder' => 'Select Group']) !!}
                                    </div>
                                </div>
                            @endif

                            <!-- Form group for section selection (if applicable) -->
                            @if($companyType !== 'UNV')
                                <div class="row mb-1">
                                    {!! Form::label('modal_section_id', 'Section: ', ['class' => 'col-sm-3 control-label'], false) !!}
                                    <div class="col-sm-9">
                                        {!! Form::select('', $sections ?? [], null, ['class' => 'form-control custom-select2', 'id' => 'modal_section_id', 'placeholder' => 'Select Section']) !!}
                                    </div>
                                </div>
                            @endif

                            <!-- Form group for applicant selection -->
                            <div class="row ">
                                {!! Form::label('modal_admission_id', 'Applicant: <sup class="text-danger">*</sup>', ['class' => 'col-sm-3 control-label'], false) !!}
                                <div class="col-sm-9">
                                    {!! Form::select('admission_id',  [], null, ['class' => 'form-control custom-select2', 'id' => 'modal_admission_id', 'placeholder' => 'Select Applicant']) !!}
                                    <p id='modal_admission_id_error' style="max-height:3px;"></p>
                                </div>
                            </div>

                            <!-- Form group for amount input -->
                            <div class="row ">
                                {!! Form::label('modal_amount', 'Amount: <sup class="text-danger">*</sup>', ['class' => 'col-sm-3 control-label'], false) !!}
                                <div class="col-sm-9">
                                    {!! Form::text('amount', null, ['class' => 'form-control', 'id' => 'modal_amount', 'placeholder' => 'Enter fees amount', 'readonly' => true]) !!}
                                    <p id='modal_amount_error' style="max-height:3px;"></p>
                                </div>
                            </div>

                            <!-- Form group for fees discount selection (hidden by default) -->
                            <div class="row hidden">
                                {!! Form::label('modal_fees_discount_id', 'Fees Discount: ', ['class' => 'col-sm-3 control-label']) !!}
                                <div class="col-sm-9">
                                    {!! Form::select('fees_discount_id', $feesDiscounts ?? [], null, ['class' => 'form-control custom-select2', 'id' => 'modal_fees_discount_id', 'placeholder' => 'Select Fees Discount']) !!}
                                    <p id='modal_fees_discount_id_error' style="max-height:3px;"></p>
                                </div>
                            </div>

                            <!-- Form group for discount percentage, discount amount, and fine (hidden by default) -->
                            <div class="row hidden ">
                                {!! Form::label('', 'Discount (%/TK) & Fine(TK)', ['class' => 'col-sm-3 control-label'])!!}

                                <!-- Input for discount percentage -->
                                <div class="col-sm-3">
                                    {!! Form::number('discount_percentage', null, ['class' => 'form-control', 'id' => 'modal_discount_percentage', 'step' => '0.01', 'placeholder' => 'Enter discount percentage', 'min' => '0']) !!}
                                    <p id='modal_discount_percentage_error' style="max-height:3px;"></p>
                                </div>

                                <!-- Input for discount amount -->
                                <div class="col-sm-3">
                                    {!! Form::number('discount_amount', null, ['class' => 'form-control', 'id' => 'modal_discount_amount', 'step' => '0.01', 'placeholder' => 'Enter discount amount', 'min' => '0']) !!}
                                    <p id='modal_discount_error' style="max-height:3px;"></p>
                                </div>

                            </div>

                            <div class=" row">
                                {!! Form::label('modal_fine', 'Fine: <sup class="text-danger">*</sup>', ['class' => 'col-sm-3 control-label'], false) !!}
                                <div class="col-sm-9">
                                    {!! Form::number('fine', null, ['class' => 'form-control', 'id' => 'modal_fine', 'step' => '0.01', 'placeholder' => 'Enter fine amount', 'min' => '0',  'readonly']) !!}
                                    <p id='modal_fine_error' style="max-height:3px;"></p>
                                </div>
                            </div>

                            <!-- Form group for gross amount calculation (hidden by default) -->
                            <div class=" row hidden">
                                {!! Form::label('modal_gross_amount', 'Gross Amount: <sup class="text-danger">*</sup>', ['class' => 'col-sm-3 control-label'], false) !!}
                                <div class="col-sm-9">
                                    {!! Form::number('gross_amount', 0, ['class' => 'form-control', 'id' => 'modal_gross_amount', 'step' => '0.01', 'placeholder' => 'Gross Amount', 'min' => '0', 'readonly'=>true]) !!}
                                    <p id='modal_gross_amount_error' style="max-height:3px;"></p>
                                </div>
                            </div>

                            <!-- Form group for paid amount input (hidden by default) -->
                            <div class="hidden row" id="paid_amount_div ">
                                {!! Form::label('modal_paid_amount', 'Paid Amount: <sup class="text-danger">*</sup>', ['class' => 'col-sm-3 control-label'], false) !!}
                                <div class="col-sm-9">
                                    {!! Form::number('paid_amount', 0, ['class' => 'form-control', 'id' => 'modal_paid_amount', 'step' => '0.01', 'placeholder' => 'Paid Amount', 'min' => '0', 'readonly'=>true]) !!}
                                    <p id='modal_paid_amount_error' style="max-height:3px;"></p>
                                </div>
                            </div>

                            <!-- Form group for pay amount input -->
                            <div class=" row">
                                {!! Form::label('modal_pay_amount', 'Pay Amount: <sup class="text-danger">*</sup>', ['class' => 'col-sm-3 control-label'], false) !!}
                                <div class="col-sm-9">
                                    {!! Form::number('pay_amount', 0, ['class' => 'form-control', 'id' => 'modal_pay_amount', 'step' => '0.01', 'placeholder' => 'Enter amount', 'min' => '0' , 'readonly']) !!}
                                    <p id='modal_pay_error' style="max-height:3px;"></p>
                                </div>
                            </div>

                            <!-- Form group for due amount calculation (hidden by default) -->
                            <div class=" row hidden">
                                {!! Form::label('modal_due_amount', 'Due Amount: <sup class="text-danger">*</sup>', ['class' => 'col-sm-3 control-label'], false) !!}
                                <div class="col-sm-9">
                                    {!! Form::number('', 0, ['class' => 'form-control', 'id' => 'modal_due_amount', 'step' => '0.01', 'placeholder' => 'Due Amount', 'min' => '0', 'readonly'=>true]) !!}
                                </div>
                            </div>

                            <!-- Form group for payment method selection -->
                            <div class=" row">
                                {!! Form::label('modal_payment_method', 'Payment Method: <sup class="text-danger">*</sup>', ['class' => 'col-sm-3 control-label'],false) !!}
                                <div class="col-sm-9">
                                    <div class="radio">
                                        @foreach($paymentMethods as $id => $paymentMethod)
                                            <label for="modal_payment_method_{{$id}}">
                                                <input type="radio" name="payment_method"
                                                       id="modal_payment_method_{{$id}}"
                                                       value="{{$id}}" @checked($id == 1)>

                                                {{$paymentMethod}}
                                            </label>
                                        @endforeach
                                    </div>

                                    <p id='modal_payment_method_error' style="max-height:3px;"></p>
                                </div>
                            </div>

                            <!-- Form group for note input -->
                            <div class="row">
                                {!! Form::label('modal_note', 'Note:', ['class' => 'col-sm-3 control-label']) !!}
                                <div class="col-sm-9">
                                    {!! Form::textarea('note', null, ['class' => 'form-control', 'id' => 'modal_note', 'rows' => 3]) !!}
                                    <p id='modal_description_error' style="max-height:3px;"></p>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-4" id="applicationAdmissionFeesHolder">

                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    {!! Form::button(' Close', ['class' => 'btn btn-warning left', 'data-dismiss' => 'modal', 'id' => 'footer_action_button_close']) !!}
                    {!! Form::button(' Collect Fees', ['class' => 'btn btn-success ', 'onclick' => 'submitAdmissionFeesCollection()']) !!}
                    {!! Form::button(' Collect & Print', ['class' => 'btn btn-success ', 'onclick' => 'submitAdmissionFeesCollectionAndPrint()']) !!}
                </div>
                {!! Form::close() !!}

            </div>
        </div>
    </div>

    @php($feesCollectionUrl = route('eims_admission_fees_store'))
    {{-- Form Submission Script --}}
    <script>
        'use strict';

        const companyType = '{{ $companyType }}';

        /**
         * Converts a string or number to a float value.
         * @param {string|number} value - The value to convert.
         * @returns {number} - The converted float value.
         */
        function money(value) {
            if (typeof value === 'string') {
                value = Number(value.replace(/[^0-9.-]+/g, ""));
            }
            return isNaN(value) ? 0.0 : parseFloat(value);
        }

        /**
         * Submits the admission fees collection form via AJAX.
         */
        function submitAdmissionFeesCollection() {
            let form = $('#admissionQuickFeesCollectionForm');
            let url = '{{ route('eims_admission_fees_store') }}';
            let data = form.serialize();

            $.ajax({
                url: url,
                type: 'POST',
                data: data,
                success: function (response) {
                    Swal.fire({
                        icon: response.responseStatus,
                        title: response.responseTitle,
                        text: response.responseText,
                    });
                    setTimeout(function () {
                        window.location.href = '{{ route('eims_admission_fees') }}';
                    }, 1000);
                },
                error: function (_response) {
                    const responseJSON = _response.responseJSON;

                    Swal.fire({
                        icon: responseJSON.responseStatus,
                        title: responseJSON.responseTitle,
                        text: responseJSON.responseText,
                    });

                    const errors = responseJSON.errors;
                    if (errors) {
                        setErrorsText(errors);
                    }
                }
            });
        }

        /**
         * Submits the admission fees collection form via AJAX and prompts the user to print the receipt.
         */
        function submitAdmissionFeesCollectionAndPrint() {
            let form = $('#admissionQuickFeesCollectionForm');
            let url = '{{ route('eims_admission_fees_store') }}';
            let data = form.serialize();

            $.ajax({
                url: url,
                type: 'POST',
                data: data,
                success: function (response) {
                    Swal.fire({
                        icon: response.responseStatus,
                        title: response.responseTitle,
                        text: response.responseText,
                    }).then(() => {
                        Swal.fire({
                            title: 'Are you sure to print?',
                            text: "Please print this!",
                            icon: 'warning',
                            showCancelButton: true,
                            confirmButtonColor: '#32ba32',
                            cancelButtonColor: '#7E7979',
                            confirmButtonText: 'Yes'
                        }).then((result) => {
                            if (result.isConfirmed) {
                                const url = `{{route('eims_student_fees_collection_print')}}?student_id=${response.student_id}&fees_bill_no=${response.fees_bill_no}`;
                                window.open(url, '_blank');
                                window.location.href = '{{ route('eims_admission_fees') }}';
                            }
                        });
                    });
                },
                error: function (_response) {
                    const responseJSON = _response.responseJSON;

                    Swal.fire({
                        icon: responseJSON.responseStatus,
                        title: responseJSON.responseTitle,
                        text: responseJSON.responseText,
                    });

                    const errors = responseJSON.errors;
                    if (errors) {
                        setErrorsText(errors);
                    }
                }
            });
        }

        $(document).ready(function () {
            const admissionQuickFeesCollectionModal = $('#admissionQuickFeesCollectionModal');
            const admissionFeesCollectionForm = $('#admissionQuickFeesCollectionForm');

            const modalProgramIdField = $('#modal_program_id');
            const modalSemesterClassIdField = $('#modal_semester_class_id');
            const modalSessionIdField = $('#modal_session_id');
            const modalSemesterClassGroupIdField = $('#modal_semester_class_group_id');
            const modalSectionIdField = $('#modal_section_id');
            const modalAdmissionIdField = $('#modal_admission_id');

            const modalAmountField = $('#modal_amount');
            const modalFeesDiscountField = $('#modal_fees_discount_id');
            const modalDiscountPercentageField = $('#modal_discount_percentage');
            const modalDiscountAmountField = $('#modal_discount_amount');
            const modalFineField = $('#modal_fine');
            const modalGrossAmountField = $('#modal_gross_amount');
            const modalPaidAmountField = $('#modal_paid_amount');
            const modalPayAmountField = $('#modal_pay_amount');
            const modalDueAmountField = $('#modal_due_amount');
            const admissionApplicationFeesHolder = $('#applicationAdmissionFeesHolder');

            /**
             * Handles the change event for the program ID field.
             * Updates the semester/class and session options based on the selected program.
             */
            modalProgramIdField.change(function () {
                const program_id = modalProgramIdField.val();
                admissionApplicationFeesHolder.html('');
                modalSemesterClassIdField.empty();
                let option = '';
                if (companyType === 'UNV') {
                    option = '<option selected="selected" value="">Select Semester</option>';
                } else if (companyType === 'SCL') {
                    option = '<option selected="selected" value="">Select Class</option>';
                } else if (companyType === 'CLG') {
                    option = '<option selected="selected" value="">Select Class</option>';
                } else {
                    option = '<option selected="selected" value="">Select Semester/Class</option>';
                }
                modalSemesterClassIdField.prepend(option)

                modalSessionIdField.empty().prepend('<option selected="selected" value="">Select Session</option>');

                $.ajax({
                    type: 'post',
                    url: `{{ route('eims_faculty_department_program_session_semester_section_course_subject_option_change') }}`,
                    data: {
                        program_id: program_id
                    },
                    dataType: 'json',
                    async: false, // This makes the request synchronous
                    success: function (_response) {
                        $.each(_response, function (key, value) {
                            {
                                if (key === "semesterClassListByProgramChange") {
                                    $.each(value, function (index, result) {
                                        modalSemesterClassIdField
                                            .append(
                                                "<option value='" + result
                                                    .id +
                                                "'>" + result.name +
                                                "</option>"
                                            );
                                    });
                                }

                                if (key === "sessionListByProgramChange") {
                                    $.each(value, function (index, result) {
                                        modalSessionIdField.append(
                                            "<option value='" + result
                                                .id +
                                            "'>" + result.name +
                                            "</option>"
                                        );
                                    });
                                }
                            }
                        });
                    }
                });
            });

            /**
             * Fetches and updates the section options based on the selected semester/class and group.
             */
            function getSections() {
                const semester_class_id = parseInt(modalSemesterClassIdField.val());
                const semester_class_group_id = parseInt(modalSemesterClassGroupIdField.val());
                admissionApplicationFeesHolder.html('');
                modalSectionIdField
                    .empty()
                    .prepend('<option selected="selected" value="">Select Section</option>');
                $.ajax({
                    type: 'post',
                    url: `{{ route('eims_faculty_department_program_session_semester_section_course_subject_option_change') }}`,
                    data: {
                        semester_class_id: semester_class_id,
                        semester_class_group_id: semester_class_group_id,
                    },
                    dataType: 'json',
                    success: function (_response) {
                        $.each(_response, function (key, value) {
                            if (!isNaN(semester_class_group_id) && key === "sectionListBySemesterClassGroupChange") {
                                $.each(value, function (index, result) {
                                    modalSectionIdField.append(
                                        "<option value='" + result
                                            .id +
                                        "'>" + result.name +
                                        "</option>"
                                    );
                                });
                            } else if (isNaN(semester_class_group_id) && key === "sectionListBySemesterClassChange") {
                                $.each(value, function (index, result) {
                                    modalSectionIdField.append(
                                        "<option value='" + result
                                            .id +
                                        "'>" + result.name +
                                        "</option>"
                                    );
                                });
                            }
                        });
                    }
                });
            }

            /**
             * Fetches and updates the applicant options based on the selected semester/class and section.
             */
            function getSetApplicants() {
                admissionApplicationFeesHolder.html('');
                modalAdmissionIdField.empty().prepend('<option selected="selected" value="">Select Applicant</option>');
                $.ajax({
                    type: 'post',
                    url: `{{ route('eims_semester_section_pending_admissions') }}`,
                    data: {
                        semester_class_id: modalSemesterClassIdField.val(),
                        section_id: modalSectionIdField.val(),
                    },
                    dataType: 'json',
                    success: function (_response) {
                        $.each(_response, function (index, result) {
                            modalAdmissionIdField.append(`"<option value='${index}'>${result}</option>`);
                        });
                    }
                });
            }

            // Update semester_class_group list on semester/class change
            modalSemesterClassIdField.change(() => {
                getSections();
                getSetApplicants();
            });

            // Update sections on semester_class_group change
            modalSemesterClassGroupIdField.change(() => getSections());

            // Update applicants on section change
            modalSectionIdField.change(() => getSetApplicants());

            // Update fees master on applicant change
            modalAdmissionIdField.change(() => {
                admissionApplicationFeesHolder.html('');
                $.ajax({
                    type: 'post',
                    url: `{{ route('eims_applicant_admission_fees') }}`,
                    data: {
                        admission_id: modalAdmissionIdField.val()
                    },
                    success: function (_response) {
                        admissionApplicationFeesHolder.html(_response.html);
                        modalFineField.val(_response.totalFineAmount).change();
                        modalAmountField.val(money(_response.totalAmount)).change();
                    }
                });
            });

            /**
             * Updates the discount fields based on the selected discount.
             */
            function updateDiscounts() {
                const amount = modalAmountField.val();
                const feesDiscount = modalFeesDiscountField.val();

                if (feesDiscount !== '') {
                    $.ajax({
                        url: "{{route('eims_fees_discount_amount')}}",
                        type: 'POST',
                        data: {
                            _token: $('input[name=_token]').val(),
                            fees_discount_id: feesDiscount,
                            amount: amount
                        },
                        contentType: 'application/x-www-form-urlencoded',
                        success: function (response) {
                            if (response.status === 'error') {
                                modalDiscountPercentageField.val(0);
                                Swal.fire({
                                    icon: 'error',
                                    title: 'Oops...',
                                    text: response.message,
                                });
                            }

                            if (response.status === 'success') {
                                modalDiscountAmountField.val(money(response.amount)).attr('readonly', true).change();
                                modalDiscountPercentageField.val(response.percentage).attr('readonly', true).change();
                            }
                        }
                    });
                } else {
                    modalDiscountAmountField.val(null).change().attr('readonly', false).change();
                    modalDiscountPercentageField.val(null).change().attr('readonly', false).change();
                }
            }

            /**
             * Updates the discount percentage based on the discount amount.
             */
            function updateDiscountPercentage() {
                const amount = modalAmountField.val();
                const discountAmount = modalDiscountAmountField.val();

                if (amount > 0 && discountAmount > 0) {
                    const discountPercentage = ((discountAmount / amount) * 100).toFixed(2);
                    modalDiscountPercentageField.val(discountPercentage).attr('readonly', true);
                } else {
                    modalDiscountPercentageField.val(null).attr('readonly', false);
                }
            }

            /**
             * Updates the discount amount based on the discount percentage.
             */
            function updateDiscountAmount() {
                const amount = modalAmountField.val();
                const discountPercentage = modalDiscountPercentageField.val();

                if (amount > 0 && discountPercentage > 0) {
                    const discountAmount = ((amount * discountPercentage) / 100).toFixed(2);
                    modalDiscountAmountField.val(discountAmount).attr('readonly', true);
                    updateGrossAmount();
                } else {
                    modalDiscountAmountField.val(null).attr('readonly', false);
                    updateGrossAmount();
                }
            }

            /**
             * Updates the gross amount based on the amount, fine, and discount amount.
             */
            function updateGrossAmount() {
                const amount = money(modalAmountField.val());
                const fine = money(modalFineField.val());
                const discountAmount = money(modalDiscountAmountField.val());
                const totalGrossAmount = amount + fine - discountAmount;
                modalGrossAmountField.val(money(totalGrossAmount)).change();
            }

            /**
             * Updates the pay amount based on the gross amount and paid amount.
             */
            function updatePayAmount() {
                const grossAmount = money(modalGrossAmountField.val());
                const paidAmount = money(modalPaidAmountField.val());
                const maxPayAmount = grossAmount - paidAmount;

                modalPayAmountField.attr('max', maxPayAmount).val(maxPayAmount).change();
            }

            /**
             * Updates the due amount based on the gross amount, paid amount, and pay amount.
             */
            function updateDueAmount() {
                const grossAmount = money(modalGrossAmountField.val());
                const paidAmount = money(modalPaidAmountField.val());
                const payAmount = money(modalPayAmountField.val());

                modalDueAmountField.val(money((grossAmount - paidAmount) - payAmount));
            }

            // Event listeners for updating discount, gross amount, pay amount, and due amount
            modalFeesDiscountField.change(updateDiscounts);
            modalDiscountAmountField.on('input', updateDiscountPercentage);
            modalDiscountPercentageField.on('input', updateDiscountAmount);
            modalAmountField.on('change keypress', () => updateGrossAmount());
            modalFineField.on('change input', updateGrossAmount);
            modalDiscountAmountField.on('change keypress', updateGrossAmount);
            modalGrossAmountField.change(() => {
                updatePayAmount();
                updateDueAmount();
            });
            modalPayAmountField.on('input', updateDueAmount);

            // Event listener for showing the admission fees collection modal
            $(document).on('click', '.admissionQuickFeesCollectionButton', function () {
                if (hasAccess('{{$feesCollectionUrl}}')) {
                    admissionFeesCollectionForm.trigger('reset');

                    admissionQuickFeesCollectionModal.modal('show');
                }
            });

            // Initialize Select2 after the modal is shown
            admissionQuickFeesCollectionModal.on('shown.bs.modal', function () {
                $('.custom-select2').select2({
                    dropdownParent: admissionQuickFeesCollectionModal,
                });
            });

            // Reinitialize Select2 after the modal is hidden
            admissionQuickFeesCollectionModal.on('hidden.bs.modal', function () {
                $('.custom-select2').select2();
            });

        });
    </script>
    {{-- Admission Fees Collection Modal End --}}

@endsection