Skip to content

B
bkunyun
Commit 9c1ebdf0 authored by chenshouchao's avatar chenshouchao
Browse files
Options

feat: 完成表单项渲染，完成表单项和patch节点校验

parent 7fd917a1
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 397 additions and 155 deletions
package-lock.json
View file @ 9c1ebdf0
This diff is collapsed.
src/components/mui/MyCheckBox.tsx
View file @ 9c1ebdf0
...@@ -2,12 +2,17 @@ import * as React from "react"; ...@@ -2,12 +2,17 @@ import * as React from "react";
import FormGroup from "@mui/material/FormGroup"; import FormGroup from "@mui/material/FormGroup";
import FormControlLabel from "@mui/material/FormControlLabel"; import FormControlLabel from "@mui/material/FormControlLabel";
import Checkbox from "@mui/material/Checkbox"; import Checkbox from "@mui/material/Checkbox";
import FormControl from "@mui/material/FormControl";
import FormHelperText from '@mui/material/FormHelperText';
import _ from "lodash"; import _ from "lodash";
type IMyCheckBoxProps = { type IMyCheckBoxProps = {
value: Array<any>; value: Array<any>;
options: Array<ICheckBoxOption>; options: Array<ICheckBoxOption>;
onChange: any; // 直接返回选中项的数组 onChange: any; // 直接返回选中项的数组
variant?: "standard" | "outlined" | "filled";
error?: boolean;
helperText?: string;
}; };
type ICheckBoxOption = { type ICheckBoxOption = {
...@@ -32,7 +37,7 @@ export const optionsTransform = ( ...@@ -32,7 +37,7 @@ export const optionsTransform = (
}; };
export default function MyCheckBox(props: IMyCheckBoxProps) { export default function MyCheckBox(props: IMyCheckBoxProps) {
const { value, options, onChange } = props; const { value, options, onChange, error = false, helperText, variant } = props;
const getCheckedStatus = ( const getCheckedStatus = (
checkBoxItemValue: any, checkBoxItemValue: any,
...@@ -56,6 +61,7 @@ export default function MyCheckBox(props: IMyCheckBoxProps) { ...@@ -56,6 +61,7 @@ export default function MyCheckBox(props: IMyCheckBoxProps) {
}; };
return ( return (
<FormControl fullWidth variant={variant} error={error}>
<FormGroup row> <FormGroup row>
{options.map((option) => { {options.map((option) => {
return ( return (
...@@ -74,5 +80,7 @@ export default function MyCheckBox(props: IMyCheckBoxProps) { ...@@ -74,5 +80,7 @@ export default function MyCheckBox(props: IMyCheckBoxProps) {
); );
})} })}
</FormGroup> </FormGroup>
{helperText && <FormHelperText>{helperText}</FormHelperText>}
</FormControl>
); );
} }
src/components/mui/MyInput.tsx
View file @ 9c1ebdf0
...@@ -12,6 +12,8 @@ type MyInputProps = { ...@@ -12,6 +12,8 @@ type MyInputProps = {
placeholder?: string; placeholder?: string;
fullWidth?: boolean; // 宽度是否和容器一致 fullWidth?: boolean; // 宽度是否和容器一致
InputProps?: any; // input加前后icon可以用这个 InputProps?: any; // input加前后icon可以用这个
error?: boolean;
helperText?: string;
}; };
const MyInput = (props: MyInputProps) => { const MyInput = (props: MyInputProps) => {
...@@ -27,10 +29,14 @@ const MyInput = (props: MyInputProps) => { ...@@ -27,10 +29,14 @@ const MyInput = (props: MyInputProps) => {
placeholder = "请输入", placeholder = "请输入",
fullWidth = true, fullWidth = true,
InputProps, InputProps,
error = false,
helperText,
} = props; } = props;
return ( return (
<TextField <TextField
error={error}
helperText={helperText}
value={value} value={value}
sx={{ ...inputSx }} sx={{ ...inputSx }}
id={id} id={id}
......
src/components/mui/MyRadio.tsx
View file @ 9c1ebdf0
...@@ -2,11 +2,16 @@ import * as React from "react"; ...@@ -2,11 +2,16 @@ import * as React from "react";
import Radio from "@mui/material/Radio"; import Radio from "@mui/material/Radio";
import RadioGroup from "@mui/material/RadioGroup"; import RadioGroup from "@mui/material/RadioGroup";
import FormControlLabel from "@mui/material/FormControlLabel"; import FormControlLabel from "@mui/material/FormControlLabel";
import FormControl from "@mui/material/FormControl";
import FormHelperText from '@mui/material/FormHelperText';
type IMyRadioProps = { type IMyRadioProps = {
value: any; value: any;
options: Array<ICheckBoxOption>; options: Array<ICheckBoxOption>;
onChange: any; onChange: any;
variant?: "standard" | "outlined" | "filled";
error?: boolean;
helperText?: string;
}; };
type ICheckBoxOption = { type ICheckBoxOption = {
...@@ -32,26 +37,29 @@ export const optionsTransform = ( ...@@ -32,26 +37,29 @@ export const optionsTransform = (
}; };
export default function MyRadio(props: IMyRadioProps) { export default function MyRadio(props: IMyRadioProps) {
const { value, options, onChange } = props; const { value, options, onChange , error = false, helperText, variant} = props;
return ( return (
<RadioGroup <FormControl fullWidth variant={variant} error={error}>
row <RadioGroup
aria-labelledby="demo-row-radio-buttons-group-label" row
name="row-radio-buttons-group" aria-labelledby="demo-row-radio-buttons-group-label"
value={value} name="row-radio-buttons-group"
onChange={onChange} value={value}
> onChange={onChange}
{options.map((option) => { >
return ( {options.map((option) => {
<FormControlLabel return (
key={option.value} <FormControlLabel
value={option.value} key={option.value}
control={<Radio />} value={option.value}
label={option.label} control={<Radio />}
/> label={option.label}
); />
})} );
</RadioGroup> })}
</RadioGroup>
{helperText && <FormHelperText>{helperText}</FormHelperText>}
</FormControl>
); );
} }
src/views/Project/ProjectSubmitWork/ConfigForm/index.module.css
View file @ 9c1ebdf0
...@@ -26,12 +26,18 @@ ...@@ -26,12 +26,18 @@
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
} }
.backgroundTitleTextIcon{
visibility: hidden;
}
.backgroundTitleTextIconShow{
visibility: visible;
}
.backgroundTitleText { .backgroundTitleText {
font-size: 16px; font-size: 16px;
font-weight: 600; font-weight: 600;
line-height: 24px; line-height: 24px;
color: rgba(30, 38, 51, 1); color: rgba(30, 38, 51, 1);
margin-left: 28px; margin-left: 12px;
} }
.formItems { .formItems {
padding: 20px 44px 40px 44px; padding: 20px 44px 40px 44px;
...@@ -70,12 +76,15 @@ ...@@ -70,12 +76,15 @@
line-height: 22px; line-height: 22px;
margin-bottom: 12px; margin-bottom: 12px;
} }
.parameterDataType { .parameterContent{
color: rgba(138, 144, 153, 1); position: relative;
margin-left: 16px;
} }
.parameterDesc { .parameterDesc {
position: absolute; position: absolute;
bottom: 12px; top: 12px;
right: -22px; right: -22px;
} }
.parameterDataType {
color: rgba(138, 144, 153, 1);
margin-left: 16px;
}
src/views/Project/ProjectSubmitWork/ConfigForm/index.tsx
View file @ 9c1ebdf0
...@@ -10,8 +10,10 @@ import MySelect, { optionsTransform } from "../components/MySelect"; ...@@ -10,8 +10,10 @@ import MySelect, { optionsTransform } from "../components/MySelect";
import MyCheckBox from "@/components/mui/MyCheckBox"; import MyCheckBox from "@/components/mui/MyCheckBox";
import MyRadio from "@/components/mui/MyRadio"; import MyRadio from "@/components/mui/MyRadio";
import _ from "lodash"; import _ from "lodash";
import { getCheckResult } from "../util";
import fileSelectIcon from "@/assets/project/fileSelect.svg"; import fileSelectIcon from "@/assets/project/fileSelect.svg";
import questionMark from "@/assets/project/questionMark.svg"; import questionMark from "@/assets/project/questionMark.svg";
import jobSueIcon from "@/assets/project/jobSue.svg";
type ConfigFormProps = { type ConfigFormProps = {
templateConfigInfo?: ITemplateConfig; templateConfigInfo?: ITemplateConfig;
...@@ -49,15 +51,40 @@ const ConfigForm = (props: ConfigFormProps) => { ...@@ -49,15 +51,40 @@ const ConfigForm = (props: ConfigFormProps) => {
const result: IRenderTasks = []; const result: IRenderTasks = [];
templateConfigInfo?.tasks.forEach((task, taskIndex) => { templateConfigInfo?.tasks.forEach((task, taskIndex) => {
if (task.type === "BATCH") { if (task.type === "BATCH") {
result.push({ ...task, flows: [] }); result.push({ ...task, flows: [], isCheck: true });
} else { } else {
result[result.length - 1]?.flows.push({ ...task }); result[result.length - 1]?.flows.push({ ...task });
} }
}); });
result.forEach((task) => {
let isCheck = true
if (task.parameters.length > 0) {
task.parameters.forEach((parameter)=>{
const { error } = getCheckResult(parameter, parameter.value)
if (error) {
isCheck = false
return
}
})
}
if(task.flows.length>0) {
task.flows.forEach((flow) => {
if (flow.parameters.length > 0) {
flow.parameters.forEach((parameter)=>{
const { error } = getCheckResult(parameter, parameter.value)
if (error) {
isCheck = false
return
}
})
}
})
}
task.isCheck = isCheck
})
return result; return result;
}, [templateConfigInfo]); }, [templateConfigInfo]);
console.log(renderTasks);
// const options = [ // const options = [
// { // {
...@@ -191,8 +218,12 @@ const ConfigForm = (props: ConfigFormProps) => { ...@@ -191,8 +218,12 @@ const ConfigForm = (props: ConfigFormProps) => {
[styles.backgroundTitlePass]: true, [styles.backgroundTitlePass]: true,
})} })}
> >
{/* <img src="" alt="" /> */} <img
<span>下面的子项校验是否通过</span> className={classnames({
[styles.backgroundTitleTextIcon]: true,
[styles.backgroundTitleTextIconShow]: task.isCheck,
})}
src={jobSueIcon} alt="" />
<span className={styles.backgroundTitleText}>{task.title}</span> <span className={styles.backgroundTitleText}>{task.title}</span>
</div> </div>
<div className={styles.taskConfigBox}> <div className={styles.taskConfigBox}>
...@@ -208,8 +239,55 @@ const ConfigForm = (props: ConfigFormProps) => { ...@@ -208,8 +239,55 @@ const ConfigForm = (props: ConfigFormProps) => {
{parameter.dataType} {parameter.dataType}
</span> </span>
</div> </div>
<div className={styles.parameterContent}>
{parameter.domType.toLowerCase() === "input" && ( {parameter.domType.toLowerCase() === "input" && (
<MyInput <MyInput
value={parameter.value}
onChange={(e: any) =>
handleParameterChange(
e,
task.id,
parameter.name || ""
)
}
placeholder="请输入"
error={parameter.error || false}
helperText={parameter.helperText}
></MyInput>
)}
{parameter.domType.toLowerCase() === "select" && (
<MySelect
value={parameter.value}
onChange={(e: any) =>
handleParameterChange(
e,
task.id,
parameter.name || ""
)
}
error={parameter.error || false}
helperText={parameter.helperText}
options={optionsTransform(parameter.choices, "key")}
></MySelect>
)}
{parameter.domType.toLowerCase() === "multipleselect" && (
<MySelect
value={parameter.value}
onChange={(e: any) =>
handleParameterChange(
e,
task.id,
parameter.name || ""
)
}
multiple={true}
error={parameter.error || false}
helperText={parameter.helperText}
options={optionsTransform(parameter.choices, "key")}
></MySelect>
)}
{parameter.domType.toLowerCase() === "radio" && (
<MyRadio
value={parameter.value} value={parameter.value}
onChange={(e: any) => onChange={(e: any) =>
handleParameterChange( handleParameterChange(
...@@ -218,19 +296,40 @@ const ConfigForm = (props: ConfigFormProps) => { ...@@ -218,19 +296,40 @@ const ConfigForm = (props: ConfigFormProps) => {
parameter.name || "" parameter.name || ""
) )
} }
placeholder="请输入" options={optionsTransform(parameter.choices, "key")}
></MyInput> error={parameter.error || false}
)} helperText={parameter.helperText}
{/* {parameter.domType.toLowerCase()} */} ></MyRadio>
{parameter.description && ( )}
<Tooltip title={parameter.description} placement="top"> {parameter.domType.toLowerCase() === "checkbox" && (
<img <MyCheckBox
className={styles.parameterDesc} value={parameter.value}
src={questionMark} onChange={(e: any) =>
alt="" handleParameterChange(
/> {
</Tooltip> target: {
)} value: e
}
},
task.id,
parameter.name || ""
)
}
options={optionsTransform(parameter.choices, "key")}
error={parameter.error || false}
helperText={parameter.helperText}
></MyCheckBox>
)}
{parameter.description && (
<Tooltip title={parameter.description} placement="top">
<img
className={styles.parameterDesc}
src={questionMark}
alt=""
/>
</Tooltip>
)}
</div>
{/* question mark */} {/* question mark */}
</div> </div>
); );
......
src/views/Project/ProjectSubmitWork/components/MySelect.tsx
View file @ 9c1ebdf0
...@@ -3,6 +3,7 @@ import Box from "@mui/material/Box"; ...@@ -3,6 +3,7 @@ import Box from "@mui/material/Box";
import InputLabel from "@mui/material/InputLabel"; import InputLabel from "@mui/material/InputLabel";
import MenuItem from "@mui/material/MenuItem"; import MenuItem from "@mui/material/MenuItem";
import FormControl from "@mui/material/FormControl"; import FormControl from "@mui/material/FormControl";
import FormHelperText from '@mui/material/FormHelperText';
import Select, { SelectProps } from "@mui/material/Select"; import Select, { SelectProps } from "@mui/material/Select";
export interface IOption { export interface IOption {
...@@ -39,6 +40,8 @@ interface IProps ...@@ -39,6 +40,8 @@ interface IProps
isTitle?: boolean; isTitle?: boolean;
size?: "small" | "medium"; size?: "small" | "medium";
multiple?: boolean; // 多选 multiple?: boolean; // 多选
error?: boolean;
helperText?: string;
} }
export default function MySelect(props: IProps) { export default function MySelect(props: IProps) {
const { const {
...@@ -50,11 +53,13 @@ export default function MySelect(props: IProps) { ...@@ -50,11 +53,13 @@ export default function MySelect(props: IProps) {
variant, variant,
size = "small", size = "small",
multiple = false, multiple = false,
error = false,
helperText,
} = props; } = props;
return ( return (
<Box sx={{ minWidth: 120 }}> <Box sx={{ minWidth: 120 }}>
<FormControl fullWidth variant={variant}> <FormControl fullWidth variant={variant} error={error}>
{isTitle ? ( {isTitle ? (
<InputLabel id="demo-simple-select-label"> <InputLabel id="demo-simple-select-label">
{title || "请选择"} {title || "请选择"}
...@@ -84,6 +89,7 @@ export default function MySelect(props: IProps) { ...@@ -84,6 +89,7 @@ export default function MySelect(props: IProps) {
}) })
: null} : null}
</Select> </Select>
{helperText && <FormHelperText>{helperText}</FormHelperText>}
</FormControl> </FormControl>
</Box> </Box>
); );
......
src/views/Project/ProjectSubmitWork/index.tsx
View file @ 9c1ebdf0
...@@ -18,12 +18,13 @@ import _ from "lodash"; ...@@ -18,12 +18,13 @@ import _ from "lodash";
import useMyRequest from "@/hooks/useMyRequest"; import useMyRequest from "@/hooks/useMyRequest";
import { fetchTemplateConfigInfo } from "@/api/project_api"; import { fetchTemplateConfigInfo } from "@/api/project_api";
import { useLocation, useNavigate } from "react-router-dom"; import { useLocation, useNavigate } from "react-router-dom";
import { getCheckResult } from "./util";
import { IResponse } from "@/api/http"; import { IResponse } from "@/api/http";
// import { templateConfigJson } from "./mock"; import { templateConfigJson } from "./mock";
const ProjectSubmitWork = () => { const ProjectSubmitWork = () => {
const [templateConfigInfo, setTemplateConfigInfo] = const [templateConfigInfo, setTemplateConfigInfo] =
useState<ITemplateConfig>(); useState<ITemplateConfig>(templateConfigJson as ITemplateConfig);
const location: any = useLocation(); const location: any = useLocation();
const navigate = useNavigate(); const navigate = useNavigate();
...@@ -31,7 +32,11 @@ const ProjectSubmitWork = () => { ...@@ -31,7 +32,11 @@ const ProjectSubmitWork = () => {
const { run } = useMyRequest(fetchTemplateConfigInfo, { const { run } = useMyRequest(fetchTemplateConfigInfo, {
onSuccess: (res: IResponse<ITemplateConfig>) => { onSuccess: (res: IResponse<ITemplateConfig>) => {
setTemplateConfigInfo(res.data); setTemplateConfigInfo(res.data);
// setTemplateConfigInfo(templateConfigJson as ITemplateConfig);
}, },
// onError: () => {
// setTemplateConfigInfo(templateConfigJson as ITemplateConfig);
// }
}); });
useEffect(() => { useEffect(() => {
...@@ -47,6 +52,29 @@ const ProjectSubmitWork = () => { ...@@ -47,6 +52,29 @@ const ProjectSubmitWork = () => {
tack.parameters.forEach((parameter) => { tack.parameters.forEach((parameter) => {
if (parameter.name === parameterName) { if (parameter.name === parameterName) {
parameter.value = value; parameter.value = value;
const checkResult = getCheckResult(parameter,value)
parameter.error = checkResult.error
parameter.helperText = checkResult.helperText
// 表单校验
// if (parameter.required && !value) {
// parameter.error = true
// parameter.helperText = '该选项是必填项'
// } else if (parameter.validators.length > 0) {
// parameter.validators.forEach((validator)=>{
// let error = false
// let helperText = ''
// const reg = new RegExp(validator.regex)
// if (!reg.test(value)) {
// error = true
// helperText = validator.message
// }
// parameter.error = error
// parameter.helperText = helperText
// })
// } else {
// parameter.error = false
// parameter.helperText = ''
// }
} else { } else {
return; return;
} }
......
src/views/Project/ProjectSubmitWork/interface.ts
View file @ 9c1ebdf0
...@@ -14,7 +14,7 @@ export interface IParameter { ...@@ -14,7 +14,7 @@ export interface IParameter {
required: boolean; required: boolean;
domType: IDomType; domType: IDomType;
dataType?: string; dataType?: string;
value: string; value: any;
description: string; description: string;
language: string; language: string;
languageVersion: string; languageVersion: string;
...@@ -24,6 +24,8 @@ export interface IParameter { ...@@ -24,6 +24,8 @@ export interface IParameter {
tasks: ITask[]; tasks: ITask[];
validators: Array<IValidator>; validators: Array<IValidator>;
choices: Array<IChoice>; choices: Array<IChoice>;
error? : boolean;
helperText? : string;
} }
export interface ITask { export interface ITask {
...@@ -99,4 +101,5 @@ export type IRenderTask = { ...@@ -99,4 +101,5 @@ export type IRenderTask = {
parameters: Array<IParameter>; parameters: Array<IParameter>;
edges: Array<IEdge>; edges: Array<IEdge>;
flows: ITask[]; flows: ITask[];
isCheck: boolean; // 里面的子项表单校验是否全部通过
}; };
src/views/Project/ProjectSubmitWork/mock.ts
View file @ 9c1ebdf0
...@@ -17,125 +17,166 @@ export const templateConfigJson = { ...@@ -17,125 +17,166 @@ export const templateConfigJson = {
x: 0, x: 0,
y: 0, y: 0,
}, },
type: "batch", type: "BATCH",
parameters: [ parameters: [
{ {
hidden: false, hidden: false,
name: "in", name: "in",
required: true, required: true,
domType: "input", // domType: "input",
// domType: "select",
// domType: "multipleselect",
// domType: "radio",
domType: "checkbox",
dataType: "stringParameter", dataType: "stringParameter",
value: "", // value: "",
value: [],
description: "输入一段字符串", description: "输入一段字符串",
validators: "", validators: [
choices: [], {
}, regex: '^[0-9]*$',
{ message: '只能输入数字'
hidden: true, }
name: "out", ],
required: true, choices: [
domType: "File", {
dataType: "stringParameter", key: '1',
value: "/home/cloudam/task_a.out", value: 'a'
description: "task_A的输出", },
validators: "", {
choices: [], key: '2',
value: '2'
},
{
key: '3',
value: '3'
}
],
language: '1',
languageVersion: '1',
tags:['1'],
source:'1',
productId:'1',
tasks: [{
id: 'id',
title: 'title',
description: 'description',
position: {
x: 100,
y: 200
},
type: 'BATCH',
parentNode: '1',
parameters: [],
edges: []
}]
}, },
// {
// hidden: true,
// name: "out",
// required: true,
// domType: "File",
// dataType: "stringParameter",
// value: "/home/cloudam/task_a.out",
// description: "task_A的输出",
// validators: "",
// choices: [],
// },
], ],
edges: [], edges: [],
}, },
{ // {
id: "流式算子ID1", // id: "流式算子ID1",
title: "task_B", // title: "task_B",
description: "这是task_B", // description: "这是task_B",
position: { // position: {
x: 100, // x: 100,
y: 50, // y: 50,
}, // },
type: "batch", // type: "batch",
parameters: [ // parameters: [
{ // {
hidden: true, // hidden: true,
name: "in", // name: "in",
required: true, // required: true,
domType: "pathSelect", // domType: "pathSelect",
// pathSelect-路径选择器 datasetSelect-数据集选择器 fileSelect-文件选择器 input-输入框 select-单选下拉框 multipleSelect-多选下拉框 radio-单选组 checkbox-多选组 // // pathSelect-路径选择器 datasetSelect-数据集选择器 fileSelect-文件选择器 input-输入框 select-单选下拉框 multipleSelect-多选下拉框 radio-单选组 checkbox-多选组
dataType: "stringParameter", // dataType: "stringParameter",
value: "task_A.out", // value: "task_A.out",
description: "这是task_B的输入", // description: "这是task_B的输入",
validators: "", // validators: "",
choices: [], // choices: [],
}, // },
{ // {
hidden: false, // hidden: false,
name: "sb", // name: "sb",
required: false, // required: false,
domType: "input", // domType: "input",
// pathSelect-路径选择器 datasetSelect-数据集选择器 fileSelect-文件选择器 input-输入框 select-单选下拉框 multipleSelect-多选下拉框 radio-单选组 checkbox-多选组 // // pathSelect-路径选择器 datasetSelect-数据集选择器 fileSelect-文件选择器 input-输入框 select-单选下拉框 multipleSelect-多选下拉框 radio-单选组 checkbox-多选组
dataType: "stringParameter", // dataType: "stringParameter",
value: "", // value: "",
description: "这是task_B的输入", // description: "这是task_B的输入",
validators: [], // validators: [],
choices: [], // choices: [],
}, // },
], // ],
edges: [ // edges: [
{ // {
id: "10001", // id: "10001",
source: "流式算子ID1", // source: "流式算子ID1",
sourceHandle: "流式算子1出口A", // sourceHandle: "流式算子1出口A",
target: "流式算子ID2", // target: "流式算子ID2",
targetHandle: "流式算子2入口A", // targetHandle: "流式算子2入口A",
lable: "", // lable: "",
}, // },
], // ],
}, // },
{ // {
id: "流式算子ID2", // id: "流式算子ID2",
title: "task_C", // title: "task_C",
description: "这是task_C", // description: "这是task_C",
position: { // position: {
x: 100, // x: 100,
y: 100, // y: 100,
}, // },
type: "batch", // type: "batch",
parameters: [ // parameters: [
{ // {
hidden: true, // hidden: true,
name: "in", // name: "in",
required: true, // required: true,
domType: "pathSelect", // domType: "pathSelect",
// pathSelect-路径选择器 datasetSelect-数据集选择器 fileSelect-文件选择器 input-输入框 select-单选下拉框 multipleSelect-多选下拉框 radio-单选组 checkbox-多选组 // // pathSelect-路径选择器 datasetSelect-数据集选择器 fileSelect-文件选择器 input-输入框 select-单选下拉框 multipleSelect-多选下拉框 radio-单选组 checkbox-多选组
dataType: "stringParameter", // dataType: "stringParameter",
value: "task_A.out", // value: "task_A.out",
description: "这是task_C的输入", // description: "这是task_C的输入",
validators: "", // validators: "",
choices: [], // choices: [],
}, // },
{ // {
hidden: false, // hidden: false,
name: "sc", // name: "sc",
required: false, // required: false,
domType: "input", // domType: "input",
// pathSelect-路径选择器 datasetSelect-数据集选择器 fileSelect-文件选择器 input-输入框 select-单选下拉框 multipleSelect-多选下拉框 radio-单选组 checkbox-多选组 // // pathSelect-路径选择器 datasetSelect-数据集选择器 fileSelect-文件选择器 input-输入框 select-单选下拉框 multipleSelect-多选下拉框 radio-单选组 checkbox-多选组
dataType: "stringParameter", // dataType: "stringParameter",
value: "", // value: "",
description: "这是task_C的输入", // description: "这是task_C的输入",
validators: [], // validators: [],
choices: [], // choices: [],
}, // },
], // ],
edges: [ // edges: [
{ // {
id: "10002", // id: "10002",
source: "流式算子ID2", // source: "流式算子ID2",
sourceHandle: "流式算子1出口A", // sourceHandle: "流式算子1出口A",
target: "流式算子ID2", // target: "流式算子ID2",
targetHandle: "流式算子2入口A", // targetHandle: "流式算子2入口A",
lable: "", // lable: "",
}, // },
], // ],
}, // },
], ],
}; };
// { // {
......
src/views/Project/ProjectSubmitWork/util.ts 0 → 100644
View file @ 9c1ebdf0
import { IParameter } from "./interface"
export const getCheckResult = (parameter: IParameter, value: string): {
error: boolean,
helperText: string
} => {
let error = false
let helperText = ''
// 表单校验
if (parameter.required) {
if (Array.isArray(value)) {
if (value.length === 0) {
error = true
helperText = '该选项是必填项'
}
} else if (value === '' || value === null || value === undefined) {
error = true
helperText = '该选项是必填项'
}
}
if (parameter.validators.length > 0) {
parameter.validators.forEach((validator)=>{
const reg = new RegExp(validator.regex)
if (!reg.test(value)) {
error = true
helperText = validator.message
}
})
}
return {
error,
helperText
}
}
\ No newline at end of file
yarn.lock
View file @ 9c1ebdf0
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