Skip to content

B
bkunyun
Commit 52c8279d authored by wuyongsheng's avatar wuyongsheng
1 Browse files
Options

Merge branch 'feat-20220801' into 'master' 

Feat 20220801

See merge request !78
parents 1d752bdf c7f631b9
Hide whitespace changes
Inline Side-by-side
Showing with 890 additions and 740 deletions
src/api/api_prefix.ts
View file @ 52c8279d
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:17:48
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-18 15:44:35
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-30 16:22:15
* @FilePath: /bkunyun/src/api/api_prefix.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -36,7 +36,7 @@ switch (process.env.REACT_APP_ENV) {
BACKEND_API_URI_PREFIX = "https://www.cloudam.cn";
}
else {
BACKEND_API_URI_PREFIX = "http://47.57.4.97";
BACKEND_API_URI_PREFIX = "http://47.75.104.171";
}
break;
}
......
src/assets/project/refresh.svg 0 → 100644
View file @ 52c8279d
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>刷新备份</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="刷新备份">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<path d="M14.1034483,5.0750097 L12.3103448,6.87501758 C11.862069,4.9250128 10.0689767,3.42499873 7.97701897,3.42499873 C5.51150172,3.42499873 3.49426034,5.45000759 3.49426034,7.92501842 C3.49426034,10.3999842 5.51150172,12.4249931 7.97701897,12.4249931 C10.3678534,12.4249931 12.3850948,10.5500599 12.4597328,8.15001941 L13.8045603,6.8000135 C13.8793103,7.17501139 13.9540603,7.55002053 13.9540603,8.0000225 C13.9540603,11.2999882 11.2644052,14 7.97701897,14 C4.68965517,14 2,11.2999882 2,8.0000225 C2,4.70001181 4.68965517,2 7.97701897,2 C9.91954397,2 11.712681,2.97499677 12.7586207,4.40000675 L12.9080086,4.17500577 L15,4.17500577 L14.1034483,5.0750097 Z" id="路径" fill="#8A9099"></path>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/project/workbenchList.svg
View file @ 52c8279d
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/任务列表</title>
<defs>
<filter color-interpolation-filters="auto" id="filter-1">
<feColorMatrix in="SourceGraphic" type="matrix" values="0 0 0 0 0.760000 0 0 0 0 0.776000 0 0 0 0 0.800000 0 0 0 1.000000 0"></feColorMatrix>
</filter>
</defs>
<title>1.Base基础/Icon图标/任务列表备份</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="工作台（管理员）空" transform="translate(-370.000000, -245.000000)">
<g id="编组-5" transform="translate(370.000000, 242.000000)">
<g id="1.Base基础/Icon图标/任务列表" transform="translate(0.000000, 3.000000)">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g filter="url(#filter-1)" id="编组-4">
<g transform="translate(0.500000, 0.000000)">
<path d="M7.38809691,0.889939751 C7.45764437,0.855744844 7.53911808,0.85573765 7.60867158,0.889920274 L7.60867158,0.889920274 L14.1102244,4.08516037 C14.1529938,4.10617975 14.187927,4.13844408 14.2121677,4.17736742 C14.2364085,4.21629077 14.2499569,4.26187312 14.2499569,4.30952854 L14.2499569,4.30952854 L14.2499569,11.9840447 C14.2499569,12.0332683 14.2355127,12.0802004 14.2098426,12.119868 C14.1841726,12.1595356 14.1472766,12.1919385 14.1023731,12.2121037 L14.1023731,12.2121037 L7.60081331,15.1318104 C7.53565621,15.161071 7.46109499,15.1610648 7.39594277,15.1317934 L7.39594277,15.1317934 L0.897545722,12.2122049 C0.852652465,12.1920353 0.815766035,12.1596329 0.790102919,12.1199688 C0.764439802,12.0803047 0.75,12.033379 0.75,11.984163 L0.75,11.984163 L0.75,4.30940599 C0.75,4.26175853 0.763543923,4.21618307 0.78777749,4.17726362 L0.78777749,4.17726362 Z" id="路径-15" stroke="#979797" stroke-width="1.5"></path>
<polyline id="路径-20" stroke="#979797" stroke-width="1.5" points="1.29720478 4.56847209 7.47016174 7.45 13.6431187 4.56847209"></polyline>
<line x1="7.47016174" y1="7.39513959" x2="7.47016174" y2="14.8580198" id="路径-21" stroke="#979797" stroke-width="1.5"></line>
</g>
</g>
</g>
<g id="1.Base基础/Icon图标/任务列表备份">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(0.500000, 0.000000)" stroke="#C2C6CC" stroke-width="1.5">
<path d="M7.38809691,0.889939751 L14.1102244,4.08516037 L14.2499569,11.9840447 L7.60081331,15.1318104 L0.897545722,12.2122049 L0.75,4.30940599 L7.38809691,0.889939751 Z" id="路径-15"></path>
<polyline id="路径-20" points="1.29720478 4.56847209 7.47016174 7.45 13.6431187 4.56847209"></polyline>
<line x1="7.47016174" y1="7.39513959" x2="7.47016174" y2="14.8580198" id="路径-21"></line>
</g>
</g>
</g>
......
src/assets/project/workbenchList_hover.svg 0 → 100644
View file @ 52c8279d
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/任务列表备份 3</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="1.Base基础/Icon图标/任务列表备份">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(0.500000, 0.000000)" stroke="#1E2633" stroke-width="1.5">
<path d="M7.38809691,0.889939751 L14.1102244,4.08516037 L14.2499569,11.9840447 L7.60081331,15.1318104 L0.897545722,12.2122049 L0.75,4.30940599 L7.38809691,0.889939751 Z" id="路径-15"></path>
<polyline id="路径-20" points="1.29720478 4.56847209 7.47016174 7.45 13.6431187 4.56847209"></polyline>
<line x1="7.47016174" y1="7.39513959" x2="7.47016174" y2="14.8580198" id="路径-21"></line>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/project/workbenchList_select.svg
View file @ 52c8279d
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/任务列表</title>
<defs>
<filter color-interpolation-filters="auto" id="filter-1">
<feColorMatrix in="SourceGraphic" type="matrix" values="0 0 0 0 0.076000 0 0 0 0 0.440000 0 0 0 0 1.000000 0 0 0 1.000000 0"></feColorMatrix>
</filter>
</defs>
<title>1.Base基础/Icon图标/任务列表备份 2</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="任务列表" transform="translate(-370.000000, -245.000000)">
<g id="编组-5" transform="translate(370.000000, 242.000000)">
<g id="1.Base基础/Icon图标/任务列表" transform="translate(0.000000, 3.000000)">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g filter="url(#filter-1)" id="编组-4">
<g transform="translate(0.500000, 0.000000)">
<path d="M7.38809691,0.889939751 C7.45764437,0.855744844 7.53911808,0.85573765 7.60867158,0.889920274 L7.60867158,0.889920274 L14.1102244,4.08516037 C14.1529938,4.10617975 14.187927,4.13844408 14.2121677,4.17736742 C14.2364085,4.21629077 14.2499569,4.26187312 14.2499569,4.30952854 L14.2499569,4.30952854 L14.2499569,11.9840447 C14.2499569,12.0332683 14.2355127,12.0802004 14.2098426,12.119868 C14.1841726,12.1595356 14.1472766,12.1919385 14.1023731,12.2121037 L14.1023731,12.2121037 L7.60081331,15.1318104 C7.53565621,15.161071 7.46109499,15.1610648 7.39594277,15.1317934 L7.39594277,15.1317934 L0.897545722,12.2122049 C0.852652465,12.1920353 0.815766035,12.1596329 0.790102919,12.1199688 C0.764439802,12.0803047 0.75,12.033379 0.75,11.984163 L0.75,11.984163 L0.75,4.30940599 C0.75,4.26175853 0.763543923,4.21618307 0.78777749,4.17726362 L0.78777749,4.17726362 Z" id="路径-15" stroke="#979797" stroke-width="1.5"></path>
<polyline id="路径-20" stroke="#979797" stroke-width="1.5" points="1.29720478 4.56847209 7.47016174 7.45 13.6431187 4.56847209"></polyline>
<line x1="7.47016174" y1="7.39513959" x2="7.47016174" y2="14.8580198" id="路径-21" stroke="#979797" stroke-width="1.5"></line>
</g>
</g>
</g>
<g id="1.Base基础/Icon图标/任务列表备份-2">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(0.500000, 0.000000)" stroke="#1370FF" stroke-width="1.5">
<path d="M7.38809691,0.889939751 L14.1102244,4.08516037 L14.2499569,11.9840447 L7.60081331,15.1318104 L0.897545722,12.2122049 L0.75,4.30940599 L7.38809691,0.889939751 Z" id="路径-15"></path>
<polyline id="路径-20" points="1.29720478 4.56847209 7.47016174 7.45 13.6431187 4.56847209"></polyline>
<line x1="7.47016174" y1="7.39513959" x2="7.47016174" y2="14.8580198" id="路径-21"></line>
</g>
</g>
</g>
......
src/assets/project/workbenchTemplate.svg
View file @ 52c8279d
<?xml version="1.0" encoding="UTF-8"?>
<svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/工作流模版</title>
<defs>
<filter color-interpolation-filters="auto" id="filter-1">
<feColorMatrix in="SourceGraphic" type="matrix" values="0 0 0 0 0.760000 0 0 0 0 0.776000 0 0 0 0 0.800000 0 0 0 1.000000 0"></feColorMatrix>
</filter>
</defs>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/工作流模版备份 3</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="任务列表" transform="translate(-245.000000, -246.000000)">
<g id="编组-4" transform="translate(244.000000, 242.000000)">
<g id="编组-5" transform="translate(0.000000, 3.000000)" filter="url(#filter-1)">
<g>
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(1.000000, 1.000000)" stroke="#979797" stroke-width="1.5">
<rect id="矩形" x="0.75" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-2" x="0.75" y="8.5" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份" x="8.5" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-3" x="8.5" y="8.5" width="4.75" height="4.75" rx="1"></rect>
</g>
</g>
</g>
<g id="编组-5">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(1.000000, 1.000000)" stroke="#C2C6CC" stroke-width="1.5">
<rect id="矩形" x="0.75" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-2" x="0.75" y="8.5" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份" x="8.5" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-3" x="8.5" y="8.5" width="4.75" height="4.75" rx="1"></rect>
</g>
</g>
</g>
......
src/assets/project/workbenchTemplate_hover.svg 0 → 100644
View file @ 52c8279d
<?xml version="1.0" encoding="UTF-8"?>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/工作流模版备份 2</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="编组-5">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(1.000000, 1.000000)" stroke="#1E2633" stroke-width="1.5">
<rect id="矩形" x="0.75" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-2" x="0.75" y="8.5" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份" x="8.5" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-3" x="8.5" y="8.5" width="4.75" height="4.75" rx="1"></rect>
</g>
</g>
</g>
</svg>
\ No newline at end of file
src/assets/project/workbenchTemplate_select.svg
View file @ 52c8279d
<?xml version="1.0" encoding="UTF-8"?>
<svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/工作流模版</title>
<defs>
<filter color-interpolation-filters="auto" id="filter-1">
<feColorMatrix in="SourceGraphic" type="matrix" values="0 0 0 0 0.076000 0 0 0 0 0.440000 0 0 0 0 1.000000 0 0 0 1.000000 0"></feColorMatrix>
</filter>
</defs>
<svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>1.Base基础/Icon图标/工作流模版备份</title>
<g id="上线UI" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="工作台（管理员）空" transform="translate(-245.000000, -246.000000)">
<g id="编组-4" transform="translate(244.000000, 242.000000)">
<g id="编组-5" transform="translate(0.000000, 3.000000)" filter="url(#filter-1)">
<g>
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(1.000000, 1.000000)" stroke="#979797" stroke-width="1.5">
<rect id="矩形" x="0.75" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-2" x="0.75" y="8.5" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份" x="8.5" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-3" x="8.5" y="8.5" width="4.75" height="4.75" rx="1"></rect>
</g>
</g>
</g>
<g id="编组-5">
<rect id="矩形" x="0" y="0" width="16" height="16"></rect>
<g id="编组-4" transform="translate(1.000000, 1.000000)" stroke="#1370FF" stroke-width="1.5">
<rect id="矩形" x="0.75" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-2" x="0.75" y="8.5" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份" x="8.5" y="0.75" width="4.75" height="4.75" rx="1"></rect>
<rect id="矩形备份-3" x="8.5" y="8.5" width="4.75" height="4.75" rx="1"></rect>
</g>
</g>
</g>
......
src/components/BusinessComponents/FileSelect/index.module.css
View file @ 52c8279d
.FSBox {
width: 900px;
height: 650px;
max-height: 550px;
position: relative;
}
......
src/components/BusinessComponents/FileSelect/index.tsx
View file @ 52c8279d
......@@ -447,6 +447,7 @@ const FileSelect = observer((props: FileSelectProps) => {
)}
</div>
<Table
tableContainerStyle={{height: 470}}
footer={false}
rowHover={true}
nopadding={true}
......
src/components/CommonComponents/RadioGroupOfButtonStyle/index.module.css
View file @ 52c8279d
......@@ -33,3 +33,11 @@
background-color: #fff;
box-shadow: 2px 4px 12px 0px rgba(0, 27, 63, 0.06);
}
.border {
width: 1px;
height: 16px;
background-color: rgba(209, 214, 222, 1);
}
.borderHidden {
visibility: hidden;
}
src/components/CommonComponents/RadioGroupOfButtonStyle/index.tsx
View file @ 52c8279d
......@@ -8,6 +8,7 @@
*/
// 按钮样式的单选组
import classnames from "classnames";
import { useMemo } from "react";
import style from "./index.module.css";
type radioOption = {
......@@ -27,21 +28,43 @@ const RadioGroupOfButtonStyle = (props: IRadioGroupOfButtonStyleProps) => {
const { radioOptions, value, handleRadio, RadiosBoxStyle, radioStyle } =
props;
const activeIndex: any = useMemo(() => {
let res = 0;
radioOptions.forEach((item, index) => {
if (item.value === value) {
res = index;
}
});
return res;
}, [value, radioOptions]);
return (
<div className={style.RadiosBox} style={RadiosBoxStyle}>
{radioOptions.map((options) => {
{radioOptions.map((options, index) => {
return (
<div
key={options.value}
className={classnames({
[style.radio]: true,
[style.radioActive]: value === options.value,
})}
onClick={() => handleRadio(options.value)}
style={radioStyle}
>
{options.label}
</div>
<>
<div
key={options.value}
className={classnames({
[style.radio]: true,
[style.radioActive]: value === options.value,
})}
onClick={() => handleRadio(options.value)}
style={radioStyle}
>
{options.label}
</div>
<div
className={classnames({
[style.border]: true,
[style.borderHidden]: !(
index !== radioOptions.length - 1 &&
index !== activeIndex &&
index !== activeIndex - 1
),
})}
></div>
</>
);
})}
</div>
......
src/components/MySnackbar/MySnackbarProvider.tsx
View file @ 52c8279d
......@@ -66,6 +66,7 @@ const MySnackbarProvider = ({
}: MySnackbarProviderProp) => {
const {
open,
setOpen,
messageInfo,
handleExited,
success,
......@@ -74,31 +75,46 @@ const MySnackbarProvider = ({
info,
close,
} = useMySnackbar();
// .MuiAlert-filledInfo
const getColorStyle = useMemo(() => {
if (messageInfo.severity === "success") {
return "#02AB83";
}
if (messageInfo.severity === "info") {
return "#1370FF";
}
if (messageInfo.severity === "warning") {
return "#FFB919";
}
if (messageInfo.severity === "error") {
return "#FF4E4E";
}
}, [messageInfo.severity]);
const theme = createTheme({
components: {
MuiAlert: {
styleOverrides: {
root: {
color: getColorStyle,
"& .MuiAlert-icon": {
color: getColorStyle,
minWidth: "360px",
maxWidth: "542px",
minHeight: "38px",
boxShadow: "none",
"& .MuiAlert-action": {
paddingLeft: "60px",
},
"&.MuiAlert-standardError": {
color: "#FF4E4E",
background: "rgba(255, 237, 237, 1)",
"& .MuiAlert-icon": {
color: "#FF4E4E",
},
},
"&.MuiAlert-standardInfo": {
color: "rgba(19, 112, 255, 1)",
background: "rgba(235, 243, 255, 1)",
"& .MuiAlert-icon": {
color: "rgba(19, 112, 255, 1)",
},
},
"&.MuiAlert-standardSuccess": {
color: "rgba(2, 171, 131, 1)",
background: "rgba(217, 255, 238, 1)",
"& .MuiAlert-icon": {
color: "rgba(2, 171, 131, 1)",
},
},
"&.MuiAlert-standardWarning": {
color: "rgba(255, 185, 25, 1)",
background: "rgba(255, 246, 226, 1)",
"& .MuiAlert-icon": {
color: "rgba(255, 185, 25, 1)",
},
},
},
},
......@@ -137,7 +153,10 @@ const MySnackbarProvider = ({
severity={messageInfo?.severity}
variant={variant}
elevation={elevation}
sx={{ boxShadow: "unset", ...alertSx }}
sx={{ ...alertSx }}
onClose={() => {
setOpen(false);
}}
>
{messageInfo?.content}
</Alert>
......
src/components/MySnackbar/useMySnackbar.ts
View file @ 52c8279d
......@@ -69,6 +69,7 @@ const useMySnackbar = () => {
return {
open,
setOpen,
messageInfo,
handleExited,
success,
......
src/components/mui/MyButton.tsx
View file @ 52c8279d
......@@ -47,12 +47,14 @@ const theme = createTheme({
styleOverrides: {
root: {
minWidth: "48px",
boxShadow: "none !important",
"&.MuiButton-textError": {
color: "rgba(255, 78, 78, 1)",
},
"&.MuiButton-outlinedError": {
color: "rgba(255, 78, 78, 1)",
border: "1px solid rgba(255, 78, 78, 1)",
"&:hover": { backgroundColor: 'transparent' },
},
"& .MuiLoadingButton-loadingIndicator": {
color: "#fff",
......@@ -67,7 +69,6 @@ const theme = createTheme({
outlined: {
backgroundColor: "#FFFFFF",
border: "1px solid #1370FF",
boxShadow: "none !important",
color: "#1370FF",
"&:hover": { backgroundColor: "#ECF4FF " },
"&.MuiButton-textError": {
......@@ -76,7 +77,6 @@ const theme = createTheme({
},
text: {
backgroundColor: "transparent",
boxShadow: "none !important",
color: "#1370FF",
"&:hover": { backgroundColor: "#ECF4FF " },
},
......@@ -95,7 +95,6 @@ const theme = createTheme({
},
outlinedSecondary: {
border: "1px solid rgba(221, 225, 230, 1)",
boxShadow: "none !important",
color: "rgba(30, 38, 51, 1)",
"&:hover": {
backgroundColor: "rgba(240, 242, 245, 1) ",
......@@ -104,7 +103,6 @@ const theme = createTheme({
},
textSecondary: {
backgroundColor: "transparent",
boxShadow: "none !important",
color: "#FF4E4E",
"&:hover": { backgroundColor: "#FFEDED " },
},
......
src/components/mui/MyDialog.tsx
View file @ 52c8279d
......@@ -103,7 +103,7 @@ const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
disabled={disabledConfirm}
isLoadingButton={true}
loading={loading}
style={{ ...okSx }}
style={{ marginLeft: '12px', ...okSx }}
/>
) : null}
</DialogActions>
......
src/components/mui/MyInput.tsx
View file @ 52c8279d
......@@ -35,9 +35,13 @@ const MyInput = (props: MyInputProps) => {
root: {
height: "36px",
fontSize: "14px",
border: "rgba(221, 225, 230, 1)",
"&.MuiInputBase-sizeSmall": {
height: "32px",
},
"& .Mui-disabled": {
background: "rgba(247, 248, 250, 1)",
},
},
multiline: {
height: "auto",
......@@ -68,7 +72,7 @@ const MyInput = (props: MyInputProps) => {
borderWidth: "1px",
},
"& .MuiOutlinedInput-notchedOutline": {
borderColor: '#DDE1E6',
borderColor: "#DDE1E6",
},
":hover": {
"& .MuiOutlinedInput-notchedOutline": error
......
src/components/mui/MyPopconfirm.tsx
View file @ 52c8279d
......@@ -30,6 +30,7 @@ interface IMyPopconfirmProps {
showCancel?: boolean;
onCancel?: any;
onConfirm?: any;
loading?: boolean;
}
const MyPopconfirm = (props: IMyPopconfirmProps) => {
......@@ -42,6 +43,7 @@ const MyPopconfirm = (props: IMyPopconfirmProps) => {
showCancel = true,
onCancel,
onConfirm,
loading = false,
} = props;
const open = useMemo(() => {
......@@ -97,7 +99,12 @@ const MyPopconfirm = (props: IMyPopconfirmProps) => {
style={{ marginRight: "12px" }}
/>
)}
<MyButton text={okText} onClick={handleOk} />
<MyButton
text={okText}
onClick={handleOk}
loading={loading}
isLoadingButton={true}
/>
</Box>
</Popper>
);
......
src/components/mui/MySelect.tsx
View file @ 52c8279d
......@@ -71,6 +71,14 @@ export default function MySelect(props: IProps) {
styleOverrides: {
root: {
height: "36px",
"& .Mui-disabled": {
background: "rgba(247, 248, 250, 1)",
},
"& .MuiSelect-icon": {
"&.Mui-disabled": {
display: "none",
},
},
},
},
},
......
src/components/mui/MyTable/index.tsx
View file @ 52c8279d
......@@ -138,7 +138,8 @@ export default function EnhancedTable(props: ITableProps) {
(rows.length === 0 && !load) && <TableRow>
<TableCell
sx={{
borderBottom: '1px solid #F0F2F5'
borderBottom: '1px solid #F0F2F5',
textAlign: 'center'
}}
colSpan={headCells?.filter((k: any) => k.id === "checkbox")?.length === 0 ? headCells?.length : headCells?.length + 1}
className={classes.TypographyStyle}
......
src/components/mui/MyTooltip.tsx
View file @ 52c8279d
......@@ -9,8 +9,8 @@
import { Tooltip, TooltipProps } from "@mui/material";
import { ThemeProvider, createTheme } from "@mui/material/styles";
interface IMyTooltipProps extends TooltipProps {
title: string;
interface IMyTooltipProps extends Omit<TooltipProps, "title"> {
title?: string | boolean;
}
const theme = createTheme({
......@@ -33,7 +33,7 @@ const theme = createTheme({
});
const MyTooltip = (props: IMyTooltipProps) => {
const { title, children, placement = "top", ...other } = props;
const { title = false, children, placement = "top", ...other } = props;
return (
<ThemeProvider theme={theme}>
<Tooltip
......
src/components/mui/Tabs.tsx
View file @ 52c8279d
......@@ -2,11 +2,11 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:18:13
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-10 11:06:12
* @LastEditTime: 2022-08-31 20:25:56
* @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 } from "react";
import { memo, useCallback } from "react";
import { isEqual } from "lodash";
import { useState } from "react";
import { Box } from "@mui/system";
......@@ -21,11 +21,14 @@ interface ITabList {
component: JSX.Element | React.ReactNode;
icon?: string;
iconed?: string;
iconHover?: string;
hide?: boolean;
disabled?: boolean;
}
interface IProps {
value?: string;
onChange?: (val: string)=> void;
tabList: ITabList[];
defaultValue?: string;
tabPanelSx?: any;
......@@ -70,11 +73,14 @@ const theme = createTheme({
const Tabs = (props: IProps) => {
const {
tabList,
value,
defaultValue,
onChange,
allowNullValue = false,
tabPanelSx = { padding: "24px 0 0 0" },
} = props;
const [value, setValue] = useState(
const [tabValue, setTabValue] = useState(
defaultValue
? defaultValue
: allowNullValue
......@@ -82,17 +88,31 @@ const Tabs = (props: IProps) => {
: tabList.filter((e) => !e.hide)[0].value
);
const onChange = (val: string) => {
setValue(val);
const [hoverValue, setHoverValue] = useState('')
const onTabChange = (val: string) => {
setTabValue(val)
onChange && onChange(val);
};
const getImgSrc = useCallback((item: ITabList)=>{
let result = item.icon
if(value === item.value){
result = item.iconed
}
if(hoverValue === item.value){
result = item.iconHover
}
return result
},[hoverValue, value])
const labelRender = (item: ITabList, key: number) => {
return (
<Box style={{ display: "flex", alignItems: "center" }}>
<div style={{ display: "flex", alignItems: "center" }} onMouseOver={()=>setHoverValue(item.value)} onMouseOut={()=>setHoverValue('')}>
{item.icon ? (
<img
style={{ width: "16px", marginRight: "8px" }}
src={value === item.value ? item.iconed : item.icon}
src={getImgSrc(item)}
alt=""
/>
) : (
......@@ -108,17 +128,17 @@ const Tabs = (props: IProps) => {
>
{item.label}
</Typography>
</Box>
</div>
);
};
return (
<ThemeProvider theme={theme}>
<TabContext value={value}>
<TabContext value={value || tabValue}>
<Box sx={{ borderBottom: 1, borderColor: "#EDEFF2" }}>
<TabList
onChange={(e: any, val: string) => {
onChange(val);
onTabChange(val);
}}
>
{tabList
......
src/index.tsx
View file @ 52c8279d
......@@ -41,9 +41,7 @@ root.render(
<React.StrictMode>
<ThemeProvider theme={theme}>
<Provider {...stores}>
<MySnackbarProvider
alertSx={{ boxShadow: "0px 2px 4px 0px rgb(0 0 0 / 8%)" }}
>
<MySnackbarProvider>
<MyRouter></MyRouter>
</MySnackbarProvider>
</Provider>
......
src/store/modules/currentProject.ts
View file @ 52c8279d
/*
* @Author: 吴永生 15770852798@163.com
* @Date: 2022-07-11 11:49:55
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-23 16:46:45
* @FilePath: /bkunyun/src/store/modules/currentProject.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import { makeAutoObservable } from "mobx";
type projectInfo = {
id?: string;
......@@ -12,14 +20,22 @@ type productInfo = {
name?: string;
};
const sessionStorageCurrentProjectInfo = JSON.parse(
sessionStorage.getItem("currentProjectInfo") || "{}"
/** 用户信息 */
let userInfo: any;
try {
userInfo = JSON.parse(localStorage.getItem("userInfo") || "{}");
} catch {
console.error("获取用户信息 出错");
}
const localStorageCurrentProjectInfo = JSON.parse(
localStorage.getItem(`currentProjectInfo_${userInfo.name}`) || "{}"
);
const sessionStorageCurrentProductInfo = JSON.parse(
sessionStorage.getItem("currentProductInfo") || "{}"
const localStorageCurrentProductInfo = JSON.parse(
localStorage.getItem(`currentProductInfo_${userInfo.name}`) || "{}"
);
const sessionStorageProjectList = JSON.parse(
sessionStorage.getItem("projectList") || "[]"
const localStorageProjectList = JSON.parse(
localStorage.getItem(`projectList_${userInfo.name}`) || "[]"
);
class currentProject {
......@@ -28,22 +44,22 @@ class currentProject {
}
// 选中的项目
currentProjectInfo: projectInfo = sessionStorageCurrentProjectInfo;
currentProjectInfo: projectInfo = localStorageCurrentProjectInfo;
// 选中的产品下的项目列表
projectList: Array<projectInfo> = sessionStorageProjectList;
projectList: Array<projectInfo> = localStorageProjectList;
// 选中的产品
currentProductInfo: productInfo = sessionStorageCurrentProductInfo;
currentProductInfo: productInfo = localStorageCurrentProductInfo;
setProjectList = (list: Array<projectInfo>) => {
this.projectList = list;
sessionStorage.setItem("projectList", JSON.stringify(list));
localStorage.setItem(`projectList_${userInfo.name}`, JSON.stringify(list));
};
changeProject = (project: projectInfo) => {
this.currentProjectInfo = project;
sessionStorage.setItem("currentProjectInfo", JSON.stringify(project));
localStorage.setItem(`currentProjectInfo_${userInfo.name}`, JSON.stringify(project));
};
changeProductInfo = (productInfo: productInfo) => {
this.currentProductInfo = productInfo;
sessionStorage.setItem("currentProductInfo", JSON.stringify(productInfo));
localStorage.setItem(`currentProductInfo_${userInfo.name}`, JSON.stringify(productInfo));
};
}
......
src/utils/util.ts
View file @ 52c8279d
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-07 18:37:53
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-06-15 17:49:27
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-23 11:19:11
* @FilePath: /bkunyun/src/utils/util.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -67,7 +67,7 @@ export const getTokenInfo = () => {
return val;
};
const IsNumberLetterChineseReg = new RegExp("^[A-Za-z0-9\u4e00-\u9fa5]+$");
const IsNumberLetterChineseReg = new RegExp("^[A-Za-z0-9\u4e00-\u9fa5]{1,50}$");
export const checkIsNumberLetterChinese = (string: string) => {
return IsNumberLetterChineseReg.test(string);
......
src/views/CustomOperator/components/OperatorList/index.tsx
View file @ 52c8279d
......@@ -14,10 +14,11 @@ import { ITask } from "@/views/Project/ProjectSubmitWork/interface";
type IProps = {
operatorList: ITask[];
setOperatorList: any;
setInputActive: any;
};
const OperatorList = (props: IProps) => {
const { operatorList, setOperatorList } = props; // 流程图中流算子列表
const { operatorList, setOperatorList, setInputActive } = props; // 流程图中流算子列表
const { currentProjectStore } = useStores();
const [list, setList] = useState<ITask[]>([]); // 算子列表
const productId = toJS(currentProjectStore.currentProductInfo.id); // 产品ID
......@@ -205,6 +206,12 @@ const OperatorList = (props: IProps) => {
value={keyword}
onChange={keywordChange}
onKeyUp={handleKeywordKeyUp}
onFocus={() => {
setInputActive(true);
}}
onBlur={() => {
setInputActive(false);
}}
sx={{ fontSize: "14px" }}
/>
</div>
......
src/views/CustomOperator/components/SaveOperator/index.tsx
View file @ 52c8279d
......@@ -193,8 +193,8 @@ const SaveOperator = (props: IProps) => {
<MyInput
value={description}
id="desc"
label="模板描述"
placeholder="模板描述"
label="算子描述"
placeholder="算子描述"
onChange={handleDescriptionChange}
multiline
rows={4}
......
src/views/CustomOperator/index.tsx
View file @ 52c8279d
......@@ -21,6 +21,7 @@ const CustomOperator = observer((props: IProps) => {
const Message = useMessage();
const [operatorList, setOperatorList] = useState<ITask[]>(initOperatorList);
const [saveFormDialog, setSaveFormDialog] = useState(false);
const [inputActive, setInputActive] = useState(false);
// const [showCustomOperator, setShowCustomOperator] = useState(false);
/** 设置选中唯一标识符 */
......@@ -100,7 +101,8 @@ const CustomOperator = observer((props: IProps) => {
return (
(outItem.domType || "").toLowerCase() === "dataset" ||
(outItem.domType || "").toLowerCase() === "file" ||
(outItem.domType || "").toLowerCase() === "path"
(outItem.domType || "").toLowerCase() === "path" ||
(outItem.domType || "").toLowerCase() === "input"
);
})
) {
......@@ -175,6 +177,7 @@ const CustomOperator = observer((props: IProps) => {
<OperatorList
operatorList={operatorList}
setOperatorList={setOperatorList}
setInputActive={setInputActive}
/>
<BatchOperatorFlow
tasks={operatorList}
......@@ -182,7 +185,7 @@ const CustomOperator = observer((props: IProps) => {
type="edit"
onFlowNodeClick={handleNodeClick}
flowNodeDraggable={true}
ListenState={!saveFormDialog}
ListenState={!saveFormDialog && !inputActive}
showVersion={true}
showControls={false}
/>
......
src/views/MenuLayout/index.module.css
View file @ 52c8279d
......@@ -23,7 +23,7 @@
color: #565c66;
font-size: 14px;
line-height: 22px;
border-left: 3px solid #fff;
border-left: 3px solid #f7f8fa;
}
.listItem:hover {
background-color: #eef1f5;
......@@ -37,5 +37,5 @@
.active {
border-left: 3px solid #1370ff;
color: #1370ff;
background-color: #ebedf0;
background-color: #e6eaf0;
}
src/views/Project/ProjectData/AddFolder/index.tsx
View file @ 52c8279d
......@@ -54,7 +54,7 @@ const AddFolder = (props: IAddFolderProps) => {
refresh();
});
} else {
Message.info(fileNameCheck.help || "请输入文件夹名称");
Message.error(fileNameCheck.help || "请输入文件夹名称");
}
};
......
src/views/Project/ProjectData/SeeDataset/index.tsx
View file @ 52c8279d
......@@ -19,6 +19,7 @@ import classNames from "classnames";
import Save from "./save";
import NoData from "@/components/BusinessComponents/NoData";
import Download from "./download";
import MyTooltip from "@/components/mui/MyTooltip";
import style from "./index.module.css";
type ISeeDatasetProps = {
......@@ -48,6 +49,7 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
const [saveOpen, setSaveOpen] = useState(false); // 另存为弹窗显示控制
const [downloadOpen, setDownloadOpen] = useState(false); // 下载弹窗显示控制
const [showAnimation, setShowAnimation] = useState(true); // 弹窗动画变化中
const [firstGetList, setFirstGetList] = useState(true); // 第一次请求列表
// 解决图像渲染造成弹窗卡顿的问题
useEffect(() => {
......@@ -103,7 +105,7 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
name: name,
page: paramsPage,
size,
index: searchDataType ? `meta.${searchDataType}` : "",
index: searchDataType ? `${searchDataType}` : "",
sort: sort === "null" ? "" : sort,
query: keyword,
})
......@@ -111,13 +113,31 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
setList(res.data.list);
setCount(res.data.totalPage - 1);
if (res.data.list && res.data.list.length > 0) {
if (res.data.list[0].meta) {
const meta = res.data.list[0].meta;
const arr = Object.keys(meta).map((item) => {
return { label: item, value: item };
if (res.data.list[0]) {
let arr: any = [];
Object.keys(res.data.list[0]).forEach((item) => {
if (
![
"meta",
"id",
// "canonical_smiles",
// "mol",
// "mol2",
// "pdb",
// "sdf",
// "sdf2d",
// "sdf3d",
// "smiles",
].includes(item)
) {
arr.push({ label: item, value: item });
}
});
setdataTypes(arr);
setSearchDataType(arr[0].value);
if (firstGetList) {
setdataTypes(arr);
setSearchDataType(arr[0].value);
}
setFirstGetList(false);
}
}
})
......@@ -295,7 +315,7 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
</div>
{showData.length !== 0 && (
<div className={style.datasetLiDataList}>
{Object.keys(item.meta)
{Object.keys(item)
.filter((key) => showData.indexOf(key) !== -1)
.map((key, index) => {
return (
......@@ -308,11 +328,13 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
>
{key}
</span>
<span
className={style.datasetLiDataLiValue}
>
{item.meta[key]}
</span>
<MyTooltip title={item[key]}>
<span
className={style.datasetLiDataLiValue}
>
{item[key]}
</span>
</MyTooltip>
</div>
);
})}
......
src/views/Project/ProjectData/UpLoaderFile/index.tsx
View file @ 52c8279d
......@@ -239,10 +239,6 @@ const UpLoaderFile = observer((props: IMoveFileProps) => {
// lineHeight: "20px",
// color: "#8A9099",
// }}
tableBodySx={{
backgroundColor:
fileList.length >= 10 ? "rgba(255, 0, 0, 0.6)" : "",
}}
tableContainerStyle={{
maxHeight: "300px",
}}
......
src/views/Project/ProjectData/index.module.css
View file @ 52c8279d
......@@ -40,6 +40,11 @@
align-items: center;
}
.refreshIcon {
width: 16px;
height: 16px;
}
.folderIconBox {
display: flex;
justify-content: flex-start;
......
src/views/Project/ProjectData/index.tsx
View file @ 52c8279d
......@@ -2,9 +2,9 @@ import React, { useState, useCallback, useEffect, useMemo } from "react";
import style from "./index.module.css";
import classnames from "classnames";
import { IconButton } from "@mui/material";
import RefreshIcon from "@mui/icons-material/Refresh";
import MyTable from "@/components/mui/MyTable";
import dataSetIcon from "@/assets/project/dataSetIcon.svg";
import refresh from "@/assets/project/refresh.svg";
import fileIcon from "@/assets/project/fileIcon.svg";
import folderIcon from "@/assets/project/folderIcon.svg";
import noFile from "@/assets/project/noFile.svg";
......@@ -68,6 +68,7 @@ const ProjectData = observer(() => {
useEffect(() => {
const locationInfo: any = location?.state;
setActiveTab(locationInfo?.dataType || "file");
setPath(locationInfo?.pathName || "/");
}, [location]);
......@@ -556,12 +557,17 @@ const ProjectData = observer(() => {
size="small"
onClick={handleRefresh}
disabled={!isPass("PROJECT_DATA_REFRESH", "USER")}
sx={{ marginLeft: "17px", width: '32px', height: '32px', ":hover": {
backgroundColor: "#F0F2F5 ",
borderRadius: 2
} }}
sx={{
marginLeft: "12px",
width: "32px",
height: "32px",
":hover": {
backgroundColor: "rgba(240, 242, 245, 1)",
borderRadius: "4px",
},
}}
>
<RefreshIcon sx={{ fontSize: "18px" }} />
<img className={style.refreshIcon} src={refresh} alt="" />
</IconButton>
</div>
</div>
......
src/views/Project/ProjectJobDetail/index.module.css
View file @ 52c8279d
......@@ -74,6 +74,13 @@
color: rgba(19, 112, 255, 1);
font-size: 14px;
}
.outputItemName{
max-width: 172px;
white-space: nowrap;
display: block;
overflow: hidden;
text-overflow: ellipsis;
}
.outputLiLeftImg {
margin-right: 12px;
}
......
src/views/Project/ProjectJobDetail/index.tsx
View file @ 52c8279d
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-21 20:03:56
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-15 17:18:49
* @LastEditTime: 2022-08-23 19:27:18
* @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -47,6 +47,7 @@ import { getConnectionArr, getDatasetName, getDatasetPath, getSameBatch } from "
import styles from "./index.module.css";
const stateMap = {
SUBMITTED:"正在启动",
RUNNING: "正在运行",
ABORTED: "运行终止",
FAILED: "运行失败",
......@@ -348,18 +349,7 @@ const ProjectSubmitWork = observer(() => {
setOverviewActive(false);
setShowOptions(!showOptions);
};
const handleDownLoad = (path: string) => {
if (path.indexOf("/ProjectData") !== -1) {
path = path.slice(12);
}
CloudEController.JobFileDownload(
path,
fileToken as string,
projectId as string
);
};
/** 终止任务 */
const onStopJob = useCallback(() => {
cancelWorkJob({
......@@ -375,7 +365,7 @@ const ProjectSubmitWork = observer(() => {
}, [deleteWorkJob, workFlowJobInfo?.id]);
const returnPermission = useMemo(() => {
if (state === "RUNNING") {
if (['SUBMITTED', 'RUNNING'].includes(state || '')) {
return isPass("PROJECT_WORKBENCH_JOBS_STOP", "USER");
} else {
return isPass("PROJECT_WORKBENCH_JOBS_DELETE", "MANAGER");
......@@ -446,13 +436,13 @@ const ProjectSubmitWork = observer(() => {
}}
> */}
<MyButton
text={state === "RUNNING" ? "终止" : "删除"}
text={['SUBMITTED', 'RUNNING'].includes(state || '') ? "终止" : "删除"}
variant="outlined"
color="secondary"
onClick={(e: any) =>
handleShowPopper(
e,
state === "RUNNING"
['SUBMITTED', 'RUNNING'].includes(state || '')
? "正在运行的任务终止后将无法重新运行，确认继续吗？"
: "任务被删除后将无法恢复，确认继续吗？"
)
......@@ -490,7 +480,7 @@ const ProjectSubmitWork = observer(() => {
}
alt=""
/>
{item.name}
<span className={styles.outputItemName}>{item.name}</span>
</div>
{/* </MyPopconfirm> */}
<span className={styles.outputLiRight}>
......@@ -551,7 +541,7 @@ const ProjectSubmitWork = observer(() => {
alt=""
/>
)}
{state === "RUNNING" && (
{['SUBMITTED', 'RUNNING'].includes(state || '') && (
<img
className={styles.taskInfoValueIcon}
src={jobRun}
......
src/views/Project/ProjectJobDetail/utils.ts
View file @ 52c8279d
......@@ -2,7 +2,7 @@
* @Author: 吴永生 15770852798@163.com
* @Date: 2022-08-15 15:03:10
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-15 15:43:16
* @LastEditTime: 2022-08-23 19:39:21
* @FilePath: /bkunyun/src/views/Project/ProjectJobDetail/utils.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -26,13 +26,12 @@ export const getDatasetPath = (path: string) => {
// 根据outputs的路径获取数据集的名称
export const getDatasetName = (path: string) => {
let name = "";
let nameIndex = path.indexOf("/.dataset/") + 10;
const lastIndex = path.lastIndexOf("/");
if (nameIndex !== -1 && lastIndex !== -1) {
name = path.slice(nameIndex, lastIndex);
let name='';
const arr = path.split('/.dataset/');
if(arr.length === 2) {
name = arr[1]
}
return name;
return name
};
/** 根据批节点 判断是否在同一个批 */
......
src/views/Project/ProjectOverview/TaskCard/index.tsx
View file @ 52c8279d
......@@ -47,21 +47,18 @@ const TaskCard = (props: TaskCardProps) => {
}
}, [outputs])
// 结果文件跳转
const goToProjectData = (path: string) => {
const goToProjectData = (info: any) => {
let { path = '' , type = '' } = info
const lastIndex = path.lastIndexOf("/");
// /projectData
// dataType
if (lastIndex !== -1) {
path = path.slice(0, lastIndex);
}
path = path.slice(12);
if (path) {
navigate(`/product/cadd/projectData`, {
state: { pathName: path },
});
} else {
navigate(`/product/cadd/projectData`, {
state: { pathName: "/" },
});
}
navigate(`/product/cadd/projectData`, {
state: { pathName: path || '/', dataType: type },
});
}
// 跳转详情页
const gotoDetail = (id: string) => {
......@@ -87,6 +84,8 @@ const TaskCard = (props: TaskCardProps) => {
// 渲染状态
const renderStatusText = (data: string) => {
switch (data) {
case "SUBMITTED":
return "正在启动";
case "RUNNING":
return '正在运行'
case "ABORTED":
......@@ -175,15 +174,15 @@ const TaskCard = (props: TaskCardProps) => {
{randerOutputs.length === 0 ? <div className={style.noResult}>暂无结果文件</div> :
<div className={style.resultBox}>
{randerOutputs.map((item, index) => {
return <div key={index} className={style.result} onClick={() => goToProjectData(item.path)}>
return <div key={index} className={style.result} onClick={() => goToProjectData(item)}>
<img
className={style.outputLeftImg}
src={
item.type === "file" ? fileIcon : dataSetIcon
item?.type === "file" ? fileIcon : dataSetIcon
}
alt=""
/>
{item.name}</div>
{item?.name}</div>
})}
</div>
}
......
src/views/Project/ProjectOverview/index.module.css
View file @ 52c8279d
......@@ -3,7 +3,7 @@
justify-content: space-between;
margin: 24px 24px 0 24px;
padding-bottom: 20px;
border-bottom: 1px solid #F0F2F5;
border-bottom: 1px solid #EDEFF2;
}
.basicInformationRight {
......
src/views/Project/ProjectSetting/BaseInfo/index.module.css
View file @ 52c8279d
.loadingBox {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
height: 300px;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
height: 300px;
}
.projectInfoList {
background-color: #fff;
position: relative;
background-color: #fff;
position: relative;
}
.projectInfoListLi {
margin-bottom: 24px;
margin-bottom: 24px;
}
.projectInfoListLiLabel {
color: #1e2633;
line-height: 22px;
font-size: 14px;
font-weight: 550;
margin-bottom: 8px;
color: #1e2633;
line-height: 22px;
font-size: 14px;
font-weight: 550;
margin-bottom: 8px;
}
.projectInfoName::after {
content: "*";
color: red;
content: "*";
color: red;
}
.projectInfoListLiValue {
width: 560px;
height: 36px;
border: 1px solid #e6e8eb;
border-radius: 4px;
color: #565c66;
padding: 0 12px;
box-sizing: border-box;
outline: none;
width: 560px;
height: 36px;
border: 1px solid #e6e8eb;
border-radius: 4px;
color: #565c66;
padding: 0 12px;
box-sizing: border-box;
outline: none;
}
.projectInfoListLiValue:focus {
border: 2px solid #136efa;
border: 2px solid #136efa;
}
.projectInfoTextarea {
line-height: 22px;
height: 82px;
padding: 7px 12px;
resize: none;
font-size: 14px;
position: relative;
width: 560px;
}
.projectInfoSelect {
width: 560px;
padding: 0 12px;
width: 560px;
padding: 0 12px;
}
.disable {
background: #f7f8fa;
background: #f7f8fa;
}
.projectInfoListLiText {
margin-bottom: 16px;
color: #8a9099;
font-size: 12px;
line-height: 20px;
margin-bottom: 16px;
color: #8a9099;
font-size: 12px;
line-height: 20px;
}
.deleteBox {
width: 380px;
width: 380px;
}
.deleteText1 {
font-size: 14px;
line-height: 22px;
color: #ff4e4e;
margin-bottom: 20px;
font-size: 14px;
line-height: 22px;
color: #ff4e4e;
margin-bottom: 20px;
}
.deleteText2 {
color: #1e2633;
font-size: 14px;
line-height: 22px;
margin-bottom: 8px;
color: #1e2633;
font-size: 14px;
line-height: 22px;
margin-bottom: 8px;
}
.deleteText3 {
color: #1e2633;
font-size: 14px;
line-height: 22px;
margin-bottom: 20px;
color: #1e2633;
font-size: 14px;
line-height: 22px;
margin-bottom: 20px;
}
.deleteProjectName {
color: #1370ff;
color: #1370ff;
}
.deleteProjectInput {
width: 100%;
height: 36px;
border: 1px solid #e6e8eb;
border-radius: 4px;
color: #565c66;
padding: 0 12px;
box-sizing: border-box;
outline: none;
width: 100%;
height: 36px;
border: 1px solid #e6e8eb;
border-radius: 4px;
color: #565c66;
padding: 0 12px;
box-sizing: border-box;
outline: none;
}
.deleteProjectInput:focus {
border: 1px solid #136efa;
border: 1px solid #136efa;
}
src/views/Project/ProjectSetting/BaseInfo/index.tsx
View file @ 52c8279d
......@@ -184,10 +184,12 @@ const BaseInfo = observer(() => {
};
const descChange = (e: any) => {
setProjectInfo({
...projectInfo,
desc: e.target.value,
});
if (e.target.value.length <= 100) {
setProjectInfo({
...projectInfo,
desc: e.target.value,
});
}
};
const checkBudget = (budget: string, showMessage = false) => {
......@@ -337,16 +339,30 @@ const BaseInfo = observer(() => {
</div>
<div className={style.projectInfoListLi}>
<div className={style.projectInfoListLiLabel}>项目描述</div>
<textarea
value={projectInfo.desc}
<div
className={classnames({
[style.projectInfoListLiValue]: true,
[style.projectInfoTextarea]: true,
})}
onChange={descChange}
placeholder="项目描述限制300字以内"
maxLength={300}
></textarea>
>
<MyInput
value={projectInfo.desc}
id="desc"
placeholder="项目描述限制100字以内"
onChange={descChange}
multiline
rows={4}
/>
<span
style={{
position: "absolute",
bottom: "7px",
right: "12px",
color: projectInfo.desc.length >= 100 ? "#d32f2f" : "#C2C6CC",
}}
>
{projectInfo.desc.length}/100
</span>
</div>
</div>
<div className={style.projectInfoListLi}>
<div className={style.projectInfoListLiLabel}>计算区</div>
......
src/views/Project/ProjectSetting/ProjectMembers/components/AddMember.tsx
View file @ 52c8279d
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:18:13
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-03 14:29:19
* @LastEditTime: 2022-08-31 18:27:26
* @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -79,15 +79,7 @@ const AddMember = observer((props: IProps) => {
useEffect(() => {
if (addMemberDialog) {
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);
setSelectOptions(res.data);
});
}
}, [addMemberDialog, http]);
......@@ -170,6 +162,7 @@ const AddMember = observer((props: IProps) => {
/>
<div style={{ overflowY: "scroll", maxHeight: 400 }}>
<MyTable
tableContainerStyle={{height: 346}}
checkboxData={(val: string[]) => setCheckData(val)}
param="username"
disabledParam={"enabled"}
......
src/views/Project/ProjectSubmitWork/ConfigForm/index.tsx
View file @ 52c8279d
......@@ -23,11 +23,11 @@ type ConfigFormProps = {
templateConfigInfo?: ITemplateConfig;
setParameter: any;
onRef?: React.Ref<any>;
setSelectedBatchNodeId: (val: string) => void;
setExternalSelectedNodeId: (val: string) => void;
};
const ConfigForm = (props: ConfigFormProps) => {
const { templateConfigInfo, setParameter, setSelectedBatchNodeId } = props;
const { templateConfigInfo, setParameter, setExternalSelectedNodeId } = props;
const [name, setName] = useState<string>(""); // 任务名称
const [fileSelectType, setFileSelectType] = useState<FileSelectType>("path");
......@@ -192,7 +192,6 @@ const ConfigForm = (props: ConfigFormProps) => {
const randerParameters = (
parameters: Array<IParameter>,
taskId: string,
batchId?: string
) => {
return parameters
.filter((parameter) => parameter.hidden === false)
......@@ -208,17 +207,20 @@ const ConfigForm = (props: ConfigFormProps) => {
[styles.required]: parameter.required,
})}
>
{parameter.name}
{parameter.title}
<span className={styles.parameterDataType}>
{parameter.classTypeName}
</span>
</div>
<MyTooltip title={parameter.description} placement="right">
<MyTooltip
title={parameter.description || parameter.name}
placement="right"
>
<div className={styles.parameterContent}>
{(parameter.domType || "").toLowerCase() === "file" && (
<MyInput
onClick={() => {
setSelectedBatchNodeId(batchId || "");
setExternalSelectedNodeId(taskId || "");
setFileSelectType("file");
handleOpenFileSelect(taskId, parameter.name);
}}
......@@ -241,7 +243,7 @@ const ConfigForm = (props: ConfigFormProps) => {
{(parameter.domType || "").toLowerCase() === "path" && (
<MyInput
onClick={() => {
setSelectedBatchNodeId(batchId || "");
setExternalSelectedNodeId(taskId || "");
setFileSelectType("path");
handleOpenFileSelect(taskId, parameter.name);
}}
......@@ -264,7 +266,7 @@ const ConfigForm = (props: ConfigFormProps) => {
{(parameter.domType || "").toLowerCase() === "dataset" && (
<MyInput
onClick={() => {
setSelectedBatchNodeId(taskId);
setExternalSelectedNodeId(taskId);
setFileSelectType("dataset");
handleOpenFileSelect(taskId, parameter.name);
}}
......@@ -287,10 +289,9 @@ const ConfigForm = (props: ConfigFormProps) => {
{(parameter.domType || "").toLowerCase() === "input" && (
<MyInput
onFocus={() => {
setSelectedBatchNodeId(batchId || "");
console.log(batchId, "111");
setExternalSelectedNodeId(taskId || "");
}}
onBlur={() => setSelectedBatchNodeId("")}
onBlur={() => setExternalSelectedNodeId("")}
value={parameter.value || ""}
onChange={(e: any) =>
handleParameterChange(e, taskId, parameter.name || "")
......@@ -303,8 +304,8 @@ const ConfigForm = (props: ConfigFormProps) => {
)}
{(parameter.domType || "").toLowerCase() === "select" && (
<MySelect
onFocus={() => setSelectedBatchNodeId(batchId || "")}
onBlur={() => setSelectedBatchNodeId("")}
onFocus={() => setExternalSelectedNodeId(taskId || "")}
onBlur={() => setExternalSelectedNodeId("")}
value={parameter.value}
onChange={(e: any) =>
handleParameterChange(
......@@ -326,8 +327,8 @@ const ConfigForm = (props: ConfigFormProps) => {
{(parameter.domType || "").toLowerCase() ===
"multipleselect" && (
<MySelect
onFocus={() => setSelectedBatchNodeId(batchId || "")}
onBlur={() => setSelectedBatchNodeId("")}
onFocus={() => setExternalSelectedNodeId(taskId || "")}
onBlur={() => setExternalSelectedNodeId("")}
value={parameter.value}
onChange={(e: any) =>
handleParameterChange(
......@@ -353,8 +354,8 @@ const ConfigForm = (props: ConfigFormProps) => {
onChange={(e: any) =>
handleParameterChange(e, taskId, parameter.name || "")
}
onFocus={() => setSelectedBatchNodeId(batchId || "")}
onBlur={() => setSelectedBatchNodeId("")}
onFocus={() => setExternalSelectedNodeId(taskId || "")}
onBlur={() => setExternalSelectedNodeId("")}
options={parameter?.choices || []}
error={parameter.error || false}
helperText={parameter.helperText}
......@@ -375,8 +376,8 @@ const ConfigForm = (props: ConfigFormProps) => {
)
}
options={parameter?.choices || []}
onFocus={() => setSelectedBatchNodeId(batchId || "")}
onBlur={() => setSelectedBatchNodeId("")}
onFocus={() => setExternalSelectedNodeId(taskId || "")}
onBlur={() => setExternalSelectedNodeId("")}
error={parameter.error || false}
helperText={parameter.helperText}
/>
......@@ -445,7 +446,7 @@ const ConfigForm = (props: ConfigFormProps) => {
<MyInput
value={outputPath || ""}
onClick={() => {
setSelectedBatchNodeId("");
setExternalSelectedNodeId("");
setFileSelectType("path");
handleOpenFileSelect();
}}
......@@ -494,7 +495,10 @@ const ConfigForm = (props: ConfigFormProps) => {
/>
</div>
<div className={styles.taskConfigBox}>
{randerParameters(task.parameters, task.id, task.id)}
{randerParameters(
task.parameters.filter((parameter) => !parameter?.thrown),
task.id,
)}
{task.flows.map((flow) => {
if (
flow.parameters.filter(
......@@ -504,7 +508,7 @@ const ConfigForm = (props: ConfigFormProps) => {
return null;
}
return (
<div className={styles.flowConfigBox} key={flow.id}>
<div className={styles.flowConfigBox} key={flow.id} id={`point${flow.id}`}>
<div className={styles.flowTitle}>
{flow.title}
{flow.description && (
......@@ -520,7 +524,6 @@ const ConfigForm = (props: ConfigFormProps) => {
{randerParameters(
flow.parameters,
flow.id,
flow.parentNode ? flow.parentNode : flow.id
)}
</div>
);
......
src/views/Project/ProjectSubmitWork/WorkFlow/index.tsx
View file @ 52c8279d
......@@ -12,11 +12,11 @@ import { ITemplateConfig } from "../interface";
interface IProps {
templateConfigInfo?: ITemplateConfig;
setSelectedBatchNodeId?: (val: string) => void;
selectedBatchNodeId?: string;
setExternalSelectedNodeId?: (val: string) => void;
externalSelectedNodeId?: string;
}
const WorkFlow = (props: IProps) => {
const { templateConfigInfo, setSelectedBatchNodeId, selectedBatchNodeId } =
const { templateConfigInfo, setExternalSelectedNodeId, externalSelectedNodeId } =
props;
/** 页面刷新提醒 */
......@@ -36,8 +36,8 @@ const WorkFlow = (props: IProps) => {
return (
<Flow
tasks={templateConfigInfo?.tasks}
setSelectedBatchNodeId={setSelectedBatchNodeId}
selectedBatchNodeId={selectedBatchNodeId}
setExternalSelectedNodeId={setExternalSelectedNodeId}
externalSelectedNodeId={externalSelectedNodeId}
/>
);
};
......
src/views/Project/ProjectSubmitWork/index.tsx
View file @ 52c8279d
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-21 20:03:56
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-08 16:41:20
* @LastEditTime: 2022-08-17 10:58:02
* @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -42,7 +42,8 @@ const ProjectSubmitWork = observer(() => {
let configFormRef: any = React.createRef();
/** 是否全屏 */
const [fullScreenShow, setFullScreenShow] = useState<boolean>(false);
const [selectedBatchNodeId, setSelectedBatchNodeId] = useState<string>("");
const [externalSelectedNodeId, setExternalSelectedNodeId] =
useState<string>("");
// 前往工作台
const goToWorkbench = (toWorkbenchList = false) => {
......@@ -74,6 +75,8 @@ const ProjectSubmitWork = observer(() => {
(parameter.domType || "").toLowerCase() === "checkbox"
) {
value = parameter.defaultValue.split(",");
} else if ((parameter.domType || "").toLowerCase() === "input") {
value = String(parameter.defaultValue);
} else {
value = parameter.defaultValue;
}
......@@ -82,6 +85,13 @@ const ProjectSubmitWork = observer(() => {
(parameter.domType || "").toLowerCase() === "checkbox"
) {
value = [];
} else if ((parameter.domType || "").toLowerCase() === "input") {
value =
String(parameter.defaultValue) === "null"
? ""
: String(parameter.defaultValue);
} else if ((parameter.domType || "").toLowerCase() === "radio") {
value = false;
} else {
value = "";
}
......@@ -106,7 +116,7 @@ const ProjectSubmitWork = observer(() => {
},
});
const { run: submitWorkFlowRun } = useMyRequest(submitWorkFlow, {
const { run: submitWorkFlowRun, loading } = useMyRequest(submitWorkFlow, {
onSuccess: (res) => {
Message.success("提交成功");
goToWorkbench(true);
......@@ -157,6 +167,9 @@ const ProjectSubmitWork = observer(() => {
tack.parameters
.filter((parameter) => parameter.hidden === false)
.forEach((parameter) => {
if (tack.type === "BATCH" && parameter?.thrown) {
return;
}
const checkResult = getCheckResult(parameter, parameter.value);
parameter.error = checkResult.error;
parameter.helperText = checkResult.helperText;
......@@ -186,12 +199,16 @@ const ProjectSubmitWork = observer(() => {
value = `/${value}`;
}
if (tack.type === "BATCH") {
promotedParameters[`${tack.id}_${parameter.name}`] = {
[parameter.classTypeName]: value,
};
if (!parameter?.thrown) {
promotedParameters[`${tack.id}_${parameter.name}`] = {
[parameter.classTypeName]: value,
};
}
} else {
promotedParameters[
`${tack.parentNode}_${tack.prefix}_${parameter.name}`
`${tack.parentNode}${
parameter.thrown ? "" : "_" + tack.prefix
}_${parameter.name}`
] = {
[parameter.classTypeName]: value,
};
......@@ -206,7 +223,7 @@ const ProjectSubmitWork = observer(() => {
promotedParameters,
});
} else {
Message.error("请完善左侧表单再提交");
Message.error("请完善算子信息后提交任务");
}
};
......@@ -297,7 +314,7 @@ const ProjectSubmitWork = observer(() => {
onRef={configFormRef}
templateConfigInfo={templateConfigInfo}
setParameter={setParameter}
setSelectedBatchNodeId={setSelectedBatchNodeId}
setExternalSelectedNodeId={setExternalSelectedNodeId}
/>
</div>
)}
......@@ -307,8 +324,8 @@ const ProjectSubmitWork = observer(() => {
>
<WorkFlow
templateConfigInfo={templateConfigInfo}
setSelectedBatchNodeId={setSelectedBatchNodeId}
selectedBatchNodeId={selectedBatchNodeId}
setExternalSelectedNodeId={setExternalSelectedNodeId}
externalSelectedNodeId={externalSelectedNodeId}
/>
</div>
</div>
......@@ -323,6 +340,7 @@ const ProjectSubmitWork = observer(() => {
anchorEl={anchorEl}
onCancel={handleCancel}
onConfirm={handleConfirm}
loading={loading}
/>
</div>
);
......
src/views/Project/ProjectSubmitWork/interface.ts
View file @ 52c8279d
......@@ -11,6 +11,7 @@ export interface IParameter {
hidden: boolean; // 使用模板时是否展示 true 不展示 用户不需要填写
id?: string;
name: string; // 参数名称
title: string; // 参数名称
required: boolean; // 是否必填
defaultValue: any; // 默认值
domType: IDomType; // 前端组件类型
......@@ -29,7 +30,8 @@ export interface IParameter {
choices: Array<IChoice>; // 提供给用户选择的选项组
error?: boolean; // 表单校验是否通过
helperText?: string; // 表单校验提示文案
parameterGroup?: string; //
parameterGroup?: string; //
thrown: boolean; // 保存批算子时 是否是 批算子输入输出相关的parameters
}
export type IExecutionStatus = "Pending" | "Running" | "Done" | "Failed";
......
src/views/Project/ProjectWorkbench/index.tsx
View file @ 52c8279d
/*
* @Author: rocosen
* @Date: 2022-06-12 10:05:13
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-20 15:04:19
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-30 18:21:04
* @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -11,17 +11,16 @@ import { Box } from "@mui/system";
import { observer } from "mobx-react-lite";
import { useLocation } from "react-router-dom";
import projectImg from "@/assets/project/projectIconSmall.svg";
import WorkbenchTemplate from "./workbenchTemplate";
import WorkbenchList from "./workbenchList";
import Tabs from "@/components/mui/Tabs";
import usePass from "@/hooks/usePass";
import Template from "@/assets/project/workbenchTemplate.svg";
import Template_select from "@/assets/project/workbenchTemplate_select.svg";
import TemplateSelect from "@/assets/project/workbenchTemplate_select.svg";
import TemplateHover from "@/assets/project/workbenchTemplate_hover.svg";
import List from "@/assets/project/workbenchList.svg";
import List_select from "@/assets/project/workbenchList_select.svg";
import ButtonDemo from "@/views/mui_demo/button";
import InputDemo from "@/views/mui_demo/input";
import ListHover from "@/assets/project/workbenchList_hover.svg";
import ListSelect from "@/assets/project/workbenchList_select.svg";
const ProjectWorkbench = observer(() => {
const isPass = usePass();
......@@ -35,7 +34,8 @@ const ProjectWorkbench = observer(() => {
component: <WorkbenchTemplate />,
hide: !isPass("PROJECT_WORKBENCH_FLOES"),
icon: Template,
iconed: Template_select,
iconed: TemplateSelect,
iconHover: TemplateHover
},
{
label: "任务列表",
......@@ -43,21 +43,8 @@ const ProjectWorkbench = observer(() => {
component: <WorkbenchList />,
hide: !isPass("PROJECT_WORKBENCH_JOBS"),
icon: List,
iconed: List_select,
},
{
label: "按钮组件",
value: "MUI_BUTTON",
component: <ButtonDemo />,
icon: List,
iconed: List_select,
},
{
label: "输入框组件",
value: "MUI_INPUT",
component: <InputDemo />,
icon: List,
iconed: List_select,
iconed: ListSelect,
iconHover: ListHover,
},
];
}, [isPass]);
......
src/views/Project/ProjectWorkbench/workbenchList/index.tsx
View file @ 52c8279d
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:18:13
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-07-28 19:02:19
* @LastEditTime: 2022-08-22 15:33:02
* @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -48,6 +48,10 @@ const currencies = [
value: "ALL",
label: "全部",
},
{
value: "SUBMITTED",
label: "正在启动",
},
{
value: "RUNNING",
label: "正在运行",
......@@ -79,30 +83,31 @@ const ProjectMembers = observer(() => {
const [size, setSize] = useState(10);
const [rowsPerPage, setRowsPerPage] = useState(10);
const [count, setCount] = useState(0);
const [loading, setLoading] = useState(false)
/** 简单弹窗 */
const [jobData, setJobData] = useState("");
const [openDialog, setOpenDialog] = useState(false);
const [dialogType, setDialogType] = useState("del");
// 获取作业列表
const { run: getWorkflowJobInfo } = useMyRequest(getWorkflowJobList, {
onSuccess: (result: any) => {
setJobList(result.data.content);
setCount(result.data.totalElements);
setLoading(false);
timer && clearTimeout(timer as number);
timer = null;
timer = setTimeout(() => {
getWorkflowJobInfo({
projectId: currentProjectStore.currentProjectInfo.id as string,
page: page,
size: size,
name: jobName,
state: currency === "ALL" ? "" : currency,
});
}, 60000);
},
});
const { run: getWorkflowJobInfo, loading } = useMyRequest(
getWorkflowJobList,
{
onSuccess: (result: any) => {
setJobList(result.data.content);
setCount(result.data.totalElements);
timer && clearTimeout(timer as number);
timer = null;
timer = setTimeout(() => {
getWorkflowJobInfo({
projectId: currentProjectStore.currentProjectInfo.id as string,
page: page,
size: size,
name: jobName,
state: currency === "ALL" ? "" : currency,
});
}, 60000);
},
}
);
useEffect(() => {
return () => {
......@@ -281,7 +286,7 @@ const ProjectMembers = observer(() => {
const rowClick = useCallback(
(id: string) => {
navigate(`/product/cadd/projectJobDetail`, {
state: { taskId: id, from: 'workbenchList' },
state: { taskId: id, from: "workbenchList" },
});
},
[navigate]
......@@ -359,7 +364,6 @@ const ProjectMembers = observer(() => {
name: jobName,
state: currency === "ALL" ? "" : currency,
});
setLoading(true)
}}
>
<img alt="" src={onload} />
......@@ -368,7 +372,7 @@ const ProjectMembers = observer(() => {
<Box className={styles.body} style={{ position: "relative" }}>
<MyCircularProgress loading={loading} />
{jobList.length === 0 && (
{jobList.length === 0 && !loading && (
<Box
sx={{
display: "flex",
......@@ -410,7 +414,9 @@ const ProjectMembers = observer(() => {
</Box>
<Box className={styles.tabBoxMiddle}>
<img alt="" src={jobCost} />
<div className={styles.tabBoxTime}>{item.jobCost.toFixed(2)}元</div>
<div className={styles.tabBoxTime}>
{item.jobCost ? item.jobCost.toFixed(2) : "--"}
</div>
</Box>
<Box className={styles.tabBoxJobStatus}>
<img alt="" src={renderStatusIcon(item.state)} />
......@@ -427,18 +433,27 @@ const ProjectMembers = observer(() => {
/>
</Box>
<div
style={{ color: renderTextColor(item.state), margin: '0px' }}
style={{
color: renderTextColor(item.state),
margin: "0px",
}}
className={styles.tabBoxStatusText}
>
{item.completeNum + "/" + item.totalNum}
</div>
</Box>
{item.state === "RUNNING" &&
{(item.state === "RUNNING" || item.state === "SUBMITTED") &&
isPass("PROJECT_WORKBENCH_JOBS_STOP", "USER") && (
<Box className={styles.tabBoxJobOperate}>
{
currentProjectStore.currentProjectInfo.projectRole === "USER" && (item.creator !== JSON.parse(localStorage.getItem("userInfo") || "{}")?.name) ? "" : <img
{currentProjectStore.currentProjectInfo.projectRole ===
"USER" &&
item.creator !==
JSON.parse(localStorage.getItem("userInfo") || "{}")
?.name ? (
""
) : (
<img
alt=""
src={jobStop}
style={{ cursor: "pointer" }}
......@@ -450,10 +465,11 @@ const ProjectMembers = observer(() => {
setDialogType("stop");
}}
/>
}
)}
</Box>
)}
{item.state !== "RUNNING" &&
item.state !== "SUBMITTED" &&
isPass("PROJECT_WORKBENCH_JOBS_DELETE", "MANAGER") && (
<Box className={styles.tabBoxJobOperate}>
<img
......
src/views/Project/ProjectWorkbench/workbenchTemplate/components/AddTemplate/index.tsx
View file @ 52c8279d
......@@ -144,7 +144,7 @@ const AddTemplate = (props: IAddTemplateProps) => {
};
// 获取模板列表
const getAddTemplateListFun = useCallback(() => {
const getAddTemplateListFun = useCallback((newTitle?: string) => {
const userName = JSON.parse(localStorage.getItem("userInfo") || "{}")?.name;
setSelectTemplateData([]);
setAddTemplateList([]);
......@@ -153,14 +153,14 @@ const AddTemplate = (props: IAddTemplateProps) => {
projectId: projectId as string,
productId: productId as string,
creator: "root",
keyword: title,
keyword: newTitle,
});
} else {
getAddTemplateList({
projectId: projectId as string,
productId: productId as string,
creator: userName,
keyword: title,
keyword: newTitle,
});
}
}, [
......@@ -169,7 +169,7 @@ const AddTemplate = (props: IAddTemplateProps) => {
productId,
projectId,
templateType,
title,
// title,
]);
//模板启用切换
......@@ -193,6 +193,13 @@ const AddTemplate = (props: IAddTemplateProps) => {
getAddTemplateListFun();
}, [getAddTemplateListFun]);
// 按回车搜索
const handleKeyWordChangeKeyUp = (e: any) => {
if (e.keyCode === 13) {
getAddTemplateListFun(e.target.value);
}
};
const hiddenBoxArr = useMemo(() => {
const length =
templateType === "public"
......@@ -215,7 +222,7 @@ const AddTemplate = (props: IAddTemplateProps) => {
<Typography
sx={{ fontSize: "18px", fontWeight: "600", color: "#1E2633" }}
>
添加工作流模版
管理工作流模板
</Typography>
<Box
sx={{
......@@ -231,6 +238,7 @@ const AddTemplate = (props: IAddTemplateProps) => {
onChange={(e: any) => {
setTitle(e.target.value);
}}
onKeyUp={handleKeyWordChangeKeyUp}
placeholder="输入关键词搜索"
size="small"
sx={{ width: 340, height: 32 }}
......
src/views/Project/ProjectWorkbench/workbenchTemplate/index.tsx
View file @ 52c8279d
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:18:13
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-09 16:32:42
* @LastEditTime: 2022-08-18 10:01:36
* @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -114,7 +114,7 @@ const ProjectMembers = observer(() => {
<SearchInput onKeyUp={handleKeyWordChangeKeyUp} sx={{ width: 340 }} />
{isPass("PROJECT_WORKBENCH_FLOES_ADD", "MANAGER") && (
<MyButton
text={"添加工作流模版"}
text={"管理工作流模板"}
img={<Add />}
onClick={addTemplateBlock}
size={"medium"}
......
src/views/Project/components/AddProject/index.tsx
View file @ 52c8279d
......@@ -177,13 +177,13 @@ const AddProject = (props: IAddProjectProps) => {
title="新建项目"
loading={loading}
>
<div className={style.formBox} onClick={handleFromBox}>
<MyInput
required
error={nameCheck.error}
id="name"
// id="name"
label="项目名称"
variant="outlined"
value={name}
onChange={handleNameChange}
helperText={nameCheck.help}
......
src/views/Project/components/CurrentProject/index.tsx
View file @ 52c8279d
/*
* @Author: 吴永生 15770852798@163.com
* @Date: 2022-08-26 19:13:55
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-30 19:26:16
* @FilePath: /bkunyun/src/views/Project/components/CurrentProject/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import logo from "@/assets/project/projectIcon.svg";
import style from "./index.module.css";
import ArrowForwardIosIcon from "@mui/icons-material/ArrowForwardIos";
import { Popper, Fade } from "@mui/material";
import { useStores } from "@/store/index";
import ProjectListPopper from "../ProjectListPopper";
import React, { useEffect, useState } from "react";
import React, { useState } from "react";
import { observer } from "mobx-react-lite";
import AddProject from "../AddProject";
import {
......@@ -17,17 +25,6 @@ const CurrentProject = observer(() => {
const [projectListOpen, setProjectListOpen] = useState(false);
const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
useEffect(() => {
document.addEventListener("click", (e) => {
setProjectListOpen(false);
});
return () => {
document.removeEventListener("click", (e) => {
setProjectListOpen(false);
});
};
}, []);
const handleShowProjectList = (event: React.MouseEvent<HTMLElement>) => {
event.nativeEvent.stopImmediatePropagation();
setAnchorEl(event.currentTarget);
......
src/views/Project/components/Flow/components/BatchNode/index.module.css
View file @ 52c8279d
......@@ -4,7 +4,7 @@
/* padding: 12px 20px; */
border: 1px solid #e6e8eb;
border-left: 4px solid #e6e8eb;
display: flex;
/* display: flex; */
align-items: center;
}
......@@ -37,7 +37,12 @@
}
.batchRotate {
transform: translateX(-50%) rotate(-90deg);
margin-bottom: 20px;
line-height: 22px;
font-size: 14px;
font-weight: 900;
/* text-align: center; */
/* transform: translateX(-50%) rotate(-90deg); */
}
.handleBox::before{
......
src/views/Project/components/Flow/components/BatchNode/index.tsx
View file @ 52c8279d
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-07-12 11:20:29
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-09 11:24:38
* @LastEditTime: 2022-08-31 17:09:26
* @FilePath: /bkunyun/src/views/Project/components/Flow/components/BatchNode.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -68,11 +68,12 @@ const BatchNode = (props: IBatchNode) => {
className={styles.handleBox}
id={item.name}
style={{
background: "#fff ",
backgroundColor: "rgba(19, 112, 255, 1)",
border: item.error
? "1px solid #FF4E4E"
: "1px solid #D1D6DE",
: "1px solid #fff",
left: index * 24 + 20,
top: '-47px',
}}
type="target"
position={Position.Top}
......@@ -99,8 +100,8 @@ const BatchNode = (props: IBatchNode) => {
className={styles.handleBox}
id={item.name}
style={{
background: "#fff ",
border: "1px solid #D1D6DE",
backgroundColor: "rgba(19, 112, 255, 1)",
border: "1px solid #FFF",
left: index * 24 + 20,
}}
type="source"
......
src/views/Project/components/Flow/components/BatchOperatorFlow/index.tsx
View file @ 52c8279d
......@@ -50,7 +50,6 @@ const BatchOperatorFlow = (props: IProps) => {
showVersion = false,
...other
} = props;
console.log(tasks);
/** 自定义的节点类型 */
const nodeTypes = useMemo(() => {
return { batchNode: BatchNode, flowNode: FlowNode };
......@@ -147,16 +146,17 @@ const BatchOperatorFlow = (props: IProps) => {
flowNodeStyle: {
backgroundColor: "#fff",
borderRadius: "4px",
boxShadow: "0px 3px 10px 0px rgba(0,24,57,0.14)",
},
inStyle: {
backgroundColor: "rgba(19, 112, 255, 1)",
border: "none",
border: "1px solid #FFF",
left: 12,
top: "-2px",
},
outStyle: {
backgroundColor: "rgba(19, 112, 255, 1)",
border: "none",
border: "1px solid #FFF",
left: 12,
bottom: "-2px",
},
......@@ -367,6 +367,16 @@ const BatchOperatorFlow = (props: IProps) => {
setInSideFlowNodeId("");
}, []);
// const onNodesChange = (val: any)=>{
// // 自定义change事件 不允许react flow组件本身删除事件
// return
// }
// const onEdgesChange = (val: any) =>{
// // 自定义change事件 不允许react flow组件本身删除事件
// return;
// }
const reactFlowParams =
flowType === "edit"
? {
......
src/views/Project/components/Flow/components/FlowNode/index.tsx
View file @ 52c8279d
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-07-12 11:29:46
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-09 19:06:43
* @LastEditTime: 2022-08-31 17:09:31
* @FilePath: /bkunyun/src/views/Project/components/Flow/components/FlowNode/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -52,6 +52,7 @@ const FlowNode = (props: any) => {
(parameters?.length &&
parameters?.filter((item: any) => {
return item.parameterGroup === "in";
// return item.parameterGroup === "in" && !item?.thrown;
})) ||
[]
);
......@@ -63,6 +64,7 @@ const FlowNode = (props: any) => {
(parameters?.length &&
parameters?.filter((item: any) => {
return item.parameterGroup === "out";
// return item.parameterGroup === "out" && !item?.thrown;
})) ||
[]
);
......@@ -96,8 +98,8 @@ const FlowNode = (props: any) => {
);
})
: null}
<div>
{title || ""} {showVersion && version}
<div style={{display: 'flex', alignItems: 'center'}}>
<span style={{fontSize: '12px', lineHeight: '24px'}}>{title || ""} {showVersion && version}</span>
{flowType !== "edit" && isCheck ? (
<span className={styles.successDot}></span>
) : null}
......
src/views/Project/components/Flow/index.tsx
View file @ 52c8279d
......@@ -11,7 +11,7 @@ import ReactFlow, {
import { useCallback, useEffect, useMemo, useState } from "react";
import { uuid } from "@/utils/util";
import { IEdge, IParameter, ITask } from "../../ProjectSubmitWork/interface";
import { IParameter, ITask } from "../../ProjectSubmitWork/interface";
import { ILine } from "./interface";
import BatchNode from "./components/BatchNode";
import FlowNode from "./components/FlowNode";
......@@ -33,9 +33,9 @@ interface IProps extends ReactFlowProps {
/** 点击batch事件 */
onBatchClick?: (val: string) => void;
/** 设置选中的batch节点id */
setSelectedBatchNodeId?: (val: string) => void;
setExternalSelectedNodeId?: (val: string) => void;
/** 选中的batch节点id */
selectedBatchNodeId?: string;
externalSelectedNodeId?: string;
/** 类型， edit为编辑类型 */
type?: "edit" | "default";
/** 设置组件数据 组件为编辑状态使用 */
......@@ -52,8 +52,8 @@ const Flow = (props: IProps) => {
const {
tasks,
onBatchClick,
setSelectedBatchNodeId,
selectedBatchNodeId,
setExternalSelectedNodeId,
externalSelectedNodeId,
type: flowType = "default",
setTasks,
onFlowNodeClick,
......@@ -61,7 +61,7 @@ const Flow = (props: IProps) => {
showControls = true,
...other
} = props;
console.log(tasks);
/** 自定义的节点类型 */
const nodeTypes = useMemo(() => {
return { batchNode: BatchNode, flowNode: FlowNode };
......@@ -77,7 +77,7 @@ const Flow = (props: IProps) => {
/** 原始数据删除线 */
const tasksDeleteLine = useCallback(
(connection: Connection | Edge | any) => {
const result =
let result =
(tasks?.length &&
tasks.map((item) => {
/** 删除batch起始的edges中的一项 === 等于删除了一根连线 */
......@@ -123,6 +123,45 @@ const Flow = (props: IProps) => {
}
})) ||
[];
// 更新批节点下对应流节点的hidden和错误提示
result = result.map((task) => {
if (task.parentNode === connection.target) {
let isCheck = true;
const parametersChange = task.parameters.map((parameter) => {
if (parameter.name === connection.targetHandle) {
const { error, helperText } =
getCustomTemplateParameterCheckResult({
...parameter,
linked: false,
hidden: false,
});
return {
...parameter,
hidden: false,
linked: false,
error,
helperText,
};
} else {
return parameter;
}
});
parametersChange.forEach((parameter) => {
if (
getCustomTemplateParameterCheckResult(parameter).error === true
) {
isCheck = false;
}
});
return {
...task,
isCheck,
parameters: parametersChange,
};
} else {
return task;
}
});
return result;
},
[tasks]
......@@ -182,7 +221,7 @@ const Flow = (props: IProps) => {
// const nodesInputAndOutputStatus = useCallback(
// (id: string) => {
// /** 所有的连线 */
// const lineArr: IEdge[] = [];
// const lineArr: ] = [];
// tasks?.length &&
// tasks.forEach((item) => {
// item.edges?.length && lineArr.push(...item.edges);
......@@ -231,14 +270,14 @@ const Flow = (props: IProps) => {
return a - b;
});
let width = 176,
height = 22;
height = 66;
if (positionXArr?.length) {
const val = positionXArr[positionXArr.length - 1] + 150;
const val = positionXArr[positionXArr.length - 1] + 144;
width = val > 176 ? val : width;
}
if (positionYArr?.length) {
const val = positionYArr[positionYArr.length - 1] + 6;
height = val > 22 ? val : height;
const val = positionYArr[positionYArr.length - 1] + 74;
height = val > 66 ? val : height;
}
return {
width,
......@@ -266,20 +305,23 @@ const Flow = (props: IProps) => {
/** 是否有流节点 */
isFlowNode: isFlowNode(item.id),
/** 选中状态 */
selectedStatus: selectedBatchNodeId
? selectedBatchNodeId === item.id
selectedStatus: externalSelectedNodeId
? externalSelectedNodeId.includes(item.id)
: inSideBatchNodeId === item.id,
/** tasks 数据 */
tasks: tasks,
}
: { selectedStatus: inSideFlowNodeId === item.id }),
: { selectedStatus: externalSelectedNodeId
? externalSelectedNodeId.includes(item.id)
: inSideFlowNodeId === item.id,}),
/** 输入输出圆点状态 */
// dotStatus: nodesInputAndOutputStatus(item.id),
/** 样式 */
style: {
...getBatchStyle(item),
padding: isFlowNode(item.id) ? "20px" : "12px 20px",
marginTop: '-44px',
padding: "12px 20px",
},
},
/** 坐标 */
......@@ -303,7 +345,7 @@ const Flow = (props: IProps) => {
tasks,
flowType,
isFlowNode,
selectedBatchNodeId,
externalSelectedNodeId,
inSideBatchNodeId,
inSideFlowNodeId,
// nodesInputAndOutputStatus,
......@@ -325,8 +367,8 @@ const Flow = (props: IProps) => {
}, []);
});
return val.map((item: ILine) => {
const newSelectId = selectedBatchNodeId
? selectedBatchNodeId
const newSelectId = externalSelectedNodeId
? externalSelectedNodeId
: inSideBatchNodeId;
return {
...item,
......@@ -347,19 +389,18 @@ const Flow = (props: IProps) => {
label: item.label ? `(${item.label})` : "",
};
});
}, [inSideBatchNodeId, selectedBatchNodeId, selectedEdge?.id, tasks]);
}, [inSideBatchNodeId, externalSelectedNodeId, selectedEdge?.id, tasks]);
/** 设置nodeId方法 */
const setNodeIdFun = useCallback(
(id: string) => {
setSelectedBatchNodeId
? setSelectedBatchNodeId(id)
setExternalSelectedNodeId
? setExternalSelectedNodeId(id)
: setInSideBatchNodeId(id);
onBatchClick && onBatchClick(id);
setInSideFlowNodeId("");
document.getElementById(`point${id}`)?.scrollIntoView(true);
},
[onBatchClick, setSelectedBatchNodeId]
[onBatchClick, setExternalSelectedNodeId]
);
/** flowNode点击事件 */
......@@ -371,9 +412,9 @@ const Flow = (props: IProps) => {
} else {
setInSideFlowNodeId(node.id);
setInSideBatchNodeId("");
setSelectedBatchNodeId && setSelectedBatchNodeId("");
setExternalSelectedNodeId && setExternalSelectedNodeId("");
}
document.getElementById(`point${node.id}`)?.scrollIntoView(true);
}
});
if (onFlowNodeClick) {
......@@ -384,8 +425,8 @@ const Flow = (props: IProps) => {
};
const handlePaneClick = () => {
setSelectedBatchNodeId
? setSelectedBatchNodeId("")
setExternalSelectedNodeId
? setExternalSelectedNodeId("")
: setInSideBatchNodeId("");
setInSideFlowNodeId("");
onBatchClick && onBatchClick("");
......@@ -472,7 +513,7 @@ const Flow = (props: IProps) => {
/** 连接校验并修改值 */
const connectCheck = useCallback(
(connection: Connection) => {
const newVal =
let newVal =
(tasks?.length &&
tasks?.map((item) => {
if (item.id === connection.source) {
......@@ -499,17 +540,76 @@ const Flow = (props: IProps) => {
}
})) ||
[];
// 更新批节点下对应流节点的hidden和错误提示
newVal = newVal.map((task) => {
if (task.parentNode === connection.target) {
let isCheck = true; // 红点校验
let parametersChange = task.parameters.map((parameter) => {
if (parameter.name === connection.targetHandle) {
const { error, helperText } =
getCustomTemplateParameterCheckResult({
...parameter,
linked: true,
hidden: true,
});
return {
...parameter,
hidden: true,
linked: true,
error,
helperText,
};
} else {
return parameter;
}
});
parametersChange.forEach((parameter) => {
if (
getCustomTemplateParameterCheckResult(parameter).error === true
) {
isCheck = false;
}
});
return {
...task,
isCheck,
parameters: parametersChange,
};
} else {
return task;
}
});
return newVal;
},
[connectModifyParameters, tasks]
);
// 获取算子类型 批算还是流算子
const getTaskType = useCallback(
(taskId: string) => {
let type = "";
tasks?.forEach((task) => {
if (task.id === taskId) {
type = task.type;
}
});
return type;
},
[tasks]
);
/** 已经连接线啦 */
const onConnect = useCallback(
(connection: Connection) => {
const { inputClassType, outClassType } = getClassType(connection);
let result: ITask[] = [];
if (inputClassType === outClassType) {
if (
getTaskType(connection.source as string) === "FLOW" ||
getTaskType(connection.target as string) === "FLOW"
) {
return;
} else if (inputClassType === outClassType) {
result = connectCheck(connection) as ITask[];
} else {
Message.error("端口数据类型不一致，无法连接！");
......@@ -517,7 +617,14 @@ const Flow = (props: IProps) => {
}
setTasks && setTasks(result);
},
[Message, connectCheck, getClassType, setTasks, tasksDeleteLine]
[
Message,
connectCheck,
getClassType,
setTasks,
tasksDeleteLine,
getTaskType,
]
);
/** 点击连线 */
......@@ -527,11 +634,21 @@ const Flow = (props: IProps) => {
/** 点击连线清除选中的node ID */
setInSideFlowNodeId("");
setInSideBatchNodeId("");
setSelectedBatchNodeId && setSelectedBatchNodeId("");
setExternalSelectedNodeId && setExternalSelectedNodeId("");
},
[setSelectedBatchNodeId]
[setExternalSelectedNodeId]
);
// const onNodesChange = (val: any)=>{
// // 自定义change事件 不允许react flow组件本身删除事件
// // return
// }
// const onEdgesChange = (val: any) =>{
// // 自定义change事件 不允许react flow组件本身删除事件
// // return;
// }
const reactFlowParams =
flowType === "edit"
? {
......
src/views/Project/components/ProjectListPopper/index.tsx
View file @ 52c8279d
......@@ -2,7 +2,7 @@
* @Author: 吴永生 15770852798@163.com
* @Date: 2022-08-02 11:43:28
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-11 18:50:31
* @LastEditTime: 2022-08-30 19:32:05
* @FilePath: /bkunyun/src/views/Project/components/ProjectListPopper/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -14,7 +14,8 @@ import AddIcon from "@mui/icons-material/Add";
import classNames from "classnames";
import { useStores } from "@/store/index";
import moment from "moment";
import React, { useMemo, useState } from "react";
import React, { useMemo, useState } from "react";
import { useClickAway } from 'ahooks';
import { toJS } from "mobx";
import { observer } from "mobx-react-lite";
......@@ -38,12 +39,18 @@ const ProjectListPopper = observer((props: any) => {
const handleProjectBox = (e: React.SyntheticEvent) => {
setProjectListOpen(false);
e.nativeEvent.stopImmediatePropagation();
};
useClickAway(
() => {
setProjectListOpen(false);
},
() => document.getElementById('use-click-projectList-mainBox'),
);
return (
<div className={style.projectBox} onClick={handleProjectBox}>
<div className={style.mainBox}>
<div className={style.mainBox} id="use-click-projectList-mainBox" onClick={(e: any)=>e.stopPropagation()}>
<div className={style.searchBox}>
<IconButton
type="submit"
......
src/views/WorkFlowEdit/components/OperatorList/index.tsx
View file @ 52c8279d
......@@ -130,6 +130,8 @@ const OperatorItem = (props: IOperatorItemProps) => {
draggable={true}
onDragStart={onDragStart}
onDragEnd={onDragEnd}
onDragOver={(e)=>e.preventDefault()}
// dragOver( e ){ e.preventDefault };
>
<h2 className={styles.operatorItemTitle}>{title}</h2>
<div className={styles.operatorItemText}>{description}</div>
......
src/views/WorkFlowEdit/components/ParameterSetting/index.module.css
View file @ 52c8279d
......@@ -129,6 +129,12 @@
line-height: 20px;
color: rgba(255, 78, 78, 1);
}
.noParameters{
font-size: 12px;
text-align: center;
color: #C2C6CC;
line-height: 84px;
}
.noData {
height: calc(100vh - 140px);
......
src/views/WorkFlowEdit/components/ParameterSetting/index.tsx
View file @ 52c8279d
import _ from "lodash";
import { useCallback, useEffect, useMemo, useState } from "react";
import { useCallback, useMemo, useRef, useState } from "react";
import classNames from "classnames";
import {
......@@ -20,6 +20,7 @@ import MySwitch from "@/components/mui/MySwitch";
import Tabs from "@/components/mui/Tabs";
import { getCustomTemplateParameterCheckResult } from "../../util";
import MyTooltip from "@/components/mui/MyTooltip";
import { useSize } from "ahooks";
import styles from "./index.module.css";
......@@ -30,18 +31,13 @@ type IParameterSettingProps = {
};
const ParameterSetting = (props: IParameterSettingProps) => {
const { templateConfigInfo, setTemplateConfigInfo, taskId } = props; // 算子大数组
const [descHeight, setDescHeight] = useState(0); // 算子描述的高度 用来完成描述展开收起功能
const [isShowAllDese, setIsShowAllDese] = useState(false); // 是否展示全部描述
const [fileSelectOpen, setFileSelectOpen] = useState(false); // 选择输出路径的弹窗显示控制
const [fileSelectType, setFileSelectType] = useState<FileSelectType>("path");
const [parameterName, setParameterName] = useState(""); // 当前算子中的parameters中正在编辑饿parameter（参数）
const div = document.getElementById("descHeight"); // 算子描述的元素（不限高）用来完成描述展开收起功能
useEffect(() => {
if (div) {
setDescHeight(div.offsetHeight);
}
}, [div]);
const resizeRef = useRef<HTMLDivElement>(null);
const size = useSize(resizeRef) ;
// 文件夹路线选择器弹窗
const handleFileSelectOnClose = () => {
......@@ -67,6 +63,12 @@ const ParameterSetting = (props: IParameterSettingProps) => {
/** 通过parameter.name删除与之相关联的线 */
const handleHiddenDeleteEdge = useCallback(
(val: ITask[], parameterName: string) => {
let taskParentNode = "";
val.forEach((task) => {
if (task.id === taskId) {
taskParentNode = task.parentNode || "";
}
});
return (
val?.length &&
val?.map((item) => {
......@@ -92,7 +94,11 @@ const ParameterSetting = (props: IParameterSettingProps) => {
const newEdges =
(item?.edges?.length &&
item?.edges?.filter((every) => {
return every.targetHandle !== parameterName;
// 因为存在同名的parameterName 所以增加every.source === taskParentNode判断
return (
every.targetHandle !== parameterName ||
every.source === taskParentNode
);
})) ||
[];
return {
......@@ -182,7 +188,10 @@ const ParameterSetting = (props: IParameterSettingProps) => {
const renderInput = useCallback(
(parameter: IParameter) => {
return (
<MyTooltip title={parameter.description} placement="right">
<MyTooltip
title={parameter.description || parameter.name}
placement="right"
>
<div>
{(parameter.domType || "").toLowerCase() === "file" && (
<MyInput
......@@ -351,9 +360,15 @@ const ParameterSetting = (props: IParameterSettingProps) => {
if (!taskInfo) {
return [];
} else {
return taskInfo.parameters.filter(
(parameter) => parameter.parameterGroup === "in"
);
if (taskInfo.type === "BATCH") {
return taskInfo.parameters.filter(
(parameter) => parameter.parameterGroup === "in" && !parameter.thrown
);
} else {
return taskInfo.parameters.filter(
(parameter) => parameter.parameterGroup === "in"
);
}
}
}, [taskInfo]);
......@@ -362,9 +377,15 @@ const ParameterSetting = (props: IParameterSettingProps) => {
if (!taskInfo) {
return [];
} else {
return taskInfo.parameters.filter(
(parameter) => parameter.parameterGroup === "out"
);
if (taskInfo.type === "BATCH") {
return taskInfo.parameters.filter(
(parameter) => parameter.parameterGroup === "out" && !parameter.thrown
);
} else {
return taskInfo.parameters.filter(
(parameter) => parameter.parameterGroup === "out"
);
}
}
}, [taskInfo]);
......@@ -420,7 +441,7 @@ const ParameterSetting = (props: IParameterSettingProps) => {
[styles.required]: parameter.required,
})}
>
{parameter.name}
{parameter.title}
</div>
<div className={styles.parameterClassTypeName}>
{parameter.classTypeName}
......@@ -500,13 +521,14 @@ const ParameterSetting = (props: IParameterSettingProps) => {
{taskInfo.description || "-"}
</div>
<div
ref={resizeRef}
className={classNames({
[styles.taskDescriptionAll]: isShowAllDese,
[styles.taskDescription]: !isShowAllDese,
})}
>
{taskInfo.description || "-"}
{descHeight > 60 && (
{size && size?.height >= 60 && (
<span
className={styles.descButton}
onClick={() => setIsShowAllDese(!isShowAllDese)}
......@@ -547,7 +569,7 @@ const ParameterSetting = (props: IParameterSettingProps) => {
[styles.required]: parameter.required,
})}
>
{parameter.name}
{parameter.title}
</div>
<div className={styles.inOutParameterdataType}>
{parameter.classTypeName}
......@@ -559,6 +581,7 @@ const ParameterSetting = (props: IParameterSettingProps) => {
onChange={(e: any) =>
handleHiddenChange(e, parameter.name || "")
}
disabled={true}
></MySwitch>
</div>
</div>
......@@ -592,7 +615,7 @@ const ParameterSetting = (props: IParameterSettingProps) => {
[styles.required]: parameter.required,
})}
>
{parameter.name}
{parameter.title}
</div>
<div className={styles.inOutParameterdataType}>
{parameter.classTypeName}
......@@ -624,10 +647,12 @@ const ParameterSetting = (props: IParameterSettingProps) => {
</div>
<Tabs
tabList={paramsTabList}
defaultValue={activeParamsTab}
value={activeParamsTab}
// defaultValue={activeParamsTab}
allowNullValue={true}
tabPanelSx={{ padding: "7px 0" }}
/>
{basisParameters.length === 0 && seniorParameters.length === 0 && hardwareParameters.length === 0 && (<div className={styles.noParameters}>暂无可设置参数</div>)}
</div>
)}
{!taskInfo && (
......
src/views/WorkFlowEdit/components/SaveCustomTemplate/index.tsx
View file @ 52c8279d
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-07-15 15:47:16
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-15 16:30:59
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-23 11:32:19
* @FilePath: /bkunyun/src/views/WorkFlowEdit/components/SaveCustomTemplate/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -107,7 +107,7 @@ const SaveCustomTemplate = (props: IProps) => {
helperText: "必须输入模板名称",
});
return false;
} else if (title.length > 15) {
} else if (title.length > 50) {
setTitleHelper({
error: true,
helperText: "格式不正确，必须在15字符以内，仅限大小写字母、数字、中文",
......
src/views/WorkFlowEdit/index.module.css
View file @ 52c8279d
......@@ -45,14 +45,28 @@
bottom: 20px;
width: 36px;
height: 36px;
border-radius: 50%;
border-radius: 18px;
box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.14);
font-size: 30px;
line-height: 36px;
text-align: center;
text-align: start;
color: RGBA(66, 141, 255, 1);
cursor: pointer;
background-color: #fff;
transition: width 1s;
-webkit-transition: width 1s;
overflow: hidden;
display: flex;
justify-content: start;
align-items: center;
}
.addOperator:hover {
width: 105px;
}
.addText {
font-size: 14px;
line-height: 36px;
white-space: nowrap;
}
.swFlowBox {
flex: 1;
......
src/views/WorkFlowEdit/index.tsx
View file @ 52c8279d
......@@ -6,7 +6,7 @@
* @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import React, { useCallback, useEffect, useState } from "react";
import React, { useCallback, useEffect, useState, useMemo } from "react";
import ArrowBackIosNewIcon from "@mui/icons-material/ArrowBackIosNew";
import IconButton from "@mui/material/IconButton";
import _ from "lodash";
......@@ -25,6 +25,7 @@ import { getCustomTemplateParameterCheckResult } from "./util";
import useMyRequest from "@/hooks/useMyRequest";
import CustomOperator from "../CustomOperator";
import SaveCustomTemplate from "./components/SaveCustomTemplate";
import AddIcon from "@mui/icons-material/Add";
import styles from "./index.module.css";
......@@ -55,6 +56,7 @@ const WorkFlowEdit = observer((props: IProps) => {
const [oldversion, setOldersion] = useState(""); // 编辑是自定义模板的老版本
const [description, setDescription] = useState(""); // 自定义模板描述
const [creator, setCreator] = useState(""); // 自定义模板创建人
const [operatingArea, setOperatingArea] = useState<"form" | "flow">("form"); // 当前操作区域
const [leftContentType, setLeftContentType] = useState("list"); // 页面左侧展示的是算子列表还是参数设置
const [popperTitle, setPopperTitle] = useState(
......@@ -62,6 +64,14 @@ const WorkFlowEdit = observer((props: IProps) => {
"返回后，当前页面已填写内容将不保存，确认返回吗？"
);
// 是否要监听删除时间
const listenState = useMemo(() => {
if (operatingArea === "form") {
return false;
}
return !saveFormDialog && !showCustomOperator;
}, [operatingArea, saveFormDialog, showCustomOperator]);
// 编辑时获取模板详情的方法
const { run: fetchTemplateConfigInfoRun } = useMyRequest(
fetchTemplateConfigInfo,
......@@ -143,19 +153,25 @@ const WorkFlowEdit = observer((props: IProps) => {
return;
}
let templateConfigInfoClone: ITask[] = _.cloneDeep(templateConfigInfo);
let check = true;
let tasksIsCheck = true; // 整体校验
templateConfigInfoClone.forEach((task) => {
let taskIsCheck = true; // 单个task校验
task.parameters.forEach((parameter) => {
if (task.type === "BATCH" && parameter.thrown) {
return;
}
const checkResult = getCustomTemplateParameterCheckResult(parameter);
parameter.error = checkResult.error;
parameter.helperText = checkResult.helperText;
if (checkResult.error) {
check = false;
taskIsCheck = false;
tasksIsCheck = false;
}
});
task.isCheck = taskIsCheck;
});
setTemplateConfigInfo(templateConfigInfoClone);
if (!check) {
if (!tasksIsCheck) {
Message.error("工作流校验未通过，请检查！");
} else {
setSaveFormDialog(true);
......@@ -200,7 +216,12 @@ const WorkFlowEdit = observer((props: IProps) => {
</div>
</div>
<div className={styles.swContent}>
<div className={styles.swFormBox}>
<div
className={styles.swFormBox}
onClick={() => {
setOperatingArea("form");
}}
>
<div className={styles.radiosBox}>
<RadioGroupOfButtonStyle
radioOptions={radioOptions}
......@@ -234,16 +255,23 @@ const WorkFlowEdit = observer((props: IProps) => {
className={styles.addOperator}
onClick={() => setShowCustomOperator(true)}
>
+
<AddIcon sx={{ padding: "6px" }} />
<span className={styles.addText}>添加算子</span>
</div>
</div>
<div className={styles.swFlowBox} id="workFlowEditRight">
<div
className={styles.swFlowBox}
id="workFlowEditRight"
onClick={() => {
setOperatingArea("flow");
}}
>
<Flow
tasks={templateConfigInfo}
setTasks={setTemplateConfigInfo}
type="edit"
onFlowNodeClick={handleNodeClick}
ListenState={!saveFormDialog && !showCustomOperator}
ListenState={listenState}
/>
</div>
</div>
......
src/views/WorkFlowEdit/util.ts
View file @ 52c8279d
......@@ -50,7 +50,7 @@ export const getCustomTemplateParameterCheckResult = (
} else if (parameter.hidden && !parameter.linked) {
return {
error: true,
helperText: '该输入为必填，需在右侧视图编辑区连接输入文件或重新改回“开启”状态',
helperText: '该输入为必填，需在右侧视图编辑区连接输入文件',
deleteLine: false,
}
}
......
src/views/mui_demo/button.tsx deleted 100644 → 0
View file @ 1d752bdf
import { memo } from "react";
import DeleteIcon from "@mui/icons-material/Delete";
import Button from "@/components/mui/MyButton";
const ProjectMembers = () => {
return (
<>
<Button size={"large"} text={"确定"} />
&nbsp;&nbsp;
<Button text={"确定"} />
&nbsp;&nbsp;
<Button size={"small"} text={"确定"} />
<br />
<br />
<Button size={"large"} text={"确定"} disabled />
&nbsp;&nbsp;
<Button text={"确定"} disabled />
&nbsp;&nbsp;
<Button size={"small"} text={"确定"} disabled />
<br />
<br />
<Button size={"large"} color={"secondary"} text={"确定"} />
&nbsp;&nbsp;
<Button color={"secondary"} text={"确定"} />
&nbsp;&nbsp;
<Button size={"small"} color={"secondary"} text={"确定"} />
<br /> <br />
<Button
text={"确定"}
size={"large"}
style={{ color: "aqua", background: "burlywood" }}
/>
&nbsp;&nbsp;
<Button
text={"确定"}
style={{ color: "aqua", background: "burlywood" }}
/>
&nbsp;&nbsp;
<Button
text={"确定"}
size={"small"}
style={{ color: "aqua", background: "burlywood" }}
/>
<br /> <br />
outlined
<br />
<Button size={"large"} variant={"outlined"} text={"确定"} />
&nbsp;&nbsp;
<Button variant={"outlined"} text={"确定"} />
&nbsp;&nbsp;
<Button size={"small"} variant={"outlined"} text={"确定"} />
<br /> <br />
<Button size={"large"} variant={"outlined"} disabled text={"确定"} />
&nbsp;&nbsp;
<Button variant={"outlined"} disabled text={"确定"} />
&nbsp;&nbsp;
<Button size={"small"} variant={"outlined"} disabled text={"确定"} />
<br /> <br />
<Button
size={"large"}
variant={"outlined"}
color={"secondary"}
text={"确定"}
/>
&nbsp;&nbsp;
<Button variant={"outlined"} color={"secondary"} text={"确定"} />
&nbsp;&nbsp;
<Button
size={"small"}
variant={"outlined"}
color={"secondary"}
text={"确定"}
/>
<br /> <br />
<Button
text={"确定"}
size={"large"}
variant={"outlined"}
style={{ color: "aqua", background: "burlywood" }}
/>
&nbsp;&nbsp;
<Button
text={"确定"}
variant={"outlined"}
style={{ color: "aqua", background: "burlywood" }}
/>
&nbsp;&nbsp;
<Button
text={"确定"}
size={"small"}
variant={"outlined"}
style={{ color: "aqua", background: "burlywood" }}
/>
<br /> <br />
text
<br />
<Button
size={"large"}
variant={"text"}
text={"确定确定确定确定确定确定"}
/>
&nbsp;&nbsp;
<Button variant={"text"} text={"确定确定确定确定确定确定"} />
&nbsp;&nbsp;
<Button
size={"small"}
variant={"text"}
text={"确定确定确定确定确定确定"}
/>
<br />
<Button
size={"large"}
disabled
variant={"text"}
text={"确定确定确定确定确定确定"}
/>
&nbsp;&nbsp;
<Button variant={"text"} disabled text={"确定确定确定确定确定确定"} />
&nbsp;&nbsp;
<Button
size={"small"}
disabled
variant={"text"}
text={"确定确定确定确定确定确定"}
/>
<br />
<Button
size={"large"}
color={"secondary"}
variant={"text"}
text={"确定确定确定确定确定确定"}
/>
&nbsp;&nbsp;
<Button
variant={"text"}
color={"secondary"}
text={"确定确定确定确定确定确定"}
/>
&nbsp;&nbsp;
<Button
size={"small"}
color={"secondary"}
variant={"text"}
text={"确定确定确定确定确定确定"}
/>
<br /> <br />
img
<br />
<Button text={"确定确定确定确定确定确定"} img={<DeleteIcon />} />
<br /> <br />
select
<br />
<Button
text={"更多"}
select={[
{ name: "1111111" },
{ name: "1111111" },
{ name: "1111111" },
{ name: "1111111", color: "red" },
]}
/>
<Button
text={"更多"}
color={"secondary"}
variant={"text"}
select={[
{ name: "1111111" },
{ name: "1111111" },
{ name: "1111111" },
{ name: "1111111", color: "red" },
]}
/>
</>
);
};
export default memo(ProjectMembers);
src/views/mui_demo/input.tsx deleted 100644 → 0
View file @ 1d752bdf
import { memo } from "react";
import { InputAdornment } from "@mui/material";
import InputComponent from "@/components/mui/MyInput";
const ProjectMembers = () => {
return (
<>
<InputComponent
fullWidth={false}
label={"test"}
defaultValue={"sssssssss"}
/>
<InputComponent fullWidth={false} defaultValue={"sssssssss"} />
&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"} />
&nbsp;&nbsp;&nbsp;&nbsp;
<InputComponent fullWidth={false} placeholder={"测试机哦"} />
&nbsp;&nbsp;&nbsp;&nbsp;
<InputComponent
fullWidth={false}
size={"small"}
placeholder={"nishuoshenm"}
label={"asdasfasf"}
/>
<br /> <br />
<InputComponent fullWidth={true} />
<br />
<br />
{/* <SelectComponent
option={json}
/>
<br /><br />
<SelectComponent
option={json}
size={"large"}
/>
<br /><br />
<SelectComponent
option={json}
size={"small"}
/> */}
<br />
<br />
</>
);
};
export default memo(ProjectMembers);
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