feat: 内容管理

src/utils/menuUtils.tsx

@@ -1,12 +1,11 @@
-import { Navigate } from '@umijs/max';
 import { Spin } from 'antd';
 import React from 'react';
+import type { MenuVO } from '@/services/system/menu';
 
-export const loopMenuItem = (menus: any[], pId: number | string): any[] => {
-  // console.log(menus, "menus");
-  return menus.flatMap((item) => {
+export const loopMenuItem = (menus: MenuVO[], pId: number | string): any[] => {
+  return menus.map((item) => {
     let Component: React.ComponentType<any> | null = null;
-    if (item.component && item.component.length > 0) {
+    if (item.component && item.component.trim().length > 0) {
       // 防止配置了路由，但本地暂未添加对应的页面，产生的错误
       Component = React.lazy(() => {
         const importComponent = () => import(`@/pages/${item.component}`);
@@ -14,56 +13,106 @@ export const loopMenuItem = (menus: any[], pId: number | string): any[] => {
         return importComponent().catch(import404);
       });
     }
-    if (item.children && item.children.length > 0) {
-      return [
-        {
-          path: item.path,
-          name: item.name,
-          // icon: item.icon,
-          id: item.id,
-          parentId: pId,
-          children: [
-            {
-              path: item.path,
-              element: (
-                <Navigate
-                  to={getFirstLeafPath(item.children, item.path)}
-                  replace
-                />
-              ),
-            },
-            ...loopMenuItem(item.children, item.menuID),
-          ],
-        },
-      ];
-    } else {
-      return [
-        {
-          path: item.path,
-          name: item.name,
-          // icon: item.icon,
-          id: item.menuID,
-          parentId: pId,
-          element: (
-            <React.Suspense
-              fallback={<Spin style={{ width: '100%', height: '100%' }} />}
-            >
-              {Component && <Component />}
-            </React.Suspense>
-          ),
-          children: [], // 添加缺失的 children 属性
-        },
-      ];
+
+    const routeItem: any = {
+      path: item.path,
+      name: item.name,
+      icon: '',
+      id: item.id,
+      parentId: pId,
+      hideInMenu: !item.visible,
+      children: [],
+    };
+
+    // 只有当 Component 存在时才添加 element 属性
+    if (Component) {
+      routeItem.element = (
+        <React.Suspense
+          fallback={<Spin style={{ width: '100%', height: '100%' }} />}
+        >
+          <Component />
+        </React.Suspense>
+      );
+    } else if (item.children && item.children.length > 0) {
+      // routeItem.redirect = "/prod/list";
+      // // 只有当没有 Component 但有子菜单时，才添加重定向
+      // const firstLeafPath = getFirstLeafPath(item.children);
+      // // 确保 firstLeafPath 存在，且不是一个会导致循环的路径
+      // if (
+      //   firstLeafPath &&
+      //   firstLeafPath !== item.path &&
+      //   firstLeafPath.length > 0
+      // ) {
+      //   // 在 UmiJS 中，路径是相对的，不需要构建完整路径
+      //   const separator =
+      //     item.path.endsWith("/") || firstLeafPath.startsWith("/") ? "" : "/";
+      //   const fullPath = `${item.path}${separator}${firstLeafPath}`;
+      //   console.log(`Redirecting from ${item.path} to ${fullPath}`);
+      //   routeItem.element = <Navigate to={fullPath} replace={true} />;
+      // }
     }
+    // 处理子菜单
+    if (item.children && item.children.length > 0) {
+      routeItem.children = loopMenuItem(item.children, item.id);
+    }
+
+    return routeItem;
   });
 };
 
-function getFirstLeafPath(menus: any[], parentPath: string): string {
-  const firstMenu = menus[0];
-  const currentPath = `${parentPath}/${firstMenu.path}`;
-  if (firstMenu.children && firstMenu.children.length > 0) {
-    return getFirstLeafPath(firstMenu.children, currentPath);
-  } else {
-    return currentPath;
-  }
-}
+// return menus.flatMap((item) => {
+//   let Component: React.ComponentType<any> | null = null;
+//   if (item.component && item.component.length > 0) {
+//     // 防止配置了路由，但本地暂未添加对应的页面，产生的错误
+//     Component = React.lazy(() => {
+//       const importComponent = () => import(`@/pages/${item.component}`);
+//       const import404 = () => import("@/pages/404");
+//       return importComponent().catch(import404);
+//     });
+//   }
+//   if (item.children && item.children.length > 0) {
+//     return [
+//       {
+//         path: item.path,
+//         hideInMenu: false,
+//         parentId: pId,
+//         id: item.id,
+//         children: [...loopMenuItem(item.children, item.id)], // 添加缺失的 children 属性
+//       },
+//     ];
+//   } else {
+//     return [
+//       {
+//         path: item.path,
+//         name: item.name,
+//         // icon: item.icon,
+//         id: item.id,
+//         parentId: pId,
+//         hideInMenu: !item.visible,
+//         element: (
+//           <React.Suspense
+//             fallback={<Spin style={{ width: "100%", height: "100%" }} />}
+//           >
+//             {Component && <Component />}
+//           </React.Suspense>
+//         ),
+//       },
+//     ];
+//   }
+// });
+// return [];
+// };
+
+// function getFirstLeafPath(menus: any[], parentPath: string): string {
+//   const firstMenu = menus[0];
+//   const currentPath = `${parentPath}/${firstMenu.path}`;
+//   if (firstMenu.children && firstMenu.children.length > 0) {
+//     if (!firstMenu.hideInMenu) {
+//       return getFirstLeafPath(firstMenu.children, currentPath);
+//     } else {
+//       return getFirstLeafPath(firstMenu.children, parentPath);
+//     }
+//   } else {
+//     return currentPath;
+//   }
+// }