Skip to content

B
bkunyun
Commit 41e296fd authored by wuyongsheng's avatar wuyongsheng
Browse files
Options

Merge branch 'feat-20220801' into 'release' 

Feat 20220801

See merge request !51
parents e3101834 87a6abe5
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1335 additions and 563 deletions
config/webpack.config.js
View file @ 41e296fd
This diff is collapsed.
public/index.html
View file @ 41e296fd
<!--
* @Author: 吴永生 15770852798@163.com
* @Date: 2022-08-02 11:43:28
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-10 10:40:49
* @FilePath: /bkunyun/public/index.html
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<!DOCTYPE html>
<html lang="cn">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<link rel="icon" href="%PUBLIC_URL%/facicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
......@@ -24,7 +32,7 @@
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>云平台</title>
<title>北鲲云-工作流平台</title>
<script src="%PUBLIC_URL%/RDKit_minimal.js"></script>
<script>
window
......
src/api/api_manager.ts
View file @ 41e296fd
......@@ -41,6 +41,8 @@ const RESTAPI = {
API_SAVE_USERSPEC:`${BACKEND_API_URI_PREFIX}/cpp/workflow/saveuserspec`, // 保存用户自定义工作流模板
API_OVERVIEW_GET:`${BACKEND_API_URI_PREFIX}/cpp/basicInformation`, // 获取概览基本信息
API_TASK_OVERVIEW_LIST:`${BACKEND_API_URI_PREFIX}/cpp/workflowJobInformation`, // 查询任务概览
API_OPERATOR_LISTSTREAMACTORS:`${BACKEND_API_URI_PREFIX}/cpp/workflow/liststreamactors`, // 获取流算子列表，可用于模糊查询，返回所有版本流算子
API_SAVE_BATCHACTOR:`${BACKEND_API_URI_PREFIX}/cpp/workflow/savebatchactor`, // 保存批算子
};
export default RESTAPI;
src/api/fileserver/CloudEController.ts
View file @ 41e296fd
......@@ -30,6 +30,15 @@ type IGetDatasetItemsListParams = {
sort?: string; // 排序
}
type IGetDatasetSizeParams = {
type?: string; // 产品id
projectId: string;
token: string;
filetoken: string;
path: string; // 数据集路径
name: string; // 数据集名称
}
type ISaveDatasetParams = {
type?: string;
projectId: string;
......@@ -229,6 +238,34 @@ class CloudEController {
}
}
// 获取文件文本内容（字符串）
static JobFileDownloadText(url: any, filetoken: string, projectId: string) {
if (ApiUtils.getAuthorizationHeaders(headers)) {
url = url + urlToken(filetoken, projectId);
headers["Cache-Control"] = "no-cache";
headers["Content-Type"] = "multipart/form-data";
return axios.get(
APIOPTION() + "/download" + url + "&showhidden=false",
{
headers: headers,
}
);
}
}
// 获取dataset条数
static GetDatasetSize(params: IGetDatasetSizeParams) {
if (ApiUtils.getAuthorizationHeaders(headers)) {
headers["Cache-Control"] = "no-cache";
let url = getUrlThroughParams(params, ['filetoken','path','token'], '?')
return axios.get(
`${APIOPTION()}:5003/size${url}`,
{
headers: headers,
}
);
}
}
// 获取分子列表
static GetDatasetItemsList(params: IGetDatasetItemsListParams) {
......
src/api/project_api.ts
View file @ 41e296fd
......@@ -270,6 +270,44 @@ const getTaskOverview=(params:getTaskOverviewParams)=>{
})
}
// 获取流算子列表，可用于模糊查询，返回所有版本流算子
type getOperatorListParams = {
productId: string;
keyword?: string;
page?: number;
size?: number;
};
const getOperatorList=(params:getOperatorListParams)=>{
return request({
url:Api.API_OPERATOR_LISTSTREAMACTORS,
method:"get",
params,
})
}
type saveBatchQuery = {
productId: string;
batchName: string;
batchVersion: string;
description?: string;
isEdit?: string;
}
type saveBatchBody = Array<any>
type saveBatchParams = {
query: saveBatchQuery;
body: saveBatchBody;
}
// 提交工作流
const saveBatchActor = (params: saveBatchParams) => {
return request({
url: Api.API_SAVE_BATCHACTOR,
method: "post",
params: params.query,
data: params.body,
});
};
export {
current,
......@@ -292,5 +330,7 @@ export {
submitWorkFlow,
getworkFlowTaskInfo,
getOverviewInfo,
getTaskOverview
getTaskOverview,
getOperatorList,
saveBatchActor
};
src/api/workbench_api.ts
View file @ 41e296fd
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-07-05 14:00:37
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-10 13:54:04
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-08 16:34:52
* @FilePath: /bkunyun/src/api/workbench_api.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import request from "@/utils/axios/service";
import Api from "./api_manager";
import { IGetOperatorListParams, IFetchOperatorListParams } from "./workbenchInterface";
import { IGetOperatorListParams } from "./workbenchInterface";
function current() {
return request({
......@@ -139,15 +139,6 @@ const fetchOperatorList = (params: IGetOperatorListParams) => {
};
// 获取指定版本算子
const fetchVersionOperator = (params: IFetchOperatorListParams) => {
return request({
url: Api.API_VERSION_OPERATOR,
method: "get",
params,
});
};
// 保存用户自定义工作流模板
const saveUserSpec = (params: any) => {
return request({
......@@ -168,6 +159,5 @@ export {
deleteWorkflowJob,
cancelWorkflowJob,
fetchOperatorList,
fetchVersionOperator,
saveUserSpec
};
src/components/BusinessComponents/FileSelect/index.module.css
View file @ 41e296fd
.FSBox {
width: 900px;
height: 650px;
position: relative;
}
......
src/components/BusinessComponents/NoProject/NoProject.tsx
View file @ 41e296fd
......@@ -12,16 +12,20 @@ import AddIcon from "@mui/icons-material/Add";
import AddProject from "@/views/Project/components/AddProject";
import React, { useState } from "react";
import MyButton from "@/components/mui/MyButton";
import { toJS } from "mobx";
import { observer } from "mobx-react-lite";
import { useStores } from "@/store/index";
const NoProject = () => {
const NoProject = observer((props: any) => {
// 新建弹窗显示控制
const [addOpen, setAddOpen] = useState(false);
const { currentProjectStore } = useStores();
let projectList = toJS(currentProjectStore.projectList)
return (
<div className={style.noProject}>
<img src={noData} alt="" className={style.noDataImg} />
<div className={style.text1}>当前产品暂无项目</div>
<div className={style.text2}>请先创建项目</div>
<div className={style.text1}>{projectList.length > 0 ? "当前未选中任何项目" : "当前产品暂无项目"}</div>
<div className={style.text2}>{projectList.length > 0 ? "或创建新项目" : "请先创建项目"}</div>
<MyButton
text='创建项目'
variant="contained"
......@@ -30,11 +34,11 @@ const NoProject = () => {
onClick={() => setAddOpen(true)}
style={{ backgroundColor: "#1370ff", color: "#fff" }}
/>
<AddProject addOpen={addOpen} setAddOpen={setAddOpen} />
</div>
);
};
});
export default NoProject;
src/components/CommonComponents/RadioGroupOfButtonStyle/index.module.css
View file @ 41e296fd
......@@ -4,7 +4,7 @@
align-items: center;
border: 1px solid #e6e8eb;
border-radius: 4px;
background-color: #F0F2F5;
background-color: #f0f2f5;
cursor: pointer;
height: 32px;
box-sizing: border-box;
......@@ -12,7 +12,7 @@
}
.radio {
position: relative;
min-width: 64px;
min-width: 63px;
height: 28px;
box-sizing: border-box;
font-size: 14px;
......@@ -28,18 +28,8 @@
white-space: nowrap;
}
.radio:not(:last-child)::before {
position: absolute;
width: 1px;
height: 16px;
top: 6px;
right: 0;
content: '';
background-color: #D1D6DE;
}
.radioActive {
color: #1370ff;
background-color: #fff;
box-shadow: 2px 4px 12px 0px rgba(0,27,63,0.06);
box-shadow: 2px 4px 12px 0px rgba(0, 27, 63, 0.06);
}
src/components/MySnackbar/MySnackbarProvider.tsx
View file @ 41e296fd
......@@ -5,152 +5,149 @@ import snackbarContext from "./snackbarContext";
import { ThemeProvider, createTheme } from "@mui/material/styles";
type MySnackbarProviderProp = {
vertical?: "bottom" | "top";
horizontal?: "center" | "left" | "right";
autoHideDuration?: number;
snackerClasses?: object;
ClickAwayListenerProps?: object;
ContentProps?: object;
disableWindowBlurListener?: boolean;
resumeHideDuration?: number;
snackbarSx?: object;
transition?: "grow" | "fade";
transitionDuration?: number;
TransitionProps?: object;
alertClasses?: object;
closeText?: string;
variant?: "filled" | "outlined" | "standard";
errorIcon?: ReactNode;
infoIcon?: ReactNode;
successIcon?: ReactNode;
warningIcon?: ReactNode;
elevation?: number;
alertSx?: object;
children?: ReactNode;
vertical?: "bottom" | "top";
horizontal?: "center" | "left" | "right";
autoHideDuration?: number;
snackerClasses?: object;
ClickAwayListenerProps?: object;
ContentProps?: object;
disableWindowBlurListener?: boolean;
resumeHideDuration?: number;
snackbarSx?: object;
transition?: "grow" | "fade";
transitionDuration?: number;
TransitionProps?: object;
alertClasses?: object;
closeText?: string;
variant?: "filled" | "outlined" | "standard";
errorIcon?: ReactNode;
infoIcon?: ReactNode;
successIcon?: ReactNode;
warningIcon?: ReactNode;
elevation?: number;
alertSx?: object;
children?: ReactNode;
};
const getTransitionComponent = (transition: "grow" | "fade") => {
switch (transition) {
case "grow":
return Grow;
case "fade":
return Fade;
default:
return Grow;
}
switch (transition) {
case "grow":
return Grow;
case "fade":
return Fade;
default:
return Grow;
}
};
const MySnackbarProvider = ({
vertical = "top",
horizontal = "center",
autoHideDuration = 890000,
snackerClasses,
ClickAwayListenerProps,
ContentProps,
disableWindowBlurListener = true,
resumeHideDuration,
snackbarSx,
transition = "grow",
transitionDuration,
TransitionProps = {},
alertClasses,
closeText = "Close",
variant = "standard",
errorIcon,
infoIcon,
successIcon,
warningIcon,
elevation = 3,
alertSx,
children,
vertical = "top",
horizontal = "center",
autoHideDuration = 3000,
snackerClasses,
ClickAwayListenerProps,
ContentProps,
disableWindowBlurListener = true,
resumeHideDuration,
snackbarSx,
transition = "grow",
transitionDuration,
TransitionProps = {},
alertClasses,
closeText = "Close",
variant = "standard",
errorIcon,
infoIcon,
successIcon,
warningIcon,
elevation = 3,
alertSx,
children,
}: MySnackbarProviderProp) => {
const {
open,
messageInfo,
handleExited,
success,
error,
warning,
info,
close,
} = useMySnackbar();
// .MuiAlert-filledInfo
const {
open,
messageInfo,
handleExited,
success,
error,
warning,
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 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({
const theme = createTheme({
components: {
MuiAlert: {
styleOverrides: {
root: {
color: getColorStyle,
"& .MuiAlert-icon": {
color: getColorStyle
},
}
root: {
color: getColorStyle,
"& .MuiAlert-icon": {
color: getColorStyle,
},
},
},
},
},
});
return (
<Fragment>
<ThemeProvider theme={theme}>
<Snackbar
open={open}
autoHideDuration={autoHideDuration}
onClose={close}
anchorOrigin={{ vertical: vertical, horizontal: horizontal }}
classes={snackerClasses}
ClickAwayListenerProps={ClickAwayListenerProps}
ContentProps={ContentProps}
disableWindowBlurListener={disableWindowBlurListener}
resumeHideDuration={resumeHideDuration}
sx={snackbarSx}
TransitionComponent={getTransitionComponent(transition)}
transitionDuration={transitionDuration}
TransitionProps={{ onExited: handleExited, ...TransitionProps }}
>
<Alert
id="Alert"
classes={alertClasses}
closeText={closeText}
iconMapping={{
error: errorIcon,
info: infoIcon,
success: successIcon,
warning: warningIcon,
}}
severity={messageInfo?.severity}
variant={variant}
elevation={elevation}
sx={{ boxShadow: "unset", ...alertSx }}
>
{messageInfo?.content}
</Alert>
</Snackbar>
</ThemeProvider>
<snackbarContext.Provider value={{ success, error, warning, info }}>
{children}
</snackbarContext.Provider>
</Fragment>
);
return (
<Fragment>
<ThemeProvider theme={theme}>
<Snackbar
open={open}
autoHideDuration={autoHideDuration}
onClose={close}
anchorOrigin={{ vertical: vertical, horizontal: horizontal }}
classes={snackerClasses}
ClickAwayListenerProps={ClickAwayListenerProps}
ContentProps={ContentProps}
disableWindowBlurListener={disableWindowBlurListener}
resumeHideDuration={resumeHideDuration}
sx={snackbarSx}
TransitionComponent={getTransitionComponent(transition)}
transitionDuration={transitionDuration}
TransitionProps={{ onExited: handleExited, ...TransitionProps }}
>
<Alert
id="Alert"
classes={alertClasses}
closeText={closeText}
iconMapping={{
error: errorIcon,
info: infoIcon,
success: successIcon,
warning: warningIcon,
}}
severity={messageInfo?.severity}
variant={variant}
elevation={elevation}
sx={{ boxShadow: "unset", ...alertSx }}
>
{messageInfo?.content}
</Alert>
</Snackbar>
</ThemeProvider>
<snackbarContext.Provider value={{ success, error, warning, info }}>
{children}
</snackbarContext.Provider>
</Fragment>
);
};
export default MySnackbarProvider;
src/components/mui/MyDialog.tsx
View file @ 41e296fd
......@@ -122,12 +122,16 @@ const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
"& .MuiPaper-root": {
// 设置最大宽度， 实际宽度让子元素撑大
maxWidth: "1920px",
borderRadius: "8px"
},
},
}}
>
{isHideHeader ? null : (
<DialogTitle id="alert-dialog-title">
<DialogTitle
id="alert-dialog-title"
sx={{ padding: "20px 24px" }}
>
<div
style={{
display: "flex",
......@@ -136,10 +140,10 @@ const MyDialog: React.FunctionComponent<IDialogProps> = (props) => {
fontWeight: 600,
}}
>
<span style={{fontSize: 16, lineHeight: '24px', color: '#1E2633'}}>{title}</span>
<span style={{ fontSize: 16, lineHeight: '24px', color: '#1E2633' }}>{title}</span>
<CloseIcon
onClick={onClose}
sx={{ color: "#C2C6CC", cursor: "pointer", ":hover": { background: "#f0f2f5", borderRadius:'2px' } }}
sx={{ color: "#C2C6CC", cursor: "pointer", ":hover": { background: "#f0f2f5", borderRadius: '2px' } }}
/>
</div>
</DialogTitle>
......
src/components/mui/MyPopconfirm.tsx
View file @ 41e296fd
......@@ -68,7 +68,8 @@ const MyPopconfirm = (props: IMyPopconfirmProps) => {
zIndex: 2000,
bgcolor: "#fff",
minWidth: "200px",
borderRadius: "2px",
borderRadius: "4px",
fontSize:"14px",
padding: "20px 16px",
boxShadow: "0px 3px 10px 0px rgba(0, 24, 57, 0.14)",
}}
......
src/components/mui/MyRadio.tsx
View file @ 41e296fd
......@@ -11,65 +11,72 @@ import Radio from "@mui/material/Radio";
import RadioGroup, { RadioGroupProps } from "@mui/material/RadioGroup";
import FormControlLabel from "@mui/material/FormControlLabel";
import FormControl from "@mui/material/FormControl";
import FormHelperText from '@mui/material/FormHelperText';
import FormHelperText from "@mui/material/FormHelperText";
interface IMyRadioProps extends RadioGroupProps {
value: any;
options: Array<ICheckBoxOption>;
onChange: any;
variant?: "standard" | "outlined" | "filled";
error?: boolean;
helperText?: string;
};
value: any;
options: Array<ICheckBoxOption>;
onChange: any;
variant?: "standard" | "outlined" | "filled";
error?: boolean;
helperText?: string;
}
type ICheckBoxOption = {
value: any;
label?: string;
disabled?: boolean;
value: any;
label?: string;
disabled?: boolean;
};
// 如果后端给的options不是 value-label的字段可以用下面的方法转换
export const optionsTransform = (
arr: Array<any>,
labelKey: string = "label",
valueKey: string = "value",
disabledKey: string = "disabled"
arr: Array<any>,
labelKey: string = "label",
valueKey: string = "value",
disabledKey: string = "disabled"
): Array<ICheckBoxOption> => {
return arr.map((item: any) => {
return {
value: item[valueKey],
label: item[labelKey],
disabled: item[disabledKey] || false,
};
});
return arr.map((item: any) => {
return {
value: item[valueKey],
label: item[labelKey],
disabled: item[disabledKey] || false,
};
});
};
export default function MyRadio(props: IMyRadioProps) {
const { value, options, onChange , error = false, helperText, variant} = props;
const {
value,
options,
onChange,
error = false,
helperText,
variant,
} = props;
return (
<FormControl fullWidth variant={variant} error={error}>
<RadioGroup
{...props}
row
aria-labelledby="demo-row-radio-buttons-group-label"
name="row-radio-buttons-group"
value={value}
onChange={onChange}
>
{options.map((option) => {
return (
<FormControlLabel
key={option.value}
value={option.value}
control={<Radio />}
label={option.label}
disabled={option.disabled}
/>
);
})}
</RadioGroup>
{helperText && error && <FormHelperText>{helperText}</FormHelperText>}
</FormControl>
);
return (
<FormControl fullWidth variant={variant} error={error}>
<RadioGroup
{...props}
row
aria-labelledby="demo-row-radio-buttons-group-label"
name="row-radio-buttons-group"
value={value}
onChange={onChange}
>
{options.map((option) => {
return (
<FormControlLabel
key={option.value}
value={option.value}
control={<Radio sx={{ color: "rgba(209, 214, 222, 1)" }} />}
label={option.label}
disabled={option.disabled}
/>
);
})}
</RadioGroup>
{helperText && error && <FormHelperText>{helperText}</FormHelperText>}
</FormControl>
);
}
src/components/mui/MySelect.tsx
View file @ 41e296fd
......@@ -128,7 +128,7 @@ export default function MySelect(props: IProps) {
return (
<ThemeProvider theme={theme}>
<FormControl fullWidth={fullWidth} variant={variant}>
<FormControl fullWidth={fullWidth} variant={variant} error={error}>
{isTitle ? (
<InputLabel id="demo-simple-select-label">
{title || "请选择"}
......
src/components/mui/MySwitch.tsx
View file @ 41e296fd
......@@ -11,7 +11,8 @@ import Switch, { SwitchProps } from "@mui/material/Switch";
import { ThemeProvider, createTheme } from "@mui/material/styles";
interface IMySwitchProps extends SwitchProps {
value: boolean;
value?: boolean;
defaultChecked?: boolean;
onChange?: any;
disabled?: boolean;
}
......@@ -52,23 +53,24 @@ const theme = createTheme({
});
const MySwitch = (props: IMySwitchProps) => {
const { value, onChange, disabled = false, size, ...other } = props;
const { value, defaultChecked, onChange, disabled = false, size, ...other } = props;
return (
<ThemeProvider theme={theme}>
<Switch
checked={value}
disabled={disabled}
defaultChecked={defaultChecked}
onChange={onChange}
sx={
size === "medium"
? {
width: 44,
height: 24,
}
width: 44,
height: 24,
}
: {
width: 40,
height: 22,
}
width: 40,
height: 22,
}
}
{...other}
/>
......
src/components/mui/Tabs.tsx
View file @ 41e296fd
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:18:13
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-04 20:18:17
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-10 11:06:12
* @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -44,6 +44,9 @@ const theme = createTheme({
minWidth: "20px",
marginRight: "32px",
color: "#8A9099",
":hover": {
color: "#1E2633",
},
selected: {
color: "#1976d2",
},
......@@ -75,8 +78,8 @@ const Tabs = (props: IProps) => {
defaultValue
? defaultValue
: allowNullValue
? ""
: tabList.filter((e) => !e.hide)[0].value
? ""
: tabList.filter((e) => !e.hide)[0].value
);
const onChange = (val: string) => {
......@@ -95,7 +98,14 @@ const Tabs = (props: IProps) => {
) : (
""
)}
<Typography sx={{ fontSize: "14px", lineHeight: "22px", height: "22px", fontWeight: "400" }}>
<Typography
sx={{
fontSize: "14px",
lineHeight: "22px",
height: "22px",
fontWeight: "400",
}}
>
{item.label}
</Typography>
</Box>
......@@ -118,7 +128,7 @@ const Tabs = (props: IProps) => {
<Tab
key={key}
label={labelRender(item, key)}
value={item.value}
value={item.value || ""}
id={item.value}
disabled={item.disabled}
/>
......@@ -130,7 +140,11 @@ const Tabs = (props: IProps) => {
?.filter((item) => !item.hide)
.map((item) => {
return (
<TabPanel sx={tabPanelSx} value={item.value} key={item.value}>
<TabPanel
sx={tabPanelSx}
value={item.value || ""}
key={item.value}
>
{item.component}
</TabPanel>
);
......
src/views/CustomOperator/components/OperatorList/index.module.css
View file @ 41e296fd
......@@ -38,22 +38,36 @@
}
.li {
background-color: RGBA(240, 242, 245, 1);
padding: 7px 7px 7px 28px;
padding: 7px 9px;
color: rgba(30, 38, 51, 1);
font-size: 14px;
line-height: 22px;
margin-bottom: 12px;
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
}
.nameVersion {
flex: 1;
/* text-align: left; */
margin-left: 13px;
word-wrap: break-word;
/* text-overflow: clip; */
max-width: 140px;
}
.name {
margin-right: 8px;
}
.version {
white-space: nowrap;
}
.icon {
width: 6px;
height: 10px;
position: absolute;
/* position: absolute;
top: 13px;
left: 9px;
left: 9px; */
display: flex;
flex-direction: column;
justify-content: space-between;
......@@ -67,3 +81,12 @@
height: 2px;
background-color: rgba(86, 92, 102, 1);
}
.loading {
display: flex;
justify-content: center;
align-items: center;
line-height: 20px;
font-size: 12px;
color: rgba(86, 92, 102, 1);
padding: 4px;
}
src/views/CustomOperator/components/SaveOperator/index.tsx 0 → 100644
View file @ 41e296fd
import MyDialog from "@/components/mui/MyDialog";
import MyInput from "@/components/mui/MyInput";
import { checkIsNumberLetterChinese } from "@/utils/util";
import _ from "lodash";
import { useState } from "react";
import useMyRequest from "@/hooks/useMyRequest";
import { saveBatchActor } from "@/api/project_api";
import { useStores } from "@/store";
import { useMessage } from "@/components/MySnackbar";
import { toJS } from "mobx";
import { ITask } from "@/views/Project/ProjectSubmitWork/interface";
interface IProps {
saveFormDialog: boolean;
setSaveFormDialog: (val: boolean) => void;
operatorList: ITask[];
setShowCustomOperator: any;
}
const SaveOperator = (props: IProps) => {
const {
saveFormDialog,
setSaveFormDialog,
operatorList,
setShowCustomOperator,
} = props;
const { currentProjectStore } = useStores();
const Message = useMessage();
const productId = toJS(currentProjectStore.currentProductInfo.id);
const [title, setTitle] = useState("");
const [version, setVersion] = useState("1.0.0");
const [description, setDescription] = useState("");
// 保存批算子
const { run: saveBatchActorRun, loading } = useMyRequest(saveBatchActor, {
onSuccess: (res) => {
Message.success("保存算子成功");
sessionStorage.setItem("operatorList", "[]");
setSaveFormDialog(false);
setShowCustomOperator();
},
});
const [titleHelper, setTitleHelper] = useState({
// 算子名称错误提示
error: false,
helperText: "",
});
const [versionHelper, setVersionHelper] = useState({
// 算子版本错误提示
error: false,
helperText: "",
});
// 关闭表单弹窗
const handleCloseDialog = () => {
setSaveFormDialog(false);
};
// 算子名称
const handleTitleChange = (e: any) => {
const title = e.target.value;
setTitle(title);
checkTitle(title);
};
// 算子版本
const handleVersionChange = (e: any) => {
let version = e.target.value;
setVersion(version);
checkVersion(version);
};
// 算子描述
const handleDescriptionChange = (e: any) => {
let description = e.target.value;
if (description.length < 301) {
setDescription(description);
}
};
// 校验算子名称
const checkTitle = (title: string) => {
if (!title) {
setTitleHelper({
error: true,
helperText: "必须输入算子名称",
});
return false;
} else if (title.length > 15) {
setTitleHelper({
error: true,
helperText: "格式不正确，必须在15字符以内，仅限大小写字母、数字、中文",
});
return false;
} else if (!checkIsNumberLetterChinese(title)) {
setTitleHelper({
error: true,
helperText: "格式不正确，必须在15字符以内，仅限大小写字母、数字、中文",
});
return false;
} else {
setTitleHelper({
error: false,
helperText: "",
});
return true;
}
};
// 校验版本号格式
const checkVersion = (version: string) => {
if (/^[1-9]\d?(\.(0|[1-9]\d?)){2}$/.test(version)) {
setVersionHelper({
error: false,
helperText: "",
});
return true;
} else {
setVersionHelper({
error: true,
helperText: "格式不正确，必须为X.Y.Z格式，且XYZ必须为0~99的正整数",
});
return false;
}
};
// 坐标转换
const positionTransform = () => {
const copyOperatorList: ITask[] = _.cloneDeep(operatorList);
const positionXArr = copyOperatorList.map((operatorLi) => {
return operatorLi.position.x;
});
const positionYArr = copyOperatorList.map((operatorLi) => {
return operatorLi.position.y;
});
let minPositionX = Math.min(...positionXArr);
let minPositionY = Math.min(...positionYArr);
let startingPointX = minPositionX - 40;
let startingPointY = minPositionY - 10;
return copyOperatorList.map((operatorLi) => {
return {
...operatorLi,
position: {
x: operatorLi.position.x - startingPointX,
y: operatorLi.position.y - startingPointY,
},
};
});
};
// 表单弹窗确定，新建算子
const handleOncofirm = () => {
if (checkTitle(title) && checkVersion(version)) {
saveBatchActorRun({
query: {
productId: productId as string,
batchName: title,
batchVersion: version,
description: description,
},
body: positionTransform(),
});
}
};
return (
<MyDialog
open={saveFormDialog}
title="保存算子"
onClose={handleCloseDialog}
onConfirm={handleOncofirm}
loading={loading}
>
<div style={{ width: "388px" }}>
<MyInput
value={title}
label="算子名称"
onChange={handleTitleChange}
required
error={titleHelper.error}
helperText={titleHelper.helperText}
style={{ margin: "20px 0" }}
></MyInput>
<MyInput
value={version}
label="版本号"
onChange={handleVersionChange}
error={versionHelper.error}
helperText={versionHelper.helperText}
style={{ marginBottom: "20px" }}
></MyInput>
<div style={{ position: "relative" }}>
<MyInput
value={description}
id="desc"
label="模板描述"
placeholder="模板描述"
onChange={handleDescriptionChange}
multiline
rows={4}
/>
<span
style={{
position: "absolute",
bottom: "7px",
right: "12px",
color: description.length >= 300 ? "#d32f2f" : "#C2C6CC",
}}
>
{description.length}/300
</span>
</div>
</div>
</MyDialog>
);
};
export default SaveOperator;
src/views/CustomOperator/index.tsx
View file @ 41e296fd
......@@ -3,33 +3,188 @@ import { observer } from "mobx-react-lite";
import FullScreenDrawer from "@/components/CommonComponents/FullScreenDrawer";
import MyButton from "@/components/mui/MyButton";
import OperatorList from "./components/OperatorList";
import Flow from "../Project/components/Flow";
// import Flow from "../Project/components/Flow";
import { useMessage } from "@/components/MySnackbar";
import BatchOperatorFlow from "../Project/components/Flow/components/BatchOperatorFlow";
import SaveOperator from "./components/SaveOperator";
import { ITask } from "../Project/ProjectSubmitWork/interface";
import _ from "lodash";
import styles from "./index.module.css";
type IProps = {
setShowCustomOperator: any;
initOperatorList: ITask[];
};
const CustomOperator = observer((props: IProps) => {
const { setShowCustomOperator } = props;
const { setShowCustomOperator, initOperatorList } = props;
const Message = useMessage();
const [operatorList, setOperatorList] = useState<ITask[]>(initOperatorList);
const [saveFormDialog, setSaveFormDialog] = useState(false);
// const [showCustomOperator, setShowCustomOperator] = useState(false);
/** 设置选中唯一标识符 */
const handleNodeClick = useCallback((val: string) => {
// setSelectTaskId(val);
// console.log(val);
}, []);
// 判断 每个流算子必须至少有一条连接线。
const checkHasOneLine = (sourceArr: string[], targetArr: string[]) => {
console.log("checkHasOneLine");
const all = _.uniq([...sourceArr, ...targetArr]);
if (all.length === operatorList.length) {
console.log("checkHasOneLine1");
return true;
} else {
console.log("checkHasOneLine2");
return false;
}
// _.uniq([2, 1, 2]);
};
// 判断 每个起始算子（可以有多个起始点）的输入必须为文件的路径输入或数据集的路径输入。
const checkIn = (targetArr: string[]) => {
console.log("checkIn");
const uniqTargetArr = _.uniq(targetArr);
if (uniqTargetArr.length === operatorList.length) {
// 流节点连成一个圈了
return false;
}
let check = true;
operatorList.forEach((flowNode) => {
if (uniqTargetArr.indexOf(flowNode.id) === -1) {
// 该节点的输入没有连线 也就是说这个节点是起点
const inArr = flowNode.parameters.filter(
(parameter) => parameter.parameterGroup === "in"
);
if (inArr.length > 0) {
if (
!inArr.some((inItem) => {
return (
(inItem.domType || "").toLowerCase() === "dataset" ||
(inItem.domType || "").toLowerCase() === "path" ||
(inItem.domType || "").toLowerCase() === "file"
);
})
) {
check = false;
}
} else {
// 起点没有输入
check = false;
}
}
});
return check;
};
// 判断 起码有一个结尾算子（可以有多个结尾点）的输出必须为文件保存或数据集保存。
const checkOut = (sourceArr: string[]) => {
console.log("checkOut");
const uniqSourceArr = _.uniq(sourceArr);
if (uniqSourceArr.length === operatorList.length) {
// 流节点连成一个圈了
return false;
}
let check = true;
operatorList.forEach((flowNode) => {
if (uniqSourceArr.indexOf(flowNode.id) === -1) {
// 该节点的输入没有连线 也就是说这个节点是起点
const outArr = flowNode.parameters.filter(
(parameter) => parameter.parameterGroup === "out"
);
if (outArr.length > 0) {
if (
!outArr.some((outItem) => {
return (
(outItem.domType || "").toLowerCase() === "dataset" ||
(outItem.domType || "").toLowerCase() === "file" ||
(outItem.domType || "").toLowerCase() === "path"
);
})
) {
check = false;
}
} else {
// 起点没有输入
check = false;
}
}
});
return check;
};
useEffect(() => {
sessionStorage.setItem("operatorList", JSON.stringify(operatorList));
}, [operatorList]);
const handleCheck = () => {
if (operatorList.length === 0) {
Message.error("内容不能为空！");
return;
}
let sourceArr: string[] = [];
let targetArr: string[] = [];
operatorList.forEach((flowNode) => {
flowNode.edges.forEach((edge) => {
edge.source && sourceArr.push(edge.source);
edge.target && targetArr.push(edge.target);
});
});
console.log("operatorList", operatorList);
console.log("sourceArr", sourceArr);
console.log("targetArr", targetArr);
if (!checkHasOneLine([...sourceArr], [...targetArr])) {
console.log("checkHasOneLine");
Message.error("内容校验未通过，请检查！");
return;
}
if (!checkIn([...targetArr])) {
console.log("checkIn");
Message.error("内容校验未通过，请检查！");
return;
}
if (!checkOut([...sourceArr])) {
console.log("checkOut");
Message.error("内容校验未通过，请检查！");
return;
}
setSaveFormDialog(true);
};
return (
<FullScreenDrawer handleClose={setShowCustomOperator} zIndex={1100}>
<div className={styles.customOperator}>
<div className={styles.coTop}>
<div className={styles.coTitle}>添加算子</div>
<MyButton text="添加"></MyButton>
<MyButton
text="添加"
onClick={() => {
handleCheck();
}}
></MyButton>
<SaveOperator
saveFormDialog={saveFormDialog}
setSaveFormDialog={setSaveFormDialog}
operatorList={operatorList}
setShowCustomOperator={setShowCustomOperator}
></SaveOperator>
</div>
<div className={styles.coContent}>
<OperatorList />
<Flow
showControls={false}
// tasks={templateConfigInfo}
// setTasks={setTemplateConfigInfo}
<div className={styles.coContent} id="customOperatorFlow">
<OperatorList
operatorList={operatorList}
setOperatorList={setOperatorList}
/>
<BatchOperatorFlow
tasks={operatorList}
setTasks={setOperatorList}
type="edit"
// onFlowNodeClick={handleNodeClick}
// ListenState={!saveFormDialog}
onFlowNodeClick={handleNodeClick}
flowNodeDraggable={true}
ListenState={!saveFormDialog}
showVersion={true}
showControls={false}
/>
</div>
</div>
......
src/views/MenuLayout/index.module.css
View file @ 41e296fd
.container {
display: flex;
align-items: flex-start;
justify-content: center;
display: flex;
align-items: flex-start;
justify-content: center;
}
.aside {
border-right: 1px solid #e6e8eb;
width: 10%;
min-width: 220px;
height: calc(100vh - 57px);
background-color: #f7f8fa;
border-right: 1px solid #e6e8eb;
width: 10%;
min-width: 220px;
height: calc(100vh - 57px);
background-color: #f7f8fa;
}
.content {
flex: 1;
height: calc(100vh - 57px);
overflow: scroll;
flex: 1;
height: calc(100vh - 57px);
overflow: scroll;
}
.listItem {
padding: 8px 25px;
height: 38px;
box-sizing: border-box;
cursor: pointer;
color: #565c66;
font-size: 14px;
line-height: 22px;
padding: 8px 25px;
height: 38px;
box-sizing: border-box;
cursor: pointer;
color: #565c66;
font-size: 14px;
line-height: 22px;
border-left: 3px solid #fff;
}
.listItem:hover {
background-color: #EEF1F5;
background-color: #eef1f5;
}
.routerIcon{
vertical-align: middle;
margin-right: 12px;
line-height: 22px;
.routerIcon {
vertical-align: middle;
margin-right: 12px;
line-height: 22px;
}
.active {
border-left: 3px solid #1370ff;
color: #1370ff;
background-color: #ebedf0;
border-left: 3px solid #1370ff;
color: #1370ff;
background-color: #ebedf0;
}
src/views/MenuLayout/index.tsx
View file @ 41e296fd
......@@ -41,7 +41,7 @@ const MenuLayout = observer(() => {
return (
<Box className={style.container}>
<Box className={style.aside}>
{
{
pathname.indexOf('userCenter') < 0 && <CurrentProject />
}
<List
......@@ -62,7 +62,7 @@ const MenuLayout = observer(() => {
onClick={() => item.type === "page" && navigate(item.path)}
>
<img className={style.routerIcon} src={routerIcon(item.id || '', `/v3${item.path}` === pathname) || undefined} alt='' />
<span style={{ verticalAlign: 'middle' }}>{item.name}</span>
<span style={{ verticalAlign: 'middle', fontWeight: '500' }}>{item.name}</span>
</li>
);
}
......
src/views/Project/ProjectData/AddFolder/index.tsx
View file @ 41e296fd
......@@ -97,7 +97,7 @@ const AddFolder = (props: IAddFolderProps) => {
<MyButton
text="新建文件夹"
variant="outlined"
size="small"
size="medium"
onClick={() => setDeleteDialogOpen(true)}
disabled={
selectIds.length !== 0 || !isPass("PROJECT_DATA_ADDDIR", "USER")
......
src/views/Project/ProjectData/SeeDataset/index.tsx
View file @ 41e296fd
......@@ -159,7 +159,7 @@ const SeeDataset = observer((props: ISeeDatasetProps) => {
};
return (
<FullScreenDrawer handleClose={props.handleClose}>
<FullScreenDrawer handleClose={props.handleClose} zIndex={1100}>
<div
className={classNames({
[style.datasetBox]: true,
......
src/views/Project/ProjectData/SeeDataset/save.tsx
View file @ 41e296fd
......@@ -164,12 +164,12 @@ const Save = (props: ISaveProps) => {
value={showDpath}
required
label="保存路径"
onClick={() => {
setFileSelectOpen(true);
}}
InputProps={{
endAdornment: (
<img
onClick={() => {
setFileSelectOpen(true);
}}
src={fileSelectIcon}
alt="选择输出路径"
style={{ cursor: "pointer" }}
......
src/views/Project/ProjectData/UpLoaderFile/index.module.css
View file @ 41e296fd
.uploderBox {
width: 900px;
display: flex;
justify-content: space-between;
width: 900px;
display: flex;
justify-content: space-between;
}
.uploderBoxLeft {
width: 300px;
width: 300px;
}
.dropTitle {
line-height: 22px;
font-size: 14px;
color: #1e2633;
margin-bottom: 14px;
font-weight: 600;
line-height: 22px;
font-size: 14px;
color: #1e2633;
margin-bottom: 14px;
font-weight: 600;
}
.dropBox {
height: 300px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
border: 1px dashed #d1d6de;
border-radius: 4px;
cursor: pointer;
height: 300px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
border: 1px dashed #d1d6de;
border-radius: 4px;
}
.dropBox:hover {
background-color: #f7f8fa;
}
.dropBoxDragActive {
background-color: #f7f8fa;
background-color: #f7f8fa;
}
.uploaderIcon {
width: 56px;
margin-bottom: 24px;
width: 56px;
margin-bottom: 24px;
}
.uploderText1 {
line-height: 22px;
font-size: 14px;
color: #565c66;
margin-bottom: 2px;
line-height: 22px;
font-size: 14px;
color: #565c66;
margin-bottom: 2px;
}
.uploderText2 {
line-height: 20px;
font-size: 12px;
color: #8a9099;
line-height: 20px;
font-size: 12px;
color: #8a9099;
}
.fileListBox {
width: 528px;
box-sizing: border-box;
position: relative;
width: 528px;
box-sizing: border-box;
position: relative;
}
/* .tableBox {
height: 300px;
overflow: scroll;
} */
.fileIconBox {
display: flex;
justify-content: flex-start;
align-items: center;
}
.fileIconBoxText{
display: block;
width: 260px;
overflow: hidden;
text-overflow: ellipsis;
-o-text-overflow:ellipsis;
white-space: nowrap;
display: flex;
justify-content: flex-start;
align-items: center;
}
.fileIconBoxText {
display: block;
width: 260px;
overflow: hidden;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
white-space: nowrap;
}
.noFile {
position: absolute;
top: 92px;
height: 200px;
width: 100%;
background-color: #fff;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: absolute;
top: 92px;
height: 200px;
width: 100%;
background-color: #fff;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.noFileIcon {
width: 83px;
height: 70px;
height: auto;
margin-bottom: 6px;
width: 83px;
height: 70px;
height: auto;
margin-bottom: 6px;
}
.noFileText {
line-height: 18px;
font-size: 12px;
color: rgba(34, 34, 34, 0.45);
line-height: 18px;
font-size: 12px;
color: rgba(34, 34, 34, 0.45);
}
.fileIcon {
margin-right: 12px;
margin-right: 12px;
}
.red {
color: #ff4e4e;
color: #ff4e4e;
}
src/views/Project/ProjectData/index.module.css
View file @ 41e296fd
......@@ -2,7 +2,7 @@
position: relative;
}
.projectDataStickyTop {
padding: 28px 24px;
padding: 28px 24px 64px;
position: relative;
}
.projectDataTitle {
......@@ -56,9 +56,10 @@
.projectDataStickyBox {
height: 64px;
position: sticky;
bottom: -1px;
border: 1px solid #ebedf0;
width: calc(100vw - 220px);
position: fixed;
bottom: 0px;
border-top: 1px solid #ebedf0;
z-index: 100;
background-color: #fff;
display: flex;
......
src/views/Project/ProjectData/index.tsx
View file @ 41e296fd
......@@ -515,7 +515,7 @@ const ProjectData = observer(() => {
<MyButton
text="上传文件"
variant="contained"
size="small"
size="medium"
style={{ marginRight: "12px" }}
onClick={() => setUploaderDialogOpen(true)}
disabled={
......
src/views/Project/ProjectJobDetail/LogView/index.module.css 0 → 100644
View file @ 41e296fd
.logView {
position: absolute;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, .5);
z-index: 1002;
}
.logViewBox {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 900px;
height: 600px;
background: #282C34;
box-shadow: 2px 4px 20px 0px rgba(0, 15, 45, 0.1200);
border-radius: 8px;
}
.close {
position: absolute;
right: 0;
top: -28px;
cursor: pointer;
color: #fff;
}
.logViewTop {
/* height: 30px; */
background-color: #1D2126;
border-radius: 8px 8px 0 0;
display: flex;
font-size: 12px;
color: #8A9099;
overflow: auto;
}
.logViewTop::-webkit-scrollbar-track {
background-color: #282C34;
}
.logTitle {
display: flex;
align-items: center;
height: 30px;
line-height: 20px;
padding: 0 24px;
cursor: pointer;
}
.logTitleSelected {
background: #282C34;
color: #FFFFFF;
}
.fileIcon{
width: 14px!important;
margin-right: 4px;
}
.logViewContent {
position: relative;
box-sizing: border-box;
height: 510px;
padding: 16px 24px 0;
color: #D1D6DE;
white-space:pre-wrap;
word-break: break-word;
overflow: auto;
font-size: 14px;
line-height: 22px;
}
.logViewContentMask{
height: 16px;
width: 852px;
background-color: #282C34;
position: absolute;
top: 30px;
left: 24px;
z-index: 1005;
}
.logViewContent::-webkit-scrollbar-track {
background-color: #282C34;
}
.logViewBottom {
display: flex;
align-items: center;
justify-content: end;
height: 60px;
padding-right: 24px;
}
\ No newline at end of file
src/views/Project/ProjectJobDetail/LogView/index.tsx 0 → 100644
View file @ 41e296fd
import { useState, useCallback, useEffect, useMemo } from "react";
import classnames from "classnames";
import style from "./index.module.css";
import CloseIcon from "@mui/icons-material/Close";
import MyButton from "@/components/mui/MyButton";
import InsertDriveFileOutlinedIcon from "@mui/icons-material/InsertDriveFileOutlined";
import CloudEController from "@/api/fileserver/CloudEController";
import { useStores } from "@/store";
import { toJS } from "mobx";
type LogViewProps = {
isshow: boolean;
handleClose: () => void;
logs: any[];
};
const LogView = (props: LogViewProps) => {
const { isshow, handleClose, logs } = props;
const { currentProjectStore } = useStores();
const fileToken = toJS(currentProjectStore.currentProjectInfo.filetoken);
const projectId = toJS(currentProjectStore.currentProjectInfo.id);
// 当前选择的日志
const [logCurrent, setLogCurrent] = useState<number>(0);
// 当前日志的内容文本
const [logText, setLogText] = useState('')
// 当前日志路径
const [logPath, setLogPath] = useState('')
useEffect(() => {
setLogPath(logs[logCurrent]?.logPath)
}, [logs]);
// 请求日志文本
useEffect(() => {
if (logPath) {
const path = logPath.slice(12)
CloudEController.JobFileDownloadText(
path,
fileToken as string,
projectId as string
)?.then((res) => {
setLogText(res.data)
})
}else{
setLogText("")
}
}, [logPath]);
// 选择日志时改变日志路径
useEffect(() => {
setLogPath(logs[logCurrent]?.logPath)
}, [logCurrent]);
// 下载当前日志
const handleDownLoad=()=>{
const path = logPath.slice(12)
CloudEController.JobFileDownload(
path,
fileToken as string,
projectId as string
);
}
return <div className={style.logView} style={isshow ? {} : { display: "none" }}>
<div className={style.logViewBox}>
<CloseIcon onClick={handleClose} className={style.close} />
<div className={style.logViewContentMask}></div>
<div className={style.logViewTop}>
{logs.map((item: any, index: number) => {
return <div
key={index}
onClick={() => { setLogCurrent(index) }}
className={classnames({
[style.logTitle]: true,
[style.logTitleSelected]: index === logCurrent,
})}>
<InsertDriveFileOutlinedIcon className={style.fileIcon} />
<span>{item.logName}</span>
</div>
})}
</div>
<div className={style.logViewContent}>
{logText}
</div>
<div className={style.logViewBottom}>
<MyButton text='下载当前日志' onClick={handleDownLoad} />
</div>
</div>
</div>
}
export default LogView
\ No newline at end of file
src/views/Project/ProjectJobDetail/index.module.css
View file @ 41e296fd
......@@ -68,6 +68,7 @@
margin: 6px 0;
}
.outputLiLeft {
cursor: pointer;
display: flex;
align-items: center;
color: rgba(19, 112, 255, 1);
......
src/views/Project/ProjectOverview/TaskCard/index.tsx
View file @ 41e296fd
......@@ -50,7 +50,7 @@ const TaskCard = (props: TaskCardProps) => {
const goToProjectData = (path: string) => {
const lastIndex = path.lastIndexOf("/");
if (lastIndex !== -1) {
path = path.slice(0, lastIndex + 1);
path = path.slice(0, lastIndex);
}
path = path.slice(12);
if (path) {
......@@ -66,7 +66,7 @@ const TaskCard = (props: TaskCardProps) => {
// 跳转详情页
const gotoDetail = (id: string) => {
navigate(`/product/cadd/projectJobDetail`, {
state: { taskId: id },
state: { taskId: id, from: 'projectOverview' },
});
}
// 渲染状态图标
......
src/views/Project/ProjectOverview/index.tsx
View file @ 41e296fd
......@@ -45,6 +45,8 @@ const ProjectOverview = observer(() => {
});
useEffect(() => {
// 切项目时重置为初始7
setDay("7");
if (currentProjectStore.currentProjectInfo.id) {
getOverview({
id: currentProjectStore.currentProjectInfo.id as string,
......
src/views/Project/ProjectSetting/BaseInfo/index.module.css
View file @ 41e296fd
......@@ -17,7 +17,7 @@
line-height: 22px;
font-size: 14px;
font-weight: 550;
margin-bottom: 12px;
margin-bottom: 8px;
}
.projectInfoName::after {
content: "*";
......@@ -64,7 +64,7 @@
font-size: 14px;
line-height: 22px;
color: #ff4e4e;
margin-bottom: 8px;
margin-bottom: 20px;
}
.deleteText2 {
color: #1e2633;
......
src/views/Project/ProjectSetting/BaseInfo/index.tsx
View file @ 41e296fd
......@@ -276,20 +276,20 @@ const BaseInfo = observer(() => {
const projectList = await getProjectList();
currentProjectStore.setProjectList(projectList);
// 项目删完了
if (projectList.length === 0) {
currentProjectStore.changeProject({});
localStorage.setItem("fileServerEndPoint", "");
setProjectInfo({});
} else {
projectList[0].filetoken = getFiletokenAccordingToId(projectList[0].id);
currentProjectStore.changeProject(projectList[0]);
setFileServerEndPointLocalStorage(projectList[0].zoneId);
getFiletokenAccordingToId(projectList[0].id).then((res) => {
projectList[0].filetoken = res;
currentProjectStore.changeProject(projectList[0]);
});
setProjectInfo(projectList[0]);
}
// if (projectList.length === 0) {
currentProjectStore.changeProject({});
localStorage.setItem("fileServerEndPoint", "");
setProjectInfo({});
// } else {
// projectList[0].filetoken = getFiletokenAccordingToId(projectList[0].id);
// currentProjectStore.changeProject(projectList[0]);
// setFileServerEndPointLocalStorage(projectList[0].zoneId);
// getFiletokenAccordingToId(projectList[0].id).then((res) => {
// projectList[0].filetoken = res;
// currentProjectStore.changeProject(projectList[0]);
// });
// setProjectInfo(projectList[0]);
// }
},
});
......@@ -429,6 +429,9 @@ const BaseInfo = observer(() => {
className={style.updateButton}
onClick={handleClickUpdate}
loading={updateLoading}
sx={{
height:"32px"
}}
>
保存修改
</LoadingButton>
......@@ -459,10 +462,7 @@ const BaseInfo = observer(() => {
>
<div className={style.deleteBox}>
<div className={style.deleteText1}>
您要删除本项目。已删除的项目将无法恢复！您真的确定吗？
</div>
<div className={style.deleteText2}>
此操作可能会导致数据丢失。为防止意外操作，我们要求您确认您的操作。
删除项目会导致数据丢失，已删除的项目将无法恢复。
</div>
<div className={style.deleteText3}>
请输入“
......
src/views/Project/ProjectSetting/ProjectMembers/components/ChangePermission.tsx
View file @ 41e296fd
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:18:13
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-07-29 11:28:09
* @LastEditTime: 2022-08-11 18:05:06
* @FilePath: /bkunyun/src/views/Project/ProjectSetting/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -37,15 +37,7 @@ const ChangePermission = observer((props: IProps) => {
useEffect(() => {
if (permissionDialog?.isShow) {
http.get<IResponse<any>>("/cpp/project/listroles").then((res) => {
const arr = [];
const { data } = res;
for (const key in data) {
arr.push({
label: String(data[key]),
value: key,
});
}
setSelectOptions(arr);
setSelectOptions(res.data);
});
}
}, [http, permissionDialog]);
......
src/views/Project/ProjectSetting/ProjectMembers/index.tsx
View file @ 41e296fd
......@@ -164,7 +164,7 @@ const ProjectMembers = observer(() => {
variant="contained"
onClick={onAddMember}
startIcon={<Add />}
size="small"
size="medium"
/>
) : null}
</Box>
......
src/views/Project/ProjectSetting/index.tsx
View file @ 41e296fd
......@@ -39,12 +39,9 @@ const ProjectSetting = observer(() => {
if (currentProjectStore.currentProjectInfo.name) {
return (
<div style={{ padding: 24 }}>
<div style={{ padding:'28px 24px 24px' }}>
<div style={{ display: "flex", alignItems: "center" }}>
<img src={projectImg} alt="项目logo" />
<span style={{ marginLeft: 12 }}>
{currentProjectStore.currentProjectInfo.name}
</span>
<span style={{ fontSize: "18px", lineHeight: "26px", fontWeight: "600", color: "#1E2633" }}>项目设置</span>
</div>
<Box sx={{ width: "100%", typography: "body1" }}>
<Tabs tabList={tabList} />
......
src/views/Project/ProjectSubmitWork/ConfigForm/index.module.css
View file @ 41e296fd
.formBox {
position: relative;
position: relative;
}
.templateDescBox {
margin-bottom: 40px;
margin-bottom: 40px;
}
.templateDescTitle {
font-size: 16px;
line-height: 24px;
color: rgba(30, 38, 51, 1);
font-weight: 600;
margin-bottom: 12px;
font-size: 16px;
line-height: 24px;
color: rgba(30, 38, 51, 1);
font-weight: 600;
margin-bottom: 12px;
}
.templateDesc {
font-size: 12px;
line-height: 20px;
color: #565c66;
}
font-size: 12px;
line-height: 20px;
color: #565c66;
}
.formItemBox {
background: #ffffff;
box-shadow: 0px 3px 10px 0px rgba(0, 24, 57, 0.04);
border-radius: 4px;
border: 1px solid #ebedf0;
margin-bottom: 24px;
}
/* .taskBox {
margin-bottom: 24px;
} */
.backgroundTitle {
background-color: rgba(245, 246, 247, 1);
height: 48px;
display: flex;
justify-content: flex-start;
align-items: center;
padding: 12px 16px;
box-sizing: border-box;
position: relative;
background-color: rgba(245, 246, 247, 1);
height: 48px;
display: flex;
justify-content: flex-start;
align-items: center;
padding: 12px 24px;
box-sizing: border-box;
position: relative;
}
.backgroundTitleTextIcon {
visibility: hidden;
position: absolute;
top: 16px;
right: 24px;
visibility: hidden;
}
.backgroundTitleTextIconShow {
visibility: visible;
visibility: visible;
}
.backgroundTitleText {
font-size: 16px;
font-weight: 600;
line-height: 24px;
color: rgba(30, 38, 51, 1);
margin-left: 12px;
font-size: 16px;
font-weight: 600;
line-height: 24px;
color: rgba(30, 38, 51, 1);
}
.taskDescIcon {
margin-left: 8px;
margin-left: 8px;
}
.flowDescIcon {
margin-left: 8px;
margin-left: 8px;
}
.formItems {
padding: 20px 44px 40px 44px;
padding: 16px 24px 4px;
}
.formItem {
margin-bottom: 20px;
margin-bottom: 20px;
}
.fileSelectImg {
cursor: pointer;
cursor: pointer;
}
.formItemLable {
margin-bottom: 12px;
font-size: 14px;
color: rgba(30, 38, 51, 1);
line-height: 22px;
font-weight: 600;
margin-bottom: 12px;
font-size: 14px;
color: rgba(30, 38, 51, 1);
line-height: 22px;
font-weight: 600;
}
.required::after {
content: "*";
color: red;
margin-left: 3px;
content: "*";
color: red;
margin-left: 3px;
}
.taskConfigBox {
padding: 24px 44px 40px 44px;
padding: 16px 24px 4px;
}
.flowTitle {
line-height: 16px;
margin: 3px 0 27px;
color: rgba(30, 38, 51, 1);
font-size: 14px;
font-weight: 600;
border-left: 3px solid rgba(19, 112, 255, 1);
padding-left: 3px;
display: flex;
align-items: center;
line-height: 16px;
margin: 3px 0 27px;
color: rgba(19, 112, 255, 1);
font-size: 14px;
font-weight: 600;
border-left: 3px solid rgba(19, 112, 255, 1);
padding-left: 3px;
display: flex;
align-items: center;
padding-left: 8px;
}
.parameter {
margin-bottom: 20px;
position: relative;
margin-bottom: 20px;
position: relative;
}
.parameterTitle {
color: rgba(30, 38, 51, 1);
font-size: 14px;
font-weight: 600;
line-height: 22px;
margin-bottom: 12px;
color: rgba(30, 38, 51, 1);
font-size: 14px;
font-weight: 600;
line-height: 22px;
margin-bottom: 12px;
}
.parameterContent {
position: relative;
position: relative;
}
.parameterDesc {
position: absolute;
top: 12px;
right: -22px;
position: absolute;
top: 12px;
right: -22px;
}
.parameterDataType {
color: rgba(138, 144, 153, 1);
margin-left: 16px;
color: rgba(138, 144, 153, 1);
margin-left: 16px;
}
src/views/Project/ProjectSubmitWork/ConfigForm/index.tsx
View file @ 41e296fd
......@@ -215,18 +215,17 @@ const ConfigForm = (props: ConfigFormProps) => {
</div>
<MyTooltip title={parameter.description} placement="right">
<div className={styles.parameterContent}>
{parameter.domType.toLowerCase() === "file" && (
{(parameter.domType || "").toLowerCase() === "file" && (
<MyInput
onFocus={() => setSelectedBatchNodeId(batchId || "")}
onBlur={() => setSelectedBatchNodeId("")}
onClick={() => {
setSelectedBatchNodeId(batchId || "");
setFileSelectType("file");
handleOpenFileSelect(taskId, parameter.name);
}}
value={parameter.value || ""}
InputProps={{
endAdornment: (
<img
onClick={() => {
setFileSelectType("file");
handleOpenFileSelect(taskId, parameter.name);
}}
src={fileSelectIcon}
alt=""
className={styles.fileSelectImg}
......@@ -239,18 +238,17 @@ const ConfigForm = (props: ConfigFormProps) => {
size="medium"
></MyInput>
)}
{parameter.domType.toLowerCase() === "path" && (
{(parameter.domType || "").toLowerCase() === "path" && (
<MyInput
onFocus={() => setSelectedBatchNodeId(batchId || "")}
onBlur={() => setSelectedBatchNodeId("")}
onClick={() => {
setSelectedBatchNodeId(batchId || "");
setFileSelectType("path");
handleOpenFileSelect(taskId, parameter.name);
}}
value={parameter.value || ""}
InputProps={{
endAdornment: (
<img
onClick={() => {
setFileSelectType("path");
handleOpenFileSelect(taskId, parameter.name);
}}
src={fileSelectIcon}
alt=""
className={styles.fileSelectImg}
......@@ -263,18 +261,17 @@ const ConfigForm = (props: ConfigFormProps) => {
size="medium"
></MyInput>
)}
{parameter.domType.toLowerCase() === "dataset" && (
{(parameter.domType || "").toLowerCase() === "dataset" && (
<MyInput
onFocus={() => setSelectedBatchNodeId(taskId)}
onBlur={() => setSelectedBatchNodeId("")}
onClick={() => {
setSelectedBatchNodeId(taskId);
setFileSelectType("dataset");
handleOpenFileSelect(taskId, parameter.name);
}}
value={parameter.value || ""}
InputProps={{
endAdornment: (
<img
onClick={() => {
setFileSelectType("dataset");
handleOpenFileSelect(taskId, parameter.name);
}}
src={fileSelectIcon}
alt=""
className={styles.fileSelectImg}
......@@ -287,7 +284,7 @@ const ConfigForm = (props: ConfigFormProps) => {
size="medium"
></MyInput>
)}
{parameter.domType.toLowerCase() === "input" && (
{(parameter.domType || "").toLowerCase() === "input" && (
<MyInput
onFocus={() => {
setSelectedBatchNodeId(batchId || "");
......@@ -304,7 +301,7 @@ const ConfigForm = (props: ConfigFormProps) => {
size="medium"
></MyInput>
)}
{parameter.domType.toLowerCase() === "select" && (
{(parameter.domType || "").toLowerCase() === "select" && (
<MySelect
onFocus={() => setSelectedBatchNodeId(batchId || "")}
onBlur={() => setSelectedBatchNodeId("")}
......@@ -326,7 +323,8 @@ const ConfigForm = (props: ConfigFormProps) => {
fullWidth
></MySelect>
)}
{parameter.domType.toLowerCase() === "multipleselect" && (
{(parameter.domType || "").toLowerCase() ===
"multipleselect" && (
<MySelect
onFocus={() => setSelectedBatchNodeId(batchId || "")}
onBlur={() => setSelectedBatchNodeId("")}
......@@ -349,7 +347,7 @@ const ConfigForm = (props: ConfigFormProps) => {
fullWidth
></MySelect>
)}
{parameter.domType.toLowerCase() === "radio" && (
{(parameter.domType || "").toLowerCase() === "radio" && (
<MyRadio
value={parameter.value}
onChange={(e: any) =>
......@@ -362,7 +360,7 @@ const ConfigForm = (props: ConfigFormProps) => {
helperText={parameter.helperText}
></MyRadio>
)}
{parameter.domType.toLowerCase() === "checkbox" && (
{(parameter.domType || "").toLowerCase() === "checkbox" && (
<MyCheckBox
value={parameter.value}
onChange={(e: any) =>
......@@ -398,83 +396,83 @@ const ConfigForm = (props: ConfigFormProps) => {
{templateConfigInfo?.description || ""}
</div>
</div>
<div
className={classnames({
[styles.backgroundTitle]: true,
[styles.backgroundTitlePass]: true,
})}
>
<img src="" alt="" />
<span className={styles.backgroundTitleText}>基础信息</span>
</div>
<div className={styles.formItems}>
<div className={styles.formItem}>
<div
<div className={styles.formItemBox}>
<div
className={classnames({
[styles.backgroundTitle]: true,
})}
>
<span className={styles.backgroundTitleText}>基础信息</span>
<img
className={classnames({
[styles.formItemLable]: true,
[styles.required]: true,
[styles.backgroundTitleTextIcon]: true,
[styles.backgroundTitleTextIconShow]: !nameHelp.error,
})}
>
任务名称
</div>
<div className={styles.formItem}>
<MyInput
value={name}
onChange={handleNameChange}
placeholder="请输入任务名称"
error={nameHelp.error}
helperText={nameHelp.helperText}
></MyInput>
</div>
src={jobSueIcon}
alt=""
/>
</div>
<div className={styles.formItem}>
<div
className={classnames({
[styles.formItemLable]: true,
[styles.required]: true,
})}
>
输出路径
<div className={styles.formItems}>
<div className={styles.formItem}>
<div
className={classnames({
[styles.formItemLable]: true,
[styles.required]: true,
})}
>
任务名称
</div>
<div className={styles.formItem}>
<MyInput
value={name}
onChange={handleNameChange}
placeholder="请输入任务名称"
error={nameHelp.error}
helperText={nameHelp.helperText}
></MyInput>
</div>
</div>
<div className={styles.formItem}>
<MyInput
value={outputPath || ""}
InputProps={{
endAdornment: (
<img
onClick={() => {
setFileSelectType("path");
handleOpenFileSelect();
}}
src={fileSelectIcon}
alt="选择输出路径"
className={styles.fileSelectImg}
/>
),
}}
error={outputPathHelp.error}
helperText={outputPathHelp.helperText}
></MyInput>
<div
className={classnames({
[styles.formItemLable]: true,
[styles.required]: true,
})}
>
输出路径
</div>
<div className={styles.formItem}>
<MyInput
value={outputPath || ""}
onClick={() => {
setSelectedBatchNodeId("");
setFileSelectType("path");
handleOpenFileSelect();
}}
InputProps={{
endAdornment: (
<img
src={fileSelectIcon}
alt="选择输出路径"
className={styles.fileSelectImg}
/>
),
}}
error={outputPathHelp.error}
helperText={outputPathHelp.helperText}
></MyInput>
</div>
</div>
</div>
</div>
{renderTasks.map((task, taskIndex) => {
return (
<div className={styles.taskBox} key={task.id + taskIndex}>
<div className={styles.formItemBox} key={task.id + taskIndex}>
<div
className={classnames({
[styles.backgroundTitle]: true,
[styles.backgroundTitlePass]: true,
})}
>
<img
className={classnames({
[styles.backgroundTitleTextIcon]: true,
[styles.backgroundTitleTextIconShow]: task.isCheck,
})}
src={jobSueIcon}
alt=""
/>
<span
id={`point${task.id}`}
className={styles.backgroundTitleText}
......@@ -486,10 +484,25 @@ const ConfigForm = (props: ConfigFormProps) => {
<img className={styles.taskDescIcon} src={tipsIcon} alt="" />
</MyTooltip>
)}
<img
className={classnames({
[styles.backgroundTitleTextIcon]: true,
[styles.backgroundTitleTextIconShow]: task.isCheck,
})}
src={jobSueIcon}
alt=""
/>
</div>
<div className={styles.taskConfigBox}>
{randerParameters(task.parameters, task.id, task.id)}
{task.flows.map((flow) => {
if (
flow.parameters.filter(
(parameter) => parameter.hidden === false
).length === 0
) {
return null;
}
return (
<div className={styles.flowConfigBox} key={flow.id}>
<div className={styles.flowTitle}>
......
src/views/Project/ProjectSubmitWork/WorkFlow/index.tsx
View file @ 41e296fd
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-21 15:25:25
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-12 14:09:20
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-09 16:07:33
* @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/WorkFlow/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import { useEffect } from "react";
import Flow from "../../components/Flow";
import { ITemplateConfig } from "../interface";
......@@ -17,6 +18,21 @@ interface IProps {
const WorkFlow = (props: IProps) => {
const { templateConfigInfo, setSelectedBatchNodeId, selectedBatchNodeId } =
props;
/** 页面刷新提醒 */
const pageRefreshTips = (e: any) => {
const event: any = window.event || e;
event.returnValue = "是否离开网站？";
};
/** 监听页面刷新事件 */
useEffect(() => {
window.addEventListener("beforeunload", pageRefreshTips, false);
return () => {
window.removeEventListener("beforeunload", pageRefreshTips, false);
};
});
return (
<Flow
tasks={templateConfigInfo?.tasks}
......
src/views/Project/ProjectSubmitWork/index.module.css
View file @ 41e296fd
......@@ -30,13 +30,14 @@
line-height: 22px;
font-size: 14px;
color: rgba(30, 38, 51, 1);
font-weight: 600;
font-weight: 700;
padding-right: 20px;
border-right: 1px solid rgba(235, 237, 240, 1);
border-right: 1px solid rgba(209, 214, 222, 1);
}
.swHeaderLable {
color: rgba(138, 144, 153, 1);
font-size: 12px;
line-height: 22px;
}
.swHeaderValue {
color: rgba(30, 38, 51, 1);
......
src/views/Project/ProjectSubmitWork/index.tsx
View file @ 41e296fd
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-21 20:03:56
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-20 15:00:18
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-08 16:41:20
* @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -70,16 +70,16 @@ const ProjectSubmitWork = observer(() => {
let value: any = undefined;
if (parameter.defaultValue) {
if (
parameter.domType.toLowerCase() === "multipleselect" ||
parameter.domType.toLowerCase() === "checkbox"
(parameter.domType || "").toLowerCase() === "multipleselect" ||
(parameter.domType || "").toLowerCase() === "checkbox"
) {
value = parameter.defaultValue.split(",");
} else {
value = parameter.defaultValue;
}
} else if (
parameter.domType.toLowerCase() === "multipleselect" ||
parameter.domType.toLowerCase() === "checkbox"
(parameter.domType || "").toLowerCase() === "multipleselect" ||
(parameter.domType || "").toLowerCase() === "checkbox"
) {
value = [];
} else {
......@@ -179,9 +179,9 @@ const ProjectSubmitWork = observer(() => {
value = parameter.value;
}
if (
parameter.domType.toLowerCase() === "path" ||
parameter.domType.toLowerCase() === "dataset" ||
parameter.domType.toLowerCase() === "file"
(parameter.domType || "").toLowerCase() === "path" ||
(parameter.domType || "").toLowerCase() === "dataset" ||
(parameter.domType || "").toLowerCase() === "file"
) {
value = `/${value}`;
}
......@@ -240,8 +240,8 @@ const ProjectSubmitWork = observer(() => {
<ArrowBackIosNewIcon
sx={{
color: "rgba(194, 198, 204, 1)",
width: "12px",
height: "12px",
width: "14px",
height: "14px",
}}
/>
</IconButton>
......@@ -258,8 +258,8 @@ const ProjectSubmitWork = observer(() => {
<div className={styles.swTemplateUpdateTimeBox}>
<span className={styles.swHeaderLable}>更新时间：</span>
<span className={styles.swHeaderValue}>
{templateConfigInfo?.updateTime
? moment(templateConfigInfo?.updateTime).format(
{templateConfigInfo?.updatedTime
? moment(templateConfigInfo?.updatedTime).format(
"YYYY-MM-DD HH:mm:ss"
)
: "-"}
......
src/views/Project/ProjectSubmitWork/interface.ts
View file @ 41e296fd
/*
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-21 20:03:56
* @LastEditors: 吴永生#A02208 yongsheng.wu@wholion.com
* @LastEditTime: 2022-07-12 11:51:17
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-08 15:55:45
* @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/interface.ts
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -56,7 +56,7 @@ export interface ITask {
export interface ITemplateConfig { // 模板信息
title: string; // 标题
version: string; // 版本
updateTime?: string; // 更新时间
updatedTime?: string; // 更新时间
description: string; // 模板描述
language: string;
languageVersion: string;
......
src/views/Project/ProjectWorkbench/workbenchList/index.module.css
View file @ 41e296fd
......@@ -60,9 +60,10 @@
.tabBoxTime {
font-size: 12px;
line-height: 20px;
font-weight: 400;
color: #565C66;
margin-left: 4px;
margin-left: 8px;
}
.tabBoxMiddle {
......@@ -82,9 +83,10 @@
.tabBoxStatusText {
font-size: 12px;
line-height: 20px;
font-weight: 400;
color: #1E2633;
margin: 0px 16px 0px 6px;
margin: 0px 16px 0px 8px;
white-space: nowrap;
}
......
src/views/Project/ProjectWorkbench/workbenchList/index.tsx
View file @ 41e296fd
......@@ -69,7 +69,7 @@ const currencies = [
let timer: string | number | NodeJS.Timeout | null | undefined = null;
const ProjectMembers = observer(() => {
const { currentProjectStore } = useStores();
const projectId = toJS(currentProjectStore.currentProjectInfo.id);
const isPass = usePass();
const [jobName, setJobName] = useState("");
......@@ -79,7 +79,7 @@ const ProjectMembers = observer(() => {
const [size, setSize] = useState(10);
const [rowsPerPage, setRowsPerPage] = useState(10);
const [count, setCount] = useState(0);
const [loading,setLoading]=useState(false)
const [loading, setLoading] = useState(false)
/** 简单弹窗 */
const [jobData, setJobData] = useState("");
const [openDialog, setOpenDialog] = useState(false);
......@@ -209,6 +209,8 @@ const ProjectMembers = observer(() => {
const renderStatusIcon = (data: string) => {
switch (data) {
case "SUBMITTED":
return jobRun;
case "RUNNING":
return jobRun;
case "ABORTED":
......@@ -224,6 +226,8 @@ const ProjectMembers = observer(() => {
const renderStatusText = (data: string) => {
switch (data) {
case "SUBMITTED":
return "正在启动";
case "RUNNING":
return "正在运行";
case "ABORTED":
......@@ -240,6 +244,8 @@ const ProjectMembers = observer(() => {
/** 渲染字体颜色 */
const renderTextColor = (data: any) => {
switch (data) {
case "SUBMITTED":
return "#1370FF";
case "RUNNING":
return "#1370FF";
case "ABORTED":
......@@ -256,6 +262,8 @@ const ProjectMembers = observer(() => {
/** 渲染进度条颜色 */
const renderProgressColor = useCallback((data: any) => {
switch (data) {
case "SUBMITTED":
return "info";
case "RUNNING":
return "info";
case "ABORTED":
......@@ -273,7 +281,7 @@ const ProjectMembers = observer(() => {
const rowClick = useCallback(
(id: string) => {
navigate(`/product/cadd/projectJobDetail`, {
state: { taskId: id },
state: { taskId: id, from: 'workbenchList' },
});
},
[navigate]
......@@ -419,7 +427,7 @@ const ProjectMembers = observer(() => {
/>
</Box>
<div
style={{ color: renderTextColor(item.state) }}
style={{ color: renderTextColor(item.state), margin: '0px' }}
className={styles.tabBoxStatusText}
>
{item.completeNum + "/" + item.totalNum}
......
src/views/Project/ProjectWorkbench/workbenchTemplate/components/AddTemplate/index.module.css
View file @ 41e296fd
......@@ -2,21 +2,36 @@
flex: 1;
background-color: #fff;
border-radius: 16px 0 0 0;
padding: 24px 32px;
padding-top: 24px;
box-sizing: border-box;
}
.headerBox {
padding: 0 32px;
}
.headerBoxShadow {
box-shadow: 0 5px 4px -4px rgb(0, 0, 0, .15);
}
.templateBox {
padding: 0 32px;
height: calc(100vh - 168px);
overflow: auto;
}
.templateList {
/* height: 2000px; */
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.templateLi {
height: 146px;
height: 170px;
box-sizing: border-box;
padding: 16px 20px;
cursor: pointer;
/* cursor: pointer; */
border: 1px solid rgba(235, 237, 240, 1);
border-radius: 4px;
min-width: 20%;
......@@ -24,37 +39,45 @@
margin-right: 16px;
margin-bottom: 16px;
}
.templateLiCustom {
height: 194px;
height: 170px;
}
.templateLiHidden {
visibility: hidden;
}
.addCustomTemplate {
height: 194px;
height: 170px;
box-sizing: border-box;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.addCustomTemplateText {
margin-top: 12px;
line-height: 22px;
font-size: 14px;
color: rgba(138, 144, 153, 1);
}
.templateLi:hover {
box-shadow: 6px 8px 22px 0px rgba(0, 24, 57, 0.08);
}
.templateLi:nth-child(4n) {
margin-right: 0;
}
.templateLiTop {
display: flex;
justify-content: space-between;
align-items: center;
}
.templateTitle {
font-size: 14px;
font-weight: 600;
......@@ -64,14 +87,17 @@
text-overflow: ellipsis;
line-height: 22px;
}
.templateLiInfo {
margin-bottom: 8px;
}
.templateLiInfoText {
line-height: 20px;
font-size: 12px;
color: rgba(19, 112, 255, 1);
}
.templateLiDesc {
overflow: hidden;
text-overflow: ellipsis;
......@@ -82,8 +108,9 @@
font-size: 12px;
color: rgba(138, 144, 153, 1);
}
.templateLiEditBox {
display: flex;
justify-content: flex-end;
margin-top: 16px;
/* margin-top: 16px; */
}
src/views/Project/components/Flow/components/BatchNode/index.module.css
View file @ 41e296fd
......@@ -39,3 +39,12 @@
.batchRotate {
transform: translateX(-50%) rotate(-90deg);
}
.handleBox::before{
content: "";
position: absolute;
left: -4px;
top: -4px;
width: 14px;
height: 14px;
}
src/views/Project/components/Flow/index.tsx
View file @ 41e296fd
This diff is collapsed.
src/views/WorkFlowEdit/index.tsx
View file @ 41e296fd
This diff is collapsed.
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