Commit bf2eb6ce authored by wuyongsheng's avatar wuyongsheng

Merge branch 'feat-20220801' of http://120.77.149.83/root/bkunyun into feat-20220801

parents 21ab45ae 5522d3b7
......@@ -122,12 +122,16 @@ const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
"& .MuiPaper-root": {
// 设置最大宽度, 实际宽度让子元素撑大
maxWidth: "1920px",
borderRadius: "8px"
},
},
}}
>
{isHideHeader ? null : (
<DialogTitle id="alert-dialog-title">
<DialogTitle
id="alert-dialog-title"
sx={{ padding: "20px 24px" }}
>
<div
style={{
display: "flex",
......@@ -136,10 +140,10 @@ const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
fontWeight: 600,
}}
>
<span style={{fontSize: 16, lineHeight: '24px', color: '#1E2633'}}>{title}</span>
<span style={{ fontSize: 16, lineHeight: '24px', color: '#1E2633' }}>{title}</span>
<CloseIcon
onClick={onClose}
sx={{ color: "#C2C6CC", cursor: "pointer", ":hover": { background: "#f0f2f5", borderRadius:'2px' } }}
sx={{ color: "#C2C6CC", cursor: "pointer", ":hover": { background: "#f0f2f5", borderRadius: '2px' } }}
/>
</div>
</DialogTitle>
......
......@@ -68,7 +68,8 @@ const MyPopconfirm = (props: IMyPopconfirmProps) => {
zIndex: 2000,
bgcolor: "#fff",
minWidth: "200px",
borderRadius: "2px",
borderRadius: "4px",
fontSize:"14px",
padding: "20px 16px",
boxShadow: "0px 3px 10px 0px rgba(0, 24, 57, 0.14)",
}}
......
......@@ -81,3 +81,12 @@
height: 2px;
background-color: rgba(86, 92, 102, 1);
}
.loading {
display: flex;
justify-content: center;
align-items: center;
line-height: 20px;
font-size: 12px;
color: rgba(86, 92, 102, 1);
padding: 4px;
}
......@@ -5,6 +5,7 @@ import cloneDeep from "lodash/cloneDeep";
import { getScrollLoader } from "@/utils/util";
import { useState, useCallback, useEffect } from "react";
import { getOperatorList } from "@/api/project_api";
import CircularProgress from "@mui/material/CircularProgress";
import useMyRequest from "@/hooks/useMyRequest";
import { useStores } from "@/store";
import { toJS } from "mobx";
......@@ -17,7 +18,6 @@ type IProps = {
setOperatorList: any;
};
let isInRequest = false;
const OperatorList = (props: IProps) => {
const { operatorList, setOperatorList } = props; // 流程图中流算子列表
const { currentProjectStore } = useStores();
......@@ -27,11 +27,9 @@ const OperatorList = (props: IProps) => {
const [dragItem, setDragItem] = useState<any>({}); // 拖拽的算子
const [page, setPage] = useState(0); //
const [isLastPage, setIsLastPage] = useState(false);
const { run: getOperatorListRun } = useMyRequest(getOperatorList, {
// todo 加载中 没有更多了样式
const { run: getOperatorListRun, loading } = useMyRequest(getOperatorList, {
onSuccess: (res) => {
isInRequest = false;
console.log("res", res);
let arr = res?.data?.content;
setIsLastPage(res?.data?.last);
arr.forEach((item: any, index: number) => {
......@@ -42,7 +40,7 @@ const OperatorList = (props: IProps) => {
classTypeName: "String",
defaultValue: null,
description: "",
domType: "INPUT",
domType: "dataset",
hidden: false,
isnull: false,
level: null,
......@@ -65,7 +63,7 @@ const OperatorList = (props: IProps) => {
classTypeName: "String",
defaultValue: null,
description: "",
domType: "INPUT",
domType: "dataset",
hidden: false,
isnull: false,
level: null,
......@@ -81,26 +79,20 @@ const OperatorList = (props: IProps) => {
validators: [],
});
});
setList(arr);
setList([...list, ...arr]);
// setList(res?.data?.content || []);
},
onError: () => {
isInRequest = false;
},
});
const getOperatorListFun = useCallback(
(keyword: string = "", page = 0) => {
if (isInRequest) {
return;
} else {
getOperatorListRun({
productId: productId as string,
keyword,
page,
size: 5,
});
}
// size: 20 todo
},
[productId, getOperatorListRun]
);
......@@ -109,8 +101,15 @@ const OperatorList = (props: IProps) => {
getOperatorListFun();
}, [getOperatorListFun]);
const keywordChange = (e: any) => {
if (e.target.value.length <= 30) {
setKeyword(e.target.value);
}
};
const handleKeywordKeyUp = (e: any) => {
if (e.keyCode === 13) {
setList([]);
setKeyword(e.target.value);
setPage(0);
getOperatorListFun(e.target.value, 0);
......@@ -170,7 +169,7 @@ const OperatorList = (props: IProps) => {
const handleScroll = (e: any) => {
if (getScrollLoader(e)) {
console.log("加载1");
if (isInRequest || isLastPage) {
if (loading || isLastPage) {
return;
} else {
console.log("加载2");
......@@ -316,8 +315,8 @@ const OperatorList = (props: IProps) => {
<InputBase
className={styles.searchInput}
placeholder="请输入算子名称"
// value={keyword}
// onChange={keywordChange}
value={keyword}
onChange={keywordChange}
onKeyUp={handleKeywordKeyUp}
/>
</div>
......@@ -341,6 +340,19 @@ const OperatorList = (props: IProps) => {
</div>
);
})}
{!loading && (
<div className={styles.loading}>
<CircularProgress
size={12}
sx={{
color: "rgba(19, 112, 255, 1)",
marginRight: "8px",
}}
/>
加载中...
</div>
)}
{!isLastPage && <div className={styles.loading}>已经到底了</div>}
</div>
</div>
);
......
......@@ -2,46 +2,40 @@ import { saveUserSpec } from "@/api/workbench_api";
import MyDialog from "@/components/mui/MyDialog";
import MyInput from "@/components/mui/MyInput";
import { checkIsNumberLetterChinese } from "@/utils/util";
import _ from "lodash";
import { useState } from "react";
import useMyRequest from "@/hooks/useMyRequest";
import { saveBatchActor } from "@/api/project_api";
import { useStores } from "@/store";
import styles from "./index.module.css";
// import styles from "./index.module.css";
import { useMessage } from "@/components/MySnackbar";
import { toJS } from "mobx";
import { ITask } from "@/views/Project/ProjectSubmitWork/interface";
interface IProps {
saveFormDialog: boolean;
setSaveFormDialog: (val: boolean) => void;
onBack?: () => void;
title: string;
setTitle: (val: string) => void;
version: string;
setVersion: (val: string) => void;
description: string;
setDescription: (val: string) => void;
creator?: string;
templateConfigInfo: ITask[];
id?: string;
operatorList: ITask[];
}
const SaveOperator = (props: IProps) => {
const {
saveFormDialog,
setSaveFormDialog,
onBack,
title,
setTitle,
version,
setVersion,
description,
setDescription,
templateConfigInfo,
creator,
id,
} = props;
const { saveFormDialog, setSaveFormDialog, operatorList } = props;
const { currentProjectStore } = useStores();
const Message = useMessage();
const productId = toJS(currentProjectStore.currentProductInfo.id);
const [title, setTitle] = useState("");
const [version, setVersion] = useState("1.0.0");
const [description, setDescription] = useState("");
// 保存批算子
const { run: saveBatchActorRun } = useMyRequest(saveBatchActor, {
onSuccess: (res) => {
Message.success("保存算子成功");
setSaveFormDialog(false);
sessionStorage.setItem("operatorList", "[]");
console.log("res", res);
},
});
const [titleHelper, setTitleHelper] = useState({
// 算子名称错误提示
error: false,
......@@ -53,14 +47,6 @@ const SaveOperator = (props: IProps) => {
helperText: "",
});
// 算子保存方法
const { run: saveUserSpecRun } = useMyRequest(saveUserSpec, {
onSuccess: (res) => {
Message.success("保存成功!");
onBack && onBack();
},
});
// 关闭表单弹窗
const handleCloseDialog = () => {
setSaveFormDialog(false);
......@@ -124,6 +110,7 @@ const SaveOperator = (props: IProps) => {
error: false,
helperText: "",
});
return true;
} else {
setVersionHelper({
error: true,
......@@ -133,28 +120,63 @@ const SaveOperator = (props: IProps) => {
}
};
// 坐标转换
const positionTransform = () => {
const copyOperatorList: ITask[] = _.cloneDeep(operatorList);
const positionXArr = copyOperatorList.map((operatorLi) => {
return operatorLi.position.x;
});
const positionYArr = copyOperatorList.map((operatorLi) => {
return operatorLi.position.y;
});
let minPositionX = Math.min(...positionXArr);
let minPositionY = Math.min(...positionYArr);
let startingPointX = minPositionX - 40;
let startingPointY = minPositionY - 10;
return copyOperatorList.map((operatorLi) => {
return {
...operatorLi,
position: {
x: operatorLi.position.x - startingPointX,
y: operatorLi.position.y - startingPointY,
},
};
});
};
// 表单弹窗确定,新建算子
const handleOncofirm = () => {
console.log(operatorList);
if (checkTitle(title) && checkVersion(version)) {
if (id) {
saveUserSpecRun({
title,
version,
description,
tasks: templateConfigInfo,
productId,
id,
creator,
});
} else {
saveUserSpecRun({
title,
version,
description,
tasks: templateConfigInfo,
productId,
saveBatchActorRun({
query: {
productId: productId as string,
batchName: title,
batchVersion: version,
description: description,
},
body: positionTransform(),
});
}
// operatorList
// if (id) {
// saveUserSpecRun({
// title,
// version,
// description,
// tasks: templateConfigInfo,
// productId,
// id,
// creator,
// });
// } else {
// saveUserSpecRun({
// title,
// version,
// description,
// tasks: templateConfigInfo,
// productId,
// });
// }
}
};
......@@ -165,7 +187,7 @@ const SaveOperator = (props: IProps) => {
onClose={handleCloseDialog}
onConfirm={handleOncofirm}
>
<div className={styles.saveBox}>
<div style={{ width: "388px" }}>
<MyInput
value={title}
label="算子名称"
......@@ -174,7 +196,6 @@ const SaveOperator = (props: IProps) => {
error={titleHelper.error}
helperText={titleHelper.helperText}
style={{ margin: "20px 0" }}
disabled={id ? true : false}
></MyInput>
<MyInput
value={version}
......
......@@ -4,12 +4,9 @@ import FullScreenDrawer from "@/components/CommonComponents/FullScreenDrawer";
import MyButton from "@/components/mui/MyButton";
import OperatorList from "./components/OperatorList";
// import Flow from "../Project/components/Flow";
import useMyRequest from "@/hooks/useMyRequest";
import { saveBatchActor } from "@/api/project_api";
import { useMessage } from "@/components/MySnackbar";
import { useStores } from "@/store";
import BatchOperatorFlow from "../Project/components/Flow/components/BatchOperatorFlow";
import { toJS } from "mobx";
import SaveOperator from "./components/SaveOperator";
import { ITask } from "../Project/ProjectSubmitWork/interface";
import _ from "lodash";
import styles from "./index.module.css";
......@@ -21,9 +18,13 @@ type IProps = {
const CustomOperator = observer((props: IProps) => {
const { setShowCustomOperator } = props;
const Message = useMessage();
const [operatorList, setOperatorList] = useState<ITask[]>([]);
const { currentProjectStore } = useStores();
const productId = toJS(currentProjectStore.currentProductInfo.id);
const sessionStorageOperatorList = JSON.parse(
sessionStorage.getItem("operatorList") || "[]"
);
const [operatorList, setOperatorList] = useState<ITask[]>(
sessionStorageOperatorList
);
const [saveFormDialog, setSaveFormDialog] = useState(false);
// const [showCustomOperator, setShowCustomOperator] = useState(false);
/** 设置选中唯一标识符 */
......@@ -32,25 +33,6 @@ const CustomOperator = observer((props: IProps) => {
// console.log(val);
}, []);
// 保存批算子
const { run: saveBatchActorRun } = useMyRequest(saveBatchActor, {
onSuccess: (res) => {
console.log("res", res);
},
});
const handleSave = useCallback(() => {
saveBatchActorRun({
query: {
productId: productId as string,
batchName: "123456",
batchVersion: "1.0.0",
description: "",
},
body: [],
});
}, [saveBatchActorRun, productId]);
// 判断 每个流算子必须至少有一条连接线。
const checkHasOneLine = (sourceArr: string[], targetArr: string[]) => {
const all = _.uniq([...sourceArr, ...targetArr]);
......@@ -124,6 +106,10 @@ const CustomOperator = observer((props: IProps) => {
return check;
};
useEffect(() => {
sessionStorage.setItem("operatorList", JSON.stringify(operatorList));
}, [operatorList]);
const handleCheck = () => {
if (operatorList.length === 0) {
Message.error("内容不能为空!");
......@@ -137,18 +123,25 @@ const CustomOperator = observer((props: IProps) => {
edge.target && targetArr.push(edge.target);
});
});
console.log("operatorList", operatorList);
console.log("sourceArr", sourceArr);
console.log("targetArr", targetArr);
if (!checkHasOneLine([...sourceArr], [...targetArr])) {
console.log("checkHasOneLine");
Message.error("内容校验未通过,请检查!");
return;
}
if (!checkIn([...targetArr])) {
console.log("checkIn");
Message.error("内容校验未通过,请检查!");
return;
}
if (!checkOut([...sourceArr])) {
console.log("checkOut");
Message.error("内容校验未通过,请检查!");
return;
}
setSaveFormDialog(true);
};
return (
......@@ -162,6 +155,11 @@ const CustomOperator = observer((props: IProps) => {
handleCheck();
}}
></MyButton>
<SaveOperator
saveFormDialog={saveFormDialog}
setSaveFormDialog={setSaveFormDialog}
operatorList={operatorList}
></SaveOperator>
</div>
<div className={styles.coContent} id="customOperatorFlow">
<OperatorList
......
......@@ -62,7 +62,7 @@ const MenuLayout = observer(() => {
onClick={() => item.type === "page" && navigate(item.path)}
>
<img className={style.routerIcon} src={routerIcon(item.id || '', `/v3${item.path}` === pathname) || undefined} alt='' />
<span style={{ verticalAlign: 'middle' }}>{item.name}</span>
<span style={{ verticalAlign: 'middle', fontWeight: '500' }}>{item.name}</span>
</li>
);
}
......
......@@ -97,7 +97,7 @@ const AddFolder = (props: IAddFolderProps) => {
<MyButton
text="新建文件夹"
variant="outlined"
size="small"
size="medium"
onClick={() => setDeleteDialogOpen(true)}
disabled={
selectIds.length !== 0 || !isPass("PROJECT_DATA_ADDDIR", "USER")
......
......@@ -515,7 +515,7 @@ const ProjectData = observer(() => {
<MyButton
text="上传文件"
variant="contained"
size="small"
size="medium"
style={{ marginRight: "12px" }}
onClick={() => setUploaderDialogOpen(true)}
disabled={
......
......@@ -17,7 +17,7 @@
line-height: 22px;
font-size: 14px;
font-weight: 550;
margin-bottom: 12px;
margin-bottom: 8px;
}
.projectInfoName::after {
content: "*";
......
......@@ -429,6 +429,9 @@ const BaseInfo = observer(() => {
className={style.updateButton}
onClick={handleClickUpdate}
loading={updateLoading}
sx={{
height:"32px"
}}
>
保存修改
</LoadingButton>
......
......@@ -164,7 +164,7 @@ const ProjectMembers = observer(() => {
variant="contained"
onClick={onAddMember}
startIcon={<Add />}
size="small"
size="medium"
/>
) : null}
</Box>
......
......@@ -28,6 +28,7 @@ const TemplateBox = (props: any) => {
);
return (
<Box className={styles.template}>
<Box className={styles.templateBlock}>
<Box>
<Box
......@@ -92,8 +93,8 @@ const TemplateBox = (props: any) => {
>
{isPass("PROJECT_WORKBENCH_FLOES_USE", "MANAGER") && (
<MyButton
size={"small"}
text={"删除模版"}
size="medium"
text="删除模版"
onClick={() => {
props.startDialog(info.id);
}}
......@@ -102,14 +103,15 @@ const TemplateBox = (props: any) => {
)}
{isPass("PROJECT_WORKBENCH_FLOES_USE", "USER") && (
<MyButton
size={"small"}
text={"使用模版"}
size="medium"
text="使用模版"
onClick={() => addTemplateBlock(info.id)}
style={{ marginLeft: "12px" }}
/>
)}
</Box>
</Box>
</Box>
);
};
......
......@@ -16,10 +16,15 @@
margin-bottom: 24px;
}
.template {
padding: 0 8px;
box-sizing: border-box;
}
.templateBlock {
height: 194px;
background: #ffffff;
box-shadow: 0px 3px 10px 0px rgba(0,24,57,0.0400);
box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.0400);
border-radius: 4px;
border: 1px solid #ebedf0;
padding: 16px 20px;
......@@ -32,32 +37,20 @@
}
@media screen and (max-width:1220px) {
.templateBlock {
width: 49%;
margin-right: 2%;
}
.templateBlock:nth-child(2n){
margin-right: 0;
.template {
width: 50%;
}
}
@media screen and (min-width:1220px) and (max-width:1600px) {
.templateBlock {
width: 32.423%;
margin-right: 1.365%;
}
.templateBlock:nth-child(3n){
margin-right: 0;
.template {
width: 33.33333%;
}
}
@media screen and (min-width:1600px) {
.templateBlock {
width: 24%;
margin-right: 1.333%;
}
.templateBlock:nth-child(4n){
margin-right: 0;
.template {
width: 25%;
}
}
......
......@@ -121,7 +121,7 @@ const ProjectMembers = observer(() => {
text={"添加工作流模版"}
img={<Add />}
onClick={addTemplateBlock}
size={"small"}
size={"medium"}
/>
)}
</Box>
......@@ -145,7 +145,7 @@ const ProjectMembers = observer(() => {
</Box>
)}
{templateList.length > 0 && (
<Box sx={{ display: "flex", flexWrap: "wrap" }}>
<Box sx={{ display: "flex", flexWrap: "wrap", margin:"0 -8px" }}>
{templateList &&
templateList.length > 0 &&
templateList.map((item, key) => {
......
......@@ -229,7 +229,7 @@ const SaveCustomTemplate = (props: IProps) => {
required
error={titleHelper.error}
helperText={titleHelper.helperText}
style={{ margin: "20px 0" }}
style={{ margin: "8px 0 20px" }}
disabled={id ? true : false}
></MyInput>
<MyInput
......
......@@ -237,6 +237,7 @@ const WorkFlowEdit = observer((props: IProps) => {
anchorEl={anchorEl}
onCancel={handleCancel}
onConfirm={handleConfirm}
placement="bottom-end"
/>
{saveFormDialog && (
<SaveCustomTemplate
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment