feat: 队列选择器增加默认值功能

src/components/BusinessComponents/QueueSelect/index.tsx

@@ -17,7 +17,6 @@ export type IQueueLi = {
 	coreNum: number;
 	memory: number;
 	total: number;
-	id: string;
 	partition: string;
 };
 
@@ -34,7 +33,6 @@ type IQueueSelectProps = {
 type IMemoryLi = {
 	memory: number;
 	total: number;
-	id: string;
 	partition: string;
 };
 
@@ -43,7 +41,6 @@ export type IShowCPULi = {
 	picUrl: string;
 	cpuName: string;
 	coreNum: number;
-	id: string;
 	partition: string;
 	memoryList: Array<IMemoryLi>;
 };
@@ -78,11 +75,10 @@ const QueueSelect = (props: IQueueSelectProps) => {
 		setOpen(true);
 	};
 
-	// 队列id、partition和前端展示的队列信息的映射关系
+	// 队列partition和前端展示的队列信息的映射关系
 	const idInfoMap = useMemo(() => {
 		return [
 			...originalCpuList.map((item) => ({
-				id: item.id,
 				partition: item.partition,
 				title: `${item.name}/${item.coreNum}核${item.coreNum * item.memory}G/${
 					item.coreNum
@@ -90,7 +86,6 @@ const QueueSelect = (props: IQueueSelectProps) => {
 				total: item.total,
 			})),
 			...originalGpuList.map((item) => ({
-				id: item.id,
 				partition: item.partition,
 				title: `${item.name}/${item.gpuNum}卡${item.coreNum}核${item.memory}G/${item.gpuNum}总卡数`,
 				total: item.total,
@@ -110,13 +105,11 @@ const QueueSelect = (props: IQueueSelectProps) => {
 					picUrl: item.picUrl,
 					cpuName: item.cpuName,
 					coreNum: item.coreNum,
-					id: item.id,
 					partition: item.partition,
 					memoryList: [
 						{
 							memory: item.memory,
 							total: item.total,
-							id: item.id,
 							partition: item.partition,
 						},
 					],
@@ -125,7 +118,6 @@ const QueueSelect = (props: IQueueSelectProps) => {
 				resultList[targetIndex].memoryList.push({
 					memory: item.memory,
 					total: item.total,
-					id: item.id,
 					partition: item.partition,
 				});
 			}
@@ -174,6 +166,34 @@ const QueueSelect = (props: IQueueSelectProps) => {
 		},
 	];
 
+	// 有初始值的话显示初始值
+	useEffect(() => {
+		if (open && value) {
+			console.log(open, "open");
+			console.log(value, "value");
+			const cpuActivePartitionIndex = originalCpuList.findIndex(
+				(li) => li.partition === value
+			);
+			console.log(cpuActivePartitionIndex, "cpuActivePartitionIndex");
+			let cpuActivePartitionName = "";
+			if (cpuActivePartitionIndex !== -1) {
+				cpuActivePartitionName = originalCpuList[cpuActivePartitionIndex].name;
+			}
+			const showCpuListClone: Array<IShowCPULi> = cloneDeep(showCpuList);
+			if (cpuActivePartitionIndex !== -1) {
+				showCpuListClone.forEach((li, index) => {
+					if (li.name === cpuActivePartitionName) {
+						console.log(value);
+						showCpuListClone[index].partition = value;
+					}
+				});
+				setShowCpuList(showCpuListClone);
+			}
+			setActivePartition(value);
+		}
+		// eslint-disable-next-line
+	}, [open, value]);
+
 	const renderType = (item: IShowCPULi) => {
 		return (
 			<div className={style.cpuType}>
@@ -223,6 +243,9 @@ const QueueSelect = (props: IQueueSelectProps) => {
 				}))}
 				hasTriangle={true}
 				setValue={setMemory}
+				sx={{
+					zIndex: 1601,
+				}}
 			>
 				<span className={style.cpuMemory}>
 					{

src/components/mui/MyMenu.tsx

 // 单选下拉框, 是input还是text还是其他由children决定
 
 import * as React from "react";
-import Menu from "@mui/material/Menu";
+import Menu, { MenuProps } from "@mui/material/Menu";
 import MenuItem from "@mui/material/MenuItem";
 import CheckIcon from "@mui/icons-material/Check";
 import { ThemeProvider, createTheme } from "@mui/material/styles";
@@ -12,13 +12,13 @@ type IOption = {
 	value: string;
 };
 
-type IMyMenuProps = {
+interface IMyMenuProps extends Omit<MenuProps, "open"> {
 	children: React.ReactNode;
 	options: Array<IOption>;
 	value: string;
 	setValue?: any;
 	hasTriangle?: boolean;
-};
+}
 
 const theme = createTheme({
 	components: {
@@ -65,7 +65,14 @@ const theme = createTheme({
 });
 
 const MyMenu = (props: IMyMenuProps) => {
-	const { children, options, value, setValue, hasTriangle = false } = props;
+	const {
+		children,
+		options,
+		value,
+		setValue,
+		hasTriangle = false,
+		...other
+	} = props;
 	const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
 	const open = Boolean(anchorEl);
 	const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {
@@ -112,6 +119,7 @@ const MyMenu = (props: IMyMenuProps) => {
 					MenuListProps={{
 						"aria-labelledby": "basic-button",
 					}}
+					{...other}
 				>
 					{options.map((option, index) => {
 						return (

src/views/WorkFlowEdit/components/ParameterSetting/index.tsx

@@ -2,10 +2,8 @@ import _ from "lodash";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import classNames from "classnames";
 
-import QueueSelect from "@/components/BusinessComponents/QueueSelect";
-import useMyRequest from "@/hooks/useMyRequest";
-import { getHardwreList } from "@/api/project_api";
 import { IQueueLi } from "@/components/BusinessComponents/QueueSelect";
+import QueueSelect from "@/components/BusinessComponents/QueueSelect";
 import {
 	ITask,
 	IParameter,
@@ -32,10 +30,17 @@ type IParameterSettingProps = {
 	templateConfigInfo: ITask[];
 	taskId: string;
 	setTemplateConfigInfo: any;
-	zoneId: string;
+	cpuList: Array<IQueueLi>;
+	gpuList: Array<IQueueLi>;
 };
 const ParameterSetting = (props: IParameterSettingProps) => {
-	const { templateConfigInfo, setTemplateConfigInfo, taskId, zoneId } = props; // 算子大数组
+	const {
+		templateConfigInfo,
+		setTemplateConfigInfo,
+		taskId,
+		cpuList,
+		gpuList,
+	} = props; // 算子大数组
 	const [isShowAllDese, setIsShowAllDese] = useState(false); // 是否展示全部描述
 	const [fileSelectOpen, setFileSelectOpen] = useState(false); // 选择输出路径的弹窗显示控制
 	const [fileSelectType, setFileSelectType] = useState<FileSelectType>("path");
@@ -43,31 +48,6 @@ const ParameterSetting = (props: IParameterSettingProps) => {
 	const resizeRef = useRef<HTMLDivElement>(null);
 	const [activeParamsTab, setActiveParamsTab] = useState<string>("");
 
-	const [cpuList, setCpuList] = useState<Array<IQueueLi>>([]);
-	const [gpuList, setGpuList] = useState<Array<IQueueLi>>([]);
-
-	const { run: getHardwreListFn } = useMyRequest(getHardwreList, {
-		onSuccess: (res, params) => {
-			if (params[0].computeType === "CPU") {
-				setCpuList(res.data);
-			} else {
-				setGpuList(res.data);
-			}
-		},
-	});
-	useEffect(() => {
-		getHardwreListFn({
-			zoneId,
-			computeType: "CPU",
-		});
-	}, [getHardwreListFn, zoneId]);
-	useEffect(() => {
-		getHardwreListFn({
-			zoneId,
-			computeType: "GPU",
-		});
-	}, [getHardwreListFn, zoneId]);
-
 	const size = useSize(resizeRef);
 
 	// 文件夹路线选择器弹窗

src/views/WorkFlowEdit/index.tsx

@@ -11,7 +11,9 @@ import _ from "lodash";
 import { useStores } from "@/store";
 import { toJS } from "mobx";
 import { observer } from "mobx-react-lite";
-
+import useMyRequest from "@/hooks/useMyRequest";
+import { getHardwreList } from "@/api/project_api";
+import { IQueueLi } from "@/components/BusinessComponents/QueueSelect";
 import MyPopconfirm from "@/components/mui/MyPopconfirm";
 import RadioGroupOfButtonStyle from "@/components/CommonComponents/RadioGroupOfButtonStyle";
 import MyButton from "@/components/mui/MyButton";
@@ -22,7 +24,6 @@ import { useMessage } from "@/components/MySnackbar";
 import { ITask } from "../Project/ProjectSubmitWork/interface";
 import { fetchTemplateConfigInfo } from "@/api/project_api";
 import { getCustomTemplateParameterCheckResult } from "./util";
-import useMyRequest from "@/hooks/useMyRequest";
 import CustomOperator from "../CustomOperator";
 import SaveCustomTemplate from "./components/SaveCustomTemplate";
 import AddIcon from "@mui/icons-material/Add";
@@ -66,6 +67,32 @@ const WorkFlowEdit = observer((props: IProps) => {
 		// 确认弹窗标题
 		"返回后，当前页面已填写内容将不保存，确认返回吗？"
 	);
+	const [cpuList, setCpuList] = useState<Array<IQueueLi>>([]);
+	const [gpuList, setGpuList] = useState<Array<IQueueLi>>([]);
+
+	const { run: getHardwreListFn } = useMyRequest(getHardwreList, {
+		onSuccess: (res, params) => {
+			if (params[0].computeType === "CPU") {
+				setCpuList(res.data);
+			} else {
+				setGpuList(res.data);
+			}
+		},
+	});
+	useEffect(() => {
+		zoneId &&
+			getHardwreListFn({
+				zoneId,
+				computeType: "CPU",
+			});
+	}, [getHardwreListFn, zoneId]);
+	useEffect(() => {
+		zoneId &&
+			getHardwreListFn({
+				zoneId,
+				computeType: "GPU",
+			});
+	}, [getHardwreListFn, zoneId]);
 
 	// 是否要监听删除时间
 	const listenState = useMemo(() => {
@@ -247,7 +274,8 @@ const WorkFlowEdit = observer((props: IProps) => {
 							templateConfigInfo={templateConfigInfo}
 							setTemplateConfigInfo={setTemplateConfigInfo}
 							taskId={selectTaskId || ""}
-							zoneId={zoneId as string}
+							cpuList={cpuList}
+							gpuList={gpuList}
 						/>
 					)}
 					<div