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

cn-Feat 20220705 custom template

See merge request sunyihao/bkunyun!97

src/api/fileserver/CloudEController.ts

@@ -4,7 +4,7 @@ import axios from "axios";
 // import { Actions, Constants } from '../../../../commons/utils/constants'
 // import MessageUtil from '../../../../commons/utils/MessageUtil'
 // import ApiUtils from '../../../../commons/utils/ApiUtils'
-import { APIOPTION, urlToken, ZONEID } from "./raysyncApi";
+import { APIOPTION, urlToken } from "./raysyncApi";
 // import UserStore from '../../../../console/common/stores/UserStore'
 import { ApiUtils } from "./utils";
 import Base64 from "crypto-js/enc-base64";

src/api/fileserver/raysyncApi.ts

@@ -28,18 +28,18 @@ const APIPORT = function () {
 };
 
 // 当前计算区
-let currentRegion = localStorage.getItem("current-region");
-let currentRegionJson = currentRegion && JSON.parse(currentRegion);
-let user = getLoaclStorageOfKey("userinfo");
+// let currentRegion = localStorage.getItem("current-region");
+// let currentRegionJson = currentRegion && JSON.parse(currentRegion);
+// let user = getLoaclStorageOfKey("userinfo");
 
 // 文件路径
-const FILEPATH =
-  currentRegionJson &&
-  currentRegionJson.location &&
-  currentRegionJson.location === "ON_PREMISE" &&
-  localStorage.getItem("userinfo")
-    ? `/home/${user.name}`
-    : "/home/cloudam";
+// const FILEPATH =
+//   currentRegionJson &&
+//   currentRegionJson.location &&
+//   currentRegionJson.location === "ON_PREMISE" &&
+//   localStorage.getItem("userinfo")
+//     ? `/home/${user.name}`
+//     : "/home/cloudam";
 const FILEPATH_SHARE = "/share";
 
 // 工作日志
