document.addEventListener("DOMContentLoaded", function () {
    const indicatorField = document.getElementById("indicator-field");
    const indicatorVal = new Choices(indicatorField);
    const indicatorEditField = document.getElementById("indicator-edit-field");
    window.indicatorEditVal = new Choices(indicatorEditField);
});

function updateData(rule) {
    var form = document.getElementById("edit-form");
    var categoryEditField = form.querySelector("#category-edit-field");
    var description = form.querySelector("#description-edit-field");
    var cf = form.querySelector("#cf-edit-field");
    form.action = "/data-aturan/" + rule.id;

    window.indicatorEditVal.setChoiceByValue(rule.indicator_id.toString());
    window.indicatorEditVal.passedElement.element.value =
        rule.indicator_id.toString();
    categoryEditField.value = rule.parameter_type;
    description.value = rule.description;
    cf.value = rule.cf;
}

function deleteData(id) {
    var form = document.getElementById("delete-form");
    form.action = "/data-aturan/" + id;
}

function validateCfInput(input) {
    input.value = input.value.replace(",", ".");

    input.value = input.value.replace(/[^0-9.\-]/g, "");

    if (input.value.includes("-") && !input.value.startsWith("-")) {
        input.value = input.value.replace("-", "");
    }

    input.value = input.value.replace(/-+/g, "-");

    if (input.value === "-") {
        return;
    }

    if (input.value.startsWith(".")) {
        input.value = "0" + input.value;
    }

    if (input.value.startsWith("-.")) {
        input.value = "-0.";
    }

    // **PERBAIKAN**: Hilangkan nol berlebih di depan angka, kecuali nol sebelum titik
    input.value = input.value.replace(/^(-?)0+(\d)/, "$1$2");

    // **BATASI INPUT**: Hanya satu titik desimal, dan maksimal 1 angka setelah titik
    let match = input.value.match(/^-?\d*(\.\d{0,1})?/);
    if (match) {
        input.value = match[0];
    }

    let numValue = parseFloat(input.value);

    // **Batasi nilai antara -1.0 dan 1.0**
    if (!isNaN(numValue)) {
        if (numValue > 1) {
            input.value = "1.0";
        } else if (numValue < -1) {
            input.value = "-1.0";
        }
    }
}

var checkAll = document.getElementById("checkAll");
checkAll &&
    (checkAll.onclick = function () {
        for (
            var e = document.querySelectorAll(
                    '.form-check-all input[type="checkbox"]'
                ),
                t = 0;
            t < e.length;
            t++
        )
            (e[t].checked = this.checked),
                e[t].checked
                    ? e[t].closest("tr").classList.add("table-active")
                    : e[t].closest("tr").classList.remove("table-active");
    });
var perPage = 10,
    options = {
        valueNames: ["id", "customer_name", "email", "phone", "status"],
        page: perPage,
        pagination: !0,
        plugins: [ListPagination({ left: 2, right: 2 })],
    },
    customerList = new List("customerList", options).on(
        "updated",
        function (e) {
            0 == e.matchingItems.length
                ? (document.getElementsByClassName(
                      "noresult"
                  )[0].style.display = "block")
                : (document.getElementsByClassName(
                      "noresult"
                  )[0].style.display = "none");
            var t = 1 == e.i,
                a = e.i > e.matchingItems.length - e.page;
            document.querySelector(".pagination-prev.disabled") &&
                document
                    .querySelector(".pagination-prev.disabled")
                    .classList.remove("disabled"),
                document.querySelector(".pagination-next.disabled") &&
                    document
                        .querySelector(".pagination-next.disabled")
                        .classList.remove("disabled"),
                t &&
                    document
                        .querySelector(".pagination-prev")
                        .classList.add("disabled"),
                a &&
                    document
                        .querySelector(".pagination-next")
                        .classList.add("disabled"),
                e.matchingItems.length <= perPage
                    ? (document.querySelector(
                          ".pagination-wrap"
                      ).style.display = "none")
                    : (document.querySelector(
                          ".pagination-wrap"
                      ).style.display = "flex"),
                e.matchingItems.length == perPage &&
                    document
                        .querySelector(".pagination.listjs-pagination")
                        .firstElementChild.children[0].click(),
                0 < e.matchingItems.length
                    ? (document.getElementsByClassName(
                          "noresult"
                      )[0].style.display = "none")
                    : (document.getElementsByClassName(
                          "noresult"
                      )[0].style.display = "block");
        }
    );
