feat: d2admin.menu.title

d2/menus/index.js

@@ -1,18 +1,8 @@
-import { pick } from 'lodash-es'
+import { get, pick } from 'lodash-es'
 import { Menu } from 'd2/utils/menu.js'
 import { flattenObjectArray } from 'd2/utils/array.js'
 import routes from 'virtual:generated-pages'
 
-const flatRoutes = flattenObjectArray(
-  routes,
-  'children',
-  (item, _) => pick(item, ['name', 'path', 'meta'])
-)
-
-function getRoutes (rule) {
-  return flatRoutes.filter(route => rule.test(route.name))
-}
-
 export const dashboardIndexMenu = new Menu('控制台')
   .url('/dashboard')
   .icon('icon-park-outline:dashboard')
@@ -48,19 +38,36 @@ export const dashboardDemoComponentBreakPointMenus = new Menu('断点')
   .add(new Menu('data').url('/data'))
   .add(new Menu('slot').url('/slot'))
 
+const flatRoutes = flattenObjectArray(
+  routes,
+  'children',
+  (item, _) => pick(item, ['name', 'path', 'meta'])
+)
+
+function filterRoutes (rule) {
+  return flatRoutes.filter(route => rule.test(route.name))
+}
+
+function creatRouteMenu (route, pre) {
+  const url = route.path.replace(RegExp(`^${pre}`), '')
+  if (!url) {
+    return new Menu('概览').index()
+  }
+  const title = get(route.meta, 'd2admin.menu.title', url)
+  return new Menu(title).url(url)
+}
+
+function creatRouteMenus ({ match = /.+/, basePath = '' } = {}) {
+  return filterRoutes(match).map(route => creatRouteMenu(route, basePath))
+}
+
 export const dashboardDemoComponentFlexMenus = new Menu('Flex')
   .icon('icon-park-outline:carousel')
   .scope('/dashboard/demo/component/flex')
-  .add(new Menu('概览').index())
-  .add(
-    getRoutes(/^dashboard-demo-component-flex.+/)
-      .map(route => {
-        const pre = 'demo/component/flex'
-        const title = route.path.replace(RegExp(`^${pre}/`), '')
-        const url = route.path.replace(RegExp(`^${pre}`), '')
-        return new Menu(title).url(url)
-      })
-  )
+  .add(creatRouteMenus({
+    match: /^dashboard-demo-component-flex/,
+    basePath: 'demo/component/flex'
+  }))
 
 export const dashboardDemoComponentMenus = new Menu('组件')
   .icon('icon-park-outline:components')

d2/views/dashboard/demo/component/flex/all.vue

@@ -1,3 +1,11 @@
+<route>
+{
+  "meta": {
+    "d2admin.menu.title": "全部"
+  }
+}
+</route>
+
 <template>
   <demo-section title="flex">
     <template v-for="_dir in dir" :key="_dir">

d2/views/dashboard/demo/component/flex/center.vue

@@ -1,3 +1,11 @@
+<route>
+{
+  "meta": {
+    "d2admin.menu.title": "快速居中"
+  }
+}
+</route>
+
 <template>
   <demo-section title="center">
     <d2-flex class="flex" center space>

d2/views/dashboard/demo/component/flex/content.vue

@@ -1,3 +1,11 @@
+<route>
+{
+  "meta": {
+    "d2admin.menu.title": "多轴线对齐"
+  }
+}
+</route>
+
 <template>
   <template v-for="_content in content" :key="_content">
     <demo-section :title="_content || 'default'">

d2/views/dashboard/demo/component/flex/display.vue

@@ -1,3 +1,11 @@
+<route>
+{
+  "meta": {
+    "d2admin.menu.title": "显示模式"
+  }
+}
+</route>
+
 <template>
   <demo-section title="default">
     <d2-flex class="flex" space>

d2/views/dashboard/demo/component/flex/grow-shrink.vue

@@ -1,3 +1,11 @@
+<route>
+{
+  "meta": {
+    "d2admin.menu.title": "伸缩"
+  }
+}
+</route>
+
 <template>
   <demo-section title="grow">
     <d2-flex v-for="(configValue, configIndex) in configGrow" :key="configIndex" class="group group--grow" space>
