# 菜单规则（路由与权限）
BuildAdmin实现了非常强大的路由与权限模块。
- 路由与权限可在后台可视化增删改查
- WEB端路由自动注册
- WEB端按钮级鉴权
- 无限子级菜单(权限节点)
- 前后两端双鉴权
- 更多待您自行探索
# 菜单规则管理
我们在后台内置了菜单规则管理功能，因为此功能设计略显复杂，此处对该功能进行介绍。
# 菜单推荐设计规则
| 规则标题 | 规则类型 | 规则名称 | 路由路径 | 设计建议 |
|---|---|---|---|---|
| 权限管理 | 目录 | auth | auth | 名称和路由路径直接使用目录名即可 |
| 示例 | 目录 | authLog | authLog | 多单词时，名称和路由路径直接使用小写驼峰命名即可 |
| 添加 | 按钮 | auth/group/index | 按钮无需路由路径，名称则直接按父级/按钮名称设计 | |
| 控制台 | 一级菜单 | dashboard/dashboard | dashboard | 名称使用文件名/文件名，路由路径直接使用文件名 |
| 权限管理 | 二级菜单 | auth/group | auth/group | 名称使用目录/文件名，路由路径同名称 |
| 管理日志 | 二级菜单 | auth/adminLog | auth/adminLog | 文件名小写驼峰，名称和路由路径目录/文件名 |
# 特殊字段详细解释
- 规则名称：规则的名称应该是英文的，同时将自动注册为
Vue Router的路由name，以方便开发者随时导航，我们推荐直接使用/来分隔目录层次，并使用小写驼峰语法来分隔多个单词。 - 路由路径：比如您正在看的网页的路径是：
/senior/addMenuRule，您需要为当前规则设计一个路由路径，您可以使用以上表格中我们推荐的规则进行设计。 - 菜单类型：选项卡背后通常有对应的
vue和控制器代码文件，而链接和Iframe则通常至外站的链接。 - 组件路径：填写实际的
index.vue组件路径即可，例如：/src/views/backend/auth/group/index.vue。 - 扩展属性：可以配置只自动注册到路由或菜单，这样就可以实现：同一路由下多个菜单，比如将
auth/menu只添加为路由，那么可以另外将auth/menu、auth/menu/:a、auth/menu/:b/:c只添加为菜单 - 规则权重：数字越大，排序越靠前，系统内置的
控制台的权重为999 - 缓存：开启后，将使用
keep-alive包裹标签页，实现切换标签，原标签保留状态（表单输入等） - 上级菜单规则：本规则的
上一级规则，上级规则不能是按钮，在表格中，上下级关系将以树状结构展示。
# 实现方式
- 在管理员访问后台时，系统首先请求了：
/index.php/admin/index/index接口，获取了后台的菜单规则，这些规则，是在后台的：权限管理->菜单规则管理添加的。 - 在该接口内，通过
\ba\Auth类，我们只获取了管理员拥有的菜单规则（权限节点）。 - WEB端的对该接口的请求是从
/src/layouts/backend/index.vue文件发出的。 - 在请求结束后，我们立即将菜单规则解析为
Vue-Router 路由规则并自动进行注册，同时设定好后台的左侧菜单规则，并记录下管理员各个页面的页面按钮权限。 - 此时，路由已注册，菜单已正常渲染，而当我们使用按钮鉴权 (opens new window)或按钮鉴权-函数式 (opens new window)时，系统会获取当前用户打开的路由，拼接为
当前路由/要验证的权限名称，将拼接结果与管理员页面按钮权限进行比对，若未找到，则隐藏按钮。
例如，管理员当前打开的路由为：/#/admin/auth/group，此时使用按钮鉴权：
auth('index') // 拼接为 auth/group/index 然后在`管理员页面按钮权限`寻找是否有此权限
auth('edit') // 拼接为 auth/group/edit 然后在`管理员页面按钮权限`寻找是否有此权限
例如，管理员当前打开的路由为：/#/admin/auth/menu，此时使用按钮鉴权：
<!-- // 拼接为 auth/menu/add 然后在`管理员页面按钮权限`寻找是否有此权限 -->
<el-button v-auth="'add'">添加</el-button>
<!-- // 拼接为 auth/menu/del -->
<el-button v-auth="'del'">删除</el-button>