权限分配和管理方式:根据员工分配相应的角色,相应的角色绑定了对应的权限。
一 给用户分配角色:
思路:请求角色列表,将角色信息通过for循环渲染到角色弹层上,然后根据用户id,点击对应的角色按钮,添加角色。
角色信息:
关闭弹层:2个方法
二 权限列表增删改查:
思路:获取用户权限列表,对权限进行:新增,删除(根据点击的id进行调用接口删除),修改
使用element的树形结构:
首先调用方法将数据转换为树形,因为树形的数据结构有要求。
展示添加按钮判断:只在1级的时候显式
开启:按钮配置
添加权限:(添加权限和编辑权限都写在同一个确定按钮的的方法里) 首先对form表单进行校验,然后调用添加接口
注意:并且添加权限还分2种情况,
编辑权限:调用编辑权限接口,会将权限内容回写到编辑弹层中
确定按钮:(添加权限和编辑权限都写在同一个确定按钮的的方法里) 也要首先对form表单进行校验,然后调用添加接口
最后 取消按钮关闭弹层等操作
判断:展示新增还是编辑弹层的标题:
三 给角色分配权限:
思路:
1.点击分配权限,弹层出来,发送所有权限请求,获取权限列表数据,将数据转换为树形,渲染到弹层上,根据id,将权拥有的权限数据回写
2点击 确定按钮,发送对应的请求,将权限分配给对应的角色
复选框:父子不关联
将权拥有的权限数据回写:
点击确定:调用el-tree的方法,采用ref绑定之后进行处理,获取到所有被选中的权限数据,点击确定,调用接口,分配权限给角色
四 前端权限应用-页面访问和菜单
之前写好的一个伏笔:return
重点:
五 静态路由和动态路由解除合并