@extends('layouts.app')

@section('css')
    <link href="{{ asset('assets/css/student-listing.css') }}" rel="stylesheet" type="text/css" />
@endsection

@section('content')
    @include('layouts.toolbar')

    @php
        $studentListingSummary = $studentListingSummary ?? [
            'total' => 0,
            'active' => 0,
            'payment_due' => 0,
            'new_this_month' => 0,
        ];
    @endphp

    <div id="kt_content_container" class="d-flex flex-column-fluid align-items-start container-xxl student-listing-page">
        <div class="content flex-row-fluid" id="kt_content">
            <div class="student-listing-shell">
                <div class="student-page-header">
                    <div class="student-title-wrap">
                        <span class="student-title-icon">
                            <i class="fa-solid fa-user-group"></i>
                        </span>
                        <div>
                            <h1 class="student-page-title">Students</h1>
                            <p class="student-page-subtitle">Manage enrollments, payments and parent contacts</p>
                        </div>
                    </div>
                </div>

                <div class="student-stats-grid">
                    <div class="student-stat-card">
                        <span class="student-stat-icon is-total">
                            <i class="fa-solid fa-user-group"></i>
                        </span>
                        <div class="student-stat-body">
                            <span class="student-stat-label">Total students</span>
                            <span class="student-stat-value" id="student-total-stat">{{ $studentListingSummary['total'] }}</span>
                        </div>
                    </div>
                    <div class="student-stat-card">
                        <span class="student-stat-icon is-success">
                            <i class="fa-solid fa-circle-check"></i>
                        </span>
                        <div class="student-stat-body">
                            <span class="student-stat-label">Active</span>
                            <span class="student-stat-value is-success">{{ $studentListingSummary['active'] }}</span>
                        </div>
                    </div>
                    <div class="student-stat-card">
                        <span class="student-stat-icon is-danger">
                            <i class="fa-solid fa-circle-exclamation"></i>
                        </span>
                        <div class="student-stat-body">
                            <span class="student-stat-label">Payment due</span>
                            <span class="student-stat-value is-danger">{{ $studentListingSummary['payment_due'] }}</span>
                        </div>
                    </div>
                    <div class="student-stat-card">
                        <span class="student-stat-icon is-new">
                            <i class="fa-solid fa-calendar-plus"></i>
                        </span>
                        <div class="student-stat-body">
                            <span class="student-stat-label">New this month</span>
                            <span class="student-stat-value">{{ $studentListingSummary['new_this_month'] }}</span>
                        </div>
                    </div>
                </div>

                <div class="student-filter-stack">
                    <label class="student-search-field" for="student-search-input">
                        <i class="fa-solid fa-magnifying-glass"></i>
                        <input type="search" id="student-search-input" class="student-search-input" placeholder="Search students, parents, email...">
                    </label>

                    <div class="student-filter-field">
                        <select id="student-grade-filter" class="student-control" aria-label="Filter students by grade">
                            <option value="">All grades</option>
                            @foreach($grades ?? [] as $gradeName)
                                <option value="{{ $gradeName }}">{{ $gradeName }}</option>
                            @endforeach
                        </select>
                    </div>

                    <div class="student-filter-field">
                        <select id="student-status-filter" class="student-control" aria-label="Filter students by enrollment status">
                            <option value="">All statuses</option>
                            <option value="completed">Completed</option>
                            <option value="pending">Pending</option>
                        </select>
                    </div>
                </div>

                <div class="student-loading-state is-visible" id="student-loading-state">
                    Loading students...
                </div>
                <div class="student-card-grid" id="students-card-grid"></div>
                <div class="student-empty-state" id="student-empty-state">
                    No students match the current search or filters.
                </div>

                <div class="student-hidden-table">
                    <table class="table align-middle table-row-dashed fs-6 gy-5" id="kt_table_students">
                        <thead>
                        <tr class="text-start text-muted fw-bold fs-7 text-uppercase gs-0">
                            <th>ID</th>
                            <th>Student Name</th>
                            <th>Father Info</th>
                            <th>Mother Info</th>
                            <th>Grade</th>
                            <th>Credit Card Added</th>
                            <th>Enrollment Status</th>
                            <th>Deposit Status</th>
                            <th>Action</th>
                        </tr>
                        </thead>
                        <tbody class="fw-semibold text-gray-600"></tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    {{-- get summer enrollment summary --}}
    <div class="summer-enrollment-summary-data"></div>

    {{-- get new enrolled student list --}}
    <div class="get-new-enrolled-student-list"></div>

    {{-- get-attached-credit-card-info --}}
    <div class="get-attached-credit-card-info-data"></div>
