完成提交任务中的文件选择

src/components/BusinessComponents/FileSelect/index.tsx

@@ -19,6 +19,7 @@ import OutlinedInput from "@mui/material/OutlinedInput";
 import useMyRequest from "@/hooks/useMyRequest";
 import { storageUnitFromB } from "@/utils/util";
 import classnames from "classnames";
+import { useMessage } from "@/components/MySnackbar";
 import _ from "lodash";
 import moment from "moment";
 
@@ -32,6 +33,7 @@ type FileSelectProps = {
 const FileSelect = observer((props: FileSelectProps) => {
 	const { onConfirm, type = "path" } = props;
 	const { currentProjectStore } = useStores();
+	const Message = useMessage();
 	const projectId = toJS(currentProjectStore.currentProjectInfo.id);
 	const fileToken = toJS(currentProjectStore.currentProjectInfo.filetoken);
 	const [path, setPath] = useState<String>("/");
@@ -45,15 +47,50 @@ const FileSelect = observer((props: FileSelectProps) => {
 	const [dataSetList, setDataSetList] = useState<any>([]);
 	const [keyWord, setKeyWord] = useState("");
 
-	const fileSelectOnConfirm = () => {
-		// if (selectItem.type)
-		console.log(path);
-		console.log(selectFileName);
-		console.log(selectItem);
-		// onConfirm(path);
-		// /ProjectData
+	// 点击确认时返回的路径
+	const resultPath = useMemo(() => {
+		if (keyWord) {
+			if (selectFileName) {
+				console.log("selectFileName", selectFileName);
+				console.log("selectItem", selectItem.dir);
+				// dataset     path: "/test/"   path: "/"
+				// 其他  dir: "//call_logs/stdout/slurm/536f1e38-9357-470b-a0e9-fa5a9fbafe35/call-task_B/execution/"
+				//
+				if (type === "dataset") {
+					return `${selectItem.path}${selectFileName}`;
+				} else if (type === "file") {
+					return `${selectItem.dir.slice(1)}${selectFileName}`;
+				}
+			}
+		} else {
+			if (selectFileName) {
+				return `${path === "/" ? "" : path}/${selectFileName}`;
+			} else {
+				return path;
+			}
+		}
+	}, [path, selectFileName, keyWord, selectItem, type]);
+	console.log("resultPath", resultPath);
 
-		// /ProjectData/cromwell/slurm
+	const fileSelectOnConfirm = () => {
+		if (type === "file") {
+			if (!selectFileName) {
+				Message.error("请选择一个文件");
+				return;
+			} else if (selectItem.type === "directory") {
+				Message.error("现在选择的是文件夹，请重新选择");
+				return;
+			}
+		} else if (type === "dataset") {
+			if (!selectFileName) {
+				Message.error("请选择数据集");
+				return;
+			} else if (selectItem.type === "directory") {
+				Message.error("现在选择的是文件夹，请重新选择");
+				return;
+			}
+		}
+		onConfirm(resultPath);
 	};
 
 	// 搜索值改变
@@ -184,7 +221,7 @@ const FileSelect = observer((props: FileSelectProps) => {
 						[style.folderIconBox]: true,
 						[style.folderPointer]: true,
 					})}
-					onClick={() => handleViewFolders(item)}
+					onClick={() => !keyWord && handleViewFolders(item)}
 				>
 					<img className={style.folderIcon} src={folderIcon} alt="" />
 					{item.name}
@@ -244,14 +281,24 @@ const FileSelect = observer((props: FileSelectProps) => {
 				fileList.push(item);
 			}
 		});
-		if (type === "file") {
-			return [...folderList, ...fileList];
-		} else if (type === "dataset") {
-			return [...folderList, ...dataSetList];
+		if (keyWord) {
+			if (type === "file") {
+				return fileList;
+			} else if (type === "dataset") {
+				return dataSetList;
+			} else {
+				return folderList;
+			}
 		} else {
-			return [...folderList];
+			if (type === "file") {
+				return [...folderList, ...fileList];
+			} else if (type === "dataset") {
+				return [...folderList, ...dataSetList];
+			} else {
+				return [...folderList];
+			}
 		}
-	}, [list, dataSetList, type]);
+	}, [list, dataSetList, type, keyWord]);
 
 	// 前端展示的文件路径
 	const showPath = useMemo(() => {
@@ -324,6 +371,8 @@ const FileSelect = observer((props: FileSelectProps) => {
 	const getAllData = useCallback(() => {
 		setDataSetList([]);
 		setList([]);
+		setSelectFileName("");
+		setSelectItem({});
 		if (type === "file" || type === "path") {
 			// 不需要获取数据集
 			if (keyWord) {
@@ -373,17 +422,19 @@ const FileSelect = observer((props: FileSelectProps) => {
 			<div className={style.FSBox}>
 				<div className={style.FSTop}>
 					<div className={style.FSPath}>{showPath}</div>
-					<div className={style.FSKeyWord}>
-						<OutlinedInput
-							value={keyWord}
-							onChange={handleKeyWordChange}
-							placeholder="输入关键词搜索"
-							size="small"
-							sx={{ width: 240, height: 32 }}
-							endAdornment={<SearchIcon style={{ color: "#8A9099" }} />}
-							// onKeyUp={handleKeyWordChangeKeyUp}
-						/>
-					</div>
+					{type !== "path" && (
+						<div className={style.FSKeyWord}>
+							<OutlinedInput
+								value={keyWord}
+								onChange={handleKeyWordChange}
+								placeholder="输入关键词搜索"
+								size="small"
+								sx={{ width: 240, height: 32 }}
+								endAdornment={<SearchIcon style={{ color: "#8A9099" }} />}
+								// onKeyUp={handleKeyWordChangeKeyUp}
+							/>
+						</div>
+					)}
 				</div>
 				<Table
 					footer={false}

src/views/Project/ProjectSubmitWork/ConfigForm/index.tsx

@@ -4,7 +4,7 @@ import MyInput from "@/components/mui/MyInput";
 import Tooltip from "@mui/material/Tooltip";
 import classnames from "classnames";
 import { useState, useMemo, useImperativeHandle } from "react";
-import FileSelect from "@/components/FileSelect";
+import FileSelect from "@/components/BusinessComponents/FileSelect";
 import moment from "moment";
 import MySelect, { optionsTransform } from "../components/MySelect";
 import MyCheckBox from "@/components/mui/MyCheckBox";
@@ -26,6 +26,9 @@ type ConfigFormProps = {
 const ConfigForm = (props: ConfigFormProps) => {
 	const { templateConfigInfo, setParameter, setSelectedBatchNodeId } = props;
 	const [name, setName] = useState<string>(""); // 任务名称
+	const [fileSelectType, setFileSelectType] = useState<
+		"path" | "dataset" | "file"
+	>("path");
 
 	const [nameHelp, setNameHelp] = useState({
 		error: false,
@@ -218,9 +221,10 @@ const ConfigForm = (props: ConfigFormProps) => {
 									InputProps={{
 										endAdornment: (
 											<img
-												onClick={() =>
-													handleOpenFileSelect(taskId, parameter.name)
-												}
+												onClick={() => {
+													setFileSelectType("file");
+													handleOpenFileSelect(taskId, parameter.name);
+												}}
 												src={fileSelectIcon}
 												alt=""
 												className={styles.fileSelectImg}
@@ -240,9 +244,10 @@ const ConfigForm = (props: ConfigFormProps) => {
 									InputProps={{
 										endAdornment: (
 											<img
-												onClick={() =>
-													handleOpenFileSelect(taskId, parameter.name)
-												}
+												onClick={() => {
+													setFileSelectType("path");
+													handleOpenFileSelect(taskId, parameter.name);
+												}}
 												src={fileSelectIcon}
 												alt=""
 												className={styles.fileSelectImg}
@@ -262,9 +267,10 @@ const ConfigForm = (props: ConfigFormProps) => {
 									InputProps={{
 										endAdornment: (
 											<img
-												onClick={() =>
-													handleOpenFileSelect(taskId, parameter.name)
-												}
+												onClick={() => {
+													setFileSelectType("dataset");
+													handleOpenFileSelect(taskId, parameter.name);
+												}}
 												src={fileSelectIcon}
 												alt=""
 												className={styles.fileSelectImg}
@@ -420,7 +426,10 @@ const ConfigForm = (props: ConfigFormProps) => {
 							InputProps={{
 								endAdornment: (
 									<img
-										onClick={() => handleOpenFileSelect()}
+										onClick={() => {
+											setFileSelectType("path");
+											handleOpenFileSelect();
+										}}
 										src={fileSelectIcon}
 										alt="选择输出路径"
 										className={styles.fileSelectImg}
@@ -496,6 +505,7 @@ const ConfigForm = (props: ConfigFormProps) => {
 					onClose={handleFileSelectOnClose}
 					open={fileSelectOpen}
 					onConfirm={onFileSelectConfirm}
+					type={fileSelectType}
 				/>
 			)}
 		</div>

src/views/WorkFlowEdit/index.tsx

@@ -290,13 +290,24 @@ const WorkFlowEdit = observer((props: IProps) => {
 	// 表单弹窗确定，新建/编辑自定义模板保存
 	const handleOncofirm = () => {
 		if (checkTitle(title) && checkVersion(version)) {
-			saveUserSpecRun({
-				title,
-				version,
-				description,
-				tasks: templateConfigInfo,
-				productId,
-			});
+			if (id) {
+				saveUserSpecRun({
+					title,
+					version,
+					description,
+					tasks: templateConfigInfo,
+					productId,
+					id,
+				});
+			} else {
+				saveUserSpecRun({
+					title,
+					version,
+					description,
+					tasks: templateConfigInfo,
+					productId,
+				});
+			}
 		}
 	};