project_directory/public/js/akses/action.js

formCreateAkses.on('submit', function(e){
    e.preventDefault();

    const form = this;
    const formData = new FormData(form);

    fetch(`/akses`, {
        method: 'POST',
        headers: {
            'X-CSRF-TOKEN': document.querySelector('input[name="_token"]').value,
        },
        body: formData
    }).then(async(res) => {
        const responseData = await res.json();
        if (responseData.status) {
            const handler = function () {
                Swal.fire({
                    icon: 'success',
                    title: 'Berhasil',
                    text: responseData.message || 'Berhasil melakukan aksi!',
                    timer: 2000,
                    showConfirmButton: false,
                    backdrop: true,
                });
                $("#col_add_akses").html('');
                colCount = 1; // reset counter
                formCreateAkses.find('select').val(null).trigger('change');
                datatableAkses.bootstrapTable('refresh');
                modalCreate.removeEventListener('hidden.bs.modal', handler);
            };
            modalCreate.addEventListener('hidden.bs.modal', handler);
            bootstrap.Modal.getInstance(modalCreate).hide();
        } else {
            throw new Error(responseData.message || 'Terjadi kesalahan saat menyimpan data.');
        }

    }).catch(err => {
        if (err.message) {
            Swal.fire({
                icon: 'error',
                title: 'Gagal',
                text: err.message
            });
        }
    });
});


function deleteAkses(e){
    let id =$(e).data('akses_file_id')
    Swal.fire({
        title: "Apakah kamu yakin ingin menghapus akses?",
        text : $(e).data('name') + ' sebagai ' + $(e).data('akses'),
        icon: "warning",
        showCancelButton: true,
        backdrop: true,
    }).then((result) => {
        if(result.isConfirmed){
            fetch(`/akses/${id}`, {
                method:'DELETE',
                headers: {
                    "X-CSRF-TOKEN": document.querySelector('input[name="_token"]').value,
                    "Content-Type": "application/json"
                }
            }).then((response) => {
                if(!response.ok){
                    throw new Error("Network response was not ok");
                }
                return response.json();
            })
            .then((data) => {
                if(data.status){
                    Swal.fire({
                        title: "Success",
                        text: "Data berhasil dihapus",
                        icon:"success",
                        showConfirmButton: false,
                        timer: 1000
                    }).then(() => {
                        datatableAkses.bootstrapTable("refresh")
                    })
                }else{
                    Swal.fire({
                        title: "Error!",
                        text: data.message || "Failed to delete Item.",
                        icon: "error"
                    });
                }
            })
            .catch(error => {
                Swal.fire({
                    title: "Error!",
                    text: "Something went wrong. Please try again later.",
                    icon: "error"
                });
            });
        }
    })
}


function editAkses(e){
    const data = $(e).data();
    new bootstrap.Modal(modalEdit).show();
    formEditAkses.attr('action', `/akses/${data.akses_file_id}`)
    $("#unit_akses_edit").empty().trigger('change');
    $("#unit_akses_wrapper_edit").addClass('d-none');
    $("#master_akses_edit").prop("checked", data.master_akses == 1)
    selectOptionPegawaiEdit()
    selectOptionUnitKerjaEdit()
    if (data.pegawai_id) {
        setOldSelect2Value('#pegawai_id_edit', data.pegawai_id, data.pegawai_nama);
    }

    fetch(`/akses/${data.akses_file_id}`)
        .then(async(res) => {
            const responseData = await res.json();
            if (!responseData.status) {
                throw new Error(responseData.message || 'Gagal memuat data akses.');
            }
            const detail = responseData.data;
            if (detail?.akses_type === 'all') {
                $("#akses_all_edit").prop('checked', true);
            } else {
                $("#akses_unit_edit").prop('checked', true);
            }
            toggleUnitAksesEdit();
            if (detail?.akses_type === 'unit' && Array.isArray(detail.units)) {
                setOldSelect2Values('#unit_akses_edit', detail.units);
            }
        })
        .catch(() => {
            $("#akses_all_edit").prop('checked', true);
            toggleUnitAksesEdit();
        });
}