@endsection

@section('js')
    <script type="text/javascript">
        var studentsTable = null;
        var studentSearchTimer = null;

        $(function() {
            $(".dropdown-toggle").dropdown();

            datatable();

            $('#student-grade-filter').select2({
                width: '100%'
            });

            $('#student-status-filter').select2({
                width: '100%',
                minimumResultsForSearch: Infinity
            });

            $('#student-search-input').on('input', function() {
                clearTimeout(studentSearchTimer);
                var value = $(this).val();

                studentSearchTimer = setTimeout(function() {
                    if (studentsTable) {
                        studentsTable.search(value).draw();
                    }
                }, 250);
            });

            $('#student-grade-filter, #student-status-filter').on('change', function() {
                if (studentsTable) {
                    $('#student-loading-state').addClass('is-visible');
                    studentsTable.ajax.reload();
                }
            });

            $(document).on('click', '.trash', function(e) {
                e.preventDefault();
                deleteStudentConfirmation($(this).attr('data-id'));
            });

            $(document).on('click', '.enrollment-summery', function(e) {
                e.preventDefault();
                getEnrollmentSummary($(this).attr('data-id'));
            });

            $(document).on('click', '.assign-group', function(e) {
                e.preventDefault();
                verifyStudentsExistInDiscountGroup($(this).attr('data-id'));
            });

            $(document).on('click', '.AssignButton', function(e) {
                e.preventDefault();
                assignNewStudentToGroup();
            });

            $(document).on('click', '.trash-referral-student', function(e) {
                e.preventDefault();
                deleteReferralStudentConfirmation($(this).attr('data-id'), $(this).attr('data-primary-id'));
            });

            $(document).on('click', '.resend-credit-card-notification', function(e) {
                e.preventDefault();
                resendCreditCardNotification($(this).attr('data-id'));
            });

            $(document).on('click', '.get-attached-credit-card-info', function(e) {
                e.preventDefault();
                getAttachedCreditCardInfo($(this).attr('data-id'));
            });

            $(document).on('click', '.trash-attached-credit-card-info', function(e) {
                e.preventDefault();
                deleteAttachedCreditCardInfo($(this).attr('data-id'), $(this).attr('data-student'));
            });

            $(document).on('click', '.set-primary-card', function(e) {
                e.preventDefault();
                let paymentSourceId = $(this).val();
                let parentId = $(this).data('parent');
                let studentId = $(this).data('student');
                let paymentCheck = $('input[name="payment_check"]:checked').val();

                setPrimaryCard(paymentSourceId, studentId, paymentCheck, parentId);
            });

            $(document).on('change', 'input[name="payment_check"]', function () {
                const paymentgateway = $(this).data('paymentgateway');
                const parentId = $(this).data('parent');
                const key = $(this).val();
                const studentId = $(this).attr('data-student');

                setPaymentGateway(paymentgateway, parentId, key, studentId, this);
            });
        });

        function datatable() {
            if ($.fn.DataTable.isDataTable('#kt_table_students')) {
                $('#kt_table_students').DataTable().destroy();
                $('#kt_table_students tbody').empty();
            }

            $('#student-loading-state').addClass('is-visible');

            studentsTable = $('#kt_table_students').DataTable({
                processing: true,
                serverSide: true,
                ajax: {
                    url: "{{ url('students/list') }}",
                    data: function(d) {
                        d.filter_grade = $('#student-grade-filter').val() || '';
                        d.filter_enrollment_status = $('#student-status-filter').val() || '';
                    },
                    dataSrc: function(json) {
                        $('#student-total-stat').text(json.recordsTotal || 0);
                        return json.data || [];
                    }
                },
                order: [[0, 'asc']],
                pageLength: 10,
                lengthChange: false,
                dom: 'rt<"student-list-footer"ip>',
                columns: [
                    {data: 'ID', name: 'ID'},
                    {data: 'name', name: 'name'},
                    {data: 'father_info', name: 'father_info', searchable: true},
                    {data: 'mother_info', name: 'mother_info', searchable: true},
                    {data: 'grade', name: 'grade', searchable: true},
                    {data: 'credit_card', name: 'credit_card', searchable: true},
                    {data: 'enrollment_status', name: 'enrollment_status', searchable: false},
                    {data: 'deposit_status', name: 'deposit_status', searchable: false},
                    {data: 'action', name: 'action', orderable: false, searchable: false}
                ],
                drawCallback: function() {
                    var api = this.api();
                    renderStudentCards(api.rows({ page: 'current' }).data().toArray());
                    $('#student-loading-state').removeClass('is-visible');
                }
            });
        }

        function renderStudentCards(rows) {
            if (!rows.length) {
                $('#students-card-grid').empty();
                $('#student-empty-state').addClass('is-visible');
                return;
            }

            $('#student-empty-state').removeClass('is-visible');
            $('#students-card-grid').html(rows.map(function(row, index) {
                return buildStudentCard(row, index);
            }).join(''));
        }

        function getEnrollmentStatus(row) {
            var status = (normalizeText(row.enrollment_status_text || row.enrollment_status || row.student_status || row.status) || '').toLowerCase();
            if (status.indexOf('complet') !== -1) {
                return 'completed';
            }
            if (status.indexOf('pending') !== -1) {
                return 'pending';
            }
            return '';
        }

        function buildStudentCard(row, index) {
            var id = normalizeText(row.ID || row.id);
            var name = normalizeText(row.name || [row.first_name, row.last_name].filter(Boolean).join(' ')) || 'Unnamed student';
            var grade = normalizeText(row.grade_text || row.grade) || '-';
            var depositStatus = normalizeText(row.deposit_status_text || row.deposit_status) || 'Deposit due';
            var cardStatus = getCreditCardLabel(row);
            var firstInitial = name.charAt(0).toUpperCase() || 'S';
            var avatarClass = ['is-blue', 'is-pink', 'is-purple', 'is-green'][index % 4];
            var enrollmentStatus = getEnrollmentStatus(row);
            var isCompleted = enrollmentStatus === 'completed';
            var enrollmentHref = extractActionHref(row.action, 'Registration & Enrollment');

            var metaText = 'Student ID #' + id;
            if (isCompleted && grade && grade !== '-') {
                metaText += ' - Grade ' + grade;
            }

            return '' +
                '<article class="student-card">' +
                    '<div class="student-card-main">' +
                        '<div class="student-card-top">' +
                            '<div class="student-identity">' +
                                '<span class="student-avatar ' + avatarClass + '">' + escapeHtml(firstInitial) + '</span>' +
                                '<div>' +
                                    '<h2 class="student-name">' + escapeHtml(name) + '</h2>' +
                                    '<p class="student-meta">' + escapeHtml(metaText) + '</p>' +
                                '</div>' +
                            '</div>' +
                            buildStatusPill(enrollmentStatus) +
                        '</div>' +
                        '<div class="student-pill-row">' +
                            buildDepositPill(depositStatus, enrollmentHref) +
                            buildCardPill(cardStatus, id) +
                        '</div>' +
                        '<div class="student-contact-list">' +
                            buildContactRow('Father', row.father_full_name, row.father_email, row.father_mobile_number, 'is-father') +
                            buildContactRow('Mother', row.mother_full_name, row.mother_email, row.mother_mobile_number, 'is-mother') +
                        '</div>' +
                    '</div>' +
                    '<div class="student-card-actions">' + (row.action || '') + '</div>' +
                '</article>';
        }

        function buildStatusPill(status) {
            if (status !== 'completed' && status !== 'pending') {
                return '';
            }

            var pillClass = status === 'completed' ? 'is-success' : 'is-muted';
            var label = status === 'completed' ? 'Completed' : 'Pending';

            return '<span class="student-pill ' + pillClass + '">' + label + '</span>';
        }

        function buildDepositPill(status, href) {
            var statusLower = status.toLowerCase();
            var pillClass = statusLower.indexOf('due') !== -1 ? 'is-danger' : 'is-success';
            var icon = statusLower.indexOf('due') !== -1 ? 'fa-circle-exclamation' : 'fa-circle-check';
            var inner = '<i class="fa-solid ' + icon + '"></i>' + escapeHtml(toTitleCase(status));

            if (href) {
                return '<a href="' + escapeHtml(href) + '" class="student-pill ' + pillClass + ' is-clickable" ' +
                    'target="_blank" rel="noopener" title="Registration & Enrollment">' + inner + '</a>';
            }

            return '<span class="student-pill ' + pillClass + '">' + inner + '</span>';
        }

        function buildCardPill(status, studentId) {
            var statusLower = status.toLowerCase();
            var isAdded = statusLower.indexOf('added') !== -1 || statusLower.indexOf('yes') !== -1;
            var pillClass = isAdded ? 'is-info' : 'is-muted';
            var inner = '<i class="fa-regular fa-credit-card"></i>' + escapeHtml(toTitleCase(status));

            if (isAdded) {
                return '<span class="student-pill ' + pillClass + ' is-clickable get-attached-credit-card-info" ' +
                    'role="button" tabindex="0" title="View credit card details" ' +
                    'data-id="' + escapeHtml(studentId) + '">' + inner + '</span>';
            }

            return '<span class="student-pill ' + pillClass + ' is-clickable resend-credit-card-notification" ' +
                'role="button" tabindex="0" title="Send credit card attachment notification" ' +
                'data-id="' + escapeHtml(studentId) + '">' + inner + '</span>';
        }

        function buildContactRow(label, name, email, phone, styleClass) {
            var cleanName = normalizeText(name);
            var cleanEmail = normalizeText(email);
            var cleanPhone = normalizeText(phone);
            var displayName = label + ': ' + (cleanName || 'Not added');

            var meta = '';
            if (cleanEmail) {
                meta += '<span class="student-contact-meta">' +
                    '<span class="student-contact-tag is-email"><i class="fa-regular fa-envelope"></i>Email</span>' +
                    '<span class="student-contact-val">' + escapeHtml(cleanEmail) + '</span>' +
                    '</span>';
            }
            if (cleanPhone) {
                meta += '<span class="student-contact-meta">' +
                    '<span class="student-contact-tag is-phone"><i class="fa-solid fa-phone"></i>Mobile</span>' +
                    '<span class="student-contact-val">' + escapeHtml(cleanPhone) + '</span>' +
                    '</span>';
            }
            if (!meta) {
                meta = '<span class="student-contact-meta">' +
                    '<span class="student-contact-val is-empty">No contact details</span>' +
                    '</span>';
            }

            return '' +
                '<div class="student-contact-row">' +
                    '<span class="student-contact-initial ' + styleClass + '">' + escapeHtml(label.charAt(0)) + '</span>' +
                    '<span class="student-contact-text">' +
                        '<span class="student-contact-name">' + escapeHtml(displayName) + '</span>' +
                        meta +
                    '</span>' +
                '</div>';
        }

        function extractActionHref(actionHtml, titleText) {
            if (!actionHtml) {
                return '';
            }

            var container = document.createElement('div');
            container.innerHTML = actionHtml;

            var link = container.querySelector('a[title="' + titleText + '"]');

            return (link && link.getAttribute('href')) ? link.getAttribute('href') : '';
        }

        function getCreditCardLabel(row) {
            var plain = normalizeText(row.credit_card_status || row.credit_card);

            if (plain.toLowerCase().indexOf('yes') !== -1 || plain.toLowerCase().indexOf('card added') !== -1) {
                return 'Card added';
            }

            return 'Card pending';
        }

        function normalizeText(value) {
            if (value === null || value === undefined) {
                return '';
            }

            var element = document.createElement('div');
            element.innerHTML = String(value);

            return (element.textContent || element.innerText || '').replace(/\s+/g, ' ').trim();
        }

        function escapeHtml(value) {
            return $('<div/>').text(value === null || value === undefined ? '' : value).html();
        }

        function toTitleCase(value) {
            return normalizeText(value).toLowerCase().replace(/\b\w/g, function(letter) {
                return letter.toUpperCase();
            });
        }

        function deleteStudentConfirmation(id) {
            Swal.fire({
                icon: 'warning',
                title: 'Are you sure you want to delete this record?',
                showDenyButton: false,
                showCancelButton: true,
                confirmButtonText: 'Yes'
            }).then(function(result) {
                if (result.isConfirmed) {
                    var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
                    $.ajax({
                        type: 'POST',
                        url: "{{ url('parents/students/delete') }}",
                        data: {
                            _token: CSRF_TOKEN,
                            studentID: id
                        },
                        success: function(results) {
                            if (results.status == 'Success') {
                                swal("Done!", results.status, "success");
                                if (studentsTable) {
                                    studentsTable.ajax.reload(null, false);
                                }
                            } else {
                                swal("Error!", results.status, "error");
                            }
                        }
                    });
                }
            });
        }

        function getEnrollmentSummary(studentId) {
            var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
            $.ajax({
                type: 'POST',
                url: "{{ url('student/enrollmant-summery') }}",
                data: {
                    _token: CSRF_TOKEN,
                    modal: 'yes',
                    studentId: studentId
                },
                success: function (data) {
                    $(".summer-enrollment-summary-data").html(data);
                    $('.getEnrollmentSummary').modal('show');
                }
            });
        }

        function verifyStudentsExistInDiscountGroup(studentId) {
            var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
            $.ajax({
                type: 'POST',
                url: "{{ url('get-new-active-enrolled-students-list') }}",
                data: {
                    _token: CSRF_TOKEN,
                    modal: 'yes',
                    studentID: studentId
                },
                success: function (data) {
                    $(".get-new-enrolled-student-list").html(data);
                    $('.getAssignStudent').modal('show');

                    $('#new_student_id').select2({
                        dropdownParent: $('#kt_modal_1'),
                        placeholder: 'Select an option'
                    });
                }
            });
        }

        function assignNewStudentToGroup() {
            $.ajax({
                type: 'POST',
                url: "{{ url('assign-new-student-to-group') }}",
                processData: false,
                contentType: false,
                data: new FormData($('#AssignStudent')[0]),
                dataType: 'json',

                beforeSend: function() {
                    $('#AssignButton').hide();
                    $('#CancelForm').hide();
                },

                success: function (data) {
                    if (data.success) {
                        toastr.success(data.success);
                        setTimeout(function () {
                            window.location.reload();
                        }, 1500);
                    } else if (data.failure) {
                        let htmlError = '';
                        $.each(data.failure, function (index, value) {
                            htmlError += '<li>' + value + '</li>';
                        });

                        toastr.error(htmlError);
                    }
                },

                complete: function(){
                    $('#SubmitForm').show();
                    $('#CancelForm').show();
                }
            });
        }

        function deleteReferralStudentConfirmation(id, primaryStudentId){
            Swal.fire({
                icon: 'warning',
                title: 'Are you sure you want to delete this student from group?',
                showDenyButton: false,
                showCancelButton: true,
                confirmButtonText: 'Yes'

            }).then(function(result) {
                if (result.isConfirmed) {
                    var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
                    $.ajax({
                        type: 'POST',
                        url: "{{ url('after-school/deleteStduentFromReferralGroup') }}",
                        data: {
                            _token: CSRF_TOKEN,
                            studentId: id
                        },
                        success: function (results) {
                            if (results.status == 'Success') {
                                swal("Done!", results.status, "success");
                                $('.getAssignStudent').modal('hide');
                                verifyStudentsExistInDiscountGroup(primaryStudentId);

                            } else {
                                swal("Error!", results.status, "error");
                            }
                        }
                    });
                } else {
                    return false;
                }
            });
        }

        function resendCreditCardNotification(id){
            Swal.fire({
                icon: 'warning',
                title: 'Do you want to proceed with sending the notification for credit card attachment?',
                showDenyButton: false,
                showCancelButton: true,
                confirmButtonText: 'Yes'

            }).then(function(result) {
                if (result.isConfirmed) {
                    $.blockUI({
                        css: {
                            border: 'none',
                            padding: '20px',
                            backgroundColor: '#000',
                            '-webkit-border-radius': '10px',
                            '-moz-border-radius': '10px',
                            opacity: 0.6,
                            color: '#fff'
                        }
                    });

                    var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
                    $.ajax({
                        type: 'POST',
                        url: "{{ url('resend-credit-card-notification') }}",
                        data: {
                            _token: CSRF_TOKEN,
                            studentId: id
                        },
                        success: function (results) {
                            $.unblockUI();
                            if (results.status == 'Success') {
                                swal("Done!", results.status, "success");
                                datatable();

                            } else {
                                swal("Error!", results.status, "error");
                            }
                        },

                        error: function () {
                            swal("Error!", "Something went wrong. Please try again!", "error");
                        },

                        complete: function () {
                            $.unblockUI();
                            datatable();
                        }
                    });

                } else {
                    $.unblockUI();
                    return false;
                }
            });
        }

        function getAttachedCreditCardInfo(studentId) {
            var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
            $.ajax({
                type: 'POST',
                url: "{{ url('student/get-attached-credit-card-info') }}",
                data: {
                    _token: CSRF_TOKEN,
                    modal: 'yes',
                    studentId: studentId
                },
                success: function (data) {
                    $(".get-attached-credit-card-info-data").html(data);
                    $('.getAttachedCreditCardInfo').modal('show');
                }
            });
        }

        function deleteAttachedCreditCardInfo(paymentSourceId, studentId){
            Swal.fire({
                icon: 'warning',
                title: 'Are you sure you want to delete this record?',
                showDenyButton: false,
                showCancelButton: true,
                confirmButtonText: 'Yes'

            }).then(function(result) {
                if (result.isConfirmed) {
                    var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
                    $.ajax({
                        type: 'POST',
                        url: "{{ url('student/delete-attached-credit-card-info') }}",
                        data: {
                            _token: CSRF_TOKEN,
                            sourceId: paymentSourceId
                        },
                        success: function (results) {
                            if (results.status == 'Success') {
                                swal("Done!", results.status, "success");

                                $('body')
                                        .removeClass('modal-open')
                                        .css({
                                            'overflow': '',
                                            'padding-right': ''
                                        });

                                $('.modal-backdrop').remove();
                                getAttachedCreditCardInfo(studentId);

                            } else {
                                swal("Error!", results.status, "error");
                            }
                        }
                    });
                } else {
                    return false;
                }
            });
        }

        function setPrimaryCard(paymentSourceId, studentId, paymentCheck, parentId){
            Swal.fire({
                icon: 'warning',
                title: 'Are you sure you want to change the primary card?',
                showDenyButton: false,
                showCancelButton: true,
                confirmButtonText: 'Yes'

            }).then(function(result) {
                if (result.isConfirmed) {
                    var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
                    $.ajax({
                        type: 'POST',
                        url: "{{ url('student/set-primary-card') }}",
                        data: {
                            _token: CSRF_TOKEN,
                            payment_source_id: paymentSourceId,
                            payment_check: paymentCheck,
                            parent_id: parentId
                        },
                        success: function (results) {
                            if (results.status == 'Success') {
                                swal("Done!", results.status, "success");

                                $('body')
                                        .removeClass('modal-open')
                                        .css({
                                            'overflow': '',
                                            'padding-right': ''
                                        });

                                $('.modal-backdrop').remove();
                                getAttachedCreditCardInfo(studentId);

                            } else {
                                swal("Error!", results.status, "error");
                            }
                        }
                    });
                } else {
                    return false;
                }
            });
        }

        function setPaymentGateway(paymentgateway, parentId, key, studentId, el){
            Swal.fire({
                icon: 'warning',
                title: 'Confirm payment method change',
                text: 'Do you want to change the payment gateway? This may impact upcoming transactions.',
                showCancelButton: true,
                confirmButtonText: 'Yes',
                cancelButtonText: 'Cancel'
            }).then(function(result) {

                if (!result.isConfirmed) {
                    $('input[name="payment_check"][data-current="1"]').prop('checked', true);
                    return false;
                }

                var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');

                $.ajax({
                    type: 'POST',
                    url: "{{ url('student/set-payment-gateway') }}",
                    data: {
                        _token: CSRF_TOKEN,
                        payment_source_id: paymentgateway,
                        parent_id: parentId,
                        payment_check: key,
                        student_id: studentId
                    },
                    success: function (results) {
                        if (results.status == 'Success') {

                            $('input[name="payment_check"]').removeAttr('data-current');
                            $(el).attr('data-current', '1');

                            Swal.fire('Done!', 'Payment gateway updated successfully.', 'success');

                            $('body')
                                    .removeClass('modal-open')
                                    .css({
                                        'overflow': '',
                                        'padding-right': ''
                                    });

                            $('.modal-backdrop').remove();

                            getAttachedCreditCardInfo(studentId);

                        } else {
                            Swal.fire('Error!', results.status, 'error');
                        }
                    },
                    error: function () {
                        Swal.fire('Error!', 'Request failed. Please try again.', 'error');
                    }
                });
            });
        }
    </script>
@endsection