fix(web): workflow bug
This commit is contained in:
@@ -62,6 +62,10 @@ const AssignmentList: FC<AssignmentListProps> = ({
|
|||||||
placeholder={t('common.pleaseSelect')}
|
placeholder={t('common.pleaseSelect')}
|
||||||
options={options}
|
options={options}
|
||||||
popupMatchSelectWidth={false}
|
popupMatchSelectWidth={false}
|
||||||
|
onChange={() => {
|
||||||
|
form.setFieldValue([parentName, name, 'operation'], undefined);
|
||||||
|
form.setFieldValue([parentName, name, 'value'], undefined);
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
@@ -72,6 +76,7 @@ const AssignmentList: FC<AssignmentListProps> = ({
|
|||||||
noStyle
|
noStyle
|
||||||
>
|
>
|
||||||
<Select
|
<Select
|
||||||
|
placeholder={t('common.pleaseSelect')}
|
||||||
options={operationOptions.map(op => ({
|
options={operationOptions.map(op => ({
|
||||||
...op,
|
...op,
|
||||||
label: t(op.label)
|
label: t(op.label)
|
||||||
@@ -99,14 +104,20 @@ const AssignmentList: FC<AssignmentListProps> = ({
|
|||||||
name={[name, 'value']}
|
name={[name, 'value']}
|
||||||
noStyle
|
noStyle
|
||||||
>
|
>
|
||||||
{operation === 'assign'
|
{dataType === 'number' && operation === 'cover'
|
||||||
|
? <VariableSelect
|
||||||
|
placeholder={t('common.pleaseSelect')}
|
||||||
|
options={dataType ? options.filter(vo => vo.dataType === dataType) : options}
|
||||||
|
popupMatchSelectWidth={false}
|
||||||
|
/>
|
||||||
|
: dataType === 'number'
|
||||||
|
? <InputNumber
|
||||||
|
placeholder={t('common.pleaseEnter')}
|
||||||
|
className="rb:w-full!"
|
||||||
|
/>
|
||||||
|
: operation === 'assign'
|
||||||
? <>
|
? <>
|
||||||
{dataType === 'number'
|
{dataType === 'boolean'
|
||||||
? <InputNumber
|
|
||||||
placeholder={t('common.pleaseEnter')}
|
|
||||||
className="rb:w-full!"
|
|
||||||
/>
|
|
||||||
: dataType === 'boolean'
|
|
||||||
? <Radio.Group block>
|
? <Radio.Group block>
|
||||||
<Radio.Button value={true}>True</Radio.Button>
|
<Radio.Button value={true}>True</Radio.Button>
|
||||||
<Radio.Button value={false}>False</Radio.Button>
|
<Radio.Button value={false}>False</Radio.Button>
|
||||||
|
|||||||
@@ -9,8 +9,8 @@ import VariableSelect from '../VariableSelect'
|
|||||||
import Editor from '../../Editor'
|
import Editor from '../../Editor'
|
||||||
|
|
||||||
interface CaseListProps {
|
interface CaseListProps {
|
||||||
value?: Array<{ logical_operator: 'and' | 'or'; expressions: { left: string; comparison_operator: string; right: string; input_type?: string; }[] }>;
|
value?: Array<{ logical_operator: 'and' | 'or'; expressions: { left: string; operator: string; right: string; input_type?: string; }[] }>;
|
||||||
onChange?: (value: Array<{ logical_operator: 'and' | 'or'; expressions: { left: string; comparison_operator: string; right: string; }[] }>) => void;
|
onChange?: (value: Array<{ logical_operator: 'and' | 'or'; expressions: { left: string; operator: string; right: string; }[] }>) => void;
|
||||||
options: Suggestion[];
|
options: Suggestion[];
|
||||||
name: string;
|
name: string;
|
||||||
selectedNode?: any;
|
selectedNode?: any;
|
||||||
@@ -40,6 +40,8 @@ const operatorsObj: { [key: string]: SelectProps['options'] } = {
|
|||||||
boolean: [
|
boolean: [
|
||||||
{ value: 'eq', label: 'workflow.config.if-else.boolean.eq' },
|
{ value: 'eq', label: 'workflow.config.if-else.boolean.eq' },
|
||||||
{ value: 'ne', label: 'workflow.config.if-else.boolean.ne' },
|
{ value: 'ne', label: 'workflow.config.if-else.boolean.ne' },
|
||||||
|
{ value: 'empty', label: 'workflow.config.if-else.empty' },
|
||||||
|
{ value: 'not_empty', label: 'workflow.config.if-else.not_empty' },
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -199,7 +201,7 @@ const CaseList: FC<CaseListProps> = ({
|
|||||||
expressions: {
|
expressions: {
|
||||||
[conditionIndex]: {
|
[conditionIndex]: {
|
||||||
left: newValue,
|
left: newValue,
|
||||||
comparison_operator: undefined,
|
operator: undefined,
|
||||||
right: undefined,
|
right: undefined,
|
||||||
input_type: undefined
|
input_type: undefined
|
||||||
}
|
}
|
||||||
@@ -238,6 +240,7 @@ const CaseList: FC<CaseListProps> = ({
|
|||||||
<div key={caseField.key}>
|
<div key={caseField.key}>
|
||||||
<Form.List name={[caseField.name, 'expressions']}>
|
<Form.List name={[caseField.name, 'expressions']}>
|
||||||
{(conditionFields, { add: addCondition, remove: removeCondition }) => {
|
{(conditionFields, { add: addCondition, remove: removeCondition }) => {
|
||||||
|
const logicalOperator = form.getFieldValue(name)?.[caseIndex]?.logical_operator || 'and'
|
||||||
return (
|
return (
|
||||||
<div className={clsx("rb:relative rb:mb-4 rb:border rb:border-gray-200 rb:rounded rb:p-3 rb:pl-5")}>
|
<div className={clsx("rb:relative rb:mb-4 rb:border rb:border-gray-200 rb:rounded rb:p-3 rb:pl-5")}>
|
||||||
<div className="rb:flex rb:items-center rb:justify-between rb:mb-3">
|
<div className="rb:flex rb:items-center rb:justify-between rb:mb-3">
|
||||||
@@ -274,14 +277,13 @@ const CaseList: FC<CaseListProps> = ({
|
|||||||
const cases = form.getFieldValue(name) || [];
|
const cases = form.getFieldValue(name) || [];
|
||||||
const currentCase = cases[caseIndex] || {};
|
const currentCase = cases[caseIndex] || {};
|
||||||
const currentExpression = currentCase.expressions?.[conditionIndex] || {};
|
const currentExpression = currentCase.expressions?.[conditionIndex] || {};
|
||||||
const currentOperator = currentExpression.comparison_operator;
|
const currentOperator = currentExpression.operator;
|
||||||
const hideRightField = currentOperator === 'empty' || currentOperator === 'not_empty';
|
const hideRightField = currentOperator === 'empty' || currentOperator === 'not_empty';
|
||||||
const leftFieldValue = currentExpression.left;
|
const leftFieldValue = currentExpression.left;
|
||||||
const leftFieldOption = options.find(option => `{{${option.value}}}` === leftFieldValue);
|
const leftFieldOption = options.find(option => `{{${option.value}}}` === leftFieldValue);
|
||||||
const leftFieldType = leftFieldOption?.dataType;
|
const leftFieldType = leftFieldOption?.dataType;
|
||||||
const operatorList = operatorsObj[leftFieldType || 'default'] || operatorsObj.default || [];
|
const operatorList = operatorsObj[leftFieldType || 'default'] || operatorsObj.default || [];
|
||||||
const inputType = leftFieldType === 'number' ? currentExpression.input_type : undefined;
|
const inputType = leftFieldType === 'number' ? currentExpression.input_type : undefined;
|
||||||
const logicalOperator = currentCase.logical_operator;
|
|
||||||
return (
|
return (
|
||||||
<div key={conditionField.key} className={clsx({
|
<div key={conditionField.key} className={clsx({
|
||||||
"rb:mb-3": conditionIndex !== conditionFields.length - 1
|
"rb:mb-3": conditionIndex !== conditionFields.length - 1
|
||||||
@@ -301,7 +303,7 @@ const CaseList: FC<CaseListProps> = ({
|
|||||||
</Form.Item>
|
</Form.Item>
|
||||||
</Col>
|
</Col>
|
||||||
<Col span={8}>
|
<Col span={8}>
|
||||||
<Form.Item name={[conditionField.name, 'comparison_operator']} noStyle>
|
<Form.Item name={[conditionField.name, 'operator']} noStyle>
|
||||||
<Select
|
<Select
|
||||||
options={operatorList.map(vo => ({
|
options={operatorList.map(vo => ({
|
||||||
...vo,
|
...vo,
|
||||||
|
|||||||
@@ -9,7 +9,7 @@ import Editor from '../../Editor'
|
|||||||
|
|
||||||
interface Case {
|
interface Case {
|
||||||
logical_operator: 'and' | 'or';
|
logical_operator: 'and' | 'or';
|
||||||
expressions: Array<{ left: string; comparison_operator: string; right: string; input_type: string; }>
|
expressions: Array<{ left: string; operator: string; right: string; input_type: string; }>
|
||||||
}
|
}
|
||||||
|
|
||||||
interface CaseListProps {
|
interface CaseListProps {
|
||||||
@@ -45,6 +45,8 @@ const operatorsObj: { [key: string]: SelectProps['options'] } = {
|
|||||||
boolean: [
|
boolean: [
|
||||||
{ value: 'eq', label: 'workflow.config.if-else.boolean.eq' },
|
{ value: 'eq', label: 'workflow.config.if-else.boolean.eq' },
|
||||||
{ value: 'ne', label: 'workflow.config.if-else.boolean.ne' },
|
{ value: 'ne', label: 'workflow.config.if-else.boolean.ne' },
|
||||||
|
{ value: 'empty', label: 'workflow.config.if-else.empty' },
|
||||||
|
{ value: 'not_empty', label: 'workflow.config.if-else.not_empty' },
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -61,7 +63,7 @@ const ConditionList: FC<CaseListProps> = ({
|
|||||||
expressions: {
|
expressions: {
|
||||||
[index]: {
|
[index]: {
|
||||||
left: newValue,
|
left: newValue,
|
||||||
comparison_operator: undefined,
|
operator: undefined,
|
||||||
right: undefined,
|
right: undefined,
|
||||||
input_type: undefined
|
input_type: undefined
|
||||||
}
|
}
|
||||||
@@ -87,7 +89,7 @@ const ConditionList: FC<CaseListProps> = ({
|
|||||||
{fields.map((field, index) => {
|
{fields.map((field, index) => {
|
||||||
const expressions = form.getFieldValue([parentName, 'expressions']) || [];
|
const expressions = form.getFieldValue([parentName, 'expressions']) || [];
|
||||||
const currentExpression = expressions[index] || {};
|
const currentExpression = expressions[index] || {};
|
||||||
const currentOperator = currentExpression.comparison_operator;
|
const currentOperator = currentExpression.operator;
|
||||||
const hideRightField = currentOperator === 'empty' || currentOperator === 'not_empty';
|
const hideRightField = currentOperator === 'empty' || currentOperator === 'not_empty';
|
||||||
const leftFieldValue = currentExpression.left;
|
const leftFieldValue = currentExpression.left;
|
||||||
const leftFieldOption = options.find(option => `{{${option.value}}}` === leftFieldValue);
|
const leftFieldOption = options.find(option => `{{${option.value}}}` === leftFieldValue);
|
||||||
@@ -122,7 +124,7 @@ const ConditionList: FC<CaseListProps> = ({
|
|||||||
</Col>
|
</Col>
|
||||||
|
|
||||||
<Col span={8}>
|
<Col span={8}>
|
||||||
<Form.Item name={[field.name, 'comparison_operator']} noStyle>
|
<Form.Item name={[field.name, 'operator']} noStyle>
|
||||||
<Select
|
<Select
|
||||||
options={operatorList.map(vo => ({
|
options={operatorList.map(vo => ({
|
||||||
...vo,
|
...vo,
|
||||||
@@ -196,7 +198,7 @@ const ConditionList: FC<CaseListProps> = ({
|
|||||||
|
|
||||||
<Button
|
<Button
|
||||||
type="dashed"
|
type="dashed"
|
||||||
onClick={() => add({ left: '', comparison_operator: '', right: '' })}
|
onClick={() => add({ left: '', operator: '', right: '' })}
|
||||||
className="rb:w-full rb:ml-6 rb:mt-2"
|
className="rb:w-full rb:ml-6 rb:mt-2"
|
||||||
icon={<span>+</span>}
|
icon={<span>+</span>}
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -1,179 +1,155 @@
|
|||||||
import { useState, useEffect, useMemo } from 'react';
|
import { useMemo, useCallback } from 'react';
|
||||||
import { useTranslation } from 'react-i18next'
|
import { useTranslation } from 'react-i18next'
|
||||||
import { Button, Select, Table } from 'antd';
|
import { Button, Select, Table, Form, type TableProps } from 'antd';
|
||||||
import { PlusOutlined, DeleteOutlined } from '@ant-design/icons';
|
import { PlusOutlined, DeleteOutlined } from '@ant-design/icons';
|
||||||
import Editor from '../../Editor';
|
|
||||||
import type { Suggestion } from '../../Editor/plugin/AutocompletePlugin';
|
import type { Suggestion } from '../../Editor/plugin/AutocompletePlugin';
|
||||||
import Empty from '@/components/Empty';
|
import Empty from '@/components/Empty';
|
||||||
import VariableSelect from '../VariableSelect';
|
import VariableSelect from '../VariableSelect';
|
||||||
|
|
||||||
|
interface EditableCellProps extends React.HTMLAttributes<HTMLElement> {
|
||||||
|
name?: string | string[];
|
||||||
|
inputType?: 'select' | 'variableSelect';
|
||||||
|
options?: { value: string, label: string }[] | Suggestion[];
|
||||||
|
}
|
||||||
|
|
||||||
|
const EditableCell: React.FC<React.PropsWithChildren<EditableCellProps>> = ({
|
||||||
|
name,
|
||||||
|
inputType,
|
||||||
|
options,
|
||||||
|
children,
|
||||||
|
...restProps
|
||||||
|
}) => {
|
||||||
|
const { t } = useTranslation();
|
||||||
|
|
||||||
|
if (!inputType) return <td {...restProps}>{children}</td>;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<td {...restProps}>
|
||||||
|
<Form.Item name={name} style={{ margin: 0 }}>
|
||||||
|
{inputType === 'select' ? (
|
||||||
|
<Select
|
||||||
|
placeholder={t('common.pleaseSelect')}
|
||||||
|
size="small"
|
||||||
|
options={options as { value: string, label: string }[]}
|
||||||
|
/>
|
||||||
|
) : (
|
||||||
|
<VariableSelect
|
||||||
|
placeholder={t('common.pleaseSelect')}
|
||||||
|
size="small"
|
||||||
|
options={(options as Suggestion[]) || []}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</Form.Item>
|
||||||
|
</td>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
export interface TableRow {
|
export interface TableRow {
|
||||||
key: string;
|
key: string;
|
||||||
name: string;
|
name?: string;
|
||||||
value: string;
|
value?: string;
|
||||||
type?: string;
|
type?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface EditableTableProps {
|
interface EditableTableProps {
|
||||||
|
parentName: string | string[];
|
||||||
title?: string;
|
title?: string;
|
||||||
value?: Record<string, string> | TableRow[];
|
|
||||||
onChange?: (value: TableRow[]) => void;
|
|
||||||
options?: Suggestion[];
|
options?: Suggestion[];
|
||||||
typeOptions?: {value: string, label: string}[]
|
typeOptions?: { value: string, label: string }[]
|
||||||
}
|
}
|
||||||
|
|
||||||
const EditableTable: React.FC<EditableTableProps> = ({
|
const EditableTable: React.FC<EditableTableProps> = ({
|
||||||
|
parentName,
|
||||||
title,
|
title,
|
||||||
value,
|
|
||||||
onChange,
|
|
||||||
options = [],
|
options = [],
|
||||||
typeOptions = []
|
typeOptions = []
|
||||||
}) => {
|
}) => {
|
||||||
const { t } = useTranslation()
|
const { t } = useTranslation();
|
||||||
const [rows, setRows] = useState<TableRow[]>([]);
|
const form = Form.useFormInstance();
|
||||||
|
const values = Form.useWatch(typeof parentName === 'string' ? [parentName] : parentName, form);
|
||||||
|
|
||||||
useEffect(() => {
|
const createNewRow = (): TableRow => ({
|
||||||
if (Array.isArray(value)) {
|
key: Date.now().toString(),
|
||||||
setRows([...value])
|
name: undefined,
|
||||||
} else if (value && Object.keys(value).length > 0) {
|
value: undefined,
|
||||||
setRows(Object.entries(value).map(([key, val], index) => ({
|
...(typeOptions.length > 0 && { type: typeOptions[0].value })
|
||||||
key: index.toString(),
|
});
|
||||||
name: key || '',
|
|
||||||
value: val || '',
|
|
||||||
type: typeOptions.length > 0 ? typeOptions[0].value : undefined
|
|
||||||
})))
|
|
||||||
} else {
|
|
||||||
setRows([])
|
|
||||||
}
|
|
||||||
}, [value, typeOptions])
|
|
||||||
|
|
||||||
const handleChange = (key: string, field: 'name' | 'value' | 'type', val: string) => {
|
const handleAdd = useCallback(() => {
|
||||||
const newRows = rows.map(row =>
|
form.setFieldValue(parentName, [...(values ?? []), createNewRow()]);
|
||||||
row.key === key ? { ...row, [field]: val } : row
|
}, [form, parentName, values, typeOptions]);
|
||||||
);
|
|
||||||
setRows(newRows);
|
|
||||||
onChange?.(newRows);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleAdd = () => {
|
const handleDelete = useCallback((index: number) => {
|
||||||
const newRow: TableRow = {
|
const currentValues = form.getFieldValue(parentName) || [];
|
||||||
key: Date.now().toString(),
|
form.setFieldValue(parentName, currentValues.filter((_: TableRow, i: number) => i !== index));
|
||||||
name: '',
|
}, [form, parentName]);
|
||||||
value: '',
|
|
||||||
...(typeOptions.length > 0 && { type: typeOptions[0].value })
|
|
||||||
};
|
|
||||||
const newRows = [...rows, newRow];
|
|
||||||
setRows(newRows);
|
|
||||||
onChange?.(newRows);
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleDelete = (key: string) => {
|
const createColumn = (dataIndex: string, inputType: 'select' | 'variableSelect', width: string, columnOptions: any[]) => ({
|
||||||
const newRows = rows.filter(row => row.key !== key);
|
title: t(`workflow.config.${dataIndex}`),
|
||||||
setRows(newRows);
|
dataIndex,
|
||||||
onChange?.(newRows);
|
width,
|
||||||
};
|
onCell: (_: TableRow, index?: number) => ({
|
||||||
|
name: typeof parentName === 'string' ? [parentName, index ?? 0, dataIndex] : [...parentName, index ?? 0, dataIndex],
|
||||||
|
inputType,
|
||||||
|
options: columnOptions
|
||||||
|
} as any)
|
||||||
|
});
|
||||||
|
|
||||||
const columns = useMemo(() => {
|
const columns: TableProps<TableRow>['columns'] = useMemo(() => {
|
||||||
const baseColumns = [
|
const hasType = typeOptions.length > 0;
|
||||||
|
const baseWidth = hasType ? '35%' : '45%';
|
||||||
|
|
||||||
|
return [
|
||||||
|
createColumn('name', 'variableSelect', baseWidth, options),
|
||||||
|
...(hasType ? [createColumn('type', 'select', '20%', typeOptions)] : []),
|
||||||
|
createColumn('value', 'variableSelect', baseWidth, options),
|
||||||
{
|
{
|
||||||
title: typeOptions.length > 0 ? t('workflow.config.name') : '键',
|
title: '',
|
||||||
dataIndex: 'name',
|
dataIndex: 'actions',
|
||||||
width: typeOptions.length > 0 ? '35%' : '45%',
|
width: '10%',
|
||||||
render: (text: string, record: TableRow) => (
|
render: (_: any, __: TableRow, index: number) => (
|
||||||
<Editor
|
<Button type="text" icon={<DeleteOutlined />} onClick={() => handleDelete(index)} />
|
||||||
options={options}
|
)
|
||||||
value={text}
|
|
||||||
height={32}
|
|
||||||
variant="outlined"
|
|
||||||
onChange={(value) => handleChange(record.key, 'name', value || '')}
|
|
||||||
/>
|
|
||||||
),
|
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
}, [typeOptions, options, t, parentName, handleDelete]);
|
||||||
|
|
||||||
if (typeOptions.length > 0) {
|
const AddButton = ({ block = false }: { block?: boolean }) => (
|
||||||
baseColumns.push({
|
<Button
|
||||||
title: t('workflow.config.type'),
|
type={block ? "dashed" : "text"}
|
||||||
dataIndex: 'type',
|
icon={<PlusOutlined />}
|
||||||
width: '20%',
|
onClick={handleAdd}
|
||||||
render: (text: string, record: TableRow) => (
|
size="small"
|
||||||
<Select
|
block={block}
|
||||||
value={text}
|
className={block ? "rb:mt-1" : ""}
|
||||||
options={typeOptions}
|
>
|
||||||
onChange={(value) => handleChange(record.key, 'type', value)}
|
{block && `+${t('common.add')}`}
|
||||||
/>
|
</Button>
|
||||||
),
|
);
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
baseColumns.push({
|
|
||||||
title: typeOptions.length > 0 ? t('workflow.config.value') : '值',
|
|
||||||
dataIndex: 'value',
|
|
||||||
width: typeOptions.length > 0 ? '35%' : '45%',
|
|
||||||
render: (text: string, record: TableRow) => {
|
|
||||||
if (record.type === 'file') {
|
|
||||||
return (
|
|
||||||
<VariableSelect
|
|
||||||
options={options}
|
|
||||||
value={text}
|
|
||||||
onChange={(value) => handleChange(record.key, 'value', value || '')}
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
return (
|
|
||||||
<Editor
|
|
||||||
options={options}
|
|
||||||
value={text}
|
|
||||||
height={32}
|
|
||||||
variant="outlined"
|
|
||||||
onChange={(value) => handleChange(record.key, 'value', value || '')}
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
baseColumns.push({
|
|
||||||
title: '',
|
|
||||||
dataIndex: 'actions',
|
|
||||||
width: '10%',
|
|
||||||
render: (_: any, record: TableRow) => (
|
|
||||||
<Button
|
|
||||||
type="text"
|
|
||||||
icon={<DeleteOutlined />}
|
|
||||||
onClick={() => handleDelete(record.key)}
|
|
||||||
/>
|
|
||||||
),
|
|
||||||
});
|
|
||||||
|
|
||||||
return baseColumns;
|
|
||||||
}, [typeOptions, options, t]);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="rb:mb-4">
|
<div className="rb:mb-4">
|
||||||
{title && (
|
{title && (
|
||||||
<div className="rb:flex rb:items-center rb:mb-2 rb:justify-between">
|
<div className="rb:flex rb:items-center rb:mb-2 rb:justify-between">
|
||||||
<div className="rb:font-medium">{title}</div>
|
<div className="rb:font-medium">{title}</div>
|
||||||
<Button
|
<AddButton />
|
||||||
type="text"
|
|
||||||
icon={<PlusOutlined />}
|
|
||||||
onClick={handleAdd}
|
|
||||||
size="small"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
<Table
|
|
||||||
columns={columns}
|
<Form.Item name={parentName}>
|
||||||
dataSource={rows}
|
<Table<TableRow>
|
||||||
pagination={false}
|
components={{ body: { cell: EditableCell } }}
|
||||||
size="small"
|
bordered
|
||||||
locale={{ emptyText: <Empty size={88} /> }}
|
dataSource={values}
|
||||||
scroll={{ x: 'max-content' }}
|
columns={columns}
|
||||||
/>
|
pagination={false}
|
||||||
{!title && (
|
size="small"
|
||||||
<Button type="dashed" onClick={handleAdd} block className='rb:mt-1'>
|
locale={{ emptyText: <Empty size={88} /> }}
|
||||||
+{t('common.add')}
|
scroll={{ x: 'max-content' }}
|
||||||
</Button>
|
/>
|
||||||
)}
|
</Form.Item>
|
||||||
|
|
||||||
|
{!title && <AddButton block />}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ import AuthConfigModal from './AuthConfigModal'
|
|||||||
import type { AuthConfigModalRef, HttpRequestConfigForm } from './types'
|
import type { AuthConfigModalRef, HttpRequestConfigForm } from './types'
|
||||||
import VariableSelect from "../VariableSelect";
|
import VariableSelect from "../VariableSelect";
|
||||||
import MessageEditor from '../MessageEditor'
|
import MessageEditor from '../MessageEditor'
|
||||||
import EditableTable, { type TableRow } from './EditableTable'
|
import EditableTable from './EditableTable'
|
||||||
|
|
||||||
const HttpRequest: FC<{ options: Suggestion[]; }> = ({
|
const HttpRequest: FC<{ options: Suggestion[]; }> = ({
|
||||||
options,
|
options,
|
||||||
@@ -36,17 +36,6 @@ const HttpRequest: FC<{ options: Suggestion[]; }> = ({
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
const updateObjectList = (data: TableRow[], key: string) => {
|
|
||||||
let obj: Record<string, string> = {}
|
|
||||||
if (data.length) {
|
|
||||||
data.forEach(vo => {
|
|
||||||
obj[vo.name] = vo.value
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
form.setFieldValue(key, obj)
|
|
||||||
}
|
|
||||||
|
|
||||||
console.log('HttpRequest', values)
|
console.log('HttpRequest', values)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -81,17 +70,17 @@ const HttpRequest: FC<{ options: Suggestion[]; }> = ({
|
|||||||
|
|
||||||
<Form.Item name="headers">
|
<Form.Item name="headers">
|
||||||
<EditableTable
|
<EditableTable
|
||||||
|
parentName="headers"
|
||||||
title="HEADERS"
|
title="HEADERS"
|
||||||
options={options}
|
options={options}
|
||||||
onChange={(headers) => updateObjectList(headers, 'headers')}
|
|
||||||
/>
|
/>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
|
|
||||||
<Form.Item name="params">
|
<Form.Item name="params">
|
||||||
<EditableTable
|
<EditableTable
|
||||||
|
parentName="params"
|
||||||
title="PARAMS"
|
title="PARAMS"
|
||||||
options={options}
|
options={options}
|
||||||
onChange={(params) => updateObjectList(params, 'params')}
|
|
||||||
/>
|
/>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
|
|
||||||
@@ -113,15 +102,8 @@ const HttpRequest: FC<{ options: Suggestion[]; }> = ({
|
|||||||
{values?.body?.content_type === 'form-data' &&
|
{values?.body?.content_type === 'form-data' &&
|
||||||
<Form.Item name={['body', 'data']} noStyle>
|
<Form.Item name={['body', 'data']} noStyle>
|
||||||
<EditableTable
|
<EditableTable
|
||||||
|
parentName={['body', 'data']}
|
||||||
options={options}
|
options={options}
|
||||||
onChange={(data) => {
|
|
||||||
form.setFieldsValue({
|
|
||||||
body: {
|
|
||||||
...form.getFieldValue('body'),
|
|
||||||
data
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}}
|
|
||||||
typeOptions={[
|
typeOptions={[
|
||||||
{ label: 'text', value: 'text' },
|
{ label: 'text', value: 'text' },
|
||||||
{ label: 'file', value: 'file' }
|
{ label: 'file', value: 'file' }
|
||||||
@@ -132,13 +114,8 @@ const HttpRequest: FC<{ options: Suggestion[]; }> = ({
|
|||||||
{values?.body?.content_type === 'x-www-form-urlencoded' &&
|
{values?.body?.content_type === 'x-www-form-urlencoded' &&
|
||||||
<Form.Item name={['body', 'data']} noStyle>
|
<Form.Item name={['body', 'data']} noStyle>
|
||||||
<EditableTable
|
<EditableTable
|
||||||
|
parentName={['body', 'data']}
|
||||||
options={options}
|
options={options}
|
||||||
onChange={(data) => {
|
|
||||||
const currentBody = form.getFieldValue('body') || {}
|
|
||||||
form.setFieldsValue({
|
|
||||||
body: { ...currentBody, data }
|
|
||||||
})
|
|
||||||
}}
|
|
||||||
/>
|
/>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -103,6 +103,7 @@ const ParamEditModal = forwardRef<ParamEditModalRef, ParamEditModalProps>(({
|
|||||||
<FormItem
|
<FormItem
|
||||||
name="desc"
|
name="desc"
|
||||||
label={t('workflow.config.parameter-extractor.desc')}
|
label={t('workflow.config.parameter-extractor.desc')}
|
||||||
|
rules={[{ required: true, message: t('common.pleaseEnter') }]}
|
||||||
>
|
>
|
||||||
<Input.TextArea placeholder={t('common.enter')} />
|
<Input.TextArea placeholder={t('common.enter')} />
|
||||||
</FormItem>
|
</FormItem>
|
||||||
|
|||||||
@@ -82,7 +82,7 @@ const Properties: FC<PropertiesProps> = ({
|
|||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (values && selectedNode) {
|
if (values && selectedNode) {
|
||||||
const { id, knowledge_retrieval, group, group_names, ...rest } = values
|
const { id, knowledge_retrieval, group, group_variables, ...rest } = values
|
||||||
const { knowledge_bases = [], ...restKnowledgeConfig } = (knowledge_retrieval as any) || {}
|
const { knowledge_bases = [], ...restKnowledgeConfig } = (knowledge_retrieval as any) || {}
|
||||||
|
|
||||||
let allRest = {
|
let allRest = {
|
||||||
@@ -730,7 +730,7 @@ const Properties: FC<PropertiesProps> = ({
|
|||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
: config.type === 'switch'
|
: config.type === 'switch'
|
||||||
? <Switch onChange={key === 'group' ? () => { form.setFieldValue('group_names', []) } : undefined} />
|
? <Switch onChange={key === 'group' ? () => { form.setFieldValue('group_variables', []) } : undefined} />
|
||||||
: config.type === 'categoryList'
|
: config.type === 'categoryList'
|
||||||
? <CategoryList parentName={key} selectedNode={selectedNode} graphRef={graphRef} />
|
? <CategoryList parentName={key} selectedNode={selectedNode} graphRef={graphRef} />
|
||||||
: config.type === 'conditionList'
|
: config.type === 'conditionList'
|
||||||
|
|||||||
@@ -327,7 +327,7 @@ export const nodeLibrary: NodeLibrary[] = [
|
|||||||
type: 'switch',
|
type: 'switch',
|
||||||
defaultValue: false
|
defaultValue: false
|
||||||
},
|
},
|
||||||
group_names: {
|
group_variables: {
|
||||||
type: 'groupVariableList',
|
type: 'groupVariableList',
|
||||||
defaultValue: [],
|
defaultValue: [],
|
||||||
}
|
}
|
||||||
@@ -373,11 +373,11 @@ export const nodeLibrary: NodeLibrary[] = [
|
|||||||
},
|
},
|
||||||
headers: {
|
headers: {
|
||||||
type: 'define',
|
type: 'define',
|
||||||
defaultValue: {}
|
defaultValue: []
|
||||||
},
|
},
|
||||||
params: {
|
params: {
|
||||||
type: 'define',
|
type: 'define',
|
||||||
defaultValue: {}
|
defaultValue: []
|
||||||
},
|
},
|
||||||
body: {
|
body: {
|
||||||
type: 'define',
|
type: 'define',
|
||||||
|
|||||||
@@ -90,11 +90,13 @@ export const useWorkflowGraph = ({
|
|||||||
nodeLibraryConfig.config[key].defaultValue = {
|
nodeLibraryConfig.config[key].defaultValue = {
|
||||||
...rest
|
...rest
|
||||||
}
|
}
|
||||||
} else if (key === 'group_names' && nodeLibraryConfig.config && nodeLibraryConfig.config[key]) {
|
} else if (key === 'group_variables' && nodeLibraryConfig.config && nodeLibraryConfig.config[key]) {
|
||||||
const { group_names, group } = config
|
const { group_variables, group } = config
|
||||||
nodeLibraryConfig.config[key].defaultValue = group
|
nodeLibraryConfig.config[key].defaultValue = group
|
||||||
? Object.entries(group_names as Record<string, any>).map(([key, value]) => ({ key, value }))
|
? Object.entries(group_variables as Record<string, any>).map(([key, value]) => ({ key, value }))
|
||||||
: group_names
|
: group_variables
|
||||||
|
} else if (type === 'http-request' && (key === 'headers' || key === 'params') && config[key] && typeof config[key] === 'object' && !Array.isArray(config[key]) && nodeLibraryConfig.config && nodeLibraryConfig.config[key]) {
|
||||||
|
nodeLibraryConfig.config[key].defaultValue = Object.entries(config[key]).map(([name, value]) => ({ name, value }))
|
||||||
} else if (nodeLibraryConfig.config && nodeLibraryConfig.config[key] && config[key]) {
|
} else if (nodeLibraryConfig.config && nodeLibraryConfig.config[key] && config[key]) {
|
||||||
nodeLibraryConfig.config[key].defaultValue = config[key]
|
nodeLibraryConfig.config[key].defaultValue = config[key]
|
||||||
}
|
}
|
||||||
@@ -882,14 +884,22 @@ export const useWorkflowGraph = ({
|
|||||||
|
|
||||||
if (data.config) {
|
if (data.config) {
|
||||||
Object.keys(data.config).forEach(key => {
|
Object.keys(data.config).forEach(key => {
|
||||||
if (data.config[key] && 'defaultValue' in data.config[key] && key === 'group_names') {
|
if (data.config[key] && 'defaultValue' in data.config[key] && key === 'group_variables') {
|
||||||
let group_names = data.config.group.defaultValue ? {} : data.config[key].defaultValue
|
let group_variables = data.config.group.defaultValue ? {} : data.config[key].defaultValue
|
||||||
if (data.config.group.defaultValue) {
|
if (data.config.group.defaultValue) {
|
||||||
data.config[key].defaultValue.map((vo: any) => {
|
data.config[key].defaultValue.map((vo: any) => {
|
||||||
group_names[vo.key] = vo.value
|
group_variables[vo.key] = vo.value
|
||||||
|
})
|
||||||
|
}
|
||||||
|
itemConfig[key] = group_variables
|
||||||
|
} else if (data.type === 'http-request' && (key === 'headers' || key === 'params') && data.config[key] && 'defaultValue' in data.config[key]) {
|
||||||
|
const value = data.config[key].defaultValue
|
||||||
|
itemConfig[key] = {}
|
||||||
|
if (value.length > 0) {
|
||||||
|
value.forEach((vo: any) => {
|
||||||
|
itemConfig[key][vo.name] = vo.value
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
itemConfig[key] = group_names
|
|
||||||
} else if (data.config[key] && 'defaultValue' in data.config[key] && key !== 'knowledge_retrieval') {
|
} else if (data.config[key] && 'defaultValue' in data.config[key] && key !== 'knowledge_retrieval') {
|
||||||
itemConfig[key] = data.config[key].defaultValue
|
itemConfig[key] = data.config[key].defaultValue
|
||||||
} else if (key === 'knowledge_retrieval' && data.config[key] && 'defaultValue' in data.config[key]) {
|
} else if (key === 'knowledge_retrieval' && data.config[key] && 'defaultValue' in data.config[key]) {
|
||||||
|
|||||||
@@ -24,7 +24,7 @@ export interface NodeConfig {
|
|||||||
|
|
||||||
knowledge_retrieval?: KnowledgeConfig;
|
knowledge_retrieval?: KnowledgeConfig;
|
||||||
|
|
||||||
group_names?: Array<{ key: string, value: string[] }>
|
group_variables?: Array<{ key: string, value: string[] }>
|
||||||
cycle?: string;
|
cycle?: string;
|
||||||
[key: string]: unknown;
|
[key: string]: unknown;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user