Merge branch 'feat-20220705-customTemplate' into 'release'

cn-解决合并冲突

See merge request !98

src/views/Project/ProjectWorkbench/workbenchList/index.tsx

@@ -7,20 +7,18 @@
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
 import { memo, useCallback, useEffect, useState } from "react";
+import _ from "lodash";
 import { useNavigate } from "react-router-dom";
 import { Box, Typography } from "@mui/material";
 import OutlinedInput from "@mui/material/OutlinedInput";
 import SearchIcon from "@mui/icons-material/Search";
-import LinearProgress, {
-	linearProgressClasses,
-} from "@mui/material/LinearProgress";
-import { TablePagination } from "@mui/material";
-import TextField from "@mui/material/TextField";
-import MenuItem from "@mui/material/MenuItem";
-
-import SimpleDialog from "./components/simpleDialog";
+import LinearProgress, { linearProgressClasses } from '@mui/material/LinearProgress';
+import { TablePagination } from '@mui/material';
+import TextField from '@mui/material/TextField';
+import MenuItem from '@mui/material/MenuItem';
+
+import SimpleDialog from "./components/simpleDialog"
 import { useStores } from "@/store";
-import { observer } from "mobx-react-lite";
 import useMyRequest from "@/hooks/useMyRequest";
 import ActionsComponent from "../../../../components/Material.Ui/Table/ActionsComponent"
 import runTime from '../../../../assets/project/runTime.svg'
@@ -36,35 +34,35 @@ import onload from '../../../../assets/project/onload.svg'
 import {
     getWorkflowJobList,
     deleteWorkflowJob,
-	cancelWorkflowJob,
+    cancelWorkflowJob
 } from "@/api/workbench_api";
 import { toJS } from "mobx";
 import { observer } from "mobx-react-lite";
 import usePass from "@/hooks/usePass";
 
 import styles from "./index.module.css";
-import { toJS } from "mobx";
+
 
 const currencies = [
     {
-		value: "ALL",
-		label: "全部",
+        value: 'ALL',
+        label: '全部',
     },
     {
-		value: "RUNNING",
-		label: "正在运行",
+        value: 'RUNNING',
+        label: '正在运行',
     },
     {
-		value: "SUCCEEDED",
-		label: "运行成功",
+        value: 'SUCCEEDED',
+        label: '运行成功',
     },
     {
-		value: "FAILED",
-		label: "运行失败",
+        value: 'FAILED',
+        label: '运行失败',
     },
     {
-		value: "ABORTED",
-		label: "运行终止",
+        value: 'ABORTED',
+        label: '运行终止',
     },
 ];
 
