| | |
| | | > |
| | | <p class="tip" v-if="role != null">为角色 <em>{{role.name}}</em> 配置可访问的菜单</p> |
| | | <el-tree |
| | | ref="menuTree" |
| | | ref="tree" |
| | | :data="menus" |
| | | show-checkbox |
| | | node-key="id" |
| | |
| | | }, |
| | | methods: { |
| | | /** |
| | | * @role 角色对象 |
| | | * 打开窗口 |
| | | * |
| | | * @param role 目标角色 |
| | | */ |
| | | open (role) { |
| | | fetchMenuList({}) |
| | |
| | | this.role = role |
| | | this.menus = records |
| | | // 如果为固定角色,则固定菜单不可更改 |
| | | this.__resetDisabled(this.menus, this.role) |
| | | this.__handleFixedMenus(this.menus, this.role) |
| | | // 找出叶节点 |
| | | role.menus = role.menus.filter(menu => role.menus.findIndex(m => m.parentId === menu.id) === -1) |
| | | // 初始化选中 |
| | |
| | | this.$tip.apiFailed(e) |
| | | }) |
| | | }, |
| | | // 确认选择菜单 |
| | | /** |
| | | * 确认选择菜单 |
| | | */ |
| | | confirm () { |
| | | const selectedMenus = this.$refs.menuTree.getCheckedNodes(false, true) |
| | | const selectedMenus = this.$refs.tree.getCheckedNodes(false, true) |
| | | this.isWorking = true |
| | | createRoleMenu({ |
| | | roleId: this.role.id, |
| | |
| | | this.isWorking = false |
| | | }) |
| | | }, |
| | | // 重置disabled |
| | | __resetDisabled (menus, role) { |
| | | /** |
| | | * 处理固定菜单 |
| | | * |
| | | * @param menus 菜单列表 |
| | | * @param role 角色 |
| | | * @private |
| | | */ |
| | | __handleFixedMenus (menus, role) { |
| | | if (menus == null || menus.length === 0) { |
| | | return |
| | | } |
| | |
| | | if (role.fixed && menu.fixed) { |
| | | menu.disabled = true |
| | | } |
| | | this.__resetDisabled(menu.children, role) |
| | | this.__handleFixedMenus(menu.children, role) |
| | | } |
| | | } |
| | | } |
| | |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | | @import "@/assets/style/variables.scss"; |
| | | .global-window { |
| | | .tip { |
| | | margin-bottom: 12px; |
| | | em { |
| | | font-style: normal; |
| | | color: $primary-color; |
| | | font-weight: bold; |
| | | } |
| | | @import "@/assets/style/variables.scss"; |
| | | .global-window { |
| | | .tip { |
| | | margin-bottom: 12px; |
| | | em { |
| | | font-style: normal; |
| | | color: $primary-color; |
| | | font-weight: bold; |
| | | } |
| | | } |
| | | } |
| | | </style> |