diff --git a/.env b/.env index 711571c..fd76645 100644 --- a/.env +++ b/.env @@ -1,7 +1,9 @@ VITE_APP_TITLE=vue-ts-example-2025 VITE_APP_BASE=/ VITE_APP_BUILD_SOURCE_MAP=true +VITE_APP_BUILD_MINIFY=true VITE_APP_BUILD_COMMIT= VITE_APP_BUILD_TIME= VITE_ENABLE_VUE_DEVTOOLS=true VITE_MENU_SHOW_DEMOS=true +VITE_MENU_SHOW_ORDER=true \ No newline at end of file diff --git a/src/composables/useMetaLayoutsMenuOptions.tsx b/src/composables/useMetaLayoutsMenuOptions.tsx index 10b9361..68de5ad 100644 --- a/src/composables/useMetaLayoutsMenuOptions.tsx +++ b/src/composables/useMetaLayoutsMenuOptions.tsx @@ -5,8 +5,45 @@ import { RouterLink, type RouteRecordRaw } from 'vue-router'; import IconMenuRounded from '~icons/material-symbols/menu-rounded'; export function useMetaLayoutsNMenuOptions({ menuInstRef }: { menuInstRef: Ref }) { + const router = useRouter(); + + const { t, te } = useI18n({ + inheritLocale: true, + useScope: 'local', + missing: (locale, key) => { + consola.warn(`菜单翻译缺失: locale=${locale}, key=${key}`); + return key; + }, + fallbackRoot: true, + messages: locales4RouteMessages, + }); + + // 获取路由表但是不包含布局路由 + const routes = createGetRoutes(router)(); + + const options = computed(() => convertRoutesToNMenuOptions(routes)); + const selectedKey = ref(''); + + watch( + () => router.currentRoute.value.path, + (newPath) => { + selectedKey.value = newPath; + menuInstRef.value?.showOption(newPath); // 展开菜单,确保设定的元素被显示,如果不传入 key 会展示当前选中元素 + }, + { immediate: true }, + ); + // 路由转换为菜单树的辅助函数 function convertRoutesToNMenuOptions(routes: Readonly): MenuOption[] { + const orderMaxLength = routes.reduce((max, route) => { + const order = route.meta?.order; + if (order !== undefined) { + const orderLength = String(order).length; + return orderLength > max ? orderLength : max; + } + return max; + }, 0); + const menuMap = new Map(); const rootMenus: MenuOption[] = []; @@ -22,7 +59,7 @@ export function useMetaLayoutsNMenuOptions({ menuInstRef }: { menuInstRef: Ref @@ -107,34 +149,6 @@ export function useMetaLayoutsNMenuOptions({ menuInstRef }: { menuInstRef: Ref { - consola.warn(`菜单翻译缺失: locale=${locale}, key=${key}`); - return key; - }, - fallbackRoot: true, - messages: locales4RouteMessages, - }); - - // 获取路由表但是不包含布局路由 - const routes = createGetRoutes(router)(); - - const options = computed(() => convertRoutesToNMenuOptions(routes)); - const selectedKey = ref(''); - - watch( - () => router.currentRoute.value.path, - (newPath) => { - selectedKey.value = newPath; - menuInstRef.value?.showOption(newPath); // 展开菜单,确保设定的元素被显示,如果不传入 key 会展示当前选中元素 - }, - { immediate: true }, - ); - // console.debug('原始路由:', JSON.stringify(routes, null, 0)); // console.debug('转换后的菜单:', JSON.stringify(menuOptions.value, null, 0)); return { diff --git a/vite.config.ts b/vite.config.ts index d9017d4..9b4a788 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -79,7 +79,7 @@ export default defineConfig(async (configEnv) => { return { base: env.VITE_APP_BASE, build: { - // minify: false, // 默认: 'terser' + minify: env.VITE_APP_BUILD_MINIFY === 'true' ? undefined /* 即默认 */ : false, // 默认: 'terser' sourcemap: env.VITE_APP_BUILD_SOURCE_MAP === 'true', rollupOptions: {