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}`)
    $("#akses_id_edit").val(data.akses === 1 ? 'all' : 'unit')
    selectAksesEdit()

    selectOptionPegawaiEdit()
    selectOptionUnitEdit()
    if (data.pegawai_id) {
        setOldSelect2Value('#pegawai_id_edit', data.pegawai_id, data.pegawai_nama);
    }

    if (data.unit_id) {
        setOldSelect2Value('#unit_akses_edit', data.unit_id, data.unit_nama);
    }
}


document.addEventListener('change', function(e){
    e.preventDefault()
    if(e.target){
        selectAksesEdit()
    }
})

function selectAksesEdit(){
      let aksesId = $(`#akses_id_edit`);
      let colUnit = $(`#col_select_unit_edit`)
      if(aksesId.val() === "all"){
        colUnit.addClass('d-none')
      }else{
        colUnit.removeClass('d-none')
      }
}


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 selectOptionUnitEdit(oldId = null) {
    let selectUnit = $(`#unit_akses_edit`);
    // inisialisasi select2 untuk Unit Kerja
    selectUnit.select2({
        placeholder: '-- Pilih Unit --',
        allowClear:true,
        width: '100%',
        dropdownParent: selectUnit.parent(),
        ajax:{
            url : '/select-unit-kerja-option',
            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,
    });

      if (oldId) {
        $.ajax({
            url: '/select-unit-kerja',
            data: { id: oldId },
            dataType: 'json'
        }).then(function (data) {
            if (data?.data?.length) {
                let item = data.data[0];
                let option = new Option(item.name, item.id, true, true);
                selectUnit.append(option).trigger('change');
            }
        });
    }
}


function setOldSelect2Value(selector, id, text) {
    if (!id || !text) return;
    let option = new Option(text, id, true, true);
    $(selector).append(option).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
            });
        }
    });
});