fix(web): Calculation logic adjustment of variableList
This commit is contained in:
@@ -1960,6 +1960,9 @@ Memory Bear: After the rebellion, regional warlordism intensified for several re
|
||||
addMessage: 'Add Message',
|
||||
answerDesc: 'Reply',
|
||||
addNode: 'Add Node',
|
||||
arrange: 'Arrange',
|
||||
redo: 'Redo',
|
||||
undo: 'Undo',
|
||||
},
|
||||
emotionEngine: {
|
||||
emotionEngineConfig: 'Emotion Engine Configuration',
|
||||
|
||||
@@ -2057,6 +2057,9 @@ export const zh = {
|
||||
addMessage: '添加消息',
|
||||
answerDesc: '回复',
|
||||
addNode: '添加节点',
|
||||
arrange: '整理',
|
||||
redo: '重做',
|
||||
undo: '撤销',
|
||||
},
|
||||
emotionEngine: {
|
||||
emotionEngineConfig: '情感引擎配置',
|
||||
|
||||
@@ -36,7 +36,7 @@ const AddNode: ReactShapeConfig['component'] = ({ node, graph }) => {
|
||||
if (cycleId) {
|
||||
const parentNode = graph.getNodes().find((n: any) => n.getData()?.id === cycleId);
|
||||
if (parentNode) {
|
||||
parentNode.insertChild(newNode);
|
||||
parentNode.addChild(newNode);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -48,7 +48,6 @@ const AddNode: ReactShapeConfig['component'] = ({ node, graph }) => {
|
||||
source: { cell: edge.getSourceCellId(), port: edge.getSourcePortId() },
|
||||
target: { cell: newNode.id, port: newNode.getPorts().find((port: any) => port.group === 'left')?.id || 'left' },
|
||||
attrs: edge.getAttrs(),
|
||||
zIndex: 1,
|
||||
});
|
||||
});
|
||||
|
||||
@@ -59,7 +58,6 @@ const AddNode: ReactShapeConfig['component'] = ({ node, graph }) => {
|
||||
source: { cell: newNode.id, port: newNode.getPorts().find((port: any) => port.group === 'right')?.id || 'right' },
|
||||
target: { cell: edge.getTargetCellId(), port: targetPortId },
|
||||
attrs: edge.getAttrs(),
|
||||
zIndex: 1,
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
@@ -18,7 +18,7 @@ const LoopNode: ReactShapeConfig['component'] = ({ node, graph }) => {
|
||||
}, 50)
|
||||
|
||||
return () => clearTimeout(timer)
|
||||
}, [])
|
||||
}, [graph])
|
||||
|
||||
const checkAndAddAddNode = () => {
|
||||
if (!graph) return;
|
||||
@@ -44,15 +44,15 @@ const LoopNode: ReactShapeConfig['component'] = ({ node, graph }) => {
|
||||
},
|
||||
});
|
||||
|
||||
node.insertChild(addNode);
|
||||
node.addChild(addNode);
|
||||
|
||||
// 连接cycle-start和add-node
|
||||
const sourcePorts = cycleStartNode.getPorts();
|
||||
const targetPorts = addNode.getPorts();
|
||||
const sourcePort = sourcePorts.find((port: any) => port.group === 'right')?.id || 'right';
|
||||
const targetPort = targetPorts.find((port: any) => port.group === 'left')?.id || 'left';
|
||||
|
||||
// 直接创建连线,不使用异步
|
||||
|
||||
// 然后创建连线
|
||||
graph.addEdge({
|
||||
source: { cell: cycleStartNode.id, port: sourcePort },
|
||||
target: { cell: addNode.id, port: targetPort },
|
||||
@@ -107,8 +107,8 @@ const LoopNode: ReactShapeConfig['component'] = ({ node, graph }) => {
|
||||
cycle: data.id,
|
||||
},
|
||||
});
|
||||
node.insertChild(cycleStartNode)
|
||||
node.insertChild(addNode)
|
||||
node.addChild(cycleStartNode)
|
||||
node.addChild(addNode)
|
||||
const sourcePorts = cycleStartNode.getPorts()
|
||||
const targetPorts = addNode.getPorts()
|
||||
let sourcePort = sourcePorts.find((port: any) => port.group === 'right')?.id || 'right';
|
||||
@@ -133,7 +133,6 @@ const LoopNode: ReactShapeConfig['component'] = ({ node, graph }) => {
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
graph.addEdge(edgeConfig)
|
||||
}
|
||||
|
||||
|
||||
@@ -129,7 +129,7 @@ const PortClickHandler: React.FC<PortClickHandlerProps> = ({ graph }) => {
|
||||
if (sourceNodeData.cycle) {
|
||||
const parentNode = graph.getNodes().find((n: any) => n.getData()?.id === sourceNodeData.cycle);
|
||||
if (parentNode) {
|
||||
parentNode.insertChild(newNode);
|
||||
parentNode.addChild(newNode);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -159,7 +159,7 @@ const PortClickHandler: React.FC<PortClickHandlerProps> = ({ graph }) => {
|
||||
},
|
||||
},
|
||||
},
|
||||
zIndex: sourceNodeData.cycle && sourceNodeType == 'cycle-start' ? 1 : sourceNodeData.cycle ? 2 : 0
|
||||
// zIndex: sourceNodeData.cycle && sourceNodeType == 'cycle-start' ? 1 : sourceNodeData.cycle ? 2 : 0
|
||||
});
|
||||
|
||||
// 循环节点内子节点通过连接桩添加时,调整循环节点大小
|
||||
|
||||
@@ -3,7 +3,7 @@ import { useTranslation } from 'react-i18next'
|
||||
import { Graph, Node } from '@antv/x6';
|
||||
import { Form, Input, Button, Select, InputNumber, Slider, Space, Divider, App, Switch } from 'antd'
|
||||
|
||||
import type { NodeConfig, NodeProperties, StartVariableItem, VariableEditModalRef } from '../../types'
|
||||
import type { NodeConfig, NodeProperties, StartVariableItem, VariableEditModalRef, ChatVariable } from '../../types'
|
||||
import Empty from '@/components/Empty';
|
||||
import emptyIcon from '@/assets/images/workflow/empty.png'
|
||||
import CustomSelect from "@/components/CustomSelect";
|
||||
@@ -34,11 +34,12 @@ interface PropertiesProps {
|
||||
copyEvent: () => void;
|
||||
parseEvent: () => void;
|
||||
config?: any;
|
||||
chatVariables: ChatVariable[];
|
||||
}
|
||||
const Properties: FC<PropertiesProps> = ({
|
||||
selectedNode,
|
||||
graphRef,
|
||||
config: workflowConfig,
|
||||
chatVariables
|
||||
}) => {
|
||||
const { t } = useTranslation()
|
||||
const { modal } = App.useApp()
|
||||
@@ -47,6 +48,7 @@ const Properties: FC<PropertiesProps> = ({
|
||||
const values = Form.useWatch([], form);
|
||||
const variableModalRef = useRef<VariableEditModalRef>(null)
|
||||
const [editIndex, setEditIndex] = useState<number | null>(null)
|
||||
const [graphUpdateTrigger, setGraphUpdateTrigger] = useState(0)
|
||||
const prevMappingNamesRef = useRef<string[]>([])
|
||||
const prevTemplateVarsRef = useRef<string[]>([])
|
||||
const syncTimeoutRef = useRef<number | null>(null)
|
||||
@@ -349,11 +351,9 @@ const Properties: FC<PropertiesProps> = ({
|
||||
const parentPreviousNodeIds = getAllPreviousNodes(parentLoopNode.id);
|
||||
allRelevantNodeIds.push(...parentPreviousNodeIds);
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Add conversation variables from global config
|
||||
const conversationVariables = workflowConfig?.variables || [];
|
||||
const conversationVariables = chatVariables || [];
|
||||
|
||||
conversationVariables.forEach((variable: any) => {
|
||||
const key = `CONVERSATION_${variable.name}`;
|
||||
@@ -763,7 +763,36 @@ const Properties: FC<PropertiesProps> = ({
|
||||
}
|
||||
|
||||
return variableList;
|
||||
}, [selectedNode, graphRef, workflowConfig?.variables]);
|
||||
}, [selectedNode, graphRef, graphUpdateTrigger, chatVariables]);
|
||||
|
||||
// Trigger variableList update when graph edges or nodes change
|
||||
useEffect(() => {
|
||||
if (!graphRef?.current) return;
|
||||
|
||||
const graph = graphRef.current;
|
||||
const handleGraphChange = () => {
|
||||
console.log('handleGraphChange')
|
||||
// Force variableList recalculation by updating trigger
|
||||
setGraphUpdateTrigger(prev => prev + 1);
|
||||
};
|
||||
|
||||
// Listen to graph changes
|
||||
graph.on('edge:added', handleGraphChange);
|
||||
graph.on('edge:removed', handleGraphChange);
|
||||
graph.on('edge:changed', handleGraphChange);
|
||||
graph.on('node:added', handleGraphChange);
|
||||
graph.on('node:removed', handleGraphChange);
|
||||
graph.on('node:change:data', handleGraphChange);
|
||||
|
||||
return () => {
|
||||
graph.off('edge:added', handleGraphChange);
|
||||
graph.off('edge:removed', handleGraphChange);
|
||||
graph.off('edge:changed', handleGraphChange);
|
||||
graph.off('node:added', handleGraphChange);
|
||||
graph.off('node:removed', handleGraphChange);
|
||||
graph.off('node:change:data', handleGraphChange);
|
||||
};
|
||||
}, [graphRef]);
|
||||
|
||||
// Filter out boolean type variables for loop and llm nodes
|
||||
const getFilteredVariableList = (nodeType?: string, key?: string) => {
|
||||
|
||||
@@ -54,7 +54,7 @@ export const useWorkflowGraph = ({
|
||||
const historyRef = useRef<{ undoStack: string[], redoStack: string[] }>({ undoStack: [], redoStack: [] });
|
||||
const [canUndo, setCanUndo] = useState(false);
|
||||
const [canRedo, setCanRedo] = useState(false);
|
||||
const [isHandMode, setIsHandMode] = useState(false);
|
||||
const [isHandMode, setIsHandMode] = useState(true);
|
||||
const [config, setConfig] = useState<WorkflowConfig | null>(null);
|
||||
const [chatVariables, setChatVariables] = useState<ChatVariable[]>([])
|
||||
|
||||
@@ -235,7 +235,7 @@ export const useWorkflowGraph = ({
|
||||
if (parentNode) {
|
||||
const addedChild = graphRef.current?.addNode(childNode)
|
||||
if (addedChild) {
|
||||
parentNode.insertChild(addedChild)
|
||||
parentNode.addChild(addedChild)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -354,7 +354,7 @@ export const useWorkflowGraph = ({
|
||||
},
|
||||
},
|
||||
},
|
||||
zIndex: loopIterationCount
|
||||
// zIndex: loopIterationCount
|
||||
}
|
||||
|
||||
return edgeConfig
|
||||
@@ -694,10 +694,9 @@ export const useWorkflowGraph = ({
|
||||
thickness: 1, // 网点大小
|
||||
}
|
||||
},
|
||||
panning: false,
|
||||
panning: isHandMode,
|
||||
mousewheel: {
|
||||
enabled: true,
|
||||
modifiers: ['ctrl', 'meta'],
|
||||
},
|
||||
connecting: {
|
||||
// router: 'orth',
|
||||
|
||||
@@ -107,6 +107,7 @@ const Workflow = forwardRef<WorkflowRef>((_props, ref) => {
|
||||
copyEvent={copyEvent}
|
||||
parseEvent={parseEvent}
|
||||
config={config}
|
||||
chatVariables={chatVariables}
|
||||
/>
|
||||
<Chat
|
||||
ref={chatRef}
|
||||
|
||||
Reference in New Issue
Block a user