import React, { useCallback, useEffect } from 'react';
import {
  applyNodeChanges,
  applyEdgeChanges,
  addEdge,
  reconnectEdge,
  Node,
  Edge
} from '@xyflow/react';
import { getAppInfoNew, setMainFlowNew, setSubFlowNew } from '@/api/appRes';
import { Message } from '@arco-design/web-react';
import { nodeTypeMap, registerNodeType } from '@/components/FlowEditor/node';
import { convertFlowData, reverseConvertFlowData, revertFlowData } from '@/utils/convertFlowData';
import { localNodeData } from '@/pages/flowEditor/sideBar/config/localNodeData';
import { useAlignmentGuidelines } from '@/hooks/useAlignmentGuidelines';
import LocalNode from '@/components/FlowEditor/node/localNode/LocalNode';
import LoopNode from '@/components/FlowEditor/node/loopNode/LoopNode';
import {
  updateCanvasDataMap,
  resetNodeStatus,
  updateIsRunning,
  updateEventListOld,
  addRuntimeLog,
  clearRuntimeLogs,
  updateRuntimeId, updateFlowData
} from '@/store/ideContainer';
import {
  validateAllNodes,
  showValidationErrors,
  validateAllEdges
} from '@/components/FlowEditor/nodeEditors/validators/nodeValidators';
import {
  getHandleType,
  validateDataType,
  getNodeComponent
} from '@/utils/flowCommon';
import { projectFlowHandle } from '@/pages/flowEditor/utils/projectFlowHandle';
import { appFLowHandle } from '@/pages/flowEditor/utils/appFlowhandle';
import { handelEventNodeList, updateEvent, upDatePublish } from '@/pages/flowEditor/utils/common';

import { Dispatch } from 'redux';
import { runMainFlow, stopApp } from '@/api/apps';
import store from '@/store';
import { updateAppEvent, updateAppEventChannel, updateAppFlowData } from '@/api/appEvent';
import { sleep } from '@/utils/common';
import { queryEventItemBySceneIdOld, deleteEventSub, deleteEventPub } from '@/api/event';