@@ -55,7 +63,7 @@ export default {
     @apply w-96;
   }
   .item {
-    @apply p-1 h-10 bg-gray-500 text-white rounded;
+    @apply h-10 p-1 text-white bg-gray-500 rounded;
     &.item--grow {
       @apply w-10;
     }

d2/views/dashboard/demo/component/flex/layout.vue

@@ -1,3 +1,11 @@
+<route>
+{
+  "meta": {
+    "d2admin.menu.title": "搭建布局"
+  }
+}
+</route>
+
 <template>
   <demo-section title="layout">
     <d2-flex class="layout" dir="top" box="justify">
@@ -32,18 +40,18 @@
 
 <style lang="scss" scoped>
 .layout {
-  @apply text-lg w-96 h-64 p-1 bg-gray-700 rounded overflow-hidden;
+  @apply h-64 p-1 overflow-hidden text-lg bg-gray-700 rounded w-96;
   .layout__side {
     @apply w-24 text-white bg-gray-500;
   }
   .layout__header {
-    @apply text-center text-gray-500 py-2 bg-gray-200;
+    @apply py-2 text-center text-gray-500 bg-gray-200;
   }
   .layout__footer {
-    @apply text-center text-gray-500 py-2 bg-gray-300;
+    @apply py-2 text-center text-gray-500 bg-gray-300;
   }
   .layout__body {
-    @apply bg-gray-100 text-gray-500;
+    @apply text-gray-500 bg-gray-100;
   }
 }
 </style>

d2/views/dashboard/demo/component/flex/nesting.vue

@@ -1,3 +1,11 @@
+<route>
+{
+  "meta": {
+    "d2admin.menu.title": "嵌套"
+  }
+}
+</route>
+
 <template>
   <demo-section title="nesting with out d2-flex if no special settings">
     <d2-flex class="outer" cross="center" box="mean" space>

d2/views/dashboard/demo/component/flex/order.vue

@@ -1,3 +1,11 @@
+<route>
+{
+  "meta": {
+    "d2admin.menu.title": "顺序"
+  }
+}
+</route>
+
 <template>
   <demo-section title="order">
     <d2-flex class="group" center space>
@@ -21,9 +29,9 @@ export default {
 
 <style lang="scss" scoped>
 .group {
-  @apply w-72 h-16 bg-indigo-500 rounded;
+  @apply h-16 bg-indigo-500 rounded w-72;
   .item {
-    @apply py-1 px-2 bg-white text-indigo-500 rounded;
+    @apply px-2 py-1 text-indigo-500 bg-white rounded;
   }
 }
 </style>

d2/views/dashboard/demo/component/flex/playground.vue

@@ -1,3 +1,11 @@
+<route>
+{
+  "meta": {
+    "d2admin.menu.title": "试验台"
+  }
+}
+</route>
+
 <template>
   <demo-section title="playground">
     <d2-flex dir="left" cross="top" box="first">

d2/views/dashboard/demo/component/flex/self.vue

@@ -1,3 +1,11 @@
+<route>
+{
+  "meta": {
+    "d2admin.menu.title": "独立对齐"
+  }
+}
+</route>
+
 <template>
   <demo-section v-for="_self in self" :key="_self" :title="_self || 'default'">
     <d2-flex class="flex" box="mean" space>

d2/views/dashboard/demo/component/flex/tag.vue

@@ -1,3 +1,11 @@
+<route>
+{
+  "meta": {
+    "d2admin.menu.title": "标签"
+  }
+}
+</route>
+
 <template>
   <demo-section v-for="tag in tags" :key="tag" :title="tag">
     <d2-flex class="flex" :tag="tag" space>

d2/views/dashboard/demo/component/flex/wrap.vue

@@ -1,3 +1,11 @@
+<route>
+{
+  "meta": {
+    "d2admin.menu.title": "换行"
+  }
+}
+</route>
+
 <template>
   <demo-section title="default">
     <d2-flex class="flex" cross="top" space>

src/views/dashboard.vue

@@ -1,11 +1,3 @@
-<route>
-{
-  "meta": {
-    "title": "dashboard"
-  }
-}
-</route>
-
 <template>
   <d2-admin-layout-dashboard>
     <template #footer>

src/views/index.vue

@@ -1,11 +1,3 @@
-<route>
-{
-  "meta": {
-    "title": "首页"
-  }
-}
-</route>
-
 <template>
   <router-link to="/dashboard">
     <a-button type="link">控制台</a-button>

src/views/login.vue

@@ -1,11 +1,3 @@
-<route>
-{
-  "meta": {
-    "title": "登录"
-  }
-}
-</route>
-
 <template>
   <div>
     登录