Vue：细粒度动态权限管理解决方案

权限管理是每个后台管理系统都需要面对的问题。细粒度动态权限管理更是一个不太好啃但是必须解决的硬需求。本文记录了一种基于角色的动态权限管理方法，实现方法不是很优雅，如果以后发现了更优雅的方法再来更新。该方法使用了vuex 作为辅助，所以如果还没有接触vuex 的请移步：Vuex: 实现同级组件的简单通信

接下来主要从权限设置（设置角色权限）和权限限制（限制没有权限的人访问不到相应的内容）以及团队workflow三个方面展开讨论。

一、权限设置

因为是基于角色的权限管理，所以权限设置页面又分为三个子页：菜单管理、用户管理、权限设置。

1. 菜单管理

菜单管理中所展示的是所有的可用后端接口，这个功能通常是面向开发团队中的测试或产品来提供信息录入操作。尤其是菜单URL，在将产品交付到甲方手中以后是不能让他们进行修改的，因为这个URL 是前端和后端提前商量好的，在系统运行过程中不能随意修改。

2. 用户管理

用户管理模块所提供的功能可以直接面向甲方，在这里他们可以自行创建所需要的登录账号并将每个账号加入不同的权限组（角色）来控制他们的访问和操作权限（实际上就是可以访问不同的后端接口）。

3. 权限管理