Merge branch 'feat-20220801' into 'staging'

Feat 20220801

See merge request !97

src/components/CommonComponents/RadioGroupOfButtonStyle/index.module.css

 .RadiosBox {
+	position: relative;
 	display: flex;
 	justify-content: space-between;
 	align-items: center;
@@ -20,7 +21,6 @@
 	border-radius: 2px;
 	line-height: 20px;
 	padding: 6px 16px;
-	/* background-color: #e6e8eb; */
 	flex: 1;
 	display: flex;
 	align-items: center;
@@ -30,8 +30,7 @@
 
 .radioActive {
 	color: #1370ff;
-	background-color: #fff;
-	box-shadow: 2px 4px 12px 0px rgba(0, 27, 63, 0.06);
+	position: relative;
 }
 .border {
 	width: 1px;
@@ -41,3 +40,19 @@
 .borderHidden {
 	visibility: hidden;
 }
+.radioActiveBgBox {
+	width: calc(100% - 2px);
+	position: absolute;
+	left: 1px;
+	top: 1px;
+	height: 28px;
+}
+.radioActiveBg {
+	box-shadow: 2px 4px 12px 0px rgba(0, 27, 63, 0.06);
+	height: 100%;
+	background-color: #fff;
+	transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+	border-radius: 2px;
+	width: 50%;
+	transform: translateX(0px);
+}

src/components/CommonComponents/RadioGroupOfButtonStyle/index.tsx

@@ -22,11 +22,26 @@ type IRadioGroupOfButtonStyleProps = {
 	handleRadio: any;
 	RadiosBoxStyle?: object;
 	radioStyle?: object;
+	radioActiveBgBoxStyle?: object;
 };
 
 const RadioGroupOfButtonStyle = (props: IRadioGroupOfButtonStyleProps) => {
-	const { radioOptions, value, handleRadio, RadiosBoxStyle, radioStyle } =
-		props;
+	const {
+		radioOptions,
+		value,
+		handleRadio,
+		RadiosBoxStyle,
+		radioStyle,
+		radioActiveBgBoxStyle,
+	} = props;
+
+	const radioWidth = useMemo(() => {
+		if (radioOptions.length) {
+			return Number((100 / radioOptions.length).toFixed(2));
+		} else {
+			return 100;
+		}
+	}, [radioOptions]);
 
 	const activeIndex: any = useMemo(() => {
 		let res = 0;
@@ -40,6 +55,16 @@ const RadioGroupOfButtonStyle = (props: IRadioGroupOfButtonStyleProps) => {
 
 	return (
 		<div className={style.RadiosBox} style={RadiosBoxStyle}>
+			<div className={style.radioActiveBgBox} style={radioActiveBgBoxStyle}>
+				<div
+					className={style.radioActiveBg}
+					style={{
+						width: `${radioWidth}%`,
+						transform: `translateX(${activeIndex * 100}%)`,
+					}}
+				></div>
+			</div>
+
 			{radioOptions.map((options, index) => {
 				return (
 					<>

src/components/mui/MyBorderlessSelect.tsx

+/*
+ * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
+ * @Date: 2021-12-04 15:46:25
+ * @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
+ * @LastEditTime: 2022-07-21 18:00:58
+ * @FilePath: /lionet-slb-pc/src/components/SearchView/components/Collapse.tsx
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
+import InputLabel from "@mui/material/InputLabel";
+import MenuItem from "@mui/material/MenuItem";
+import FormControl from "@mui/material/FormControl";
+import FormHelperText from "@mui/material/FormHelperText";
+import Select, { SelectChangeEvent, SelectProps } from "@mui/material/Select";
+import { createTheme, ThemeProvider } from "@mui/material";
+import selectActive from "@/assets/project/selectActive.svg";
+
+export interface IOption {
+	label: string;
+	value: string;
+	disabled?: boolean;
+}
+
+export const optionsTransform = (
+	arr: Array<any>,
+	labelKey: string = "label",
+	valueKey: string = "value",
+	disabledKey: string = "disabled"
+): Array<IOption> => {
+	return arr.map((item: any) => {
+		return {
+			label: item[labelKey],
+			value: item[valueKey],
+			disabled: item[disabledKey],
+		};
+	});
+};
+
+interface IProps
+	extends Omit<SelectProps, "value" | "options" | "onChange" | "title"> {
+	value?: string;
+	options: IOption[];
+	onChange?: (val: string) => void;
+	/** 类型变种 */
+	variant?: "standard" | "outlined" | "filled";
+	/** title */
+	title?: string;
+	/** 是否显示title */
+	isTitle?: boolean;
+	/** 是否显示提示文案 */
+	error?: boolean;
+	/** 提示文案 */
+	helpertext?: string;
+}
+export default function MyBorderlessSelect(props: IProps) {
+	const {
+		value,
+		options,
+		title,
+		isTitle = false,
+		variant = "outlined",
+		multiple = false,
+		onChange,
+		fullWidth,
+		error = false,
+		helpertext,
+		...other
+	} = props;
+
+	const theme = createTheme({
+		components: {
+			MuiInputBase: {
+				styleOverrides: {
+					root: {
+						height: "36px",
+						"& .Mui-disabled": {
+							background: "rgba(247, 248, 250, 1)",
+							cursor: "not-allowed",
+							"& .MuiOutlinedInput-notchedOutline": {
+								borderWidth: '0px'
+							},
+						},
+					},
+					input: {
+						fontSize: "14px",
+						"&.Mui-focused":{
+							color:"#1370FF",
+						},
+						"&.Mui-disabled": {
+							background: "rgba(247, 248, 250, 1)",
+							cursor: "not-allowed",
+						},
+						img: {
+							display: "none",
+						},
+					},
+				},
+			},
+			MuiList: {
+				styleOverrides: {
+					root: {
+						"& .MuiButtonBase-root": {
+							"&.Mui-selected": {
+								backgroundColor: "#fff",
+								color: "#1370FF",
+							},
+						},
+					},
+				},
+			},
+
+			MuiMenuItem: {
+				styleOverrides: {
+					root: {
+						paddingRight: "46px",
+						fontSize: "14px",
+						lineHeight: "24px",
+						":hover": {
+							backgroundColor: "#F0F2F5 ",
+							color: "#1E2633",
+						},
+					},
+				},
+			},
+
+			MuiOutlinedInput: {
+				styleOverrides: {
+					root: {
+						"&.Mui-focused .MuiOutlinedInput-notchedOutline": {
+							borderWidth: "0px",
+							color: '#1370FF'
+						},
+						"& .MuiOutlinedInput-notchedOutline": {
+							borderColor: "#DDE1E6",
+							borderWidth: "0px",
+						},
+						"&.Mui-disabled": {
+							background: "rgba(247, 248, 250, 1)",
+							cursor: "not-allowed",
+							"& .MuiOutlinedInput-notchedOutline": {
+								borderColor: "#DDE1E6",
+							},
+						},
+						":hover": {
+							"& .MuiOutlinedInput-notchedOutline": {
+								borderColor: "#1370ff",
+							},
+							"&.Mui-disabled": {
+								background: "rgba(247, 248, 250, 1)",
+								cursor: "not-allowed",
+								"& .MuiOutlinedInput-notchedOutline": {
+									borderColor: "#DDE1E6",
+								},
+							},
+						},
+					},
+				},
+			},
+
+			MuiInputLabel: {
+				styleOverrides: {
+					root: {
+						fontSize: "14px",
+						// 下拉框未选择时的label定位
+						top: "-9px",
+					},
+					shrink: {
+						// 下拉框已经选择时的label定位
+						top: 0,
+					},
+				},
+			},
+
+			MuiSelect: {
+				styleOverrides: {
+					select: {
+						padding: "6.5px 14px",
+						fontSize: "14px",
+					},
+				},
+			},
+
+			MuiPaper: {
+				styleOverrides: {
+					root: {
+						boxShadow: "0px 3px 10px 0px rgba(0,24,57,0.14)",
+					},
+				},
+			},
+		},
+	});
+
+	const handleChange = (e: SelectChangeEvent<unknown>) => {
+		onChange && onChange(e.target.value as string);
+	};
+
+	return (
+		<ThemeProvider theme={theme}>
+			<FormControl fullWidth={fullWidth} variant={variant} error={error}>
+				{isTitle ? (
+					<InputLabel id="demo-simple-select-label">
+						{title || "请选择"}
+					</InputLabel>
+				) : null}
+				<Select
+					labelId="demo-simple-select-label"
+					id="demo-simple-select"
+					label={title || ""}
+					size="small"
+					multiple={multiple}
+					{...other}
+					value={value || ""}
+					onChange={handleChange}
+				>
+					{options.length
+						? options?.map((item: IOption, index) => {
+							return (
+								<MenuItem
+									value={item.value}
+									disabled={item?.disabled}
+									key={index}
+								>
+									{item.label}
+									{value === item.value && (
+										<img
+											style={{
+												width: "16px",
+												height: "16px",
+												position: "absolute",
+												top: "10px",
+												right: "12px",
+											}}
+											src={selectActive}
+											alt=""
+										/>
+									)}
+								</MenuItem>
+							);
+						})
+						: null}
+				</Select>
+				{helpertext && error && <FormHelperText>{helpertext}</FormHelperText>}
+			</FormControl>
+		</ThemeProvider>
+	);
+}

src/components/mui/MyCheckBox.tsx

@@ -63,12 +63,13 @@ const theme = createTheme({
 		},
 		MuiCheckbox: {
 			styleOverrides: {
-				colorPrimary: {
-					color: "rgba(209, 214, 222, 1)",
+				root: {
+					"&.Mui-checked .MuiSvgIcon-root": {
+						color: "rgba(19, 110, 250, 1)",
+					},
 				},
 			},
 		},
-		// MuiCheckbox-colorPrimary
 	},
 });
 

src/components/mui/MyPopconfirm.tsx

@@ -71,7 +71,7 @@ const MyPopconfirm = (props: IMyPopconfirmProps) => {
 				bgcolor: "transparent",
 				minWidth: "200px",
 				fontSize: "14px",
-				padding: "20px 16px",
+				padding: "8px 0px",
 			}}
 		>
 			<Box
@@ -80,7 +80,7 @@ const MyPopconfirm = (props: IMyPopconfirmProps) => {
 					minWidth: "200px",
 					borderRadius: "4px",
 					fontSize: "14px",
-					padding: "20px 16px",
+					padding: "16px 20px",
 					boxShadow: "0px 3px 10px 0px rgba(0, 24, 57, 0.14)",
 				}}
 			>

src/components/mui/MyRadio.tsx

@@ -61,6 +61,15 @@ const theme = createTheme({
 				},
 			},
 		},
+		MuiRadio: {
+			styleOverrides: {
+				root: {
+					"&.Mui-checked span": {
+						color: "rgba(19, 110, 250, 1)",
+					},
+				},
+			},
+		},
 	},
 });
 

src/components/mui/MySelect.tsx

@@ -154,6 +154,7 @@ export default function MySelect(props: IProps) {
 			MuiInputLabel: {
 				styleOverrides: {
 					root: {
+						fontSize: "14px",
 						// 下拉框未选择时的label定位
 						top: "-9px",
 					},
@@ -180,6 +181,14 @@ export default function MySelect(props: IProps) {
 					},
 				},
 			},
+
+			// MuiFormControl: {
+			// 	styleOverrides: {
+			// 		root: {
+			// 			width: fullWidth ? "100%" : "auto",
+			// 		},
+			// 	},
+			// },
 		},
 	});
 

src/components/mui/MyTable/components/EnhancedTableHead.tsx

 /*
  * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
  * @Date: 2022-06-01 16:53:15
- * @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
- * @LastEditTime: 2022-07-25 12:04:49
+ * @LastEditors: 吴永生 15770852798@163.com
+ * @LastEditTime: 2022-09-06 16:30:56
  * @FilePath: /bkunyun/src/components/Material.Ui/Table/EnhancedTableHead.jsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -54,7 +54,7 @@ const EnhancedTableHead = (props: any) => {
                         classes={{ head: (k && headTableCell) || classes.headTableCell }}
                     >
                         {
-                            headCell.sort && <TableSortLabel active={orderBy === headCell.id} direction={order} onClick={createSortHandler(headCell.id)} >
+                            headCell.sort && <TableSortLabel style={{fontSize: "16px", fontWeight: '400', color: 'rgba(0, 0, 0, 0.87)', fontFamily: 'Roboto,Helvetica,Tahoma,Arial,"PingFang SC","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"'}} active={orderBy === headCell.id} direction={order} onClick={createSortHandler(headCell.id)} >
                                 {headCell.label}
                             </TableSortLabel>
                         }

src/hooks/useMyRequest.ts

@@ -21,7 +21,7 @@ const useMyRequest = <TData, TParams>(
     defaultParams?: TParams[];
     onBefore?: (params: TParams[]) => void;
     onSuccess?: (data: TData, params: TParams[]) => void;
-    onError?: (e: Error, params: TParams[]) => void;
+    onError?: (e: any, params: TParams[]) => void;
     onFinally?: (params: TParams[], data?: TData, e?: Error) => void;
     loadingDelay?: number;
     pollingInterval?: number;
@@ -51,9 +51,16 @@ const useMyRequest = <TData, TParams>(
 
   const request = useRequest(api, {
     ...defaultOptions,
-    onSuccess: () => {},
-    onError: (data) => {
+    onSuccess: () => { },
+    onError: (data: any) => {
       Message.error(data.message);
+      if (data.errorCode === '100003') {
+        setTimeout(() => {
+          localStorage.removeItem('token_key');
+          if (window.location.href && !window.location.href.includes("/login-page"))
+            window.location.href = '/v2/pages/login-page'
+        }, 4000);
+      }
     },
     ...options,
   });

src/views/ConsoleLayout/index.tsx

-import React, { useEffect, useState } from "react";
+import React, { useEffect } from "react";
 import { Outlet, useLocation, useNavigate } from "react-router-dom";
 import { observer } from "mobx-react-lite";
 import Avatar from "@mui/material/Avatar";
@@ -67,6 +67,15 @@ const ConsoleLayout = observer(() => {
 	const location = useLocation();
 	const { permissionStore, menuStore } = useStores();
 
+	// 不在产品页面下的时候清空当前产品
+	useEffect(() => {
+		if (location.pathname.slice(0, 8) !== "/product") {
+			currentProjectStore.setProjectList([]);
+			currentProjectStore.changeProject({});
+			currentProjectStore.changeProductInfo({});
+		}
+	}, [location, currentProjectStore]);
+
 	useEffect(() => {
 		permissionStore.setSidebarRouters(location.pathname);
 	}, [location, permissionStore]);
@@ -76,12 +85,6 @@ const ConsoleLayout = observer(() => {
 			<Box className={style.topApp}>
 				<Box className={style.topLeftBox}>
 					<img src={logo} alt="" className={style.logo} />
-					{/* <MyButton
-						text={globalText.console}
-						variant={"text"}
-						style={{ color: "#565C66" }}
-						onClick={() => navigate("/home")}
-					/> */}
 					<div className={style.menuBox} onClick={() => navigate("/home")}>
 						<div className={style.menuTitle}>{globalText.console}</div>
 					</div>

