feat: 点击幕布重置

src/views/ConsoleLayout/components/FileItem/index.tsx

@@ -140,11 +140,10 @@ const FileItem = observer((props: IProps) => {
               <div className={styles.speedBox}>
                 <span className={styles.span}>{`${storageUnitFromB(
                   itemInfo?.bytesUploaded || 0
-                )}/${storageUnitFromB(itemInfo?.bytesTotal || 0)}`}</span>{" "}
-                :
-                <span className={styles.span}>{`${storageUnitFromB(
+                )}/${storageUnitFromB(itemInfo?.bytesTotal || 0)}`}</span>
+               {statusMsg !== '上传失败' ?  <span className={styles.span}>{`${storageUnitFromB(
                   speed
-                )}/s`}</span>
+                )}/s`}</span> : null}
               </div>
             )}
           </div>

src/views/Project/ProjectJobDetail/index.tsx

@@ -2,7 +2,7 @@
  * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
  * @Date: 2022-06-21 20:03:56
  * @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
- * @LastEditTime: 2022-06-28 11:22:47
+ * @LastEditTime: 2022-06-28 17:19:15
  * @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/index.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */

src/views/Project/ProjectSubmitWork/interface.ts

@@ -2,7 +2,7 @@
  * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
  * @Date: 2022-06-21 20:03:56
  * @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
- * @LastEditTime: 2022-06-22 19:53:09
+ * @LastEditTime: 2022-06-28 16:22:13
  * @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/interface.ts
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -29,6 +29,8 @@ export interface IParameter {
   helperText?: string;
 }
 
+export type IExecutionStatus = 'Pending' | 'Running' | 'Done' | 'Failed'
+
 export interface ITask {
   id: string;
   title: string;
@@ -42,6 +44,7 @@ export interface ITask {
   parameters: Array<IParameter>;
   edges: Array<IEdge>;
   isCheck?: boolean;
+  executionStatus?: IExecutionStatus
 }
 
 export interface ITemplateConfig {

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

@@ -14,7 +14,7 @@ import classNames from "classnames";
 import jobFail from "@/assets/project/jobFail.svg";
 import jobRun from "@/assets/project/jobRun.svg";
 import jobSue from "@/assets/project/jobSue.svg";
-import { IEdge, ITask } from "../../ProjectSubmitWork/interface";
+import { IEdge, IExecutionStatus, ITask } from "../../ProjectSubmitWork/interface";
 import { IBatchNode, ILine } from "./interface";
 
 import styles from "./index.module.css";
@@ -32,6 +32,20 @@ interface IProps extends ReactFlowProps {
   onBatchClick?: (val: string) => void;
 }
 
+  /** 获取imgUrl */
+  const getImgUrl = (type: IExecutionStatus) => {
+    if(type === 'Done'){
+      return jobSue
+    }
+    if(type === 'Failed'){
+      return jobFail
+    }
+    if(type === 'Running'){
+      return jobRun
+    }
+    return undefined
+  }
+
 /** 自定义batch节点 */
 const BatchNode = (props: IBatchNode) => {
   const { data } = props;
@@ -89,7 +103,7 @@ const FlowNode = (props: any) => {
       <div style={{ display: "flex", alignItems: "center" }}>
         {data?.label || ""}
         {data.isCheck && <span className={styles.successDot}></span>}
-        <img style={{ marginLeft: "6px" }} src={jobRun} alt="" />
+        {getImgUrl(data.executionStatus) && <img style={{ marginLeft: "6px" }} src={getImgUrl(data.executionStatus)} alt="" />}
       </div>
       {data?.dotStatus?.isOutput ? (
         <Handle
@@ -200,6 +214,7 @@ const Flow = (props: IProps) => {
                   selectedStatus: selectedNodeId === item.id,
                 }
               : { isCheck: item.isCheck }),
+            executionStatus: item.executionStatus,
             /** 输入输出圆点状态 */
             dotStatus: nodesInputAndOutputStatus(item.id),
             /** 样式 */
@@ -255,7 +270,7 @@ const Flow = (props: IProps) => {
   /** flowNode点击事件 */
   const onNodeClick = (e: any, node: Node) => {
     tasks?.forEach((item) => {
-      if (item.id === node.id) {
+      if (item.id === node.id) {   
         if (item.parentNode) {
           setSelectedNodeId(item.parentNode);
           onBatchClick && onBatchClick(item.parentNode);
@@ -267,6 +282,11 @@ const Flow = (props: IProps) => {
     });
   };
 
+  const handlePaneClick = () => {
+    setSelectedNodeId('');
+    onBatchClick && onBatchClick('');
+  }
+
   /** node节点 */
   const [nodes, setNodes] = useNodesState(initialNodes);
   /** 连线数组 */
@@ -287,11 +307,12 @@ const Flow = (props: IProps) => {
       fitView
       proOptions={{ hideAttribution: true, account: "" }}
       nodeTypes={nodeTypes}
+      onPaneClick={handlePaneClick}
       onNodeClick={onNodeClick}
       {...props}
     >
       <Controls />
-      <Background color="#aaa" gap={16} />
+      <Background  color="#aaa" gap={16} />
     </ReactFlow>
   );
 };