@@ -89,7 +87,7 @@ const ProjectMembers = observer(() => {
         onSuccess: (result: any) => {
             setJobList(result.data.content);
             setCount(result.data.totalElements)
-            timer && clearTimeout(timer)
+            timer && clearTimeout(timer as number)
             timer = null;
             timer = setTimeout(() => {
                 getWorkflowJobInfo({
@@ -136,48 +134,10 @@ const ProjectMembers = observer(() => {
         setJobName(data.length > 30 ? data.slice(0, 30) : data);
     }
 
-	// 删除作业
-	const { run: delWorkflowJob } = useMyRequest(deleteWorkflowJob, {
-		onSuccess: (result: any) => {
-			setOpenDialog(false);
-			getWorkflowJobInfo({
-				projectId: projectId as string,
-				page: page,
-				size: size,
-				name: jobName,
-				state: currency === "ALL" ? "" : currency,
-			});
-		},
-	});
-
-	// 删除作业
-	const { run: cancelWorkflowJobInfo } = useMyRequest(cancelWorkflowJob, {
-		onSuccess: (result: any) => {
-			setOpenDialog(false);
-			getWorkflowJobInfo({
-				projectId: projectId as string,
-				page: page,
-				size: size,
-				name: jobName,
-				state: currency === "ALL" ? "" : currency,
-			});
-		},
-	});
-
-	const searchChange = (data: any) => {
-		setJobName(data.length > 30 ? data.slice(0, 30) : data);
+    const handleChange = (event: any) => {
+        setCurrency(event.target.value);
     };
 
-    useEffect(() => {
-        getWorkflowJobInfo({
-            projectId: currentProjectStore.currentProjectInfo.id as string,
-            page: page,
-            size: size,
-            name: jobName,
-            state: currency === 'ALL' ? "" : currency
-        });
-    }, [projectId, getWorkflowJobInfo]);
-
     /** 关闭弹窗 */
     const closeDialog = () => {
         setOpenDialog(false);
@@ -187,67 +147,104 @@ const ProjectMembers = observer(() => {
     const onConfirm = () => {
         if (dialogType === "del") {
             delWorkflowJob({
-				id: jobData,
-			});
+                id: jobData
+            })
         } else {
             cancelWorkflowJobInfo({
-				jobid: jobData,
-			});
+                jobid: jobData
+            })
         }
     };
 
     useEffect(() => {
         getWorkflowJobInfo({
-			projectId: projectId as string,
+            projectId: currentProjectStore.currentProjectInfo.id as string,
             page: page,
             size: size,
             name: jobName,
-			state: currency === "ALL" ? "" : currency,
+            state: currency === 'ALL' ? "" : currency
         });
-	}, [
-		currentProjectStore.currentProjectInfo.id,
-		getWorkflowJobInfo,
-		projectId,
-		page,
-		size,
-		jobName,
-		currency,
-	]);
+    }, [projectId, getWorkflowJobInfo]);
 
     const handleChangePage = (event: any, newPage: any) => {
-		setPage(newPage);
+        setPage(newPage)
         getWorkflowJobInfo({
-			projectId: projectId as string,
+            projectId: currentProjectStore.currentProjectInfo.id as string,
             page: newPage,
             size: size,
             name: jobName,
-			state: currency === "ALL" ? "" : currency,
+            state: currency === 'ALL' ? "" : currency
         });
-	};
+    }
 
     const handleChangeRowsPerPage = (event: any) => {
-		setRowsPerPage(event.target.value);
-		setSize(event.target.value);
+        setRowsPerPage(event.target.value)
+        setSize(event.target.value)
         getWorkflowJobInfo({
-			projectId: projectId as string,
+            projectId: currentProjectStore.currentProjectInfo.id as string,
             page: page,
             size: event.target.value,
             name: jobName,
-			state: currency === "ALL" ? "" : currency,
+            state: currency === 'ALL' ? "" : currency
         });
-	};
+    }
 
     useEffect(() => {
         setTimeout(() => {
             getWorkflowJobInfo({
-				projectId: projectId as string,
+                projectId: currentProjectStore.currentProjectInfo.id as string,
                 page: page,
                 size: size,
                 name: jobName,
-				state: currency === "ALL" ? "" : currency,
+                state: currency === 'ALL' ? "" : currency
             });
-		}, 300);
-	}, [jobName, currency, projectId, getWorkflowJobInfo, page, size]);
+        }, 300)
+    }, [jobName, currency]);
+
+    const renderStatusIcon = (data: string) => {
+        switch (data) {
+            case "RUNNING":
+                return jobRun
+            case "ABORTED":
+                return jobCadence
+            case "FAILED":
+                return jobFail
+            case "SUCCEEDED":
+                return jobSue
+            default:
+                return jobCadence
+        }
+    }
+
+    const renderStatusText = (data: string) => {
+        switch (data) {
+            case "RUNNING":
+                return '正在运行'
+            case "ABORTED":
+                return '运行终止'
+            case "FAILED":
+                return '运行失败'
+            case "SUCCEEDED":
+                return '运行成功'
+            default:
+                return '未知'
+        }
+    }
+
+    const renderProgress = (data: any) => {
+        switch (data) {
+            case "RUNNING":
+                return '#1370FF'
+            case "ABORTED":
+                return '#C2C6CC'
+            case "FAILED":
+                return '#FF4E4E'
+            case "SUCCEEDED":
+                return '#0DD09B'
+            default:
+                return '#C2C6CC'
+        }
+    }
 
     /** 点击每一行 */
     const rowClick = useCallback(
@@ -259,20 +256,8 @@ const ProjectMembers = observer(() => {
         [navigate],
     );
 
-	const renderStatusText = (data: string) => {
-		switch (data) {
-			case "RUNNING":
-				return "正在运行";
-			case "ABORTED":
-				return "运行终止";
-			case "FAILED":
-				return "运行失败";
-			case "SUCCEEDED":
-				return "运行成功";
-			default:
-				return "未知";
-		}
-	};
+    return (
+        <Box className={styles.headerBox}>
 
             <Box className={styles.tabHeader}>
 
@@ -329,19 +314,7 @@ const ProjectMembers = observer(() => {
                     <img alt="" src={onload} />
                 </Box>
 
-	return (
-		<Box className={styles.headerBox}>
-			<Box className={styles.tabHeader}>
-				<OutlinedInput
-					onChange={(e: any) => {
-						searchChange(e.target.value);
-					}}
-					value={jobName}
-					placeholder="输入关键词搜索"
-					size="small"
-					sx={{ width: 340, height: 32 }}
-					endAdornment={<SearchIcon style={{ color: "#8A9099" }} />}
-				/>
+            </Box>
 
             <Box className={styles.body}>
                 {
@@ -430,35 +403,24 @@ const ProjectMembers = observer(() => {
                 }
             </Box>
 
-								<Box className={styles.tabBoxJobOperate}>
-									<img
-										alt=""
-										src={item.state === "RUNNING" ? jobStop : jobDel}
-										style={{ cursor: "pointer" }}
-										onClick={(event) => {
-											event.stopPropagation();
-											event.nativeEvent.stopImmediatePropagation();
-											setJobData(item.id);
-											setOpenDialog(true);
-											setDialogType(item.state === "RUNNING" ? "stop" : "del");
-										}}
-									/>
-								</Box>
-							</Box>
-						);
-					})}
-			</Box>
-
             <TablePagination
                 rowsPerPageOptions={[5, 10, 20, 50]}
-				labelRowsPerPage={"每页行数："}
+                labelRowsPerPage={'每页行数：'}
                 ActionsComponent={ActionsComponent}
                 component="div"
                 count={count || jobList.length}
                 rowsPerPage={rowsPerPage || 10}
                 page={page}
-				onPageChange={handleChangePage} //
-				onRowsPerPageChange={handleChangeRowsPerPage} //
+                onPageChange={handleChangePage}//
+                onRowsPerPageChange={handleChangeRowsPerPage}//
+            />
+
+            <SimpleDialog
+                text={dialogType === "del" ? '任务被删除后将无法恢复，确认继续吗？' : '正在运行的任务终止后将无法重新运行，确认继续吗？'}
+                title={dialogType === "del" ? '删除任务' : '终止任务'}
+                openDialog={openDialog}
+                closeDialog={closeDialog}
+                onConfirm={onConfirm}
             />
 
         </Box >