| | |
| | | <!-- <div v-if="!item.meta.hide && menus.includes(item.meta.privilege)"> --> |
| | | <div v-if="item.meta && item.meta.title && !item.meta.hide"> |
| | | <!-- 根菜单 --> |
| | | <MenuLink :to="resolvePath()" v-if="!item.children"> |
| | | <MenuLink :to="resolvePath()" v-if="!filteredChildren || filteredChildren.length === 0"> |
| | | <el-menu-item :index="resolvePath()"> |
| | | <i :class="(item.meta && item.meta.icon) || ''"></i> |
| | | <span slot="title">{{ (item.meta && item.meta.title) || '' }}</span> |
| | |
| | | <i :class="(item.meta && item.meta.icon) || ''"></i> |
| | | <span slot="title">{{ (item.meta && item.meta.title) || '' }}</span> |
| | | </template> |
| | | <!-- 这里递归去展示多级菜单 --> |
| | | <menu-item v-for="(route, index) in item.children" :key="index" :item="route" |
| | | <!-- 递归展示多级菜单,已过滤无权限的children --> |
| | | <menu-item v-for="(route, index) in filteredChildren" :key="index" :item="route" |
| | | :fatherPath="resolvePath(route.path)"> |
| | | </menu-item> |
| | | </el-submenu> |
| | |
| | | import { mapState } from "vuex"; |
| | | import path from "path"; |
| | | import MenuLink from "./MenuLink.vue"; |
| | | |
| | | function filterMenusByPrivilege(menus, flatMenus) { |
| | | if (!menus) return []; |
| | | return menus |
| | | .filter(menu => { |
| | | if (menu.meta && menu.meta.privilege) { |
| | | return flatMenus.includes(menu.meta.privilege); |
| | | } |
| | | return true; |
| | | }) |
| | | .map(menu => { |
| | | if (menu.children && menu.children.length > 0) { |
| | | return { |
| | | ...menu, |
| | | children: filterMenusByPrivilege(menu.children, flatMenus) |
| | | }; |
| | | } |
| | | return menu; |
| | | }) |
| | | .filter(menu => { |
| | | if (menu.children && menu.children.length === 0) { |
| | | return false; |
| | | } |
| | | return true; |
| | | }); |
| | | } |
| | | |
| | | export default { |
| | | // 做组件递归时必须定义一个name。然后递归时的组件名就是这里的name值 |
| | |
| | | }, |
| | | |
| | | computed: { |
| | | ...mapState(["menus"]), |
| | | ...mapState(["flatMenus"]), |
| | | filteredChildren() { |
| | | // 只对children做权限过滤 |
| | | return filterMenusByPrivilege(this.item.children, this.flatMenus); |
| | | } |
| | | }, |
| | | data() { |
| | | return {}; |