feat: 完成任务详情联调

src/api/api_manager.ts

@@ -35,6 +35,7 @@ const RESTAPI = {
   API_WORKBENCH_DEL_WORKFLOWJOB: `${BACKEND_API_URI_PREFIX}/cpp/workflow/job/`, //删除工作流任务
   API_WORKBENCH_CANCEL_WORKFLOWJOB: `${BACKEND_API_URI_PREFIX}/cpp/workflow/cancel`, //取消工作流
   API_SUBMIT_WORKFLOW: `${BACKEND_API_URI_PREFIX}/cpp/workflow/submit`, //提交工作流
+  API_WORKBENCH_WORKFLOW_TASKINFO: `${BACKEND_API_URI_PREFIX}/cpp/workbench/workflowjob/task-info`, //查询任务某个算子详情
 };
 
 export default RESTAPI;

src/api/project_api.ts

@@ -235,6 +235,14 @@ const submitWorkFlow = (params: submitWorkFlowParams) => {
   });
 };
 
+// 查询任务某个算子详情
+const getworkFlowTaskInfo = (params: { jobId: string; taskId: string }) => {
+  return request({
+    url: `${Api.API_WORKBENCH_WORKFLOW_TASKINFO}?jobId=${params.jobId}&taskId=${params.taskId}`,
+    method: "get",
+  });
+};
+
 export {
   current,
   menu,
@@ -254,4 +262,5 @@ export {
   fetchTemplateConfigInfo,
   fetchWorkFlowJob,
   submitWorkFlow,
+  getworkFlowTaskInfo,
 };

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

@@ -31,8 +31,6 @@
   font-size: 14px;
   color: rgba(30, 38, 51, 1);
   font-weight: 600;
-  padding-right: 20px;
-  border-right: 1px solid rgba(235, 237, 240, 1);
 }
 
 .swContent {
@@ -42,12 +40,109 @@
 .swFormBox {
   background-color: #fff;
   border-right: 1xp solid rgba(235, 237, 240, 1);
-  width: 608px;
+  width: 360px;
   overflow-y: scroll;
   box-sizing: border-box;
-  padding: 36px;
+  padding: 24px;
 }
 .swFlowBox {
   flex: 1;
   height: calc(100vh - 56px);
 }
+.title {
+  color: rgba(30, 38, 51, 1);
+  font-size: 16px;
+  line-height: 24px;
+  font-weight: 600;
+  margin-bottom: 16px;
+}
+.taskResults {
+  padding: 24px;
+  background-color: rgba(247, 248, 250, 1);
+  margin-bottom: 24px;
+}
+.notResults {
+  background-color: rgba(247, 248, 250, 1);
+  padding: 54px 0;
+  text-align: center;
+  color: rgba(138, 144, 153, 1);
+  font-size: 14px;
+  line-height: 22px;
+  margin-bottom: 24px;
+}
+.taskInfoLi {
+  margin-bottom: 20px;
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+}
+.taskInfoParams {
+  color: rgba(138, 144, 153, 1);
+  font-size: 14px;
+  line-height: 22px;
+}
+.taskInfoValue {
+  color: rgba(30, 38, 51, 1);
+  font-size: 14px;
+  line-height: 22px;
+  max-width: 210px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  display: flex;
+  overflow: hidden;
+  position: relative;
+  align-items: center;
+}
+.taskInfoValueShowAll {
+  white-space: normal;
+}
+.taskInfoValueIcon {
+  margin-right: 9px;
+}
+.tabs {
+  display: flex;
+  justify-content: flex-start;
+  border-bottom: 1px solid rgba(240, 242, 245, 1);
+}
+.tabLi {
+  cursor: pointer;
+  font-size: 14px;
+  line-height: 22px;
+  padding-bottom: 8px;
+  color: rgba(138, 144, 153, 1);
+  margin-right: 32px;
+  position: relative;
+}
+.tabLiAcitve {
+  color: rgba(19, 112, 255, 1);
+  border-bottom: 2px solid rgba(19, 112, 255, 1);
+}
+.overview {
+  padding-top: 19px;
+}
+.params {
+  padding-top: 19px;
+}
+.options {
+  position: absolute;
+  top: 33px;
+  max-height: 230px;
+  overflow-y: scroll;
+  padding: 8px 0px;
+  background: #ffffff;
+  box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.14);
+  border-radius: 4px;
+}
+.option {
+  padding: 7px 16px;
+  font-size: 14px;
+  color: rgba(30, 38, 51, 1);
+  line-height: 22px;
+  cursor: pointer;
+}
+.option:hover {
+  color: rgba(19, 112, 255, 1);
+}
+.optionActive {
+  color: rgba(19, 112, 255, 1);
+}

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

@@ -191,7 +191,7 @@ const ConfigForm = (props: ConfigFormProps) => {
             >
               {parameter.name}
               <span className={styles.parameterDataType}>
-                {parameter.classType}
+                {parameter.classTypeName}
               </span>
             </div>
             <div className={styles.parameterContent}>

src/views/Project/ProjectSubmitWork/index.tsx

@@ -133,7 +133,7 @@ const ProjectSubmitWork = () => {
               }
             }
             promotedParameters[parameter.name] = {
-              [parameter.classType]: value,
+              [parameter.classTypeName]: value,
             };
           });
       });

src/views/Project/ProjectSubmitWork/interface.ts

@@ -14,6 +14,7 @@ export interface IParameter {
   required: boolean;
   domType: IDomType;
   classType: string;
+  classTypeName: string;
   value: any;
   description: string;
   language: string;
@@ -104,3 +105,18 @@ export type IRenderTask = {
   flows: ITask[];
   isCheck: boolean; // 里面的子项表单校验是否全部通过
 };
+
+export interface ITaskInfo extends ITemplateConfig {
+  name: string;
+  outputPath: string;
+  state: IState;
+  specTitle: string;
+  specVersion: string;
+  jobCost: string;
+  creator: string;
+  createTime: string;
+  costTime: string;
+  logPath: string;
+}
+
+type IState = "SUCCEEDED" | "RUNNING" | "ABORTED" | "FAILED";

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

@@ -261,7 +261,7 @@ const Flow = (props: IProps) => {
           onBatchClick && onBatchClick(item.parentNode);
         } else {
           setSelectedNodeId(node.id);
-          onBatchClick && onBatchClick(item.parentNode || "");
+          onBatchClick && onBatchClick(node.id || "");
         }
       }
     });