ChatGPT/FastGPT
1
0
Fork 0
mirror of https://github.com/labring/FastGPT.git synced 2025-07-24 13:53:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: workflow input node add selectMulti; MultipleSelect component (#4527)

Browse Source 
* feat: workflow input node add selectMulti; MultipleSelect component add disabled state (#4440)

* perf: input form support multiple select

---------

Co-authored-by: mmagi <magizhang@qq.com>
This commit is contained in:
Archer
2025-04-14 14:39:35 +08:00
committed by GitHub
parent 16a22bc76a
commit 88ed019717
10 changed files with 128 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
projects/app/src/components/core/chat/components/Interactive/InteractiveComponents.tsx
View File

@@ -14,6 +14,7 @@ import {
UserSelectInteractive,
UserSelectOptionItemType
} from '@fastgpt/global/core/workflow/template/system/interactive/type';
import MultipleSelect from '@fastgpt/web/components/common/MySelect/MultipleSelect';
const DescriptionBox = React.memo(function DescriptionBox({
description
@@ -173,6 +174,30 @@ export const FormInputComponent = React.memo(function FormInputComponent({
}}
/>
);
case FlowNodeInputTypeEnum.multipleSelect:
return (
<Controller
key={label}
control={control}
name={label}
rules={{ required: required }}
render={({ field: { ref, value } }) => {
if (!list) return <></>;
return (
<MultipleSelect<string>
width={'100%'}
bg={'white'}
py={2}
list={list}
value={value}
isDisabled={submitted}
onSelect={(e) => setValue(label, e)}
isSelectAll={value.length === list.length}
/>
);
}}
/>
);
default:
return null;
}

6
projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/nodes/NodeFormInput/InputFormEditModal.tsx
View File

@@ -64,6 +64,12 @@ const InputFormEditModal = ({
label: t('common:core.workflow.inputType.select'),
value: FlowNodeInputTypeEnum.select,
defaultValueType: WorkflowIOValueTypeEnum.string
},
{
icon: 'core/workflow/inputType/option',
label: t('workflow:input_type_multiple_select'),
value: FlowNodeInputTypeEnum.multipleSelect,
defaultValueType: WorkflowIOValueTypeEnum.arrayString
}
];

28
projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/nodes/NodePluginIO/InputTypeConfig.tsx
View File

@@ -144,6 +144,7 @@ const InputTypeConfig = ({
FlowNodeInputTypeEnum.numberInput,
FlowNodeInputTypeEnum.switch,
FlowNodeInputTypeEnum.select,
FlowNodeInputTypeEnum.multipleSelect,
VariableInputEnum.custom
];
@@ -157,7 +158,8 @@ const InputTypeConfig = ({
FlowNodeInputTypeEnum.input,
FlowNodeInputTypeEnum.numberInput,
FlowNodeInputTypeEnum.switch,
FlowNodeInputTypeEnum.select
FlowNodeInputTypeEnum.select,
FlowNodeInputTypeEnum.multipleSelect
];
return type === 'plugin' && list.includes(inputType as FlowNodeInputTypeEnum);
}, [inputType, type]);
@@ -363,6 +365,27 @@ const InputTypeConfig = ({
w={'200px'}
/>
)}
{inputType === FlowNodeInputTypeEnum.multipleSelect && (
<MultipleSelect<string>
flex={'1 0 0'}
itemWrap={true}
bg={'myGray.50'}
list={listValue
.filter((item: any) => item.label !== '')
.map((item: any) => ({
label: item.label,
value: item.value
}))}
placeholder={t('workflow:select_default_option')}
value={defaultValue || []}
onSelect={(val) => setValue('defaultValue', val)}
isSelectAll={
defaultValue &&
defaultValue.length ===
listValue.filter((item: any) => item.label !== '').length
}
/>
)}
</Flex>
</Flex>
)}
@@ -390,7 +413,8 @@ const InputTypeConfig = ({
</>
)}
{inputType === FlowNodeInputTypeEnum.select && (
{(inputType === FlowNodeInputTypeEnum.select ||
inputType == FlowNodeInputTypeEnum.multipleSelect) && (
<>
<DndDrag<{ id: string; value: string }>
onDragEndCb={(list) => {

3
projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/nodes/render/RenderInput/index.tsx
View File

@@ -25,6 +25,9 @@ const RenderList: Record<
[FlowNodeInputTypeEnum.select]: {
Component: dynamic(() => import('./templates/Select'))
},
[FlowNodeInputTypeEnum.multipleSelect]: {
Component: dynamic(() => import('./templates/SelectMulti'))
},
[FlowNodeInputTypeEnum.numberInput]: {
Component: dynamic(() => import('./templates/NumberInput'))
},

43
projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/nodes/render/RenderInput/templates/SelectMulti.tsx Normal file
View File

@@ -0,0 +1,43 @@
import MultipleSelect from '@fastgpt/web/components/common/MySelect/MultipleSelect';
import { RenderInputProps } from '../type';
import { WorkflowContext } from '@/pageComponents/app/detail/WorkflowComponents/context';
import { useContextSelector } from 'use-context-selector';
import React from 'react';
const SelectMultiRender = ({ item, nodeId }: RenderInputProps) => {
const onChangeNode = useContextSelector(WorkflowContext, (v) => v.onChangeNode);
return (
<MultipleSelect<string>
width={'100%'}
value={item.value}
list={item.list || []}
onSelect={(e) =>
onChangeNode({
nodeId,
type: 'updateInput',
key: item.key,
value: {
...item,
value: e
}
})
}
isSelectAll={item.value.length === item?.list?.length}
setIsSelectAll={(all) => {
if (all) {
onChangeNode({
nodeId,
type: 'updateInput',
key: item.key,
value: {
...item,
value: item?.list?.map((item) => item.value)
}
});
}
}}
/>
);
};
export default React.memo(SelectMultiRender);