isCount = new DOMParser().parseFromString(
    customerList.items.slice(-1)[0]._values.id,
    "text/html"
);
var isValue = isCount.body.firstElementChild.innerHTML,
    idField = document.getElementById("id-field"),
    customerNameField = document.getElementById("customername-field"),
    emailField = document.getElementById("email-field"),
    dateField = document.getElementById("date-field"),
    phoneField = document.getElementById("phone-field"),
    statusField = document.getElementById("status-field"),
    addBtn = document.getElementById("add-btn"),
    editBtn = document.getElementById("edit-btn"),
    removeBtns = document.getElementsByClassName("remove-item-btn"),
    editBtns = document.getElementsByClassName("edit-item-btn");
function filterContact(e) {
    var t = e;
    customerList.filter(function (e) {
        matchData = new DOMParser().parseFromString(
            e.values().status,
            "text/html"
        );
        e = matchData.body.firstElementChild.innerHTML;
        return "All" == e || "All" == t || e == t;
    }),
        customerList.update();
}
function updateList() {
    var a = document.querySelector("input[name=status]:checked").value;
    (data = userList.filter(function (e) {
        var t = !1;
        return (
            "All" == a
                ? (t = !0)
                : ((t = e.values().sts == a), console.log(t, "statusFilter")),
            t
        );
    })),
        userList.update();
}
refreshCallbacks(),
    filterContact("All"),
    document
        .getElementById("showModal")
        .addEventListener("show.bs.modal", function (e) {
            e.relatedTarget.classList.contains("edit-item-btn")
                ? ((document.getElementById("exampleModalLabel").innerHTML =
                      "Edit Customer"),
                  (document
                      .getElementById("showModal")
                      .querySelector(".modal-footer").style.display = "block"),
                  (document.getElementById("add-btn").style.display = "none"),
                  (document.getElementById("edit-btn").style.display = "block"))
                : e.relatedTarget.classList.contains("add-btn")
                ? ((document.getElementById("exampleModalLabel").innerHTML =
                      "Tambah Aturan"),
                  (document
                      .getElementById("showModal")
                      .querySelector(".modal-footer").style.display = "block"),
                  (document.getElementById("edit-btn").style.display = "none"),
                  (document.getElementById("add-btn").style.display = "block"))
                : ((document.getElementById("exampleModalLabel").innerHTML =
                      "List Customer"),
                  (document
                      .getElementById("showModal")
                      .querySelector(".modal-footer").style.display = "none"));
        }),
    ischeckboxcheck(),
    document
        .getElementById("showModal")
        .addEventListener("hidden.bs.modal", function () {
            clearFields();
        }),
    document
        .querySelector("#customerList")
        .addEventListener("click", function () {
            refreshCallbacks(), ischeckboxcheck();
        });
var table = document.getElementById("customerTable"),
    tr = table.getElementsByTagName("tr"),
    trlist = table.querySelectorAll(".list tr"),
    count = Number(isValue.replace(/[^0-9]/g, "")) + 1;
addBtn.addEventListener("click", function (e) {
    "" !== customerNameField.value &&
        "" !== emailField.value &&
        "" !== dateField.value &&
        "" !== phoneField.value &&
        (customerList.add({
            id:
                '<a href="javascript:void(0);" class="fw-medium link-primary">#VZ' +
                count +
                "</a>",
            customer_name: customerNameField.value,
            email: emailField.value,
            date: dateField.value,
            phone: phoneField.value,
            status: isStatus(statusField.value),
        }),
        document.getElementById("close-modal").click(),
        clearFields(),
        refreshCallbacks(),
        filterContact("All"),
        count++);
}),
    editBtn.addEventListener("click", function (e) {
        (document.getElementById("exampleModalLabel").innerHTML =
            "Edit Customer"),
            customerList.get({ id: idField.value }).forEach(function (e) {
                (isid = new DOMParser().parseFromString(
                    e._values.id,
                    "text/html"
                )),
                    isid.body.firstElementChild.innerHTML == itemId &&
                        e.values({
                            id:
                                '<a href="javascript:void(0);" class="fw-medium link-primary">' +
                                idField.value +
                                "</a>",
                            customer_name: customerNameField.value,
                            email: emailField.value,
                            date: dateField.value,
                            phone: phoneField.value,
                            status: isStatus(statusField.value),
                        });
            }),
            document.getElementById("close-modal").click(),
            clearFields();
    });
