handleCancelOne(item)}
+ />
+
+
+ {item.source_app_name[0]}
+
+ {item.source_app_name}
-
- {t('application.version')}
- {item.source_app_version}
+
+
+ {t('application.type')}
+
+ {t(`application.${item.source_app_type}`)}
+
+
+
+ {t('application.version')}
+ {item.source_app_version}
+
+
+ {t('application.permission')}
+
+ {t(`application.${item.permission}`)}
+
+
+
+ {t('application.souceStatus')}
+ {item.source_app_is_active ? t('application.sourceActive') : t('application.sourceInactive')}
+
-
- {t('application.permission')}
-
- {t(`application.${item.permission}`)}
-
-
-
- {t('application.souceStatus')}
- {item.source_app_is_active ? t('application.sourceActive') : t('application.sourceInactive')}
-
-
-
- ))}
-
- ),
- }]}
- />
- ))}
-
+
+ ))}
+
+ ),
+ }]}
+ />
+ ))}
+
+
);
};
diff --git a/web/src/views/Workflow/components/PortClickHandler.tsx b/web/src/views/Workflow/components/PortClickHandler.tsx
index ec898bc8..903ccbdc 100644
--- a/web/src/views/Workflow/components/PortClickHandler.tsx
+++ b/web/src/views/Workflow/components/PortClickHandler.tsx
@@ -1,8 +1,8 @@
/*
* @Author: ZhaoYing
* @Date: 2026-02-09 18:30:28
- * @Last Modified by: ZhaoYing
- * @Last Modified time: 2026-02-09 18:30:28
+ * @Last Modified by: ZhaoYing
+ * @Last Modified time: 2026-03-18 12:06:27
*/
import { useEffect, useState } from 'react';
import { Popover } from 'antd';
@@ -70,7 +70,6 @@ const PortClickHandler: React.FC
= ({ graph }) => {
// Get source port group information
const sourcePortInfo = sourceNode.getPorts().find((p: any) => p.id === sourcePort);
const sourcePortGroup = sourcePortInfo?.group || sourcePort;
- console.log('sourcePortGroup', sourcePortGroup, sourcePortInfo)
// If add-node position exists, use it; otherwise calculate new position
let newX, newY;
@@ -148,18 +147,23 @@ const PortClickHandler: React.FC = ({ graph }) => {
if (sourcePortGroup === 'left') {
// Connect from left port to new node's right side
targetPort = targetPorts.find((port: any) => port.group === 'right')?.id || 'right';
+ graph.addEdge({
+ source: { cell: newNode.id, port: targetPort },
+ target: { cell: sourceNode.id, port: sourcePort },
+ ...edgeAttrs
+ // zIndex: sourceNodeData.cycle && sourceNodeType == 'cycle-start' ? 1 : sourceNodeData.cycle ? 2 : 0
+ });
} else {
// Connect from right port to new node's left side
targetPort = targetPorts.find((port: any) => port.group === 'left')?.id || 'left';
+ graph.addEdge({
+ source: { cell: sourceNode.id, port: sourcePort },
+ target: { cell: newNode.id, port: targetPort },
+ ...edgeAttrs
+ // zIndex: sourceNodeData.cycle && sourceNodeType == 'cycle-start' ? 1 : sourceNodeData.cycle ? 2 : 0
+ });
}
- graph.addEdge({
- source: { cell: sourceNode.id, port: sourcePort },
- target: { cell: newNode.id, port: targetPort },
- ...edgeAttrs
- // zIndex: sourceNodeData.cycle && sourceNodeType == 'cycle-start' ? 1 : sourceNodeData.cycle ? 2 : 0
- });
-
// Adjust loop node size when child node is added via port within loop node
const cycleId = sourceNodeData.cycle;
if (cycleId) {
@@ -223,20 +227,27 @@ const PortClickHandler: React.FC = ({ graph }) => {
const isChildOfLoop = sourceNodeData?.cycle && graph?.getNodes().find((n: any) => n.getData()?.id === sourceNodeData.cycle && n.getData()?.type === 'loop');
const isChildOfIteration = sourceNodeData?.cycle && graph?.getNodes().find((n: any) => n.getData()?.id === sourceNodeData.cycle && n.getData()?.type === 'iteration');
+ const sourcePortInfo = sourceNode?.getPorts().find((p: any) => p.id === sourcePort);
+ const sourcePortGroup = sourcePortInfo?.group || sourcePort;
+ const isLeftPort = sourcePortGroup === 'left';
+
let filteredNodes;
if (isChildOfLoop) {
- // Use same filtering as AddNode for child nodes of loop, but allow break
+ // Use same filtering as AddNode for child nodes of loop, but allow break
filteredNodes = category.nodes.filter(nodeType => !['start', 'end', 'loop', 'cycle-start', 'iteration'].includes(nodeType.type));
} else if (isChildOfIteration) {
// Filter out loop and iteration nodes for children of iteration nodes, but allow break
filteredNodes = category.nodes.filter(nodeType => !['start', 'end', 'loop', 'cycle-start', 'iteration'].includes(nodeType.type));
} else {
// Original filtering for non-loop child nodes
- filteredNodes = category.nodes.filter(nodeType => !['start', 'break', 'cycle-start'].includes(nodeType.type));
filteredNodes = category.nodes.filter(nodeType =>
nodeType.type !== 'start' && nodeType.type !== 'cycle-start' && nodeType.type !== 'break'
);
}
+
+ if (isLeftPort) {
+ filteredNodes = filteredNodes.filter(nodeType => nodeType.type !== 'end');
+ }
if (filteredNodes.length === 0) return null;
diff --git a/web/src/views/Workflow/hooks/useWorkflowGraph.ts b/web/src/views/Workflow/hooks/useWorkflowGraph.ts
index 050c1680..db0c3c93 100644
--- a/web/src/views/Workflow/hooks/useWorkflowGraph.ts
+++ b/web/src/views/Workflow/hooks/useWorkflowGraph.ts
@@ -2,7 +2,7 @@
* @Author: ZhaoYing
* @Date: 2026-02-03 15:17:48
* @Last Modified by: ZhaoYing
- * @Last Modified time: 2026-03-17 10:00:10
+ * @Last Modified time: 2026-03-18 12:07:03
*/
import { useRef, useEffect, useState } from 'react';
import { useParams } from 'react-router-dom';
@@ -593,13 +593,6 @@ export const useWorkflowGraph = ({
if (!graphRef.current) return false;
const selectedNodes = graphRef.current.getNodes().filter(node => node.getData()?.isSelected);
if (selectedNodes.length) {
- selectedNodes.forEach(node => {
- const data = node.getData();
- node.setData({
- ...data,
- id: `${(data.type as string).replace(/-/g, '_')}_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`,
- });
- });
graphRef.current.copy(selectedNodes);
}
return false;
@@ -610,7 +603,14 @@ export const useWorkflowGraph = ({
*/
const parseEvent = () => {
if (!graphRef.current?.isClipboardEmpty()) {
- graphRef.current?.paste({ offset: 32 });
+ const pastedNodes = graphRef.current?.paste({ offset: 32 }) ?? [];
+ pastedNodes.forEach(cell => {
+ if (cell.isNode()) {
+ const data = cell.getData();
+ const newId = `${(data.type as string).replace(/-/g, '_')}_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+ cell.setData({ ...data, id: newId });
+ }
+ });
blankClick();
}
return false;
@@ -761,8 +761,23 @@ export const useWorkflowGraph = ({
createEdge() {
return graphRef.current?.createEdge(edgeAttrs);
},
- validateConnection({ sourceCell, targetCell, targetMagnet }) {
+ validateConnection({ sourceCell, targetCell, sourceMagnet, targetMagnet }) {
if (!targetMagnet) return false;
+
+ // Only allow right port → left port connections
+ const getPortGroup = (magnet: Element) => {
+ let el: Element | null = magnet;
+ while (el) {
+ const group = el.getAttribute('port-group');
+ if (group) return group;
+ el = el.parentElement;
+ }
+ return null;
+ };
+ const sourceGroup = sourceMagnet ? getPortGroup(sourceMagnet) : null;
+ const targetGroup = targetMagnet ? getPortGroup(targetMagnet) : null;
+
+ if (sourceGroup === 'left' || targetGroup === 'right') return false;
// Node cannot connect to itself
if (sourceCell?.id === targetCell?.id) return false;