路由配置项中的hidden、alwaysShow、sort移入route.meta

docs/frontend/router.md

@@ -2,31 +2,26 @@
 
 ## 路由配置项
 
-路由配置项不光参与路由的生成，也参与侧边栏、搜索结果的生成。
+路由配置项不光参与路由的生成，也参与侧边栏的生成。
-
-### Route Attributes：
-
-| 参数       | 说明                                                 | 类型                | 默认  |
-| :--------: | :--------------------------------------------------: | :-----------------: | :---: |
-| hidden     | 是否在侧边栏中显示                                   | `boolean`           | -     |
-| alwaysShow | 是否总是把只有一个子级的菜单以嵌套模式在侧边栏中展示 | `boolean`           | -     | 
-| sort       | 侧边栏的排序值，值越小越靠前                         | `number`            | 10000 | 
 
 ### Route.meta Attributes：
 
-| 参数           | 说明                                             | 类型       | 默认                    |
+| 参数           | 说明                                                 | 类型       | 默认                    |
-| :------------: | :----------------------------------------------: | :--------: | :---------------------: |
+| :------------: | :--------------------------------------------------: | :--------: | :---------------------: |
-| title          | 路由在侧边栏、面包屑、页签、搜索结果中的显示名称 | `string`   | -                       |
+| title          | 路由在侧边栏、面包屑、页签、搜索结果中的显示名称     | `string`   | -                       |
-| dynamicTitle   | 路由在面包屑、页签中的动态名称，参数为(to,from)  | `function` | -                       |
+| dynamicTitle   | 路由在面包屑、页签中的动态名称，参数为(to,from)      | `function` | -                       |
-| icon           | 图标名，支持svg-icon、el-icon                    | `string`   | -                       |
+| hidden         | 是否在侧边栏中显示                                   | `boolean`  | -                       |
-| affix          | 是否在多页签中固定显示                           | `boolean`  | -                       |
+| alwaysShow     | 是否总是把只有一个子级的菜单以嵌套模式在侧边栏中展示 | `boolean`  | -                       | 
-| noCache        | true时缓存页面                                   | `boolean`  | -                       |
+| sort           | 侧边栏的排序值，值越小越靠前                         | `number`   | 10000                   | 
-| activeMenu     | 侧边栏当前激活菜单的index                        | `string`   | -                       |
+| icon           | 图标名，支持svg-icon、el-icon                        | `string`   | -                       |
-| noAuth         | true时路由不需要鉴权                             | `boolean`  | router/constant下为true |
+| affix          | 是否在多页签中固定显示                               | `boolean`  | -                       |
-| iframe         | 需要打开的iframe的地址                           | `string`   | -                       |
+| noCache        | true时缓存页面                                       | `boolean`  | -                       |
-| usePathKey     | 是否使用$route.path作为组件缓存的key             | `boolean`  | -                       |
+| activeMenu     | 侧边栏当前激活菜单的index                            | `string`   | -                       |
-| useFullPathKey | 是否使用$route.fullPath作为组件缓存的key         | `boolean`  | -                       |
+| noAuth         | true时路由不需要鉴权                                 | `boolean`  | router/constant下为true |
-| commonModule   | 共用组件的唯一标识                               | `any`      | -                       |
+| iframe         | 需要打开的iframe的地址                               | `string`   | -                       |
+| usePathKey     | 是否使用$route.path作为组件缓存的key                 | `boolean`  | -                       |
+| useFullPathKey | 是否使用$route.fullPath作为组件缓存的key             | `boolean`  | -                       |
+| commonModule   | 共用组件的唯一标识                                   | `any`      | -                       |
 
 ::: tip 注意
 路由meta上的affix、noAuth、noCache会被子路由继承，优先使用子路由的值

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
 }

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', alwaysShow: true},
-    meta: {title: '消息中心', icon: 'message'},
     children: [
         {
             path: 'manage',

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', alwaysShow: true},
-    meta: {title: '采购管理', icon: 'shopping'},
     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'
             }
         },
         {

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', alwaysShow: true},
-    meta: {title: '销售管理', icon: 'sell'},
     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'
             }
         },
         {

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', alwaysShow: true},
-    meta: {title: '库存管理', icon: 'stock'},
     children: [
         {
             path: 'current',

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', alwaysShow: true},
-    meta: {title: '系统管理', icon: 'system'},
     children: [
         {
             path: 'department',
@@ -48,8 +47,7 @@ const router = {
             path: 'resource',
             name: 'resourceManagement',
             component: lazyLoadView(import('@/view/system/resource')),
-            hidden: true,
+            meta: {title: '接口设置', hidden: true}
-            meta: {title: '接口设置'}
         }
     ]
 }

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', sort: 1}
-        meta: {title: '文档', icon: 'documentation'}
     },
     {
         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},
             }
         ]
     }

vue/src/router/index.js

@@ -2,9 +2,9 @@
 * 路由配置
 *
 * 需要鉴权的路由：!meta.noAuth
-* 左侧菜单显示：name && !hidden && meta.title
+* 左侧菜单显示：name && !meta.hidden && meta.title
-* 左侧菜单排序：能在左侧菜单中显示 && sort，升序排列
+* 左侧菜单排序：能在左侧菜单中显示 && meta.sort，升序排列
-* 左侧菜单不折叠只有一个children的路由：alwaysShow
+* 左侧菜单不折叠只有一个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'])
 

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) {
+        if (children) {
-            clean(routes[i].children, cleanHidden)
+            clean(children, cleanHidden)
-            if (routes[i].children.length < 1 && routes[i].alwaysShow !== true) {
+            if (children.length < 1 && !alwaysShow) {
                 routes.splice(i, 1)
             }
         }
@@ -158,17 +160,18 @@ function sort(routes, getSortValue = defaultGetSortValue) {
 }
 
 const defaultGetSortValue = item => {
-    item = deepTap(item)
+    const {meta: {sort} = {}} = deepTap(item) || {}
-    return !item || isEmpty(item.sort) ? 10000 : item.sort
+    return isEmpty(sort) ? 10000 : sort
 }
 
 const deepTap = item => {
-    if (item.hidden) return null
+    const {name, children, meta: {title, hidden, sort} = {}} = item
-    if (!isEmpty(item.sort)) return item
+    if (hidden) return null
-    if (isEmpty(item.name, item.meta.title)) {
+    if (!isEmpty(sort)) return item
+    if (isEmpty(name, title)) {
         //如果是类似首页那样的路由层级
-        if (item.children && item.children.length === 1) {
+        if (children && children.length === 1) {
-            return deepTap(item.children[0])
+            return deepTap(children[0])
         }
     }
     return null