var statusVal = new Choices(statusField);
function isStatus(e) {
    switch (e) {
        case "Active":
            return (
                '<span class="badge badge-soft-success text-uppercase">' +
                e +
                "</span>"
            );
        case "Block":
            return (
                '<span class="badge badge-soft-danger text-uppercase">' +
                e +
                "</span>"
            );
    }
}
function ischeckboxcheck() {
    document.getElementsByName("checkAll").forEach(function (e) {
        e.addEventListener("click", function (e) {
            e.target.checked
                ? e.target.closest("tr").classList.add("table-active")
                : e.target.closest("tr").classList.remove("table-active");
        });
    });
}
function refreshCallbacks() {
    removeBtns.forEach(function (e) {
        e.addEventListener("click", function (e) {
            e.target.closest("tr").children[1].innerText,
                (itemId = e.target.closest("tr").children[1].innerText),
                customerList.get({ id: itemId }).forEach(function (e) {
                    deleteid = new DOMParser().parseFromString(
                        e._values.id,
                        "text/html"
                    );
                    var t = deleteid.body.firstElementChild;
                    deleteid.body.firstElementChild.innerHTML == itemId &&
                        document
                            .getElementById("delete-record")
                            .addEventListener("click", function () {
                                customerList.remove("id", t.outerHTML),
                                    document
                                        .getElementById("deleteRecordModal")
                                        .click();
                            });
                });
        });
    }),
        editBtns.forEach(function (e) {
            e.addEventListener("click", function (e) {
                e.target.closest("tr").children[1].innerText,
                    (itemId = e.target.closest("tr").children[1].innerText),
                    customerList.get({ id: itemId }).forEach(function (e) {
                        isid = new DOMParser().parseFromString(
                            e._values.id,
                            "text/html"
                        );
                        var t = isid.body.firstElementChild.innerHTML;
                        t == itemId &&
                            ((idField.value = t),
                            (customerNameField.value = e._values.customer_name),
                            (emailField.value = e._values.email),
                            (dateField.value = e._values.date),
                            (phoneField.value = e._values.phone),
                            statusVal && statusVal.destroy(),
                            (statusVal = new Choices(statusField)),
                            (val = new DOMParser().parseFromString(
                                e._values.status,
                                "text/html"
                            )),
                            (t = val.body.firstElementChild.innerHTML),
                            statusVal.setChoiceByValue(t),
                            flatpickr("#date-field", {
                                dateFormat: "d M, Y",
                                defaultDate: e._values.date,
                            }));
                    });
            });
        });
}
function clearFields() {
    (customerNameField.value = ""),
        (emailField.value = ""),
        (dateField.value = ""),
        (phoneField.value = "");
}
document
    .querySelector(".pagination-next")
    .addEventListener("click", function () {
        !document.querySelector(".pagination.listjs-pagination") ||
            (document
                .querySelector(".pagination.listjs-pagination")
                .querySelector(".active") &&
                document
                    .querySelector(".pagination.listjs-pagination")
                    .querySelector(".active")
                    .nextElementSibling.children[0].click());
    }),
    document
        .querySelector(".pagination-prev")
        .addEventListener("click", function () {
            !document.querySelector(".pagination.listjs-pagination") ||
                (document
                    .querySelector(".pagination.listjs-pagination")
                    .querySelector(".active") &&
                    document
                        .querySelector(".pagination.listjs-pagination")
                        .querySelector(".active")
                        .previousSibling.children[0].click());
        });