diff --git a/web/src/pages/agent/constant/index.tsx b/web/src/pages/agent/constant/index.tsx
index 18119bc60..27969e643 100644
--- a/web/src/pages/agent/constant/index.tsx
+++ b/web/src/pages/agent/constant/index.tsx
@@ -866,7 +866,6 @@ export enum VariableAssignerLogicalNumberOperator {
export enum VariableAssignerLogicalArrayOperator {
Overwrite = VariableAssignerLogicalOperator.Overwrite,
Clear = VariableAssignerLogicalOperator.Clear,
- Set = VariableAssignerLogicalOperator.Set,
Append = 'append',
Extend = 'extend',
RemoveFirst = 'remove_first',
diff --git a/web/src/pages/agent/form/variable-assigner-form/dynamic-variables.tsx b/web/src/pages/agent/form/variable-assigner-form/dynamic-variables.tsx
index c97c29cdd..76751905d 100644
--- a/web/src/pages/agent/form/variable-assigner-form/dynamic-variables.tsx
+++ b/web/src/pages/agent/form/variable-assigner-form/dynamic-variables.tsx
@@ -1,22 +1,25 @@
import NumberInput from '@/components/originui/number-input';
import { SelectWithSearch } from '@/components/originui/select-with-search';
import { RAGFlowFormItem } from '@/components/ragflow-form';
+import { useIsDarkTheme } from '@/components/theme-provider';
import { Button } from '@/components/ui/button';
import { Label } from '@/components/ui/label';
import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
import { Separator } from '@/components/ui/separator';
+import { Textarea } from '@/components/ui/textarea';
+import { Editor } from '@monaco-editor/react';
import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
import { X } from 'lucide-react';
import { ReactNode, useCallback } from 'react';
import { useFieldArray, useFormContext } from 'react-hook-form';
import {
JsonSchemaDataType,
+ VariableAssignerLogicalArrayOperator,
VariableAssignerLogicalNumberOperator,
VariableAssignerLogicalOperator,
} from '../../constant';
import { useGetVariableLabelOrTypeByValue } from '../../hooks/use-get-begin-query';
import { DynamicFormHeader } from '../components/dynamic-fom-header';
-import { PromptEditor } from '../components/prompt-editor';
import { QueryVariable } from '../components/query-variable';
import { useBuildLogicalOptions } from './use-build-logical-options';
@@ -57,6 +60,12 @@ function RadioButton({ value, onChange }: RadioButtonProps) {
);
}
+const EmptyFields = [
+ VariableAssignerLogicalOperator.Clear,
+ VariableAssignerLogicalArrayOperator.RemoveFirst,
+ VariableAssignerLogicalArrayOperator.RemoveLast,
+];
+
export function DynamicVariables({
name,
label,
@@ -67,6 +76,7 @@ export function DynamicVariables({
}: SelectKeysProps) {
const form = useFormContext();
const { getType } = useGetVariableLabelOrTypeByValue();
+ const isDarkTheme = useIsDarkTheme();
const { fields, remove, append } = useFieldArray({
name: name,
@@ -86,28 +96,55 @@ export function DynamicVariables({
const renderParameter = useCallback(
(keyFieldName: string, operatorFieldName: string) => {
const logicalOperator = form.getValues(operatorFieldName);
+ const type = getVariableType(keyFieldName);
- if (logicalOperator === VariableAssignerLogicalOperator.Clear) {
+ if (EmptyFields.includes(logicalOperator)) {
return null;
} else if (
- logicalOperator === VariableAssignerLogicalOperator.Overwrite
+ logicalOperator === VariableAssignerLogicalOperator.Overwrite ||
+ VariableAssignerLogicalArrayOperator.Extend === logicalOperator
) {
- return ;
+ return ;
} else if (logicalOperator === VariableAssignerLogicalOperator.Set) {
- const type = getVariableType(keyFieldName);
-
if (type === JsonSchemaDataType.Boolean) {
return ;
}
+
+ if (type === JsonSchemaDataType.Number) {
+ return ;
+ }
+
+ if (type === JsonSchemaDataType.Object) {
+ return (
+
+ );
+ }
+
+ if (type === JsonSchemaDataType.String) {
+ return ;
+ }
} else if (
Object.values(VariableAssignerLogicalNumberOperator).some(
(x) => logicalOperator === x,
)
) {
return ;
+ } else if (
+ logicalOperator === VariableAssignerLogicalArrayOperator.Append
+ ) {
+ const subType = type.match(/<([^>]+)>/).at(1);
+ return ;
}
},
- [form, getVariableType],
+ [form, getVariableType, isDarkTheme],
);
const handleVariableChange = useCallback(
@@ -115,12 +152,23 @@ export function DynamicVariables({
form.setValue(
operatorFieldAlias,
VariableAssignerLogicalOperator.Overwrite,
+ { shouldDirty: true, shouldValidate: true },
);
form.setValue(valueFieldAlias, undefined);
},
[form],
);
+ const handleOperatorChange = useCallback(
+ (valueFieldAlias: string) => {
+ form.setValue(valueFieldAlias, undefined, {
+ shouldDirty: true,
+ shouldValidate: true,
+ });
+ },
+ [form],
+ );
+
return (
-
+ {({ onChange, value }) => (
+ {
+ handleOperatorChange(valueFieldAlias);
+ onChange(val);
+ }}
+ options={buildLogicalOptions(
+ getVariableType(keyFieldAlias),
+ )}
+ >
+ )}