diff --git a/web/apps/web/src/components/workflow/node-form/index.tsx b/web/apps/web/src/components/workflow/node-form/index.tsx index 52ea1b5f..85120a00 100644 --- a/web/apps/web/src/components/workflow/node-form/index.tsx +++ b/web/apps/web/src/components/workflow/node-form/index.tsx @@ -44,7 +44,7 @@ interface NodeFormProps { loading?: boolean; modeMap?: Record; onModeChange?: (name: string, mode: TFieldMode) => void; - onStatusChange?: (status?: string) => void; + onStatusChange?: (status: { [key: string]: string }) => void; } const NodeForm = forwardRef( diff --git a/web/apps/web/src/components/workflow/nodes/widget-node/index.tsx b/web/apps/web/src/components/workflow/nodes/widget-node/index.tsx index 5ebf2984..e59df964 100644 --- a/web/apps/web/src/components/workflow/nodes/widget-node/index.tsx +++ b/web/apps/web/src/components/workflow/nodes/widget-node/index.tsx @@ -6,7 +6,13 @@ import { import { TValues, TFieldMode } from '@shellagent/form-engine'; import { FormRef } from '@shellagent/ui'; import { useKeyPress } from 'ahooks'; -import React, { useCallback, useRef, useEffect, useState } from 'react'; +import React, { + useCallback, + useRef, + useEffect, + useState, + useMemo, +} from 'react'; import { useShallow } from 'zustand/react/shallow'; import { useWorkflowState } from '@/stores/workflow/use-workflow-state'; @@ -21,6 +27,7 @@ import { useDuplicateState } from './hook/use-duplicate-state'; import { EventType, useEventEmitter } from '../../emitter'; import NodeCard from '../../node-card'; import NodeForm from '../../node-form'; +import { some } from 'lodash-es'; const WidgetNode: React.FC> = ({ id, @@ -29,6 +36,7 @@ const WidgetNode: React.FC> = ({ }) => { const formRef = useRef(null); const nodeRef = useRef(null); + const statusRef = useRef({}); const { duplicateState } = useDuplicateState(id); const { onDelNode } = useReactFlowStore(state => ({ onDelNode: state.onDelNode, @@ -146,15 +154,16 @@ const WidgetNode: React.FC> = ({ } }); - const onStatusChange = (status?: string) => { - setHasError(status === 'error'); + const onStatusChange = (obj: { [key: string]: string }) => { + statusRef.current = { ...statusRef.current, ...obj }; + setHasError(some(statusRef.current, value => value === 'missOption')); }; return ( value === 'missOption')} {...data}> = props => { } const missOption = xComponentProps?.options?.length && + newField[valuePropsName] && !xComponentProps?.options?.find( (item: { value: string }) => item.value === (newField[valuePropsName] as unknown as string), ); - if (missOption) { - onStatusChange?.('error'); + if (missOption !== undefined) { + onStatusChange?.({ [name]: missOption ? 'missOption' : '' }); } const FormItemWithDesc = (!checked && xSwithable) || xHiddenControl ? null : ( diff --git a/web/packages/form-engine/src/components/provider/index.tsx b/web/packages/form-engine/src/components/provider/index.tsx index c6efc7fa..b04194ce 100644 --- a/web/packages/form-engine/src/components/provider/index.tsx +++ b/web/packages/form-engine/src/components/provider/index.tsx @@ -26,7 +26,7 @@ const FormEngineContext = createContext<{ reorder: (path: TPath, startIndex: number, endIndex: number) => void; modeMap?: Record; onModeChange?: (name: string, mode: TFieldMode) => void; - onStatusChange?: (status?: string) => void; + onStatusChange?: (obj: { [key: string]: string }) => void; }>({ components: {}, fields: {}, @@ -43,7 +43,7 @@ export interface IFormEngineProviderProps { layout?: 'Horizontal' | 'Vertical'; modeMap?: Record; onModeChange?: (name: string, mode: TFieldMode) => void; - onStatusChange?: (status?: string) => void; + onStatusChange?: (obj: { [key: string]: string }) => void; children: React.ReactNode | React.ReactNode[]; } diff --git a/web/packages/form-engine/src/index.tsx b/web/packages/form-engine/src/index.tsx index 18531fb1..ce0751fe 100644 --- a/web/packages/form-engine/src/index.tsx +++ b/web/packages/form-engine/src/index.tsx @@ -37,7 +37,7 @@ export interface IFormEngineProps { children?: React.ReactNode; modeMap?: Record; onModeChange?: (name: string, mode: TFieldMode) => void; - onStatusChange?: (status?: string) => void; + onStatusChange?: (obj: { [key: string]: string }) => void; } const FormEngine = forwardRef((props, ref) => {