src/views/MenuLayout/index.tsx

@@ -9,7 +9,7 @@
 import { Box, List } from "@mui/material";
 import CurrentProject from "../Project/components/CurrentProject";
 import React from "react";
-import { Outlet, useNavigate } from "react-router-dom";
+import { Outlet, useNavigate, useLocation } from "react-router-dom";
 import style from "./index.module.css";
 import { observer } from "mobx-react-lite";
 import { useStores } from "@/store/index";
@@ -23,9 +23,10 @@ const MenuLayout = observer(() => {
 	const navigate = useNavigate();
 
 	const productInfo = toJS(currentProjectStore.currentProductInfo);
+	const location = useLocation();
 
-	// 未选择产品时 直接跳转home页面
-	if (!productInfo.name) {
+	// 在产品页面下且未选择产品时 直接跳转home页面
+	if (!productInfo.name && location.pathname.slice(0, 8) === "/product") {
 		navigate("/home");
 	}
 

src/views/Project/ProjectData/SeeDataset/index.tsx

@@ -206,7 +206,7 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
 										},
 									]}
 									RadiosBoxStyle={{ width: "132px" }}
-								></RadioGroupOfButtonStyle>
+								/>
 							)}
 							<MyMultipleMenu
 								value={showData}

src/views/Project/ProjectData/index.tsx

