feat: 个人资源页面搭建

src/router/index.ts

@@ -19,6 +19,7 @@ import ProjectWorkbench from "@/views/Project/ProjectWorkbench";
 import ProjectSubmitWork from "@/views/Project/ProjectSubmitWork";
 import ProjectJobDetail from "@/views/Project/ProjectJobDetail";
 import ProjectOverview from "@/views/Project/ProjectOverview";
+import UserResources from "@/views/ResourceCenter/UserResources";
 
 export type route = {
   id?: string;
@@ -51,6 +52,7 @@ export const elements: {
   }) => JSX.Element | any;
 } = {
   Demo: Demo,
+  UserResources: UserResources,
   ProjectSetting: ProjectSetting,
   ProjectData: ProjectData,
   ProjectWorkbench: ProjectWorkbench,

src/views/MenuLayout/index.module.css

@@ -46,3 +46,11 @@
 	background-color: #e6eaf0;
 	font-weight: 500;
 }
+
+.asideTop {
+	padding: 19px 24px 13px;
+	line-height: 24px;
+	font-size: 16px;
+	color: rgba(30, 38, 51, 1);
+	font-weight: 550;
+}

src/views/MenuLayout/index.tsx

@@ -8,7 +8,7 @@
  */
 import { Box, List } from "@mui/material";
 import CurrentProject from "../Project/components/CurrentProject";
-import React from "react";
+import React, { useMemo } from "react";
 import { Outlet, useNavigate, useLocation } from "react-router-dom";
 import style from "./index.module.css";
 import { observer } from "mobx-react-lite";
@@ -44,10 +44,34 @@ const MenuLayout = observer(() => {
 		}
 	};
 
+	// // 左侧菜单顶部是否显示当前项目组件
+	// const showCurrentProject = useMemo(() => {
+	// 	const noCurrentProjectRouterApp = ["userCenter", "resourceCenter"];
+	// 	return noCurrentProjectRouterApp.every((item) => {
+	// 		return pathname.indexOf(item) === -1;
+	// 	});
+	// }, [pathname]);
+
+	const renderAsideTop = useMemo(() => {
+		const noCurrentProjectRouterApp = ["userCenter", "resourceCenter"];
+		if (
+			noCurrentProjectRouterApp.every((item) => {
+				return pathname.indexOf(item) === -1;
+			})
+		) {
+			return <CurrentProject />;
+		}
+		if (pathname.indexOf("resourceCenter") !== -1) {
+			return <div className={style.asideTop}>资源中心</div>;
+		}
+		return null;
+	}, [pathname]);
+
 	return (
 		<Box className={style.container}>
 			<Box className={style.aside}>
-				{pathname.indexOf("userCenter") < 0 && <CurrentProject />}
+				{renderAsideTop}
+				{/* {showCurrentProject && <CurrentProject />} */}
 				<List
 					sx={{
 						paddingTop: 0,

src/views/ResourceCenter/UserResources/UserResourcesEnvironment/index.tsx

+const UserResourcesEnvironment = () => {
+	return <div>UserResourcesEnvironment</div>;
+};
+
+export default UserResourcesEnvironment;

src/views/ResourceCenter/UserResources/index.tsx

+import style from "./index.module.css";
+import UserResourcesEnvironment from "./UserResourcesEnvironment";
+// src\views\ResourceCenter\UserResources\UserResourcesEnvironment
+
+const tabs = [
+	{
+		label: "工作流模板",
+		value: "template",
+		id: "USERRESOURCES_TEMPLATE",
+	},
+	{
+		label: "工作流算子",
+		value: "floe",
+		id: "USERRESOURCES_FLOE",
+	},
+	{
+		label: "应用环境",
+		value: "environment",
+		id: "USERRESOURCES_ENVIRONMENT",
+	},
+];
+
+const UserResources = () => {
+	const renderTabs = () => {};
+	return (
+		<div>
+			<div className={style.top}>
+				<div>个人资源</div>
+				<div className={style.tabs}></div>
+			</div>
+			<div className={style.content}>UserResources</div>
+		</div>
+	);
+};
+
+export default UserResources;