<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE HTML>
<html>
<head>
    <meta name="decorator" content="base" />
    <link rel="stylesheet" href="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui2.6.8/css/layui.css" media="all">
  <%--  <link rel="stylesheet" href="${ctxPlugin}/lib/zTree/v3/css/zTreeStyle/zTreeStyle.css" type="text/css">
    <script src="${ctxPlugin}/lib/zTree/v3/js/jquery-1.4.4.min.js"></script>
    <script type="text/javascript" src="${ctxPlugin}/lib/zTree/v3/js/jquery.ztree.core-3.5.min.js"></script>
    <script type="text/javascript" src="${ctxPlugin}/lib/zTree/v3/js/jquery.ztree.excheck-3.5.js"></script>--%>
    <link rel="stylesheet" href="${ctxPlugin}/static/css/reset.css" media="all">
    <style>
        html {
            background-color: #fff;
            padding-bottom: 50px;
        }

        .custom-tree-item-clicked{
            color:#fff;
            background-color: #d9b589;
        }
    </style>
</head>
<body>


<div class="layui-form">
    <div class="">
        <div class="layui-card-body">
            <input type="hidden" name="id" value="${dep.id}" id="depId">
            <input type="hidden" id="parent_id" name="permission" value="${dep.parentId}">
            <div class="layui-form-item">
                <div class="layui-inline layui-col-xs8">
                    <label class="layui-form-label w-130"><i class="red">*</i>部门编号：</label>
                    <div class="layui-input-block ">
                        <input type="text" id="code"  name="code" lay-verify="required" value="${dep.code}" autocomplete="off" placeholder="请输入部门编号" class="layui-input " >
                    </div>
                </div>
                <div class="layui-inline layui-col-xs8">
                    <label class="layui-form-label w-130"><i class="red">*</i>部门名称：</label>
                    <div class="layui-input-block ">
                        <input type="text"  id="name" name="name" value="${dep.name}"  lay-verify="required" autocomplete="off" placeholder="请输入部门名称" class="layui-input " >
                    </div>
                </div>
                <div class="layui-inline layui-col-xs8">
                    <label class="layui-form-label">所属部门:</label>
                    <div class="layui-input-block "  id="treeDemo">
                        <%-- <ul id="treeDemo" class="ztree" style="padding: 30px;">--%>

                    </div>
                    <%--   <div>
                           <button class="layui-btn layui-btn-sm" id="saveMenusBtn">保存</button>

                       </div>--%>
                </div>

            </div>
        </div>
    </div>
    <div class="operate-footer">
        <button class="layui-btn layui-btn-sm" id="saveMenusBtn">保存</button>
        <button class="layui-btn layui-btn-primary" onclick="closeDiv()">取消</button>
    </div>
</div>

<script src="${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/layui2.6.8/layui.js"></script>
<script type="text/javascript">
    layui.config({
        base: '${ctxPlugin}/lib/layuiAdmin/dist/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'jquery', 'layer','tree'], function(){
        var layer = layui.layer;
        var $ = layui.jquery;

        var tree = layui.tree;

      //  loadTreeNodes('${id}');

        //渲染
        $.post('${ctx}/departmentSetting/getDepartList', function(data) {
            nodes = eval(data);
            var inst1 = tree.render({
                elem: '#treeDemo'  //绑定元素
                , accordion: true
                , data: nodes
                , onlyIconControl: true
                ,click: function(obj){
                    $(".layui-tree-txt").removeClass("custom-tree-item-clicked");
                    $("#parent_id").val(obj.data.id)
                    obj.elem.children(".layui-tree-entry").find(".layui-tree-txt").addClass("custom-tree-item-clicked")
                    console.log(obj.data.children); //当前节点下是否有子节点
                }
            });
        });


        $("#saveMenusBtn").on("click", function(){
         //   var nodes = ztreeNode.getCheckedNodes(true);

            var permissions = $("#parent_id").val();
            /*for(var i = 0; i < nodes.length; i++){
                permissions = nodes[i].id;
            }*/
            if(isBlank(permissions)){
                layer.msg("请选择上级部门")
                return false
            }
            var name = $("#name").val();
            if(isBlank(name)){
                layer.msg("请输入部门名称")
                return false
            }
            var code = $("#code").val();
            if(isBlank(code)){
                layer.msg("请输入部门编码")
                return false
            }
            var id = $("#depId").val();
            $.post('${ctx}/departmentSetting/saveDepartment', {id:id,name: name, code:code,permission:permissions}, function(result){
                if("200" == result.code){
                    layer.msg("保存成功", {icon:1});
                    parent.layer.closeAll();
                    parent.setDep();
                }else if("202" == result.code){
                    layer.msg(result.msg, {icon:1});

                }else{
                    layer.msg("保存失败", {icon:2});
                }
            });

        });
    });



    function  closeDiv() {
        var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
        parent.layer.close(index);
    }

    function isBlank(val) {
        if (val == null || val == '' || val == undefined) {
            return true;
        }
        return false;
    }
</script>
</body>
</html>