<!DOCTYPE HTML> 
 | 
<html xmlns:th="http://www.thymeleaf.org" xmlns:matrix="http://www.w3.org/1999/xhtml"> 
 | 
<head> 
 | 
    <meta charset="utf-8"> 
 | 
    <META HTTP-EQUIV="Pragma" CONTENT="no-cache"> 
 | 
    <meta name="renderer" content="webkit|ie-comp|ie-stand"> 
 | 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
 | 
    <meta name="viewport" 
 | 
          content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/> 
 | 
    <meta http-equiv="Cache-Control" content="no-siteapp"/> 
 | 
    <!-- 本框架基本脚本和样式 --> 
 | 
    <script type="text/javascript" 
 | 
            th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script> 
 | 
    <script type="text/javascript" th:src="@{/js/systools/MBase.js}"></script> 
 | 
    <!-- 界面单独引入的其他样式和脚本 --> 
 | 
    <link rel="stylesheet" 
 | 
          th:href="@{/plugin/zTree/zTreeStyle/zTreeStyle.css}" 
 | 
          type="text/css"> 
 | 
    <script type="text/javascript" 
 | 
            th:src="@{/plugin/zTree/jquery.ztree.core-3.5.min.js}"></script> 
 | 
</head> 
 | 
<body class=" container-fluid"> 
 | 
<div class="wrapper wrapper-content  animated fadeInRight"> 
 | 
    <div class="row"> 
 | 
        <div class="col-sm-3"> 
 | 
            <div class="ibox float-e-margins"> 
 | 
                <div class="ibox-title"> 
 | 
                    <h5>部门列表</h5> 
 | 
                    <div class="pull-right "> 
 | 
                        <a  matrix:btn="departInfo-add" class="f-r text-success " onclick="openForm()"><i class="fa fa-plus c-success"></i>添加部门</a> 
 | 
                    </div> 
 | 
                </div> 
 | 
                <div id="treeDemo" matrix:btn="departInfo-add"  class="ibox-content ztree"  style="min-height: 400px"> 
 | 
  
 | 
                </div> 
 | 
            </div> 
 | 
        </div> 
 | 
        <div class="col-sm-9"> 
 | 
            <div class="ibox float-e-margins"> 
 | 
                <div class="ibox-title"> 
 | 
                    <h5>编辑部门</h5> 
 | 
                    <div class="ibox-tools"> 
 | 
                    </div> 
 | 
                </div> 
 | 
                <div class="ibox-content" style="min-height: 400px"> 
 | 
                    <form style="display: none;" class="form-horizontal dataform "  id="dataform"> 
 | 
                        <input autocomplete="off"   type="hidden" name="id" id="id"> 
 | 
                        <div class="form-group"> 
 | 
                            <label class="col-sm-2 control-label">父级部门</label> 
 | 
                            <div class="col-sm-4"> 
 | 
                                <select class="select2 form-control" size="1" name="parentId" id="parentId"> 
 | 
                                    <option value="0" selected="selected">一级部门</option> 
 | 
                                </select> 
 | 
                            </div> 
 | 
                        </div> 
 | 
                        <div class="form-group"> 
 | 
                            <label class="col-sm-2 control-label">部门编号</label> 
 | 
                            <div class="col-sm-4"> 
 | 
                                <input autocomplete="off"   id="departNo" type="text" name="departNo" class="form-control " readonly="readonly"> 
 | 
                            </div> 
 | 
  
 | 
                        </div> 
 | 
                        <div class="form-group"> 
 | 
                            <label class="col-sm-2 control-label">部门名称</label> 
 | 
                            <div class="col-sm-4"> 
 | 
                                <input autocomplete="off"   id="departName" type="text" name="departName" class="form-control " datatype="*1-50" nullmsg="部门名称不能为空"> 
 | 
                                <div class="Validform_checktip"></div> 
 | 
                            </div> 
 | 
  
 | 
                        </div> 
 | 
  
 | 
                        <div class="form-group" > 
 | 
                            <div class="col-sm-8 text-center"> 
 | 
                                <a matrix:btn="departInfo-edit" class="btn btn-success radius" onclick="updateFunction()" >保存</a> 
 | 
                                <a matrix:btn="departInfo-del" class="btn btn-danger  radius" onclick="delFunction()" >删除</a> 
 | 
                            </div> 
 | 
                        </div> 
 | 
                    </form> 
 | 
                </div> 
 | 
            </div> 
 | 
        </div> 
 | 
    </div> 
 | 
</div> 
 | 
</div> 
 | 
  
 | 
<script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script> 
 | 
