<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('修改菜单')"/>
    <th:block th:include="include :: bootstrap-fileinput-css"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-guidance-edit" th:object="${guidanceNode}">
        <input name="tsGuidanceId" type="hidden" th:field="*{yyqhGuidanceId}"/>
        <input id="treeId" name="parentId" type="hidden" th:field="*{parentId}"/>
        <div class="form-group">
            <label class="col-sm-3 control-label ">上级项：</label>
            <div class="col-sm-8">
                <div class="input-group">
                    <input class="form-control" type="text" onclick="selectGuidanceTree()" id="treeName" readonly="true"
                           th:value="${guidanceNode.parentName == null ? '无' : guidanceNode.parentName}">
                    <span class="input-group-addon"><i class="fa fa-search"></i></span>
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label" id="itemName">事项名称：</label>
            <div class="col-sm-8">
                <input class="form-control" type="text" name="guidanceName" id="guidanceName" th:field="*{guidanceName}"
                       required>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">事项类型：</label>
            <div class="col-sm-8">
                <div class="radio-box">
                    <input type="radio" name="guidanceType" value="1" th:checked="*{guidanceType=='1'}">
                    <label text="">分类</label>
                </div>
                <div class="radio-box">
                    <input type="radio" name="guidanceType" value="2" th:checked="*{guidanceType=='2'}">
                    <label text="">事项</label>
                </div>
            </div>
        </div>
        <div class="form-group" id="sequenceIdDiv">
            <label class="col-sm-3 control-label">叫号机对接序列ID：</label>
            <div class="col-sm-8">
                <input class="form-control" type="text" name="sequenceId" id="sequenceId" th:field="*{sequenceId}"
                       required>
            </div>
        </div>
        <div class="form-group" id="remarkDiv">
            <label class="col-sm-3 control-label">详细事项：</label>
            <div class="col-sm-8">
                <textarea id="remark" name="remark" class="form-control">[[*{remark}]]</textarea>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">显示排序：</label>
            <div class="col-sm-8">
                <input class="form-control" type="text" name="orderNum" th:field="*{orderNum}" required>
            </div>
        </div>
    </form>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: bootstrap-fileinput-js"/>
<script>
    var prefix = ctx + "system/yyqh/guidance";
    $(function () {
        var type = $('input[name="guidanceType"]:checked').val();
        show2Hide(type);
        $(":radio").on('ifChecked',
            function (event) {
                var guidanceType = $(event.target).val();
                show2Hide(guidanceType);
            });
    });

    function show2Hide(type) {
        if (type == "1") {
            $("#remarkDiv").hide();
            $("#itemName").html("分类名称：");
        } else {
            $("#remarkDiv").show();
            $("#itemName").html("事项名称：");
        }
    }

    $("#form-guidance-edit").validate({
        onkeyup: false,
        rules: {
            guidanceType: {
                required: true,
            },
            guidanceName: {
                required: true,
            },
            orderNum: {
                digits: true
            },
        },
        messages: {
            "guidanceName": {
                remote: "事项已经存在"
            }
        },
        focusCleanup: true
    });

    function submitHandler() {
        if ($.validate.form()) {
            var data = $("#form-guidance-edit").serializeArray();
            $.operate.save(prefix + "/edit", data);
        }
    }

    /*菜单管理-修改-选择菜单树*/
    function selectGuidanceTree() {
        var guidanceId = $("#treeId").val();
        if (guidanceId > 0) {
            var url = prefix + "/selectGuidanceTree/" + guidanceId;
            $.modal.open("选择事项分类", url, '380', '380');
        } else {
            $.modal.alertError("根目录不可更改上级");
        }
    }

    function selectGuidanceTree() {
        var guidanceId = $("#treeId").val();
        if (guidanceId > 0) {
            var url = prefix + "/selectGuidanceTree/" + guidanceId;
            var options = {
                title: '事项选择',
                width: "380",
                url: url,
                callBack: doSubmit
            };
            $.modal.openOptions(options);
        } else {
            $.modal.alertError("根目录事项不可更改上级");
        }
    }

    function doSubmit(index, layero) {
        var body = layer.getChildFrame('body', index);
        $("#treeId").val(body.find('#treeId').val());
        $("#treeName").val(body.find('#treeName').val());
        layer.close(index);
    }
</script>
</body>
</html>
