fix(web): 修复节点入参不更新

This commit is contained in:
2025-07-16 22:54:48 +08:00
parent a3c2250285
commit 72a9d58f4c
9 changed files with 18 additions and 20 deletions

View File

@@ -88,7 +88,7 @@ type AmisNodeProps = {
nodeProps: NodeProps nodeProps: NodeProps
extraNodeDescription?: JSX.Element extraNodeDescription?: JSX.Element
handler: JSX.Element handler: JSX.Element
columnSchema?: Schema[] columnSchema?: () => Schema[]
resize?: { minWidth: number, minHeight: number } resize?: { minWidth: number, minHeight: number }
} }
@@ -183,7 +183,7 @@ const AmisNode: (props: AmisNodeProps) => JSX.Element = ({
{ {
type: 'divider', type: 'divider',
}, },
...(columnSchema ?? []), ...(columnSchema?.() ?? []),
{ {
type: 'wrapper', type: 'wrapper',
size: 'none', size: 'none',

View File

@@ -1,6 +1,6 @@
import type {NodeProps} from '@xyflow/react' import type {NodeProps} from '@xyflow/react'
import {Tag} from 'antd' import {Tag} from 'antd'
import React, {useMemo} from 'react' import React, {useCallback, useMemo} from 'react'
import {useContextStore} from '../store/ContextStore.ts' import {useContextStore} from '../store/ContextStore.ts'
import {useDataStore} from '../store/DataStore.ts' import {useDataStore} from '../store/DataStore.ts'
import {useFlowStore} from '../store/FlowStore.ts' import {useFlowStore} from '../store/FlowStore.ts'
@@ -19,7 +19,7 @@ const CodeNode = (props: NodeProps) => {
const nodeData = getDataById(props.id) const nodeData = getDataById(props.id)
const columnsSchema = useMemo(() => [ const columnsSchema = useCallback(() => [
...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()), ...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()),
{ {
type: 'divider', type: 'divider',

View File

@@ -1,5 +1,5 @@
import type {NodeProps} from '@xyflow/react' import type {NodeProps} from '@xyflow/react'
import React, {useEffect, useMemo} from 'react' import React, {useCallback, useEffect} from 'react'
import {commonInfo} from '../../../util/amis.tsx' import {commonInfo} from '../../../util/amis.tsx'
import {useContextStore} from '../store/ContextStore.ts' import {useContextStore} from '../store/ContextStore.ts'
import {useDataStore} from '../store/DataStore.ts' import {useDataStore} from '../store/DataStore.ts'
@@ -24,7 +24,7 @@ const KnowledgeNode = (props: NodeProps) => {
) )
}, [props.id]) }, [props.id])
const columnsSchema = useMemo(() => [ const columnsSchema = useCallback(() => [
...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()), ...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()),
{ {
type: 'divider', type: 'divider',

View File

@@ -1,6 +1,6 @@
import type {NodeProps} from '@xyflow/react' import type {NodeProps} from '@xyflow/react'
import {Tag} from 'antd' import {Tag} from 'antd'
import React, {useEffect, useMemo} from 'react' import React, {useCallback, useEffect, useMemo} from 'react'
import {useContextStore} from '../store/ContextStore.ts' import {useContextStore} from '../store/ContextStore.ts'
import {useDataStore} from '../store/DataStore.ts' import {useDataStore} from '../store/DataStore.ts'
import {useFlowStore} from '../store/FlowStore.ts' import {useFlowStore} from '../store/FlowStore.ts'
@@ -31,7 +31,7 @@ const LlmNode = (props: NodeProps) => {
) )
}, [props.id]) }, [props.id])
const columnsSchema = useMemo(() => [ const columnsSchema = useCallback(() => [
...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()), ...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()),
{ {
type: 'divider', type: 'divider',

View File

@@ -1,6 +1,6 @@
import {Background, BackgroundVariant, type NodeProps} from '@xyflow/react' import {Background, BackgroundVariant, type NodeProps} from '@xyflow/react'
import {classnames} from 'amis' import {classnames} from 'amis'
import React, {useEffect, useMemo} from 'react' import React, {useCallback, useEffect, useMemo} from 'react'
import AddNodeButton from '../component/AddNodeButton.tsx' import AddNodeButton from '../component/AddNodeButton.tsx'
import {useDataStore} from '../store/DataStore.ts' import {useDataStore} from '../store/DataStore.ts'
import {flowBackgroundColor, flowDotColor} from '../types.ts' import {flowBackgroundColor, flowDotColor} from '../types.ts'
@@ -22,7 +22,7 @@ const LoopNode = (props: NodeProps) => {
) )
}, [props.id]) }, [props.id])
const columnsSchema = useMemo(() => [ const columnsSchema = useCallback(() => [
{ {
type: 'switch', type: 'switch',
name: 'failFast', name: 'failFast',

View File

@@ -1,5 +1,5 @@
import type {NodeProps} from '@xyflow/react' import type {NodeProps} from '@xyflow/react'
import React, {useMemo} from 'react' import React, {useCallback} from 'react'
import {generateAllIncomerOutputVariablesFormOptions} from '../Helper.tsx' import {generateAllIncomerOutputVariablesFormOptions} from '../Helper.tsx'
import {useContextStore} from '../store/ContextStore.ts' import {useContextStore} from '../store/ContextStore.ts'
import {useDataStore} from '../store/DataStore.ts' import {useDataStore} from '../store/DataStore.ts'
@@ -11,7 +11,7 @@ const OutputNode = (props: NodeProps) => {
const {getData} = useDataStore() const {getData} = useDataStore()
const {getInputSchema} = useContextStore() const {getInputSchema} = useContextStore()
const columnsSchema = useMemo( const columnsSchema = useCallback(
() => [ () => [
{ {
type: 'select', type: 'select',
@@ -27,9 +27,7 @@ const OutputNode = (props: NodeProps) => {
getData(), getData(),
), ),
}, },
], ], [props.id])
[props.id],
)
return ( return (
<AmisNode <AmisNode

View File

@@ -2,7 +2,7 @@ import {Handle, type NodeProps, Position} from '@xyflow/react'
import type {ConditionValue} from 'amis' import type {ConditionValue} from 'amis'
import {Tag} from 'antd' import {Tag} from 'antd'
import {contain, isEqual} from 'licia' import {contain, isEqual} from 'licia'
import React, {useMemo} from 'react' import React, {useCallback, useMemo} from 'react'
import {generateAllIncomerOutputVariablesConditions} from '../Helper.tsx' import {generateAllIncomerOutputVariablesConditions} from '../Helper.tsx'
import {useContextStore} from '../store/ContextStore.ts' import {useContextStore} from '../store/ContextStore.ts'
import {useDataStore} from '../store/DataStore.ts' import {useDataStore} from '../store/DataStore.ts'
@@ -18,7 +18,7 @@ const SwitchNode = (props: NodeProps) => {
// @ts-ignore // @ts-ignore
const conditions: ConditionValue[] = nodeData?.conditions?.map(c => c.condition) ?? [] const conditions: ConditionValue[] = nodeData?.conditions?.map(c => c.condition) ?? []
const columnsSchema = useMemo(() => [ const columnsSchema = useCallback(() => [
{ {
type: 'combo', type: 'combo',
name: 'conditions', name: 'conditions',

View File

@@ -1,6 +1,6 @@
import type {NodeProps} from '@xyflow/react' import type {NodeProps} from '@xyflow/react'
import {Tag} from 'antd' import {Tag} from 'antd'
import React, {useEffect, useMemo} from 'react' import React, {useCallback, useEffect, useMemo} from 'react'
import {useContextStore} from '../store/ContextStore.ts' import {useContextStore} from '../store/ContextStore.ts'
import {useDataStore} from '../store/DataStore.ts' import {useDataStore} from '../store/DataStore.ts'
import {useFlowStore} from '../store/FlowStore.ts' import {useFlowStore} from '../store/FlowStore.ts'
@@ -33,7 +33,7 @@ const TemplateNode = (props: NodeProps) => {
) )
}, [props.id]) }, [props.id])
const columnsSchema = useMemo( const columnsSchema = useCallback(
() => [ () => [
...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()), ...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()),
{ {

View File

@@ -4,7 +4,7 @@ import type {GraphData} from '../components/flow/types.ts'
function Test() { function Test() {
// language=JSON // language=JSON
const [graphData] = useState<GraphData>(JSON.parse('{"nodes":[{"id":"QxNrkChBWQ","type":"loop-node","position":{"x":890,"y":119},"data":{},"measured":{"width":458,"height":368},"selected":false,"dragging":false,"width":458,"height":368,"resizing":false},{"id":"MzEitlOusl","type":"llm-node","position":{"x":47,"y":135},"data":{},"measured":{"width":256,"height":110},"selected":false,"dragging":false,"extent":"parent","parentId":"QxNrkChBWQ"},{"id":"bivXSpiLaI","type":"code-node","position":{"x":100,"y":188},"data":{},"measured":{"width":256,"height":110},"selected":false,"dragging":false},{"id":"JsUwvjkJCW","type":"switch-node","position":{"x":495,"y":219},"data":{},"measured":{"width":256,"height":162},"selected":false,"dragging":false},{"id":"sRWQqqshAE","type":"llm-node","position":{"x":938,"y":551},"data":{},"measured":{"width":256,"height":110},"selected":false,"dragging":false}],"edges":[{"source":"bivXSpiLaI","sourceHandle":"source","target":"JsUwvjkJCW","id":"xy-edge__bivXSpiLaIsource-JsUwvjkJCW"},{"source":"JsUwvjkJCW","sourceHandle":"736a724a5de4","target":"QxNrkChBWQ","targetHandle":"target","id":"xy-edge__JsUwvjkJCW736a724a5de4-QxNrkChBWQtarget"},{"source":"JsUwvjkJCW","sourceHandle":"d4e42668119c","target":"sRWQqqshAE","targetHandle":"target","id":"xy-edge__JsUwvjkJCWd4e42668119c-sRWQqqshAEtarget"}],"data":{"MzEitlOusl":{"node":{"name":"大模型","description":"使用大模型对话"},"outputs":{"text":{"type":"text"}},"model":"qwen3","systemPrompt":"你是个好人","finished":true},"bivXSpiLaI":{"node":{"name":"代码执行","description":"执行自定义的处理代码"},"outputs":{"text":{"type":"text"},"condition":{"type":"boolean"},"count":{"type":"number"},"person":{"type":"object"},"words":{"type":"array-text"},"people":{"type":"array-object"}},"type":"javascript","content":"console.log(\'hello\')","inputs":{"text":{"variable":"MzEitlOusl.text"}},"finished":true},"QxNrkChBWQ":{"node":{"name":"循环","description":"实现循环执行流程"},"finished":true,"outputs":{"output":{"type":"array-object"}}},"JsUwvjkJCW":{"node":{"name":"分支","description":"根据不同的情况前往不同的分支"},"conditions":[{"condition":{"id":"736a724a5de4","conjunction":"and","children":[{"id":"1db9e7a90aae","left":{"type":"field","field":"bivXSpiLaI.text"},"op":"equal","right":"1"},{"id":"98cc5c39eed4","left":{"type":"field","field":"bivXSpiLaI.condition"},"op":"is_true"},{"id":"1cbccc438a64","left":{"type":"field","field":"bivXSpiLaI.text"},"op":"equal","right":"2"}]}},{"condition":{"id":"406bf6637c64","conjunction":"and","children":[{"id":"ea37e95e6d1b","left":{"type":"field","field":"bivXSpiLaI.text"},"op":"equal","right":"3"}]}},{"condition":{"id":"d4e42668119c","conjunction":"and","children":[{"id":"62618f0083ec","left":{"type":"field","field":"bivXSpiLaI.count"},"op":"equal","right":2}]}}],"finished":true},"sRWQqqshAE":{"node":{"name":"大模型","description":"使用大模型对话"},"outputs":{"text":{"type":"text"}},"model":"deepseek","systemPrompt":"Hello","finished":true}}}')) const [graphData] = useState<GraphData>(JSON.parse('{"nodes":[{"id":"QxNrkChBWQ","type":"loop-node","position":{"x":890,"y":119},"data":{},"measured":{"width":1049,"height":382},"selected":false,"dragging":false,"width":1049,"height":382,"resizing":false},{"id":"MzEitlOusl","type":"llm-node","position":{"x":52.27803164309171,"y":130},"data":{},"measured":{"width":256,"height":108},"selected":false,"dragging":false,"extent":"parent","parentId":"QxNrkChBWQ"},{"id":"bivXSpiLaI","type":"code-node","position":{"x":100,"y":188},"data":{},"measured":{"width":256,"height":108},"selected":false,"dragging":false},{"id":"JsUwvjkJCW","type":"switch-node","position":{"x":495,"y":219},"data":{},"measured":{"width":256,"height":134},"selected":false,"dragging":false},{"id":"sRWQqqshAE","type":"llm-node","position":{"x":938,"y":551},"data":{},"measured":{"width":256,"height":108},"selected":false,"dragging":false},{"id":"bDgwRcxgHo","type":"code-node","position":{"x":397.0305805332712,"y":169.58523732318685},"data":{},"parentId":"QxNrkChBWQ","extent":"parent","measured":{"width":256,"height":108},"selected":false,"dragging":false},{"id":"fzmjIpcUsy","type":"output-node","position":{"x":721.6295265834033,"y":238.19964868337735},"data":{},"parentId":"QxNrkChBWQ","extent":"parent","measured":{"width":256,"height":79},"selected":false,"dragging":false},{"id":"nutuhaTLel","type":"llm-node","position":{"x":2075.444643036393,"y":334.5237261697987},"data":{},"measured":{"width":256,"height":108},"selected":true,"dragging":false}],"edges":[{"source":"bivXSpiLaI","sourceHandle":"source","target":"JsUwvjkJCW","id":"xy-edge__bivXSpiLaIsource-JsUwvjkJCW"},{"source":"JsUwvjkJCW","sourceHandle":"736a724a5de4","target":"QxNrkChBWQ","targetHandle":"target","id":"xy-edge__JsUwvjkJCW736a724a5de4-QxNrkChBWQtarget"},{"source":"JsUwvjkJCW","sourceHandle":"406bf6637c64","target":"sRWQqqshAE","targetHandle":"target","id":"xy-edge__JsUwvjkJCW406bf6637c64-sRWQqqshAEtarget"},{"source":"MzEitlOusl","sourceHandle":"source","target":"bDgwRcxgHo","targetHandle":"target","id":"xy-edge__MzEitlOuslsource-bDgwRcxgHotarget"},{"source":"bDgwRcxgHo","sourceHandle":"source","target":"fzmjIpcUsy","targetHandle":"target","id":"xy-edge__bDgwRcxgHosource-fzmjIpcUsytarget"},{"source":"QxNrkChBWQ","sourceHandle":"source","target":"nutuhaTLel","targetHandle":"target","id":"xy-edge__QxNrkChBWQsource-nutuhaTLeltarget"}],"data":{"MzEitlOusl":{"node":{"name":"大模型","description":"使用大模型对话"},"outputs":{"text":{"type":"text"}},"model":"qwen3","systemPrompt":"你是个好人","finished":true},"bivXSpiLaI":{"node":{"name":"代码执行","description":"执行自定义的处理代码"},"outputs":{"text":{"type":"text"},"condition":{"type":"boolean"},"count":{"type":"number"},"person":{"type":"object"},"words":{"type":"array-text"},"people":{"type":"array-object"}},"type":"javascript","content":"console.log(\'hello\')","inputs":{},"finished":true},"QxNrkChBWQ":{"node":{"name":"循环","description":"实现循环执行流程"},"finished":true,"outputs":{"output":{"type":"array-object"}}},"JsUwvjkJCW":{"node":{"name":"分支","description":"根据不同的情况前往不同的分支"},"conditions":[{"condition":{"id":"736a724a5de4","conjunction":"and","children":[{"id":"1db9e7a90aae","left":{"type":"field","field":"bivXSpiLaI.text"},"op":"equal","right":"1"},{"id":"98cc5c39eed4","left":{"type":"field","field":"bivXSpiLaI.condition"},"op":"is_true"},{"id":"1cbccc438a64","left":{"type":"field","field":"bivXSpiLaI.text"},"op":"equal","right":"2"}]}},{"condition":{"id":"406bf6637c64","conjunction":"and","children":[{"id":"ea37e95e6d1b","left":{"type":"field","field":"bivXSpiLaI.text"},"op":"equal","right":"3"}]}}],"finished":true},"sRWQqqshAE":{"node":{"name":"大模型","description":"使用大模型对话"},"outputs":{"text":{"type":"text"}},"model":"deepseek","systemPrompt":"Hello","finished":true},"bDgwRcxgHo":{"node":{"name":"代码执行","description":"执行自定义的处理代码"},"type":"javascript","content":"console.log(\'hello\')","outputs":{"ok":{"type":"boolean"}},"finished":true},"fzmjIpcUsy":{"node":{"name":"输出","description":"定义输出变量"},"output":"loopItem","finished":true},"nutuhaTLel":{"node":{"name":"大模型","description":"使用大模型对话"},"outputs":{"text":{"type":"text"}},"model":"qwen3","systemPrompt":"你是个好人","finished":true}}}'))
return ( return (
<div className="h-screen"> <div className="h-screen">