1.前端界面1.1 按钮借助elementui中的表格部分
<template slot-scope="scope"> <el-button @click="permissionclick(scope.row)" type="primary" size="mini">修改权限222</el-button></template>
1.2 对话框+树形控件借助elementui中的对话框和树形结构
<!--自写权限222--> <el-dialog title="提示" :visible.sync="dialogpervisible" width="30%" > <!-- :default-expanded-keys="[2, 3]"默认展开项 :default-checked-keys="[5]"默认选中项 --> <el-tree :data="treedata" show-checkbox node-key="id" :props="defaultprops"> </el-tree> <span slot="footer" class="dialog-footer"> <el-button @click="dialogpervisible = false">取 消</el-button> <el-button type="primary" @click="dialogpervisible = false">确 定</el-button> </span> </el-dialog>
data(){ return{ //自写权限树遮罩层 dialogpervisible:false, treedata:[], defaultprops: { children: 'children', //如果不显示命名，注意看请求结果是否为label不是则修改‘label'中的内容 label: 'label' } } }
methods:{ //自写权限点击 permissionclick(row){ this.dialogpervisible=true; this.$http.get("/system/permission/findpermessionbyroleid/"+row.id).then(result=>{ this.treedata=result.data.data.treedata; }) } }
2.后端操作2.1 controller层//自写权限树 @getmapping("findpermessionbyroleid/{roleid}") public commonresult findpermessionbyroleid(@pathvariable string roleid){ return ipermissionservice.findpermessionbyroleid(roleid); }

2.2 serviceimpl层此处使用todo可以在后面进行查找此业务是否完成
//自写树结构的获取 @override public commonresult findpermessionbyroleid(string roleid) { //查询所有的权限 querywrapper<permission> wrapper=new querywrapper<>(); //逻辑删除列考虑在内 还有一个状态列数据库暂未考虑 wrapper.eq("is_deleted",0); list<permission> permissionlist = permissionmapper.selectlist(wrapper); //设置层级关系 list<permission> firstmenus=new arraylist<>(); for (permission first:permissionlist) { //int if(first.getpid().equals("1")){ firstmenus.add(first); } } //为一级菜单设置二级菜单 for (permission first : firstmenus) { //根据一级菜单id 查询 该菜单的二级菜单，如果出现不确定有几级菜单 那么我们可以使用方法的递归调用 first.setchildren(findchildren(permissionlist,first.getid())); } //todo根据角色查询该角色具有的权限id map<string,object> map=new hashmap<>(); //treedata为前端要接收的值 map.put("treedata",firstmenus); return new commonresult(2000,"查询成功",map); } //方法递归 public void getcheckkey(permission p,list<string> list){ if(p.getchildren() == null || p.getchildren().size() == 0){ list.add(p.getid()); return; } list<permission> children = p.getchildren(); for (permission per : children){ getcheckkey(per, list); } }
2.3 结果展示
2.4 查对应的权限菜单（使用中间表）2.4.1 后端处理(权限回显)使用mybatis-plus生成中间表（rolepermission）
相对于之前添加了根据角色查询该角色具有的权限id内容
//调中间层 @autowired private irolepermissionservice irolepermissionservice; //自写树结构的获取 @override public commonresult findpermessionbyroleid(string roleid) { //查询所有的权限 querywrapper<permission> wrapper=new querywrapper<>(); //逻辑删除列考虑在内 还有一个状态列数据库暂未考虑 wrapper.eq("is_deleted",0); list<permission> permissionlist = permissionmapper.selectlist(wrapper); //设置层级关系 list<permission> firstmenus=new arraylist<>(); for (permission first:permissionlist) { //int if(first.getpid().equals("1")){ firstmenus.add(first); } } //为一级菜单设置二级菜单 for (permission first : firstmenus) { //根据一级菜单id 查询 该菜单的二级菜单，如果出现不确定有几级菜单 那么我们可以使用方法的递归调用 first.setchildren(findchildren(permissionlist,first.getid())); } //根据角色查询该角色具有的权限id querywrapper<rolepermission> wrapper1=new querywrapper<>(); //根据角色id获得权限 wrapper1.eq("role_id",roleid); list<rolepermission> list = irolepermissionservice.list(wrapper1); //由集合转换为查询permissionid list<string> collect = list.stream().map(item -> item.getpermissionid()).distinct().collect(collectors.tolist()); map<string,object> map=new hashmap<>(); //treedata为前端要接收的值 map.put("treedata",firstmenus); map.put("checkids",collect); return new commonresult(2000,"查询成功",map); } //方法递归 public void getcheckkey(permission p,list<string> list){ if(p.getchildren() == null || p.getchildren().size() == 0){ list.add(p.getid()); return; } list<permission> children = p.getchildren(); for (permission per : children){ getcheckkey(per, list); } }
2.4.2 前端处理
methods:{ //自写权限点击 permissionclick(row){ this.dialogpervisible=true; this.$http.get("/system/permission/findpermessionbyroleid/"+row.id).then(result=>{ this.treedata=result.data.data.treedata; settimeout(()=>{ result.data.data.checkids.foreach(value=>{ this.$refs.roottree.setchecked(value,true,false); }) },100) }) }}
点击遮罩层的确定处理
<el-button type="primary" @click="confirmfen()">确 定</el-button>
添加角色id
点击确定时
methods:{ //自写权限遮罩层确定 confirmfen(){ //1.获取全选和半选的树 获取对象 var checkednodes = this.$refs.roottree.getcheckednodes(false,true); //console.log(checkednodes) var ids=[]; checkednodes.foreach(item=>{ ids.push(item.id); }) //console.log(ids) this.$http.post("/system/rolepermission/"+this.roleid,ids).then(result=>{ if(result.data.code===2000){ this.dialogpervisible=false; this.$message.success("分配权限成功"); } }) }}
console.log打印的结果（第二处ids）
2.4.3 后端处理（确定修改权限）controller层
//自写权限树 @getmapping("findpermessionbyroleid/{roleid}") public commonresult findpermessionbyroleid(@pathvariable string roleid){ return ipermissionservice.findpermessionbyroleid(roleid); }

serviceimpl层
@override @transactional//事务 public commonresult fen(string roleid, list<string> ids) { //删除roleid对应的权限 querywrapper<rolepermission> wrapper=new querywrapper<>(); wrapper.eq("role_id",roleid); this.remove(wrapper); //添加 list<rolepermission> collect = ids.stream().map(item -> new rolepermission(null, roleid, item, 0, localdatetime.now(), localdatetime.now())).collect(collectors.tolist()); this.savebatch(collect); return new commonresult(2000,"分配成功",null); }
实体类添加
启动类添加
以上就是java前后端分离之权限管理的方法是什么的详细内容。