refactor(projects): format code style [调整代码格式]
This commit is contained in:
parent
6a344ff2c7
commit
a9d58f88aa
@ -6,12 +6,13 @@ import {
|
|||||||
getCacheRoutes,
|
getCacheRoutes,
|
||||||
getConstantRouteNames,
|
getConstantRouteNames,
|
||||||
getUserInfo,
|
getUserInfo,
|
||||||
|
transformAuthRouteToVueRoutes,
|
||||||
|
transformAuthRouteToVueRoute,
|
||||||
transformAuthRouteToMenu,
|
transformAuthRouteToMenu,
|
||||||
transformAuthRouteToSearchMenus,
|
transformAuthRouteToSearchMenus,
|
||||||
transformRouteNameToRoutePath,
|
transformRouteNameToRoutePath,
|
||||||
transformRoutePathToRouteName
|
transformRoutePathToRouteName
|
||||||
} from '@/utils';
|
} from '@/utils';
|
||||||
import { transformAuthRouteToVueRoutes, transformAuthRouteToVueRoute } from '@/utils/router/transform';
|
|
||||||
import { useAuthStore } from '../auth';
|
import { useAuthStore } from '../auth';
|
||||||
import { useTabStore } from '../tab';
|
import { useTabStore } from '../tab';
|
||||||
|
|
||||||
|
54
src/utils/router/component.ts
Normal file
54
src/utils/router/component.ts
Normal file
@ -0,0 +1,54 @@
|
|||||||
|
import type { RouteComponent } from 'vue-router';
|
||||||
|
import { BasicLayout, BlankLayout } from '@/layouts';
|
||||||
|
import { views } from '@/views';
|
||||||
|
import { isFunction } from '../common';
|
||||||
|
|
||||||
|
type Lazy<T> = () => Promise<T>;
|
||||||
|
|
||||||
|
interface ModuleComponent {
|
||||||
|
default: RouteComponent;
|
||||||
|
}
|
||||||
|
|
||||||
|
type LayoutComponent = Record<EnumType.LayoutComponentName, Lazy<ModuleComponent>>;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取布局的vue文件(懒加载的方式)
|
||||||
|
* @param layoutType - 布局类型
|
||||||
|
*/
|
||||||
|
export function getLayoutComponent(layoutType: EnumType.LayoutComponentName) {
|
||||||
|
const layoutComponent: LayoutComponent = {
|
||||||
|
basic: BasicLayout,
|
||||||
|
blank: BlankLayout
|
||||||
|
};
|
||||||
|
return layoutComponent[layoutType];
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取页面导入的vue文件
|
||||||
|
* @param routeKey - 路由key
|
||||||
|
*/
|
||||||
|
export function getViewComponent(routeKey: AuthRoute.LastDegreeRouteKey) {
|
||||||
|
if (!views[routeKey]) {
|
||||||
|
throw new Error(`路由“${routeKey}”没有对应的组件文件!`);
|
||||||
|
}
|
||||||
|
return setViewComponentName(views[routeKey], routeKey);
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 给页面组件设置名称 */
|
||||||
|
function setViewComponentName(component: RouteComponent | Lazy<ModuleComponent>, name: string) {
|
||||||
|
if (isAsyncComponent(component)) {
|
||||||
|
return async () => {
|
||||||
|
const result = await component();
|
||||||
|
Object.assign(result.default, { name });
|
||||||
|
return result;
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
Object.assign(component, { name });
|
||||||
|
|
||||||
|
return component;
|
||||||
|
}
|
||||||
|
|
||||||
|
function isAsyncComponent(component: RouteComponent | Lazy<ModuleComponent>): component is Lazy<ModuleComponent> {
|
||||||
|
return isFunction(component);
|
||||||
|
}
|
@ -6,64 +6,14 @@ export function getConstantRouteNames(routes: AuthRoute.Route[]) {
|
|||||||
return routes.map(route => getConstantRouteName(route)).flat(1);
|
return routes.map(route => getConstantRouteName(route)).flat(1);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* 将权限路由转换成搜索的菜单数据
|
|
||||||
* @param routes - 权限路由
|
|
||||||
* @param treeMap
|
|
||||||
*/
|
|
||||||
export function transformAuthRouteToSearchMenus(routes: AuthRoute.Route[], treeMap: AuthRoute.Route[] = []) {
|
|
||||||
if (routes && routes.length === 0) return [];
|
|
||||||
return routes.reduce((acc, cur) => {
|
|
||||||
if (!cur.meta?.hide) {
|
|
||||||
acc.push(cur);
|
|
||||||
}
|
|
||||||
if (cur.children && cur.children.length > 0) {
|
|
||||||
transformAuthRouteToSearchMenus(cur.children, treeMap);
|
|
||||||
}
|
|
||||||
return acc;
|
|
||||||
}, treeMap);
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 将路由名字转换成路由路径 */
|
|
||||||
export function transformRouteNameToRoutePath(name: Exclude<AuthRoute.AllRouteKey, 'not-found'>): AuthRoute.RoutePath {
|
|
||||||
const rootPath: AuthRoute.RoutePath = '/';
|
|
||||||
if (name === 'root') return rootPath;
|
|
||||||
|
|
||||||
const splitMark = '_';
|
|
||||||
const pathSplitMark = '/';
|
|
||||||
const path = name.split(splitMark).join(pathSplitMark);
|
|
||||||
|
|
||||||
return (pathSplitMark + path) as AuthRoute.RoutePath;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 将路由路径转换成路由名字 */
|
|
||||||
export function transformRoutePathToRouteName<K extends AuthRoute.RoutePath>(path: K) {
|
|
||||||
if (path === '/') return 'root';
|
|
||||||
|
|
||||||
const pathSplitMark = '/';
|
|
||||||
const routeSplitMark = '_';
|
|
||||||
|
|
||||||
const name = path.split(pathSplitMark).slice(1).join(routeSplitMark) as AuthRoute.AllRouteKey;
|
|
||||||
|
|
||||||
return name;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取所有固定路由的名称集合
|
* 获取所有固定路由的名称集合
|
||||||
* @param route - 固定路由
|
* @param route - 固定路由
|
||||||
*/
|
*/
|
||||||
function getConstantRouteName(route: AuthRoute.Route) {
|
function getConstantRouteName(route: AuthRoute.Route) {
|
||||||
const names = [route.name];
|
const names = [route.name];
|
||||||
if (hasChildren(route)) {
|
if (route.children?.length) {
|
||||||
names.push(...route.children!.map(item => getConstantRouteName(item)).flat(1));
|
names.push(...route.children!.map(item => getConstantRouteName(item)).flat(1));
|
||||||
}
|
}
|
||||||
return names;
|
return names;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
|
||||||
* 是否有子路由
|
|
||||||
* @param item - 权限路由
|
|
||||||
*/
|
|
||||||
function hasChildren(item: AuthRoute.Route) {
|
|
||||||
return Boolean(item.children && item.children.length);
|
|
||||||
}
|
|
||||||
|
@ -5,3 +5,4 @@ export * from './auth';
|
|||||||
export * from './menu';
|
export * from './menu';
|
||||||
export * from './breadcrumb';
|
export * from './breadcrumb';
|
||||||
export * from './regexp';
|
export * from './regexp';
|
||||||
|
export * from './transform';
|
||||||
|
@ -1,37 +1,5 @@
|
|||||||
import { useIconRender } from '@/composables';
|
import { useIconRender } from '@/composables';
|
||||||
|
|
||||||
/** 路由不转换菜单 */
|
|
||||||
function hideInMenu(route: AuthRoute.Route) {
|
|
||||||
return Boolean(route.meta.hide);
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 给菜单添加可选属性 */
|
|
||||||
function addPartialProps(config: {
|
|
||||||
menu: App.GlobalMenuOption;
|
|
||||||
icon?: string;
|
|
||||||
localIcon?: string;
|
|
||||||
children?: App.GlobalMenuOption[];
|
|
||||||
}) {
|
|
||||||
const { iconRender } = useIconRender();
|
|
||||||
|
|
||||||
const item = { ...config.menu };
|
|
||||||
|
|
||||||
const { icon, localIcon, children } = config;
|
|
||||||
|
|
||||||
if (localIcon) {
|
|
||||||
Object.assign(item, { icon: iconRender({ localIcon }) });
|
|
||||||
}
|
|
||||||
|
|
||||||
if (icon) {
|
|
||||||
Object.assign(item, { icon: iconRender({ icon }) });
|
|
||||||
}
|
|
||||||
|
|
||||||
if (children) {
|
|
||||||
Object.assign(item, { children });
|
|
||||||
}
|
|
||||||
return item;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 将权限路由转换成菜单
|
* 将权限路由转换成菜单
|
||||||
* @param routes - 路由
|
* @param routes - 路由
|
||||||
@ -85,3 +53,35 @@ function getActiveKeyPathsOfMenu(activeKey: string, menu: App.GlobalMenuOption)
|
|||||||
}
|
}
|
||||||
return keys;
|
return keys;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** 路由不转换菜单 */
|
||||||
|
function hideInMenu(route: AuthRoute.Route) {
|
||||||
|
return Boolean(route.meta.hide);
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 给菜单添加可选属性 */
|
||||||
|
function addPartialProps(config: {
|
||||||
|
menu: App.GlobalMenuOption;
|
||||||
|
icon?: string;
|
||||||
|
localIcon?: string;
|
||||||
|
children?: App.GlobalMenuOption[];
|
||||||
|
}) {
|
||||||
|
const { iconRender } = useIconRender();
|
||||||
|
|
||||||
|
const item = { ...config.menu };
|
||||||
|
|
||||||
|
const { icon, localIcon, children } = config;
|
||||||
|
|
||||||
|
if (localIcon) {
|
||||||
|
Object.assign(item, { icon: iconRender({ localIcon }) });
|
||||||
|
}
|
||||||
|
|
||||||
|
if (icon) {
|
||||||
|
Object.assign(item, { icon: iconRender({ icon }) });
|
||||||
|
}
|
||||||
|
|
||||||
|
if (children) {
|
||||||
|
Object.assign(item, { children });
|
||||||
|
}
|
||||||
|
return item;
|
||||||
|
}
|
||||||
|
@ -1,97 +1,5 @@
|
|||||||
import type { RouteComponent, RouteRecordRaw } from 'vue-router';
|
import type { RouteRecordRaw } from 'vue-router';
|
||||||
import { BasicLayout, BlankLayout } from '@/layouts';
|
import { getLayoutComponent, getViewComponent } from './component';
|
||||||
import { views } from '@/views';
|
|
||||||
import { isFunction } from '@/utils';
|
|
||||||
|
|
||||||
type Lazy<T> = () => Promise<T>;
|
|
||||||
|
|
||||||
type LayoutComponent = Record<EnumType.LayoutComponentName, Lazy<RouteComponent>>;
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 获取布局的vue文件(懒加载的方式)
|
|
||||||
* @param layoutType - 布局类型
|
|
||||||
*/
|
|
||||||
export function getLayoutComponent(layoutType: EnumType.LayoutComponentName) {
|
|
||||||
const layoutComponent: LayoutComponent = {
|
|
||||||
basic: BasicLayout,
|
|
||||||
blank: BlankLayout
|
|
||||||
};
|
|
||||||
return layoutComponent[layoutType];
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 获取页面导入的vue文件
|
|
||||||
* @param routeKey - 路由key
|
|
||||||
*/
|
|
||||||
export function getViewComponent(routeKey: AuthRoute.LastDegreeRouteKey) {
|
|
||||||
if (!views[routeKey]) {
|
|
||||||
throw new Error(`路由“${routeKey}”没有对应的组件文件!`);
|
|
||||||
}
|
|
||||||
return setViewComponentName(views[routeKey], routeKey);
|
|
||||||
}
|
|
||||||
|
|
||||||
interface ModuleComponent {
|
|
||||||
default: RouteComponent;
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 给页面组件设置名称 */
|
|
||||||
function setViewComponentName(component: RouteComponent | Lazy<ModuleComponent>, name: string) {
|
|
||||||
if (isAsyncComponent(component)) {
|
|
||||||
return async () => {
|
|
||||||
const result = await component();
|
|
||||||
Object.assign(result.default, { name });
|
|
||||||
return result;
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
Object.assign(component, { name });
|
|
||||||
|
|
||||||
return component;
|
|
||||||
}
|
|
||||||
|
|
||||||
function isAsyncComponent(component: RouteComponent | Lazy<ModuleComponent>): component is Lazy<ModuleComponent> {
|
|
||||||
return isFunction(component);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 是否有外链
|
|
||||||
* @param item - 权限路由
|
|
||||||
*/
|
|
||||||
function hasHref(item: AuthRoute.Route) {
|
|
||||||
return Boolean(item.meta.href);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 是否有动态路由path
|
|
||||||
* @param item - 权限路由
|
|
||||||
*/
|
|
||||||
function hasDynamicPath(item: AuthRoute.Route) {
|
|
||||||
return Boolean(item.meta.dynamicPath);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 是否有路由组件
|
|
||||||
* @param item - 权限路由
|
|
||||||
*/
|
|
||||||
function hasComponent(item: AuthRoute.Route) {
|
|
||||||
return Boolean(item.component);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 是否有子路由
|
|
||||||
* @param item - 权限路由
|
|
||||||
*/
|
|
||||||
function hasChildren(item: AuthRoute.Route) {
|
|
||||||
return Boolean(item.children && item.children.length);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 是否是单层级路由
|
|
||||||
* @param item - 权限路由
|
|
||||||
*/
|
|
||||||
function isSingleRoute(item: AuthRoute.Route) {
|
|
||||||
return Boolean(item.meta.singleLayout);
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 将权限路由转换成vue路由
|
* 将权限路由转换成vue路由
|
||||||
@ -212,3 +120,85 @@ export function transformAuthRouteToVueRoute(item: AuthRoute.Route) {
|
|||||||
|
|
||||||
return resultRoute;
|
return resultRoute;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 将权限路由转换成搜索的菜单数据
|
||||||
|
* @param routes - 权限路由
|
||||||
|
* @param treeMap
|
||||||
|
*/
|
||||||
|
export function transformAuthRouteToSearchMenus(routes: AuthRoute.Route[], treeMap: AuthRoute.Route[] = []) {
|
||||||
|
if (routes && routes.length === 0) return [];
|
||||||
|
return routes.reduce((acc, cur) => {
|
||||||
|
if (!cur.meta?.hide) {
|
||||||
|
acc.push(cur);
|
||||||
|
}
|
||||||
|
if (cur.children && cur.children.length > 0) {
|
||||||
|
transformAuthRouteToSearchMenus(cur.children, treeMap);
|
||||||
|
}
|
||||||
|
return acc;
|
||||||
|
}, treeMap);
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 将路由名字转换成路由路径 */
|
||||||
|
export function transformRouteNameToRoutePath(name: Exclude<AuthRoute.AllRouteKey, 'not-found'>): AuthRoute.RoutePath {
|
||||||
|
const rootPath: AuthRoute.RoutePath = '/';
|
||||||
|
if (name === 'root') return rootPath;
|
||||||
|
|
||||||
|
const splitMark = '_';
|
||||||
|
const pathSplitMark = '/';
|
||||||
|
const path = name.split(splitMark).join(pathSplitMark);
|
||||||
|
|
||||||
|
return (pathSplitMark + path) as AuthRoute.RoutePath;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 将路由路径转换成路由名字 */
|
||||||
|
export function transformRoutePathToRouteName<K extends AuthRoute.RoutePath>(path: K) {
|
||||||
|
if (path === '/') return 'root';
|
||||||
|
|
||||||
|
const pathSplitMark = '/';
|
||||||
|
const routeSplitMark = '_';
|
||||||
|
|
||||||
|
const name = path.split(pathSplitMark).slice(1).join(routeSplitMark) as AuthRoute.AllRouteKey;
|
||||||
|
|
||||||
|
return name;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 是否有外链
|
||||||
|
* @param item - 权限路由
|
||||||
|
*/
|
||||||
|
function hasHref(item: AuthRoute.Route) {
|
||||||
|
return Boolean(item.meta.href);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 是否有动态路由path
|
||||||
|
* @param item - 权限路由
|
||||||
|
*/
|
||||||
|
function hasDynamicPath(item: AuthRoute.Route) {
|
||||||
|
return Boolean(item.meta.dynamicPath);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 是否有路由组件
|
||||||
|
* @param item - 权限路由
|
||||||
|
*/
|
||||||
|
function hasComponent(item: AuthRoute.Route) {
|
||||||
|
return Boolean(item.component);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 是否有子路由
|
||||||
|
* @param item - 权限路由
|
||||||
|
*/
|
||||||
|
function hasChildren(item: AuthRoute.Route) {
|
||||||
|
return Boolean(item.children && item.children.length);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 是否是单层级路由
|
||||||
|
* @param item - 权限路由
|
||||||
|
*/
|
||||||
|
function isSingleRoute(item: AuthRoute.Route) {
|
||||||
|
return Boolean(item.meta.singleLayout);
|
||||||
|
}
|
||||||
|
@ -16,7 +16,8 @@ export default defineConfig(configEnv => {
|
|||||||
resolve: {
|
resolve: {
|
||||||
alias: {
|
alias: {
|
||||||
'~': rootPath,
|
'~': rootPath,
|
||||||
'@': srcPath
|
'@': srcPath,
|
||||||
|
'vue-i18n': 'vue-i18n/dist/vue-i18n.cjs.js'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
define: viteDefine,
|
define: viteDefine,
|
||||||
|
Loading…
Reference in New Issue
Block a user