FISLib_Old/Vinno.FIS.Sonopost/Assets/wwwroot/pages/network/advance.html

<div>
    <div class="page-title" data-content="PageTitle4NetworkAdvance"></div>
    <div class="page-desc" data-content="PageDesc4NetworkAdvance"></div>
    <div class="layui-form page-form" lay-filter="FormSonoAdvancce">
        <div class="layui-form-item" style="padding-left: 20px">
            <div class="layui-inline">
                <input type="checkbox"
                       id="advanceSwitch"
                       name="IsEnable"
                       lay-filter="IsEnable"
                       lay-skin="switch" />
                <label class="layui-form-label"
                       style="float: right; width: 160px"
                       data-content="EnableDualNetwork"></label>
            </div>
        </div>
        <div id="advanceContainer">
            <div id="networkInterfaceList"></div>
            <div>
                <button class="layui-btn layui-btn-normal"
                        id="btnSave"
                        data-content="SaveConfig"></button>
            </div>
        </div>
    </div>
</div>
<script>
    function Page(app, runtime) {
        const { $api, $t, $c } = runtime;
        const { form, layer } = layui;
        let settingForms = [];
        let advanceSettingOpend = false;
        this.onload = async function () {
            await $c("NetworkAdapterItem");
            loadNetworkInfo();
            $("#btnSave").on("click", async function (data) {
                if (settingForms.length < 2) {
                    layer.msg.error($t("NoEnoughNetworkError"));
                    return;
                }
                var networks = settingForms.filter((x) => x.checked());
                if (networks.length > 1) {
                    layer.msg.error($t("SetOutSideNetworkError"));
                    return;
                }
                if (networks.length == 0) {
                    layer.msg.error($t("SetOutSideNetworkError2"));
                    return;
                }
                let item = settingForms
                    .map((x) => x.val())
                    .find((x) => x.IsOutSideNetwork === true);

                let res = await $api("network", "SaveAdvanceSetting", item);
                if (res.IsSuccess) {
                    if (res.Data.NeedReboot) {
                        layer.msg.success($t("RestartEffect"));
                    } else {
                        layer.msg.success($t("SaveSuccess"));
                    }
                } else {
                    layer.msg.error($t(res.Code));
                }
            });
        };

        function loadNetworkInfo() {
            $api("network", "GetNetworkInterfaces").then((res) => {
                if (res.IsSuccess) {
                    let container = $("#networkInterfaceList");
                    res.Data.Interfaces.forEach((x) => {
                        let item = new NetworkAdapterItem(x);
                        item.addTo(container);
                        settingForms.push(item);
                        if (x.IsOutSideNetwork === true) {
                            advanceSettingOpend = true;
                        }
                    });
                    $("#advanceSwitch").prop("checked", advanceSettingOpend);

                    if (advanceSettingOpend) {
                        $("#advanceContainer").show();
                    } else {
                        $("#advanceContainer").hide();
                    }
                    form.render();
                } else {
                    layer.msg.error($t(res.Code));
                }
            });
        }

        form.on("switch(IsEnable)", async function (data) {
            let checked = data.elem.checked;
            if (checked) {
                $("#advanceContainer").show();
            } else {
                $("#advanceContainer").hide();
                let res = await $api("network", "SaveAdvanceSetting", null);
                if (res.IsSuccess) {
                    if (res.Data.NeedReboot) {
                        layer.msg.success($t("RestartEffect"));
                    } else {
                        layer.msg.success($t("SaveSuccess"));
                    }
                } else {
                    layer.msg.error($t(res.Code));
                }
            }
        });
    }
</script>