整体效果
首先，不同的用户在登录成功之后，根据不同的角色，会看到不同的系统菜单，完整菜单如下：
不同用户登录上来之后，可能看到的会有差异，如下：
每个用户的角色是由系统管理员进行分配的，系统管理员给用户分配角色的页面如下：
系统管理员也可以管理不同角色可以操作的资源，页面如下：
其他的删除、搜索等一些琐碎的功能我这里就不再一一介绍了。
项目地址
由于商业协议，原本的项目不能共享给各位小伙伴，因此我专门做了一个开源项目，这个项目的功能整体来说比较多，但是考虑到这个系列的文章主要是向大家介绍权限管理模块，因此其他模块都被我暂时阉割掉了，不过小伙伴们可以放心，权限管理模块的代码一行都没有删除，涉及到权限管理的代码和数据都是完整的，可以直接运行的。小伙伴将以管理员的身份登录到后台系统，登录成功之后，依次点击 系统管理->基础信息设置->权限组 ，即可配置不同角色可以操作的资源；然后依次点击 系统管理->操作员管理 ，即可管理每一位操作员的角色。
项目地址: https://github.com/lenve/vhr
快速部署
1.clone项目到本地 git@github.com:lenve/vhr.git
2.数据库脚本放在hrserver项目的resources目录下，在MySQL中执行数据库脚本
3.数据库配置在hrserver项目的resources目录下的application.properties文件中
4.在IntelliJ IDEA中运行hrserver项目
OK，至此，服务端就启动成功了，此时我们直接在地址栏输入 http://localhost:8082/index.html 即可访问我们的项目，如果要做二次开发，请继续看第五、六步。
5.进入到vuehr目录中，在命令行依次输入如下命令：
# 安装依赖 npm install # 在 localhost:8080 启动项目 npm run dev
由于我在vuehr项目中已经配置了端口转发，将数据转发到SpringBoot上，因此项目启动之后，在浏览器中输入 http://localhost:8080 就可以访问我们的前端项目了，所有的请求通过端口转发将数据传到SpringBoot中（注意此时不要关闭SpringBoot项目）。