Commit 2c3d1fe9 authored by chenshouchao's avatar chenshouchao

Merge branch 'feat-20220801' into 'staging'

Feat 20220801

See merge request !52
parents aafef480 48397525
......@@ -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;
......@@ -244,6 +253,19 @@ class CloudEController {
}
}
// 获取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) {
......
......@@ -69,7 +69,7 @@ const MyPopconfirm = (props: IMyPopconfirmProps) => {
bgcolor: "#fff",
minWidth: "200px",
borderRadius: "4px",
fontSize:"14px",
fontSize: "14px",
padding: "20px 16px",
boxShadow: "0px 3px 10px 0px rgba(0, 24, 57, 0.14)",
}}
......@@ -97,7 +97,7 @@ const MyPopconfirm = (props: IMyPopconfirmProps) => {
style={{ marginRight: "12px" }}
/>
)}
<MyButton text={okText} onClick={handleOk} />
<MyButton text={okText} onClick={handleOk} />
</Box>
</Popper>
);
......
......@@ -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>
);
}
......@@ -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 || "请选择"}
......
......@@ -115,7 +115,7 @@ const Tabs = (props: IProps) => {
return (
<ThemeProvider theme={theme}>
<TabContext value={value}>
<Box sx={{ borderBottom: 1, borderColor: "#F0F2F5" }}>
<Box sx={{ borderBottom: 1, borderColor: "#EDEFF2" }}>
<TabList
onChange={(e: any, val: string) => {
onChange(val);
......
.topApp {
height: 56px;
background-color: white;
border-bottom: #e6e8eb 1px solid;
display: flex;
align-items: center;
justify-content: space-between;
height: 56px;
background-color: white;
border-bottom: #dde1e6 1px solid;
display: flex;
align-items: center;
justify-content: space-between;
}
.topLeftBox {
display: flex;
align-items: center;
display: flex;
align-items: center;
}
.logo {
padding: 0px 16px 0px 20px;
margin-top: -10px;
padding: 0px 16px 0px 20px;
margin-top: -10px;
}
.uploadIconBox{
width: 32px;
height: 32px;
display: flex;
justify-content: center;
align-items: center;
margin-right: 16px;
.uploadIconBox {
width: 32px;
height: 32px;
display: flex;
justify-content: center;
align-items: center;
margin-right: 16px;
}
.uploadIconBox:hover{
background-color: #f0f2f5;
border-radius: 2px;
cursor: pointer;
.uploadIconBox:hover {
background-color: #f0f2f5;
border-radius: 2px;
cursor: pointer;
}
.topRightBox {
display: flex;
justify-content: flex-end;
align-items: center;
display: flex;
justify-content: flex-end;
align-items: center;
}
.topRightItem {
margin-right: 20px;
margin-right: 20px;
}
.ArrowDropDownIconRoot {
color: #8a9099;
transition: all 0.2s !important;
transform: rotate(0);
color: #8a9099;
transition: all 0.2s !important;
transform: rotate(0);
}
.ArrowDropDownIconRootOpen {
color: #8a9099;
transform: rotate(180deg);
color: #8a9099;
transform: rotate(180deg);
}
.menuPaper {
border: 1px solid #f0f2f5;
background: #ffffff;
border-radius: 4px;
box-shadow: 4px 4px 20px 0px rgba(0, 24, 57, 0.06) !important;
border: 1px solid #f0f2f5;
background: #ffffff;
border-radius: 4px;
box-shadow: 4px 4px 20px 0px rgba(0, 24, 57, 0.06) !important;
}
.menuItemRoot {
width: 143px;
font-size: 14px !important;
width: 143px;
font-size: 14px !important;
}
......@@ -205,6 +205,7 @@ const OperatorList = (props: IProps) => {
value={keyword}
onChange={keywordChange}
onKeyUp={handleKeywordKeyUp}
sx={{ fontSize: "14px" }}
/>
</div>
<div className={styles.list} onScroll={(e) => handleScroll(e)}>
......
......@@ -4,7 +4,7 @@
justify-content: center;
}
.aside {
border-right: 1px solid #e6e8eb;
border-right: 1px solid #dde1e6;
width: 10%;
min-width: 220px;
height: calc(100vh - 57px);
......
......@@ -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,
......
......@@ -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" }}
......
.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;
}
......@@ -59,7 +59,7 @@
width: calc(100vw - 220px);
position: fixed;
bottom: 0px;
border: 1px solid #ebedf0;
border-top: 1px solid #ebedf0;
z-index: 100;
background-color: #fff;
display: flex;
......
.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
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
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-06-21 20:03:56
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-09 18:28:39
* @LastEditTime: 2022-08-11 17:13:52
* @FilePath: /bkunyun/src/views/Project/ProjectSubmitWork/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -28,16 +28,16 @@ import jobFail from "@/assets/project/jobFail.svg";
import fileIcon from "@/assets/project/fileIcon.svg";
import dataSetIcon from "@/assets/project/dataSetIcon.svg";
import { useStores } from "@/store";
import { getDataFind } from "@/api/project_api";
import { ITaskInfo } from "../ProjectSubmitWork/interface";
import Flow from "../components/Flow";
import { cancelWorkflowJob, deleteWorkflowJob } from "@/api/workbench_api";
import { useMessage } from "@/components/MySnackbar";
import MyPopconfirm from "@/components/mui/MyPopconfirm";
import { storageUnitFromB } from "@/utils/util";
import styles from "./index.module.css";
import SeeDataset from "../ProjectData/SeeDataset";
import { getToken, storageUnitFromB } from "@/utils/util";
import LogView from "./LogView"
import usePass from "@/hooks/usePass";
import styles from "./index.module.css";
const stateMap = {
RUNNING: "正在运行",
......@@ -60,6 +60,7 @@ const ProjectSubmitWork = observer(() => {
const { currentProjectStore } = useStores();
const fileToken = toJS(currentProjectStore.currentProjectInfo.filetoken);
const projectId = toJS(currentProjectStore.currentProjectInfo.id);
const productId = toJS(currentProjectStore.currentProductInfo.id);
const [workFlowJobInfo, setWorkFlowJobInfo] = useState<ITaskInfo>();
const [patchInfo, setPatchInfo] = useState<any>();
const [activePatchId, setActivePatchId] = useState<string>("");
......@@ -72,8 +73,18 @@ const ProjectSubmitWork = observer(() => {
const message = useMessage();
const isPass = usePass();
const [fullScreenShow, setFullScreenShow] = useState<boolean>(false);
// 查看日志弹框显示
const [showLogView, setShowLogView] = useState<boolean>(false);
// 日志信息
const [logs, setLogs] = useState<Array<any>>([])
const { name, state } = workFlowJobInfo || {};
// 查看数据集(数据集详情)显示控制
const [showSeeDataset, setShowSeeDataset] = useState(false);
// 查看的数据集的数据集名称
const [seeDatasetName, setSeeDatasetName] = useState("");
// 查看的数据集的数据集路径
const [seeDatasetPath, setSeeDatasetPath] = useState("");
/** 获取模版数据 */
const { run } = useMyRequest(fetchWorkFlowJob, {
......@@ -81,10 +92,22 @@ const ProjectSubmitWork = observer(() => {
pollingWhenHidden: false,
onSuccess: (res: IResponse<ITaskInfo>) => {
getOutouts(res.data.outputs);
getLogs(res.data);
setWorkFlowJobInfo(res.data);
},
});
// 处理日志数据
const getLogs = (data: any) => {
let logs = [{ logName: "workflow.log", logPath: data.logPath }]
data.tasks.forEach((i: any) => {
if (i.outLog) {
logs.push({ logName: `${i.title}.log`, logPath: i.outLog })
}
});
setLogs(logs)
}
useEffect(() => {
const locationInfo: any = location?.state;
run({
......@@ -113,12 +136,53 @@ const ProjectSubmitWork = observer(() => {
};
// 通过文件路径获取文件所在文件夹路径 如 输入 /ProjectData/task_a.out 输出/ProjectData/
const getFolderPath = (path: string) => {
// const getFolderPath = (path: string) => {
// const lastIndex = path.lastIndexOf("/");
// if (lastIndex !== -1) {
// path = path.slice(0, lastIndex);
// }
// return path;
// };
// 根据outputs的路径获取数据集的路径
const getDatasetPath = (path: string) => {
let datasetPath = "";
const noProjectPath = path.slice(12);
const fileIndex = noProjectPath.indexOf("/.dataset");
if (fileIndex !== -1) {
datasetPath = noProjectPath.slice(0, fileIndex);
} else {
datasetPath = noProjectPath;
}
return datasetPath ? datasetPath : "/";
};
// 根据outputs的路径获取数据集的名称
const getDatasetName = (path: string) => {
let name = "";
let nameIndex = path.indexOf("/.dataset/") + 10;
const lastIndex = path.lastIndexOf("/");
if (lastIndex !== -1) {
path = path.slice(0, lastIndex);
if (nameIndex !== -1 && lastIndex !== -1) {
name = path.slice(nameIndex, lastIndex);
}
return name;
};
// 下载任务结果
const handleDownLoadOutput = (item: any) => {
// 是文件下载
if (item.type !== "dataset") {
CloudEController.JobFileDownload(
item.path.slice(12),
fileToken as string,
projectId as string
);
} else {
// 是数据集 查看数据集
setSeeDatasetPath(getDatasetPath(item.path));
setSeeDatasetName(getDatasetName(item.path));
setShowSeeDataset(true);
}
return path;
};
/** 返回事件 */
......@@ -133,11 +197,6 @@ const ProjectSubmitWork = observer(() => {
}
}, [navigate]);
const outputPathTransform = (path: string) => {
path = path.slice(1);
return path;
};
const getOutouts = (outputs: any) => {
if (outputs) {
let result = Object.keys(outputs);
......@@ -169,23 +228,21 @@ const ProjectSubmitWork = observer(() => {
};
const getDataSetSize = async (item: any, index: number) => {
let path = item.path.slice(12);
const lastIndex = path.lastIndexOf("/");
if (lastIndex === -1) {
path = "/";
} else {
path = path.slice(0, lastIndex + 1);
}
const res = await getDataFind({
CloudEController.GetDatasetSize({
type: productId,
projectId: projectId as string,
path: path,
});
res.data.forEach((item1: any) => {
if (item1.name === item.path.slice(item.path.lastIndexOf("/") + 1)) {
randerOutputs[index].size = `${item1.size}条`;
token: getToken(),
filetoken: fileToken as string,
path: getDatasetPath(item.path),
name: getDatasetName(item.path),
})
?.then((res) => {
randerOutputs[index].size = `${res.data}条`;
setRanderOutputs([...randerOutputs]);
}
});
})
?.catch(() => {
message.error("获取数据集大小失败");
});
};
const getFileSize = (item: any, index: number) => {
......@@ -205,9 +262,8 @@ const ProjectSubmitWork = observer(() => {
if (Array.isArray(res.data)) {
res.data.forEach((item1) => {
if (item1.name === item.path.slice(item.path.lastIndexOf("/") + 1)) {
randerOutputs[index].size = `${
item1.size ? storageUnitFromB(Number(item1.size)) : "-"
}`;
randerOutputs[index].size = `${item1.size ? storageUnitFromB(Number(item1.size)) : "-"
}`;
setRanderOutputs([...randerOutputs]);
}
});
......@@ -322,6 +378,10 @@ const ProjectSubmitWork = observer(() => {
}
};
const handleClose = () => {
setShowLogView(false)
}
return (
<div className={styles.swBox}>
{fullScreenShow ? null : (
......@@ -369,7 +429,7 @@ const ProjectSubmitWork = observer(() => {
: "任务被删除后将无法恢复,确认继续吗?"
)
}
// click={onStopJob}
// click={onStopJob}
></MyButton>
{/* </MyPopconfirm> */}
</div>
......@@ -391,7 +451,8 @@ const ProjectSubmitWork = observer(() => {
<div
className={styles.outputLiLeft}
onClick={(e: any) => {
goToProjectData(getFolderPath(item.path));
handleDownLoadOutput(item);
// goToProjectData(getFolderPath(item.path));
}}
>
<img
......@@ -414,8 +475,8 @@ const ProjectSubmitWork = observer(() => {
)}
{(!workFlowJobInfo?.outputs ||
Object.keys(workFlowJobInfo?.outputs).length === 0) && (
<div className={styles.notResults}>暂无结果文件</div>
)}
<div className={styles.notResults}>暂无结果文件</div>
)}
<div className={styles.title}>任务信息</div>
<div className={styles.taskInfoLi}>
<div className={styles.taskInfoParams}>任务名称</div>
......@@ -447,12 +508,9 @@ const ProjectSubmitWork = observer(() => {
setGoToProjectDataPath(
workFlowJobInfo?.outputPath as string
);
// goToProjectData(workFlowJobInfo?.outputPath as string)
}}
>
{workFlowJobInfo?.outputPath
? outputPathTransform(workFlowJobInfo?.outputPath)
: "-"}
{workFlowJobInfo?.outputPath || "-"}
</div>
</div>
<div className={styles.taskInfoLi}>
......@@ -529,12 +587,20 @@ const ProjectSubmitWork = observer(() => {
<div className={styles.taskInfoParams}>日志文件</div>
<div className={styles.taskInfoValue}>
{workFlowJobInfo?.logPath && (
<span
<>
{/* <span
className={styles.taskInfoDownload}
onClick={() => handleDownLoad(workFlowJobInfo?.logPath)}
>
下载
</span>
</span> */}
<span
className={styles.taskInfoDownload}
onClick={() => setShowLogView(true)}
>
查看
</span>
</>
)}
{!workFlowJobInfo?.logPath && "-"}
</div>
......@@ -673,6 +739,20 @@ const ProjectSubmitWork = observer(() => {
onCancel={handleCancel}
onConfirm={handleConfirm}
/>
{showSeeDataset && (
<SeeDataset
handleClose={() => setShowSeeDataset(false)}
name={seeDatasetName}
path={seeDatasetPath}
fileToken={fileToken as string}
projectId={projectId as string}
></SeeDataset>
)}
<LogView
isshow={showLogView}
handleClose={handleClose}
logs={logs}
/>
</div>
);
});
......
......@@ -21,7 +21,6 @@ import { toJS } from "mobx";
import { observer } from "mobx-react-lite";
import InformationDisplay from "@/components/CommonComponents/InformationDisplay";
import classnames from "classnames";
import { TextField } from "@mui/material";
import LoadingButton from "@mui/lab/LoadingButton";
import InputAdornment from "@mui/material/InputAdornment";
import { useMessage } from "@/components/MySnackbar";
......@@ -29,11 +28,8 @@ import Loading from "@/views/Loading";
import MyDialog from "@/components/mui/MyDialog";
import { getProjectList } from "../../project";
import { checkIsNumberLetterChinese } from "@/utils/util";
import {
setFileServerEndPointLocalStorage,
getFiletokenAccordingToId,
} from "@/views/Project/project";
import MyButton from "@/components/mui/MyButton";
import MySelect, { optionsTransform } from "@/components/mui/MySelect";
import MyInput from "@/components/mui/MyInput";
type zoneIdOption = {
......@@ -205,7 +201,11 @@ const BaseInfo = observer(() => {
showMessage && message.error(help);
return false;
} else if (budget) {
if (isNaN(Number(budget)) || Number(budget) > 10000000 || Number(budget) < 0) {
if (
isNaN(Number(budget)) ||
Number(budget) > 10000000 ||
Number(budget) < 0
) {
help = "格式错误,请输入0~10000000之间的数值,结果最高保留两位小数。";
setBudgetCheck({
error: true,
......@@ -229,7 +229,7 @@ const BaseInfo = observer(() => {
showMessage && message.error(help);
return false;
}
}
};
const budgetChange = (e: any) => {
setProjectInfo({
......@@ -237,13 +237,16 @@ const BaseInfo = observer(() => {
projectBudget: e.target.value,
});
checkBudget(e.target.value);
}
};
const budgetBlur = (e: any) => {
if (e.target.value.indexOf(" ") == -1 && e.target.value) {
if (e.target.value.indexOf(" ") === -1 && e.target.value) {
setProjectInfo({
...projectInfo,
projectBudget: Number(e.target.value) || Number(e.target.value) == 0 ? Number(e.target.value).toFixed(2) : e.target.value,
projectBudget:
Number(e.target.value) || Number(e.target.value) === 0
? Number(e.target.value).toFixed(2)
: e.target.value,
});
}
};
......@@ -262,7 +265,10 @@ const BaseInfo = observer(() => {
// 修改项目
const handleClickUpdate = () => {
if (checkName(projectInfo.name, true) && checkBudget(projectInfo.projectBudget, true)) {
if (
checkName(projectInfo.name, true) &&
checkBudget(projectInfo.projectBudget, true)
) {
updateProjectRun({ ...projectInfo, product: "cadd" });
} else {
return;
......@@ -276,20 +282,9 @@ 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]);
// }
},
});
......@@ -352,31 +347,15 @@ const BaseInfo = observer(() => {
placeholder="项目描述限制300字以内"
maxLength={300}
></textarea>
{/* <MyInput
value={projectInfo.desc}
multiline
rows={4}
placeholder="项目描述限制100字以内"
onChange={descChange}
/> */}
</div>
<div className={style.projectInfoListLi}>
<div className={style.projectInfoListLiLabel}>计算区</div>
<select
<MySelect
value={projectInfo.zoneId}
disabled
className={classnames({
[style.projectInfoListLiValue]: true,
[style.projectInfoSelect]: true,
[style.disable]: true,
})}
>
{zoneIdOptions.map((option) => (
<option key={option.id} value={option.id}>
{option.name}
</option>
))}
</select>
options={optionsTransform(zoneIdOptions, "name", "id")}
sx={{ width: "560px" }}
></MySelect>
</div>
<div className={style.projectInfoListLi}>
<div className={style.projectInfoListLiLabel}>创建人</div>
......@@ -410,8 +389,8 @@ const BaseInfo = observer(() => {
padding: "6.5px 2px",
},
"& .MuiTypography-root": {
fontSize: '14px'
}
fontSize: "14px",
},
}}
/>
</div>
......@@ -425,32 +404,32 @@ const BaseInfo = observer(() => {
</div>
<div className={style.projectInfoListLi}>
<LoadingButton
variant="outlined"
variant="contained"
className={style.updateButton}
onClick={handleClickUpdate}
loading={updateLoading}
sx={{
height:"32px"
height: "32px",
}}
>
保存修改
</LoadingButton>
</div>
<div className={style.projectInfoListLi}>
<div className={style.projectInfoListLiLabel}>删除项目</div>
<div
className={style.projectInfoListLiLabel}
style={{ paddingTop: "12px" }}
>
删除项目
</div>
<div className={style.projectInfoListLiText}>
删除项目将删除其存储的数据和所有相关资源,并且已删除的项目无法恢复!请谨慎操作!
</div>
<MyButton
text="删除项目"
variant="contained"
variant="outlined"
onClick={() => setDialogOpen(true)}
color="error"
// style={{
// backgroundColor: "#fff",
// color: "#FF4E4E",
// border: "1px solid #FF4E4E",
// }}
/>
</div>
<MyDialog
......
......@@ -2,7 +2,7 @@
* @Author: 吴永生#A02208 yongsheng.wu@wholion.com
* @Date: 2022-05-31 10:18:13
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-08 18:17:20
* @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]);
......
......@@ -12,7 +12,6 @@ import { Box } from "@mui/system";
import { useStores } from "@/store/index";
import NoProject from "@/components/BusinessComponents/NoProject";
import { observer } from "mobx-react-lite";
import projectImg from "@/assets/project/projectIconSmall.svg";
import ProjectMembers from "./ProjectMembers";
import BaseInfo from "./BaseInfo";
import Tabs from "@/components/mui/Tabs";
......@@ -35,13 +34,22 @@ const ProjectSetting = observer(() => {
component: <BaseInfo />,
},
];
}, []);
}, [isPass]);
if (currentProjectStore.currentProjectInfo.name) {
return (
<div style={{ padding:'28px 24px 24px' }}>
<div style={{ padding: "28px 24px 24px" }}>
<div style={{ display: "flex", alignItems: "center" }}>
<span style={{ fontSize: "18px", lineHeight: "26px", fontWeight: "600", color: "#1E2633" }}>项目设置</span>
<span
style={{
fontSize: "18px",
lineHeight: "26px",
fontWeight: "600",
color: "#1E2633",
}}
>
项目设置
</span>
</div>
<Box sx={{ width: "100%", typography: "body1" }}>
<Tabs tabList={tabList} />
......
.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;
}
......@@ -217,16 +217,15 @@ const ConfigForm = (props: ConfigFormProps) => {
<div className={styles.parameterContent}>
{(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}
......@@ -241,16 +240,15 @@ const ConfigForm = (props: ConfigFormProps) => {
)}
{(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}
......@@ -265,16 +263,15 @@ const ConfigForm = (props: ConfigFormProps) => {
)}
{(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}
......@@ -399,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}
......@@ -487,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}>
......
......@@ -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);
......
......@@ -240,8 +240,8 @@ const ProjectSubmitWork = observer(() => {
<ArrowBackIosNewIcon
sx={{
color: "rgba(194, 198, 204, 1)",
width: "12px",
height: "12px",
width: "14px",
height: "14px",
}}
/>
</IconButton>
......
......@@ -21,6 +21,11 @@ const CurrentProject = observer(() => {
document.addEventListener("click", (e) => {
setProjectListOpen(false);
});
return () => {
document.removeEventListener("click", (e) => {
setProjectListOpen(false);
});
};
}, []);
const handleShowProjectList = (event: React.MouseEvent<HTMLElement>) => {
......@@ -85,6 +90,7 @@ const CurrentProject = observer(() => {
<Fade {...TransitionProps} timeout={350}>
<div>
<ProjectListPopper
setProjectListOpen={setProjectListOpen}
handleClickOpen={openAddProject}
handleChangeCurrentProject={handleChangeCurrentProject}
/>
......
......@@ -2,7 +2,7 @@
* @Author: 吴永生 15770852798@163.com
* @Date: 2022-08-02 11:43:28
* @LastEditors: 吴永生 15770852798@163.com
* @LastEditTime: 2022-08-02 19:36:32
* @LastEditTime: 2022-08-11 18:50:31
* @FilePath: /bkunyun/src/views/Project/components/ProjectListPopper/index.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
......@@ -19,7 +19,8 @@ import { toJS } from "mobx";
import { observer } from "mobx-react-lite";
const ProjectListPopper = observer((props: any) => {
const { handleChangeCurrentProject, handleClickOpen } = props;
const { handleChangeCurrentProject, handleClickOpen, setProjectListOpen } =
props;
const { currentProjectStore } = useStores();
const projectList = toJS(currentProjectStore.projectList);
const currentProjectId = toJS(currentProjectStore.currentProjectInfo.id);
......@@ -36,68 +37,69 @@ const ProjectListPopper = observer((props: any) => {
}, [projectList, name]);
const handleProjectBox = (e: React.SyntheticEvent) => {
setProjectListOpen(false);
e.nativeEvent.stopImmediatePropagation();
};
return (
<div className={style.projectBox} onClick={handleProjectBox}>
<div className={style.mainBox}>
<div className={style.searchBox}>
<IconButton
type="submit"
className={style.searchButton}
aria-label="search"
>
<SearchIcon
className={style.searchIcon}
style={{ color: "rgba(153, 153, 153, 1)" }}
<div className={style.searchBox}>
<IconButton
type="submit"
className={style.searchButton}
aria-label="search"
>
<SearchIcon
className={style.searchIcon}
style={{ color: "rgba(153, 153, 153, 1)" }}
/>
</IconButton>
<InputBase
className={style.searchInput}
placeholder="请输入项目名称"
inputProps={{ "aria-label": "请输入项目名称" }}
value={name}
onChange={nameChange}
/>
</IconButton>
<InputBase
className={style.searchInput}
placeholder="请输入项目名称"
inputProps={{ "aria-label": "请输入项目名称" }}
value={name}
onChange={nameChange}
/>
<IconButton
onClick={handleClickOpen}
type="submit"
className={style.add}
aria-label="search"
>
<AddIcon className={style.addIcon} />
</IconButton>
</div>
<div className={style.projectlist}>
{list.map((item: any) => {
return (
<div
className={classNames({
[style.projectli]: true,
[style.projectliActive]: item.id === currentProjectId,
})}
key={item.id}
onClick={() => handleChangeCurrentProject(item)}
>
<div className={style.projectliBorderBox}>
<img src={smallLogo} alt="" className={style.projectliLogo} />
<div className={style.projectliInfo}>
<div className={style.projectName}>{item.name}</div>
<div className={style.projectOwnerTime}>
<span className={style.projectOwner} title={item.owner}>
{item.owner}
</span>
<span className={style.projectTime}>
{moment(item.createdAt).format("YYYY-MM-DD")}
</span>
<IconButton
onClick={handleClickOpen}
type="submit"
className={style.add}
aria-label="search"
>
<AddIcon className={style.addIcon} />
</IconButton>
</div>
<div className={style.projectlist}>
{list.map((item: any) => {
return (
<div
className={classNames({
[style.projectli]: true,
[style.projectliActive]: item.id === currentProjectId,
})}
key={item.id}
onClick={() => handleChangeCurrentProject(item)}
>
<div className={style.projectliBorderBox}>
<img src={smallLogo} alt="" className={style.projectliLogo} />
<div className={style.projectliInfo}>
<div className={style.projectName}>{item.name}</div>
<div className={style.projectOwnerTime}>
<span className={style.projectOwner} title={item.owner}>
{item.owner}
</span>
<span className={style.projectTime}>
{moment(item.createdAt).format("YYYY-MM-DD")}
</span>
</div>
</div>
</div>
</div>
</div>
);
})}
</div>
);
})}
</div>
</div>
</div>
);
......
......@@ -63,6 +63,7 @@ const OperatorItem = (props: IOperatorItemProps) => {
item?.edges.map((every) => {
return {
...every,
id: `${every.id}_${count}`,
source: `${every.source}_${count}`,
target: `${every.target}_${count}`,
};
......@@ -75,7 +76,7 @@ const OperatorItem = (props: IOperatorItemProps) => {
x: item.type === "BATCH" ? x : item.position?.x,
y: item.type === "BATCH" ? y : item.position?.y,
},
edges: newEdges?.length ? newEdges : item?.edges,
edges: newEdges?.length ? newEdges : [],
};
});
return newVal;
......
......@@ -28,219 +28,8 @@ type IParameterSettingProps = {
taskId: string;
setTemplateConfigInfo: any;
};
// 页面调试数据 暂不删除
// const templateConfigInfoMock = [
// {
// id: "id",
// title: "title",
// description:
// "阿斯蒂芬吉林集安拉开圣诞节疯狂拉升阶段阿斯蒂芬吉林集安拉开圣诞节疯狂拉升阶段阿斯蒂芬吉林集安拉开圣诞节疯狂拉升阶段阿斯蒂芬吉林集安拉开圣诞节疯狂拉升阶段阿斯蒂芬吉林集安拉开圣诞节疯狂拉升阶段阿斯蒂芬吉林集安拉开圣诞节疯狂拉升阶段",
// version: "version",
// position: {
// x: 10,
// y: 100,
// },
// tags: ["string[]"],
// type: "BATCH",
// parentNode: "string",
// parameters: [
// {
// hidden: true,
// id: "1",
// name: "smi_in",
// required: true,
// defaultValue: "",
// domType: "input",
// classType: "STRING",
// classTypeName: "String",
// value: "",
// description: "123",
// language: "",
// languageVersion: "",
// tags: [],
// source: "string",
// productId: "",
// tasks: [],
// validators: [
// {
// message: "请选择smi文件作为输入",
// regex: "^.[s][m][i]$",
// },
// ],
// choices: [],
// parameterGroup: "in",
// },
// {
// hidden: true,
// id: "2",
// name: "out",
// required: true,
// defaultValue: "",
// domType: "select",
// classType: "STRING",
// classTypeName: "String",
// value: "",
// description: "",
// language: "",
// languageVersion: "",
// tags: [],
// source: "string",
// productId: "",
// tasks: [],
// validators: [
// {
// message: "请选择smi文件作为输入",
// regex: "^.[s][m][i]$",
// },
// ],
// choices: [],
// parameterGroup: "out",
// },
// {
// hidden: true,
// id: "3",
// name: "basis999",
// required: true,
// defaultValue: "",
// domType: "select",
// classType: "STRING",
// classTypeName: "String",
// value: "",
// description: "789",
// language: "",
// languageVersion: "",
// tags: [],
// source: "string",
// productId: "",
// tasks: [],
// validators: [
// {
// message: "请选择smi文件作为输入",
// regex: "^.[s][m][i]$",
// },
// ],
// choices: [],
// parameterGroup: "basis",
// },
// {
// hidden: true,
// id: "4",
// name: "basis",
// required: true,
// defaultValue: "",
// domType: "select",
// classType: "STRING",
// classTypeName: "String",
// value: "",
// description: "",
// language: "",
// languageVersion: "",
// tags: [],
// source: "string",
// productId: "",
// tasks: [],
// validators: [
// {
// message: "请选择smi文件作为输入",
// regex: "^.[s][m][i]$",
// },
// ],
// choices: [],
// parameterGroup: "basis",
// },
// {
// hidden: true,
// id: "5",
// name: "senior",
// required: true,
// defaultValue: "",
// domType: "checkbox",
// classType: "STRING",
// classTypeName: "String",
// value: "",
// description: "",
// language: "",
// languageVersion: "",
// tags: [],
// source: "string",
// productId: "",
// tasks: [],
// validators: [
// {
// message: "请选择smi文件作为输入",
// regex: "^.[s][m][i]$",
// },
// ],
// choices: [
// {
// label: "123",
// value: "123",
// },
// {
// label: "456",
// value: "456",
// },
// {
// label: "789",
// value: "789",
// },
// ],
// parameterGroup: "senior",
// },
// {
// hidden: true,
// id: "6",
// name: "hardware",
// required: true,
// defaultValue: "",
// domType: "radio",
// classType: "STRING",
// classTypeName: "String",
// value: "",
// description: "",
// language: "",
// languageVersion: "",
// tags: [],
// source: "string",
// productId: "",
// tasks: [],
// validators: [
// {
// message: "请选择smi文件作为输入",
// regex: "^.[s][m][i]$",
// },
// ],
// choices: [
// {
// label: "123",
// value: "123",
// },
// {
// label: "456",
// value: "456",
// },
// {
// label: "789",
// value: "789",
// },
// ],
// parameterGroup: "hardware",
// },
// ],
// edges: [],
// isCheck: false,
// executionStatus: "Pending",
// },
// ];
// const taskId = "id";
const ParameterSetting = (props: IParameterSettingProps) => {
const { templateConfigInfo, setTemplateConfigInfo, taskId } = props; // 算子大数组
// 页面调试数据 暂不删除
// const [templateConfigInfo, setTemplateConfigInfo] = useState<ITask[]>(
// templateConfigInfoMock as ITask[]
// );
const [descHeight, setDescHeight] = useState(0); // 算子描述的高度 用来完成描述展开收起功能
const [isShowAllDese, setIsShowAllDese] = useState(false); // 是否展示全部描述
const [fileSelectOpen, setFileSelectOpen] = useState(false); // 选择输出路径的弹窗显示控制
......@@ -398,16 +187,16 @@ const ParameterSetting = (props: IParameterSettingProps) => {
{(parameter.domType || "").toLowerCase() === "file" && (
<MyInput
value={parameter.defaultValue || ""}
onClick={() => {
if (parameter.parameterGroup === "out") {
return;
}
setFileSelectType("file");
handleOpenFileSelect(parameter.name);
}}
InputProps={{
endAdornment: (
<img
onClick={() => {
if (parameter.parameterGroup === "out") {
return;
}
setFileSelectType("file");
handleOpenFileSelect(parameter.name);
}}
src={fileSelectIcon}
alt=""
className={styles.fileSelectImg}
......@@ -423,16 +212,16 @@ const ParameterSetting = (props: IParameterSettingProps) => {
{(parameter.domType || "").toLowerCase() === "path" && (
<MyInput
value={parameter.defaultValue || ""}
onClick={() => {
if (parameter.parameterGroup === "out") {
return;
}
setFileSelectType("path");
handleOpenFileSelect(parameter.name);
}}
InputProps={{
endAdornment: (
<img
onClick={() => {
if (parameter.parameterGroup === "out") {
return;
}
setFileSelectType("path");
handleOpenFileSelect(parameter.name);
}}
src={fileSelectIcon}
alt=""
className={styles.fileSelectImg}
......@@ -448,16 +237,16 @@ const ParameterSetting = (props: IParameterSettingProps) => {
{(parameter.domType || "").toLowerCase() === "dataset" && (
<MyInput
value={parameter.defaultValue || ""}
onClick={() => {
if (parameter.parameterGroup === "out") {
return;
}
setFileSelectType("dataset");
handleOpenFileSelect(parameter.name);
}}
InputProps={{
endAdornment: (
<img
onClick={() => {
if (parameter.parameterGroup === "out") {
return;
}
setFileSelectType("dataset");
handleOpenFileSelect(parameter.name);
}}
src={fileSelectIcon}
alt=""
className={styles.fileSelectImg}
......
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