Merge branch 'feat-20220801' of http://120.77.149.83/root/bkunyun into feat-20220801

src/components/mui/MySwitch.tsx

@@ -27,56 +27,46 @@ const MySwitch = (props: IMySwitchProps) => {
 		...other
 	} = props;
 
-	const bgColor = useMemo(() => {
-		if (disabled) {
-			if (value) {
-				return "rgba(166, 211, 255, 1)";
-			} else {
-				return "rgba(221, 225, 230, 1)";
-			}
-		} else {
-			if (value) {
-				return "rgba(19, 112, 255, 1)";
-			} else {
-				return "rgba(221, 225, 230, 1)";
-			}
-		}
-	}, [disabled, value]);
-
-	const theme = createTheme({
-		components: {
-			MuiSwitch: {
-				styleOverrides: {
-					root: {
-						boxSizing: "border-box",
-						padding: "0",
-					},
-					switchBase: {
-						top: "4px",
-						left: "4px",
-						padding: 0,
-						"&.Mui-checked": {
-							left: "2px",
-							"& + .MuiSwitch-track": {
-								backgroundColor: bgColor,
-								opacity: 1,
+	const theme = useMemo(() => {
+		return createTheme({
+			components: {
+				MuiSwitch: {
+					styleOverrides: {
+						root: {
+							boxSizing: "border-box",
+							padding: "0",
+						},
+						switchBase: {
+							top: "4px",
+							left: "4px",
+							padding: 0,
+							"&.Mui-checked": {
+								left: "2px",
+								"& + .MuiSwitch-track": {
+									backgroundColor: disabled
+										? "rgba(166, 211, 255, 1)"
+										: "rgba(19, 112, 255, 1)",
+									opacity: 1,
+								},
 							},
 						},
-					},
-					thumb: {
-						width: "14px",
-						height: "14px",
-						color: "#fff",
-					},
-					track: {
-						borderRadius: "11px",
-						backgroundColor: "rgba(221, 225, 230, 1)",
-						opacity: 1,
+						thumb: {
+							width: "14px",
+							height: "14px",
+							color: "#fff",
+						},
+						track: {
+							borderRadius: "11px",
+							backgroundColor: disabled
+								? "RGBA(240, 242, 245, 1)"
+								: "RGBA(221, 225, 230, 1)",
+							opacity: 1,
+						},
 					},
 				},
 			},
-		},
-	});
+		});
+	}, [disabled]);
 
 	return (
 		<ThemeProvider theme={theme}>

src/views/Project/ProjectJobDetail/index.module.css

@@ -110,8 +110,14 @@
 	color: rgba(138, 144, 153, 1);
 	font-size: 14px;
 	line-height: 22px;
-	width: 72px;
+	width: 80px;
 	margin-right: 44px;
+	overflow: hidden;
+	word-wrap: break-word;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
 }
 .taskInfoValue {
 	color: rgba(30, 38, 51, 1);

src/views/Project/ProjectJobDetail/index.tsx

@@ -2,7 +2,7 @@
  * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
  * @Date: 2022-06-21 20:03:56
  * @LastEditors: 吴永生 15770852798@163.com
- * @LastEditTime: 2022-09-01 09:39:20
+ * @LastEditTime: 2022-09-05 17:33:58
  * @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/index.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -75,10 +75,12 @@ const ProjectSubmitWork = observer(() => {
 	const productId = toJS(currentProjectStore.currentProductInfo.id);
 	const [workFlowJobInfo, setWorkFlowJobInfo] = useState<ITaskInfo>();
 	const [patchInfo, setPatchInfo] = useState<any>();
-	const [activePatchId, setActivePatchId] = useState<string>("");
 	const [overviewActive, setOverviewActive] = useState(true);
-	const [activeFlowIndex, setActiveFlowIndex] = useState<number>(0);
-	const [showOptions, setShowOptions] = useState<boolean>(false);
+	/** 选中的node Id */
+	const [activeFlowIndex, setActiveFlowIndex] = useState<string>("");
+	/** 选中的flow Title */
+	const [selectNodeTitle, setSelectNodeTitle] = useState('参数')
+	// const [showOptions, setShowOptions] = useState<boolean>(false);
 	const [randerOutputs1, setRanderOutputs] = useState<Array<any>>([]);
 	const locationInfo: any = useLocation()?.state;
 	// const locationInfo: any = location?.state;
@@ -337,32 +339,51 @@ const ProjectSubmitWork = observer(() => {
 		},
 	});
 
-	const handleBatch = (id: string) => {
-		setActivePatchId(id);
-		if (id) {
-			setActiveFlowIndex(0);
-			getworkFlowTaskInfoRun({
-				jobId: workFlowJobInfo?.id as string,
-				taskId: id,
+	const setExternalSelectedNodeId = (id: string) => {
+		setActiveFlowIndex(id);
+		workFlowJobInfo?.tasks &&
+			workFlowJobInfo?.tasks?.forEach((item) => {
+				if (item.id === id) {
+					getworkFlowTaskInfoRun({
+						jobId: workFlowJobInfo?.id as string,
+						taskId: item.parentNode || item.id
+					});
+				}
 			});
-		}
 	};
 
-	const randerParameters = useMemo(() => {
-		if (patchInfo?.children) {
-			if (patchInfo.children.length > 0) {
-				return patchInfo.children[activeFlowIndex].parameters;
+	const selectedParameter = useCallback(
+		(list: any) => {
+			let result: any = [];
+			if(patchInfo?.id === activeFlowIndex ) {
+				setSelectNodeTitle(list[0].title || '')
+				result = list[0].parameters
 			} else {
-				return patchInfo?.parameters;
+				list?.length &&
+				list?.forEach((item: any) => {
+					if (item.id === activeFlowIndex) {
+					console.log(1111)
+						setSelectNodeTitle(item?.title || '')
+						result = item.parameters;
+					}
+				});
 			}
+			return result;
+		},
+		[activeFlowIndex, patchInfo]
+	);
+
+	const randerParameters = useMemo(() => {
+		if (patchInfo?.children?.length) {
+			return selectedParameter(patchInfo?.children);
 		} else {
-			return patchInfo?.parameters;
+			return selectedParameter(patchInfo?.parameters);
 		}
-	}, [activeFlowIndex, patchInfo]);
+
+	}, [patchInfo, selectedParameter]);
 
 	const handleParams = () => {
 		setOverviewActive(false);
-		setShowOptions(!showOptions);
 	};
 
 	/** 终止任务 */
@@ -455,7 +476,7 @@ const ProjectSubmitWork = observer(() => {
 			<div className={styles.swContent}>
 				{fullScreenShow ? null : (
 					<div className={styles.swFormBox}>
-						{!activePatchId && (
+						{!activeFlowIndex && (
 							<div className={styles.taskInfo}>
 								<div className={styles.title}>任务结果</div>
 								{workFlowJobInfo?.outputs &&
@@ -625,7 +646,7 @@ const ProjectSubmitWork = observer(() => {
 								</div>
 							</div>
 						)}
-						{activePatchId && (
+						{activeFlowIndex && (
 							<div className={styles.suanziInfo}>
 								<div className={styles.title}>{patchInfo?.title}</div>
 								<div className={styles.tabs}>
@@ -646,28 +667,7 @@ const ProjectSubmitWork = observer(() => {
 										// onClick={() => setOverviewActive(false)}
 										onClick={() => handleParams()}
 									>
-										{patchInfo?.children.length > 0
-											? patchInfo?.children[activeFlowIndex].title
-											: patchInfo?.title}
-										{showOptions && patchInfo?.children.length > 0 && (
-											<div className={styles.options}>
-												{patchInfo?.children.map((item: any, index: number) => {
-													return (
-														<div
-															key={index}
-															className={classNames({
-																[styles.option]: true,
-																[styles.optionActive]:
-																	activeFlowIndex === index,
-															})}
-															onClick={() => setActiveFlowIndex(index)}
-														>
-															{item.title}
-														</div>
-													);
-												})}
-											</div>
-										)}
+										{selectNodeTitle}
 									</div>
 								</div>
 								{overviewActive && (
@@ -720,7 +720,7 @@ const ProjectSubmitWork = observer(() => {
 								)}
 								{!overviewActive && (
 									<div className={styles.params}>
-										{randerParameters.map((parameter: any) => {
+										{randerParameters?.map((parameter: any) => {
 											return (
 												<div className={styles.taskInfoLi} key={parameter.name}>
 													<div className={styles.taskInfoParams}>
@@ -742,7 +742,11 @@ const ProjectSubmitWork = observer(() => {
 					className={styles.swFlowBox}
 					style={fullScreenShow ? { height: "100vh" } : undefined}
 				>
-					<Flow tasks={workFlowJobInfo?.tasks} onBatchClick={handleBatch} />
+					<Flow
+					externalSelectedNodeId={activeFlowIndex}
+						tasks={workFlowJobInfo?.tasks}
+						setExternalSelectedNodeId={setExternalSelectedNodeId}
+					/>
 				</div>
 			</div>
 			<img

src/views/Project/components/Flow/index.module.css

 .reactFlowBox > div:last-child {
 	display: none;
 }
-.reactFlowBox > div:first-child {
+/* .reactFlowBox > div:first-child {
 	margin-top: 32px;
-}
+} */

src/views/Project/components/Flow/index.tsx

@@ -415,7 +415,7 @@ const Flow = (props: IProps) => {
 				} else {
 					setInSideFlowNodeId(node.id);
 					setInSideBatchNodeId("");
-					setExternalSelectedNodeId && setExternalSelectedNodeId("");
+					setExternalSelectedNodeId && setExternalSelectedNodeId(node.id);
 				}
 				document.getElementById(`point${node.id}`)?.scrollIntoView(true);
 			}
@@ -668,7 +668,6 @@ const Flow = (props: IProps) => {
 			className={styles.reactFlowBox}
 			nodes={nodes}
 			edges={edges}
-			fitView={flowType === "default" ? true : false}
 			{...reactFlowParams}
 			// proOptions={{ hideAttribution: true, account: "" }}
 			nodeTypes={nodeTypes}