首页 > 代码库 > 做权限树时 使用EasyUI中Tree

做权限树时 使用EasyUI中Tree

符合EasyUI中Tree的Json格式,我们先看一下,格式是如何的

<span style="font-size:18px;">[{	"id":1,	"text":"My Documents",	"children":[{		"id":22,		"text":"Photos",		"state":"closed",		"children":[{			"id":111,			"text":"Friend"		},{			"id":112,			"text":"Wife"		},{			"id":113,			"text":"Company"		}]	},{		"id":12,		"text":"Program Files",		"children":[{			"id":121,			"text":"Intel"		},{			"id":122,			"text":"Java",			"attributes":{				"p1":"Custom Attribute1",				"p2":"Custom Attribute2"			}		},{			"id":123,			"text":"Microsoft Office"		},{			"id":124,			"text":"Games",			"checked":true		}]	},{		"id":13,		"text":"index.html"	},{		"id":14,		"text":"about.html"	},{		"id":15,		"text":"welcome.html"	}]}]</span>

 

第一次看了之后,由于没有思路就给放弃了,就采取了Tree中的老大ZTree,可以问题接踵而至,它与前台的EasyUi有时会发生冲突,没办法最后还是只能采取EasyUi中Tree,仔细分析一下,貌似可以采用算法中的递归来实现,于是乎小编就有了以下的解决思路。

 

1.先创建一个符合EasyUi中树形格式的类

<span style="font-size:18px;">    /*  树的节点类       id:节点id,对载入远程数据很重要。       text:显示在节点的文本。       state:节点状态,‘open‘ or ‘closed‘,默认为‘open‘。当设置为‘closed‘时,拥有子节点的节点将会从远程站点载入它们。       checked:表明节点是否被选择。       children:子节点,必须用数组定义。    */    public class TreeNode    {        public string id { get; set; }  //节点的id值        public string text { get; set; }  //节点显示的名称        public string state { get; set; }//节点的状态        public bool Checked { get; set; }             public List<TreeNode> children { get; set; }  //集合属性,可以保存子节点    }</span>

 

2.把从后台查出来的对象,转换成为EasyUi中格式

<span style="font-size:18px;">#region 2.0 将当前组织 对象 转成 树节点对象 +TreeNode ToNode()        /// <summary>        /// 将当前组织 对象 转成 树节点对象        /// </summary>        /// <returns></returns>        public TreeNode ToNode()        {            TreeNode node = new TreeNode()            {                id = this.pid,                text = this.OrganizationName,                state = "open",                Checked = false,                           children = new List<TreeNode>()            };            return node;        }        #endregion</span>

3.第三步通过递归转换好的树形节点,来找到自己的子节点,然后放到自己默认的属性中

<span style="font-size:18px;">   #region 2.0 将 组织集合 转成 树节点集合 +List<MODEL.EasyUIModel.TreeNode> ToTreeNodes(List<Ou_Permission> listPer)        /// <summary>        /// 将 组织集合 转成 树节点集合        /// </summary>        /// <param name="listPer"></param>        /// <returns></returns>        public static List<TreeNode> ToTreeNodes(List<Organization> listPer)        {            List<TreeNode> listNodes = new List<TreeNode>();            //生成 树节点时,根据 pid=0的根节点 来生成            LoadTreeNode(listPer, listNodes, "0");            return listNodes;        }        #endregion        #region 3.0 递归组织集合 创建 树节点集合        /// <summary>        /// 递归组织集合 创建 树节点集合        /// </summary>        /// <param name="listPer">组织集合</param>        /// <param name="listNodes">节点集合</param>        /// <param name="pid">节点父id</param>        public static void LoadTreeNode(List<Organization> listPer, List<TreeNode> listNodes, string pid)        {            foreach (var permission in listPer)            {                //如果组织父id=参数                if (permission.pParent == pid)                {                    //将 组织转成 树节点                    TreeNode node = permission.ToNode();                    //将节点 加入到 树节点集合                    listNodes.Add(node);                    //递归 为这个新创建的 树节点找 子节点                    LoadTreeNode(listPer, node.children, node.id);                }            }        }        #endregion</span>

 

通过以上操作最终就返回了类似树形结构的集合,只要在转换为Json串就OK了,当然也可以采用strbuilder的形式来拼接,但是那样操作起来有点太麻烦了,所以采取了递归的形式。



 

<script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"1","bdMiniList":false,"bdPic":"","bdStyle":"0","bdSize":"16"},"share":{}};with(document)0[(getElementsByTagName(‘head‘)[0]||body).appendChild(createElement(‘script‘)).src=http://www.mamicode.com/‘http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion=‘+~(-new Date()/36e5)];</script>

做权限树时 使用EasyUI中Tree