<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>修改前置机</title>
    <link rel="stylesheet" href="${ctx}/js/plugin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="${ctx}/css/plugin/amazeui/amazeui.css" media="all">
    <link rel="stylesheet" href="${ctx}/css/basic.css">
    <style type="text/css">
        html {
            overflow: hidden;
        }
    </style>
</head>
<body class="bg-white">
<form class="layui-form">
    <div class="layui-form-item layui-form-text pdt15" style="width:320px">
        <label class="layui-form-label" style="width:100px">名称</label>
        <div class="layui-input-block">
            <input type="text" id="nodeName" placeholder="请输入" autocomplete="off" maxlength="32"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item layui-form-text" style="width:320px">
        <label class="layui-form-label" style="width:100px">等级</label>
        <div class="layui-input-block">
            <select id="nodeGrade"  maxlength="64" class="layui-select" style="display: block;width: 100%;">
                <option value="0">重要</option>
                <option value="1">普通</option>
                <option value="2">备用</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item layui-form-text" style="width:320px">
        <label class="layui-form-label" style="width:100px">最大装置数</label>
        <div class="layui-input-block">
            <input type="text" id="nodeDevNum" value="100" placeholder="请输入" autocomplete="off" maxlength="32"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item layui-form-text" style="width:320px">
        <label class="layui-form-label" style="width:100px">排序</label>
        <div class="layui-input-block">
            <input type="text" id="nodeOrder" value="0" placeholder="请输入" autocomplete="off" maxlength="32"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item layui-form-text" style="width:320px">
        <label class="layui-form-label" style="width:100px">描述</label>
        <div class="layui-input-block">
            <input type="text" id="nodeDesc" placeholder="请输入" autocomplete="off" maxlength="64"
                   class="layui-input">
        </div>
    </div>

    <div class="layui-form-item layui-form-text" style="width:320px">
        <label class="layui-form-label" style="width:100px">IP</label>
        <div class="layui-input-block">
            <input name="ip4" id="ip4" style="width:35px" maxlength="3"
                   onkeyup="this.value=this.value.replace(/[^0-9-]+/,'');">.
            <input name="ip3" id="ip3" style="width:35px" maxlength="3"
                   onkeyup="this.value=this.value.replace(/[^0-9-]+/,'');">.
            <input name="ip2" id="ip2" style="width:35px" maxlength="3"
                   onkeyup="this.value=this.value.replace(/[^0-9-]+/,'');">.
            <input name="ip1" id="ip1" style="width:35px" maxlength="3"
                   onkeyup="this.value=this.value.replace(/[^0-9-]+/,'');">
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block" style="width:320px">
            <button type="button" class="layui-btn themeBGColor" id="modNode" style="margin-left:10px">提交</button>
            <button type="reset" class="layui-btn cancleBGColor" style="margin-left:45px" id="cancleAdd">取消</button>
        </div>
    </div>
