一、前言

最近有时间研究了一下做后台管理系统的模板界面，开源的比较知名很早之前就用过EasyUI。Vue+ElementUI，Layui，Bootstrap等。

EasyUI个人感觉功能强大，帮助web开发者更轻松的打造出功能丰富的UI界面，通过编写一些简单HTML标记，就可以定义用户界面，只是呢界面没那么好看。

Vue是很不错的开源框架，目前比较火，ElementUI界面也好看，只是要花多点时间学习，我发现Vue+ElementUI做前后端分离的，前端打包发布部署后，如果要修改一点样式又要重新打包部署，不能单个文件修改发布上去，这点感觉不方便，如果有知道可以解决这个问题的朋友可以评论区留言告知下。

Layui遵循原生的开发方式。极易上手，开箱即用，非常适合网页界面的快速开发，更多是面向于后端开发者，做后台管理界面，最近研究过Layui做后台管理，虽然功能做出来了，只是在使用过程中一些细节上不太顺畅。

说回今天的主题，AdminEx是一个扁平化设计管理平台框架主题，响应式设计bootstrap3后台管理模版，集合了很多有用的jQuery组件，正常的组织和结构化，这样不需要花很多的时间在您的web应用程序集成上。使用AdminEx增强用户体验的应用程序，并给它一个精致的UI设计，AdminEx界面还是很比较美观好看的。文章主要是使用AdminEx做后台管理系统界面、用户权限管理界面设计。当然用户权限管理功能也已经完全实现。

度娘搜索AdminEx，可以找到演示和下载，这里为方便整理出可用的演示和下载地址：

演示：https://www.jq22.com/demo/AdminEx-141217204554/index.html

下载：https://gitee.com/coderdlg/adminex

二、使用

代码下载下来是这样的，将文件夹css、fonts、images、js拷贝到项目中静态资源目录下即可，想要什么样的界面参考AdminEx提供html页面如下图将html页面内容拿过去修改。这里需要注意头部尾部引用的js、css文件顺序，可以抽取出来作为一个单独的公共文件，引入到业务页面文件头部尾部使用。

三、用户权限管理系统界面

首页

可以看到首页和AdminEx官网的首页一样。左侧菜单数据是根据用户角色权限动态从后台获取的，右上角用户信息也是动态获取展示。

登录页

登录页也和AdminEx官网的登录页面一样。登录会判断账号是否存在、密码是否正确、验证码是否正确。三者都正确才能登录成功。

退出登录

3.1 系统管理-权限管理（重点）

3.1.1 用户管理

用户查询

说明：使用AdminEx模板的UI Elements-Panels 的Custom panel 普通面板作为查询条件框、数据展示框，查询条件使用Forms-Forms Layouts里的INLINE FORM 内联表单，按钮使用UI Elements-Buttons，表格使用bootstrap-table，分页功能已经实现。查询条件部门是从后台获取的数据，树形展示，时间使用Forms-Pickers。表格右上角搜索图标点击【隐藏/显示查询条件框】。

添加用户

说明：使用Forms-Forms Layouts-Form in Modal，modal模态框作为弹出显示，红色*必填，没有填不能进入后台业务逻辑。点击【保存】会锁住当前窗口，防止重复提交，当然后台代码也实现防重复操作控制。操作成功弹出成功提示，失败也会有相应的错误提示。

修改用户

点击表格左上角【修改】要选中记录才能进入修改界面。表格行数据操作点击【编辑】直接进入修改界面。

删除用户

点击表格左上角【删除】要选中记录，进入删除确认界面

重置密码

分配角色（重点）

选中某条用户记录进入分配角色界面，左侧展示的是未分配角色数据，右侧默认展示已分配的角色。点击左侧角色会移动到右侧中，如选择错了，可点击右侧角色移除，确定没问题点击【保存】按钮提交数据。数据保存成功后也会提示。

数据权限

选中记录，点击【数据权限】按钮进入数据权限控制界面，可选有全部数据权限、自定义数据权限、本部门数据权限、本部门及以下数据权限、仅本人数据权限。

导出

3.1.2 角色管理

角色查询

分配菜单权限（重点）

新增修改角色界面，界面有展示资源数据，资源有目录、菜单、按钮。选中需要分配的菜单、按钮即可。权限可以控制到按钮级别。

角色删除（略）

3.1.3 菜单管理

资源查询

这里是叫资源比较贴切，资源有目录、菜单、按钮。权限可以控制到按钮级别、数据级别。查询条件上级资源作为树形展示。资源有自己编号、上级编号、资源名称、资源地址、资源图标、资源类型、资源排序、权限标识。

资源添加

点击菜单类型目录/菜单/按钮，表单会跟着变化，比如按钮没有请求地址，请求地址输入框就会隐藏。上级菜单弹出另一个modal模态框树形展示供选择。

资源修改

资源删除（略）

3.2 部门管理

3.3 字典管理

系统中都会有一些静态数据，比如性别、身份证类型、状态等等。字典数据在系统中是比较常见的，可以不用重复加载获取，获取一次存在缓存中即可。

字典类型

字典数据

3.4 参数设置

参数设置可以用来动态设置系统的部分功能，如显示验证码不，显示页脚不等等。

3.5 通知公告

3.6 日志管理

3.6.1 操作日志

3.6.2 登录日志

3.7 在线用户

3.8 数据监控

3.9 服务监控

