2
0

perf: 路由重构

This commit is contained in:
TsMask
2024-11-29 17:18:45 +08:00
parent a57f669603
commit 4cbdc12f90
6 changed files with 48 additions and 70 deletions

View File

@@ -1,15 +0,0 @@
/* eslint-disable */
/* prettier-ignore */
// Generated by elegant-router
// Read more: https://github.com/soybeanjs/elegant-router
import type { RouteComponent } from "vue-router";
import type { RouteLayout } from "@elegant-router/types";
import BaseLayout from "@/layouts/base-layout/index.vue";
import BlankLayout from "@/layouts/blank-layout/index.vue";
export const layouts: Record<RouteLayout, RouteComponent | (() => Promise<RouteComponent>)> = {
base: BaseLayout,
blank: BlankLayout,
};

View File

@@ -3,30 +3,28 @@
// Generated by elegant-router // Generated by elegant-router
// Read more: https://github.com/soybeanjs/elegant-router // Read more: https://github.com/soybeanjs/elegant-router
import type { RouteRecordRaw, RouteComponent } from 'vue-router'; import type { RouteRecordRaw } from 'vue-router';
import type { ElegantConstRoute } from '@elegant-router/vue'; import type { ElegantConstRoute } from '@elegant-router/vue';
import type { RouteMap, RouteKey, RoutePath } from '@elegant-router/types'; import type { RouteKey, RouteMap, RoutePath } from '@elegant-router/types';
import BaseLayout from '@/layouts/base-layout/index.vue';
import BlankLayout from '@/layouts/blank-layout/index.vue';
/** /**
* transform elegant const routes to vue routes * transform elegant const routes to vue routes
* @param routes elegant const routes * @param routes elegant const routes
* @param layouts layout components
*/ */
export function transformElegantRoutesToVueRoutes( export function transformElegantRoutesToVueRoutes(
routes: ElegantConstRoute[], routes: ElegantConstRoute[]
layouts: Record<string, RouteComponent | (() => Promise<RouteComponent>)>,
) { ) {
return routes.flatMap(route => transformElegantRouteToVueRoute(route, layouts )); return routes.flatMap(route => transformElegantRouteToVueRoute(route));
} }
/** /**
* transform elegant route to vue route * transform elegant route to vue route
* @param route elegant const route * @param route elegant const route
* @param layouts layout components
*/ */
function transformElegantRouteToVueRoute( function transformElegantRouteToVueRoute(
route: ElegantConstRoute, route: ElegantConstRoute
layouts: Record<string, RouteComponent | (() => Promise<RouteComponent>)>,
) { ) {
const LAYOUT_PREFIX = 'layout.'; const LAYOUT_PREFIX = 'layout.';
const VIEW_PREFIX = 'view.'; const VIEW_PREFIX = 'view.';
@@ -39,12 +37,13 @@ function transformElegantRouteToVueRoute(
function getLayoutName(component: string) { function getLayoutName(component: string) {
const layout = component.replace(LAYOUT_PREFIX, ''); const layout = component.replace(LAYOUT_PREFIX, '');
if (layout === 'base') {
if(!layouts[layout]) { return BaseLayout;
throw new Error(`Layout component "${layout}" not found`);
} }
if (layout === 'blank') {
return layouts[layout]; return BlankLayout;
}
throw new Error(`Layout component "${layout}" not found`);
} }
function isView(component: string) { function isView(component: string) {
@@ -53,10 +52,8 @@ function transformElegantRouteToVueRoute(
function getViewName(component: string) { function getViewName(component: string) {
const view = component.replace(VIEW_PREFIX, ''); const view = component.replace(VIEW_PREFIX, '');
debugger const v = findView(view);
const v = findView(view) if (!v) {
console.log(v)
if(!v) {
throw new Error(`View component "${view}" not found`); throw new Error(`View component "${view}" not found`);
} }
@@ -135,9 +132,9 @@ function transformElegantRouteToVueRoute(
} }
if (children?.length) { if (children?.length) {
const childRoutes = children.flatMap(child => transformElegantRouteToVueRoute(child, layouts)); const childRoutes = children.flatMap(child => transformElegantRouteToVueRoute(child));
if(isFirstLevelRoute(route)) { if (isFirstLevelRoute(route)) {
vueRoute.children = childRoutes; vueRoute.children = childRoutes;
} else { } else {
vueRoutes.push(...childRoutes); vueRoutes.push(...childRoutes);
@@ -169,41 +166,41 @@ function findView(dirName: string) {
if (component && component.length === 3) { if (component && component.length === 3) {
viewDirName = component[1]; viewDirName = component[1];
} }
viewDirName = viewDirName.replaceAll("/", "_").replace("_index", "") viewDirName = viewDirName.replaceAll('/', '_').replace('_index', '');
if ( viewDirName === dirName) { if (viewDirName === dirName) {
return () => views[dir](); return () => views[dir]();
} }
} }
return () => import("@/views/_builtin/404/index.vue"); return () => import('@/views/_builtin/404/index.vue');
} }
/** /**
* map of route name and route path * map of route name and route path
*/ */
const routeMap: RouteMap = { const routeMap: RouteMap = {
"root": "/", 'root': '/',
"not-found": "/:pathMatch(.*)*", 'not-found': '/:pathMatch(.*)*',
"exception": "/exception", 'exception': '/exception',
"exception_403": "/exception/403", 'exception_403': '/exception/403',
"exception_404": "/exception/404", 'exception_404': '/exception/404',
"exception_500": "/exception/500", 'exception_500': '/exception/500',
"403": "/403", '403': '/403',
"404": "/404", '404': '/404',
"500": "/500", '500': '/500',
"about": "/about", 'about': '/about',
"function": "/function", 'function': '/function',
"function_hide-child": "/function/hide-child", 'function_hide-child': '/function/hide-child',
"function_hide-child_one": "/function/hide-child/one", 'function_hide-child_one': '/function/hide-child/one',
"function_hide-child_three": "/function/hide-child/three", 'function_hide-child_three': '/function/hide-child/three',
"function_hide-child_two": "/function/hide-child/two", 'function_hide-child_two': '/function/hide-child/two',
"function_multi-tab": "/function/multi-tab", 'function_multi-tab': '/function/multi-tab',
"function_request": "/function/request", 'function_request': '/function/request',
"function_super-page": "/function/super-page", 'function_super-page': '/function/super-page',
"function_tab": "/function/tab", 'function_tab': '/function/tab',
"function_toggle-auth": "/function/toggle-auth", 'function_toggle-auth': '/function/toggle-auth',
"home": "/home", 'home': '/home',
"login": "/login/:module(pwd-login|code-login|register|reset-pwd|bind-wechat)?", 'login': '/login/:module(pwd-login|code-login|register|reset-pwd|bind-wechat)?',
"user-center": "/user-center" 'user-center': '/user-center'
}; };
/** /**
@@ -211,7 +208,7 @@ const routeMap: RouteMap = {
* @param name route name * @param name route name
*/ */
export function getRoutePath<T extends RouteKey>(name: T) { export function getRoutePath<T extends RouteKey>(name: T) {
console.log(name) console.log(name);
return routeMap[name]; return routeMap[name];
} }

View File

@@ -1,5 +1,4 @@
import type { CustomRoute } from '@elegant-router/types'; import type { CustomRoute } from '@elegant-router/types';
import { layouts } from '../elegant/imports';
import { transformElegantRoutesToVueRoutes } from '../elegant/transform'; import { transformElegantRoutesToVueRoutes } from '../elegant/transform';
export const ROOT_ROUTE: CustomRoute = { export const ROOT_ROUTE: CustomRoute = {
@@ -27,5 +26,5 @@ const builtinRoutes: CustomRoute[] = [ROOT_ROUTE, NOT_FOUND_ROUTE];
/** create builtin vue routes */ /** create builtin vue routes */
export function createBuiltinVueRoutes() { export function createBuiltinVueRoutes() {
return transformElegantRoutesToVueRoutes(builtinRoutes, layouts); return transformElegantRoutesToVueRoutes(builtinRoutes);
} }

View File

@@ -1,6 +1,5 @@
import type { ElegantConstRoute } from '@elegant-router/types'; import type { ElegantConstRoute } from '@elegant-router/types';
import { generatedRoutes } from '../elegant/routes'; import { generatedRoutes } from '../elegant/routes';
import { layouts } from '../elegant/imports';
import { transformElegantRoutesToVueRoutes } from '../elegant/transform'; import { transformElegantRoutesToVueRoutes } from '../elegant/transform';
/** /**
@@ -80,5 +79,5 @@ export function createStaticRoutes() {
* @param routes Elegant routes * @param routes Elegant routes
*/ */
export function getAuthVueRoutes(routes: ElegantConstRoute[]) { export function getAuthVueRoutes(routes: ElegantConstRoute[]) {
return transformElegantRoutesToVueRoutes(routes, layouts); return transformElegantRoutesToVueRoutes(routes);
} }

View File

@@ -173,7 +173,6 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
/** Init static auth route */ /** Init static auth route */
async function initStaticAuthRoute() { async function initStaticAuthRoute() {
const { authRoutes: staticAuthRoutes } = createStaticRoutes(); const { authRoutes: staticAuthRoutes } = createStaticRoutes();
debugger
if (authStore.isStaticSuper) { if (authStore.isStaticSuper) {
addAuthRoutes(staticAuthRoutes); addAuthRoutes(staticAuthRoutes);
} else { } else {
@@ -190,7 +189,6 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
/** Init dynamic auth route */ /** Init dynamic auth route */
async function initDynamicAuthRoute() { async function initDynamicAuthRoute() {
const { data: routes, error } = await doGetUserRoutes(); const { data: routes, error } = await doGetUserRoutes();
debugger
if (!error) { if (!error) {
addAuthRoutes(routes); addAuthRoutes(routes);

View File

@@ -4,7 +4,7 @@ import transformerVariantGroup from '@unocss/transformer-variant-group';
import presetUno from '@unocss/preset-uno'; import presetUno from '@unocss/preset-uno';
import type { Theme } from '@unocss/preset-uno'; import type { Theme } from '@unocss/preset-uno';
import { presetSoybeanAdmin } from '@sa/uno-preset'; import { presetSoybeanAdmin } from '@sa/uno-preset';
import presetAttributify from '@unocss/preset-attributify'; import presetAttributive from '@unocss/preset-attributify';
import { themeVars } from './src/theme/vars'; import { themeVars } from './src/theme/vars';
export default defineConfig<Theme>({ export default defineConfig<Theme>({
@@ -29,5 +29,5 @@ export default defineConfig<Theme>({
}, },
transformers: [transformerDirectives(), transformerVariantGroup()], transformers: [transformerDirectives(), transformerVariantGroup()],
// @ts-expect-error presetUno is not compatible with the new API // @ts-expect-error presetUno is not compatible with the new API
presets: [presetUno({ dark: 'class' }), presetSoybeanAdmin(), presetAttributify()] presets: [presetUno({ dark: 'class' }), presetSoybeanAdmin(), presetAttributive()]
}); });