fix: 修复规则链可以形成循环链

-import type { Connection } from '@vue-flow/core';
+import type { Connection, Edge } from '@vue-flow/core';
 import { EdgeTypeEnum } from '../enum';
 import { EdgeTypeEnum } from '../enum';
 import type { EdgeData } from '../types/node';
 import type { EdgeData } from '../types/node';
 import { buildUUID } from '/@/utils/uuid';
 import { buildUUID } from '/@/utils/uuid';
 
 
 export function useAddEdges() {
 export function useAddEdges() {
-  const getAddedgesParams = (params: Connection, data: string | string[] | any) => {
+  const getAddedgesParams = (params: Connection | Edge, data: string | string[] | any) => {
     return { type: EdgeTypeEnum.CUSTOM, data: { data } as EdgeData, id: buildUUID(), ...params };
     return { type: EdgeTypeEnum.CUSTOM, data: { data } as EdgeData, id: buildUUID(), ...params };
   };
   };
 
 

-import { GraphEdge, GraphNode, VueFlowStore } from '@vue-flow/core';
+import { GraphEdge, GraphNode, VueFlowStore, pointToRendererPoint } from '@vue-flow/core';
 import { getRuleNodeCache, setRuleNodeCache } from './useRuleCopyPaste';
 import { getRuleNodeCache, setRuleNodeCache } from './useRuleCopyPaste';
 import { RuleContextMenuEnum } from './useRuleChainContextMenu';
 import { RuleContextMenuEnum } from './useRuleChainContextMenu';
 import { useAddNodes } from './useAddNodes';
 import { useAddNodes } from './useAddNodes';
@@ -65,15 +65,15 @@ export function useContextMenuAction() {
   const copy = (params: HandleContextMenuActionParamsType) => {
   const copy = (params: HandleContextMenuActionParamsType) => {
     const { node } = params;
     const { node } = params;
     if (!node) return;
     if (!node) return;
-    const { position, data } = node;
+    const { position, data, id } = node;
     const { getAddNodesParams } = useAddNodes();
     const { getAddNodesParams } = useAddNodes();
     const { x, y } = position;
     const { x, y } = position;
 
 
-    const value = getAddNodesParams(position, data, { id: buildUUID() });
+    const value = getAddNodesParams(position, data, { id });
 
 
     setRuleNodeCache({
     setRuleNodeCache({
       nodes: [value],
       nodes: [value],
-      originX: x + NODE_WIDTH / 2 + x,
+      originX: x + NODE_WIDTH / 2,
       originY: y + NODE_HEIGHT / 2,
       originY: y + NODE_HEIGHT / 2,
     });
     });
   };
   };
@@ -81,24 +81,49 @@ export function useContextMenuAction() {
   const paste = (params: HandleContextMenuActionParamsType) => {
   const paste = (params: HandleContextMenuActionParamsType) => {
     const { event, flowActionType, useSaveAndRedoActionType } = params;
     const { event, flowActionType, useSaveAndRedoActionType } = params;
     const { triggerChange } = useSaveAndRedoActionType || {};
     const { triggerChange } = useSaveAndRedoActionType || {};
+
     const { getAddNodesParams } = useAddNodes();
     const { getAddNodesParams } = useAddNodes();
     const { getAddedgesParams } = useAddEdges();
     const { getAddedgesParams } = useAddEdges();
-    const clientX = (event as MouseEvent).offsetX;
-    const clientY = (event as MouseEvent).offsetY;
 
 
     const { edges = [], nodes = [], originX, originY } = getRuleNodeCache();
     const { edges = [], nodes = [], originX, originY } = getRuleNodeCache();
 
 
+    const { x: clientX, y: clientY } = pointToRendererPoint(
+      { x: (event as MouseEvent).offsetX, y: (event as MouseEvent).offsetY },
+      flowActionType!.getViewport(),
+      false,
+      [25, 25]
+    );
+
+    const xAxisMoveDistance = clientX - originX!;
+    const yAxisMoveDistance = clientY - originY!;
+
+    const newEdges = edges.map((edge) =>
+      getAddedgesParams({ ...edge, id: buildUUID() }, edge.data)
+    );
+
     const newNode = nodes.map((node) => {
     const newNode = nodes.map((node) => {
-      const { position, data, id } = node;
+      const { position, data, id: oldId } = node;
       const { x, y } = position;
       const { x, y } = position;
+      const newId = buildUUID();
 
 
-      const newX = clientX - originX! + x + NODE_WIDTH / 2;
-      const newY = clientY - originY! + y + NODE_HEIGHT / 2;
+      const newX = xAxisMoveDistance + x;
+      const newY = yAxisMoveDistance + y;
 
 
-      return getAddNodesParams({ x: newX, y: newY }, { ...data, created: false }, { id });
-    });
+      for (const connection of newEdges || []) {
+        if (connection.source.includes(oldId)) {
+          connection.source = newId;
+          connection.sourceHandle = connection.sourceHandle?.replaceAll(oldId, newId);
+          continue;
+        }
 
 
-    const newEdges = edges.map((edge) => getAddedgesParams(edge, edge.data));
+        if (connection.target.includes(oldId)) {
+          connection.target = newId;
+          connection.targetHandle = connection.targetHandle?.replaceAll(oldId, newId);
+        }
+      }
+
+      return getAddNodesParams({ x: newX, y: newY }, { ...data, created: false }, { id: newId });
+    });
 
 
     flowActionType?.addNodes(newNode);
     flowActionType?.addNodes(newNode);
     flowActionType?.addEdges(newEdges);
     flowActionType?.addEdges(newEdges);
@@ -153,23 +178,9 @@ export function useContextMenuAction() {
     );
     );
 
 
     const nodes = unref(flowActionType?.getSelectedNodes)?.map((node) => {
     const nodes = unref(flowActionType?.getSelectedNodes)?.map((node) => {
-      const { id: oldId } = node;
-      const newId = buildUUID();
-
-      for (const connection of edges || []) {
-        if (connection.source.includes(oldId)) {
-          connection.source = newId;
-          connection.sourceHandle = connection.sourceHandle?.replaceAll(oldId, newId);
-          continue;
-        }
-
-        if (connection.target.includes(oldId)) {
-          connection.target = newId;
-          connection.targetHandle = connection.targetHandle?.replaceAll(oldId, newId);
-        }
-      }
+      const { id } = node;
 
 
-      return getAddNodesParams(node.position, toRaw(unref(node.data)), { id: newId });
+      return getAddNodesParams(node.position, toRaw(unref(node.data)), { id });
     });
     });
 
 
     const originRect = getElementsCenter(unref(flowActionType?.getSelectedNodes) || []);
     const originRect = getElementsCenter(unref(flowActionType?.getSelectedNodes) || []);

@@ -6,7 +6,7 @@ export function useInputNode() {
     const { getAddNodesParams } = useAddNodes();
     const { getAddNodesParams } = useAddNodes();
 
 
     const newNode = getAddNodesParams(
     const newNode = getAddNodesParams(
-      { x: 80, y: 50 },
+      { x: 75, y: 50 },
       {
       {
         ...new InputConfig(),
         ...new InputConfig(),
         data: {
         data: {

@@ -51,18 +51,17 @@ export enum RuleChainContextMenuIconEnum {
   // LINK = 'material-symbols:trending-flat',
   // LINK = 'material-symbols:trending-flat',
 }
 }
 
 
-export enum RuleChainContextMenuShortcutKeyEnum {
-  DELETE = 'Ctrl(⌘) X',
+export enum RuleChainContextMenuShortcutKeyEnum {}
+// DELETE = 'Ctrl(⌘) X',
 
 
-  SELECT_COPY = 'Ctrl(⌘) C',
-  PASTE = 'Ctrl(⌘) V',
-  UNSELECTED = 'Esc',
-  DELETE_SELECT = 'Del',
-  APPLY_CHANGE = 'Ctrl(⌘) S',
-  UNDO_CHANGE = 'Ctrl(⌘) Z',
+// SELECT_COPY = 'Ctrl(⌘) C',
+// PASTE = 'Ctrl(⌘) V',
+// UNSELECTED = 'Esc',
+// DELETE_SELECT = 'Del',
+// APPLY_CHANGE = 'Ctrl(⌘) S',
+// UNDO_CHANGE = 'Ctrl(⌘) Z',
 
 
-  SELECT_ALL = 'Ctrl(⌘) A',
-}
+// SELECT_ALL = 'Ctrl(⌘) A',
 
 
 const getMenuItem = (key: RuleContextMenuEnum, handler: Fn, disabled = false) => {
 const getMenuItem = (key: RuleContextMenuEnum, handler: Fn, disabled = false) => {
   return {
   return {

@@ -92,6 +92,9 @@ export function useRuleFlow(options: UseRuleFlowOptionsType) {
 
 
       if (!validateList.every((item) => item(connection, elements))) return false;
       if (!validateList.every((item) => item(connection, elements))) return false;
 
 
+      if (validateCircularreference(elements.sourceNode!, elements.targetNode, elements.edges))
+        return false;
+
       return true;
       return true;
     },
     },
   });
   });
@@ -134,7 +137,6 @@ export function useRuleFlow(options: UseRuleFlowOptionsType) {
 
 
     triggerChange();
     triggerChange();
   });
   });
-
   onPaneReady(async () => {
   onPaneReady(async () => {
     setViewport({ x: 0, y: 0, zoom: 1 });
     setViewport({ x: 0, y: 0, zoom: 1 });
   });
   });
@@ -238,6 +240,55 @@ export function useRuleFlow(options: UseRuleFlowOptionsType) {
     return !!sourceData?.config?.configurationDescriptor.nodeDefinition?.relationTypes?.length;
     return !!sourceData?.config?.configurationDescriptor.nodeDefinition?.relationTypes?.length;
   }
   }
 
 
+  /**
+   * @description 验证是否循环引用
+   */
+  function validateCircularreference(
+    sourceNode: GraphNode,
+    targetNode: GraphNode,
+    edges: GraphEdge[]
+  ) {
+    const sourceId = sourceNode.id;
+    const targetId = targetNode.id;
+
+    const getAllIndex = (
+      edges: GraphEdge[],
+      validate: (item: GraphEdge, index: number) => boolean
+    ) => {
+      const indexList: number[] = [];
+
+      for (let i = 0; i < edges.length; i++) {
+        const item = edges[i];
+        if (validate(item, i)) {
+          indexList.push(i);
+        }
+      }
+
+      return indexList;
+    };
+
+    const validate = (source: string, startSource: string) => {
+      const nextNodesIndex = getAllIndex(edges, (item) => item.source === source);
+
+      if (!nextNodesIndex.length) return false;
+
+      for (const nextNodeIndex of nextNodesIndex) {
+        const nextNode = edges[nextNodeIndex];
+        if (nextNode && nextNode.target === startSource) {
+          return true;
+        }
+        return validate(nextNode.target, startSource);
+      }
+    };
+
+    return validate(targetId, sourceId);
+  }
+
+  /**
+   * @description 处理最大链接点
+   * @param sourceNode
+   * @returns
+   */
   function handleMaxConnectionPoint(sourceNode?: GraphNode) {
   function handleMaxConnectionPoint(sourceNode?: GraphNode) {
     if (!sourceNode) return;
     if (!sourceNode) return;
 
 

@@ -19,11 +19,11 @@ export function useSaveAndRedo() {
 
 
   const redoDataRef = ref<Elements>([]);
   const redoDataRef = ref<Elements>([]);
 
 
-  const route = useRoute();
+  const ROUTE = useRoute();
 
 
   const debugMarker = ref(false);
   const debugMarker = ref(false);
 
 
-  const getRuleChainId = computed(() => (route.params as Record<'id', string>).id);
+  const getRuleChainId = computed(() => (ROUTE.params as Record<'id', string>).id);
 
 
   const ruleChainDetail = ref<RuleChainDetail>();
   const ruleChainDetail = ref<RuleChainDetail>();
 
 

@@ -26,7 +26,7 @@
 <template>
 <template>
   <BasicDrawer
   <BasicDrawer
     v-model:visible="visible"
     v-model:visible="visible"
-    width="700px"
+    width="40%"
     showFooter
     showFooter
     showOkBtn
     showOkBtn
     showCancelBtn
     showCancelBtn

@@ -79,7 +79,7 @@
 <template>
 <template>
   <BasicDrawer
   <BasicDrawer
     v-model:visible="visible"
     v-model:visible="visible"
-    width="700px"
+    width="40%"
     showFooter
     showFooter
     showCancelBtn
     showCancelBtn
     showOkBtn
     showOkBtn