layui后台管理系统 - 权限树表格

下面是我的项目链接，喜欢的可以star一下：

基于springboot + layui 的后台管理系统

先上截图：

采用的是layui -tree 插件 :

演示地址：https://whvse.gitee.io/treetable-lay/

项目地址： https://gitee.com/whvse/treetable-lay

后端：

 @GetMapping("/permissionList")@ResponseBodypublic Object permissionList(HttpSession session,Integer id){List<TreeMenu> treeMenuList = treeMenuService.selectAll();if(id != null){List<TreeMenu> atList = treeMenuService.selectByRoleId(id);for(TreeMenu info : treeMenuList){for(TreeMenu at : atList){if(info.getId().equals(at.getId())){info.setChecked(true);}}}}HashMap<String, Object> rest = new HashMap<>();rest.put("code",0);rest.put("msg","ok");rest.put("data",treeMenuList);return rest;}

实体类：

public class TreeMenu {private Integer id;private Integer pid;private String name;private String icon;private String url;private Boolean checked = false;//添加元素private List<TreeMenu> children = new ArrayList<>();//省略get set

前端：和layui table用法差不多，有些扩展

layui.config({base: '/layuiadmin/extend/'}).extend({treetable: 'treetable/treetable'}).use(['treetable','table','jquery'], function () {var treetable = layui.treetable;var table = layui.table;var $ = layui.jquery;// 渲染表格treetable.render({treeColIndex: 2,          // treetable新增参数treeSpid: -1,             // treetable新增参数treeIdName: 'd_id',       // treetable新增参数treePidName: 'd_pid',     // treetable新增参数treeDefaultClose: true,   // treetable新增参数treeLinkage: true,        // treetable新增参数elem: '#table1',url: '/manager/permissionList',cols: [[{type: 'numbers'},{field: 'name', title: '名称'},{field: 'url', title: '路径'},{templet:'#oper-col',title:'操作'}]]});table.on('tool(table1)',function (obj) {var data = obj.data;var layEvent = obj.event;if(layEvent === 'del'){layer.confirm('真的删除行么', function(index){del(data,obj,index);});}else if(layEvent === 'edit'){layer.open({type: 2,title: '添加权限',skin: 'layui-layer-demo', //加上边框area: ['500px', '450px'], //宽高content: '/manager/addPermission?type=edit&id='+data.id});}else if(layEvent === 'add'){layer.open({type: 2,title: '添加权限',skin: 'layui-layer-demo', //加上边框area: ['500px', '450px'], //宽高content: '/manager/addPermission?type=add&id='+data.id});}})function del(data,obj,index){var jsonObj = {};jsonObj["ids[0]"] = data.id;$.ajax({url:'/manager/delPermission',data:jsonObj,dataType:'json',type:'post',success:function (data) {if (data.success){obj.del(); //删除对应行（tr）的DOM结构layer.close(index);}else{layer.msg(data.message);}}})}var active = {addParent:function () {layer.open({type: 2,title: '添加权限',skin: 'layui-layer-demo', //加上边框area: ['500px', '450px'], //宽高content: '/manager/addPermission?type=addParent'});}}$('.layui-btn.layuiadmin-btn-admin').on('click', function(){var type = $(this).data('type');active[type] ? active[type].call(this) : '';});});```

layui后台管理系统 - 权限树表格相关推荐

jfinal后台获取权限树，以供前台展示
2019独角兽企业重金招聘Python工程师标准>>> 一.我们平时做项目的时候与权限相关的基本都由技术主干做好了,或者只是套用其他项目的,修修改改,一般人很少有机会涉及权限这一块, ...
VUE后台管理系统权限管理
VUE后台管理系统权限管理(面试路由守卫) 1.背景后台管理系统中总会遇到权限分配的问题:这也是一道vue的很经典的面试问题 2.解决思路权限管理无非前端或者后台解决先说一下前端解决的思路:在设 ...
vue+element后台管理系统(下载excel表格)
标题 vue后台管理系统下载excel表格 1.调用后台接口传入三个参数,url,data参数,第三个参数为一个对象,表格下载返回类型. 2.创建 Blob实列传入后台返回的数据和以对象形式声明类型参 ...
P22-Vue3后台管理系统-权限管理之路由守卫判断⽤户登录状态
P22-Vue3后台管理系统-权限管理之路由守卫判断⽤户登录状态文章目录 P22-Vue3后台管理系统-权限管理之路由守卫判断⽤户登录状态 1.概述 2.mock接口返回token 2.1.mock ...
SSM框架实现后台管理系统权限管理（用户、菜单、角色）
文章目录后台管理系统开发一.数据库表结构设计 1.菜单表menu 2.用户表user 3.角色表role 4.角色权限表role_menu 5.用户角色表user_role 二.项目准备 1.创建 ...
c# 基于layui的通用后台管理系统_【SpringBoot】三十三、SpringBoot+LayUI后台管理系统开发脚手架...
点击蓝色字免费订阅,每天收到这样的好信息前言:最近有不少粉丝关注本公众号.并且我已经成功开通了流量主同时会赚一点点广告费,我打算每个月把这部分钱拿出来给大家买点书刊,算是给大家一点福利吧.大家想买什 ...
【SpringBoot】33、SpringBoot+LayUI后台管理系统开发脚手架
Asurplus-Vue:[SpringBoot]五十四.SpringBoot+VUE后台管理系统开发脚手架本期给大家推荐我自己写一个开源项目:Asurplus-LayUI,本着减少大量重复开发工作 ...
druid拦截器_CMS基于SpringBoot+Shiro+Mybatis+Druid+layui后台管理系统
contentManagerSystem后台管理系统简介 contentManagerSystem,后台管理系统,采用SpringBoot构建整个项目框架,apacheShiro权限验证,mybat ...
tp6+layui后台管理系统
项目介绍一款 PHP 语言基于 ThinkPhp6.x.Layui.MySQL等框架精心打造的一款模块化.插件化.高性能的前后端分离架构敏捷开发框架,可用于快速搭建前后端分离后台管理系统,本着简化开 ...
thinkphp5+layui后台管理系统
卡擦卡擦卡的写了一个后台管理基本系统,希望能够帮到有需要的人. git地址:https://github.com/taoyonbin/php-layui-admin 1.拿来即用的后台管理系统框架 2 ...

layui后台管理系统 - 权限树表格

layui后台管理系统 - 权限树表格

下面是我的项目链接，喜欢的可以star一下：

先上截图：

采用的是layui -tree 插件 :

演示地址：https://whvse.gitee.io/treetable-lay/

项目地址： https://gitee.com/whvse/treetable-lay

后端：

实体类：

前端：和layui table用法差不多，有些扩展

layui后台管理系统 - 权限树表格相关推荐

最新文章

热门文章