MikaltoResort/ManagementApp/wwwroot/js/js-page/6103.js

import AButton from '/js/libs/js-AButton.js';
import AModal from '/js/libs/js-AModal.js';
import ATable from '/js/libs/js-ATable.js';
import ATab from '/js/libs/js-ATab.js';
import ASelect from '/js/libs/js-ASelect.js'
window.L6103 = function () {
    var asyncStyleSheets = [
        '/css/atg-ui/table.css'
    ];
    window.app.loadCSS(asyncStyleSheets);


    Waves.attach('.btn-effect', ['waves-float']);
    Waves.init({ duration: 1000, delay: 200 });
    var btnAdd = document.getElementById("btAdd");
    var aSelect = new ASelect(document.querySelectorAll(".aselect"));
    var aSEProtocol = aSelect.get(1);
    var tabs = new ATab(document.querySelector(".atabs"), document.querySelector(".tabcontents"));
    var tb = new ATable(document.querySelector(".c-table"), 10);
    var btUpdate = new AButton(document.getElementById("btUpdate"));
    var btn = new AButton(btnAdd);
    var m = new AModal(null);
    var mU = new AModal(null);
    var btBack = document.getElementById("btBack");
    tabs.on("changed", (e) => {
        aSEProtocol.updateHeight();
    });
    btBack.addEventListener("click", (e) => {
        tabs.selectedTab(0);
    })
    let promise = new Promise(function (resolve, reject) {
        tb.AddHeader("ID", "120px", "", "IdValidationDomain");
        tb.AddHeader("Protocol", "", "180px", "Protocol");
        tb.AddHeader("Domain Name", "", "240px", "DomainName");
        tb.AddHeader("Port Number", "", "80px", "PortNumber");
        tb.AddHeader("Action", "180px", "", "Action", function (id, obj) {
            var ac = document.createElement("div");
            ac.classList.add("d-f", "j-c-center");
            var d = document.createElement("button");
            d.classList.add("btn", "btn-warning", "mr-2");
            var ico = document.createElement("span");
            ico.classList.add("atg", "atg-pencil");
            d.appendChild(ico);
            d.addEventListener("click", ((e) => { updateClick.call(tabs, e, id, obj, aSEProtocol); }));
            ac.appendChild(d);
            d = document.createElement("button");
            d.classList.add("btn", "btn-danger");
            var ico = document.createElement("span");
            ico.classList.add("atg", "atg-x");
            d.appendChild(ico);
            ac.appendChild(d);
            return ac;
        });
        tb.SetScrollBarY(300);
        tb.IsCheckBox(true);
        tb.LoadDataUrl("/Storage/GetValidationDomain");
    });

    m.overlay.setIndex(2101);
    m.createModal("OK");
    m.on("OK", () => {
        btn.RemoveLoading(btnAdd);
        tb.RefreshPage(1, true);
    });
    m.on("Close", () => { btn.RemoveLoading(btnAdd); });
    btn.on("click_btAdd", function (e) {
        const xhr = new XMLHttpRequest();
        xhr.open("POST", window.GetAbsoluteURL("/Storage/AddValidationDomain"));
        var frm = new FormData();
        AddFormData(frm, "Name", document.getElementById("inpName").value);
        AddFormData(frm, "PortNumber", document.getElementById("inpPN").value);
        AddFormData(frm, "Protocol", document.getElementById("inpPro").value);

        var f = function (ev) {
            if (ev.currentTarget.readyState == 4) {
                if (ev.currentTarget.status == 200) {
                    var obj = JSON.parse(ev.currentTarget.responseText);
                    if (ev.Status == 0) {
                        m.AModalOK.title("Message Error", "mess-error");
                        m.AModalOK.message(ev.Message);
                    } else {
                        m.AModalOK.title("Message", "mess-success");
                        m.AModalOK.message("Row Insert Success!");
                    }
                    m.showModal();
                }
            }

        };
        xhr.addEventListener("readystatechange", f, false);
        xhr.send(frm);
    });

    tabs.lockTabs.push(1);

    mU.overlay.setIndex(2101);
    mU.createModal("OK");
    mU.on("OK", () => {
        btUpdate.RemoveLoading(document.getElementById("btUpdate"));
        tabs.selectedTab(0);
        tb.RefreshCurrentPage();
    });
    mU.on("Close", () => { btn.RemoveLoading(document.getElementById("btUpdate")); });

    btUpdate.on("click_btUpdate", (evt) => {
        var inpID = document.getElementById("inpID");
        if (inpID.value != "") {
            const xhr = new XMLHttpRequest();
            xhr.open("POST", window.GetAbsoluteURL("/Storage/UpdateValidationDomain"));
            var f = function (ev) {
                if (ev.currentTarget.readyState == 4) {
                    if (ev.currentTarget.status == 200) {
                        var obj = JSON.parse(ev.currentTarget.responseText);
                        if (ev.Status == 0) {
                            mU.AModalOK.title("Message Error", "mess-error");
                            mU.AModalOK.message(ev.Message);
                        } else {
                            mU.AModalOK.title("Message", "mess-success");
                            mU.AModalOK.message("Row Update Success!");
                        }
                        mU.showModal();
                    }
                }

            };
            xhr.addEventListener("readystatechange", f, false);
            var frm = new FormData();
            AddFormData(frm, "ID", inpID.value);
            AddFormData(frm, "Name", document.getElementById("inpEDName").value);
            AddFormData(frm, "PortNumber", document.getElementById("inpEPN").value);
            AddFormData(frm, "Protocol", aSEProtocol.getSelectedItem().id);

            xhr.send(frm);
        }
    });

    //var btSearch = new AButton(document.getElementById("btSearch"));
    //btSearch.on("click_btSearch", function (evt) {
    //    var fr = new FormData();
    //    fr.append("keyword", document.getElementById("inpKey").value);
    //    tb.LoadDataFirst(fr);
    //    btSearch.RemoveLoading(evt);
    //});
}

function updateClick(e, id, obj, aselect) {
    this.enableTab(1);
    this.selectedTab(1);
    var inp = document.getElementById("inpEDName");
    var inpID = document.getElementById("inpID");
    var inpEPN = document.getElementById("inpEPN");
    var inpEPro = document.getElementById("inpEPro");
    inp.value = obj.DomainName;
    inpID.value = obj.IdValidationDomain;
    inpEPN.value = obj.PortNumber;
    aselect.setSelectedItem(obj.Protocol);
}

window.AScript.set("6103", true);