@extends('layouts.master')

@section('title', __('hrm.student_promotion'))
@section('content_title', __('hrm.student_promotion'))
@section('content_summary', __('hrm.student_promotion_summary'))


@section('content_taskbar')
    <li class="nav-item">
        <a href="{{ route('student-promotions.create') }}" class="nav-link modal-triger" data-bs-toggle="modal"
            data-bs-target="#basicModal">
            <i class="nav-link-icon lnr-inbox"></i>
            <span>{{ __('core.add') }}</span>
        </a>
    </li>
@endsection




@section('main_content')
    <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">
                        {{ __('core.home') }}
                    </a>
                </li>
            </ul>
            <div class="tab-content">
                <div class="tab-pane active" id="tab-eg10-0" role="tabpanel">
                    @include('hrm::hrm.student_promotions.partials.home')
                </div>

            </div>
        </div>
    </div>
@endsection

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

            $($('.modal-triger').attr('data-bs-target')).find(".modal-dialog").html('');

            $(document).on("click", ".modal-triger", function(e) {
                e.preventDefault(); // Prevent default anchor behavior

                let modal_selector = $(this).attr("data-bs-target");
                let modal = $(modal_selector);
                modal.modal('hide');
                // Load new content dynamically
                $.ajax({
                    method: 'GET',
                    url: $(this).attr('href'),
                    beforeSend: function() {
                        // Show a loading indicator inside the modal (optional)
                        modal.find(".modal-dialog").html(
                            '<div class="text-center p-4">Loading...</div>');
                    },
                    success: function(response) {
                        // Replace modal content
                        modal.html(response);

                        // Open the modal AFTER content is fully loaded
                    },
                    error: function() {
                        alert('Something went wrong. Please try again.');
                    }
                });

                modal.modal('show');



            });


            // Initialize DataTable
            $('#home').DataTable({
                scrollX: true,
                responsive: false,
            });

            $(document).on('submit', 'form#create_promotion', function(e) {
                e.preventDefault();
                $(this).find('button[type="submit"]').attr('disabled', false);
                var data = $(this).serialize();

                $.ajax({
                    method: $(this).attr('method'),
                    url: $(this).attr("action"),
                    dataType: "json",
                    data: data,
                    success: function(result) {
                        if (result.success == true) {
                            $("#create_promotion").parent().closest('.modal').modal("hide");
                            toastr.success(result.msg);
                            loadData();
                        } else {
                            toastr.error(result.msg);
                        }
                    },
                    error: function(response) {
                        // Clear previous error messages
                        $("#create_promotion").find('.text-danger').remove();

                        if (response.status === 422) {
                            // Validation errors
                            var errors = response.responseJSON.errors;
                            for (var field in errors) {
                                // Find the input field and add the error message
                                let key = field;
                                let parts = key.split('.');
                                let input_name = parts[0]; // "input field name value"
                                let index = parts[1];
                                if (index) {
                                    var $input = $('[name="' + input_name + '[]"]')[index];
                                    let span = document.createElement("span");
                                    span.classList.add("text-danger");
                                    span.innerText = errors[field][0];
                                    $input.parentElement.appendChild(span);
                                } else {
                                    var $input = $('[name="' + field + '"]');
                                    let span = document.createElement("span");
                                    span.classList.add("text-danger");
                                    span.innerText = errors[field][0];
                                    $input[0].parentElement.appendChild(span);
                                }
                                toastr.error(errors[field][0]);

                            }
                        } else {
                            toastr.error('An unexpected error occurred.');
                        }

                        // Re-enable submit button
                    }
                });
            });

            // 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) {

                            $('#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);
                    }
                });

            });




            // Load data
            function loadData() {
                $.ajax({
                    method: 'GET',
                    url: "{{ route('student-promotions.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: false, // Disable responsive to prevent conflicts
                            // scrollX: true, // Enable horizontal scrolling
                        });

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

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


            // Initial load
            loadData();
        });
    </script>
@endpush