用户列表页面用于检索、新建、编辑、删除系统用户,同时设置用户角色。该页面对应的文件Index.cshtml位于ShenNius.Admin.Mvc项目的Areas\Sys\Views\User内,同目录下还有Modify.cshtml(新建、编辑用户)、SetRole.cshtml(设置用户的角色),其它的像登录页面、修改密码页面、查看用户信息等页面就不在本文中介绍。页面使用的控制器类UserController.cs位于Areas\Sys\Controllers内,页面调用的WebApi接口是ShenNius.Admin.API项目内Controllers\Sys的UserController.cs,主要使用其中的Deletes、SoftDelete、GetListPages、Modify等函数。
主页面布局方面:上方为搜索栏,中间为工具栏,下面是数据表格显示区域。页面加载后,调用WebApi接口GetListPages分页获取已定义的用户数据。搜索按钮事件处理函数其实就是调用table.reload重新加载表格数据,同时将搜索栏条件传入后台服务按条件检索。
分别定义事件处理函数处理工具栏按钮点击事件及数据行中的按钮点击事件,新建和编辑按钮调用的都是Modify.cshtml页面,而删除按钮的话,点击工具栏中的删除按钮,处理逻辑是将选中的记录软删除,后续还能在回收站中恢复,而点击数据行中的删除按钮,则是直接删除数据库中的数据,无法恢复。
Modify.cshtml页面布局属于常规的layui表单样式,只是在点击“确认保存”按钮时根据是否存在用户id判断是新建(调用Add)还是编辑操作(调用Modify)。
勾选某一用户,点击上方的设置角色按钮,弹出SetRole.cshtml页面,调用调用WebApi接口RoleController.GetListPagesByUser分页显示系统当前定义的角色列表及用户当前具有的角色。定义事件监听函数,点击某一角色的操作列,会实时调用WebApi接口UserController.SetRole添加或取消用户角色。
参考文献:
[1]https://gitee.com/shenniu_code_group/shen-nius.-modularity