export const useFlowCallbacks = (
  nodes: Node[],
  setNodes: React.Dispatch<React.SetStateAction<Node[]>>,
  edges: Edge[],
  setEdges: React.Dispatch<React.SetStateAction<Edge[]>>,
  useDefault: boolean,
  reactFlowInstance: any,
  canvasDataMap: any,
  dispatch: Dispatch<any>,
  updateCanvasDataMapDebounced: (
    dispatch: Dispatch<any>,
    canvasDataMap: any,
    id: string,
    nodes: Node[],
    edges: Edge[]
  ) => void,
  initialData: any,
  historyTimeoutRef: React.MutableRefObject<NodeJS.Timeout | null>,
  setHistoryInitialized: React.Dispatch<React.SetStateAction<boolean>>,
  editingNode: Node | null,
  setEditingNode: React.Dispatch<React.SetStateAction<Node | null>>,
  setIsEditModalOpen: React.Dispatch<React.SetStateAction<boolean>>,
  edgeForNodeAdd: Edge | null,
  setEdgeForNodeAdd: React.Dispatch<React.SetStateAction<Edge | null>>,
  positionForNodeAdd: { x: number, y: number } | null,
  setPositionForNodeAdd: React.Dispatch<React.SetStateAction<{ x: number, y: number } | null>>,
  setIsDelete: React.Dispatch<React.SetStateAction<boolean>>
) => {
  const { getGuidelines, clearGuidelines } = useAlignmentGuidelines();
  // region 画布操作
  // 节点变更处理，添加防抖机制
  const onNodesChange = useCallback((changes: any) => {
    // 深度克隆节点数组以避免修改冻结的对象
    const clonedNodes = JSON.parse(JSON.stringify(nodes));
    const newNodes = applyNodeChanges(changes, clonedNodes);
    setNodes(newNodes);
    // 如果需要在节点变化时执行某些操作，可以在这里添加

    // 只有当变化是节点位置变化时才不立即记录历史
    const isPositionChange = changes.some((change: any) =>
      change.type === 'position' && change.dragging === false
    );

    // 如果是位置变化结束或者不是位置变化，则记录历史
    if (isPositionChange || !changes.some((change: any) => change.type === 'position')) {
      // 清除之前的定时器
      if (historyTimeoutRef.current) {
        clearTimeout(historyTimeoutRef.current);
      }

      // 设置新的定时器，延迟记录历史记录
      historyTimeoutRef.current = setTimeout(() => {
        const event = new CustomEvent('takeSnapshot', {
          detail: { nodes: [...newNodes], edges: [...edges] }
        });
        document.dispatchEvent(event);
      }, 100);
    }
  }, [nodes, edges]);

  // 边变更处理
  const onEdgesChange = useCallback((changes: any) => {
    const newEdges = applyEdgeChanges(changes, edges);
    setEdges(newEdges);
    // 如果需要在边变化时执行某些操作，可以在这里添加

    // 边的变化立即记录历史
    const event = new CustomEvent('takeSnapshot', {
      detail: { nodes: [...nodes], edges: [...newEdges] }
    });
    document.dispatchEvent(event);
  }, [edges, nodes]);
  // 节点删除处理
  const onNodesDelete = useCallback((deletedNodes: any) => {
    setIsDelete(true);
  }, []);
  // 边连接处理
  const onConnect = useCallback((params: any) => {
    // 获取源节点和目标节点
    const sourceNode = nodes.find(node => node.id === params.source);
    const targetNode = nodes.find(node => node.id === params.target);

    // 如果找不到节点，不创建连接
    if (!sourceNode || !targetNode) {
      return;
    }
    // 获取源节点和目标节点的参数信息
    const sourceParams: any = sourceNode.data?.parameters || {};
    const targetParams: any = targetNode.data?.parameters || {};

    // 获取源handle和目标handle的类型 (api或data)
    const sourceHandleType = getHandleType(params.sourceHandle, sourceParams);
    const targetHandleType = getHandleType(params.targetHandle, targetParams);

    // 验证连接类型是否匹配 (api只能连api, data只能连data)
    if (sourceHandleType !== targetHandleType) {
      console.warn('连接类型不匹配: ', sourceHandleType, targetHandleType);
      return;
    }

    // 验证数据类型是否匹配
    if (!validateDataType(sourceNode, targetNode, params.sourceHandle, params.targetHandle)) {
      console.warn('数据类型不匹配');
      return;
    }

    // 如果验证通过，创建连接
    setEdges((edgesSnapshot: Edge[]) => {
      // 创建带有事件信息的连接
      const edgeParams = { ...params, type: 'custom' };

      // 添加lineType字段，用于区分API连接和数据连接
      edgeParams.data = {
        ...edgeParams.data,
        lineType: sourceHandleType // 'api' 或 'data'
      };

      // 对于数据类型的边，需要额外验证dataIns和dataOuts中的数据类型是否一致
      if (sourceHandleType === 'data') {
        // 查找源节点的dataOuts中对应的数据
        const sourceDataOut = (sourceParams.dataOuts || []).find((dataOut: any) =>
          dataOut.name === params.sourceHandle || dataOut.id === params.sourceHandle);

        // 查找目标节点的dataIns中对应的数据
        const targetDataIn = (targetParams.dataIns || []).find((dataIn: any) =>
          dataIn.name === params.targetHandle || dataIn.id === params.targetHandle);

        // 验证数据类型是否一致
        if (sourceDataOut && targetDataIn && sourceDataOut.dataType !== targetDataIn.dataType) {
          console.warn('数据类型不匹配，源节点数据类型:', sourceDataOut.dataType, '目标节点数据类型:', targetDataIn.dataType);
          Message.warning(`数据类型不匹配，源节点数据类型: ${sourceDataOut.dataType}，目标节点数据类型: ${targetDataIn.dataType}`);
          return edgesSnapshot; // 不创建连接
        }
      }

      // 检查源节点和目标节点是否都有事件信息
      const sourceApi = (sourceParams.apiOuts || []).find((api: any) => (api?.eventId || api.name || api.id) === params.sourceHandle);
      const targetApi = (targetParams.apiIns || []).find((api: any) => (api?.eventId || api.name || api.id) === params.targetHandle);

      // 如果源节点有事件topic信息
      if (sourceApi && sourceApi.topic) {
        // 如果目标节点的topic是**empty**或没有topic，则使用源节点的事件信息
        if (!targetApi || !targetApi.topic || targetApi.topic.includes('**empty**')) {
          edgeParams.data = {
            ...edgeParams.data,
            lineType: 'api',
            displayData: {
              name: sourceApi.eventName,
              eventId: sourceApi.eventId,
              topic: sourceApi.topic
            }
          };
        }
        // 如果两个节点都有非empty的topic，则以源节点为准
        else if (sourceApi.topic && targetApi.topic &&
          !sourceApi.topic.includes('**empty**') &&
          !targetApi.topic.includes('**empty**')) {
          edgeParams.data = {
            ...edgeParams.data,
            lineType: 'api',
            displayData: {
              name: sourceApi.eventName,
              eventId: sourceApi.eventId,
              topic: sourceApi.topic
            }
          };
        }
      }
      // 如果源节点没有事件信息，但目标节点有
      else if (targetApi && targetApi.topic && !targetApi.topic.includes('**empty**')) {
        edgeParams.data = {
          ...edgeParams.data,
          lineType: 'api',
          displayData: {
            name: targetApi.eventName,
            eventId: targetApi.eventId,
            topic: targetApi.topic
          }
        };
      }

      const newEdges = addEdge(edgeParams, edgesSnapshot);

      // 连接建立后记录历史
      setTimeout(() => {
        const event = new CustomEvent('takeSnapshot', {
          detail: { nodes: [...nodes], edges: [...newEdges] }
        });
        document.dispatchEvent(event);
      }, 0);

      return newEdges;
    });
  }, [nodes]);
  // 边重新连接处理
  const onReconnect = useCallback((oldEdge: Edge, newConnection: any) => {
    // 获取源节点和目标节点
    const sourceNode = nodes.find(node => node.id === newConnection.source);
    const targetNode = nodes.find(node => node.id === newConnection.target);

    // 如果找不到节点，不创建连接
    if (!sourceNode || !targetNode) {
      return;
    }

    // 获取源节点和目标节点的参数信息
    const sourceParams = sourceNode.data?.parameters || {};
    const targetParams = targetNode.data?.parameters || {};

    // 获取源handle和目标handle的类型 (api或data)
    const sourceHandleType = getHandleType(newConnection.sourceHandle, sourceParams);
    const targetHandleType = getHandleType(newConnection.targetHandle, targetParams);

    // 验证连接类型是否匹配 (api只能连api, data只能连data)
    if (sourceHandleType !== targetHandleType) {
      console.warn('连接类型不匹配: ', sourceHandleType, targetHandleType);
      return;
    }

    // 验证数据类型是否匹配
    if (!validateDataType(sourceNode, targetNode, newConnection.sourceHandle, newConnection.targetHandle)) {
      console.warn('数据类型不匹配');
      return;
    }

    // 如果验证通过，重新连接
    setEdges((els) => reconnectEdge(oldEdge, newConnection, els));
  }, [nodes]);
  // 拖动处理
  const onDragOver = useCallback((event: React.DragEvent) => {
    event.preventDefault();
    event.dataTransfer.dropEffect = 'move';
  }, []);
  // 侧边栏节点实例
  const onDrop = useCallback((event: React.DragEvent) => {
    event.preventDefault();

    if (!reactFlowInstance) return;

    const callBack = event.dataTransfer.getData('application/reactflow');
    const nodeData = JSON.parse(callBack);
    if (typeof nodeData.nodeType === 'undefined' || !nodeData.nodeType) {
      return;
    }

    const position = reactFlowInstance.screenToFlowPosition({
      x: event.clientX,
      y: event.clientY
    });

    // 特殊处理循环节点，添加开始和结束节点
    if (nodeData.nodeType === 'LOOP') {
      addLoopNodeWithStartEnd(position, nodeData);
      return;
    }

    const newNode = {
      id: `${nodeData.nodeType}-${Date.now()}`,
      type: nodeData.nodeType,
      position,
      data: { ...nodeData.data, title: nodeData.nodeName, type: nodeData.nodeType }
    };

    // 将未定义的节点动态追加进nodeTypes
    const nodeMap = Array.from(Object.values(nodeTypeMap).map(key => key));
    // 目前默认添加的都是系统组件/本地组件
    if (!nodeMap.includes(nodeData.nodeType)) {
      registerNodeType(nodeData.nodeType, LocalNode, nodeData.nodeName);
    }

    setNodes((nds: Node[]) => {
      const newNodes = nds.concat(newNode);

      // 添加节点后记录历史
      setTimeout(() => {
        const event = new CustomEvent('takeSnapshot', {
          detail: { nodes: [...newNodes], edges: [...edges] }
        });
        document.dispatchEvent(event);
      }, 0);

      return newNodes;
    });
  }, [reactFlowInstance, edges]);
  // 添加循环节点及其开始和结束节点
  const addLoopNodeWithStartEnd = useCallback((position: { x: number, y: number }, nodeData: any) => {
    // 创建循环开始节点
    const loopStartNode = {
      id: `LOOP_START-${Date.now()}`,
      type: 'LOOP', // 使用本地节点类型
      position: { x: position.x, y: position.y },
      data: {
        title: '循环开始',
        type: 'LOOP_START',
        parameters: {
          apiIns: [{ name: 'start', desc: '', dataType: '', defaultValue: '' }],
          apiOuts: [{ name: 'done', desc: '', dataType: '', defaultValue: '' }],
          dataIns: [],
          dataOuts: []
        },
        component: {}
      }

    };

    // 创建循环结束节点
    const loopEndNode = {
      id: `LOOP_END-${Date.now()}`,
      type: 'LOOP', // 使用本地节点类型
      position: { x: position.x + 400, y: position.y },
      data: {
        title: '循环结束',
        type: 'LOOP_END',
        parameters: {
          apiIns: [{ name: 'continue', desc: '', dataType: '', defaultValue: '' }],
          apiOuts: [{ name: 'break', desc: '', dataType: '', defaultValue: '' }],
          dataIns: [{
            'arrayType': null,
            'dataType': 'INTEGER',
            'defaultValue': 10,
            'desc': '最大循环次数',
            'id': 'maxTime'
          }],
          dataOuts: []
        },
        component: {
          type: 'LOOP_END',
          customDef: JSON.stringify({
            apiOutIds: ['continue', 'break'],
            conditions: [],
            loopStartNodeId: loopStartNode.id
          }),
          loopStartNodeId: loopStartNode.id // 这里的参数是为了提供在组件内部处理数据是使用，最后这个字段要序列化后放进customDef
        }
      }
    };

    loopStartNode.data.component = {
      type: 'LOOP_START',
      customDef: JSON.stringify({ loopEndNodeId: loopEndNode.id })
    };

    // 创建连接边（连接循环开始和结束节点的顶部连接点）
    const newEdges = [
      {
        id: `${loopStartNode.id}-${loopEndNode.id}-group`,
        source: loopStartNode.id,
        target: loopEndNode.id,
        sourceHandle: `${loopStartNode.id}-group`,
        targetHandle: `${loopEndNode.id}-group`,
        type: 'custom'
      }
    ];

    // 将未定义的节点动态追加进nodeTypes
    const nodeMap = Array.from(Object.values(nodeTypeMap).map(key => key));
    if (!nodeMap.includes('LOOP')) {
      registerNodeType('LOOP', LoopNode, '循环');
    }

    setNodes((nds: Node[]) => {
      const newNodes = [...nds, loopStartNode, loopEndNode];

      // 添加节点后记录历史
      setTimeout(() => {
        const event = new CustomEvent('takeSnapshot', {
          detail: { nodes: [...newNodes], edges: [...edges, ...newEdges] }
        });
        document.dispatchEvent(event);
      }, 0);

      return newNodes;
    });

    setEdges((eds: Edge[]) => {
      const updatedEdges = [...eds, ...newEdges];

      // 添加边后记录历史
      setTimeout(() => {
        const event = new CustomEvent('takeSnapshot', {
          detail: { nodes: [...nodes, loopStartNode, loopEndNode], edges: [...updatedEdges] }
        });
        document.dispatchEvent(event);
      }, 0);

      return updatedEdges;
    });
  }, [nodes, edges]);
  // 节点拖拽处理
  const onNodeDrag = useCallback((_: any, node: Node) => {
    // 获取对齐线
    getGuidelines(node, nodes);
  }, [nodes, getGuidelines]);
  // 节点拖拽结束处理
  const onNodeDragStop = useCallback(() => {
    // 清除对齐线
    clearGuidelines();
  }, [clearGuidelines]);
  // endregion

  // region 画布数据处理
  // 初始化画布数据
  const initializeCanvasData = useCallback(() => {
    if (canvasDataMap[initialData?.appId]) {
      const { edges, nodes } = canvasDataMap[initialData?.appId];
      setNodes(nodes);
      setEdges(edges);
    }
    else {
      // 首次进入
      if (useDefault) projectFlowHandle(initialData, useDefault, setNodes, setEdges, dispatch, canvasDataMap);
      else appFLowHandle(initialData, useDefault, setNodes, setEdges, dispatch);
    }

    // 标记历史记录已初始化
    setHistoryInitialized(true);
  }, [initialData, canvasDataMap]);
  // 实时更新 canvasDataMap
  const updateCanvasDataMapEffect = useCallback(() => {
    if (initialData?.appId) {
      updateCanvasDataMapDebounced(dispatch, canvasDataMap, initialData.appId, nodes, edges);
    }

    // 清理函数，在组件卸载时取消防抖
    return () => {
      // 取消防抖函数
    };
  }, [nodes, edges, initialData?.appId, dispatch, canvasDataMap]);
  // 关闭编辑弹窗
  const closeEditModal = useCallback(() => {
    setIsEditModalOpen(false);
    setEditingNode(null);
  }, []);
  // 保存节点编辑
  const saveNodeEdit = useCallback((updatedData: any) => {
    console.log('updatedData:', updatedData);
    const updatedNodes = nodes.map((node) => {
      if (node.id === editingNode?.id) {
        return {
          ...node,
          data: { ...node.data, ...updatedData }
        };
      }
      return node;
    });

    setNodes(updatedNodes);
    closeEditModal();
  }, [nodes, editingNode, closeEditModal]);
  // 编辑节点
  const editNode = useCallback((node: Node) => {
    setEditingNode(node);
    setIsEditModalOpen(true);
  }, []);
  // 编辑边
  const editEdge = useCallback((edge: Edge) => {
    // 这里可以实现边编辑逻辑
    console.log('编辑边:', edge);
  }, []);
  // 复制节点
  const copyNode = useCallback((node: Node) => {
    // 将节点数据存储到localStorage中，以便粘贴时使用
    const nodeData = {
      ...node,
      // 清除可能存在的运行时状态
      selected: false,
      dragging: false,
      // 添加应用标识信息
      appId: initialData?.appId
    };

    localStorage.setItem('copiedNode', JSON.stringify(nodeData));
  }, [initialData?.appId]);

  // 粘贴节点
  const pasteNode = useCallback((position: { x: number; y: number }) => {
    const copiedNodeStr = localStorage.getItem('copiedNode');
    if (!copiedNodeStr) {
      console.warn('没有找到复制的节点数据');
      return;
    }

    try {
      const copiedNode = JSON.parse(copiedNodeStr);

      // 检查是否为同一应用，如果不是则不允许粘贴
      if (copiedNode.appId && initialData?.appId && copiedNode.appId !== initialData.appId) {
        console.warn('不能在不同应用之间粘贴节点');
        // Message.warning('不能在不同应用之间粘贴节点');
        return;
      }

      // 创建新节点，更新ID和位置
      const newNode = {
        ...copiedNode,
        id: `${copiedNode.type}-${Date.now()}`, // 生成新的唯一ID
        position, // 使用传入的位置
        selected: false,
        dragging: false,
        // 移除应用标识信息，避免存储在节点数据中
        appId: undefined
      };

      // 特殊处理循环节点
      if (copiedNode.type === 'LOOP') {
        // 对于循环节点，我们需要特殊处理
        setNodes((nds: Node[]) => {
          const newNodes = [...nds, newNode];

          // 添加节点后记录历史
          setTimeout(() => {
            const event = new CustomEvent('takeSnapshot', {
              detail: { nodes: [...newNodes], edges: [...edges] }
            });
            document.dispatchEvent(event);
          }, 0);

          return newNodes;
        });
        return;
      }

      // 将未定义的节点动态追加进nodeTypes
      const nodeMap = Array.from(Object.values(nodeTypeMap).map(key => key));
      if (!nodeMap.includes(newNode.type)) {
        registerNodeType(newNode.type, getNodeComponent(newNode.type), newNode.data?.title || newNode.type);
      }

      setNodes((nds: Node[]) => {
        const newNodes = [...nds, newNode];

        // 添加节点后记录历史
        setTimeout(() => {
          const event = new CustomEvent('takeSnapshot', {
            detail: { nodes: [...newNodes], edges: [...edges] }
          });
          document.dispatchEvent(event);
        }, 0);

        return newNodes;
      });
    } catch (error) {
      console.error('粘贴节点时出错:', error);
    }
  }, [edges, initialData?.appId]);
  // endregion

  // region 节点/边操作
  // 删除节点函数
  const deleteNode = useCallback((node: Node) => {
    // 在应用编排模式下（useDefault为false）不允许删除节点
    if (!useDefault) {
      console.warn('在应用编排模式下不允许删除节点');
      return;
    }

    // 开始和结束节点不允许删除
    if (node.type === 'start' || node.type === 'end') {
      console.warn('开始和结束节点不允许删除');
      return;
    }

    // 处理循环节点删除逻辑
    if (node.data?.type === 'LOOP_START' || node.data?.type === 'LOOP_END') {
      // 获取关联的另一个循环节点
      let relatedNodeId = null;

      // 类型断言，将component从unknown转换为具有customDef属性的对象
      const component = node.data?.component as { customDef?: string } | undefined;

      if (node.data?.type === 'LOOP_START' && component?.customDef) {
        try {
          const customDef = JSON.parse(component.customDef);
          relatedNodeId = customDef.loopEndNodeId;
        } catch (e) {
          console.error('解析循环开始节点数据失败:', e);
        }
      }
      else if (node.data?.type === 'LOOP_END' && component?.customDef) {
        try {
          const customDef = JSON.parse(component.customDef);
          relatedNodeId = customDef.loopStartNodeId;
        } catch (e) {
          console.error('解析循环结束节点数据失败:', e);
        }
      }

      // 删除两个节点及相关边
      setNodes((nds: Node[]) => {
        const updatedNodes = nds.filter((n) =>
          n.id !== node.id && n.id !== relatedNodeId
        );
        return updatedNodes;
      });

      setEdges((eds: Edge[]) => {
        const updatedEdges = eds.filter((e) =>
          e.source !== node.id &&
          e.target !== node.id &&
          e.source !== relatedNodeId &&
          e.target !== relatedNodeId
        );
        return updatedEdges;
      });

      // 删除节点后记录历史
      setTimeout(() => {
        const updatedNodes = nodes.filter((n) =>
          n.id !== node.id && n.id !== relatedNodeId
        );
        const updatedEdges = edges.filter((e) =>
          e.source !== node.id &&
          e.target !== node.id &&
          e.source !== relatedNodeId &&
          e.target !== relatedNodeId
        );

        const event = new CustomEvent('takeSnapshot', {
          detail: {
            nodes: [...updatedNodes],
            edges: [...updatedEdges]
          }
        });
        document.dispatchEvent(event);
      }, 0);

      return;
    }

    // 普通节点删除逻辑
    setNodes((nds: Node[]) => nds.filter((n) => n.id !== node.id));
    setEdges((eds: Edge[]) => eds.filter((e) => e.source !== node.id && e.target !== node.id));

    // 删除节点后记录历史
    setTimeout(() => {
      const event = new CustomEvent('takeSnapshot', {
        detail: {
          nodes: [...nodes.filter((n) => n.id !== node.id)],
          edges: [...edges.filter((e) => e.source !== node.id && e.target !== node.id)]
        }
      });
      document.dispatchEvent(event);
    }, 0);
  }, [nodes, edges, useDefault]);
  // 删除边函数
  const deleteEdge = useCallback((edge: Edge) => {
    // 获取当前应用的运行状态
    const { appRuntimeData, currentAppData } = store.getState().ideContainer;
    const currentAppIsRunning = currentAppData?.id && appRuntimeData[currentAppData.id]
      ? appRuntimeData[currentAppData.id].isRunning
      : false;

    // 在运行时禁止删除边
    if (currentAppIsRunning) {
      console.warn('在运行时不允许删除边');
      return;
    }

    setEdges((eds: Edge[]) => eds.filter((e) => e.id !== edge.id));

    // 删除边后记录历史
    setTimeout(() => {
      const event = new CustomEvent('takeSnapshot', {
        detail: {
          nodes: [...nodes],
          edges: [...edges.filter((e) => e.id !== edge.id)]
        }
      });
      document.dispatchEvent(event);
    }, 0);
  }, [nodes, edges]);
  // 在边上添加节点的具体实现
  const addNodeOnEdge = useCallback((nodeType: string, node: any) => {
    const { currentAppData, flowData } = store.getState().ideContainer;
    if (!edgeForNodeAdd || !reactFlowInstance) return;

    // 查找节点定义
    const nodeDefinition = localNodeData.find(n => n.nodeType === nodeType) || node;
    if (!nodeDefinition) return;

    // 特殊处理循环节点，添加开始和结束节点
    if (nodeType === 'LOOP') {
      // 获取源节点和目标节点的位置
      const sourceNode = nodes.find(n => n.id === edgeForNodeAdd.source);
      const targetNode = nodes.find(n => n.id === edgeForNodeAdd.target);

      if (!sourceNode || !targetNode) return;

      // 计算中点位置
      const position = {
        x: (sourceNode.position.x + targetNode.position.x) / 2,
        y: (sourceNode.position.y + targetNode.position.y) / 2
      };

      // 创建循环开始和结束节点
      const loopStartNode = {
        id: `LOOP_START-${Date.now()}`,
        type: 'LOOP',
        position: { x: position.x, y: position.y },
        data: {
          title: '循环开始',
          type: 'LOOP_START',
          parameters: {
            apiIns: [{ name: 'start', desc: '', dataType: '', defaultValue: '' }],
            apiOuts: [{ name: 'done', desc: '', dataType: '', defaultValue: '' }],
            dataIns: [],
            dataOuts: []
          },
          component: {}
        }
      };

      const loopEndNode = {
        id: `LOOP_END-${Date.now()}`,
        type: 'LOOP',
        position: { x: position.x + 400, y: position.y },
        data: {
          title: '循环结束',
          type: 'LOOP_END',
          parameters: {
            apiIns: [{ name: 'continue', desc: '', dataType: '', defaultValue: '' }],
            apiOuts: [{ name: 'break', desc: '', dataType: '', defaultValue: '' }],
            dataIns: [{
              'arrayType': null,
              'dataType': 'INTEGER',
              'defaultValue': 10,
              'desc': '最大循环次数',
              'id': 'maxTime'
            }],
            dataOuts: []
          },
          component: {
            type: 'LOOP_END',
            customDef: JSON.stringify({
              apiOutIds: ['continue', 'break'],
              conditions: [],
              loopStartNodeId: loopStartNode.id
            }),
            loopStartNodeId: loopStartNode.id
          }
        }
      };

      loopStartNode.data.component = {
        type: 'LOOP_START',
        customDef: JSON.stringify({ loopEndNodeId: loopEndNode.id })
      };

      // 创建连接边（连接循环开始和结束节点的顶部连接点）
      const groupEdge = {
        id: `${loopStartNode.id}-${loopEndNode.id}-group`,
        source: loopStartNode.id,
        target: loopEndNode.id,
        sourceHandle: `${loopStartNode.id}-group`,
        targetHandle: `${loopEndNode.id}-group`,
        type: 'custom'
      };

      // 创建连接原有节点到循环开始节点，以及循环结束节点到目标节点的边
      const connectionEdges = [
        {
          id: `e${edgeForNodeAdd.source}-${loopStartNode.id}`,
          source: edgeForNodeAdd.source,
          target: loopStartNode.id,
          sourceHandle: edgeForNodeAdd.sourceHandle,
          targetHandle: 'start', // 循环开始节点的输入句柄
          type: 'custom',
          lineType: 'api',
          data: {
            lineType: 'api'
          }
        },
        {
          id: `e${loopEndNode.id}-${edgeForNodeAdd.target}`,
          source: loopEndNode.id,
          target: edgeForNodeAdd.target,
          sourceHandle: 'break', // 循环结束节点的输出句柄
          targetHandle: edgeForNodeAdd.targetHandle,
          type: 'custom',
          lineType: 'api',
          data: {
            lineType: 'api'
          }
        }
      ];

      // 将未定义的节点动态追加进nodeTypes
      const nodeMap = Array.from(Object.values(nodeTypeMap).map(key => key));
      if (!nodeMap.includes('LOOP')) {
        registerNodeType('LOOP', LoopNode, '循环');
      }

      // 更新节点和边
      setNodes((nds: Node[]) => {
        const newNodes = [...nds, loopStartNode, loopEndNode];

        // 添加节点后记录历史
        setTimeout(() => {
          const event = new CustomEvent('takeSnapshot', {
            detail: { nodes: [...newNodes], edges: [...edges, groupEdge, ...connectionEdges] }
          });
          document.dispatchEvent(event);
        }, 0);

        return newNodes;
      });

      setEdges((eds: Edge[]) => {
        // 删除原来的边，添加新的边
        const updatedEdges = [...eds.filter(e => e.id !== edgeForNodeAdd.id), groupEdge, ...connectionEdges];

        // 添加边后记录历史
        setTimeout(() => {
          const event = new CustomEvent('takeSnapshot', {
            detail: {
              nodes: [...nodes, loopStartNode, loopEndNode],
              edges: [...updatedEdges]
            }
          });
          document.dispatchEvent(event);
        }, 0);

        return updatedEdges;
      });

      // 关闭菜单
      setEdgeForNodeAdd(null);
      setPositionForNodeAdd(null);
      return;
    }

    // 获取源节点和目标节点
    const sourceNode = nodes.find(n => n.id === edgeForNodeAdd.source);
    const targetNode = nodes.find(n => n.id === edgeForNodeAdd.target);

    if (!sourceNode || !targetNode) return;

    // 计算中点位置
    const position = {
      x: (sourceNode.position.x + targetNode.position.x) / 2,
      y: (sourceNode.position.y + targetNode.position.y) / 2
    };

    // 创建新节点
    const newNode = {
      id: `${nodeType}-${Date.now()}`,
      type: nodeType,
      position,
      data: {
        ...nodeDefinition.data,
        title: nodeDefinition.nodeName,
        type: nodeType
      }
    };

    // 有组件ID的节点就追加组件id数据
    if (nodeDefinition.id || nodeDefinition?.flowHousVO?.id) newNode.data.compId = nodeDefinition.id || nodeDefinition?.flowHousVO?.id;

    if (nodeType === 'SWITCH') {
      newNode.data.component = {
        customDef: JSON.stringify({
          apiOutIds: ['default'],
          conditions: []
        })
      };
    }
    else if (nodeType === 'SUB') {
      const flowSubMap = flowData[currentAppData.id]?.subMap || {};
      const sameData: any = flowSubMap[newNode.data.compId];
      if (sameData) {
        newNode.data.component = {
          type: nodeType,
          compId: newNode.data.compId,
          customDef: JSON.stringify({
            dataIns: newNode.data.parameters.dataIns,
            dataOuts: newNode.data.parameters.dataOuts,
            subflowId: sameData,
            name: newNode.data.title
          })
        };
      }
      else {
        newNode.data.component = {
          type: nodeType,
          compId: newNode.data.compId
        };
      }
    }
    else if (nodeType === 'EVENTSEND' || nodeType === 'EVENTLISTENE') {
      const { eventList } = store.getState().ideContainer;
      const emptyEvent = eventList.find(item => item.topic.includes('**empty**'));
      newNode.data.component = {
        type: nodeType,
        customDef: { eventId: emptyEvent.id, name: emptyEvent.name, topic: emptyEvent.topic }
      };
    }
    else if (nodeType === 'BASIC') {
      newNode.data.component = {
        type: nodeType,
        compId: nodeDefinition.id
      };
    }

    // 将未定义的节点动态追加进nodeTypes
    const nodeMap = Array.from(Object.values(nodeTypeMap).map(key => key));
    if (!nodeMap.includes(nodeType)) {
      registerNodeType(nodeType, getNodeComponent(nodeType), nodeDefinition.nodeName);
    }

    // 添加新节点
    setNodes((nds: Node[]) => [...nds, newNode]);

    // 删除旧边
    setEdges((eds: Edge[]) => eds.filter(e => e.id !== edgeForNodeAdd.id));

    // 确定新边的句柄
    // 对于第一条边 (source -> new node): 使用原始边的 sourceHandle，目标句柄根据节点类型确定
    // 对于第二条边 (new node -> target): 源句柄根据节点类型确定，使用原始边的 targetHandle

    // 获取新节点的默认句柄
    let newNodeSourceHandle = 'done'; // 默认源句柄
    let newNodeTargetHandle = 'start'; // 默认目标句柄

    // 如果新节点有参数定义，尝试获取更准确的句柄信息
    if (newNode.data?.parameters) {
      const { apiOuts, apiIns } = newNode.data.parameters;

      // 获取第一个api输出作为源句柄（如果存在）
      if (apiOuts && apiOuts.length > 0) {
        newNodeSourceHandle = apiOuts[0].name || apiOuts[0].id || newNodeSourceHandle;
      }

      // 获取第一个api输入作为目标句柄（如果存在）
      if (apiIns && apiIns.length > 0) {
        newNodeTargetHandle = apiIns[0].name || apiIns[0].id || newNodeTargetHandle;
      }
    }

    // 创建新边: source -> new node, new node -> target
    const newEdges = [
      ...edges.filter(e => e.id !== edgeForNodeAdd.id),
      {
        id: `e${edgeForNodeAdd.source}-${newNode.id}`,
        source: edgeForNodeAdd.source,
        target: newNode.id,
        sourceHandle: edgeForNodeAdd.sourceHandle,
        targetHandle: newNodeTargetHandle,
        type: 'custom',
        lineType: 'api',
        data: {
          lineType: 'api'
        }
      },
      {
        id: `e${newNode.id}-${edgeForNodeAdd.target}`,
        source: newNode.id,
        target: edgeForNodeAdd.target,
        sourceHandle: newNodeSourceHandle,
        targetHandle: edgeForNodeAdd.targetHandle,
        type: 'custom',
        lineType: 'api',
        data: {
          lineType: 'api'
        }
      }
    ];

    setEdges(newEdges);

    // 关闭菜单
    setEdgeForNodeAdd(null);
    setPositionForNodeAdd(null);

    // 添加节点后记录历史
    setTimeout(() => {
      const event = new CustomEvent('takeSnapshot', {
        detail: {
          nodes: [...nodes, newNode],
          edges: [...newEdges]
        }
      });
      document.dispatchEvent(event);
    }, 0);
  }, [edgeForNodeAdd, nodes, reactFlowInstance, edges, addLoopNodeWithStartEnd]);
  // 在画布上添加节点
  const addNodeOnPane = useCallback((nodeType: string, position: { x: number; y: number }, node?: any) => {
    const { currentAppData, flowData } = store.getState().ideContainer;
    if (!reactFlowInstance) return;

    // 查找节点定义
    const nodeDefinition = localNodeData.find(n => n.nodeType === nodeType) || node;
    if (!nodeDefinition) return;

    // 特殊处理循环节点，添加开始和结束节点
    if (nodeType === 'LOOP') {
      addLoopNodeWithStartEnd(position, nodeDefinition);
      return;
    }

    // 创建新节点
    const newNode = {
      id: `${nodeType}-${Date.now()}`,
      type: nodeType,
      position,
      data: {
        ...nodeDefinition.data,
        title: nodeDefinition.nodeName,
        type: nodeType
      }
    };

    if (nodeDefinition.id || nodeDefinition?.flowHousVO?.id) newNode.data.compId = nodeDefinition.id || nodeDefinition?.flowHousVO?.id;

    if (nodeType === 'SWITCH') {
      newNode.data.component = {
        customDef: JSON.stringify({
          apiOutIds: ['default'],
          conditions: []
        })
      };
    }
    else if (nodeType === 'SUB') {
      const flowSubMap = flowData[currentAppData.id]?.subMap || {};
      const sameData: any = flowSubMap[newNode.data.compId];
      if (sameData) {
        newNode.data.component = {
          type: nodeType,
          compId: newNode.data.compId,
          customDef: JSON.stringify({
            dataIns: newNode.data.parameters.dataIns,
            dataOuts: newNode.data.parameters.dataOuts,
            subflowId: sameData,
            name: newNode.data.title
          })
        };
      }
      else {
        newNode.data.component = {
          type: nodeType,
          compId: newNode.data.compId
        };
      }
    }
    else if (nodeType === 'EVENTSEND' || nodeType === 'EVENTLISTENE') {
      const { eventList } = store.getState().ideContainer;
      const emptyEvent = eventList.find(item => item.topic.includes('**empty**'));
      newNode.data.component = {
        type: nodeType,
        customDef: { eventId: emptyEvent?.eventId ?? null, name: emptyEvent.name, topic: emptyEvent.topic }
      };
    }
    else if (nodeType === 'BASIC') {
      newNode.data.component = {
        type: nodeType,
        compId: nodeDefinition.id
      };
    }
    // 将未定义的节点动态追加进nodeTypes
    const nodeMap = Array.from(Object.values(nodeTypeMap).map(key => key));
    // 目前默认添加的都是系统组件/本地组件
    if (!nodeMap.includes(nodeType)) {
      registerNodeType(nodeType, getNodeComponent(nodeType), nodeDefinition.nodeName);
    }

    setNodes((nds: Node[]) => {
      const newNodes = [...nds, newNode];

      // 添加节点后记录历史
      setTimeout(() => {
        const event = new CustomEvent('takeSnapshot', {
          detail: { nodes: [...newNodes], edges: [...edges] }
        });
        document.dispatchEvent(event);
      }, 0);

      return newNodes;
    });
  }, [reactFlowInstance, edges, addLoopNodeWithStartEnd]);
  // 处理添加节点的统一方法
  const handleAddNode = useCallback((nodeType: string, node: any) => {
    // 如果是通过边添加节点
    if (edgeForNodeAdd) {
      addNodeOnEdge(nodeType, node);
    }
    // 如果是通过画布添加节点
    else if (positionForNodeAdd) {
      addNodeOnPane(nodeType, positionForNodeAdd, node);
    }

    // 清除状态
    setEdgeForNodeAdd(null);
    setPositionForNodeAdd(null);
  }, [edgeForNodeAdd, positionForNodeAdd, addNodeOnEdge, addNodeOnPane]);
  // endregion


  const saveFlowDataToServer = useCallback(async () => {
    if (useDefault) {
      try {
        // 首先校验所有节点数据是否完整
        const nodeValidation = validateAllNodes(nodes);
        if (!nodeValidation.isValid) {
          showValidationErrors(nodeValidation.errors);
          return;
        }

        // 然后校验所有连接线是否有效
        const edgeValidation = validateAllEdges(edges, nodes);
        if (!edgeValidation.isValid) {
          showValidationErrors(edgeValidation.errors);
          return;
        }
        // 转换会原始数据类型
        const revertedData = revertFlowData(nodes, edges);
        const upDatePublishCB = await upDatePublish(revertedData.nodeConfigs);
        const newRevertedData = reverseConvertFlowData(nodes, edges, upDatePublishCB);
        const { flowData, currentAppData, info } = store.getState().ideContainer;
        const { deleteEventSendNodeList, deleteEventlisteneList } = handelEventNodeList(newRevertedData);

        let params = {};
        // 更新复合组件/子流程
        if (currentAppData.key.includes('sub')) {
          const appEventDefinition = updateEvent(revertedData.nodeConfigs, initialData.appId);
          params = {
            ...currentAppData?.compData || {},
            components: newRevertedData,
            appEventDefinition,
            sceneId: info.id
          };
          const res: any = await setSubFlowNew(params, currentAppData.parentAppId);
          if (res.code === 200) {
            Message.success('保存成功');
            // 更新事件枚举表
            const res1: any = await queryEventItemBySceneIdOld(info.id);
            if (res1.code === 200) dispatch(updateEventListOld(res1.data));

            // 更新缓存数据 - 与主流程保持一致
            dispatch(updateCanvasDataMap({
              ...canvasDataMap,
              [currentAppData.id]: { nodes, edges }
            }));
            const appRes: any = await getAppInfoNew(currentAppData.id);
            // 更新 flowData 中的数据
            dispatch(updateFlowData({ [currentAppData.id]: appRes.data }));
            // 同步更新到 canvasDataMap
            if (appRes.data.main?.components) {
              const { nodes, edges } = convertFlowData(appRes.data.main.components, true);
              setNodes(nodes);
              setEdges(edges);
              dispatch(updateCanvasDataMap({
                ...canvasDataMap,
                [currentAppData.id]: { nodes, edges }
              }));
            }
          }
          else {
            Message.error(res.message);
          }
        }
        // 更新主流程
        else {
          const appEventDefinition = updateEvent(revertedData.nodeConfigs, initialData.appId);
          params = {
            ...flowData[currentAppData.id]?.main || {},
            components: newRevertedData,
            appEventDefinition,
            sceneId: info.id
          };
          const res: any = await setMainFlowNew(params, initialData.appId);
          if (res.code === 200) {
            Message.success('保存成功');
            // 更新事件枚举表
            const res1: any = await queryEventItemBySceneIdOld(info.id);
            if (res1.code === 200) dispatch(updateEventListOld(res1.data));

            // 更新缓存数据
            dispatch(updateCanvasDataMap({
              ...canvasDataMap,
              [currentAppData.id]: { nodes, edges }
            }));
            const appRes: any = await getAppInfoNew(currentAppData.id);
            // 更新 flowData 中的数据
            dispatch(updateFlowData({ [currentAppData.id]: appRes.data }));
            // 同步更新到 canvasDataMap
            if (appRes.data.main?.components) {
              const { nodes, edges } = convertFlowData(appRes.data.main.components, true);
              setNodes(nodes);
              setEdges(edges);
              dispatch(updateCanvasDataMap({
                ...canvasDataMap,
                [currentAppData.id]: { nodes, edges }
              }));
            }
          }
          else {
            Message.error(res.message);
          }
        }

        // 事件节点变动数据有长度就通知后端，主流程和子流程(复合节点)通用
        if (deleteEventSendNodeList.length > 0 || deleteEventlisteneList.length > 0) {
          deleteEventSendNodeList.length > 0 && deleteEventPub({
            appId: currentAppData.id,
            topics: deleteEventSendNodeList
          });
          deleteEventlisteneList.length > 0 && deleteEventSub({
            appId: currentAppData.id,
            topics: deleteEventlisteneList
          });
        }
      } catch (error) {
        console.error('Error saving flow data:', error);
        Message.error('保存失败');
      }
    }
    else {
      const appFlowParams = {
        appEventList: {},
        eventEdges: []
      };

      nodes.forEach(node => {
        appFlowParams.appEventList[node.id] = {
          x: node.position.x,
          y: node.position.y
        };
      });

      const eventMap = new Map();
      edges.forEach((edge: any) => {

        // 处理事件连线
        appFlowParams.eventEdges.push({
          id: edge.id,
          source: edge.source,
          target: edge.target,
          lineType: 'data',
          data: {
            displayData: {
              ...edge.data.displayData
            }
          }
        });

        // 应用组件的桩点id就是事件id
        const sourceId = edge.sourceHandle;
        const targetId = edge.targetHandle;
        const topic = edge.data.displayData.topic;

        if (eventMap.has(topic)) {
          // 如果topic已存在，将eventId添加到数组中
          eventMap.get(topic).eventId.push(sourceId);
          eventMap.get(topic).eventId.push(targetId);
        }
        else {
          // 如果topic不存在，创建新的条目
          eventMap.set(topic, {
            eventId: [sourceId, targetId],
            topic: topic
          });
        }
      });
      // 对eventId数组进行去重处理
      const appEventParams = Array.from(eventMap.values()).map(item => ({
        ...item,
        eventId: Array.from(new Set(item.eventId))
      }));
      try {
        updateAppFlowData(appFlowParams);
        if (appEventParams.length > 0) {
          for (const item of appEventParams) {
            await sleep(500);
            await updateAppEventChannel(item);
          }
        }

        Message.success('保存成功');
      } catch (error) {
        console.error('保存失败:', error);
        Message.error('保存失败: ' + (error.message));
      }
    }
  }, [nodes, edges, initialData?.appId]);
  // 运行处理函数
  const handleRun = useCallback(async (running: boolean) => {
    const { currentAppData, socketId, appRuntimeData } = store.getState().ideContainer;
    if (running) {
      // 启动运行
      const params = {
        appId: currentAppData.id,
        socketId
      };
      const res: any = await runMainFlow(params);
      if (res.code === 200) {
        // 设置运行状态为true
        dispatch(updateIsRunning(true));

        // 重置节点状态
        dispatch(resetNodeStatus());

        // 更新运行ID
        dispatch(updateRuntimeId(res.data));

        // 开始运行时动画
        setEdges((eds) => eds.map(edge => ({
          ...edge,
          data: {
            ...edge.data,
            isRunning: true,
            animationProgress: 0
          }
        })));
      }
      else {
        Message.error(res.message);
      }
    }
    else {
      // 设置运行状态为false
      dispatch(updateIsRunning(false));

      await stopApp(appRuntimeData[currentAppData.id].runId);
      // 更新运行ID
      dispatch(updateRuntimeId(''));

      // 停止运行
      setEdges((eds) => eds.map(edge => ({
        ...edge,
        data: {
          ...edge.data,
          isRunning: false,
          animationProgress: 0
        }
      })));

      // 清空当前应用的运行日志
      dispatch(clearRuntimeLogs({ appId: currentAppData.id }));
    }
  }, [initialData?.appId]);

  return {
    // Event handlers
    onNodesChange,
    onEdgesChange,
    onConnect,
    onReconnect,
    onDragOver,
    onDrop,
    onNodeDrag,
    onNodeDragStop,
    onNodesDelete,

    // Menu handlers
    closeEditModal,
    saveNodeEdit,
    deleteNode,
    deleteEdge,
    editNode,
    editEdge,
    copyNode,
    pasteNode, // 添加粘贴节点功能

    // Node operations
    addNodeOnEdge,
    addNodeOnPane,
    handleAddNode,

    // Initialization
    initializeCanvasData,
    updateCanvasDataMapEffect,

    // Actions
    saveFlowDataToServer,
    handleRun
  };
};
export default useFlowCallbacks;