@extends('site.layouts.app')

@section('title', 'Patient Registration')

@section('stylesheets')
    <link rel="stylesheet" href="https://cdn.datatables.net/1.11.5/css/dataTables.bootstrap5.min.css" />
    <link rel="stylesheet" href="https://cdn.datatables.net/responsive/2.2.9/css/responsive.bootstrap.min.css" />
    <link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.2.2/css/buttons.dataTables.min.css">
    <style type="text/css">
        .product-wrapper {
            display: flex;
        }

        .datatable .text-wrap {
            white-space: normal;
            min-width: 300px;
            max-width: 300px;
        }
    </style>
@endsection

@section('content')
    <div class="row">
        <div class="col-12">
            <div class="page-title-box d-sm-flex align-items-center justify-content-between">
                <h4 class="mb-sm-0">Patient Inactive</h4>
                <div class="page-title-right">
                    <ol class="breadcrumb m-0">
                        <li class="breadcrumb-item">
                            <a href="{{ route('site.home', ['site' => $site->slug]) }}">Home</a>
                        </li>
                        <li class="breadcrumb-item active">Patient Inactive</li>
                    </ol>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="overlay d-none">
            <div class="spinner-border" role="status">
                <span class="sr-only">Loading...</span>
            </div>
        </div>
        <div class="col-lg-12">
            <div class="card">
                <div class="card-header">
                    <div class="d-flex align-items-center flex-wrap gap-2">
                        <div class="flex-grow-1">
                        </div>
                        <div class="flex-shrink-0">
                            <div class="hstack text-nowrap gap-2">
                                <a href="#" onclick="refresh()" class="btn btn-success">
                                    <i class="ri-restart-line me-1 align-bottom"></i> Refresh
                                </a>
                                <a href="#" onclick="filter()" class="btn btn-danger">
                                    <i class="ri-filter-2-line me-1 align-bottom"></i> Filter
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h5 class="card-title mb-0">Total Data Patient Registration : <span id="total-data">000</span></h5>
                </div>
                <div class="card-body">
                    <table class="table table-bordered nowrap table-striped align-middle no-footer dtr-inline datatable"
                        style="width:100%">
                        <thead>
                            <tr>
                                <th width="10">No</th>
                                <th width="100">Registration</th>
                                <th width="100">Room</th>
                                <th width="10">Fasting</th>
                                <th width="10">Diet</th>
                                <th width="10">Texture</th>
                                <th width="10">Alergy</th>
                                <th width="100">Note</th>
                                <th width="10">Diagnosa</th>
                                {{-- <th width="100">Class</th> --}}
                                <th width="100">Payment Source</th>
                                <th width="10">Registration Date</th>
                                <th width="10">Last Modified</th>
                                <th width="10">Medical Discharge</th>
                                <th width="10">Doctor</th>
                                <th width="10">Status</th>
                                <th width="10">Status Process</th>
                                <th width="10">Aksi</th>
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <div class="offcanvas offcanvas-end" tabindex="-1" id="searchCanvas" aria-labelledby="searchCanvasLabel">
        <div class="offcanvas-header bg-light">
            <h5 class="offcanvas-title" id="searchCanvasLabel">Filter</h5>
            <button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button>
        </div>
        <!--end offcanvas-header-->
        <div class="offcanvas-body">
            <form id="form-search" autocomplete="off">
                <div class="mb-4">
                    <label class="control-label" for="code">Registration No.</label>
                    <input type="code" name="code" class="form-control" placeholder="Registration No.">
                </div>
                {{-- <div class="mb-4">
                    <label class="control-label" for="patient_id">Registration Date</label>
                    <div class="row">
                        <div class="col-6">
                            <div class="input-group">
                                <input type="text" name="start_date" id="start_date" class="form-control flatpickr"
                                    placeholder="Start Date" data-provider="flatpickr" data-date-format="d/m/Y">
                            </div>
                        </div>
                        <div class="col-6">
                            <div class="input-group">
                                <input type="text" name="finish_date" id="finish_date" class="form-control flatpickr"
                                    placeholder="Finish Date" data-provider="flatpickr" data-date-format="d/m/Y">
                            </div>
                        </div>
                    </div>
                </div> --}}
                <div class="mb-4">
                    <label class="control-label" for="patient_id">Patient</label>
                    <select class="form-control select2" name="patient_id" id="patient_id"
                        data-placeholder="Select Patient">
                    </select>
                </div>
                <div class="mb-4">
                    <label class="control-label" for="room_id">Room</label>
                    <select class="form-control select2" name="room_id" id="room_id" data-placeholder="Select Room">
                    </select>
                </div>
                <div class="mb-4">
                    <label class="control-label" for="ward_id">Ward</label>
                    <select class="form-control select2" name="ward_id" id="ward_id" data-placeholder="Select Ward">
                    </select>
                </div>
                <div class="mb-4">
                    <label class="control-label" for="class_id">Class</label>
                    <select class="form-control select2" name="class_id" id="class_id" data-placeholder="Select Class">
                    </select>
                </div>
                <div class="mb-4">
                    <label class="control-label" for="class_id">Fasting</label>
                    <select class="form-control select2" name="fasting" id="fasting" data-placeholder="fasting">
                        <option value="0">All</option>
                        <option value="Y">Yes</option>
                        <option value="N">No</option>
                    </select>
                </div>
                {{-- <div class="mb-4">
                    <label class="control-label" for="class_id">Status</label>
                    <select class="form-control select2" name="status" id="status" data-placeholder="status">
                        <option value="active" selected>Active</option>
                        <option value="non-active">Non-Active</option>
                        <option value="">All</option>
                    </select>
                </div> --}}
                {{-- <div class="mb-3">
                    <label class="control-label" for="process">Process Status</label>
                    <select name="process" id="process" class="form-control" data-placeholder="Select Process Status"
                        placeholder="Select Process Status">
                        <option value="DIPROSES">Diproses</option>
                        <option value="BELUM_DIPROSES" selected>Belum Diproses</option>
                    </select>
                </div> --}}
            </form>
        </div>
        <!--end offcanvas-body-->
        <div class="offcanvas-footer border-top p-3 d-grid">
            <div class="row">
                {{-- <div class="col-6">
                    <button onclick="exportData()" class="btn btn-success me-1 w-100">
                        <i class="fa fa-file-export me-1"></i> Export
                    </button>
                </div> --}}
                <div class="col-12">
                    <button form="form-search" type="submit" class="btn btn-primary w-100" title="Apply">
                        <i class="ri-search-line"></i>
                        Filter
                    </button>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="create-print" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-md">
            <div class="modal-content">
                <div class="modal-header no-print">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                    <h4 class="modal-title">Cetak</h4>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <iframe id="bodyReplace" scrolling="no" allowtransparency="true"
                            style="width: 69%; border-width: 0px; position: relative; margin: 0 auto; display: block;"
                            onload="this.style.height=(this.contentDocument.body.scrollHeight+45) +'px';"></iframe>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('scripts')
    <script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.11.5/js/dataTables.bootstrap5.min.js"></script>
    <script src="https://cdn.datatables.net/responsive/2.2.9/js/dataTables.responsive.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/2.2.2/js/dataTables.buttons.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/2.2.2/js/buttons.print.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/2.2.2/js/buttons.html5.min.js"></script>
    <script>
        function exportData() {
            var code = $('#form-search').find('input[name=code]').val();
            var patient_id = $('#patient_id').val();
            var room_id = $('#room_id').val();
            var ward_id = $('#ward_id').val();
            var class_id = $('#class_id').val();
            var start_date = $('#start_date').val();
            var finish_date = $('#finish_date').val();
            var fasting = $('#fasting').val();
            var status = $('#status').val();
            var process_status = $('#process').val();


            var data = {
                code: code,
                patient_id: patient_id,
                room_id: room_id,
                ward_id: ward_id,
                class_id: class_id,
                start_date: start_date,
                finish_date: finish_date,
                fasting: fasting,
                status: status,
                process_status: process_status
            };

            $.ajax({
                url: `{{ url($site->slug . '/patientregistration/export') }}`,
                dataType: 'json',
                data: data,
                type: 'GET',
                beforeSend: function() {
                    $('.overlay').removeClass('d-none');
                }
            }).done(function(response) {
                if (response.status) {
                    $('.overlay').addClass('d-none');
                    Swal.fire({
                        title: "Success!",
                        text: "Your file has been export",
                        icon: "success",
                        confirmButtonClass: "btn btn-primary w-xs mt-2",
                        buttonsStyling: !1
                    })
                    // $('#show_process_modal').modal('hide');
                    $('#searchCanvas').offcanvas('hide');
                    let download = document.createElement("a");
                    download.href = response.file;
                    document.body.appendChild(download);
                    download.download = response.name;
                    download.click();
                    download.remove();
                } else {
                    Swal.fire({
                        title: "Error!",
                        text: response.message,
                        icon: "error",
                        confirmButtonClass: "btn btn-primary w-xs mt-2",
                        buttonsStyling: !1
                    })
                }
            }).fail(function(response) {
                var response = response.responseJSON;
                $('.overlay').addClass('d-none');
                Swal.fire({
                    title: "Error!",
                    text: response.message,
                    icon: "error",
                    confirmButtonClass: "btn btn-primary w-xs mt-2",
                    buttonsStyling: !1
                })
            });
        }

        function filter() {
            $('#status').select2({
                dropdownParent: $("#searchCanvas"),
                allowClear: true,
            });
            $('#process').select2({
                dropdownParent: $("#searchCanvas"),
                allowClear: true,
            });
            $('#searchCanvas').offcanvas('show');
        }

        function diproses($id) {
            $.ajax({
                url: `{{ url($site->slug . '/patientregistration/diproses') }}/${$id}`,
                method: 'GET',
                beforeSend: function() {
                    $('.overlay').removeClass('d-none');
                },
                success: function(response) {
                    $('.overlay').addClass('d-none');
                    Swal.fire({
                        title: "Success!",
                        text: "Your file has been updated.",
                        icon: "success",
                        confirmButtonClass: "btn btn-primary w-xs mt-2",
                        buttonsStyling: !1
                    })
                    dataTable.ajax.reload(null, false);
                },
                error: function() {
                    $('.overlay').addClass('d-none');
                    Swal.fire({
                        title: "Error!",
                        text: response.message,
                        icon: "error",
                        confirmButtonClass: "btn btn-primary w-xs mt-2",
                        buttonsStyling: !1
                    })
                }
            });
        }

        function refresh() {
            $('.datatable').DataTable().ajax.reload();
        }

        function print(id) {
            $.ajax({
                url: `{{ url($site->slug . '/patientregistration/print') }}/${id}`,
                method: 'GET',
                beforeSend: function() {
                    $('.overlay').removeClass('d-none');
                },
                success: function(response) {
                    $('#exportCanvas').offcanvas('hide');
                    var iframe = document.getElementById('bodyReplace');
                    var iframeWindow = iframe.contentWindow || iframe.contentDocument.document || iframe
                        .contentDocument;

                    iframeWindow.document.open();
                    iframeWindow.document.write(response);
                    iframeWindow.document.close();

                    setTimeout(function() {
                        $('.overlay').addClass('d-none');
                    }, 5000);
                },
                error: function() {
                    $('.overlay').addClass('d-none');
                }
            });
        }

        $(function() {
            const params = new URLSearchParams(window.location.search);
            // const initialStatus = params.get('status') || 'active';
            // const initialProcess = params.get('process_status') || 'BELUM_DIPROSES';

            // if (params.has('status')) {
            //     $('#status').val(initialStatus);
            // }
            if (params.has('process_status')) {
                $('#process').val("");
                $('#status, #process')
                    .on('change', () => $('.datatable').DataTable().ajax.reload());
            }

            $(".select2").select2();

            $('select#patient_id').select2({
                width: 'resolve',
                placeholder: 'Patient',
                ajax: {
                    url: `{{ route('site.patient.select', ['site' => $site->slug]) }}`,
                    type: 'GET',
                    dataType: 'json',
                    data: (params) => {
                        return {
                            name: params.term,
                            page: params.page,
                            limit: 20
                        };
                    },
                    processResults: function(data, params) {
                        params.page = params.page || 1;
                        var option = [];
                        $.each(data.rows, function(index, item) {
                            option.push({
                                id: item.id,
                                text: `${item.name}`,
                            });
                        });
                        return {
                            results: option,
                            pagination: {
                                more: (params.page * 30) < data.total
                            },
                        };
                    },
                },
                allowClear: true,
                dropdownParent: $("#searchCanvas"),
            });

            $('select#ward_id').select2({
                width: 'resolve',
                placeholder: 'Ward',
                ajax: {
                    url: `{{ route('site.ward.select', ['site' => $site->slug]) }}`,
                    type: 'GET',
                    dataType: 'json',
                    data: (params) => {
                        return {
                            name: params.term,
                            page: params.page,
                            limit: 20
                        };
                    },
                    processResults: function(data, params) {
                        params.page = params.page || 1;
                        var option = [];
                        $.each(data.rows, function(index, item) {
                            option.push({
                                id: item.id,
                                text: `${item.name}`,
                            });
                        });
                        return {
                            results: option,
                            pagination: {
                                more: (params.page * 30) < data.total
                            },
                        };
                    },
                },
                allowClear: true,
                dropdownParent: $("#searchCanvas"),
            });

            $('select#class_id').select2({
                width: 'resolve',
                placeholder: 'Class',
                ajax: {
                    url: `{{ route('site.class.select', ['site' => $site->slug]) }}`,
                    type: 'GET',
                    dataType: 'json',
                    data: (params) => {
                        return {
                            name: params.term,
                            page: params.page,
                            limit: 20
                        };
                    },
                    processResults: function(data, params) {
                        params.page = params.page || 1;
                        var option = [];
                        $.each(data.rows, function(index, item) {
                            option.push({
                                id: item.id,
                                text: `${item.name}`,
                            });
                        });
                        return {
                            results: option,
                            pagination: {
                                more: (params.page * 30) < data.total
                            },
                        };
                    },
                },
                allowClear: true,
                dropdownParent: $("#searchCanvas"),
            });

            $('select#room_id').select2({
                width: 'resolve',
                placeholder: 'Room',
                ajax: {
                    url: `{{ route('site.room.select', ['site' => $site->slug]) }}`,
                    type: 'GET',
                    dataType: 'json',
                    data: (params) => {
                        return {
                            name: params.term,
                            page: params.page,
                            limit: 20
                        };
                    },
                    processResults: function(data, params) {
                        params.page = params.page || 1;
                        var option = [];
                        $.each(data.rows, function(index, item) {
                            option.push({
                                id: item.id,
                                text: `${item.room_no}`,
                            });
                        });
                        return {
                            results: option,
                            pagination: {
                                more: (params.page * 30) < data.total
                            },
                        };
                    },
                },
                allowClear: true,
                dropdownParent: $("#searchCanvas"),
            });

            dataTable = $('.datatable').DataTable({
                // stateSave: true,
                processing: true,
                serverSide: true,
                filter: false,
                info: false,
                lengthChange: true,
                scrollY: '400px',
                responsive: false,
                scrollX: true,
                scrollCollapse: true,
                fixedHeader: true,
                order: [
                    [1, "asc"]
                ],
                ajax: {
                    url: "{{ route('site.patientinactive.read', ['site' => $site->slug]) }}",
                    type: "GET",
                    data: function(data) {
                        var code = $('#form-search').find('input[name=code]').val();
                        var patient_id = $('#patient_id').val();
                        var room_id = $('#room_id').val();
                        var ward_id = $('#ward_id').val();
                        var class_id = $('#class_id').val();
                        // var start_date = $('#start_date').val();
                        // var finish_date = $('#finish_date').val();
                        var fasting = $('#fasting').val();
                        var status = $('#status').val();
                        var process_status = $('#process').val();
                        data.code = code;
                        data.patient_id = patient_id;
                        data.room_id = room_id;
                        data.ward_id = ward_id;
                        data.class_id = class_id;
                        // data.start_date = start_date;
                        // data.finish_date = finish_date;
                        data.fasting = fasting;
                        data.status = status;
                        data.process_status = process_status;
                    },
                    dataSrc: function(json) {
                        $('#total-data').html(json.recordsTotal);
                        return json.data;
                    },
                },
                columnDefs: [{
                        orderable: false,
                        targets: [0, 16]
                    },
                    {
                        className: "text-center",
                        targets: [0, 15, 16]
                    },
                    {
                        className: "text-wrap",
                        targets: [13]
                    },
                    {
                        render: function(data, type, row) {
                            var reg = "";
                            reg += `<b>${row.patient.title} ${row.patient.name}</b>`;
                            reg += `<br><b>reg : </b>${row.code}`;
                            reg += `<br><b>MR : </b>${row.patient.code}`;
                            reg += `<br><b>Gender : </b>${row.patient.sex}`;
                            reg += `<br><b>Register Date : </b>${row.start_date}`;
                            reg += `<br><b>Medical Discharge : </b>${row.finish_date}`;
                            return reg;
                        },
                        targets: [1],
                    },
                    {
                        render: function(data, type, row) {
                            return `<b>Ward : </b>${row.ward.name}<br><b>Room : </b>${row.room_no}`;
                        },
                        targets: [2],
                    },
                    {
                        render: function(data, type, row) {
                            var fasting = "-";
                            if (row.fasting) {
                                fasting = (row.fasting != "Y") ?
                                    '<span class="badge text-capitalize bg-danger">No</span>' :
                                    '<span class="badge text-capitalize bg-success">Yes</span>';
                            }
                            if (row.end_fasting) {
                                fasting += ` | end : ${row.end_fasting}`;
                            }
                            return `${fasting}`;
                        },
                        targets: [3],
                    },
                    {
                        render: function(data, type, row) {
                            var diits = "";
                            if (row.diits) {
                                for (let i = 0; i < row.diits.length; i++) {
                                    diits += `${row.diits[i].name} <br>`;
                                }
                            }
                            return `${diits ?? "-"}`;
                        },
                        targets: [4],
                    },
                    {
                        render: function(data, type, row) {
                            return `${row.food_texture ?? "-"}`;
                        },
                        targets: [5],
                    },
                    {
                        render: function(data, type, row) {
                            var alergy = "-";
                            if (row.patient) {
                                alergy = `${row.patient.alergy ?? "-"}`;
                            }
                            return `${alergy}`;
                        },
                        targets: [6],
                    },
                    {
                        render: function(data, type, row) {
                            return row.patient.note ?? "-";
                        },
                        targets: [7],
                    },
                    {
                        render: function(data, type, row) {
                            return `${row.diagnosa ?? "-"}`;
                        },
                        targets: [8],
                    },

                    // {
                    //     render: function(data, type, row) {
                    //         return `${row.class.name}`;
                    //     },
                    //     targets: [9],
                    // },
                    {
                        render: function(data, type, row) {
                            return `${row.r_penjamin ? row.r_penjamin.name : "-"}`;
                        },
                        targets: [9],
                    },
                    {
                        render: function(data, type, row) {
                            return `${row.start_date}`;
                        },
                        targets: [10],
                    },
                    {
                        render: function(data, type, row) {
                            return `<div>
                                        <span>${row.updated_at}</span>
                                        <br>
                                        <span class="text-sm text-muted">updated by: ${row.updated_by ?? "-"}</span>
                                    </div>`;
                        },
                        targets: [11],
                    },
                    {
                        render: function(data, type, row) {
                            return `${row.finish_date ?? "-"}`;
                        },
                        targets: [12],
                    },
                    {
                        render: function(data, type, row) {
                            var doctor = "-";
                            if (row.doctor) {
                                doctor = `${row.doctor.name}`;
                            }
                            return `${doctor}`;
                        },
                        targets: [13],
                    },

                    {
                        render: function(data, type, row) {
                            return `${row.finish_date ? '<span class="badge text-capitalize bg-light" style="color:#000;">Non-Active</span>' : '<span class="badge text-capitalize bg-success">Active</span>'}`;
                        },
                        targets: [14],
                    },
                    {
                        render: function(data, type, row) {
                            var status_process =
                                `<span class="badge text-capitalize bg-danger">Belum Diproses</span>`;
                            if (row.status_process == "DIPROSES") {
                                status_process =
                                    `<span class="badge text-capitalize bg-success">Diproses</span>`;
                            }
                            return status_process;
                        },
                        targets: [15],
                    },
                    {
                        render: function(data, type, row) {
                            var showorder = "";
                            if (row.unique_id) {
                                showorder =
                                    `<li><a class="dropdown-item" href="{{ url($site->slug .'/orderinactive') }}/patient/${row.unique_id}" target="_blank"><i class="ri-shopping-cart-2-fill align-bottom me-2 text-muted"></i> Order Patient</a></li>
                                            <li><a class="dropdown-item" href="{{ url($site->slug .'/orderinactive') }}/companion/${row.unique_id}" target="_blank"><i class="ri-shopping-cart-2-fill align-bottom me-2 text-muted"></i> Order Companion</a></li>`;
                            }
                            var diproses = "";
                            if (row.status_process == "BELUM_DIPROSES") {
                                diproses =
                                    `<li><a class="dropdown-item" href="javascript:void(0);" onclick="diproses(${row.id})"><i class="ri-check-fill align-bottom me-2 text-muted"></i> Diproses</a></li>`;
                            } else {
                                diproses =
                                    `<li><a class="dropdown-item" href="javascript:void(0);" onclick="diproses(${row.id})"><i class="ri-close-fill align-bottom me-2 text-muted"></i> Belum Diproses</a></li>`;
                            }
                            return `
                                <div class="dropdown d-inline-block">
                                    <button class="btn btn-soft-secondary btn-sm dropdown" type="button" data-bs-toggle="dropdown" aria-expanded="false">
                                        <i class="ri-more-fill align-middle"></i>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li style="cursor:pointer"><a class="dropdown-item" onclick="print(${row.id})" target="_blank"><i class=" las la-file-pdf me-2"></i> Print</a></li>
                                        ${showorder}
                                    </ul>
                                </div>`;
                        },
                        targets: [16]
                    }
                ],
                columns: [{
                        data: "no"
                    },
                    {
                        data: "code"
                    },
                    {
                        data: "room_id"
                    },
                    {
                        data: "fasting"
                    },
                    {
                        data: "diet"
                    },
                    {
                        data: "food_texture"
                    },
                    {
                        data: "id"
                    },
                    {
                        data: "patient_id"
                    },
                    {
                        data: "diagnosa"
                    },
                    // { data: "class_id" },
                    {
                        data: "penjamin"
                    },
                    {
                        data: "start_date"
                    },
                    {
                        data: "updated_at"
                    },
                    {
                        data: "finish_date"
                    },
                    {
                        data: "doctor_id"
                    },
                    {
                        data: "status"
                    },
                    {
                        data: "status_process"
                    },
                    {
                        data: "id"
                    },
                ]
            });

            $('#form-search').submit(function(e) {
                e.preventDefault();
                dataTable.draw();
                $('#searchCanvas').offcanvas('hide');
            });
        });

        $(document).on('click', '.delete', function() {
            var id = $(this).data('id');
            Swal.fire({
                title: "Are you sure?",
                text: "You won't be able to revert this!",
                icon: "warning",
                showCancelButton: !0,
                confirmButtonClass: "btn btn-primary w-xs me-2 mt-2",
                cancelButtonClass: "btn btn-danger w-xs mt-2",
                confirmButtonText: "Yes, delete it!",
                buttonsStyling: !1,
                showCloseButton: !0,
            }).then(function(t) {
                if (t.value) {
                    var data = {
                        _token: "{{ csrf_token() }}",
                        _method: 'delete'
                    };
                    $.ajax({
                        url: `{{ url($site->slug . '/patientregistration') }}/${id}`,
                        dataType: 'json',
                        data: data,
                        type: 'POST',
                        beforeSend: function() {
                            $('.overlay').removeClass('d-none');
                        }
                    }).done(function(response) {
                        if (response.status) {
                            $('.overlay').addClass('d-none');
                            Swal.fire({
                                title: "Deleted!",
                                text: "Your file has been deleted.",
                                icon: "success",
                                confirmButtonClass: "btn btn-primary w-xs mt-2",
                                buttonsStyling: !1
                            })
                            dataTable.ajax.reload(null, false);
                        } else {
                            Swal.fire({
                                title: "Error!",
                                text: response.message,
                                icon: "error",
                                confirmButtonClass: "btn btn-primary w-xs mt-2",
                                buttonsStyling: !1
                            })
                        }
                    }).fail(function(response) {
                        var response = response.responseJSON;
                        $('.overlay').addClass('d-none');
                        Swal.fire({
                            title: "Error!",
                            text: response.message,
                            icon: "error",
                            confirmButtonClass: "btn btn-primary w-xs mt-2",
                            buttonsStyling: !1
                        })
                    })
                }
                //t.value && Swal.fire({ title: "Deleted!", text: "Your file has been deleted.", icon: "success", confirmButtonClass: "btn btn-primary w-xs mt-2", buttonsStyling: !1 });
            });
        });
    </script>
@endpush