@@ -572,7 +572,7 @@ const ProjectData = observer(() => {
 										{ value: "dataset", label: "数据集" },
 									]}
 									handleRadio={setActiveTab}
-								></RadioGroupOfButtonStyle>
+								/>
 								<IconButton
 									aria-label="refreshIcon"
 									size="small"

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

@@ -20,36 +20,71 @@
 }
 
 .logViewTop {
-	/* height: 30px; */
+	position: relative;
 	width: 100vw;
 	background-color: #1d2126;
-	/* border-radius: 8px 8px 0 0; */
 	display: flex;
 	font-size: 12px;
 	color: #8a9099;
-	/* overflow: overlay; */
+	overflow: hidden;
 }
 
-.logViewTop::-webkit-scrollbar-track {
-	background-color: #282c34;
+.leftButton {
+	width: 48px;
+	height: 32px;
+	flex-shrink: 0;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	cursor: pointer;
+	border-right: 1px solid #10141A;
+	background-color: #1d2126;
+}
+
+.rightButton {
+	width: 48px;
+	height: 32px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	cursor: pointer;
+	border-left: 1px solid #10141A;
+	background-color: #1d2126;
+}
+
+.middleFixed {
+	width: calc(100vw - 98px);
+	position: relative;
+	overflow: hidden;
+}
+
+.middleDynamic{
+	display: flex;
+	position: absolute;
+	left: 0;
 }
 
 .logTitle {
 	display: flex;
-	width: 0;
-	max-width: 200px;
 	overflow: hidden;
 	white-space: nowrap;
-	text-overflow:ellipsis;
-	flex: 1;
+	text-overflow: ellipsis;
+	flex-shrink: 0;
 	align-items: center;
-	height: 30px;
+	height: 32px;
 	line-height: 20px;
-	padding: 0 24px;
+	padding: 0 20px;
 	cursor: pointer;
 	border-right: 1px solid #10141A;
 }
 
+.logName {
+	max-width: 90px;
+	overflow: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+}
+
 .logTitleSelected {
 	background: #282c34;
 	color: #ffffff;
@@ -78,7 +113,7 @@
 	width: calc(100vw - 64px);
 	background-color: #282c34;
 	position: absolute;
-	top: 30px;
+	top: 32px;
 	left: 32px;
 	z-index: 1005;
 }

src/views/Project/ProjectJobDetail/LogView/index.tsx

@@ -8,17 +8,17 @@ import CloudEController from "@/api/fileserver/CloudEController";
 import { useStores } from "@/store";
 import { toJS } from "mobx";
 import FullScreenDrawer from "@/components/CommonComponents/FullScreenDrawer";
+import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';
+import ChevronRightIcon from '@mui/icons-material/ChevronRight';
 
 
 type LogViewProps = {
-    isshow: boolean;
-    handleClose: () => void;
     logs: any[];
-    setShowAddTemplate: any;
+    setShowLogView: any;
 };
 
 const LogView = (props: LogViewProps) => {
-    const { isshow, handleClose, logs, setShowAddTemplate } = props;
+    const { logs, setShowLogView } = props;
     const { currentProjectStore } = useStores();
     const fileToken = toJS(currentProjectStore.currentProjectInfo.filetoken);
     const projectId = toJS(currentProjectStore.currentProjectInfo.id);
@@ -65,10 +65,13 @@ const LogView = (props: LogViewProps) => {
     }
 
     return (
-        <FullScreenDrawer handleClose={setShowAddTemplate} zIndex={1002}>
+        <FullScreenDrawer handleClose={setShowLogView} zIndex={1002}>
             <div className={style.logViewBox}>
                 <div className={style.logViewContentMask}></div>
                 <div className={style.logViewTop}>
+                    <div className={style.leftButton}><ChevronLeftIcon /></div>
+                    <div className={style.middleFixed}>
+                        <div className={style.middleDynamic}>
                             {logs.map((item: any, index: number) => {
                                 return <div
                                     key={index}
@@ -78,10 +81,13 @@ const LogView = (props: LogViewProps) => {
                                         [style.logTitleSelected]: index === logCurrent,
                                     })}>
                                     <InsertDriveFileOutlinedIcon className={style.fileIcon} />
-                            <span>{item.logName}</span>
+                                    <span className={style.logName}>{item.logName}</span>
                                 </div>
                             })}
                         </div>
+                    </div>
+                    <div className={style.rightButton}><ChevronRightIcon /></div>
+                </div>
                 <div className={style.logViewContent}>
                     {logText}
                 </div>

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

@@ -28,9 +28,20 @@
 .goBackIcon {
 	cursor: pointer;
 }
+.goBackIconBox {
+	width: 32px;
+	height: 32px;
+	border-radius: 4px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+.goBackIconBox:hover {
+	background-color: rgb(240, 242, 245);
+}
 .swTemplateTitle {
-	margin: 0 19px 0 8px;
-	line-height: 22px;
+	margin: 0 19px 0 3px;
+	line-height: 20px;
 	font-size: 14px;
 	color: rgba(30, 38, 51, 1);
 	font-weight: 700;
@@ -112,12 +123,7 @@
 	line-height: 22px;
 	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);
@@ -130,6 +136,7 @@
 	word-break: break-all;
 	flex: 1;
 	justify-content: flex-end;
+	word-wrap: break-word;
 }
 .taskInfoValueClick {
 	cursor: pointer;
@@ -202,6 +209,7 @@
 	right: 24px;
 	bottom: 24px;
 	padding: 8px;
+	box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.06);
 }
 .fullScreenBox:hover {
 	opacity: 0.6;

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-05 17:33:58
+ * @LastEditTime: 2022-09-06 10:54:40
  * @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/index.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -47,6 +47,7 @@ import {
 	getDatasetPath,
 	getSameBatch,
 } from "./utils";
+import MyTooltip from "@/components/mui/MyTooltip";
 
 import styles from "./index.module.css";
 
@@ -75,11 +76,11 @@ const ProjectSubmitWork = observer(() => {
 	const productId = toJS(currentProjectStore.currentProductInfo.id);
 	const [workFlowJobInfo, setWorkFlowJobInfo] = useState<ITaskInfo>();
 	const [patchInfo, setPatchInfo] = useState<any>();
+	const [overviewInfo, setOverviewInfo] = useState<any>();
+
 	const [overviewActive, setOverviewActive] = useState(true);
 	/** 选中的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;
@@ -241,7 +242,7 @@ const ProjectSubmitWork = observer(() => {
 				state: { type: "workbenchList" },
 			});
 		}
-	}, [navigate]);
+	}, [navigate, locationInfo.from]);
 
 	const getOutouts = (outputs: any) => {
 		if (outputs) {
@@ -308,7 +309,8 @@ const ProjectSubmitWork = observer(() => {
 			if (Array.isArray(res.data)) {
 				res.data.forEach((item1) => {
 					if (item1.name === item.path.slice(item.path.lastIndexOf("/") + 1)) {
-						randerOutputs[index].size = `${item1.size ? storageUnitFromB(Number(item1.size)) : "-"
+						randerOutputs[index].size = `${
+							item1.size ? storageUnitFromB(Number(item1.size)) : "-"
 						}`;
 						setRanderOutputs([...randerOutputs]);
 					}
@@ -346,7 +348,7 @@ const ProjectSubmitWork = observer(() => {
 				if (item.id === id) {
 					getworkFlowTaskInfoRun({
 						jobId: workFlowJobInfo?.id as string,
-						taskId: item.parentNode || item.id
+						taskId: item.parentNode || item.id,
 					});
 				}
 			});
@@ -355,32 +357,26 @@ const ProjectSubmitWork = observer(() => {
 	const selectedParameter = useCallback(
 		(list: any) => {
 			let result: any = [];
-			if(patchInfo?.id === activeFlowIndex ) {
-				setSelectNodeTitle(list[0].title || '')
-				result = list[0].parameters
-			} else {
 			list?.length &&
 				list?.forEach((item: any) => {
 					if (item.id === activeFlowIndex) {
-					console.log(1111)
-						setSelectNodeTitle(item?.title || '')
+						setOverviewInfo(item);
 						result = item.parameters;
 					}
 				});
-			}
 			return result;
 		},
-		[activeFlowIndex, patchInfo]
+		[activeFlowIndex]
 	);
 
 	const randerParameters = useMemo(() => {
-		if (patchInfo?.children?.length) {
-			return selectedParameter(patchInfo?.children);
+		if (patchInfo?.id === activeFlowIndex) {
+			setOverviewInfo(patchInfo);
+			return patchInfo?.parameters;
 		} else {
-			return selectedParameter(patchInfo?.parameters);
+			return selectedParameter(patchInfo?.children);
 		}
-
-	}, [patchInfo, selectedParameter]);
+	}, [activeFlowIndex, patchInfo, selectedParameter]);
 
 	const handleParams = () => {
 		setOverviewActive(false);
@@ -412,12 +408,20 @@ const ProjectSubmitWork = observer(() => {
 	const [popperTitle, setPopperTitle] = useState(
 		"正在运行的任务终止后将无法重新运行，确认继续吗？"
 	);
+	const [placement, setPlacement] = useState<"bottom" | "bottom-start">(
+		"bottom"
+	);
 	const [anchorEl, setAnchorEl] = useState<any>(null);
 	const handleCancel = () => {
 		setAnchorEl(null);
 	};
 
-	const handleShowPopper = (e: any, title: string) => {
+	const handleShowPopper = (
+		e: any,
+		title: string,
+		placementParams: "bottom" | "bottom-start"
+	) => {
+		setPlacement(placementParams);
 		setPopperTitle(title);
 		setAnchorEl(e.currentTarget);
 	};
@@ -441,13 +445,14 @@ const ProjectSubmitWork = observer(() => {
 			{fullScreenShow ? null : (
 				<div className={styles.swHeader}>
 					<div className={styles.swHeaderLeft}>
+						<div className={styles.goBackIconBox}>
 							<img
 								onClick={onBack}
 								className={styles.goBackIcon}
 								src={goback}
 								alt=""
 							/>
-
+						</div>
 						<div className={styles.swTemplateTitle}>{name}</div>
 					</div>
 					{returnPermission && (
@@ -465,7 +470,8 @@ const ProjectSubmitWork = observer(() => {
 										e,
 										["SUBMITTED", "RUNNING"].includes(state || "")
 											? "正在运行的任务终止后将无法重新运行，确认继续吗？"
-											: "任务被删除后将无法恢复，确认继续吗？"
+											: "任务被删除后将无法恢复，确认继续吗？",
+										"bottom-start"
 									)
 								}
 							></MyButton>
@@ -489,7 +495,6 @@ const ProjectSubmitWork = observer(() => {
 															className={styles.outputLiLeft}
 															onClick={(e: any) => {
 																handleDownLoadOutput(item);
-																// goToProjectData(getFolderPath(item.path));
 															}}
 														>
 															<img
@@ -503,7 +508,6 @@ const ProjectSubmitWork = observer(() => {
 																{item.name}
 															</span>
 														</div>
-														{/* </MyPopconfirm> */}
 														<span className={styles.outputLiRight}>
 															{item.size}
 														</span>
@@ -542,7 +546,8 @@ const ProjectSubmitWork = observer(() => {
 										onClick={(e: any) => {
 											handleShowPopper(
 												e,
-												"即将跳转至项目数据内该任务的输出路径，确认继续吗？"
+												"即将跳转至项目数据内该任务的输出路径，确认继续吗？",
+												"bottom"
 											);
 											setGoToProjectDataPath(
 												workFlowJobInfo?.outputPath as string
@@ -648,7 +653,9 @@ const ProjectSubmitWork = observer(() => {
 						)}
 						{activeFlowIndex && (
 							<div className={styles.suanziInfo}>
-								<div className={styles.title}>{patchInfo?.title}</div>
+								<MyTooltip>
+									<div className={styles.title}>{overviewInfo?.title}</div>
+								</MyTooltip>
 								<div className={styles.tabs}>
 									<div
 										className={classNames({
@@ -667,7 +674,7 @@ const ProjectSubmitWork = observer(() => {
 										// onClick={() => setOverviewActive(false)}
 										onClick={() => handleParams()}
 									>
-										{selectNodeTitle}
+										参数
 									</div>
 								</div>
 								{overviewActive && (
@@ -680,40 +687,40 @@ const ProjectSubmitWork = observer(() => {
 													[styles.taskInfoValueShowAll]: true,
 												})}
 											>
-												{patchInfo?.description}
+												{overviewInfo?.description}
 											</div>
 										</div>
 										<div className={styles.taskInfoLi}>
 											<div className={styles.taskInfoParams}>算子版本</div>
 											<div className={styles.taskInfoValue}>
-												{patchInfo?.version || "-"}
+												{overviewInfo?.version || "-"}
 											</div>
 										</div>
 										<div className={styles.taskInfoLi}>
 											<div className={styles.taskInfoParams}>算子状态</div>
 											<div className={styles.taskInfoValue}>
-												{patchInfo?.status === "Done" && (
+												{overviewInfo?.status === "Done" && (
 													<img
 														className={styles.taskInfoValueIcon}
 														src={jobSue}
 														alt=""
 													/>
 												)}
-												{patchInfo?.status === "Running" && (
+												{overviewInfo?.status === "Running" && (
 													<img
 														className={styles.taskInfoValueIcon}
 														src={jobRun}
 														alt=""
 													/>
 												)}
-												{patchInfo?.status === "Failed" && (
+												{overviewInfo?.status === "Failed" && (
 													<img
 														className={styles.taskInfoValueIcon}
 														src={jobFail}
 														alt=""
 													/>
 												)}
-												{statusMap[patchInfo?.status as IStatus]}
+												{statusMap[overviewInfo?.status as IStatus]}
 											</div>
 										</div>
 									</div>
@@ -760,6 +767,7 @@ const ProjectSubmitWork = observer(() => {
 				anchorEl={anchorEl}
 				onCancel={handleCancel}
 				onConfirm={handleConfirm}
+				placement={placement}
 			/>
 			{showSeeDataset && (
 				<SeeDataset
@@ -770,7 +778,12 @@ const ProjectSubmitWork = observer(() => {
 					projectId={projectId as string}
 				></SeeDataset>
 			)}
-			{showLogView && <LogView isshow={showLogView} handleClose={handleClose} logs={logs} setShowAddTemplate={handleClose} />}
+			{showLogView && (
+				<LogView
+					logs={logs}
+					setShowLogView={handleClose}
+				/>
+			)}
 		</div>
 	);
 });

src/views/Project/ProjectOverview/TaskCard/index.module.css

@@ -127,7 +127,9 @@
 	align-items: center;
 	color: #1e2633;
 	cursor: pointer;
-	height: 30px;
+	height: 31px;
+	display: flex;
+	align-items: center;
 	overflow: hidden;
 	white-space: nowrap;
 	text-overflow: ellipsis;

src/views/Project/ProjectOverview/index.tsx

@@ -29,15 +29,15 @@ const ProjectOverview = observer(() => {
 	// 选择近7天or近15天or近30天
 	const [day, setDay] = useState("7");
 	// 滚轮是否到顶,判断是否显示阴影
-	const [isTop, setIsTop] = useState(true)
+	const [isTop, setIsTop] = useState(true);
 	// 滚动滚轮时监听是否到顶
 	const onscroll = (e: any) => {
 		if (e.target.scrollTop <= 0) {
-			setIsTop(true)
+			setIsTop(true);
 		} else {
-			setIsTop(false)
-		}
+			setIsTop(false);
 		}
+	};
 	// 获取概览基本信息
 	const { run: getOverview, loading } = useMyRequest(getOverviewInfo, {
 		onSuccess: (result: any) => {
@@ -207,7 +207,7 @@ const ProjectOverview = observer(() => {
 										{ value: "30", label: "近30天" },
 									]}
 									handleRadio={setDay}
-								></RadioGroupOfButtonStyle>
+								/>
 							</div>
 							<SearchInput
 								onKeyUp={handleKeyWordChangeKeyUp}

src/views/Project/ProjectSetting/ProjectMembers/components/AddMember.tsx

@@ -16,7 +16,7 @@ import Dialog from "@/components/mui/MyDialog";
 import useMyRequest from "@/hooks/useMyRequest";
 import { useStores } from "@/store";
 import { useMessage } from "@/components/MySnackbar";
-import MySelect, { IOption } from "@/components/mui/MySelect";
+import MyBorderlessSelect, { IOption } from "@/components/mui/MyBorderlessSelect";
 import MyTable from "@/components/mui/MyTable";
 import SearchInput from "@/components/BusinessComponents/SearchInput";
 import {
@@ -67,8 +67,7 @@ const AddMember = observer((props: IProps) => {
 						(every) => every.value === item
 					);
 					return (
-						<MySelect
-							input={<OutlinedInput />}
+							<MyBorderlessSelect
 								value={defaultValue?.length ? defaultValue[0]?.value : "VIEWER"}
 								onChange={(val) => changePermission(val, index)}
 								options={selectOptions}

src/views/Project/ProjectSetting/index.tsx

@@ -39,7 +39,9 @@ const ProjectSetting = observer(() => {
 	if (currentProjectStore.currentProjectInfo.name) {
 		return (
 			<div style={{ padding: "28px 24px 24px" }}>
-				<div style={{ display: "flex", alignItems: "center" }}>
+				<div
+					style={{ display: "flex", alignItems: "center", marginBottom: "3px" }}
+				>
 					<span
 						style={{
 							fontSize: "18px",

src/views/Project/ProjectSubmitWork/ConfigForm/index.module.css

@@ -2,7 +2,7 @@
 	position: relative;
 }
 .templateDescBox {
-	margin-bottom: 40px;
+	margin-bottom: 24px;
 }
 .templateDescTitle {
 	font-size: 16px;
@@ -81,11 +81,10 @@
 }
 
 .taskConfigBox {
-	padding: 16px 0px 4px;
 }
 .flowTitle {
 	line-height: 16px;
-	margin: 3px 0 27px;
+	margin: 3px 0 25px;
 	color: rgba(19, 112, 255, 1);
 	font-size: 14px;
 	font-weight: 600;
@@ -119,11 +118,11 @@
 	margin-left: 16px;
 }
 .bacthConfigBox {
-	padding: 0 24px 0;
+	padding: 16px 24px 4px;
 }
 .flowConfigBox {
 	border-bottom: 1px solid rgba(235, 237, 240, 1);
-	padding: 20px 24px 12px;
+	padding: 24px 24px 12px;
 }
 .flowConfigBox:nth-last-child(1) {
 	border-bottom: none;

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

@@ -492,12 +492,16 @@ const ConfigForm = (props: ConfigFormProps) => {
 							/>
 						</div>
 						<div className={styles.taskConfigBox}>
+							{task.parameters.filter(
+								(parameter) => !parameter?.thrown && !parameter.hidden
+							).length !== 0 && (
 								<div className={styles.bacthConfigBox}>
 									{randerParameters(
 										task.parameters.filter((parameter) => !parameter?.thrown),
 										task.id
 									)}
 								</div>
+							)}
 							{task.flows.map((flow) => {
 								if (
 									flow.parameters.filter(

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

@@ -25,9 +25,23 @@
 	justify-content: flex-start;
 	align-items: center;
 }
+.goBackIcon {
+	cursor: pointer;
+}
+.goBackIconBox {
+	width: 32px;
+	height: 32px;
+	border-radius: 4px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+.goBackIconBox:hover {
+	background-color: rgb(240, 242, 245);
+}
 .swTemplateTitle {
-	margin: 0 19px 0 8px;
-	line-height: 22px;
+	margin: 0 19px 0 3px;
+	line-height: 20px;
 	font-size: 14px;
 	color: rgba(30, 38, 51, 1);
 	font-weight: 700;
@@ -51,11 +65,11 @@
 }
 .swFormBox {
 	background-color: #fff;
-	border-right: 1xp solid rgba(235, 237, 240, 1);
+	border-right: 1px solid rgba(235, 237, 240, 1);
 	width: 608px;
 	overflow-y: overlay;
 	box-sizing: border-box;
-	padding: 36px;
+	padding: 32px 32px 16px;
 }
 .swFlowBox {
 	flex: 1;
@@ -70,6 +84,7 @@
 	right: 24px;
 	bottom: 24px;
 	padding: 8px;
+	box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.06);
 }
 .fullScreenBox:hover {
 	opacity: 0.6;

src/views/Project/ProjectSubmitWork/index.tsx

@@ -8,8 +8,6 @@
  */
 import { toJS } from "mobx";
 import React, { useEffect, useState } from "react";
-import ArrowBackIosNewIcon from "@mui/icons-material/ArrowBackIosNew";
-import IconButton from "@mui/material/IconButton";
 import _ from "lodash";
 import { useLocation, useNavigate } from "react-router-dom";
 import moment from "moment";
@@ -232,12 +230,20 @@ const ProjectSubmitWork = observer(() => {
 	const [popperTitle, setPopperTitle] = useState(
 		"提交前请先确认参数填写无误，确认提交吗？"
 	);
+	const [placement, setPlacement] = useState<
+		"bottom" | "bottom-start" | "bottom-end"
+	>("bottom");
 	const [anchorEl, setAnchorEl] = useState<any>(null);
 	const handleCancel = () => {
 		setAnchorEl(null);
 	};
 
-	const handleShowPopper = (e: any, title: string) => {
+	const handleShowPopper = (
+		e: any,
+		title: string,
+		placementParams: "bottom" | "bottom-start" | "bottom-end"
+	) => {
+		setPlacement(placementParams);
 		setPopperTitle(title);
 		setAnchorEl(anchorEl ? null : e.currentTarget);
 	};
@@ -255,14 +261,20 @@ const ProjectSubmitWork = observer(() => {
 			{fullScreenShow ? null : (
 				<div className={styles.swHeader}>
 					<div className={styles.swHeaderLeft}>
+						<div className={styles.goBackIconBox}>
 							<img
 								className={styles.goBackIcon}
 								src={goback}
 								alt=""
 								onClick={(e: any) =>
-								handleShowPopper(e, "返回将放弃当前页面所有操作，确认返回吗？")
+									handleShowPopper(
+										e,
+										"返回将放弃当前页面所有操作，确认返回吗？",
+										"bottom-end"
+									)
 								}
 							/>
+						</div>
 						<div className={styles.swTemplateTitle}>
 							{templateConfigInfo?.title}
 						</div>
@@ -288,7 +300,11 @@ const ProjectSubmitWork = observer(() => {
 						<MyButton
 							text="提交任务"
 							onClick={(e: any) =>
-								handleShowPopper(e, "提交前请先确认参数填写无误，确认提交吗？")
+								handleShowPopper(
+									e,
+									"提交前请先确认参数填写无误，确认提交吗？",
+									"bottom-start"
+								)
 							}
 						></MyButton>
 					</div>
@@ -328,6 +344,7 @@ const ProjectSubmitWork = observer(() => {
 				onCancel={handleCancel}
 				onConfirm={handleConfirm}
 				loading={loading}
+				placement={placement}
 			/>
 		</div>
 	);

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

@@ -2,7 +2,7 @@
  * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
  * @Date: 2022-05-31 10:18:13
  * @LastEditors: 吴永生 15770852798@163.com
- * @LastEditTime: 2022-09-02 14:45:04
+ * @LastEditTime: 2022-09-06 10:17:18
  * @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -41,6 +41,7 @@ import MyProgress from "@/components/mui/MyProgress";
 import SearchInput from "@/components/BusinessComponents/SearchInput";
 import MyCircularProgress from "@/components/mui/MyCircularProgress";
 import moment from "moment";
+import MyTooltip from "@/components/mui/MyTooltip";
 
 import styles from "./index.module.css";
 
@@ -201,6 +202,7 @@ const ProjectMembers = observer(() => {
 	};
 
 	useEffect(() => {
+		setLoading(true);
 		setTimeout(() => {
 			getWorkflowJobInfo({
 				projectId: currentProjectStore.currentProjectInfo.id as string,
@@ -296,15 +298,21 @@ const ProjectMembers = observer(() => {
 	const handleKeyWordChangeKeyUp = (e: any) => {
 		if (e.keyCode === 13) {
 			setJobName(e.target.value);
-			setLoading(true);
 		}
 	};
 
+	const handleKeyWordChangeBlur = (e: any) => {
+		setJobName(e.target.value);
+	};
+
 	return (
 		<Box className={styles.headerBox}>
 			<Box className={styles.tabHeader}>
 				<Box sx={{ display: "flex" }}>
-					<SearchInput onKeyUp={handleKeyWordChangeKeyUp} sx={{ width: 340 }} />
+					<SearchInput
+						onKeyUp={handleKeyWordChangeKeyUp}
+						onBlur={handleKeyWordChangeBlur}
+						sx={{ width: 340 }} />
 					{/* <Box className={styles.tabHeaderSelect}>
                         <TextField
                             select
@@ -374,7 +382,7 @@ const ProjectMembers = observer(() => {
 
 			<Box className={styles.body} style={{ position: "relative" }}>
 				<MyCircularProgress loading={loading}>
-					{jobList.length === 0 && !loading && (
+					{jobList.length === 0 && (
 						<Box
 							sx={{
 								display: "flex",
@@ -400,7 +408,9 @@ const ProjectMembers = observer(() => {
 									onClick={() => rowClick(item.id)}
 								>
 									<Box className={styles.tabBoxInfo}>
+										<MyTooltip title={item.name}>
 											<div className={styles.tabBoxTitle}>{item.name}</div>
+										</MyTooltip>
 										<Box className={styles.tabBoxDescInfo}>
 											<div
 												className={styles.tabBoxDesc}
@@ -498,11 +508,7 @@ const ProjectMembers = observer(() => {
 				</MyCircularProgress>
 			</Box>
 			<div className={styles.pagination}>
-				<MyPagination
-					page={page}
-					pageChange={handleChangePage}
-					count={count || jobList.length}
-				/>
+				<MyPagination page={page} pageChange={handleChangePage} count={count} />
 			</div>
 
 			{/* <TablePagination

src/views/Project/ProjectWorkbench/workbenchTemplate/components/AddTemplate/index.tsx

@@ -53,16 +53,16 @@ const AddTemplate = (props: IAddTemplateProps) => {
 	const [templateType, setTemplateType] = useState("public");
 
 	// 滚轮是否到顶,判断是否显示阴影
-	const [isTop, setIsTop] = useState(true)
+	const [isTop, setIsTop] = useState(true);
 
 	// 滚动滚轮时监听是否到顶
 	const onscroll = (e: any) => {
 		if (e.target.scrollTop <= 0) {
-			setIsTop(true)
+			setIsTop(true);
 		} else {
-			setIsTop(false)
-		}
+			setIsTop(false);
 		}
+	};
 
 	const handleRadio = (value: string) => {
 		setTemplateType(value);
@@ -144,8 +144,11 @@ const AddTemplate = (props: IAddTemplateProps) => {
 	};
 
 	// 获取模板列表
-	const getAddTemplateListFun = useCallback((newTitle?: string) => {
-		const userName = JSON.parse(localStorage.getItem("userInfo") || "{}")?.name;
+	const getAddTemplateListFun = useCallback(
+		(newTitle?: string) => {
+			const userName = JSON.parse(
+				localStorage.getItem("userInfo") || "{}"
+			)?.name;
 			setSelectTemplateData([]);
 			setAddTemplateList([]);
 			if (templateType === "public") {
@@ -163,20 +166,22 @@ const AddTemplate = (props: IAddTemplateProps) => {
 					keyword: newTitle,
 				});
 			}
-	}, [
+		},
+		[
 			setSelectTemplateData,
 			getAddTemplateList,
 			productId,
 			projectId,
 			templateType,
 			// title,
-	]);
+		]
+	);
 
 	//模板启用切换
 	const templateSwitch = (e: any, id: string) => {
 		if (e.target.checked) {
-			let arr = []
-			arr.push(id)
+			let arr = [];
+			arr.push(id);
 			addTemplate({
 				projectId: projectId as string,
 				workflowSpecIds: arr,
@@ -187,7 +192,7 @@ const AddTemplate = (props: IAddTemplateProps) => {
 				workflowSpecId: id,
 			});
 		}
-	}
+	};
 
 	useEffect(() => {
 		getAddTemplateListFun();
@@ -255,7 +260,7 @@ const AddTemplate = (props: IAddTemplateProps) => {
 								value={templateType}
 								radioOptions={radioOptions}
 								handleRadio={handleRadio}
-							></RadioGroupOfButtonStyle>
+							/>
 							{/* <MyButton
 							onClick={handleAddTemplate}
 							size={"small"}
@@ -272,7 +277,7 @@ const AddTemplate = (props: IAddTemplateProps) => {
 						</Box>
 					</Box>
 				</div>
-				<div className={style.templateBox} onScroll={onscroll} >
+				<div className={style.templateBox} onScroll={onscroll}>
 					{templateType === "public" && addTemplateList.length === 0 && (
 						<Box
 							sx={{
@@ -342,9 +347,7 @@ const AddTemplate = (props: IAddTemplateProps) => {
 									<div className={style.templateLiEditBox}>
 										<MySwitch
 											defaultChecked={item.favorited}
-											onChange={(e: any) =>
-												templateSwitch(e, item.id)
-											}
+											onChange={(e: any) => templateSwitch(e, item.id)}
 										></MySwitch>
 									</div>
 

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

@@ -2,7 +2,7 @@
  * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
  * @Date: 2022-07-12 11:20:29
  * @LastEditors: 吴永生 15770852798@163.com
- * @LastEditTime: 2022-08-31 17:09:26
+ * @LastEditTime: 2022-09-07 10:06:13
  * @FilePath: /bkunyun/src/views/Project/components/Flow/components/BatchNode.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -63,7 +63,7 @@ const BatchNode = (props: IBatchNode) => {
 			{inParamsArr?.length
 				? inParamsArr.map((item, index) => {
 						return (
-							<MyTooltip title={item.name} key={uuid()}>
+							<MyTooltip title={item.title} key={uuid()}>
 								<Handle
 									className={styles.handleBox}
 									id={item.name}
@@ -95,7 +95,7 @@ const BatchNode = (props: IBatchNode) => {
 			{outParamsArr?.length
 				? outParamsArr.map((item, index) => {
 						return (
-							<MyTooltip title={item.name} key={uuid()}>
+							<MyTooltip title={item.title} key={uuid()}>
 								<Handle
 									className={styles.handleBox}
 									id={item.name}

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

@@ -2,7 +2,7 @@
  * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
  * @Date: 2022-07-12 11:29:46
  * @LastEditors: 吴永生 15770852798@163.com
- * @LastEditTime: 2022-09-02 14:23:07
+ * @LastEditTime: 2022-09-07 10:44:23
  * @FilePath: /bkunyun/src/views/Project/components/Flow/components/FlowNode/index.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -81,7 +81,7 @@ const FlowNode = (props: any) => {
 			{inParamsArr?.length
 				? inParamsArr.map((item: any, index: number) => {
 						return (
-							<MyTooltip title={item.name} key={uuid()}>
+							<MyTooltip title={item.title} key={uuid()}>
 								<Handle
 									className={styles.handleBox}
 									id={item.name}
@@ -117,7 +117,7 @@ const FlowNode = (props: any) => {
 			{outParamsArr?.length
 				? outParamsArr.map((item: any, index: number) => {
 						return (
-							<MyTooltip title={item.name} key={uuid()}>
+							<MyTooltip title={item.title} key={uuid()}>
 								<Handle
 									className={styles.handleBox}
 									id={item.name}

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

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

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

@@ -12,6 +12,8 @@
 	display: flex;
 	flex-direction: column;
 	border-left: 1px solid #dde1e6;
+	animation: myfirst 0.3s;
+	-webkit-animation: myfirst 0.3s; /* Safari and Chrome */
 }
 
 .searchBox {
@@ -119,3 +121,21 @@
 	line-height: 20px;
 	font-size: 12px;
 }
+
+@keyframes myfirst {
+	from {
+		width: 0;
+	}
+	to {
+		width: 260px;
+	}
+}
+
+@-webkit-keyframes myfirst /* Safari and Chrome */ {
+	from {
+		width: 0;
+	}
+	to {
+		width: 260px;
+	}
+}

src/views/WorkFlowEdit/components/OperatorList/index.module.css

@@ -4,12 +4,18 @@
 	cursor: grab;
 	padding: 16px 16px 0 24px;
 	background-color: #fff;
+	transition: width 0.2s;
+	-webkit-transition: width 0.2s; /* Safari */
 }
 .operatorItemBox:hover {
 	box-shadow: 0px 5px 16px 0px rgba(0, 24, 57, 0.1);
 	position: relative;
 	top: -1px;
 }
+.operatorItemBox .footerBox {
+	transition: width 0.2s;
+	-webkit-transition: width 0.2s; /* Safari */
+}
 .operatorItemBox:hover .footerBox {
 	border-bottom: 1px solid #fff;
 }

src/views/WorkFlowEdit/components/OperatorList/index.tsx

@@ -105,7 +105,7 @@ const OperatorItem = (props: IOperatorItemProps) => {
 				const newBatchFlowArr = getCopyBatchFlowArr(
 					batchFlowArr,
 					clientX - upperLeftPointX,
-					clientY - upperLeftPointY
+					clientY - upperLeftPointY + 44
 				);
 				const newVal = cloneDeep(templateConfigInfo);
 				newVal.push(...newBatchFlowArr);

src/views/WorkFlowEdit/components/ParameterSetting/index.tsx

@@ -300,6 +300,7 @@ const ParameterSetting = (props: IParameterSettingProps) => {
 								helpertext={parameter.helperText}
 								options={parameter?.choices || []}
 								disabled={parameter.parameterGroup === "out"}
+								fullWidth={true}
 							></MySelect>
 						)}
 						{(parameter.domType || "").toLowerCase() === "multipleselect" && (
@@ -320,6 +321,7 @@ const ParameterSetting = (props: IParameterSettingProps) => {
 								helpertext={parameter.helperText}
 								options={parameter?.choices || []}
 								disabled={parameter.parameterGroup === "out"}
+								fullWidth={true}
 							></MySelect>
 						)}
 						{(parameter.domType || "").toLowerCase() === "radio" && (
@@ -510,7 +512,12 @@ const ParameterSetting = (props: IParameterSettingProps) => {
 		} else {
 			setActiveParamsTab(""); // 会报错  不过不会有蓝色长条
 		}
-	}, [basisParameters, seniorParameters, hardwareParameters]);
+	}, [
+		taskId,
+		basisParameters.length,
+		seniorParameters.length,
+		hardwareParameters.length,
+	]);
 
 	return (
 		<div className={styles.parameterSetting}>

src/views/WorkFlowEdit/index.module.css

@@ -26,12 +26,20 @@
 	align-items: center;
 }
 .goBackIcon {
-	margin-right: 8px;
 	cursor: pointer;
 }
-/* .goBackIcon:hover:{
-	color: ;
-} */
+.goBackIconBox {
+	width: 32px;
+	height: 32px;
+	border-radius: 4px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	margin-right: 3px;
+}
+.goBackIconBox:hover {
+	background-color: rgb(240, 242, 245);
+}
 .goBack {
 	cursor: pointer;
 	color: #1e2633;

src/views/WorkFlowEdit/index.tsx

@@ -197,7 +197,9 @@ const WorkFlowEdit = observer((props: IProps) => {
 						)
 					}
 				>
+					<div className={styles.goBackIconBox}>
 						<img className={styles.goBackIcon} src={goback} alt="" />
+					</div>
 					<span className={styles.goBack}>返回</span>
 				</div>
 				<div className={styles.swHeaderRight}>
@@ -224,7 +226,10 @@ const WorkFlowEdit = observer((props: IProps) => {
 								fontSize: "16px",
 								height: "30px",
 							}}
-						></RadioGroupOfButtonStyle>
+							radioActiveBgBoxStyle={{
+								height: "32px",
+							}}
+						/>
 					</div>
 					{leftContentType === "list" && (
 						<OperatorList