<script type="text/javascript"> 
 | 
  
 | 
    $(".select2").select2({width:'100%'}); 
 | 
    var Huiform = null; 
 | 
    $(function() { 
 | 
        initFunctionList(); 
 | 
        Huiform = MValidform.validform("#dataform") 
 | 
    }); 
 | 
  
 | 
    /** 
 | 
     * 初始化产品类别列表 
 | 
     */ 
 | 
    function initFunctionSelected(id) { 
 | 
        $.AjaxProxy({ 
 | 
            a : false, 
 | 
            c : false 
 | 
        }).invoke(basePath+"/admin/departInfo/showDepartInfo", function(loj) { 
 | 
            $("#parentId").createSelectTree(loj.attr("result").rows, { 
 | 
                append : false, 
 | 
                defaultValue:id, 
 | 
                value:"departName", 
 | 
                defaultHtml:'<option value="0" selected="selected">一级部门</option>', 
 | 
            }); 
 | 
        }); 
 | 
  
 | 
    } 
 | 
  
 | 
    function initFunctionList() { 
 | 
        var zNodes = new Array(); 
 | 
        $.AjaxProxy().invoke( 
 | 
                basePath+"/admin/departInfo/showDepartInfo", 
 | 
                function(loj) { 
 | 
                    for (var i = 0; i < loj.getRowCount(); i++) { 
 | 
                        zNodes[i] = createNode(loj.getString(i, "id"), loj 
 | 
                                .getString(i, "parentId"), loj.getString(i, "departName")); 
 | 
                    } 
 | 
                    initTree(zNodes); 
 | 
                }); 
 | 
    } 
 | 
            function updateFunction() { 
 | 
                var myForm=MForm.initForm({ 
 | 
                    invokeUrl:basePath+"/admin/departInfo/addOrModify", 
 | 
                    afterSubmit:function(){ 
 | 
                        initFunctionList(); 
 | 
                    }, 
 | 
                }); 
 | 
                myForm.submit(); 
 | 
            } 
 | 
    function initTree(zNodes) { 
 | 
        var setting = { 
 | 
            view : { 
 | 
                dblClickExpand : false, 
 | 
                showLine : false, 
 | 
                selectedMulti : false 
 | 
            }, 
 | 
            data : { 
 | 
                simpleData : { 
 | 
                    enable : true, 
 | 
                    idKey : "id", 
 | 
                    pIdKey : "pId", 
 | 
                    rootPId : "" 
 | 
                } 
 | 
            }, 
 | 
            callback : { 
 | 
                onClick : zTreeOnClick 
 | 
            } 
 | 
        }; 
 | 
        $.fn.zTree.init($("#treeDemo"), setting, zNodes); 
 | 
    } 
 | 
  
 | 
    // 点击加载节点信息 
 | 
    function zTreeOnClick(event, treeId, treeNode) { 
 | 
        $("#dataform").show(); 
 | 
        Huiform.resetForm(); 
 | 
        $.AjaxProxy({ 
 | 
            p:{id : treeNode.id }, 
 | 
            a : false, 
 | 
            c : true 
 | 
        }).invoke( 
 | 
                basePath+"/admin/departInfo/findById", 
 | 
                function(loj) { 
 | 
                    // 初始化产品类别基本信息 
 | 
                    initFunctionSelected(loj.getString( 0, "parentId")); 
 | 
                    $("#id").val(loj.getString( 0, "id")); 
 | 
                    $("#departName").val(loj.getString( 0, "departName")); 
 | 
                    $("#departNo").val(loj.getString( 0, "departNo")); 
 | 
  
 | 
                }); 
 | 
    }; 
 | 
  
 | 
    function createNode(id, parentId, name) { 
 | 
        var o = new Object(); 
 | 
        o.id = id; 
 | 
        o.pId = parentId; 
 | 
        o.name = name; 
 | 
        o.iconOpen=basePath+"/resource/images/close.png"; 
 | 
        o.iconClose=basePath+"/resource/images/open.png"; 
 | 
        return o; 
 | 
    } 
 | 
    function showIcon() { 
 | 
        layer.open({ 
 | 
            type : 2, 
 | 
            title : "选择图标", 
 | 
            area : [ '80%', '80%' ], 
 | 
            fix : true, // 不固定 
 | 
            maxmin : true, 
 | 
            content : basePath+'/common/redirect/icons' 
 | 
        }); 
 | 
    } 
 | 
            function delFunction() { 
 | 
                var id = $("#id").val(); 
 | 
                if (id != null && id != '') { 
 | 
                    layer.confirm('删除部门时会删除该部门下的所有子部门!', { 
 | 
                        icon : 3, 
 | 
                        title : '提示' 
 | 
                    }, function(index) { 
 | 
                        layer.close(index); 
 | 
                        var id = $("#id").val(); 
 | 
                        $.AjaxProxy({ 
 | 
                            p : {keys: id } 
 | 
                        }).invoke(basePath+"/admin/departInfo/del", function(loj) { 
 | 
                            layer.alert('删除成功!', { 
 | 
                                icon : 1 
 | 
                            }, function(index) { 
 | 
                                $("#dataform").hide(); 
 | 
                                layer.close(index); 
 | 
                                initFunctionList(); 
 | 
                            }); 
 | 
                            return false; 
 | 
                        }); 
 | 
                    }); 
 | 
                } else { 
 | 
                    layer.alert("请先选中要删除的部门!"); 
 | 
                } 
 | 
            } 
 | 
            function openForm() { 
 | 
                layer.open({ 
 | 
                    type : 2, 
 | 
                    title : "新增部门", 
 | 
                    area : [ MUI.SIZE_L, '400px' ], 
 | 
                    content : basePath+'/admin/departInfo/editForm' 
 | 
                }); 
 | 
            } 
 | 
  
 | 
  
 | 
  
 | 
  
 | 
</script> 
 | 
  
 | 
  
 | 
</body> 
 | 
</html> 
 |