Merge branch 'feat-20220801' into 'release'

Feat 20220801

See merge request !86

src/components/mui/MyCheckBox.tsx

@@ -12,6 +12,7 @@ import FormControlLabel from "@mui/material/FormControlLabel";
 import Checkbox from "@mui/material/Checkbox";
 import FormControl from "@mui/material/FormControl";
 import FormHelperText from "@mui/material/FormHelperText";
+import { ThemeProvider, createTheme } from "@mui/material/styles";
 import _ from "lodash";
 
 interface IMyCheckBoxProps extends FormGroupProps {
@@ -44,6 +45,33 @@ export const optionsTransform = (
 	});
 };
 
+const theme = createTheme({
+	components: {
+		MuiFormControlLabel: {
+			styleOverrides: {
+				label: {
+					fontSize: "14px",
+				},
+			},
+		},
+		MuiSvgIcon: {
+			styleOverrides: {
+				root: {
+					fontSize: "19px",
+				},
+			},
+		},
+		MuiCheckbox: {
+			styleOverrides: {
+				colorPrimary: {
+					color: "rgba(209, 214, 222, 1)",
+				},
+			},
+		},
+		// MuiCheckbox-colorPrimary
+	},
+});
+
 export default function MyCheckBox(props: IMyCheckBoxProps) {
 	const {
 		value,
@@ -76,27 +104,29 @@ export default function MyCheckBox(props: IMyCheckBoxProps) {
 	};
 
 	return (
-		<FormControl fullWidth variant={variant} error={error}>
-			<FormGroup {...props} row>
-				{options.map((option) => {
-					return (
-						<FormControlLabel
-							key={option.value}
-							control={
-								<Checkbox
-									checked={getCheckedStatus(option.value, value)}
-									value={option.value}
-								/>
-							}
-							label={option.label}
-							name={option.value}
-							onChange={handleMyCheckBoxOnChange}
-							disabled={option.disabled}
-						/>
-					);
-				})}
-			</FormGroup>
-			{helperText && error && <FormHelperText>{helperText}</FormHelperText>}
-		</FormControl>
+		<ThemeProvider theme={theme}>
+			<FormControl fullWidth variant={variant} error={error}>
+				<FormGroup {...props} row>
+					{options.map((option) => {
+						return (
+							<FormControlLabel
+								key={option.value}
+								control={
+									<Checkbox
+										checked={getCheckedStatus(option.value, value)}
+										value={option.value}
+									/>
+								}
+								label={option.label}
+								name={option.value}
+								onChange={handleMyCheckBoxOnChange}
+								disabled={option.disabled}
+							/>
+						);
+					})}
+				</FormGroup>
+				{helperText && error && <FormHelperText>{helperText}</FormHelperText>}
+			</FormControl>
+		</ThemeProvider>
 	);
 }

src/components/mui/MyPopconfirm.tsx

@@ -68,43 +68,52 @@ const MyPopconfirm = (props: IMyPopconfirmProps) => {
 			placement={placement}
 			sx={{
 				zIndex: 2000,
-				bgcolor: "#fff",
+				bgcolor: "transparent",
 				minWidth: "200px",
-				borderRadius: "4px",
 				fontSize: "14px",
 				padding: "20px 16px",
-				boxShadow: "0px 3px 10px 0px rgba(0, 24, 57, 0.14)",
 			}}
 		>
-			<Box sx={{ marginBottom: "16px" }}>
-				<img
-					style={{
-						width: "16px",
-						marginRight: "12px",
-						position: "relative",
-						top: "3px",
-					}}
-					src={tipsIcon}
-					alt=""
-				/>
-				{title}
-			</Box>
-			<Box sx={{ display: "flex", justifyContent: "flex-end" }}>
-				{showCancel && (
+			<Box
+				sx={{
+					bgcolor: "#fff",
+					minWidth: "200px",
+					borderRadius: "4px",
+					fontSize: "14px",
+					padding: "20px 16px",
+					boxShadow: "0px 3px 10px 0px rgba(0, 24, 57, 0.14)",
+				}}
+			>
+				<Box sx={{ marginBottom: "16px" }}>
+					<img
+						style={{
+							width: "16px",
+							marginRight: "12px",
+							position: "relative",
+							top: "3px",
+						}}
+						src={tipsIcon}
+						alt=""
+					/>
+					{title}
+				</Box>
+				<Box sx={{ display: "flex", justifyContent: "flex-end" }}>
+					{showCancel && (
+						<MyButton
+							text={cancelText}
+							variant="outlined"
+							color="inherit"
+							onClick={handleCancel}
+							style={{ marginRight: "12px" }}
+						/>
+					)}
 					<MyButton
-						text={cancelText}
-						variant="outlined"
-						color="inherit"
-						onClick={handleCancel}
-						style={{ marginRight: "12px" }}
+						text={okText}
+						onClick={handleOk}
+						loading={loading}
+						isLoadingButton={true}
 					/>
-				)}
-				<MyButton
-					text={okText}
-					onClick={handleOk}
-					loading={loading}
-					isLoadingButton={true}
-				/>
+				</Box>
 			</Box>
 		</Popper>
 	);

src/components/mui/MyRadio.tsx

@@ -12,6 +12,7 @@ import RadioGroup, { RadioGroupProps } from "@mui/material/RadioGroup";
 import FormControlLabel from "@mui/material/FormControlLabel";
 import FormControl from "@mui/material/FormControl";
 import FormHelperText from "@mui/material/FormHelperText";
+import { ThemeProvider, createTheme } from "@mui/material/styles";
 
 interface IMyRadioProps extends RadioGroupProps {
 	value: any;
@@ -44,6 +45,25 @@ export const optionsTransform = (
 	});
 };
 
