$(document).ready(function () {
    // Initialize DataTable
    var table = $("#mutations-table").DataTable({
        processing: true,
        serverSide: true,
        ajax: {
            url: $("#mutations-table").data("url"),
            type: "GET",
        },
        columns: [
            {
                data: "DT_RowIndex",
                name: "DT_RowIndex",
                orderable: false,
                searchable: false,
                width: "5%",
            },
            {
                data: "mutation_number",
                name: "mutation_number",
                width: "12%",
            },
            {
                data: "created_at",
                name: "created_at",
                width: "12%",
            },
            {
                data: "from_dealer",
                name: "fromDealer.name",
                width: "13%",
            },
            {
                data: "to_dealer",
                name: "toDealer.name",
                width: "13%",
            },
            {
                data: "requested_by",
                name: "requestedBy.name",
                width: "12%",
            },
            {
                data: "total_items",
                name: "total_items",
                width: "8%",
                className: "text-center",
            },
            {
                data: "status",
                name: "status",
                width: "12%",
                className: "text-center",
            },
            {
                data: "action",
                name: "action",
                orderable: false,
                searchable: false,
                width: "20%",
                className: "text-center",
            },
        ],
        order: [[2, "desc"]], // Order by created_at desc
        pageLength: 10,
        responsive: true,
    });

    // Modal event handlers are now handled by Bootstrap 5 data attributes
    // No need for manual modal show/hide handlers

    // Handle Cancel Button Click with SweetAlert
    $(document).on("click", ".btn-cancel", function () {
        var mutationId = $(this).data("id");

        if (typeof Swal !== "undefined") {
            Swal.fire({
                title: "Batalkan Mutasi?",
                text: "Apakah Anda yakin ingin membatalkan mutasi ini?",
                icon: "warning",
                showCancelButton: true,
                confirmButtonColor: "#d33",
                cancelButtonColor: "#3085d6",
                confirmButtonText: "Ya, Batalkan",
                cancelButtonText: "Batal",
            }).then((result) => {
                if (result.isConfirmed) {
                    cancelMutation(mutationId);
                }
            });
        } else {
            if (confirm("Apakah Anda yakin ingin membatalkan mutasi ini?")) {
                cancelMutation(mutationId);
            }
        }
    });

    function cancelMutation(mutationId) {
        $.ajax({
            url: "/warehouse/mutations/" + mutationId + "/cancel",
            type: "POST",
            data: {
                _token: $('meta[name="csrf-token"]').attr("content"),
            },
            success: function (response) {
                if (typeof Swal !== "undefined") {
                    Swal.fire({
                        title: "Berhasil!",
                        text: "Mutasi berhasil dibatalkan",
                        icon: "success",
                        timer: 2000,
                        showConfirmButton: false,
                    });
                } else {
                    alert("Mutasi berhasil dibatalkan");
                }
                table.ajax.reload();
            },
            error: function (xhr) {
                var errorMsg =
                    xhr.responseJSON?.message || "Gagal membatalkan mutasi";
                if (typeof Swal !== "undefined") {
                    Swal.fire({
                        title: "Error!",
                        text: errorMsg,
                        icon: "error",
                    });
                } else {
                    alert("Error: " + errorMsg);
                }
            },
        });
    }

    // Handle form submissions with loading state
    $(document).on("submit", ".approve-form", function () {
        $(this)
            .find('button[type="submit"]')
            .prop("disabled", true)
            .html("Memproses...");
    });

    // Validate quantity approved in receive modal
    $(document).on("input", 'input[name*="quantity_approved"]', function () {
        var maxValue = parseFloat($(this).attr("max"));
        var currentValue = parseFloat($(this).val());

        if (maxValue && currentValue > maxValue) {
            $(this).val(maxValue);
            $(this).addClass("is-invalid");
            if (!$(this).siblings(".invalid-feedback").length) {
                $(this).after(
                    '<div class="invalid-feedback">Quantity tidak boleh melebihi yang diminta</div>'
                );
            }
        } else {
            $(this).removeClass("is-invalid");
            $(this).siblings(".invalid-feedback").remove();
        }
    });
});