function selectOptionPegawaiEdit() {
    let selectPegawai = $(`#pegawai_id_edit`);
    // inisialisasi select2 untuk Unit Kerja
    selectPegawai.select2({
        placeholder: '-- Pilih Pegawai --',
        allowClear:true,
        width: '100%',
        dropdownParent: selectPegawai.parent(),
        ajax:{
            url : '/select-pegawai',
            dataType: 'json',
            delay: 250,
            data: function(params){
                return { q: params.term }
            },
            processResults: function(data){
                return {
                    results : data?.data.map(item => ({
                        id: item.id,
                        text: item.nama,
                    }))
                }
            },
            cache: true,
        },
        minimumInputLength: 1,
    });
}

function selectOptionUnitKerjaEdit() {
    let selectUnit = $(`#unit_akses_edit`);
    if (selectUnit.data('select2')) return;
    selectUnit.select2({
        placeholder: '-- Pilih Unit Kerja --',
        allowClear:true,
        width: '100%',
        dropdownParent: selectUnit.parent(),
        ajax:{
            url : '/select-unit-kerja',
            dataType: 'json',
            delay: 250,
            data: function(params){
                return { q: params.term }
            },
            processResults: function(data){
                return {
                    results : data?.data.map(item => ({
                        id: item.id,
                        text: item.name,
                    }))
                }
            },
            cache: true,
        },
        minimumInputLength: 1,
    });
}

function toggleUnitAksesEdit() {
    const wrapper = $("#unit_akses_wrapper_edit");
    const unitSelect = $("#unit_akses_edit");
    const isUnit = $("#akses_unit_edit").is(':checked');
    if (isUnit) {
        wrapper.removeClass('d-none');
    } else {
        wrapper.addClass('d-none');
        unitSelect.val(null).trigger('change');
    }
}


function setOldSelect2Value(selector, id, text) {
    if (!id || !text) return;
    let option = new Option(text, id, true, true);
    $(selector).append(option).trigger('change')
}

function setOldSelect2Values(selector, items) {
    if (!Array.isArray(items) || items.length === 0) return;
    items.forEach(item => {
        if (!item?.id || !item?.text) return;
        let option = new Option(item.text, item.id, true, true);
        $(selector).append(option);
    });
    $(selector).trigger('change')
}


formEditAkses.on('submit', function(e){
    e.preventDefault();

    const form = this;
    const actionUrl = formEditAkses.attr('action');
    const formData = new FormData(form);
    formData.append('_method', 'PUT')
    fetch(actionUrl, {
        method: 'POST',
        headers: {
            'X-CSRF-TOKEN': document.querySelector('input[name="_token"]').value,
        },
        body: formData
    }).then(async(res) => {
        const responseData = await res.json();

        if (responseData.status) {
            const handler = function () {
                Swal.fire({
                    icon: 'success',
                    title: 'Berhasil',
                    text: responseData.message || 'Berhasil melakukan aksi!',
                    timer: 2000,
                    showConfirmButton: false,
                    backdrop: true,
                });
                formCreateAkses.find('select').val(null).trigger('change');
                datatableAkses.bootstrapTable('refresh');
                datatableAkses.bootstrapTable('refresh');
                modalEdit.removeEventListener('hidden.bs.modal', handler);
            };
            modalEdit.addEventListener('hidden.bs.modal', handler);
            bootstrap.Modal.getInstance(modalEdit).hide();
        } else {
            throw new Error(responseData.message || 'Terjadi kesalahan saat menyimpan data.');
        }

    }).catch(err => {
        if (err.message) {
            Swal.fire({
                icon: 'error',
                title: 'Gagal',
                text: err.message
            });
        }
    });
});