Skip to content

Commit

Permalink
feat: Update code
Browse files Browse the repository at this point in the history
  • Loading branch information
nuintun committed May 13, 2024
1 parent 6737ada commit fe0c400
Show file tree
Hide file tree
Showing 3 changed files with 46 additions and 152 deletions.
4 changes: 2 additions & 2 deletions app/js/components/Layout/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { Route } from '/js/utils/router';
import useTheme from '/js/hooks/useTheme';
import React, { memo, useMemo } from 'react';
import ActionsHeader from './headers/Actions';
import { Filter, nparse } from '/js/utils/menus';
import { Filter, parse } from '/js/utils/menus';
import FlexLayout from '/js/components/FlexLayout';
import { MenuType, Meta } from '/js/config/router';
import { RenderHeader } from '/js/components/FlexMenu';
Expand All @@ -21,7 +21,7 @@ export default memo(function Layout(): React.ReactElement {
const routes = useOutletContext<Route<Meta>[]>();

const menus = useMemo(() => {
return nparse<Meta>(
return parse<Meta>(
routes,
({ meta }) => {
switch (meta.type) {
Expand Down
26 changes: 2 additions & 24 deletions app/js/config/router.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -137,18 +137,7 @@ export const router: readonly Route<Meta>[] = [
type: MenuType.HIDDEN,
icon: <Icon component={PageIcon} />
},
element: lazy(() => import('/js/pages/System/Tabs/First')),
children: [
{
path: 'first',
meta: {
name: '标签页一一',
type: MenuType.HIDDEN,
icon: <Icon component={PageIcon} />
},
element: lazy(() => import('/js/pages/System/Tabs/First'))
}
]
element: lazy(() => import('/js/pages/System/Tabs/First'))
},
{
path: 'second',
Expand All @@ -157,18 +146,7 @@ export const router: readonly Route<Meta>[] = [
type: MenuType.HIDDEN,
icon: <Icon component={PageIcon} />
},
element: lazy(() => import('/js/pages/System/Tabs/Second')),
children: [
{
path: 'second',
meta: {
name: '标签页二一',
type: MenuType.HIDDEN,
icon: <Icon component={PageIcon} />
},
element: lazy(() => import('/js/pages/System/Tabs/Second'))
}
]
element: lazy(() => import('/js/pages/System/Tabs/Second'))
}
]
}
Expand Down
168 changes: 42 additions & 126 deletions app/js/utils/menus.ts
Original file line number Diff line number Diff line change
Expand Up @@ -32,96 +32,6 @@ export const enum Filter {
PRESERVE_SELF
}

/**
* @function isIgnored
* @description 检查节点是否为忽略状态
* @param state 节点过滤状态
*/
function isIgnored(state?: Filter): boolean {
return state === Filter.REMOVE_ALL || state === Filter.REMOVE_SELF;
}

/**
* @function parse
* @description 根据路由解析出菜单
* @param routes 路由
* @param filter 过滤器
*/
export function nparse<M = unknown>(
routes: readonly Route<M>[],
filter: (route: IRoute<M>) => Filter = () => Filter.DEFAULT,
transform: (menu: MenuItem, route: IRoute<M>) => MenuItem = menu => menu
): MenuItem[] {
const menus: MenuItem[] = [];

for (const route of routes) {
const removeable = new Set<string>();
const guards = new Map<string, Filter>();
const tree = new DFSTree(route as IRoute<M>, node => {
const guard = filter(node);

guards.set(node.meta.key, guard);

if (guard !== Filter.REMOVE_ALL) {
return node.children;
}
});
const mapping: Map<string, [parentKey: string | null, menu: MenuItem]> = new Map();

// 遍历节点
for (const [node, parent] of tree) {
// 当前节点数据
const { meta, children } = node;
const { key, name, icon, link } = meta;

// 当前节点计算属性
const guard = guards.get(key);
const hasChildren = children ? children.length > 0 : false;

if (name && hasChildren && guard !== Filter.PRESERVE_SELF) {
removeable.add(key);
}

if (!name || isIgnored(guard)) {
if (parent && hasChildren) {
const value = mapping.get(parent.meta.key);

if (value && guard === Filter.REMOVE_SELF) {
mapping.set(key, value);
}
}
} else {
const parentKey = parent ? parent.meta.key : null;

if (parentKey) {
removeable.delete(parentKey);
}

if (icon == null) {
mapping.set(key, [parentKey, transform({ key, name, link }, node)]);
} else {
mapping.set(key, [parentKey, transform({ key, name, link, icon }, node)]);
}
}
}

console.group('菜单转换过滤');

console.log('可删除菜单', removeable);
console.log('映射菜单数', mapping.size);

for (const [key, [parentKey, menu]] of mapping) {
if (!removeable.has(key)) {
console.log(key !== menu.key ? '中转节点' : '菜单节点', key, parentKey, menu);
}
}

console.groupEnd();
}

return menus;
}

/**
* @function removeEmptyLayouts
* @description 过滤只有布局的菜单
Expand Down Expand Up @@ -156,56 +66,62 @@ export function parse<M = unknown>(
const menus: MenuItem[] = [];
const removeable = new Set<string>();

for (const route of routes) {
for (const route of routes as IRoute<M>[]) {
const guards = new Map<string, Filter>();
const mapping = new Map<string, MenuItem>();

const tree = new DFSTree(route as IRoute<M>, node => {
const execFilter = (node: IRoute<M>): Filter => {
const guard = filter(node);

guards.set(node.meta.key, guard);

if (guard !== Filter.REMOVE_ALL) {
return node.children;
}
});

// 遍历节点
for (const [node, parent] of tree) {
// 当前节点数据
const { meta, children } = node;
const { key, name, icon, link } = meta;

// 当前节点计算属性
const guard = guards.get(key);
const hasChildren = children ? children.length > 0 : false;
const parentMenu = parent ? mapping.get(parent.meta.key) : null;

if (!name || isIgnored(guard)) {
if (hasChildren && parentMenu && guard === Filter.REMOVE_SELF) {
mapping.set(key, parentMenu);
}
} else {
const menu = transform(icon ? { key, name, link, icon } : { key, name, link }, node);
return guard;
};

if (execFilter(route) !== Filter.REMOVE_ALL) {
const tree = new DFSTree(route, node => {
return node.children?.filter(node => {
return execFilter(node) !== Filter.REMOVE_ALL;
});
});

// 遍历节点
for (const [node, parent] of tree) {
// 节点数据
const { meta, children } = node;
const { key, name, icon, link } = meta;

// 计算属性
const guard = guards.get(key);
const hasChildren = children ? children.length > 0 : false;
const parentMenu = parent ? mapping.get(parent.meta.key) : null;

if (!name || guard === Filter.REMOVE_SELF) {
if (hasChildren && parentMenu) {
mapping.set(key, parentMenu);
}
} else {
const menu = transform(icon ? { key, name, link, icon } : { key, name, link }, node);

if (hasChildren) {
mapping.set(key, menu);
if (hasChildren) {
mapping.set(key, menu);

if (guard !== Filter.PRESERVE_SELF) {
removeable.add(key);
if (guard !== Filter.PRESERVE_SELF) {
removeable.add(key);
}
}
}

if (parentMenu) {
const { children } = parentMenu;
if (parentMenu) {
const { children } = parentMenu;

if (children) {
children.push(menu);
if (children) {
children.push(menu);
} else {
parentMenu.children = [menu];
}
} else {
parentMenu.children = [menu];
menus.push(menu);
}
} else {
menus.push(menu);
}
}
}
Expand Down

0 comments on commit fe0c400

Please sign in to comment.