后台管理系统开发

1. 后台管理系统——前端技术栈

• vue.js2.0中文：优秀的JS框架

• vue-router： vue.js 配套路由

• vuex：vue.js 应用状态管理库

• Element：饿了么提供的UI框架

• axios：基于Promise的HTTP客户端，用于浏览器和node.js

• Mock.js：生成随机数据

• ECharts：百度的图表生成库

• 一个系列案例：https://www.cnblogs.com/xifengxiaoma/p/9533018.html

1. 后台管理系统——后端技术栈

• Spring Boot

• MySQL

• MyBatisPlus：简化Mybatis开发

• redis：缓存的key-value数据库

• shiro：权限管理框架

• 定时任务：SpringBoot自带、Quartz框架

• 邮件

• POI：操作excel表格等

• WebSocket

• 代码生成器

3. 权限控制方案

后台管理系统当然少不了权限控制，至于权限控制，前端方面当然就是对页面资源的访问和操作控制。

前端资源权限主要又分为两个部分，即导航菜单的查看权限和页面增删改操作按钮的操作权限。

我们的设计把页面导航菜单和页面操作按钮统一存储在菜单数据库表中

菜单表中包含以下权限关注点：

菜单类型

菜单类型代码页面资源的类型。类型包括，0：目录 1：菜单 2：按钮。

权限标识

权限标识即是代表此页面资源，用来进行权限控制的唯一标识，主要是进行增删改查的权限控制。

权限标识包括，sys:user:add：新增 sys:user:edit：编辑 sys:user:delete：删除 sys:user:view：查看

4. 菜单实现思路

• 用户登录系统

用户登录系统之后，跳转到首页。

• 根据用户加载导航菜单

在路由导航守卫路由时加载用户导航菜单并存储到store。

加载过程如下，返回结果排除按钮类型。

user -> user_role -> role -> role_menu -> menu。

• 导航栏读取菜单树

导航栏到store读取导航树并进行展示。

1. 页面按钮实现思路

• 用户登录系统

用户登录系统之后，跳转到首页。

• 根据用户加载权限标识集合

在路由导航守卫路由时加载用户权限标识集合。

加载过程如下，返回结果是用户权限标识的集合。

user -> user_role -> role -> role_menu -> menu。

5、 页面按钮控制

页面操作按钮提供权限标识，查询是否在用户权限标识集合中。

在：有权限，可见或可用，不在：无权限，不可见或禁用。