diff --git a/docs/frontend/router.md b/docs/frontend/router.md index eddc3be..a263183 100644 --- a/docs/frontend/router.md +++ b/docs/frontend/router.md @@ -2,31 +2,26 @@ ## 路由配置项 -路由配置项不光参与路由的生成，也参与侧边栏、搜索结果的生成。 - -### Route Attributes： - -| 参数 | 说明 | 类型 | 默认 | -| :--------: | :--------------------------------------------------: | :-----------------: | :---: | -| hidden | 是否在侧边栏中显示 | `boolean` | - | -| alwaysShow | 是否总是把只有一个子级的菜单以嵌套模式在侧边栏中展示 | `boolean` | - | -| sort | 侧边栏的排序值，值越小越靠前 | `number` | 10000 | +路由配置项不光参与路由的生成，也参与侧边栏的生成。 ### Route.meta Attributes： -| 参数 | 说明 | 类型 | 默认 | -| :------------: | :----------------------------------------------: | :--------: | :---------------------: | -| title | 路由在侧边栏、面包屑、页签、搜索结果中的显示名称 | `string` | - | -| dynamicTitle | 路由在面包屑、页签中的动态名称，参数为(to,from) | `function` | - | -| icon | 图标名，支持svg-icon、el-icon | `string` | - | -| affix | 是否在多页签中固定显示 | `boolean` | - | -| noCache | true时缓存页面 | `boolean` | - | -| activeMenu | 侧边栏当前激活菜单的index | `string` | - | -| noAuth | true时路由不需要鉴权 | `boolean` | router/constant下为true | -| iframe | 需要打开的iframe的地址 | `string` | - | -| usePathKey | 是否使用$route.path作为组件缓存的key | `boolean` | - | -| useFullPathKey | 是否使用$route.fullPath作为组件缓存的key | `boolean` | - | -| commonModule | 共用组件的唯一标识 | `any` | - | +| 参数 | 说明 | 类型 | 默认 | +| :------------: | :--------------------------------------------------: | :--------: | :---------------------: | +| title | 路由在侧边栏、面包屑、页签、搜索结果中的显示名称 | `string` | - | +| dynamicTitle | 路由在面包屑、页签中的动态名称，参数为(to,from) | `function` | - | +| hidden | 是否在侧边栏中显示 | `boolean` | - | +| alwaysShow | 是否总是把只有一个子级的菜单以嵌套模式在侧边栏中展示 | `boolean` | - | +| sort | 侧边栏的排序值，值越小越靠前 | `number` | 10000 | +| icon | 图标名，支持svg-icon、el-icon | `string` | - | +| affix | 是否在多页签中固定显示 | `boolean` | - | +| noCache | true时缓存页面 | `boolean` | - | +| activeMenu | 侧边栏当前激活菜单的index | `string` | - | +| noAuth | true时路由不需要鉴权 | `boolean` | router/constant下为true | +| iframe | 需要打开的iframe的地址 | `string` | - | +| usePathKey | 是否使用$route.path作为组件缓存的key | `boolean` | - | +| useFullPathKey | 是否使用$route.fullPath作为组件缓存的key | `boolean` | - | +| commonModule | 共用组件的唯一标识 | `any` | - | ::: tip 注意 路由meta上的affix、noAuth、noCache会被子路由继承，优先使用子路由的值 diff --git a/vue/src/layout/component/Sidebar/component/SidebarItem.vue b/vue/src/layout/component/Sidebar/component/SidebarItem.vue index eae6856..e0ddfff 100644 --- a/vue/src/layout/component/Sidebar/component/SidebarItem.vue +++ b/vue/src/layout/component/Sidebar/component/SidebarItem.vue @@ -2,11 +2,11 @@ import SidebarItemContent from './SidebarItemContent' function getOnlyChild(item) { - const children = item.children || [] + const {children = [], meta: {alwaysShow} = {}} = item - if (children.length === 1) return item.alwaysShow ? null : children[0] + if (children.length === 1) return alwaysShow ? null : children[0] - if (children.length < 1) return {...item, path: undefined, children: undefined} + if (!children.length) return {...item, path: undefined, children: undefined} return null } diff --git a/vue/src/router/authority/module/message.js b/vue/src/router/authority/module/message.js index 9995575..155bdac 100644 --- a/vue/src/router/authority/module/message.js +++ b/vue/src/router/authority/module/message.js @@ -5,8 +5,7 @@ import {lazyLoadView} from "@/router/util" const router = { path: '/message', component: Layout, - alwaysShow: true, - meta: {title: '消息中心', icon: 'message'}, + meta: {title: '消息中心', icon: 'message', alwaysShow: true}, children: [ { path: 'manage', diff --git a/vue/src/router/authority/module/purchase.js b/vue/src/router/authority/module/purchase.js index f1626cc..85e5316 100644 --- a/vue/src/router/authority/module/purchase.js +++ b/vue/src/router/authority/module/purchase.js @@ -5,8 +5,7 @@ import {lazyLoadView} from "@/router/util" const router = { path: '/doc/purchase', component: Layout, - alwaysShow: true, - meta: {title: '采购管理', icon: 'shopping'}, + meta: {title: '采购管理', icon: 'shopping', alwaysShow: true}, children: [ { path: 'order', @@ -33,7 +32,7 @@ const router = { }, activeMenu: '/doc/purchase/order', usePathKey: true, - commonModule:'@/view/purchase/order/detail' + commonModule: '@/view/purchase/order/detail' } }, { diff --git a/vue/src/router/authority/module/sell.js b/vue/src/router/authority/module/sell.js index ac65541..a5ebc1d 100644 --- a/vue/src/router/authority/module/sell.js +++ b/vue/src/router/authority/module/sell.js @@ -5,8 +5,7 @@ import {lazyLoadView} from "@/router/util" const router = { path: '/doc/sell', component: Layout, - alwaysShow: true, - meta: {title: '销售管理', icon: 'sell'}, + meta: {title: '销售管理', icon: 'sell', alwaysShow: true}, children: [ { path: 'order', @@ -33,7 +32,7 @@ const router = { }, activeMenu: '/doc/sell/order', usePathKey: true, - commonModule:'@/view/sell/order/detail' + commonModule: '@/view/sell/order/detail' } }, { diff --git a/vue/src/router/authority/module/stock.js b/vue/src/router/authority/module/stock.js index ea9cdff..a820e71 100644 --- a/vue/src/router/authority/module/stock.js +++ b/vue/src/router/authority/module/stock.js @@ -5,8 +5,7 @@ import {lazyLoadView} from "@/router/util" const router = { path: '/stock', component: Layout, - alwaysShow: true, - meta: {title: '库存管理', icon: 'stock'}, + meta: {title: '库存管理', icon: 'stock', alwaysShow: true}, children: [ { path: 'current', diff --git a/vue/src/router/authority/module/system.js b/vue/src/router/authority/module/system.js index dc6440e..d908ff9 100644 --- a/vue/src/router/authority/module/system.js +++ b/vue/src/router/authority/module/system.js @@ -5,8 +5,7 @@ import {lazyLoadView} from "@/router/util" const router = { path: '/system', component: Layout, - alwaysShow: true, - meta: {title: '系统管理', icon: 'system'}, + meta: {title: '系统管理', icon: 'system', alwaysShow: true}, children: [ { path: 'department', @@ -48,8 +47,7 @@ const router = { path: 'resource', name: 'resourceManagement', component: lazyLoadView(import('@/view/system/resource')), - hidden: true, - meta: {title: '接口设置'} + meta: {title: '接口设置', hidden: true} } ] } diff --git a/vue/src/router/constant/index.js b/vue/src/router/constant/index.js index ebde239..fe1605b 100644 --- a/vue/src/router/constant/index.js +++ b/vue/src/router/constant/index.js @@ -18,32 +18,29 @@ const routes = [ path: '/', component: Layout, redirect: '/index', - sort: 0, children: [ { path: 'index', component: lazyLoadView(import('@/view/index')), name: 'index', - meta: {title: '首页', affix: true, icon: 'home'} + meta: {title: '首页', affix: true, icon: 'home', sort: 0} } ] }, { path: 'https://doc.toesbieya.cn', - sort: 1, - meta: {title: '文档', icon: 'documentation'} + meta: {title: '文档', icon: 'documentation', sort: 1} }, { path: '/user', component: Layout, redirect: '/user/index', - hidden: true, children: [ { path: 'index', name: 'userCenter', component: lazyLoadView(import('@/view/userCenter')), - meta: {title: '个人中心', noCache: true, icon: 'user'}, + meta: {title: '个人中心', noCache: true, icon: 'user', hidden: true}, } ] } diff --git a/vue/src/router/index.js b/vue/src/router/index.js index d6e0139..42d1f68 100644 --- a/vue/src/router/index.js +++ b/vue/src/router/index.js @@ -2,9 +2,9 @@ * 路由配置 * * 需要鉴权的路由：!meta.noAuth -* 左侧菜单显示：name && !hidden && meta.title -* 左侧菜单排序：能在左侧菜单中显示 && sort，升序排列 -* 左侧菜单不折叠只有一个children的路由：alwaysShow +* 左侧菜单显示：name && !meta.hidden && meta.title +* 左侧菜单排序：能在左侧菜单中显示 && meta.sort，升序排列 +* 左侧菜单不折叠只有一个children的路由：meta.alwaysShow * 面包屑显示：meta.title || meta.dynamicTitle * 搜索选项显示：name && meta.title * tab栏显示：name && (meta.title || meta.dynamicTitle) @@ -37,7 +37,7 @@ NProgress.configure({showSpinner: false}) metaExtend(constantRoutes) metaExtend(authorityRoutes) -const endRoute = [{path: '*', redirect: '/404', hidden: true}] +const endRoute = [{path: '*', redirect: '/404', meta: {hidden: true}}] const whiteList = transformWhiteList(['/login', '/register', '/404', '/403']) diff --git a/vue/src/store/module/resource.js b/vue/src/store/module/resource.js index b0841be..41e5160 100644 --- a/vue/src/store/module/resource.js +++ b/vue/src/store/module/resource.js @@ -83,20 +83,22 @@ function transformOriginRoutes(routes) { return res } -//删除不显示的路由(没有children且没有meta.title，左侧菜单需清除hidden=true) +//删除不显示的路由(没有children且没有meta.title，左侧菜单需清除meta.hidden=true) function clean(routes, cleanHidden = true) { for (let i = routes.length - 1; i >= 0; i--) { - if (cleanHidden && routes[i].hidden) { + const {children, meta: {title, alwaysShow, hidden} = {}} = routes[i] + + if (cleanHidden && hidden) { routes.splice(i, 1) continue } - if (!routes[i].children && (!routes[i].meta || !routes[i].meta.title)) { + if (!children && !title) { routes.splice(i, 1) continue } - if (routes[i].children) { - clean(routes[i].children, cleanHidden) - if (routes[i].children.length < 1 && routes[i].alwaysShow !== true) { + if (children) { + clean(children, cleanHidden) + if (children.length < 1 && !alwaysShow) { routes.splice(i, 1) } } @@ -158,17 +160,18 @@ function sort(routes, getSortValue = defaultGetSortValue) { } const defaultGetSortValue = item => { - item = deepTap(item) - return !item || isEmpty(item.sort) ? 10000 : item.sort + const {meta: {sort} = {}} = deepTap(item) || {} + return isEmpty(sort) ? 10000 : sort } const deepTap = item => { - if (item.hidden) return null - if (!isEmpty(item.sort)) return item - if (isEmpty(item.name, item.meta.title)) { + const {name, children, meta: {title, hidden, sort} = {}} = item + if (hidden) return null + if (!isEmpty(sort)) return item + if (isEmpty(name, title)) { //如果是类似首页那样的路由层级 - if (item.children && item.children.length === 1) { - return deepTap(item.children[0]) + if (children && children.length === 1) { + return deepTap(children[0]) } } return null