@extends('layouts.master')

@section('title', __('frontend.guardian_feedback'))

@section('content_title', __('frontend.guardian_feedback'))

@section('content_summary', 'frontend summary')

@section('content_taskbar')
    <li class="nav-item">
        <a href="{{ route('frontend.guardian_feedback.create') }}" class="nav-link modal-triger" data-bs-toggle="modal"
            data-bs-target="#basicModal">
            <i class="nav-link-icon pe-7s-plus"></i>
            <span>{{ __('core.add') }}</span>
        </a>
    </li>
@endsection

@section('main_content')
    <div class="main-card ">
        @if (auth()->user()->hasRole('Super Admin'))
            <div class="card mb-3">
                <div class="card-body ">
                    <form id="filter_form">
                        <div class="row">
                            <div class="col-12 col-md-3 mb-3">
                                <label for="" class="form-label">{{ __('core.business') }}</label>
                                <select class="form-select filter_input" name="business_id" id="business_id">
                                    @foreach ($data['business_list'] as $key => $value)
                                        <option value="{{ $key }}">{{ $value }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        @endif


        <div class="card mb-3">
            <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>
                    @if (auth()->user()->can('frontend.services.trash_view'))
                        <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>
                    @endif
                </ul>
                <div class="tab-content">
                    <div class="tab-pane active" id="tab-eg10-0" role="tabpanel">
                        @include('frontend::guardian_feedback.partials.list')
                    </div>
                    @if (auth()->user()->can('frontend.services.trash_view'))
                        <div class="tab-pane" id="tab-eg10-1" role="tabpanel">
                            @include('frontend::guardian_feedback.partials.trash_list')
                        </div>
                    @endif
                </div>
            </div>
        </div>


    </div>
@endsection
@push('script')
    <script type="text/javascript">
        $(document).ready(function() {

            var Load_data_params = {
                "business_id": "{{ auth()->user()->business_id }}"
            }


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

            // modal open close
            $(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() {
                        modal.find(".modal-dialog").html(
                            '<div class="modal-content"><div class="modal-header"></div><div class="modal-body"><div class="text-center p-4">Something went wrong. Please try again.</div></div><div><div class="modal-footer"><button class="btn btn-default" data-bs-dismiss="modal">{{ __('core.close') }}</button></div>'
                        );

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


            $('#home_table').DataTable({
                responsive: false
            });

            $('#trash_table').DataTable({
                responsive: false
            });

            $(document).on('submit', 'form#form', function(e) {
                e.preventDefault();
                var form = this;
                var formData = new FormData(form);

                // Disable submit button to prevent double submission
                // $(form).find('button[type="submit"]').attr('disabled', true);

                $.ajax({
                    method: $(form).attr('method'),
                    url: $(form).attr('action'),
                    data: formData,
                    contentType: false, // Needed for file upload
                    processData: false, // Needed for file upload
                    dataType: "json",
                    success: function(result) {
                        if (result.success == true) {
                            $("#form").parent().closest('.modal').modal("hide");
                            toastr.success(result.msg);
                            loadData();
                        } else {
                            toastr.error(result.msg);

                        }
                    },
                    error: function(response) {
                        // Clear previous error messages
                        $(form).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 = $(form).find('[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 = $(form).find('[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
                    }
                });
            });


            $(document).on('click', 'button.toggle_show_online_button', function(e) {
                e.preventDefault();
                var data = $(this).serialize();
                data = {
                    "_token": "{{ csrf_token() }}"
                }
                Swal.fire({
                    // type: "warning",
                    title: "{{ __('core.sure') }}",
                    text: "{{ __('core.confirm_update_show_online') }}",
                    icon: "warning"
                }).then((willUpdate) => {
                    console.log(willUpdate)
                    if (willUpdate.isConfirmed) {
                        $.ajax({
                            url: $(this).attr("data-href"),
                            method: "PUT",
                            dataType: "json",
                            data: data,
                            success: function(result) {
                                console.log(result)
                                if (result.success == true) {
                                    toastr.success(result.msg);
                                    loadData();
                                } else {
                                    toastr.error(result.msg);
                                }
                            }
                        });
                    }
                })
            });
            $(document).on('click', 'button.toggle_status_button', function(e) {
                e.preventDefault();
                var data = $(this).serialize();
                data = {
                    "_token": "{{ csrf_token() }}"
                }
                Swal.fire({
                    // type: "warning",
                    title: "{{ __('core.sure') }}",
                    text: "{{ __('core.confirm_update_status') }}",
                    icon: "warning"
                }).then((willUpdate) => {
                    console.log(willUpdate)
                    if (willUpdate.isConfirmed) {
                        $.ajax({
                            url: $(this).attr("data-href"),
                            method: "PUT",
                            dataType: "json",
                            data: data,
                            success: function(result) {
                                console.log(result)
                                if (result.success == true) {
                                    toastr.success(result.msg);
                                    loadData();
                                } else {
                                    toastr.error(result.msg);
                                }
                            }
                        });
                    }
                })
            });

            // exams delete
            $(document).on('click', '.delete_button', function() {
                var url = $(this).data('href');
                Swal.fire({
                    title: "{{ __('core.sure') }}",
                    text: "{{ __('core.confirm_delete') }}",
                    icon: 'warning',
                    buttons: true,
                    dangerMode: true,
                }).then((willDelete) => {
                    if (willDelete.isConfirmed) {
                        var href = url;
                        var data = $(this).serialize();
                        data = {
                            "_token": "{{ csrf_token() }}"
                        }
                        $.ajax({
                            method: 'DELETE',
                            url: href,
                            dataType: 'json',
                            data: data,
                            success: function(result) {
                                if (result.success == true) {
                                    toastr.success(result.msg);
                                    loadData();
                                } else {
                                    swal({
                                        title: "{{ __('core.sure') }}",
                                        text: result.msg,
                                        icon: 'warning',
                                        buttons: true,
                                        dangerMode: true,
                                    }).then((willDelete) => {
                                        if (willDelete.isConfirmed) {
                                            var href = url;
                                            var data = {
                                                delete: 'all'
                                            };

                                            $.ajax({
                                                method: 'DELETE',
                                                url: href,
                                                dataType: 'json',
                                                data: data,
                                                success: function(
                                                    result) {
                                                    if (result
                                                        .success ==
                                                        true) {
                                                        toastr
                                                            .success(
                                                                result
                                                                .msg
                                                            );
                                                        loadData();
                                                    } else {
                                                        toastr
                                                            .error(
                                                                result
                                                                .msg
                                                            );
                                                    }
                                                },
                                            });
                                        }
                                    })
                                }
                            },
                        });
                    }
                });
            });

            // delete trash
            $(document).on('click', '.force_delete_button', function() {
                Swal.fire({
                    title: "{{ __('core.sure') }}",
                    text: "{{ __('core.confirm_force_delete') }}",
                    icon: 'warning',
                    buttons: true,
                    dangerMode: true,
                }).then((willDelete) => {
                    if (willDelete.isConfirmed) {
                        var href = $(this).data('href');
                        var data = $(this).serialize();
                        data = {
                            "_token": "{{ csrf_token() }}"
                        }
                        $.ajax({
                            method: 'DELETE',
                            url: href,
                            dataType: 'json',
                            data: data,
                            success: function(result) {
                                if (result.success == true) {
                                    toastr.success(result.msg);
                                    loadData();
                                } else {
                                    toastr.error(result.msg);
                                }
                            },
                        });
                    }
                });
            });

            // restore
            $(document).on('click', '.restore_button', function() {
                Swal.fire({
                    title: "{{ __('core.sure') }}",
                    text: "{{ __('core.confirm_restore') }}",
                    icon: 'warning',
                    buttons: true,
                    dangerMode: false,
                }).then((willRestore) => {
                    if (willRestore.isConfirmed) {
                        var href = $(this).data('href');
                        var data = $(this).serialize();
                        data = {
                            "_token": "{{ csrf_token() }}"
                        }
                        $.ajax({
                            method: 'POST',
                            url: href,
                            dataType: 'json',
                            data: data,
                            success: function(result) {
                                if (result.success == true) {
                                    toastr.success(result.msg);
                                    loadData();
                                } else {
                                    toastr.error(result.msg);
                                }
                            },
                        });
                    }
                });
            });


            $(".filter_input").on("change", function() {
                let form_data = $(".filter_form").serialize();
                let business_id = $(".filter_input").val();
                Load_data_params = {
                    "business_id": business_id
                }
                loadData()
            })

            // Load data
            function loadData(data = Load_data_params) {
                $.ajax({
                    method: 'POST',
                    url: "{{ route('frontend.guardian_feedback.loadData') }}",
                    data: data,
                    success: function(response) {

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

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

                        // Reinitialize the DataTable
                        $('#home_table').DataTable({
                            processing: true,
                            responsive: false,
                        });
                        $('#trash_table').DataTable({
                            processing: true,
                            responsive: false,
                        });
                    },
                    error: function(response) {
                        console.log(response);
                    }
                });
            }

            // Initial load
            loadData();

            // let business_id = $(".filter_input").val();
            // if (business_id) {
            //     loadData({
            //         "business_id": business_id
            //     })
            // } else {
            //     loadData()
            // }
        });
    </script>
@endpush