`

LigerTree之权限树

阅读更多

 

jQuery.uuzz = $.uuzz || {};
jQuery.uuzz.Tree = {
	_treeView: null,
	_treeManager: null,
	_url: null,
	
	loadData: function(param){
		var g = this;
		g.destroy();
		g.getTreeManager().loadData(null, g._url, param);
	},
	
	/**
	 * 初始化节点选择
	 */
	onAfterAppend: function(){
		var g = $.uuzz.Tree;
		var checkedNodes = g.getTreeManager().getChecked();
		$(checkedNodes).each(function () { 
			g.updateCheckedStatus(this);
		});
	},
	
	/**
	 * 获取选择的节点Id字符串,用“_”分割
	 * @returns {String}
	 */
	getCheckedNodes: function(){
		var g = $.uuzz.Tree;
		var nodes = g.getTreeManager().getChecked();
        var privileges = "";
        if(nodes != null){
        	$.each(nodes, function(i,node){
            	var parent = g.getTreeManager().getParent(node.data);
            	if(parent == null){
            		return true;
            	}
            	if(!$.uuzz.Common.isEmpty(parent.parentNode) && privileges.indexOf(parent.nodeId, 0) == -1){
            		privileges += parent.nodeId + "_";
            	}
            	privileges += nodes[i].data.nodeId + "_";
            });
        }
        return privileges;
	},
	
	/**
	 * 销毁树
	 */
	destroy: function(){
		if(this.getTreeManager()){
			this.getTreeManager().clear();
		}
	},
	
	/**
	 * 获取url
	 * @returns	数据请求url
	 */
	getUrl: function(){
		return this._url;
	},
	
	setUrl: function(url){
		return this._url = url;
	},
	
	getTreeManager: function(){
		return this._treeManager;
	},
	
	setTreeManager: function(treeManager){
		return this._treeManager = treeManager;
	},
	
	getTreeView: function(){
		return this._treeView;
	},
	
	/**
	 * 更新节点状态,初始化时使用
	 * @param node
	 */
	updateCheckedStatus: function(node){
		var g = this;
		var treedataindex = parseInt(node.target.attributes['treedataindex'].nodeValue);
		var treeitem = $("li[treedataindex="+treedataindex+"]");
		var obj = treeitem.find(".l-box");
		
        //chekcbox even
        if ($(obj).hasClass("l-checkbox"))
        {
            if (g.getTreeManager().options.autoCheckboxEven){
                g.getTreeManager()._setParentCheckboxStatus(treeitem);
            }
            else {
				// 状态:未选中
				if ($(obj).hasClass("l-checkbox-unchecked")) {
					g.trigger('check', [ { data : treenodedata, target : treeitem[0] }, true ]);
				}
				// 状态:选中
				else if ($(obj).hasClass("l-checkbox-checked")) {
					g.trigger('check', [ { data : treenodedata, target : treeitem[0] }, false ]);
				}
            }
        }
	}
};

 权限树:

 

jQuery.ux = $.ux || {};
jQuery.ux.PrivilegeTree = jQuery.extend($.uuzz.Tree, {
	/**
	 * 构建权限树
	 * @param id	divId
	 * @param url	数据请求url
	 * @param delayLoad		是否延迟加载,默认为true
	 * @param param		请求参数
	 */
	buildTree: function(id,url,options){
		var g = this;
		g.setUrl(url);
		g._treeView = $(id).ligerTree({ 
			 method: 'POST',
			 nodeWidth: 150,
			 onCheck: g.onCheck,
			 onAfterAppend:g.onAfterAppend
		 });
		g.setTreeManager($(id).ligerGetTreeManager()); 
		var param = null;
		if(options.param){
			param = options.param;
		}
		
		if(options.delayLoad){
			g.getTreeManager().loadData(null, g.getUrl(), options.param);
		}
	},

	/**
	 * 当选则的节点为非查看权限,则默认勾选查看权限
	 * @param node	当前选择节点
	 * @param checked	是否选择
	 */
	onCheck: function(node, checked){
		var g = $.ux.PrivilegeTree;
		// 更新几点选择状态
		node.data.ischecked = checked;
		
		// 获取父节点数据
		var parentNode = g.getTreeManager().getParent(node.target);
		
		// 获取子节点数据
		var childrenData = null;
		if(parentNode != null){
        	childrenData = parentNode.children;
		}
		
		if(childrenData != null){
			/** 当节点为查看权限时,如果checked为false,则判断同级是否有checked为true的节点,有则查看权限不得取消勾选 **/
	        if(node.data.isBase && !checked){
				// 循环所有子节点,选中isBase=true的子节点
	        	$.each(childrenData, function(i,childNode){
	        		if(!childNode.isBase && childNode.ischecked){
	        			$.ux.Page.uuzzAlertWin('此权限为基本权限,请先取消此模块其它权限', '警告', 'warn', function() {
	        				var selectedNode = g.getTreeManager().getNodeDom(node.data);
	        				g.getTreeManager().selectNode(selectedNode);
						});
	        			return false;
	        		} 
	        	});
	        }
	        
	        /** 当选则的节点为非查看权限,则默认勾选查看权限 **/
	        if(node.data.leaf && checked && !node.data.isBase){
	        	// 循环所有子节点,选中isBase=true的子节点
	        	$.each(childrenData, function(i,child){
	        		if(child.isBase && !node.isBase && checked){
	        			var selectedNode = g.getTreeManager().getNodeDom(child);
	        	        g.getTreeManager().selectNode(selectedNode);
	        		} 
	        	});
	        }
		}
	}
});

 用法:

 

buildTree: function(){
		// 权限树
		if($.uuzz.Common.isEmpty(userPermissions._roleId)){
			userPermissions._roleId = -1;
		}
		
		var param = {  'queryPrivilegePojo.userId' : userPermissions._userId,
		   	   	   	   'queryPrivilegePojo.roleId' : userPermissions._roleId};
		if(userPermissions._privilegeTree.getTreeView() == null){
			var options = { delayLoad: false, param: param };
			userPermissions._privilegeTree.buildTree("#treeView",getContextPath('/admin/system/privilege/appPrivilege!loadUserPrivilege.action'),options);
		}
		userPermissions._privilegeTree.loadData(param);
	},
分享到:
评论

相关推荐

    ligerui之ligerTree_all

    ligerUI,一个轻量级且功能强大的JavaScript UI库,提供了ligerTree组件,专门用于创建交互式的树形结构,帮助开发者在网页上构建出美观且易用的树状菜单或数据展示。 **ligerUI简介** ligerUI是由国人开发的一款...

    ligerTree.js的使用

    总结起来,ligerTree.js是一个专注于树形数据结构的JavaScript库,提供了丰富的操作功能,如展开折叠、动态加载、节点操作等,可以帮助开发者快速构建具有交互性的树形组件。通过提供的文档,开发者可以学习到如何...

    ligerTree的相关知识

    【标题】:“ligerTree”是一种特殊的树形数据结构,其设计目的是为了高效地处理和组织数据。在计算机科学中,树数据结构是常见的非线性数据结构,它由节点(也称为顶点)和边(连接节点的路径)组成。ligerTree可能...

    ligerTree的简介

    ligerTree

    springMVC框架的后台权限管理系统

    LigerTree是一种树形控件,常用于展示层次结构的数据,如在权限管理系统中,可能用于角色和菜单的组织。EasyUI则是一套基于jQuery的UI组件库,提供了丰富的界面元素和布局选项,使开发者能够快速构建美观、响应式的...

    可拖动节点树 源码

    在IT领域,尤其是在前端开发中,"可拖动节点树 源码"是一个非常实用的功能,它允许用户通过鼠标操作来重新组织数据结构。这个功能常见于文件管理器、组织架构图或者任务管理等应用中,使得用户可以直观地调整元素的...

    清晰美观树形结构

    例如,`ligerTree`是LIGERUI提供的主要树形结构组件,通过配置其参数,可以创建出满足特定需求的树形视图。在压缩包文件中,可能包含了LIGERUI的源码、示例代码、文档和必要的资源文件,供开发者参考和使用。 总之...

    jQuery LigerUI V1.1.0

    [增加]支持在树选取数据(配置tree,参数跟ligerTree的参数一致)  [增加]提供Resize方法实现的接口 [优化]细节优化 表格 [增加]汇总方式增加一个render(自定义函数,不限于sum、avg、count、max、min)  ...

    ligerui-LigerRM-V2

    grid.ashx ---- 通用的ligerGrid表格数据加载入口 treegrid.ashx ---- 通用的ligerGrid表格树格式数据加载入口 tree.ashx ---- 通用的ligerTree树格式数据加载入口 select.ashx ---- 通用的ligerComboBox数据加载...

    ligerUI Tree对checkbox的禁用

    ligerUI Tree对checkbox的禁用,设置成只读,只要早jsp中引入此文件即可。

    jQuery ligerUI API.rar_jQuery ligerUI API_ligerui api

    4. 树形视图(ligerTree):用于展示层级结构的数据,支持展开、折叠、拖拽等功能。 5. 分页(ligerPager):提供便捷的页面导航,与数据表格配合使用效果更佳。 四、jQuery ligerUI API的使用 jQuery ligerUI API...

    jquery 界面设计的插件LigerUI

    还包括按钮(LigerButton)、日期选择器(LigerDatepicker)、树形控件(LigerTree)等,满足不同场景下的界面需求。 ### 3. 使用LigerUI的步骤 1. 引入jQuery库和LigerUI的CSS及JS文件。 2. 初始化LigerUI组件,...

    ligerUI

    1. **组件丰富**:ligerUI包含了大量的用户界面组件,如表格(ligerGrid)、下拉选择框(ligerComboBox)、日期选择器(ligerDateEditor)、树形控件(ligerTree)等,这些组件具有良好的交互性和可定制性。...

Global site tag (gtag.js) - Google Analytics