refactor: 更新类型定义,使用类型别名简化代码结构
This commit is contained in:
@@ -11,15 +11,15 @@ import MyNumberInput from '@fastgpt/web/components/common/Input/NumberInput';
|
|||||||
import { FlowNodeInputTypeEnum } from '@fastgpt/global/core/workflow/node/constant';
|
import { FlowNodeInputTypeEnum } from '@fastgpt/global/core/workflow/node/constant';
|
||||||
import MyIcon from '@fastgpt/web/components/common/Icon';
|
import MyIcon from '@fastgpt/web/components/common/Icon';
|
||||||
|
|
||||||
type IconName = 'core/workflow/debugNext' | 'common/loading' | 'core/chat/think';
|
type IconNameType = 'core/workflow/debugNext' | 'common/loading' | 'core/chat/think';
|
||||||
|
|
||||||
export type SelectOption = {
|
export type SelectOptionType = {
|
||||||
key: string;
|
key: string;
|
||||||
value: string;
|
value: string;
|
||||||
};
|
};
|
||||||
|
|
||||||
export type SelectOptionsComponentProps = {
|
export type SelectOptionsComponentPropsType = {
|
||||||
options: SelectOption[];
|
options: SelectOptionType[];
|
||||||
description?: string;
|
description?: string;
|
||||||
selectedValue?: string;
|
selectedValue?: string;
|
||||||
onSelectOption: (value: string) => void;
|
onSelectOption: (value: string) => void;
|
||||||
@@ -34,7 +34,7 @@ export const SelectOptionsComponent = React.memo(function SelectOptionsComponent
|
|||||||
onSelectOption,
|
onSelectOption,
|
||||||
isDisabled = false,
|
isDisabled = false,
|
||||||
variant = 'outline'
|
variant = 'outline'
|
||||||
}: SelectOptionsComponentProps) {
|
}: SelectOptionsComponentPropsType) {
|
||||||
return (
|
return (
|
||||||
<Box>
|
<Box>
|
||||||
{description && (
|
{description && (
|
||||||
@@ -52,7 +52,7 @@ export const SelectOptionsComponent = React.memo(function SelectOptionsComponent
|
|||||||
</Box>
|
</Box>
|
||||||
)}
|
)}
|
||||||
<Flex flexDirection={'column'} gap={3} maxW={'400px'} mx="auto">
|
<Flex flexDirection={'column'} gap={3} maxW={'400px'} mx="auto">
|
||||||
{options.map((option: SelectOption) => {
|
{options.map((option: SelectOptionType) => {
|
||||||
const selected = option.value === selectedValue;
|
const selected = option.value === selectedValue;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -95,7 +95,7 @@ export const SelectOptionsComponent = React.memo(function SelectOptionsComponent
|
|||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
export type FormItem = {
|
export type FormItemType = {
|
||||||
label: string;
|
label: string;
|
||||||
key?: string;
|
key?: string;
|
||||||
type: FlowNodeInputTypeEnum;
|
type: FlowNodeInputTypeEnum;
|
||||||
@@ -113,14 +113,14 @@ export type FormItem = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export type FormInputComponentProps = {
|
export type FormInputComponentProps = {
|
||||||
inputForm: FormItem[];
|
inputForm: FormItemType[];
|
||||||
description?: string;
|
description?: string;
|
||||||
onSubmit?: (data: Record<string, any>) => void;
|
onSubmit?: (data: Record<string, any>) => void;
|
||||||
isDisabled?: boolean;
|
isDisabled?: boolean;
|
||||||
defaultValues?: Record<string, any>;
|
defaultValues?: Record<string, any>;
|
||||||
submitButtonText?: 'common:Submit' | string; // 使用联合类型指定特定的i18n键名
|
submitButtonText?: 'common:Submit' | string; // 使用联合类型指定特定的i18n键名
|
||||||
showSubmitButton?: boolean;
|
showSubmitButton?: boolean;
|
||||||
submitButtonIcon?: IconName;
|
submitButtonIcon?: IconNameType;
|
||||||
isCompact?: boolean;
|
isCompact?: boolean;
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -174,7 +174,7 @@ export const FormInputComponent = React.memo(function FormInputComponent({
|
|||||||
borderRadius="md"
|
borderRadius="md"
|
||||||
>
|
>
|
||||||
<Flex flexDirection={'column'} gap={5} w={'100%'}>
|
<Flex flexDirection={'column'} gap={5} w={'100%'}>
|
||||||
{inputForm.map((input: FormItem) => (
|
{inputForm.map((input: FormItemType) => (
|
||||||
<Box key={input.label} mb={2}>
|
<Box key={input.label} mb={2}>
|
||||||
<Flex mb={2} alignItems={'center'}>
|
<Flex mb={2} alignItems={'center'}>
|
||||||
<FormLabel required={input.required} mb={0} fontWeight="medium" color="gray.700">
|
<FormLabel required={input.required} mb={0} fontWeight="medium" color="gray.700">
|
||||||
@@ -308,7 +308,7 @@ export const FormInputComponent = React.memo(function FormInputComponent({
|
|||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
export type UseFormHandlerReturn<T extends FieldValues = Record<string, any>> = {
|
export type UseFormHandlerReturnType<T extends FieldValues = Record<string, any>> = {
|
||||||
register: UseFormReturn<T>['register'];
|
register: UseFormReturn<T>['register'];
|
||||||
setValue: UseFormReturn<T>['setValue'];
|
setValue: UseFormReturn<T>['setValue'];
|
||||||
handleSubmit: UseFormReturn<T>['handleSubmit'];
|
handleSubmit: UseFormReturn<T>['handleSubmit'];
|
||||||
@@ -321,7 +321,7 @@ export type UseFormHandlerReturn<T extends FieldValues = Record<string, any>> =
|
|||||||
export const useFormHandler = <T extends FieldValues = Record<string, any>>(
|
export const useFormHandler = <T extends FieldValues = Record<string, any>>(
|
||||||
formConfig: UseFormProps<T> = {},
|
formConfig: UseFormProps<T> = {},
|
||||||
onSubmitCallback?: (data: T) => void
|
onSubmitCallback?: (data: T) => void
|
||||||
): UseFormHandlerReturn<T> => {
|
): UseFormHandlerReturnType<T> => {
|
||||||
const methods = useForm<T>(formConfig);
|
const methods = useForm<T>(formConfig);
|
||||||
const { handleSubmit } = methods;
|
const { handleSubmit } = methods;
|
||||||
|
|
||||||
|
|||||||
@@ -4,15 +4,15 @@ import { useTranslation } from 'next-i18next';
|
|||||||
import { useContextSelector } from 'use-context-selector';
|
import { useContextSelector } from 'use-context-selector';
|
||||||
import { WorkflowContext } from '@/pageComponents/app/detail/WorkflowComponents/context';
|
import { WorkflowContext } from '@/pageComponents/app/detail/WorkflowComponents/context';
|
||||||
import { ChatItemValueTypeEnum, ChatRoleEnum } from '@fastgpt/global/core/chat/constants';
|
import { ChatItemValueTypeEnum, ChatRoleEnum } from '@fastgpt/global/core/chat/constants';
|
||||||
import { ChatItemType, UserChatItemValueItemType } from '@fastgpt/global/core/chat/type';
|
import type { ChatItemType, UserChatItemValueItemType } from '@fastgpt/global/core/chat/type';
|
||||||
import { initWorkflowEdgeStatus } from '@fastgpt/global/core/workflow/runtime/utils';
|
import { initWorkflowEdgeStatus } from '@fastgpt/global/core/workflow/runtime/utils';
|
||||||
import {
|
import type {
|
||||||
UserInputInteractive,
|
UserInputInteractive,
|
||||||
UserSelectInteractive
|
UserSelectInteractive
|
||||||
} from '@fastgpt/global/core/workflow/template/system/interactive/type';
|
} from '@fastgpt/global/core/workflow/template/system/interactive/type';
|
||||||
import {
|
import {
|
||||||
type SelectOption,
|
type SelectOptionType,
|
||||||
type FormItem,
|
type FormItemType,
|
||||||
FormInputComponent,
|
FormInputComponent,
|
||||||
SelectOptionsComponent
|
SelectOptionsComponent
|
||||||
} from '@/components/core/chat/components/Form/FormComponents';
|
} from '@/components/core/chat/components/Form/FormComponents';
|
||||||
@@ -112,7 +112,7 @@ export const RenderUserSelectInteractive = React.memo(function RenderInteractive
|
|||||||
return (
|
return (
|
||||||
<Box px={4} py={3}>
|
<Box px={4} py={3}>
|
||||||
<SelectOptionsComponent
|
<SelectOptionsComponent
|
||||||
options={(interactive.params.userSelectOptions || []) as SelectOption[]}
|
options={(interactive.params.userSelectOptions || []) as SelectOptionType[]}
|
||||||
description={interactive.params.description}
|
description={interactive.params.description}
|
||||||
selectedValue={interactive.params.userSelectedVal}
|
selectedValue={interactive.params.userSelectedVal}
|
||||||
onSelectOption={handleSelectAndNext}
|
onSelectOption={handleSelectAndNext}
|
||||||
@@ -171,7 +171,7 @@ export const RenderUserFormInteractive = React.memo(function RenderFormInput({
|
|||||||
return (
|
return (
|
||||||
<Box px={4} py={4} bg="white" borderRadius="md">
|
<Box px={4} py={4} bg="white" borderRadius="md">
|
||||||
<FormInputComponent
|
<FormInputComponent
|
||||||
inputForm={(interactive.params.inputForm || []) as FormItem[]}
|
inputForm={(interactive.params.inputForm || []) as FormItemType[]}
|
||||||
description={interactive.params.description}
|
description={interactive.params.description}
|
||||||
onSubmit={handleFormSubmit}
|
onSubmit={handleFormSubmit}
|
||||||
isDisabled={isSubmitted || interactive.params.submitted}
|
isDisabled={isSubmitted || interactive.params.submitted}
|
||||||
|
|||||||
Reference in New Issue
Block a user