@extends('layouts.master')

@section('title', __('accounting.payment_fee_schedules'))
@section('content_title', __('accounting.payment_fee_schedules'))
@section('content_summary', __('accounting.all_payment_fee_schedules'))

@section('content_taskbar')
    <li class="nav-item">
        <a href="{{ route('accounting.payment_fee_schedules.create') }}" class="nav-link">
            <i class="nav-link-icon pe-7s-plus"></i>
            <span>{{ __('accounting.add') }}</span>
        </a>
    </li>
@endsection

@section('main_content')
    @if (Session::has('success'))
        <div class="alert alert-success">
            {{ Session::get('success') }}
        </div>
    @endif
    @if (Session::has('error'))
        <div class="alert alert-danger">
            {{ Session::get('error') }}
        </div>
    @endif
    <div class="main-card mb-3 card">
        <div class="card-body">
            <ul class="nav nav-tabs">
                <li class="nav-item">
                    <a data-bs-toggle="tab" href="#tab-eg10-0"
                        class="mb-2 me-2 btn btn-shadow-primary btn-primary active">{{ __('core.home') }}</a>
                </li>
                <li class="nav-item">
                    <a data-bs-toggle="tab" href="#tab-eg10-1" class="mb-2 me-2 btn btn-shadow-danger btn-danger">
                        {{ __('core.trash') }}
                    </a>
                </li>
            </ul>
            <div class="tab-content">
                <div class="tab-pane active" id="tab-eg10-0" role="tabpanel">
                    @include('accounting::payment_fee_schedules.partials.home')
                </div>
                <div class="tab-pane" id="tab-eg10-1" role="tabpanel">
                    @include('accounting::payment_fee_schedules.partials.trash')
                </div>
            </div>
        </div>
    </div>
@endsection