+const theme = createTheme({
+	components: {
+		MuiFormControlLabel: {
+			styleOverrides: {
+				label: {
+					fontSize: "14px",
+				},
+			},
+		},
+		MuiSvgIcon: {
+			styleOverrides: {
+				root: {
+					fontSize: "19px",
+				},
+			},
+		},
+	},
+});
+
 export default function MyRadio(props: IMyRadioProps) {
 	const {
 		value,
@@ -55,28 +75,30 @@ export default function MyRadio(props: IMyRadioProps) {
 	} = props;
 
 	return (
-		<FormControl fullWidth variant={variant} error={error}>
-			<RadioGroup
-				{...props}
-				row
-				aria-labelledby="demo-row-radio-buttons-group-label"
-				name="row-radio-buttons-group"
-				value={value}
-				onChange={onChange}
-			>
-				{options.map((option) => {
-					return (
-						<FormControlLabel
-							key={option.value}
-							value={option.value}
-							control={<Radio sx={{ color: "rgba(209, 214, 222, 1)" }} />}
-							label={option.label}
-							disabled={option.disabled}
-						/>
-					);
-				})}
-			</RadioGroup>
-			{helperText && error && <FormHelperText>{helperText}</FormHelperText>}
-		</FormControl>
+		<ThemeProvider theme={theme}>
+			<FormControl fullWidth variant={variant} error={error}>
+				<RadioGroup
+					{...props}
+					row
+					aria-labelledby="demo-row-radio-buttons-group-label"
+					name="row-radio-buttons-group"
+					value={value}
+					onChange={onChange}
+				>
+					{options.map((option) => {
+						return (
+							<FormControlLabel
+								key={option.value}
+								value={option.value}
+								control={<Radio sx={{ color: "rgba(209, 214, 222, 1)" }} />}
+								label={option.label}
+								disabled={option.disabled}
+							/>
+						);
+					})}
+				</RadioGroup>
+				{helperText && error && <FormHelperText>{helperText}</FormHelperText>}
+			</FormControl>
+		</ThemeProvider>
 	);
 }

src/components/mui/MySelect.tsx

@@ -180,6 +180,14 @@ export default function MySelect(props: IProps) {
 					},
 				},
 			},
+
+			MuiFormControl: {
+				styleOverrides: {
+					root: {
+						width: "100%",
+					},
+				},
+			},
 		},
 	});
 

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

@@ -32,6 +32,9 @@
 	color: #1e2633;
 	line-height: 22px;
 	font-weight: 600;
