WFC/fe.wfc.user
2
0
Fork 0
Code Activity

perf: 路由重构

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

15
src/router/elegant/imports.ts
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,
};

91
src/router/elegant/transform.ts
View File

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

3
src/router/routes/builtin.ts
View File

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

3
src/router/routes/index.ts
View File

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