当前位置：首页 > web >正文

ShenNiusModularity项目源码学习（22：ShenNius.Admin.Mvc项目分析-7）

web 2025/5/6 11:58:45

角色列表页面用于新建、编辑、删除系统角色，同时设置角色的菜单访问权限。该页面对应的文件Index.cshtml位于ShenNius.Admin.Mvc项目的Areas\Sys\Views\Role内，同目录下还有Modify.cshtml（新建、编辑角色）、SetMenu.cshtml（设置角色的菜单权限），页面使用的控制器类RoleController.cs位于Areas\Sys\Controllers内，页面调用的WebApi接口是ShenNius.Admin.API项目内Controllers\Sys的RoleController.cs，主要使用其中的Deletes、SoftDelete、GetListPages、Add、Modify等函数。
在这里插入图片描述
主页面布局比较简单，上方为工具栏，下面是数据表格显示区域。页面加载后，调用WebApi接口GetListPages分页获取已定义的角色数据。

分别定义事件处理函数处理工具栏按钮点击事件及数据行中的按钮点击事件，新建和编辑按钮调用的都是Modify.cshtml页面，而删除按钮的话，点击工具栏中的删除按钮，处理逻辑是将选中的记录软删除，后续还能在回收站中恢复，而点击数据行中的删除按钮，则是直接删除数据库中的数据，无法恢复。
Modify.cshtml页面布局比较简单，用的layui的表单样式，只是在点击“确认保存”按钮时根据是否存在角色id判断是新建（调用Add）还是编辑操作（调用Modify）。
在这里插入图片描述

设置权限页面左侧显示当前角色能访问的菜单列表，打钩的即为可访问菜单，点击下方的“保存菜单权限”调用WebApi接口MenuController.AddPermissions保存当前角色的菜单列表。

设置权限页面加载后，调用WebApi接口MenuController.TreeByRole函数通过ShenNius.Infrastructure项目的MenuRepository.TreeRoleIdAsync函数获取所有菜单列表及当前角色可用的菜单列表，用这些数据初始化页面左侧的树组件，同时调用WebApi接口MenuController.BtnCode函数初始化右侧的按钮列表。
当勾选左侧的菜单节点时，会触发右侧表格组件的重加载事件，根据当前勾选的菜单显示当前角色在勾选菜单中的可用按钮设置。点击右侧表格中的操作列，设置某一按钮的操作权限，会实时调用WebApi接口MenuController.SetBtnPermissions保存当前页面中的按钮权限。
权限设置方式用着不是很方便，右侧的按钮列表只有在左侧菜单节点勾选时才会重载，取消勾选或者点击菜单名称右侧的列表都不会刷新，最好能点击菜单名称就能重新加载右侧按钮列表。
在这里插入图片描述