@@ -104,7 +104,7 @@ const getType = function () {
 export {
   API,
   APIPORT,
-  FILEPATH,
+  // FILEPATH,
   FILEPATH_SHARE,
   APIOPTION,
   APIJOBLOGPOINT,

src/api/http.ts

@@ -128,7 +128,6 @@ export class Http {
         if (
           newConfig?.headers['Content-Type'] === "application/x-www-form-urlencoded"
         ) {
-          console.log(222)
           newConfig.data = qs.stringify(data);
         }
     return newConfig

src/components/Material.Ui/Table.jsx

@@ -9,7 +9,6 @@ import Paper from "@mui/material/Paper";
 import Checkbox from "@mui/material/Checkbox";
 // import Spin from "./Spin";
 
-import EnhancedTableToolbarComponent from "./Table/EnhancedTableToolbar"
 import EnhancedTableHeadComponent from "./Table/EnhancedTableHead"
 import { getComparator, stableSort, useStyles } from "./Table/function";
 import ActionsComponent from "./Table/ActionsComponent"
@@ -20,11 +19,10 @@ export default function EnhancedTable(props) {
   const classes = useStyles;
   const [order, setOrder] = React.useState("asc");
   const [orderBy, setOrderBy] = React.useState("");
-  const { headCells, rows, footer = true, elevation1, tableStyle, tablecellstyle, tableContainerStyle, stickyheader, TableHeadClasses, onRowClick, defaultRow, minHeight = '', borderBottom = '', onDoubleClick,
+  const { headCells, rows, footer = true, elevation1, tableStyle, tablecellstyle, tableContainerStyle, stickyheader, onRowClick, defaultRow, minHeight = '', borderBottom = '', onDoubleClick,
     load, size, checkboxData, rowsPerPage = 10, initSelected, page = 0, changePage = function () { }, toolbar, count, param, disabledparam = "id", headTableCellCheckbox, RowHeight = '', CellWidth = '', rowHover, TableNodataPadding = '', TableNodataLineHeight = '', tableBoySx } = props;
   const [selected, setSelected] = React.useState(initSelected || []);
-  const [rowsPerPageOptions, setRowsPerPageOptions] = React.useState(initSelected || [5, 10, 20, 50, { value: -1, label: 'All' }]);
-  // const [spin, setSpin] = React.useState(false)
+  const [rowsPerPageOptions] = React.useState(initSelected || [5, 10, 20, 50, { value: -1, label: 'All' }]);
   const [onRow, setOnRow] = React.useState('')
 
   // 重置复选框选中选项
@@ -63,10 +61,6 @@ export default function EnhancedTable(props) {
     setSelected([]);
     checkboxData([]);
   };
-  // React.useEffect(() => {
-
-  //   setSpin(load)
-  // }, [load]);
   const handleClick = (event, name) => {
     const selectedIndex = selected.indexOf(name);
     let newSelected = [];
@@ -97,7 +91,7 @@ export default function EnhancedTable(props) {
 
   const isSelected = (name) => selected.indexOf(name) !== -1;
 
-  const emptyRows = rowsPerPage - Math.min(rowsPerPage, rows.length - page * rowsPerPage);
+  // const emptyRows = rowsPerPage - Math.min(rowsPerPage, rows.length - page * rowsPerPage);
 
   const renderTableCellValue = useCallback(((item, row, index)=>{
     if(
@@ -209,11 +203,6 @@ export default function EnhancedTable(props) {
                   </TableRow>
                 );
               })}
-              {/* {emptyRows > 0 && (
-                <TableRow style={{ height: (dense ? 33 : 53) * emptyRows }}>
-                  <TableCell colSpan={6} />
-                </TableRow>
-              )} */}
             </TableBody>
           </Table>
         </TableContainer>

src/components/mui/MyMenu.tsx

@@ -21,7 +21,7 @@ const theme = createTheme({
 		MuiMenu: {
 			styleOverrides: {
 				root: {
-					maxHeight: "260px",
+					// maxHeight: "260px",
 					overflowY: "scroll",
 				},
 			},
@@ -87,7 +87,9 @@ const MyMenu = (props: IMyMenuProps) => {
 								key={index}
 							>
 								<span>{option.label}</span>
-								{value === option.value && <CheckIcon />}
+								{value === option.value && (
+									<CheckIcon sx={{ marginLeft: "12px" }} />
+								)}
 							</MenuItem>
 						);
 					})}

src/components/mui/MyTreeView.tsx

@@ -4,74 +4,72 @@ import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown";
 import TreeItem from "@mui/lab/TreeItem";
 
 interface TreeItemType {
-  id: string;
-  name: string;
-  disabled?: boolean;
-  subdirs?: readonly TreeItemType[];
+	id: string;
+	name: string;
+	disabled?: boolean;
+	subdirs?: readonly TreeItemType[];
 }
 
 type MyTreeViewProps = {
-  treeData: Array<TreeItemType>;
-  onNodeFocus?: (event: object, value: string) => void; // 点击某一项的回调
-  onNodeSelect?: (event: object, value: Array<any> | string) => void; // 点击某一项的回调
-  onNodeToggle?: (event: object, nodeIds: Array<any>) => void; // 点击某一项的回调
-  renderLabel?: (node: any) => React.ReactNode;
-  treeViewSx?: any;
-  defaultExpanded?: Array<string>;
-  idKey?: string;
-  idFunc?: (node: any) => string;
+	treeData: Array<TreeItemType>;
+	onNodeFocus?: (event: object, value: string) => void; // 点击某一项的回调
+	onNodeSelect?: (event: object, value: Array<any> | string) => void; // 点击某一项的回调
+	onNodeToggle?: (event: object, nodeIds: Array<any>) => void; // 点击某一项的回调
+	renderLabel?: (node: any) => React.ReactNode;
+	treeViewSx?: any;
+	defaultExpanded?: Array<string>;
+	idFunc?: (node: any) => string;
 };
 
 interface RenderTree {
-  id: string | number;
-  name: string;
-  disabled?: boolean;
-  subdirs?: readonly RenderTree[];
+	id: string | number;
+	name: string;
+	disabled?: boolean;
+	subdirs?: readonly RenderTree[];
 }
 
 const MyTreeView = (props: MyTreeViewProps) => {
-  const {
-    treeData = [],
-    renderLabel,
-    treeViewSx,
-    onNodeFocus,
-    onNodeSelect,
-    onNodeToggle,
-    defaultExpanded,
-    idKey,
-    idFunc,
-  } = props;
+	const {
+		treeData = [],
+		renderLabel,
+		treeViewSx,
+		onNodeFocus,
+		onNodeSelect,
+		onNodeToggle,
+		defaultExpanded,
+		idFunc,
+	} = props;
 
-  const renderTreeObj = (nodes: RenderTree, index: number) => (
-    <TreeItem
-      key={nodes.id || `${nodes.name}${index}`}
-      nodeId={String(
-        idFunc ? idFunc(nodes) : nodes.id || `${nodes.name}${index}`
-      )}
-      label={renderLabel === undefined ? nodes.name : renderLabel(nodes)}
-      disabled={nodes?.disabled ? true : false}
-    >
-      {Array.isArray(nodes.subdirs)
-        ? nodes.subdirs.map((node, i) => renderTreeObj(node, i))
-        : null}
-    </TreeItem>
-  );
+	const renderTreeObj = (nodes: RenderTree, index: number) => (
+		<TreeItem
+			key={nodes.id || `${nodes.name}${index}`}
+			nodeId={String(
+				idFunc ? idFunc(nodes) : nodes.id || `${nodes.name}${index}`
+			)}
+			label={renderLabel === undefined ? nodes.name : renderLabel(nodes)}
+			disabled={nodes?.disabled ? true : false}
+		>
+			{Array.isArray(nodes.subdirs)
+				? nodes.subdirs.map((node, i) => renderTreeObj(node, i))
+				: null}
+		</TreeItem>
+	);
 
-  return (
-    <TreeView
-      defaultCollapseIcon={<ArrowRightIcon />}
-      defaultExpandIcon={<ArrowDropDownIcon />}
-      onNodeFocus={onNodeFocus}
-      onNodeSelect={onNodeSelect}
-      onNodeToggle={onNodeToggle}
-      defaultExpanded={defaultExpanded}
-      sx={{ ...treeViewSx }}
-    >
-      {treeData.map((treeItem, index) => {
-        return renderTreeObj(treeItem, index);
-      })}
-    </TreeView>
-  );
+	return (
+		<TreeView
+			defaultCollapseIcon={<ArrowRightIcon />}
+			defaultExpandIcon={<ArrowDropDownIcon />}
+			onNodeFocus={onNodeFocus}
+			onNodeSelect={onNodeSelect}
+			onNodeToggle={onNodeToggle}
+			defaultExpanded={defaultExpanded}
+			sx={{ ...treeViewSx }}
+		>
+			{treeData.map((treeItem, index) => {
+				return renderTreeObj(treeItem, index);
+			})}
+		</TreeView>
+	);
 };
 
 export default MyTreeView;

src/hooks/usePass.ts

@@ -75,7 +75,7 @@ const usePass = () => {
       }
       return false;
     },
-    [permissionStore.allRoutes]
+    [permissionStore.allRoutes, currentProjectStore]
   );
 
   return isPass;

src/index.tsx

@@ -7,35 +7,48 @@ import { Provider } from "mobx-react";
 import { stores } from "@/store/index";
 import { MySnackbarProvider } from "@/components/MySnackbar";
 import "@/mocks/index";
-import './assets/style/public.css'
-import { createTheme, ThemeProvider, styled } from '@mui/material/styles';
+import "./assets/style/public.css";
+import { createTheme, ThemeProvider } from "@mui/material/styles";
 
 const root = ReactDOM.createRoot(
-  document.getElementById("root") as HTMLElement
+	document.getElementById("root") as HTMLElement
 );
 
 const theme = createTheme({
-  typography: {
-    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"'].join(','),
-  },
-  palette: {
-    primary: { main: '#136EFA' },
-    secondary: { main: '#F44335' }
-  }
+	typography: {
+		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"',
+		].join(","),
+	},
+	palette: {
+		primary: { main: "#136EFA" },
+		secondary: { main: "#F44335" },
+	},
 });
 
 root.render(
-  <React.StrictMode>
-    <ThemeProvider theme={theme}>
-      <Provider {...stores}>
-        <MySnackbarProvider
-          alertSx={{ boxShadow: "0px 2px 4px 0px rgb(0 0 0 / 8%)" }}
-        >
-          <MyRouter></MyRouter>
-        </MySnackbarProvider>
-      </Provider>
-    </ThemeProvider>
-  </React.StrictMode>
+	<React.StrictMode>
+		<ThemeProvider theme={theme}>
+			<Provider {...stores}>
+				<MySnackbarProvider
+					alertSx={{ boxShadow: "0px 2px 4px 0px rgb(0 0 0 / 8%)" }}
+				>
+					<MyRouter></MyRouter>
+				</MySnackbarProvider>
+			</Provider>
+		</ThemeProvider>
+	</React.StrictMode>
 );
 
 // If you want to start measuring performance in your app, pass a function

src/utils/helper.ts

@@ -36,6 +36,6 @@ export const verifyLettersNumbersCertainChars5 = (str: string) => {
     if (getTrueLength(str) > 127) {
       return false;
     }
-    let validString = /^[\u4e00-\u9fa5_0-9a-zA-Z\/-_.]+$/;
+    let validString = /^[\u4e00-\u9fa5_0-9a-zA-Z/-_.]+$/;
     return validString.test(str);
   };
\ No newline at end of file

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

-import React, { useState, useImperativeHandle, useMemo } from "react";
+import React, { useImperativeHandle, useMemo } from "react";
 
 import MyDialog from "@/components/mui/MyDialog";
 import { useMessage } from "@/components/MySnackbar";
@@ -7,177 +7,177 @@ import { getDataFileDel, getDataFileDelPackage } from "@/api/project_api";
 import useMyRequest from "@/hooks/useMyRequest";
 
 const DeleteDialog = (props: any) => {
-  const {
-    path,
-    projectId,
-    fileToken,
-    currentOperateFile,
-    selectIds,
-    refresh,
-    showList,
-  } = props;
-  const Message = useMessage();
-  let deleteFileDialogRef: any = React.createRef();
-  const showDialog = () => {
-    deleteFileDialogRef.current.handleClickOpen();
-  };
-
-  useImperativeHandle(props.onRef, () => {
-    return {
-      showDialog: showDialog,
-    };
-  });
-  const { run: getDataFileDelRun } = useMyRequest(getDataFileDel, {
-    onSuccess: (res: any) => {
-      successDelete();
-    },
-  });
-
-  const { run: getDataFileDelPackageRun } = useMyRequest(
-    getDataFileDelPackage,
-    {
-      onSuccess: (res: any) => {
-        successDelete();
-      },
-    }
-  );
-
-  const successDelete = () => {
-    Message.success("删除成功！");
-    deleteFileDialogRef?.current?.handleClose();
-    refresh();
-  };
-
-  const deletePathProvidedToDataSet = useMemo(() => {
-    return path === "/" ? "/" : `${path}/`;
-  }, [path]);
-
-  const deletePathProvidedFileServer = useMemo(() => {
-    return path === "/" ? `${path}` : `${path}/`;
-  }, [path]);
-
-  // 删除
-  const handleSubmit = () => {
-    if (!currentOperateFile) {
-      // 批量删除
-      // 要删除的数据集
-      const datSetDeleteList = showList.filter((item: any) => {
-        return selectIds.indexOf(item.name) !== -1 && item.type === "dataSet";
-      });
-      // 要删除的文件夹
-      const folderDeleteList = showList.filter((item: any) => {
-        return selectIds.indexOf(item.name) !== -1 && item.type === "directory";
-      });
-      // 要删除的文件
-      const fileDeleteList = showList.filter((item: any) => {
-        return (
-          selectIds.indexOf(item.name) !== -1 &&
-          item.type !== "dataSet" &&
-          item.type !== "directory"
-        );
-      });
-      if (datSetDeleteList.length > 0) {
-        dataSetsDelete(datSetDeleteList);
-      }
-      if (folderDeleteList.length > 0) {
-        foldersDelete(folderDeleteList);
-      }
-      if (fileDeleteList.length > 0) {
-        filesDelete(fileDeleteList);
-      }
-    } else {
-      if (currentOperateFile.type === "dataSet") {
-        dataSetDelete();
-      } else if (currentOperateFile.type === "directory") {
-        folerDelete();
-      } else {
-        fileDelete();
-      }
-    }
-  };
-
-  // 删除单个数据集
-  const dataSetDelete = () => {
-    getDataFileDelRun({
-      projectId: projectId as string,
-      names: currentOperateFile.name,
-      path: deletePathProvidedToDataSet,
-    });
-  };
-
-  // 删除单个文件夹
-  const folerDelete = () => {
-    fileDelete();
-    const names = currentOperateFile.name;
-    dataSetInFolerDelete(names);
-  };
-
-  // 删除文件夹中的数据集
-  const dataSetInFolerDelete = (names: string) => {
-    getDataFileDelPackageRun({
-      projectId: projectId as string,
-      names,
-      path: deletePathProvidedToDataSet,
-    });
-  };
-
-  // 删除单个文件
-  const fileDelete = () => {
-    CloudEController.JobOutFileDel(
-      `${deletePathProvidedFileServer}${currentOperateFile.name}`,
-      fileToken as string,
-      projectId as string
-    )?.then((res) => {
-      successDelete();
-    });
-  };
-
-  // 删除多个数据集
-  const dataSetsDelete = (datSetDeleteList: Array<any>) => {
-    getDataFileDelRun({
-      projectId: projectId as string,
-      names: datSetDeleteList.map((item: any) => item.name).join(","),
-      path: deletePathProvidedToDataSet,
-    });
-  };
-
-  // 删除多个文件夹
-  const foldersDelete = (folderDeleteList: Array<any>) => {
-    filesDelete(folderDeleteList);
-    const names = folderDeleteList.map((item: any) => item.name).join(",");
-    dataSetInFolerDelete(names);
-  };
-
-  // 删除多个文件
-  const filesDelete = (fileDeleteList: Array<any>) => {
-    const deletePath = fileDeleteList
-      .map((item: any) => {
-        return `${deletePathProvidedFileServer}${item.name}`;
-      })
-      .join(" ");
-    CloudEController.JobOutFileDel(
-      deletePath,
-      fileToken as string,
-      projectId as string
-    )?.then((res) => {
-      successDelete();
-    });
-  };
-
-  const submitloading = false;
-
-  return (
-    <MyDialog
-      handleSubmit={handleSubmit}
-      onRef={deleteFileDialogRef}
-      title="提示"
-      submitloading={submitloading}
-    >
-      {currentOperateFile
-        ? "确认删除该数据吗？"
-        : `确认删除这${selectIds.length}条数据吗？`}
-    </MyDialog>
-  );
+	const {
+		path,
+		projectId,
+		fileToken,
+		currentOperateFile,
+		selectIds,
+		refresh,
+		showList,
+	} = props;
+	const Message = useMessage();
+	let deleteFileDialogRef: any = React.createRef();
+	const showDialog = () => {
+		deleteFileDialogRef.current.handleClickOpen();
+	};
+
+	useImperativeHandle(props.onRef, () => {
+		return {
+			showDialog: showDialog,
+		};
+	});
+	const { run: getDataFileDelRun } = useMyRequest(getDataFileDel, {
+		onSuccess: (res: any) => {
+			successDelete();
+		},
+	});
+
+	const { run: getDataFileDelPackageRun } = useMyRequest(
+		getDataFileDelPackage,
+		{
+			onSuccess: (res: any) => {
+				successDelete();
+			},
+		}
+	);
+
+	const successDelete = () => {
+		Message.success("删除成功！");
+		deleteFileDialogRef?.current?.handleClose();
+		refresh();
+	};
+
+	const deletePathProvidedToDataSet = useMemo(() => {
+		return path === "/" ? "/" : `${path}/`;
+	}, [path]);
+
+	const deletePathProvidedFileServer = useMemo(() => {
+		return path === "/" ? `${path}` : `${path}/`;
+	}, [path]);
+
+	// 删除
+	const handleSubmit = () => {
+		if (!currentOperateFile) {
+			// 批量删除
+			// 要删除的数据集
+			const datSetDeleteList = showList.filter((item: any) => {
+				return selectIds.indexOf(item.name) !== -1 && item.type === "dataSet";
+			});
+			// 要删除的文件夹
+			const folderDeleteList = showList.filter((item: any) => {
+				return selectIds.indexOf(item.name) !== -1 && item.type === "directory";
+			});
+			// 要删除的文件
+			const fileDeleteList = showList.filter((item: any) => {
+				return (
+					selectIds.indexOf(item.name) !== -1 &&
+					item.type !== "dataSet" &&
+					item.type !== "directory"
+				);
+			});
+			if (datSetDeleteList.length > 0) {
+				dataSetsDelete(datSetDeleteList);
+			}
+			if (folderDeleteList.length > 0) {
+				foldersDelete(folderDeleteList);
+			}
+			if (fileDeleteList.length > 0) {
+				filesDelete(fileDeleteList);
+			}
+		} else {
+			if (currentOperateFile.type === "dataSet") {
+				dataSetDelete();
+			} else if (currentOperateFile.type === "directory") {
+				folerDelete();
+			} else {
+				fileDelete();
+			}
+		}
+	};
+
+	// 删除单个数据集
+	const dataSetDelete = () => {
+		getDataFileDelRun({
+			projectId: projectId as string,
+			names: currentOperateFile.name,
+			path: deletePathProvidedToDataSet,
+		});
+	};
+
+	// 删除单个文件夹
+	const folerDelete = () => {
+		fileDelete();
+		const names = currentOperateFile.name;
+		dataSetInFolerDelete(names);
+	};
+
+	// 删除文件夹中的数据集
+	const dataSetInFolerDelete = (names: string) => {
+		getDataFileDelPackageRun({
+			projectId: projectId as string,
+			names,
+			path: deletePathProvidedToDataSet,
+		});
+	};
+
+	// 删除单个文件
+	const fileDelete = () => {
+		CloudEController.JobOutFileDel(
+			`${deletePathProvidedFileServer}${currentOperateFile.name}`,
+			fileToken as string,
+			projectId as string
+		)?.then((res) => {
+			successDelete();
+		});
+	};
+
+	// 删除多个数据集
+	const dataSetsDelete = (datSetDeleteList: Array<any>) => {
+		getDataFileDelRun({
+			projectId: projectId as string,
+			names: datSetDeleteList.map((item: any) => item.name).join(","),
+			path: deletePathProvidedToDataSet,
+		});
+	};
+
+	// 删除多个文件夹
+	const foldersDelete = (folderDeleteList: Array<any>) => {
+		filesDelete(folderDeleteList);
+		const names = folderDeleteList.map((item: any) => item.name).join(",");
+		dataSetInFolerDelete(names);
+	};
+
+	// 删除多个文件
+	const filesDelete = (fileDeleteList: Array<any>) => {
+		const deletePath = fileDeleteList
+			.map((item: any) => {
+				return `${deletePathProvidedFileServer}${item.name}`;
+			})
+			.join(" ");
+		CloudEController.JobOutFileDel(
+			deletePath,
+			fileToken as string,
+			projectId as string
+		)?.then((res) => {
+			successDelete();
+		});
+	};
+
+	const submitloading = false;
+
+	return (
+		<MyDialog
+			handleSubmit={handleSubmit}
+			onRef={deleteFileDialogRef}
+			title="提示"
+			submitloading={submitloading}
+		>
+			{currentOperateFile
+				? "确认删除该数据吗？"
+				: `确认删除这${selectIds.length}条数据吗？`}
+		</MyDialog>
+	);
 };
 
 export default DeleteDialog;

src/views/Project/ProjectJobDetail/index.tsx

@@ -164,7 +164,7 @@ const ProjectSubmitWork = observer(() => {
 	};
 
 	const getDataSetSize = async (item: any, index: number) => {
-		let path = item.path.slice(13);
+		let path = item.path.slice(12);
 		const lastIndex = path.lastIndexOf("/");
 		if (lastIndex === -1) {
 			path = "/";
@@ -184,7 +184,7 @@ const ProjectSubmitWork = observer(() => {
 	};
 
 	const getFileSize = (item: any, index: number) => {
-		let path = item.path.slice(13);
+		let path = item.path.slice(12);
 		const lastIndex = path.lastIndexOf("/");
 		if (lastIndex === -1) {
 			path = "/";

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

@@ -7,7 +7,7 @@
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
 // import Dialog from "@/components/Material.Ui/Dialog";
-import { memo, useEffect, useMemo, useState } from "react";
+import { memo, useEffect, useState } from "react";
 import { observer } from "mobx-react-lite";
 import { toJS } from "mobx";
 
@@ -19,91 +19,91 @@ import { IDialogInfo } from "../interface";
 import { useMessage } from "@/components/MySnackbar";
 
 interface IProps {
-  setPermissionDialog: (val: IDialogInfo) => void;
-  permissionDialog: IDialogInfo;
-  getTableList: () => void;
+	setPermissionDialog: (val: IDialogInfo) => void;
+	permissionDialog: IDialogInfo;
+	getTableList: () => void;
 }
 
 const ChangePermission = observer((props: IProps) => {
-  const { permissionDialog, setPermissionDialog, getTableList } = props;
+	const { permissionDialog, setPermissionDialog, getTableList } = props;
 
-  const { currentProjectStore } = useStores();
-  const Message = useMessage();
-  const http = useHttp();
+	const { currentProjectStore } = useStores();
+	const Message = useMessage();
+	const http = useHttp();
 
-  const [selectOptions, setSelectOptions] = useState<IOption[]>([]);
-  const [selectValue, setSelectValue] = useState<IOption | undefined>();
+	const [selectOptions, setSelectOptions] = useState<IOption[]>([]);
+	const [selectValue, setSelectValue] = useState<IOption | undefined>();
 
-  useEffect(() => {
-    if (permissionDialog?.isShow) {
-      http.get<IResponse<any>>("/cpp/project/listroles").then((res) => {
-        const arr = [];
-        const { data } = res;
-        for (const key in data) {
-          arr.push({
-            label: String(data[key]),
-            value: key,
-          });
-        }
-        setSelectOptions(arr);
-      });
-    }
-  }, [http, permissionDialog]);
+	useEffect(() => {
+		if (permissionDialog?.isShow) {
+			http.get<IResponse<any>>("/cpp/project/listroles").then((res) => {
+				const arr = [];
+				const { data } = res;
+				for (const key in data) {
+					arr.push({
+						label: String(data[key]),
+						value: key,
+					});
+				}
+				setSelectOptions(arr);
+			});
+		}
+	}, [http, permissionDialog]);
 
-  const changePermission = (val: any) => {
-    setSelectValue(val);
-  };
-  const onClose = () => {
-    setPermissionDialog({ isShow: false, username: "" });
-  };
-  const onConfirm = () => {
-    const projectInfo = toJS(currentProjectStore?.currentProjectInfo);
-    http
-      .put<IResponse<any>>(
-        `/cpp/project/updateuserrole?id=${projectInfo?.id || ""}&username=${
-          permissionDialog.username
-        }&role=${selectValue?.value}`
-      )
-      .then((res) => {
-        const { errorCode } = res;
-        if (errorCode === 0) {
-          Message.success("更改成功！");
-          getTableList();
-          setPermissionDialog({ isShow: false, username: "" });
-        }
-      });
-  };
+	const changePermission = (val: any) => {
+		setSelectValue(val);
+	};
+	const onClose = () => {
+		setPermissionDialog({ isShow: false, username: "" });
+	};
+	const onConfirm = () => {
+		const projectInfo = toJS(currentProjectStore?.currentProjectInfo);
+		http
+			.put<IResponse<any>>(
+				`/cpp/project/updateuserrole?id=${projectInfo?.id || ""}&username=${
+					permissionDialog.username
+				}&role=${selectValue?.value}`
+			)
+			.then((res) => {
+				const { errorCode } = res;
+				if (errorCode === 0) {
+					Message.success("更改成功！");
+					getTableList();
+					setPermissionDialog({ isShow: false, username: "" });
+				}
+			});
+	};
 
-  useEffect(() => {
-    const defaultValue = selectOptions.filter(
-      (every) => every.value === permissionDialog?.projectRole
-    );
-    if (defaultValue?.length) {
-      setSelectValue(defaultValue[0]);
-    } else {
-      setSelectValue({ value: "VIEWER", label: "查看者" });
-    }
-  }, [permissionDialog, selectOptions]);
-  return (
-    <>
-      <Dialog
-        open={permissionDialog?.isShow}
-        onClose={onClose}
-        onConfirm={onConfirm}
-        title="更改权限"
-      >
-        <div style={{ marginTop: 12 }}>
-          <MySelect
-            title="项目权限"
-            value={selectValue}
-            onChange={changePermission}
-            options={selectOptions}
-            size="small"
-          />
-        </div>
-      </Dialog>
-    </>
-  );
+	useEffect(() => {
+		const defaultValue = selectOptions.filter(
+			(every) => every.value === permissionDialog?.projectRole
+		);
+		if (defaultValue?.length) {
+			setSelectValue(defaultValue[0]);
+		} else {
+			setSelectValue({ value: "VIEWER", label: "查看者" });
+		}
+	}, [permissionDialog, selectOptions]);
+	return (
+		<>
+			<Dialog
+				open={permissionDialog?.isShow}
+				onClose={onClose}
+				onConfirm={onConfirm}
+				title="更改权限"
+			>
+				<div style={{ marginTop: 12 }}>
+					<MySelect
+						title="项目权限"
+						value={selectValue}
+						onChange={changePermission}
+						options={selectOptions}
+						size="small"
+					/>
+				</div>
+			</Dialog>
+		</>
+	);
 });
 
 export default memo(ChangePermission);

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

@@ -24,7 +24,6 @@ import styles from "./index.module.css";
 import { IDialogInfo } from "./interface";
 import { toJS } from "mobx";
 import { useStores } from "@/store";
-import { isProjectOwner } from "@/utils/util";
 import { observer } from "mobx-react";
 
 const ProjectMembers = observer(() => {
@@ -104,7 +103,6 @@ const ProjectMembers = observer(() => {
 			.then((res) => {
 				const { data = {} } = res;
 				setTableData(data?.members || []);
-				console.log(data?.projectRole, data?.projectRole);
 				setProjectRole(data?.projectRole || "");
 			});
 	}, [currentProjectStore?.currentProjectInfo, http]);

src/views/Project/ProjectSetting/index.tsx

@@ -6,7 +6,7 @@
  * @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
-import { memo, useState, useMemo } from "react";
+import { memo, useMemo } from "react";
 
 import { Box } from "@mui/system";
 import { useStores } from "@/store/index";
@@ -18,39 +18,39 @@ import BaseInfo from "./BaseInfo";
 import Tabs from "@/components/mui/Tabs";
 
 const ProjectSetting = observer(() => {
-  const { currentProjectStore } = useStores();
-  const tabList = useMemo(() => {
-    return [
-      {
-        label: "项目成员",
-        value: "projectMember",
-        component: <ProjectMembers />,
-      },
-      {
-        label: "基础信息",
-        value: "baseInfo",
-        component: <BaseInfo />,
-      },
-    ];
-  }, []);
+	const { currentProjectStore } = useStores();
+	const tabList = useMemo(() => {
+		return [
+			{
+				label: "项目成员",
+				value: "projectMember",
+				component: <ProjectMembers />,
+			},
+			{
+				label: "基础信息",
+				value: "baseInfo",
+				component: <BaseInfo />,
+			},
+		];
+	}, []);
 
-  if (currentProjectStore.currentProjectInfo.name) {
-    return (
-      <div style={{ padding: 24 }}>
-        <div style={{ display: "flex", alignItems: "center" }}>
-          <img src={projectImg} alt="项目logo" />
-          <span style={{ marginLeft: 12 }}>
-            {currentProjectStore.currentProjectInfo.name}
-          </span>
-        </div>
-        <Box sx={{ width: "100%", typography: "body1" }}>
-          <Tabs  tabList={tabList} />
-        </Box>
-      </div>
-    );
-  } else {
-    return <NoProject />;
-  }
+	if (currentProjectStore.currentProjectInfo.name) {
+		return (
+			<div style={{ padding: 24 }}>
+				<div style={{ display: "flex", alignItems: "center" }}>
+					<img src={projectImg} alt="项目logo" />
+					<span style={{ marginLeft: 12 }}>
+						{currentProjectStore.currentProjectInfo.name}
+					</span>
+				</div>
+				<Box sx={{ width: "100%", typography: "body1" }}>
+					<Tabs tabList={tabList} />
+				</Box>
+			</div>
+		);
+	} else {
+		return <NoProject />;
+	}
 });
 
 export default memo(ProjectSetting);

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

-import { ITemplateConfig, IRenderTasks, IRenderTask } from "../interface";
+import { ITemplateConfig, IRenderTasks } from "../interface";
 import styles from "./index.module.css";
 import MyInput from "@/components/mui/MyInput";
 import Tooltip from "@mui/material/Tooltip";
 import classnames from "classnames";
-import { useState, useMemo, useImperativeHandle, useCallback } from "react";
+import { useState, useMemo, useImperativeHandle } from "react";
 import FileSelect from "@/components/FileSelect";
 import moment from "moment";
 import MySelect, { optionsTransform } from "../components/MySelect";
 import MyCheckBox from "@/components/mui/MyCheckBox";
 import MyRadio from "@/components/mui/MyRadio";
-import _ from "lodash";
 import { getCheckResult } from "../util";
 import fileSelectIcon from "@/assets/project/fileSelect.svg";
 import questionMark from "@/assets/project/questionMark.svg";

src/views/Project/ProjectSubmitWork/index.tsx

@@ -26,11 +26,12 @@ import fullScreen from "@/assets/project/fullScreen.svg";
 import partialScreen from "@/assets/project/partialScreen.svg";
 import { useMessage } from "@/components/MySnackbar";
 import { useStores } from "@/store";
+import { observer } from "mobx-react-lite";
 import MyPopconfirm from "@/components/mui/MyPopconfirm";
 
 import styles from "./index.module.css";
 
-const ProjectSubmitWork = () => {
+const ProjectSubmitWork = observer(() => {
 	const Message = useMessage();
 	const { currentProjectStore } = useStores();
 	const projectId = toJS(currentProjectStore.currentProjectInfo.id);
@@ -291,6 +292,6 @@ const ProjectSubmitWork = () => {
 			/>
 		</div>
 	);
-};
+});
 
 export default ProjectSubmitWork;

src/views/Project/ProjectSubmitWork/interface.ts

@@ -70,7 +70,6 @@ export type IDomType =
   | "dataset"
   | "file"
   | "input"
-  | "file"
   | "select"
   | "multipleselect"
   | "radio"

src/views/Project/ProjectWorkbench/workbenchList/components/simpleDialog.tsx

-
-import { memo, useCallback, useEffect, useMemo, useState } from "react";
-import styles from "../index.module.css";
+import { memo } from "react";
 import { Box, Typography } from "@mui/material";
-import Button from "@mui/material/Button";
 import Dialog from "@/components/mui/Dialog";
 
 const SimpleDialog = (props: any) => {
-    const { openDialog, closeDialog, onConfirm, text, title } = props;
+	const { openDialog, closeDialog, onConfirm, text, title } = props;
 
-    return (
-        < >
-            <Dialog
-                open={openDialog}
-                onClose={closeDialog}
-                onConfirm={onConfirm}
-                title={title}
-            >
-                <Box>
-                    <Typography sx={{ fontSize: '14px', fontWeight: '400' }}>{text}</Typography>
-                </Box>
-            </Dialog>
-        </>
-    );
+	return (
+		<>
+			<Dialog
+				open={openDialog}
+				onClose={closeDialog}
+				onConfirm={onConfirm}
+				title={title}
+			>
+				<Box>
+					<Typography sx={{ fontSize: "14px", fontWeight: "400" }}>
+						{text}
+					</Typography>
+				</Box>
+			</Dialog>
+		</>
+	);
 };
 
 export default memo(SimpleDialog);

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

-import { memo, useEffect, useState, useMemo } from "react";
+import { useEffect, useState, useMemo } from "react";
 import style from "./index.module.css";
 import classNames from "classnames";
 import CloseOutlinedIcon from "@mui/icons-material/CloseOutlined";
@@ -44,9 +44,7 @@ const AddTemplate = observer((props: IAddTemplateProps) => {
 	const productId = toJS(currentProjectStore.currentProductInfo.id);
 	const { setShowAddTemplate, getTemplateInfo } = props;
 
-	const handleSearch = (value: string) => {
-		console.log(value);
-	};
+	const handleSearch = (value: string) => {};
 
 	/** 可增加模板列表 */
 	const [addTemplateList, setAddTemplateList] = useState([]);
@@ -83,7 +81,6 @@ const AddTemplate = observer((props: IAddTemplateProps) => {
 	});
 
 	const handleAddTemplate = () => {
-		console.log("handleAddTemplate");
 		addTemplate({
 			projectId: projectId as string,
 			workflowSpecIds: selectTemplateData,
@@ -93,7 +90,6 @@ const AddTemplate = observer((props: IAddTemplateProps) => {
 	// 添加工作流模板-获取模板列表
 	const { run: getAddTemplateList } = useMyRequest(getAddWorkbenchTemplate, {
 		onSuccess: (result: any) => {
-			console.log(result);
 			setAddTemplateList(result.data);
 			// setOpenAddTemplate(true);
 		},

src/views/Project/ProjectWorkbench/workbenchTemplate/components/simpleDialog.tsx

-
-import { memo, useCallback, useEffect, useMemo, useState } from "react";
-import styles from "../index.module.css";
+import { memo } from "react";
 import { Box, Typography } from "@mui/material";
-import Button from "@mui/material/Button";
 import Dialog from "@/components/mui/Dialog";
 
 const SimpleDialog = (props: any) => {
-    const { openDialog, closeDialog, onConfirm, text, title } = props;
+	const { openDialog, closeDialog, onConfirm, text, title } = props;
 
-    return (
-        < >
-            <Dialog
-                open={openDialog}
-                onClose={closeDialog}
-                onConfirm={onConfirm}
-                title={title}
-            >
-                <Box>
-                    <Typography sx={{ fontSize: '14px', fontWeight: '400' }}>{text}</Typography>
-                </Box>
-            </Dialog>
-        </>
-    );
+	return (
+		<>
+			<Dialog
+				open={openDialog}
+				onClose={closeDialog}
+				onConfirm={onConfirm}
+				title={title}
+			>
+				<Box>
+					<Typography sx={{ fontSize: "14px", fontWeight: "400" }}>
+						{text}
+					</Typography>
+				</Box>
+			</Dialog>
+		</>
+	);
 };
 
 export default memo(SimpleDialog);

src/views/Project/ProjectWorkbench/workbenchTemplate/components/templateBox.tsx

@@ -6,7 +6,7 @@
  * @FilePath: /bkunyun/src/views/Project/ProjectWorkbench/workbenchTemplate/components/templateBox.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
-import { memo, useCallback, useEffect, useMemo, useState } from "react";
+import { memo, useCallback } from "react";
 import styles from "../index.module.css";
 import { Box, Typography } from "@mui/material";
 import Button from "@/components/mui/Button";
@@ -14,82 +14,82 @@ import usePass from "@/hooks/usePass";
 import { useNavigate } from "react-router-dom";
 
 const TemplateBox = (props: any) => {
-  const info = props.data;
-  const isPass = usePass();
-  const navigate = useNavigate();
+	const info = props.data;
+	const isPass = usePass();
+	const navigate = useNavigate();
 
-  const addTemplateBlock = useCallback(
-    (id: string) => {
-      navigate(`/product/cadd/projectSubmitWork`, {
-        state: { id },
-      });
-    },
-    [navigate]
-  );
+	const addTemplateBlock = useCallback(
+		(id: string) => {
+			navigate(`/product/cadd/projectSubmitWork`, {
+				state: { id },
+			});
+		},
+		[navigate]
+	);
 
-  return (
-    <Box className={styles.templateBlock}>
-      <Box>
-        <Typography
-          sx={{
-            fontSize: "14px",
-            fontWeight: "600",
-            color: "#1E2633",
-            marginBottom: "4px",
-            overflow: "hidden",
-            textOverflow: "ellipsis",
-          }}
-        >
-          {info.title}
-        </Typography>
-        <Box sx={{ display: "flex", marginBottom: "8px" }}>
-          <Typography
-            sx={{
-              fontSize: "12px",
-              fontWeight: "400",
-              color: "#1370FF",
-              marginRight: "24px",
-            }}
-          >
-            版本：{info.version}
-          </Typography>
-          <Typography
-            sx={{ fontSize: "12px", fontWeight: "400", color: "#1370FF" }}
-          >
-            更新时间：{info.updateTime}
-          </Typography>
-        </Box>
-        <Typography className={styles.templateDescText}>
-          {info.description}
-        </Typography>
-      </Box>
-      <Box
-        sx={{
-          display: "flex",
-          justifyContent: "end",
-        }}
-      >
-        {isPass("PROJECT_WORKBENCH_FLOES_USE", "MANAGER") && (
-          <Button
-            size={"small"}
-            text={"删除模版"}
-            click={() => {
-              props.startDialog(info.id);
-            }}
-            style={{ backgroundColor: "#F0F2F5", color: "#565C66" }}
-          />
-        )}
-        {isPass("PROJECT_WORKBENCH_FLOES_USE", "USER") && (
-          <Button
-            size={"small"}
-            text={"使用模版"}
-            click={() => addTemplateBlock(info.id)}
-            style={{ marginLeft: "12px" }}
-          />
-        )}
-      </Box>
-    </Box>
-  );
+	return (
+		<Box className={styles.templateBlock}>
+			<Box>
+				<Typography
+					sx={{
+						fontSize: "14px",
+						fontWeight: "600",
+						color: "#1E2633",
+						marginBottom: "4px",
+						overflow: "hidden",
+						textOverflow: "ellipsis",
+					}}
+				>
+					{info.title}
+				</Typography>
+				<Box sx={{ display: "flex", marginBottom: "8px" }}>
+					<Typography
+						sx={{
+							fontSize: "12px",
+							fontWeight: "400",
+							color: "#1370FF",
+							marginRight: "24px",
+						}}
+					>
+						版本：{info.version}
+					</Typography>
+					<Typography
+						sx={{ fontSize: "12px", fontWeight: "400", color: "#1370FF" }}
+					>
+						更新时间：{info.updateTime}
+					</Typography>
+				</Box>
+				<Typography className={styles.templateDescText}>
+					{info.description}
+				</Typography>
+			</Box>
+			<Box
+				sx={{
+					display: "flex",
+					justifyContent: "end",
+				}}
+			>
+				{isPass("PROJECT_WORKBENCH_FLOES_USE", "MANAGER") && (
+					<Button
+						size={"small"}
+						text={"删除模版"}
+						click={() => {
+							props.startDialog(info.id);
+						}}
+						style={{ backgroundColor: "#F0F2F5", color: "#565C66" }}
+					/>
+				)}
+				{isPass("PROJECT_WORKBENCH_FLOES_USE", "USER") && (
+					<Button
+						size={"small"}
+						text={"使用模版"}
+						click={() => addTemplateBlock(info.id)}
+						style={{ marginLeft: "12px" }}
+					/>
+				)}
+			</Box>
+		</Box>
+	);
 };
 
 export default memo(TemplateBox);

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

 .headerBox {
-  margin-bottom: 20px;
+	margin-bottom: 20px;
 }
 
 .removeItemBox {
-  color: #ff4e4e;
-  margin-left: 32px;
-  cursor: pointer;
+	color: #ff4e4e;
+	margin-left: 32px;
+	cursor: pointer;
 }
 
 .tabBox {
-  width: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  margin-bottom: 24px;
+	width: 100%;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	margin-bottom: 24px;
 }
 
 .templateBlock {
-  width: 21.4876%;
-  height: 160px;
-  background: #FFFFFF;
-  border-radius: 4px;
-  border: 1px solid #EBEDF0;
-  padding: 16px 20px;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-  margin: 8px;
+	width: 21.4876%;
+	height: 160px;
+	background: #ffffff;
+	border-radius: 4px;
+	border: 1px solid #ebedf0;
+	padding: 16px 20px;
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
+	margin: 8px;
 }
 
 .addTemplateMask {
-  background: rgb(56, 56, 56, 0.7);
-  position: absolute;
-  z-index: 800;
-  top: 0%;
-  left: 0%;
-  width: 100%;
-  height: 100%;
-  display: flex;
-  align-items: end;
-  flex-direction: column;
+	background: rgb(56, 56, 56, 0.7);
+	position: absolute;
+	z-index: 800;
+	top: 0%;
+	left: 0%;
+	width: 100%;
+	height: 100%;
+	display: flex;
+	align-items: flex-end;
+	flex-direction: column;
 }
 
 .addTemplateBlock {
-  background: #FFFFFF;
-  z-index: 900;
-  border-radius: 16px 0px 0px 0px;
-  height: 100%;
-  width: 100%;
+	background: #ffffff;
+	z-index: 900;
+	border-radius: 16px 0px 0px 0px;
+	height: 100%;
+	width: 100%;
 }
 
 .addTemplateBox {
-  width: 16.8751%;
-  height: 114px;
-  background: #FFFFFF;
-  border-radius: 4px;
-  border: 1px solid #F0F2F5;
-  padding: 16px 20px;
-  margin: 8px;
-  cursor: pointer;
+	width: 16.8751%;
+	height: 114px;
+	background: #ffffff;
+	border-radius: 4px;
+	border: 1px solid #f0f2f5;
+	padding: 16px 20px;
+	margin: 8px;
+	cursor: pointer;
 }
 
 .addTemplateBox:hover {
-  box-shadow: 6px 8px 22px 0px rgba(0, 24, 57, 0.08);
+	box-shadow: 6px 8px 22px 0px rgba(0, 24, 57, 0.08);
 }
 
 .templateDescText {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 3;
-  display: -webkit-box;
-  height: 54px;
-  font-size: 12px !important;
-  font-weight: 400 !important;
-  color: #8A9099 !important;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	-webkit-box-orient: vertical;
+	-webkit-line-clamp: 3;
+	display: -webkit-box;
+	height: 54px;
+	font-size: 12px !important;
+	font-weight: 400 !important;
+	color: #8a9099 !important;
 }
 
 .addNewTemplate {
-  width: 380px;
-  height: 194px;
-  background: #FFFFFF;
-  border-radius: 4px;
-  border: 1px solid #EBEDF0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  flex-direction: column;
-  cursor: pointer;
-}
\ No newline at end of file
+	width: 380px;
+	height: 194px;
+	background: #ffffff;
+	border-radius: 4px;
+	border: 1px solid #ebedf0;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	flex-direction: column;
+	cursor: pointer;
+}

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

@@ -12,21 +12,17 @@ import OutlinedInput from "@mui/material/OutlinedInput";
 import SearchIcon from "@mui/icons-material/Search";
 import { toJS } from "mobx";
 import { observer } from "mobx-react-lite";
-// import Button from "@mui/material/Button";
 import Add from "@mui/icons-material/Add";
 
 import Button from "@/components/mui/Button";
 import useMyRequest from "@/hooks/useMyRequest";
 import TemplateBox from "./components/templateBox";
 import SimpleDialog from "./components/simpleDialog";
-// import AddTemplate from "./components/addTemplate";
 import AddTemplate from "./components/AddTemplate/index";
 import noData from "../../../../assets/project/noTemplate.svg";
 import {
 	getWorkbenchTemplate,
 	deleteWorkbenchTemplate,
-	getAddWorkbenchTemplate,
-	addWorkbenchTemplate,
 } from "@/api/workbench_api";
 import usePass from "@/hooks/usePass";
 import { useStores } from "@/store";
@@ -47,12 +43,6 @@ const ProjectMembers = observer(() => {
 	const [templateId, setTemplateId] = useState("");
 	/** 简单弹窗（删除模板） */
 	const [openDialog, setOpenDialog] = useState(false);
-	/** 增加模板 */
-	const [openAddTemplate, setOpenAddTemplate] = useState(false);
-	/** 可增加模板列表 */
-	const [addTemplateList, setAddTemplateList] = useState([]);
-	/** 已选择增加的模板列表 */
-	const [selectTemplateData, setSelectTemplateData] = useState<string[]>([]);
 	const [showAddTemplate, setShowAddTemplate] = useState(false);
 
 	// 获取模板列表
@@ -73,35 +63,12 @@ const ProjectMembers = observer(() => {
 		},
 	});
 
-	// 添加工作流模板-获取模板列表
-	const { run: getAddTemplateList } = useMyRequest(getAddWorkbenchTemplate, {
-		onSuccess: (result: any) => {
-			setAddTemplateList(result.data);
-			setOpenAddTemplate(true);
-		},
-	});
-
-	// 项目管理员-添加工作流模板-提交
-	const { run: addTemplate } = useMyRequest(addWorkbenchTemplate, {
-		onSuccess: (result: any) => {
-			setOpenAddTemplate(false);
-			getTemplateInfo({
-				projectId: currentProjectStore.currentProjectInfo.id as string,
-			});
-			setSelectTemplateData([]);
-		},
-	});
-
 	useEffect(() => {
 		getTemplateInfo({
 			projectId: currentProjectStore.currentProjectInfo.id as string,
 		});
 	}, [currentProjectStore.currentProjectInfo.id, getTemplateInfo]);
 
-	useEffect(() => {
-		console.log("projectIdData: ", projectIdData);
-	}, [projectIdData]);
-
 	/** 删除模板 */
 	const deleteTemplate = () => {
 		delTemplate({
@@ -124,44 +91,6 @@ const ProjectMembers = observer(() => {
 	/** 增加模板 */
 	const addTemplateBlock = () => {
 		setShowAddTemplate(true);
-		// getAddTemplateList({
-		// 	projectId: currentProjectStore.currentProjectInfo.id as string,
-		// 	productId: "cadd",
-		// });
-	};
-
-	/** 关闭增加模板 */
-	const closeAddTemplateBlock = () => {
-		setOpenAddTemplate(false);
-		setSelectTemplateData([]);
-	};
-
-	/** 增加模板操作 */
-	const addTemplateCallback = () => {
-		addTemplate({
-			projectId: currentProjectStore.currentProjectInfo.id as string,
-			workflowSpecIds: selectTemplateData,
-		});
-	};
-
-	/** 搜索模板 */
-	const searchTemplateNameCallback = (data: any) => {
-		getAddTemplateList({
-			projectId: currentProjectStore.currentProjectInfo.id as string,
-			productId: "cadd",
-			title: data,
-		});
-	};
-
-	const templateSelectCallback = (data: string) => {
-		let list: string[] = [...selectTemplateData];
-		if (selectTemplateData.filter((e) => e === data).length > 0) {
-			list = list.filter((e) => e !== data);
-			setSelectTemplateData(list);
-		} else {
-			list.push(data);
-			setSelectTemplateData(list);
-		}
 	};
 
 	const searchChange = (data: any) => {
@@ -171,11 +100,11 @@ const ProjectMembers = observer(() => {
 	useEffect(() => {
 		setTimeout(() => {
 			getTemplateInfo({
-				projectId: currentProjectStore.currentProjectInfo.id as string,
+				projectId: projectIdData as string,
 				title: templateName,
 			});
 		}, 300);
-	}, [templateName]);
+	}, [templateName, getTemplateInfo, projectIdData]);
 
 	return (
 		<Box className={styles.headerBox}>
@@ -256,16 +185,6 @@ const ProjectMembers = observer(() => {
 					</Box>
 				)}
 
-			{/* <AddTemplate
-				openAddTemplate={openAddTemplate}
-				closeAddTemplateBlock={closeAddTemplateBlock}
-				addTemplateList={addTemplateList}
-				templateSelectCallback={templateSelectCallback}
-				selectTemplateData={selectTemplateData}
-				addTemplateCallback={addTemplateCallback}
-				searchTemplateNameCallback={searchTemplateNameCallback}
-			/> */}
-
 			{showAddTemplate && (
 				<AddTemplate
 					setShowAddTemplate={setShowAddTemplate}

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

@@ -155,7 +155,7 @@ const Flow = (props: IProps) => {
 			const lineArr: IEdge[] = [];
 			tasks?.length &&
 				tasks.forEach((item) => {
-					lineArr.push(...item.edges);
+					item.edges?.length && lineArr.push(...item.edges);
 				});
 			/** 所有的输入节点ID */
 			const isInput = lineArr?.some((item) => item.target === id);
@@ -223,6 +223,7 @@ const Flow = (props: IProps) => {
 		const val: any = [];
 		tasks?.length &&
 			tasks.forEach((item) => {
+				console.log(item, "item");
 				val.push({
 					id: item.id,
 					type: item.type === "BATCH" ? "batchNode" : "flowNode",
@@ -249,7 +250,10 @@ const Flow = (props: IProps) => {
 							padding: isFlowNode(item.id) ? "20px" : "12px 20px",
 						},
 					},
-					position: { x: Number(item.position.x), y: Number(item.position.y) },
+					position: {
+						x: Number(item.position?.x) || 0,
+						y: Number(item.position?.y) || 0,
+					},
 					...(item.type === "BATCH" ? { style: { zIndex: -1 } } : {}),
 					...(item.parentNode ? { parentNode: item.parentNode } : {}),
 					...(item.type === "BATCH" ? { extent: "parent" } : {}),
@@ -270,13 +274,14 @@ const Flow = (props: IProps) => {
 		const val: ILine[] = [];
 		tasks?.length &&
 			tasks.forEach((item) => {
-				item.edges.forEach((every) => {
-					const newLine = {
-						...every,
-						batchId: item.parentNode ? item.parentNode : item.id,
-					};
-					val.push(newLine);
-				}, []);
+				item?.edges?.length &&
+					item?.edges.forEach((every) => {
+						const newLine = {
+							...every,
+							batchId: item.parentNode ? item.parentNode : item.id,
+						};
+						val.push(newLine);
+					}, []);
 			});
 		return val.map((item: ILine) => {
 			const newSelectId = selectedNodeId ? selectedNodeId : inSideNodeId;
@@ -340,7 +345,7 @@ const Flow = (props: IProps) => {
 		<ReactFlow
 			nodes={nodes}
 			edges={edges}
-			fitView={flowType === "default" ? false : true}
+			fitView={flowType === "default" ? true : false}
 			proOptions={{ hideAttribution: true, account: "" }}
 			nodeTypes={nodeTypes}
 			onPaneClick={handlePaneClick}

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

@@ -6,14 +6,12 @@ import { observer } from "mobx-react-lite";
 import { toJS } from "mobx";
 import cloneDeep from "lodash/cloneDeep";
 
-import { mockData } from "./mock";
 import { IOperatorItemProps, IOperatorListProps } from "./interface";
 import { ITask } from "@/views/Project/ProjectSubmitWork/interface";
 import useMyRequest from "@/hooks/useMyRequest";
 import { IResponse } from "@/api/http";
 import { fetchOperatorList } from "@/api/workbench_api";
 import { useStores } from "@/store";
-import { uuid } from "@/utils/util";
 
 import styles from "./index.module.css";
 import MyMenu from "@/components/mui/MyMenu";
@@ -26,19 +24,66 @@ import MyMenu from "@/components/mui/MyMenu";
  * @FilePath: /bkunyun/src/views/WorkFlowEdit/components/OperatorList/index.tsx
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
+
+let count = 1;
+
 const OperatorItem = (props: IOperatorItemProps) => {
 	const {
 		info: { title, description, tags },
 		setTemplateConfigInfo,
 		templateConfigInfo,
+		setOperatorListData,
+		operatorListData,
+		info,
 	} = props;
 	const [isDragStyle, setIsDragStyle] = useState<boolean>(false);
 
 	/** 拖拽开始 */
 	const onDragStart = useCallback(() => {
 		setIsDragStyle(true);
+		count++;
 	}, []);
 
+	/** 通过id查找相对的批流数组 */
+	const getBatchFlowArr = useCallback(
+		(id: string) => {
+			const newVal = operatorListData.filter((item) => {
+				return item.id === id || item.parentNode === id;
+			});
+			return newVal;
+		},
+		[operatorListData]
+	);
+
+	/** 生成批流副本 */
+	const getCopyBatchFlowArr = useCallback(
+		(arr: ITask[], x: number, y: number) => {
+			const newVal = arr.map((item) => {
+				const newEdges =
+					item?.edges &&
+					item?.edges.map((every) => {
+						return {
+							...every,
+							source: `${every.source}_${count}`,
+							target: `${every.target}_${count}`,
+						};
+					});
+				return {
+					...item,
+					id: `${item.id}_${count}`,
+					parentNode: item.parentNode ? `${item.parentNode}_${count}` : "",
+					position: {
+						x: item.type === "BATCH" ? x : item.position?.x,
+						y: item.type === "BATCH" ? y : item.position?.y,
+					},
+					edges: newEdges.length ? newEdges : item?.edges,
+				};
+			});
+			return newVal;
+		},
+		[]
+	);
+
 	/** 拖拽结束 */
 	const onDragEnd = useCallback(
 		(e: React.DragEvent<HTMLDivElement>) => {
@@ -55,27 +100,25 @@ const OperatorItem = (props: IOperatorItemProps) => {
 				clientX < lowerRightX &&
 				clientY < lowerRightY
 			) {
-				console.log(
+				const batchFlowArr = getBatchFlowArr(info.id);
+				const newBatchFlowArr = getCopyBatchFlowArr(
+					batchFlowArr,
 					clientX - upperLeftPointX,
-					clientY - upperLeftPointY,
-					"0000000"
+					clientY - upperLeftPointY
 				);
-				const newVal = [
-					...cloneDeep(templateConfigInfo),
-					{
-						...props.info,
-						uuid: uuid(),
-						position: {
-							x: clientX - upperLeftPointX,
-							y: clientY - upperLeftPointY,
-						},
-					},
-				];
+				const newVal = cloneDeep(templateConfigInfo);
+				newVal.push(...newBatchFlowArr);
 				setTemplateConfigInfo(newVal);
 			}
 			setIsDragStyle(false);
 		},
-		[props.info, setTemplateConfigInfo, templateConfigInfo]
+		[
+			getBatchFlowArr,
+			getCopyBatchFlowArr,
+			info.id,
+			setTemplateConfigInfo,
+			templateConfigInfo,
+		]
 	);
 
 	return (
@@ -105,7 +148,14 @@ const OperatorItem = (props: IOperatorItemProps) => {
 						</span>
 					);
 				})}
-				<MyMenu options={[]} value="dd">
+				<MyMenu
+					options={[
+						{ label: "1.1.0", value: "1.1.0" },
+						{ label: "1.2.0", value: "1.2.0" },
+						{ label: "1.3.0", value: "1.3.0" },
+					]}
+					value="1.1.0"
+				>
 					<div>ddd</div>
 				</MyMenu>
 			</div>
@@ -146,7 +196,6 @@ const OperatorList = observer((props: IOperatorListProps) => {
 			});
 		}
 	};
-
 	return (
 		<div className={styles.operatorListBox}>
 			<div className={styles.searchBox}>
@@ -163,12 +212,14 @@ const OperatorList = observer((props: IOperatorListProps) => {
 			</div>
 			<div className={styles.listBox}>
 				{operatorListData
-					// .filter((item) => item.type === "BATCH")
+					.filter((item) => item.type === "BATCH")
 					.map((item) => {
 						return (
 							<OperatorItem
 								key={item.id}
 								info={item}
+								setOperatorListData={setOperatorListData}
+								operatorListData={operatorListData}
 								templateConfigInfo={templateConfigInfo}
 								setTemplateConfigInfo={setTemplateConfigInfo}
 							/>

src/views/WorkFlowEdit/components/OperatorList/interface.ts

@@ -4,14 +4,16 @@ import { ITask } from "@/views/Project/ProjectSubmitWork/interface"
  * @Author: 吴永生#A02208 yongsheng.wu@wholion.com
  * @Date: 2022-07-06 15:32:11
  * @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
- * @LastEditTime: 2022-07-07 16:22:08
+ * @LastEditTime: 2022-07-08 16:05:21
  * @FilePath: /bkunyun/src/views/WorkFlowEdit/components/OperatorList/interface.ts
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
 export interface IOperatorItemProps {
     info: ITask
     setTemplateConfigInfo: (val: ITask[]) => void;
-    templateConfigInfo: ITask[]
+    templateConfigInfo: ITask[];
+    setOperatorListData: (val: ITask[]) => void;
+    operatorListData: ITask[]
 }
 
 export interface IOperatorListProps {

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

@@ -61,6 +61,63 @@
 	);
 	cursor: pointer;
 }
+
+.inOutBox {
+	margin-bottom: 20px;
+}
+
+.paramsTitle {
+	color: rgba(30, 38, 51, 1);
+	font-size: 14px;
+	line-height: 22px;
+	font-weight: 600;
+	margin-bottom: 12px;
+	display: flex;
+	justify-content: flex-start;
+	align-items: center;
+}
+
+.paramsTitleDesc {
+	margin-left: 8px;
+}
+
+.paramsList {
+	background-color: rgba(247, 248, 250, 1);
+	border-radius: 4px;
+	padding: 16px 20px;
+}
+
+.parameterBox {
+	margin-bottom: 12px;
+}
+.parameterBox:last-child {
+	margin-bottom: 0;
+}
+.parameterTop {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	margin-bottom: 8px;
+}
+.parameterleft {
+}
+.parameterName {
+	color: rgba(30, 38, 51, 1);
+	font-size: 14px;
+	line-height: 22px;
+	font-weight: 600;
+}
+.required::after {
+	content: "*";
+	color: rgba(255, 78, 78, 1);
+	margin-left: 4px;
+}
+.parameterdataType {
+	color: rgba(138, 144, 153, 1);
+	font-size: 12px;
+	line-height: 20px;
+}
+
 .noData {
 	height: calc(100vh - 140px);
 	display: flex;

src/views/demo/index.tsx

 import { useMessage } from "@/components/MySnackbar";
-import usePass from "@/hooks/usePass";
+// import usePass from "@/hooks/usePass";
 import { operation, route } from "@/router";
 import { Button } from "@mui/material";
 import { Box } from "@mui/system";
 import { useEffect } from "react";
 
 const Demo = ({
-  childrenRoutes,
+	childrenRoutes,
 }: {
-  childrenRoutes?: Array<route | operation>;
+	childrenRoutes?: Array<route | operation>;
 }) => {
-  const message = useMessage();
-  const isPass = usePass();
+	const message = useMessage();
+	// const isPass = usePass();
 
-  useEffect(() => {
-    console.log(isPass("PROJECT_OVERIVEW_CREATE"), "11111111111");
-    console.log(isPass("PROJECT_SUMMARY_MEMBER"), "2222222");
-    console.log(isPass("test"), "33333");
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+	useEffect(() => {
+		// console.log(isPass("PROJECT_OVERIVEW_CREATE"), "11111111111");
+		// console.log(isPass("PROJECT_SUMMARY_MEMBER"), "2222222");
+		// console.log(isPass("test"), "33333");
+		// eslint-disable-next-line react-hooks/exhaustive-deps
+	}, []);
 
-  return (
-    <Box>
-      <Box>{JSON.stringify(childrenRoutes)}</Box>
-      <Box>{JSON.stringify(process.env.NODE_ENV)}</Box>
-      <Button onClick={() => message.success("测试测试")}>message测试</Button>
-    </Box>
-  );
+	return (
+		<Box>
+			<Box>{JSON.stringify(childrenRoutes)}</Box>
+			<Box>{JSON.stringify(process.env.NODE_ENV)}</Box>
+			<Button onClick={() => message.success("测试测试")}>message测试</Button>
+		</Box>
+	);
 };
 
 export default Demo;

src/views/mui_demo/input.tsx

-import { memo, useCallback, useEffect, useMemo, useState } from "react";
-import _ from "lodash";
-import { IResponse, useHttp } from "@/api/http";
-import { useStores } from "@/store";
-import DeleteIcon from '@mui/icons-material/Delete';
-import { InputAdornment } from '@mui/material';
+import { memo } from "react";
+import { InputAdornment } from "@mui/material";
 import InputComponent from "@/components/mui/Input";
 
 const ProjectMembers = () => {
-    const http = useHttp();
-
-    const { currentProjectStore } = useStores();
-
-    useEffect(() => {
-
-    }, []);
-
-
-    return (
-        <>
-
-            <InputComponent
-                fullWidth={false}
-                label={"test"}
-                defaultValue={"sssssssss"}
-                size={'large'}
-            />
-            &nbsp;&nbsp;&nbsp;&nbsp;
-            <InputComponent
-                fullWidth={false}
-                label={"test"}
-                error={true}
-                helperText={"你还急急急靠靠靠靠靠靠靠靠靠靠靠靠靠靠"}
-            />&nbsp;&nbsp;&nbsp;&nbsp;
-            <InputComponent
-                fullWidth={false}
-                label={"test"}
-                size={'small'}
-                disabled
-            />&nbsp;&nbsp;&nbsp;&nbsp;
-            <InputComponent
-                fullWidth={false}
-                label={"xsmall"}
-                size={'xsmall'}
-            />&nbsp;&nbsp;&nbsp;&nbsp;
-            <InputComponent
-                fullWidth={false}
-                placeholder={"测试机哦"}
-                endAdornment={<InputAdornment position="end">11&nbsp;&nbsp;</InputAdornment>}
-            />&nbsp;&nbsp;&nbsp;&nbsp;
-            <InputComponent fullWidth={false} size={"small"} placeholder={"xxxxxx"} endAdornment={<InputAdornment position="end">11&nbsp;&nbsp;</InputAdornment>} />
-            <br /> <br />
-            <InputComponent
-                fullWidth={true}
-                select={
-                    {
-                        json: [{value:'1',label:"2"},{value:'3',label:"4"}]
-                    }
-                }
-            />
-            <br /><br />
-            {/* <SelectComponent
+	return (
+		<>
+			<InputComponent
+				fullWidth={false}
+				label={"test"}
+				defaultValue={"sssssssss"}
+				size={"large"}
+			/>
+			&nbsp;&nbsp;&nbsp;&nbsp;
+			<InputComponent
+				fullWidth={false}
+				label={"test"}
+				error={true}
+				helperText={"你还急急急靠靠靠靠靠靠靠靠靠靠靠靠靠靠"}
+			/>
+			&nbsp;&nbsp;&nbsp;&nbsp;
+			<InputComponent
+				fullWidth={false}
+				label={"test"}
+				size={"small"}
+				disabled
+			/>
+			&nbsp;&nbsp;&nbsp;&nbsp;
+			<InputComponent fullWidth={false} label={"xsmall"} size={"xsmall"} />
+			&nbsp;&nbsp;&nbsp;&nbsp;
+			<InputComponent
+				fullWidth={false}
+				placeholder={"测试机哦"}
+				endAdornment={
+					<InputAdornment position="end">11&nbsp;&nbsp;</InputAdornment>
+				}
+			/>
+			&nbsp;&nbsp;&nbsp;&nbsp;
+			<InputComponent
+				fullWidth={false}
+				size={"small"}
+				placeholder={"xxxxxx"}
+				endAdornment={
+					<InputAdornment position="end">11&nbsp;&nbsp;</InputAdornment>
+				}
+			/>
+			<br /> <br />
+			<InputComponent
+				fullWidth={true}
+				select={{
+					json: [
+						{ value: "1", label: "2" },
+						{ value: "3", label: "4" },
+					],
+				}}
+			/>
+			<br />
+			<br />
+			{/* <SelectComponent
                 option={json}
             />
             <br /><br />
@@ -72,10 +69,10 @@ const ProjectMembers = () => {
                 option={json}
                 size={"small"}
             /> */}
-            <br /><br />
-
-        </>
-    );
+			<br />
+			<br />
+		</>
+	);
 };
 
 export default memo(ProjectMembers);