3.10 缓存监控

3.11 其他界面

404页面

500页面

403页面

这里是根据用户角色权限分配菜单的，正常情况下，没有该菜单权限就不应该分配有该菜单，不会显示在左侧页面上。当然如果菜单权限标识不正确，就会出现如下页面。

没有查询数据的权限

同理，没有相关按钮的权限，页面上按钮就不会显示。

消息提示

信息提示、警告提示、成功提示、失败提示、确认提示、toast提示

修改密码

个人中心

其他功能界面（省略）

四、内置功能

用户管理：用户是系统操作者，该功能主要完成系统用户配置。
部门管理：配置系统组织机构（公司、部门、小组），树结构展现支持数据权限。
岗位管理：配置系统用户所属担任职务。
菜单管理：配置系统菜单，操作权限，按钮权限标识等。
角色管理：角色菜单权限分配、设置角色按机构进行数据范围权限划分。
字典管理：对系统中经常使用的一些较为固定的数据进行维护。
参数管理：对系统动态配置常用参数。
通知公告：系统通知公告信息发布维护。
操作日志：系统正常操作日志记录和查询；系统异常信息日志记录和查询。
登录日志：系统登录日志记录查询包含登录异常。
在线用户：当前系统中活跃用户状态监控。
定时任务：在线（添加、修改、删除)任务调度包含执行结果日志。
代码生成：前后端代码的生成（java、html、xml、sql）支持CRUD下载。
系统接口：根据业务代码自动生成相关的api接口文档。
在线构建器：拖动表单元素生成相应的HTML代码。
服务监控：监视当前系统CPU、内存、磁盘、堆栈等相关信息。
缓存监控：对系统的缓存查询，删除、清空等操作。
连接池监视：监视当前系统数据库连接池状态，可进行分析SQL找出系统性能瓶颈。

五、技术选型

1、系统环境

Java EE 8
Servlet 3.0
Apache Maven 3

2、主框架

Spring Boot 2.2.x
Spring Framework 5.2.x
Apache Shiro 1.7

3、持久层

Apache MyBatis 3.5.x
Hibernate Validation 6.0.x
Alibaba Druid 1.2.x

4、视图层

Bootstrap 3.3.7
Thymeleaf 3.0.x
AdminEx

六、结语

本人使用AdminEx模板来设计的用户权限管理系统界面。采用（Spring Boot、Apache Shiro、MyBatis、Thymeleaf）。项目简洁美观、优秀实用、功能强大，可扩展功能多（vx : dyutime）。

AdminEx后台管理系统模板、用户权限管理设计、按钮级别相关推荐

大型门户网站的RBAC用户权限管理设计
这是我在网上找的一些设计比较好的RBAC权限管理不知道,像新浪.搜狐.网易.百度.阿里巴巴.淘宝网的RBAC用户权限这一块,都是这种细颗粒的RBAC设计开发,还是把他们像用户组.角色组.权限组.操作 ...
多用途bootstrap后台管理系统模板企业统计管理界面模板
介绍: 基于bootstrap构建,响应式的电子商务后台管理系统ui页面模板. 适用于:电商销售统计.企业统计管理界面模板. 网盘下载地址: http://kekewl.net/yYrcYaCFVAU ...
java用户权限管理与角色设置（一）
实现业务系统中的用户权限管理--设计篇 B/S系统中的权限比C/S中的更显的重要,C/S系统因为具有特殊的客户端,所以访问用户的权限检测可以通过客户端实现或通过客户端+服务器检测实现,而B/S中,浏览 ...
3YAdmin-专注通用权限控制与表单的后台管理系统模板
3YAdmin基于React+Antd构建.GitHub搜索React+Antd+Admin出来的结果没有上百也有几十个,为什么还要写这个东西呢? 一个后台管理系统的核心我认为应该是权限控制,表单以及 ...
PHP:【商城后台管理系统】部署角色管理，角色添加，菜单权限，删除角色功能
PHP:[商城后台管理系统]部署角色管理,角色添加,菜单权限,删除角色功能一.角色管理界面 ①首页 ②角色添加 ③角色编辑 ④角色删除二.部署流程部署流程后端采用thinkphp6.0框架,角 ...
基于easyui 1.3.6设计的后台管理系统模板界面
原文:基于easyui 1.3.6设计的后台管理系统模板界面源代码下载地址:http://www.zuidaima.com/share/1843477461879808.htm
通用权限管理设计之数据权限
阅读目录前言初步分析通用查询机制数据权限规则实际应用结语前言前一篇文章<通用权限管理设计之数据库设计方案>介绍了[主体]- [领域] - [权限]( who.what. ...
ASP.NET MVC 企业级实战 —— 创建用户权限管理范例程序（三）
上一篇,主要讲解了模型的创建和利用Entity Framework来操作数据库,这篇我们会讲解如何创建控制器和视图. 由于最近很多网友反馈在VS 2012 无法安装NBlock框架模版,故再次声明,N ...
CRM后台管理系统：HTML+CSS+JavaScript制作企业网站后台管理系统模板网站(46个页面)
CRM后台管理系统:HTML+CSS+JavaScript制作企业网站后台管理系统模板网站(46个页面) 一款使用Bootstrap构建,多个主页版本的企业网站后台管理系统,咨询管理,数据统计后台管理 ...

AdminEx后台管理系统模板、用户权限管理设计、按钮级别