diff --git a/web/app/components/app/configuration/config-var/config-modal/index.tsx b/web/app/components/app/configuration/config-var/config-modal/index.tsx index c179e3f886..50d6e9c6f6 100644 --- a/web/app/components/app/configuration/config-var/config-modal/index.tsx +++ b/web/app/components/app/configuration/config-var/config-modal/index.tsx @@ -97,10 +97,10 @@ const ConfigModal: FC = ({
- {/* TODO handlePayloadChange(string) */} handlePayloadChange('type')(InputVarType.textInput)} /> handlePayloadChange('type')(InputVarType.paragraph)} /> handlePayloadChange('type')(InputVarType.select)} /> + handlePayloadChange('type')(InputVarType.number)} />
diff --git a/web/app/components/app/configuration/config-var/index.tsx b/web/app/components/app/configuration/config-var/index.tsx index 3654bbe3e8..00933a3919 100644 --- a/web/app/components/app/configuration/config-var/index.tsx +++ b/web/app/components/app/configuration/config-var/index.tsx @@ -262,7 +262,7 @@ const ConfigVar: FC = ({ promptVariables, readonly, onPromptVar const handleConfig = ({ key, type, index, name, config, icon, icon_background }: ExternalDataToolParams) => { // setCurrKey(key) setCurrIndex(index) - if (type !== 'string' && type !== 'paragraph' && type !== 'select') { + if (type !== 'string' && type !== 'paragraph' && type !== 'select' && type !== 'number') { handleOpenExternalDataToolModal({ key, type, index, name, config, icon, icon_background }, promptVariables) return } diff --git a/web/app/components/app/configuration/config-var/input-type-icon.tsx b/web/app/components/app/configuration/config-var/input-type-icon.tsx index ab5f7f805e..edd2dc6967 100644 --- a/web/app/components/app/configuration/config-var/input-type-icon.tsx +++ b/web/app/components/app/configuration/config-var/input-type-icon.tsx @@ -1,9 +1,9 @@ 'use client' import React from 'react' import type { FC } from 'react' -import { Paragraph, TypeSquare } from '@/app/components/base/icons/src/vender/solid/editor' -import { CheckDone01 } from '@/app/components/base/icons/src/vender/solid/general' import { ApiConnection } from '@/app/components/base/icons/src/vender/solid/development' +import InputVarTypeIcon from '@/app/components/workflow/nodes/_base/components/input-var-type-icon' +import { InputVarType } from '@/app/components/workflow/types' export type IInputTypeIconProps = { type: 'string' | 'select' @@ -14,13 +14,16 @@ const IconMap = (type: IInputTypeIconProps['type'], className: string) => { const classNames = `w-3.5 h-3.5 ${className}` const icons = { string: ( - + ), paragraph: ( - + ), select: ( - + + ), + number: ( + ), api: ( diff --git a/web/app/components/app/configuration/config-var/select-type-item/index.tsx b/web/app/components/app/configuration/config-var/select-type-item/index.tsx index 1ecd9bd99a..e853bdf0c0 100644 --- a/web/app/components/app/configuration/config-var/select-type-item/index.tsx +++ b/web/app/components/app/configuration/config-var/select-type-item/index.tsx @@ -4,70 +4,14 @@ import React from 'react' import { useTranslation } from 'react-i18next' import cn from 'classnames' import s from './style.module.css' -import { InputVarType } from '@/app/components/workflow/types' - +import type { InputVarType } from '@/app/components/workflow/types' +import InputVarTypeIcon from '@/app/components/workflow/nodes/_base/components/input-var-type-icon' export type ISelectTypeItemProps = { type: InputVarType selected: boolean onClick: () => void } -const Icon = ({ type, selected }: Partial) => { - switch (type) { - case InputVarType.select: - return selected - ? ( - - - - - ) - : ( - - - - - ) - case InputVarType.paragraph: - return selected - ? ( - - - - - - - - - - - ) - : ( - - - - - - - - - - - ) - case InputVarType.textInput: - default: - return selected - ? ( - - - - ) - : ( - - ) - } -} - const SelectTypeItem: FC = ({ type, selected, @@ -82,7 +26,7 @@ const SelectTypeItem: FC = ({ onClick={onClick} >
- +
{typeName} diff --git a/web/app/components/app/configuration/config-var/select-type-item/style.module.css b/web/app/components/app/configuration/config-var/select-type-item/style.module.css index 95856ae77b..8ff716d58b 100644 --- a/web/app/components/app/configuration/config-var/select-type-item/style.module.css +++ b/web/app/components/app/configuration/config-var/select-type-item/style.module.css @@ -19,6 +19,7 @@ } .item.selected { + color: #155EEF; border-color: #528BFF; background-color: #F5F8FF; box-shadow: 0px 1px 3px rgba(16, 24, 40, 0.1), 0px 1px 2px rgba(16, 24, 40, 0.06); @@ -30,7 +31,7 @@ font-weight: 500; } -.item.selected.text { +.item.selected .text { color: #155EEF; } diff --git a/web/app/components/app/configuration/config-var/select-var-type.tsx b/web/app/components/app/configuration/config-var/select-var-type.tsx index 94e034b3c4..ad0c6fbd01 100644 --- a/web/app/components/app/configuration/config-var/select-var-type.tsx +++ b/web/app/components/app/configuration/config-var/select-var-type.tsx @@ -9,9 +9,10 @@ import { PortalToFollowElemContent, PortalToFollowElemTrigger, } from '@/app/components/base/portal-to-follow-elem' -import { Paragraph, TypeSquare } from '@/app/components/base/icons/src/vender/solid/editor' -import { CheckDone01 } from '@/app/components/base/icons/src/vender/solid/general' import { ApiConnection } from '@/app/components/base/icons/src/vender/solid/development' +import InputVarTypeIcon from '@/app/components/workflow/nodes/_base/components/input-var-type-icon' +import { InputVarType } from '@/app/components/workflow/types' + type Props = { onChange: (value: string) => void } @@ -19,17 +20,18 @@ type Props = { type ItemProps = { text: string value: string - Icon: any + Icon?: any + type?: InputVarType onClick: (value: string) => void } -const SelectItem: FC = ({ text, value, Icon, onClick }) => { +const SelectItem: FC = ({ text, type, value, Icon, onClick }) => { return (
onClick(value)} > - + {Icon ? : }
{text}
) @@ -60,9 +62,10 @@ const SelectVarType: FC = ({
- - - + + + +
diff --git a/web/app/components/app/configuration/prompt-value-panel/index.tsx b/web/app/components/app/configuration/prompt-value-panel/index.tsx index ee2dacaac4..be063d7419 100644 --- a/web/app/components/app/configuration/prompt-value-panel/index.tsx +++ b/web/app/components/app/configuration/prompt-value-panel/index.tsx @@ -149,7 +149,15 @@ const PromptValuePanel: FC = ({ onChange={(e) => { handleInputValueChange(key, e.target.value) }} /> )} - + {type === 'number' && ( + { handleInputValueChange(key, e.target.value) }} + /> + )}
))}
diff --git a/web/app/components/share/chat/welcome/index.tsx b/web/app/components/share/chat/welcome/index.tsx index 01689a0574..6c431362dc 100644 --- a/web/app/components/share/chat/welcome/index.tsx +++ b/web/app/components/share/chat/welcome/index.tsx @@ -132,6 +132,15 @@ const Welcome: FC = ({ onChange={(e) => { setInputs({ ...inputs, [item.key]: e.target.value }) }} /> )} + {item.type === 'number' && ( + { setInputs({ ...inputs, [item.key]: e.target.value }) }} + className={'w-full flex-grow py-2 pl-3 pr-3 box-border rounded-lg bg-gray-50'} + /> + )} ))} diff --git a/web/app/components/share/chatbot/welcome/index.tsx b/web/app/components/share/chatbot/welcome/index.tsx index eaee90c2a3..0cf1298873 100644 --- a/web/app/components/share/chatbot/welcome/index.tsx +++ b/web/app/components/share/chatbot/welcome/index.tsx @@ -133,6 +133,15 @@ const Welcome: FC = ({ onChange={(e) => { setInputs({ ...inputs, [item.key]: e.target.value }) }} /> )} + {item.type === 'number' && ( + { setInputs({ ...inputs, [item.key]: e.target.value }) }} + className={'w-full flex-grow py-2 pl-3 pr-3 box-border rounded-lg bg-gray-50'} + /> + )} ))} diff --git a/web/app/components/share/text-generation/run-once/index.tsx b/web/app/components/share/text-generation/run-once/index.tsx index 77eb63a8ee..dfe0878066 100644 --- a/web/app/components/share/text-generation/run-once/index.tsx +++ b/web/app/components/share/text-generation/run-once/index.tsx @@ -76,6 +76,15 @@ const RunOnce: FC = ({ onChange={(e) => { onInputsChange({ ...inputs, [item.key]: e.target.value }) }} /> )} + {item.type === 'number' && ( + { onInputsChange({ ...inputs, [item.key]: e.target.value }) }} + /> + )} ))} diff --git a/web/i18n/lang/app-debug.en.ts b/web/i18n/lang/app-debug.en.ts index adcebced3b..eef5276fdd 100644 --- a/web/i18n/lang/app-debug.en.ts +++ b/web/i18n/lang/app-debug.en.ts @@ -274,6 +274,7 @@ const translation = { 'text-input': 'Short Text', 'paragraph': 'Paragraph', 'select': 'Select', + 'number': 'Number', 'notSet': 'Not set, try typing {{input}} in the prefix prompt', 'stringTitle': 'Form text box options', 'maxLength': 'Max length', diff --git a/web/i18n/lang/app-debug.zh.ts b/web/i18n/lang/app-debug.zh.ts index 8e134f2fc0..9dc900ddfe 100644 --- a/web/i18n/lang/app-debug.zh.ts +++ b/web/i18n/lang/app-debug.zh.ts @@ -270,6 +270,7 @@ const translation = { 'text-input': '文本', 'paragraph': '段落', 'select': '下拉选项', + 'number': '数字', 'notSet': '未设置，在 Prompt 中输入 {{input}} 试试', 'stringTitle': '文本框设置', 'maxLength': '最大长度', diff --git a/web/utils/model-config.ts b/web/utils/model-config.ts index 66b8babb21..9f6f11cfed 100644 --- a/web/utils/model-config.ts +++ b/web/utils/model-config.ts @@ -33,6 +33,15 @@ export const userInputsFormToPromptVariables = (useInputs: UserInputFormItem[] | is_context_var, }) } + else if (type === 'number') { + promptVariables.push({ + key: content.variable, + name: content.label, + required: content.required, + type, + options: [], + }) + } else if (type === 'select') { promptVariables.push({ key: content.variable, @@ -79,6 +88,16 @@ export const promptVariablesToUserInputsForm = (promptVariables: PromptVariable[ }, } as any) } + if (item.type === 'number') { + userInputs.push({ + number: { + label: item.name, + variable: item.key, + required: item.required !== false, // default true + default: '', + }, + } as any) + } else if (item.type === 'select') { userInputs.push({ select: {