Ztree

引入css和js

<link rel="stylesheet" href="/${appName}/commons/jslib/ztreeV3.5.15/css/zTreeStyle/zTreeStyle.css" type="text/css"></link>
<script type="text/javascript" src="/${appName}/commons/jslib/ztreeV3.5.15/jquery.ztree.all-3.5.js"></script>

html

<ul id="treeModule" class="ztree" style="height:280px"></ul>

加載樹

        /*配置*/var setting = {check: {   //顯示多選框,節點中checked字段控制enable: true,autoCheckTrigger: true,chkStyle: "checkbox",chkboxType: { "Y": "ps", "N": "ps" }},data: {key:{name:"moduleName"   //顯示節點字段
                },simpleData: {enable: true,idKey: "moduleCode",   //id字段pIdKey: "parentCode",  //父級id字段rootPId: 0   //根id值
                }}};/**菜單顯示*/var roleCode_access;function accessShow(roleCode){roleCode_access = roleCode;$('#accesswin').modal('show');//樹
            $.ajax({url:'/${appName}/manager/moduleController/getAllModules',type:'post',async:'true',cache:false,data:{roleCode:roleCode_access},dataType:'json',success: function(data){$.fn.zTree.init($("#treeModule"), setting, data);}});}

獲取勾選框的值

            var mids ='';var treeObj = $.fn.zTree.getZTreeObj("treeModule");var nodes = treeObj.getCheckedNodes(true);for(i=0;i<nodes.length;i++){mids = mids+nodes[i].moduleCode+',';}

后臺代碼

SysModule.java

public class SysModule {private String moduleCode;private String moduleName;private String modulePath;private String parentCode;private String isLeaf;private String sortNumber;private String checked;   //是否勾選private String open = "true";   //是否展開,默認展開
}

Controller層

    /*** 獲取所有菜單* @return*/@RequestMapping("getAllModules")@ResponseBodypublic List<SysModule> getAllModules(String roleCode){List<SysModule> result = moduleService.getAllModules();List<SysModule> binded = moduleService.getModulesByRoleCode(roleCode);Iterator<SysModule> iterator = result.iterator();/*遍歷所有菜單*/while (iterator.hasNext()){SysModule module= iterator.next();/*遍歷所有已綁定的菜單*/Iterator<SysModule> iterator_binded = binded.iterator();while (iterator_binded.hasNext()){SysModule module_binded= iterator_binded.next();if (module.getModuleCode().equals(module_binded.getModuleCode())){module.setChecked("true");}}}return result;}

Service層

    /*** 獲取所有菜單* @return*/public List<SysModule> getAllModules(){List<SysModule> modules = moduleMapper.getAllModules();return modules;}/*** 根據角色code獲取綁定的菜單* @param roleCode* @return*/public List<SysModule> getModulesByRoleCode(String roleCode){List<SysModule> modules = moduleMapper.getModulesByRoleCode(roleCode);return modules;}

Mybatis層

    /*** 獲取所有菜單* @return*/List<SysModule> getAllModules();/*** 根據角色編碼獲取綁定的菜單* @param roleCode* @return*/public List<SysModule> getModulesByRoleCode(String roleCode);<!--獲取所有菜單--><select id="getAllModules" resultType="com.autumn.pojo.SysModule">select * from sys_module</select><!--根據rolecode獲取綁定的菜單--><select id="getModulesByRoleCode" resultType="com.autumn.pojo.SysModule">select sm.* from sys_module smleft join sys_role_module srm on sm.moduleCode = srm.moduleCodewhere srm.roleCode= #{roleCode}</select>

數據庫?

CREATE TABLE IF NOT EXISTS `sys_module` (`moduleCode` varchar(36) NOT NULL COMMENT '模塊編號',`moduleName` varchar(50) DEFAULT NULL COMMENT '模塊名稱',`modulePath` varchar(1000) DEFAULT NULL COMMENT '模塊訪問路徑',`parentCode` varchar(36) DEFAULT NULL COMMENT '父模塊編號',`isLeaf` int(11) DEFAULT NULL COMMENT '是否葉子節點:0 否,1 是',`sortNumber` int(11) DEFAULT NULL COMMENT '排序號',PRIMARY KEY (`moduleCode`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COMMENT='模塊表';CREATE TABLE IF NOT EXISTS `sys_role` (`roleCode` varchar(36) NOT NULL COMMENT '角色編號',`roleName` varchar(50) NOT NULL COMMENT '角色名稱',PRIMARY KEY (`roleCode`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COMMENT='角色表';CREATE TABLE IF NOT EXISTS `sys_role_module` (`rmId` varchar(36) NOT NULL COMMENT '唯一編號',`roleCode` varchar(36) NOT NULL COMMENT '角色編號',`moduleCode` varchar(50) NOT NULL COMMENT '模塊編號',PRIMARY KEY (`rmId`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COMMENT='用戶角色-模塊關聯表';

?