</form>
<input type="hidden" id="nodeIndex" value="${sessionScope.nodeIndex}"/>
<script src="${ctx}/js/plugin/jquery.min.js"></script>
<script src="${ctx}/js/plugin/bootstrap/bootstrap-datetimepicker.min.js"></script>
<script src="${ctx}/js/plugin/bootstrap/bootstrap-datetimepicker.zh-CN.js"></script>
<script src="${ctx}/js/plugin/layui/layer.js"></script>
<script src="${ctx}/js/basic.js"></script>
<script src="${ctx}/js/plugin/xss/xss.js"></script>
<script src="${ctx}/jspJS/utils/judgeAjaxStatus.js"></script>
<script type="text/javascript">
    var nodeIndex = $("#nodeIndex").val();
    nodeIndex = filterXSS(nodeIndex);
    $(document).ready(function () {
        $.ajax({
            method: "post",
            url: "/pqs9900/device/loadNode",
            data: {
                nodeIndex: nodeIndex
            },
            async: false,
            success: function (data) {
                if (data == null) {
                    layer.msg('前置机信息加载失败', {icon: 1, time: 1000});
                } else {
                    $("#nodeName").val(data[0]);
                    $("#nodeDesc").val(data[1]);
                    $("#ip4").val(data[2]);
                    $("#ip3").val(data[3]);
                    $("#ip2").val(data[4]);
                    $("#ip1").val(data[5]);
                    $("#nodeGrade").val(data[6])
                    $("#nodeDevNum").val(data[7])
                    $("#nodeOrder").val(data[8])
                }
            }
        })
    })

    var index = parent.layer.getFrameIndex(window.name); //获取窗口索引

    $("#cancleAdd").click(function () {
        parent.layer.close(index);
    });

    $("#modNode").click(function () {
        var nodeName = $("#nodeName").val();
        var nodeDesc = $("#nodeDesc").val();
        var nodeGrade = $("#nodeGrade").val();
        let nodeDevNum = $("#nodeDevNum").val()
        let nodeOrder = $("#nodeOrder").val()
        var ip4 = $("#ip4").val();
        var ip3 = $("#ip3").val();
        var ip2 = $("#ip2").val();
        var ip1 = $("#ip1").val();
        nodeName = filterXSS(nodeName);
        nodeDesc = filterXSS(nodeDesc);
        if (nodeName == null || nodeName == "") {
            layer.tips('名称不可为空', '#nodeName', {
                tips: [1, 'red'] //还可配置颜色
            });
        } else if (!/^[\u4E00-\u9FA5A-Za-z0-9_]+$/gi.test(nodeName)) {
            layer.tips('名称含有非汉字字符', '#nodeName', {
                tips: [1, 'red'] //还可配置颜色
            });
        } else if (!/^\+?[1-9]{1}[0-9]{0,2}\d{0,0}$/.test(nodeDevNum)) {
            layer.tips('请规范填写最大装置数量', '#nodeDevNum', {
                tips: [1, 'red'] //还可配置颜色
            });
        } else if (!/^\+?[1-9]{1}[0-9]{0,2}\d{0,0}$/.test(nodeOrder)) {
            layer.tips('请规范填写排序号', '#nodeOrder', {
                tips: [1, 'red'] //还可配置颜色
            });
        } else if (ip4 > 255 || ip4 < 0) {
            layer.tips('ip限制为0-255', '#ip4', {
                tips: [1, 'red'] //还可配置颜色
            });
        } else if (ip3 > 255 || ip3 < 0) {
            layer.tips('ip限制为0-255', '#ip3', {
                tips: [1, 'red'] //还可配置颜色
            });
        } else if (ip2 > 255 || ip2 < 0) {
            layer.tips('ip限制为0-255', '#ip2', {
                tips: [1, 'red'] //还可配置颜色
            });
        } else if (ip1 > 255 || ip1 < 0) {
            layer.tips('ip限制为0-255', '#ip1', {
                tips: [1, 'red'] //还可配置颜色
            });
        } else {
            $.ajax({
                url: '/pqs9900/device/modNode',
                type: 'POST',
                dataType: "text",
                data: {
                    nodeIndex: nodeIndex,
                    nodeName: nodeName,
                    nodeDesc: nodeDesc,
                    ip4: ip4,
                    ip3: ip3,
                    ip2: ip2,
                    ip1: ip1,
                    nodeGrade:nodeGrade,
                    nodeDevNum:nodeDevNum,
                    nodeOrder:nodeOrder
                },
                success: function (data) {
                    var info = $.parseJSON(data);
                    if (info.code == 200) {
                        layer.msg('修改成功!', {icon: 1, time: 1000});
                        parent.layer.close(index);
                        parent.window.load();
                    } else if (info.code == 400) {
                        layer.msg('修改失败！名称已存在', {icon: 2, time: 1000});
                    } else {
                        layer.msg('修改失败！', {icon: 2, time: 1000});
                    }
                }

            });
        }
    });
</script>
</body>
</html>