@push('script')
    <script>
        $(document).ready(function() {
            // Initialize DataTable
            $('#home').DataTable({
                responsive: true
            });


            $('#trash').DataTable({
                responsive: true
            });


            $(document).on('change', '#feeCategory', function() {
                var id = $(this).val();

                if (id) {
                    $.ajax({
                        url: "{{ route('accounting.payment_fee_schedules.getSubFeeCategory') }}",
                        type: "GET",
                        dataType: "json",
                        data: {
                            id: id
                        },
                        success: function(data) {
                            $('#feeSubCategory').empty();
                            $.each(data, function(key, value) {
                                $('#feeSubCategory').append('<option value="' + value
                                    .id + '">' + value.fee_category + '</option>');
                            });
                        }
                    })

                } else {
                    $('#feeSubCategory').empty();
                    $('#feeSubCategory').append('<option value="">Select Subcategory</option>');
                }
            });


            $(document).on('click', '.account_type_check', function(e) {
                if (e.target.checked) {
                    $('.account_type_parent_section').removeClass('d-none');
                } else {
                    $('.account_type_parent_section').addClass('d-none');
                }
            })

            // Open add form
            $(document).on('click', '#add', function(e) {
                e.preventDefault();

                $.ajax({
                    method: 'GET',
                    url: $(this).attr('href'),
                    success: function(response) {
                        $("#addModal .modal-body").html(response);
                        addSubmit(); // Reinitialize addSubmit for new content
                    },
                    error: function(response) {
                        $("#addModal .modal-body").html(
                            'Something Wrong, Please Try Again Later.');
                    }
                });
            });

            // Submit add form
            function addSubmit() {
                $('#addSubmit').on('submit', function(e) {
                    e.preventDefault();
                    $.ajax({
                        method: 'POST',
                        url: $(this).attr('action'),
                        data: $(this).serialize(),
                        success: function(response) {
                            console.log(response);
                            $('#addModal').modal('hide');
                            toastr.success(response.msg);
                            loadData();
                        },
                        error: function(response) {
                            console.log(response);
                        }
                    });
                });
            }

            // Open edit form
            $(document).on('click', '.edit', function(e) {
                e.preventDefault();
                $.ajax({
                    method: 'GET',
                    url: $(this).attr('href'),
                    success: function(response) {
                        $("#editModal .modal-body").html(response);
                        editSubmit(); // Reinitialize editSubmit for new content



                    },
                    error: function(response) {
                        $("#editModal .modal-body").html(
                            'Something Wrong, Please Try Again Later.');
                    }
                });
            });
            // Submit edit form
            function editSubmit() {
                $('#editSubmit').on('submit', function(e) {
                    e.preventDefault();
                    $.ajax({
                        method: 'POST',
                        url: $(this).attr('action'),
                        data: $(this).serialize(),
                        success: function(response) {
                            if (response.success) {
                                $('#editModal').modal('hide');
                                loadData();
                            } else {}
                        },
                        error: function(response) {
                            console.log(response);
                        }
                    });
                });
            }

            // update
            var updateUrl = '';
            $(document).on('click', '.update', function(e) {
                e.preventDefault();
                updateUrl = $(this).attr('href');
                $('#confirm-update').data('update-url', updateUrl); // Store update URL
            });

            // Confirm update modal
            $(document).on('click', '#confirm-update', function() {
                updateUrl = $(this).data('update-url'); // Retrieve update URL
                $.ajax({
                    method: 'PUT',
                    url: updateUrl,
                    success: function(response) {
                        $('#updateModal').modal('hide');
                        loadData();
                    },
                    error: function(response) {
                        console.log(response);
                    }
                });
            });

            // Destroy
            var destroyUrl = '';
            $(document).on('click', '.destroy', function(e) {
                e.preventDefault();
                destroyUrl = $(this).attr('href');
                $('#confirm-destroy').data('destroy-url', destroyUrl); // Store destroy URL
            });

            // Confirm destroy modal
            $(document).on('click', '#confirm-destroy', function() {
                destroyUrl = $(this).data('destroy-url'); // Retrieve destroy URL
                $.ajax({
                    method: 'DELETE',
                    url: destroyUrl,
                    success: function(response) {
                        $('#destroyModal').modal('hide');
                        loadData();
                    },
                    error: function(response) {
                        console.log(response);
                    }
                });
            });

            // Restore
            var restoreUrl = '';
            $(document).on('click', '.restore', function(e) {
                e.preventDefault();
                restoreUrl = $(this).attr('href');
                $('#confirm-restore').data('restore-url', restoreUrl); // Store restore URL
            });

            // Confirm restore modal
            $(document).on('click', '#confirm-restore', function() {
                restoreUrl = $(this).data('restore-url'); // Retrieve restore URL
                $.ajax({
                    method: 'POST',
                    url: restoreUrl,
                    success: function(response) {
                        $('#restoreModal').modal('hide');
                        loadData();
                    },
                    error: function(response) {
                        console.log(response);
                    }
                });
            });

            // Delete
            var deleteUrl = '';
            $(document).on('click', '.delete', function(e) {
                e.preventDefault();
                deleteUrl = $(this).attr('href');
                $('#confirm-delete').data('delete-url', deleteUrl); // Store delete URL
            });

            // Confirm delete modal
            $(document).on('click', '#confirm-delete', function() {
                deleteUrl = $(this).data('delete-url'); // Retrieve delete URL
                $.ajax({
                    method: 'DELETE',
                    url: deleteUrl,
                    success: function(response) {
                        $('#deleteModal').modal('hide');
                        loadData();
                    },
                    error: function(response) {
                        console.log(response);
                    }
                });
            });

            // Load data
            function loadData() {
                $.ajax({
                    method: 'GET',
                    url: "{{ route('accounting.payment_fee_schedules.index') }}",
                    success: function(response) {

                        // Destroy the existing DataTable instance
                        if ($.fn.DataTable.isDataTable('#home')) {
                            $('#home').DataTable().destroy();
                        }
                        if ($.fn.DataTable.isDataTable('#trash')) {
                            $('#trash').DataTable().destroy();
                        }

                        // Replace the table body with the new data
                        $('#home-data').html(response.homeData);
                        $('#trash-data').html(response.trashData);


                        // Reinitialize the DataTable
                        $('#home').DataTable({
                            responsive: true
                        });

                        $('#trash').DataTable({
                            responsive: true
                        });

                    },
                    error: function(response) {
                        console.log(response);
                    }
                });
            }


            // open schedule wise and class wise amount modal
            $(document).on('click', '.assign', function(e) {
                e.preventDefault();
                var payment_fee_schedule_id = $("#payment_fee_schedule_id").val();
                $.ajax({
                    method: 'GET',
                    url: $(this).attr('href'),
                    success: function(response) {
                        // console.log(response);
                        $("#largeUpModal .modal-body").html(response);
                        loadAcademicFeeSetUpData();
                        academicFeeSetUpSubmit();
                        //after submit form reset form
                        $('#addFeeSetUp')[0].reset();

                    },
                    error: function(response) {
                        $("#largeUpModal .modal-body").html(
                            'Something Wrong, Please Try Again Later.');
                    }
                });
            })

            // add schedule wise and class wise amount
            function academicFeeSetUpSubmit() {
                $('#addFeeSetUp').on('submit', function(e) {
                    e.preventDefault();

                    $.ajax({
                        method: 'POST',
                        url: $(this).attr('action'),
                        data: $(this).serialize(),
                        success: function(response) {
                            console.log(response);
                            toastr.success(response.msg);
                            loadAcademicFeeSetUpData();
                        },
                        error: function(response) {
                            toastr.success(response.responseJSON.message);
                        }
                    });
                });
            }

            // academic fee set up delete
            $(document).on('click', '.academicFeeSetUpDelete', function(e) {
                // {{ route('accounting.academic_fee_set_up.delete') }}
                e.preventDefault();
                var id = $(this).data('id');
                var payment_fee_schedule_id = $("#payment_fee_schedule_id").val();
                // console.log(id);
                $.ajax({
                    url: "{{ route('accounting.academic_fee_set_up.delete') }}",
                    type: "DELETE",
                    data: {
                        id: id,
                        payment_fee_schedule_id: payment_fee_schedule_id
                    },
                    success: function(response) {
                        // console.log(response);
                        toastr.success(response.msg);
                        loadAcademicFeeSetUpData();
                    },
                    error: function(response) {
                        console.log(response.message);
                    }
                });
            });

            // Open academic fee set up edit form
            $(document).on('click', '.academicFeeSetUpEdit', function(e) {
                e.preventDefault();
                var id = $(this).data('id');
                var payment_fee_schedule_id = $("#payment_fee_schedule_id").val();
                $.ajax({
                    type: "GET",
                    url: "{{ route('accounting.academic_fee_set_up.edit') }}",
                    data: {
                        id: id,
                        payment_fee_schedule_id: payment_fee_schedule_id
                    },
                    success: function(response) {
                        // console.log(response);
                        $("#academicFeeSetUpEditModal .modal-body").html(response);
                        academicFeeSetUpEditSubmit()
                    },
                    error: function(response) {
                        $("#academicFeeSetUpEditModal .modal-body").html(
                            'Something Wrong, Please Try Again Later.');
                    }
                });
            });

            // submit academic fee set up data
            function academicFeeSetUpEditSubmit() {
                $('#UpdateFeeSetUp').on('submit', function(e) {
                    e.preventDefault();

                    $.ajax({
                        method: 'PUT',
                        url: $(this).attr('action'),
                        data: $(this).serialize(),
                        success: function(response) {
                            // console.log(response);
                            toastr.success(response.msg);
                            $('#academicFeeSetUpEditModal').modal('hide');
                            loadAcademicFeeSetUpData();
                        },
                        error: function(response) {
                            console.log(response.responseJSON.message);
                            toastr.success(response.responseJSON.message);
                        }
                    });
                });
            }
            // academic fee set up data load and display
            function loadAcademicFeeSetUpData() {
                var payment_fee_schedule_id = $("#payment_fee_schedule_id").val();
                $.ajax({
                    url: `{{ route('accounting.academic_fee_set_up_list') }}`,
                    type: "GET",
                    dataType: "json",
                    data: {
                        id: payment_fee_schedule_id
                    },
                    success: function(response) {

                        // console.log(response.academicFeeSetUps);
                        var tbody = $('#academicFeeSetupData');
                        tbody.empty(); // Clear existing rows
                        $.each(response.academicFeeSetUps, function(index, item) {
                            // console.log(item);
                            var row = `
                                <tr>
                                    <td class="text-center">${item['academic_class']['academic_class']}</td>
                                    <td class="text-center">${item['group_id']?item['group']['group_name']:'N/A'}</td>

                                    <td class="text-center">${item['section'] ? item['section']['section_name']: 'N/A'}</td>
                                    <td class="text-center">${item.amount}</td>
                                    <td class="text-center">
                                        <a href="" class="academicFeeSetUpEdit" data-bs-toggle="modal"
                                            data-bs-target="#academicFeeSetUpEditModal" data-id="${item.id}">
                                            <i class="fa fa-lg fa-edit text-primary"></i>
                                        </a>

                                        <a href="" class="academicFeeSetUpDelete" data-id="${item.id}" >
                                            <i class="fa fa-lg fa-trash text-danger mx-2"></i>
                                        </a>
                                    </td>
                                </tr>
                                `;
                            tbody.append(row);
                        });

                    },
                    error: function(response) {
                        console.log(response);
                    }
                });
            }
            // Initial load
            loadData();


            // make  ajax request on chaange
            $(document).on('change', '#academicClasses', function(e) {
                e.preventDefault();
                let groupElmnt = $("#academicGroups");
                let sectionElmnt = $("#academicSections");
                let class_id = $(this).val();
                if (class_id) {
                    $.ajax({
                        url: "{{ route('accounting.academic_fee_set_up.academic_groups_and_sections') }}",
                        type: "GET",
                        data: {
                            class_id: class_id
                        },
                        success: function(response) {
                            // console.log(response);
                            groupElmnt.empty();
                            sectionElmnt.empty();
                            if (response.groups.length == 0 && response.sections.length == 0) {

                                groupElmnt.empty();
                                groupElmnt.append('<option value="" >Select Group</option>');
                                sectionElmnt.empty();
                                sectionElmnt.append(
                                    '<option value="" >Select Section</option>');
                                groupElmnt.prop('disabled', true);
                                sectionElmnt.prop('disabled', true);

                            } else if (response.groups.length == 0 && response.sections.length >
                                0) {

                                sectionElmnt.append(
                                    '<option value="" >Select Section</option>');
                                $.each(response.sections, function(index, item) {
                                    sectionElmnt.append('<option value="' + item.id +
                                        '">' + item.section_name + '</option>');
                                });
                                groupElmnt.empty();
                                groupElmnt.append('<option value="" >Select Group</option>');
                                groupElmnt.prop('disabled', true);
                                sectionElmnt.prop('disabled', false);

                            } else if (response.groups.length > 0 && response.sections.length ==
                                0) {
                                groupElmnt.append('<option value="" >Select Group</option>');

                                $.each(response.groups, function(index, item) {
                                    groupElmnt.append('<option value="' + item.id +
                                        '">' + item.group_name + '</option>');
                                });
                                groupElmnt.prop('disabled', false);
                                sectionElmnt.empty();
                                sectionElmnt.append(
                                    '<option value="" >Select Section</option>');
                                sectionElmnt.prop('disabled', true);


                            } else {
                                groupElmnt.append('<option value="" >Select Group</option>');
                                $.each(response.groups, function(index, item) {
                                    groupElmnt.append('<option value="' + item.id +
                                        '">' + item.group_name + '</option>');
                                });
                                sectionElmnt.append(
                                    '<option value="" >Select Section</option>');
                                $.each(response.sections, function(index, item) {
                                    sectionElmnt.append('<option value="' + item.id +
                                        '">' + item.section_name + '</option>');
                                });
                                sectionElmnt.prop('disabled', false);
                                groupElmnt.prop('disabled', false);
                            }
                        },
                        error: function(response) {
                            console.log(response);
                        }
                    })
                } else {
                    groupElmnt.empty();
                    groupElmnt.append('<option value="" >Select Group</option>');
                    sectionElmnt.empty();
                    sectionElmnt.append('<option value="" >Select Section</option>');

                    groupElmnt.prop('disabled', true);
                    sectionElmnt.prop('disabled', true);
                }

            });

            function fetchStudents() {
                const classId = $('#academicClasses').val();
                const sectionId = $('#academicSections').val();
                const groupId = $('#academicGroups').val();
                const specificStudentsDiv = $('#specificStudentsDiv');
                const specificStudents = $('#specificStudents');
                // console.log(specificStudentsDiv)
                $.ajax({
                    url: "{{ route('accounting.specific_students') }}",
                    type: 'GET',
                    data: {
                        academic_class_id: classId,
                        section_id: sectionId,
                        group_id: groupId
                    },

                    success: function(response) {
                        // console.log(response.students.length);
                        if (response.students.length > 0) {
                            // alert('has students');
                            specificStudents.empty();
                            specificStudents.append(
                                '<option value="" >Select Specific Students</option>');
                            $.each(response.students, function(index, item) {
                                specificStudents.append('<option value="' + item.user.id +
                                    '">' + item.user.username + '</option>');
                                // console.log(item.user.username);
                            })
                        } else {
                            toastr.success("No students found based on your selection");
                            specificStudents.empty();
                        }
                    },
                    error: function(response) {
                        console.log(response);
                    }
                });

            }

            $(document).on('change', '#academicClasses, #academicSections, #academicGroups', fetchStudents);




        });
    </script>
@endpush