+	display: flex;
+	justify-content: flex-start;
+	align-items: center;
 }
 
 .projectDataTabsAndBtton {
@@ -77,8 +80,9 @@
 	line-height: 22px;
 	font-size: 14px;
 	color: #1e2633;
-	/* display: flex;
-  align-items: center; */
+	display: flex;
+	justify-content: flex-start;
+	align-items: center;
 }
 
 .showPathI {

src/views/Project/ProjectData/index.tsx

@@ -27,6 +27,7 @@ import SeeDataset from "./SeeDataset";
 import { getDataFind, getDataFileSearch } from "@/api/project_api";
 import MyButton from "@/components/mui/MyButton";
 import SearchInput from "@/components/BusinessComponents/SearchInput";
+import ChevronRightIcon from "@mui/icons-material/ChevronRight";
 
 const ProjectData = observer(() => {
 	const isPass = usePass();
@@ -462,7 +463,13 @@ const ProjectData = observer(() => {
 						>
 							{index === 0 ? "ProjectData" : item}{" "}
 							{index === pathArr.length - 1 ? null : (
-								<i className={style.showPathI}>{">"}</i>
+								<ChevronRightIcon
+									sx={{
+										fontSize: "16px",
+										color: "rgba(194, 198, 204, 1)",
+										margin: "0px 4px",
+									}}
+								/>
 							)}
 						</span>
 					);
@@ -494,10 +501,24 @@ const ProjectData = observer(() => {
 								: ""}
 							{index === pathArr.length - 1 ||
 							(index <= pathArr.length - 4 && index > 0) ? null : (
-								<i className={style.showPathI}>{">"}</i>
+								<ChevronRightIcon
+									sx={{
+										fontSize: "16px",
+										color: "rgba(194, 198, 204, 1)",
+										margin: "0px 4px",
+									}}
+								/>
 							)}
 							{index === 1 && "..."}
-							{index === 1 && <i className={style.showPathI}>{">"}</i>}
+							{index === 1 && (
+								<ChevronRightIcon
+									sx={{
+										fontSize: "16px",
+										color: "rgba(194, 198, 204, 1)",
+										margin: "0px 4px",
+									}}
+								/>
+							)}
 						</span>
 					);
 				});

src/views/Project/ProjectSetting/BaseInfo/index.tsx

@@ -39,6 +39,7 @@ type zoneIdOption = {
 const BaseInfo = observer(() => {
 	const message = useMessage();
 	const { currentProjectStore } = useStores();
+	const fileToken = toJS(currentProjectStore.currentProjectInfo.filetoken);
 	const [projectInfo, setProjectInfo] = useState<any>({});
 	const [deleteProjectName, setDeleteProjectName] = useState("");
 	const [nameCheck, setNameCheck] = useState({
@@ -259,6 +260,7 @@ const BaseInfo = observer(() => {
 				message.success("修改成功");
 				const projectList = await getProjectList();
 				currentProjectStore.setProjectList(projectList);
+				projectInfo.filetoken = fileToken;
 				currentProjectStore.changeProject(projectInfo);
 			},
 		}

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

@@ -81,7 +81,7 @@
 }
 
 .taskConfigBox {
-	padding: 16px 24px 4px;
+	padding: 16px 0px 4px;
 }
 .flowTitle {
 	line-height: 16px;
@@ -118,3 +118,13 @@
 	color: rgba(138, 144, 153, 1);
 	margin-left: 16px;
 }
+.bacthConfigBox {
+	padding: 0 24px 0;
+}
+.flowConfigBox {
+	border-bottom: 1px solid rgba(235, 237, 240, 1);
+	padding: 20px 24px 12px;
+}
+.flowConfigBox:nth-last-child(1) {
+	border-bottom: none;
+}

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

@@ -189,10 +189,7 @@ const ConfigForm = (props: ConfigFormProps) => {
 		setParameter(e.target.value, taskId, parameterName);
 	};
 
-	const randerParameters = (
-		parameters: Array<IParameter>,
-		taskId: string,
-	) => {
+	const randerParameters = (parameters: Array<IParameter>, taskId: string) => {
 		return parameters
 			.filter((parameter) => parameter.hidden === false)
 			.map((parameter, parameterIndex) => {
@@ -495,10 +492,12 @@ const ConfigForm = (props: ConfigFormProps) => {
 							/>
 						</div>
 						<div className={styles.taskConfigBox}>
-							{randerParameters(
-								task.parameters.filter((parameter) => !parameter?.thrown),
-								task.id,
-							)}
+							<div className={styles.bacthConfigBox}>
+								{randerParameters(
+									task.parameters.filter((parameter) => !parameter?.thrown),
+									task.id
+								)}
+							</div>
 							{task.flows.map((flow) => {
 								if (
 									flow.parameters.filter(
@@ -508,7 +507,11 @@ const ConfigForm = (props: ConfigFormProps) => {
 									return null;
 								}
 								return (
-									<div className={styles.flowConfigBox} key={flow.id} id={`point${flow.id}`}>
+									<div
+										className={styles.flowConfigBox}
+										key={flow.id}
+										id={`point${flow.id}`}
+									>
 										<div className={styles.flowTitle}>
 											{flow.title}
 											{flow.description && (
@@ -521,10 +524,7 @@ const ConfigForm = (props: ConfigFormProps) => {
 												</MyTooltip>
 											)}
 										</div>
-										{randerParameters(
-											flow.parameters,
-											flow.id,
-										)}
+										{randerParameters(flow.parameters, flow.id)}
 									</div>
 								);
 							})}

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

@@ -14,7 +14,7 @@
 	top: 0;
 	height: 56px;
 	background-color: #fff;
-	box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.04);
+	box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.06);
 	display: flex;
 	justify-content: space-between;
 	align-items: center;

src/views/Project/ProjectSubmitWork/index.tsx

@@ -28,6 +28,7 @@ import { useMessage } from "@/components/MySnackbar";
 import { useStores } from "@/store";
 import { observer } from "mobx-react-lite";
 import MyPopconfirm from "@/components/mui/MyPopconfirm";
+import goback from "@/assets/project/goback.svg";
 
 import styles from "./index.module.css";
 
@@ -254,24 +255,14 @@ const ProjectSubmitWork = observer(() => {
 			{fullScreenShow ? null : (
 				<div className={styles.swHeader}>
 					<div className={styles.swHeaderLeft}>
-						<IconButton
-							color="primary"
+						<img
+							className={styles.goBackIcon}
+							src={goback}
+							alt=""
 							onClick={(e: any) =>
 								handleShowPopper(e, "返回将放弃当前页面所有操作，确认返回吗？")
 							}
-							aria-label="upload picture"
-							component="span"
-							size="small"
-						>
-							<ArrowBackIosNewIcon
-								sx={{
-									color: "rgba(194, 198, 204, 1)",
-									width: "14px",
-									height: "14px",
-								}}
-							/>
-						</IconButton>
-
+						/>
 						<div className={styles.swTemplateTitle}>
 							{templateConfigInfo?.title}
 						</div>
@@ -294,17 +285,12 @@ const ProjectSubmitWork = observer(() => {
 						<div className={styles.swHeaderGoback}></div>
 					</div>
 					<div className={styles.swHeaderRight}>
-						{/* <MyPopconfirm
-							title="提交前请先确认参数填写无误，确认提交吗？"
-							onConfirm={handleSubmitForm}
-						> */}
 						<MyButton
 							text="提交任务"
 							onClick={(e: any) =>
 								handleShowPopper(e, "提交前请先确认参数填写无误，确认提交吗？")
 							}
 						></MyButton>
-						{/* </MyPopconfirm> */}
 					</div>
 				</div>
 			)}

src/views/Project/ProjectWorkbench/workbenchTemplate/index.module.css

@@ -19,9 +19,7 @@
 .templateBox {
 	display: flex;
 	flex-wrap: wrap;
-	/* max-height: calc(100vh - 276px); */
 	margin: 0 -8px;
-	overflow-y: overlay;
 }
 
 .template {
@@ -41,7 +39,7 @@
 	margin-bottom: 16px;
 	position: relative;
 	box-sizing: border-box;
-	transition: box-shadow .2s cubic-bezier(0, 0, 1, 1);
+	transition: box-shadow 0.2s cubic-bezier(0, 0, 1, 1);
 }
 .templateBlock:hover {
 	box-shadow: 6px 8px 22px 0px rgba(0, 24, 57, 0.08);

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

@@ -6,11 +6,9 @@
 	background-color: #fff;
 }
 .operatorItemBox:hover {
+	box-shadow: 0px 5px 16px 0px rgba(0, 24, 57, 0.1);
 	position: relative;
-	z-index: 1;
 	top: -1px;
-	left: 24px;
-	box-shadow: 6px 8px 22px 0px rgba(0, 24, 57, 0.08);
 }
 .operatorItemBox:hover .footerBox {
 	border-bottom: 1px solid #fff;

src/views/WorkFlowEdit/index.module.css

@@ -47,7 +47,7 @@
 	border-right: 1px solid rgba(235, 237, 240, 1);
 	width: 360px;
 	height: 100%;
-	/* overflow-y: scroll; */
+	overflow-y: auto;
 	box-sizing: border-box;
 	position: relative;
 }

src/views/WorkFlowEdit/index.tsx

@@ -199,27 +199,6 @@ const WorkFlowEdit = observer((props: IProps) => {
 				>
 					<img className={styles.goBackIcon} src={goback} alt="" />
 					<span className={styles.goBack}>返回</span>
-					{/* <IconButton
-						color="primary"
-						aria-label="upload picture"
-						component="span"
-						size="small"
-						onClick={(e: any) =>
-							handleShowPopper(
-								e,
-								"返回后，当前页面已填写内容将不保存，确认返回吗？"
-							)
-						}
-					>
-						<ArrowBackIosNewIcon
-							sx={{
-								color: "rgba(194, 198, 204, 1)",
-								width: "12px",
-								height: "12px",
-							}}
-						/>
-						返回
-					</IconButton> */}
 				</div>
 				<div className={styles.swHeaderRight}>
 					<MyButton text="保存" onClick={() => handlePreserve()}></MyButton>