Layui + zTree注意事项

今日尝试了一下layui+ztree的权限更新,有部分内容不容易实现,现在已经解决,特此记录一下,以慰后来者。

一、资源准备。

       资源链接:https://pan.baidu.com/s/1NtN3FYkW28K5rmeqd3rBrQ

       提取码:w87p

     

       css里面还有一个图标包,需要放在同一个根目录下。

二、layui引用

       

 三、修改js

      

 四、菜单效果展示

     

 

 五、js代码

        引用

        

        

       

       授权代码

       

 1 //菜单授权
 2             function powerRole(data) {
 3                 layer.open({
 4                     title: '角色权限分配',
 5                     btn: ['保存', '取消'],
 6                     content: '<ul id="roleAuthTree" class="ztree"></ul>',
 7                     success: function (layero, dIndex) {
 8                         var loadIndex = layer.load(2);
 9                         $.ajax({
10                             url: "../Role/GetRoleAuthListWithRoleId",
11                             type: "get",
12                             dataType: "json",
13                             data: { RoleId: data.RoleId },
14                             success: function (res) {
15                                 layer.close(loadIndex);
16                                 if (res.code == 0) {
17                                     $.fn.zTree.init($('#roleAuthTree'), {
18                                         check: {
19                                             enable: true
20                                         },
21                                         data: {
22                                             simpleData: {
23                                                 enable: true
24                                             }
25                                         }
26                                     }, res.data);
27                                 } else {
28                                     layer.msg(res.msg, { icon: 2 });
29                                 }
30                             }
31                         });
32                         // 超出一定高度滚动
33                         $(layero).children('.layui-layer-content').css({
34                             'max-height': '300px',
35                             'overflow': 'auto'
36                         });
37                     },
38                     yes: function (dIndex) {
39                         var insTree = $.fn.zTree.getZTreeObj('roleAuthTree');
40                         var checkedRows = insTree.getCheckedNodes(true);
41                         var ids = [];
42                         for (var i = 0; i < checkedRows.length; i++) {
43                             ids.push(checkedRows[i].id);
44                         }
45                         var loadIndex = layer.load(2);
46                         $.ajax({
47                             url: "../Role/SaveWithRoleId",
48                             type: "get",
49                             dataType: "json",
50                             data: { roleId: data.RoleId, authIds: ids.join(',')},
51                             success: function (res) {
52                                 layer.close(loadIndex);
53                                 if (res.code === 0) {
54                                     layer.msg(res.msg, {icon: 1});
55                                     layer.close(dIndex);
56                                     //刷新table。也可以考虑刷新页面缓存
57                                     reloadTable();
58                                 }
59                                 else {
60                                     layer.msg(res.msg, { icon: 2 });
61                                 }
62                             }
63                         });                      
64                     }
65                 });
66             }
View Code

六、后台代码

 1  /// <summary>
 2         /// 根据角色ID获取权限列表
 3         /// </summary>
 4         /// <param name="RoleId"></param>
 5         /// <returns></returns>
 6         public object GetListWithRoleId(string RoleId)
 7         {
 8             var MenuInfo = _context.Base_Menu.Where(t => t.DeleteMark == 0)
 9                 .Select(t => new {
10                     name = t.name,
11                     Checked = false,
12                     pId = t.parentid,
13                     id = t.id,
14                     open = true
15                 })
16                 .ToList();
17 
18             var RoleAuthInfo = _context.Base_RoleAuthority.Where(t => t.DeleteMark == 0 && t.RoleId == RoleId)
19                 .Select(t => new {
20                     t.id,
21                     t.Checked
22                 })
23                 .ToList();
24 
25             //左连接
26             var list = MenuInfo.GroupJoin(RoleAuthInfo, left => left.id, right => right.id, (left, right) =>
27             new
28             {
29                 name = left.name,
30                 Checked = right.Where(o => o.id == left.id).ToList().Count > 0 ? right.Where(o => o.id == left.id).ToList()[0].Checked : false,
31                 pId = left.pId,
32                 id = left.id,
33                 open = left.open,
34             }).ToList();
35 
36             return list;
37         }
38 
39         /// <summary>
40         /// 保存角色权限
41         /// </summary>
42         /// <param name="roleId"></param>
43         /// <param name="authIds"></param>
44         /// <returns></returns>
45         public string SaveWithRoleId(string roleId, string authIds)
46         {
47             try
48             {
49                 if (!string.IsNullOrEmpty(roleId))
50                 {
51                     var RoleAuthInfo = _context.Base_RoleAuthority.Where(t => t.RoleId == roleId && t.DeleteMark == 0).ToList();
52 
53                     //查询是否有数据
54                     if (RoleAuthInfo.Count() > 0)
55                     {
56                         foreach (var item in RoleAuthInfo)
57                         {
58                             //追踪数据
59                             var RoleAuthList = _context.Base_RoleAuthority.Single(t => t.AuthId == item.AuthId);
60                             //删除旧的权限数据
61                             _context.Base_RoleAuthority.Remove(item);
62                         }
63 
64                         _context.SaveChanges();
65                     }
66 
67                     //新增新的权限数据
68                     var Authlist = authIds.Split(',');
69                     foreach (var item in Authlist)
70                     {
71                         var MenuInfo = _context.Base_Menu.Where(t => t.id == item && t.DeleteMark == 0).FirstOrDefault();
72                         if (MenuInfo != null)
73                         {
74                             var RoleAuthObj = new RoleAuthorityEntity();
75                             RoleAuthObj.Create();
76 
77                             RoleAuthObj.RoleId = roleId;
78                             RoleAuthObj.id = MenuInfo.id;
79                             RoleAuthObj.Checked = true;
80 
81                             _context.Base_RoleAuthority.AddAsync(RoleAuthObj);
82                             _context.SaveChanges();
83                         }
84                     }
85                 }
86                 else
87                 {
88                     return "角色id未获取到!";
89                 }
90 
91                 return "true";
92             }
93             catch (Exception ex)
94             {
95                 return ex.ToString();
96                 throw ex;
97             }
98         }
ViewCode
原文地址:https://www.cnblogs.com/xiaobaicai12138/p/14469698.html