refactor(ide): 事件相关功能重构新结构数据

src/hooks/useFlowCallbacks.ts

@@ -15,7 +15,7 @@ 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 } from '@/store/ideContainer';
+import { updateCanvasDataMap, resetNodeStatus, updateIsRunning, updateEventListOld } from '@/store/ideContainer';
 import {
   validateAllNodes,
   showValidationErrors,
@@ -30,10 +30,11 @@ import { projectFlowHandle } from '@/pages/flowEditor/utils/projectFlowHandle';
 import { appFLowHandle } from '@/pages/flowEditor/utils/appFlowhandle';
 
 import { Dispatch } from 'redux';
-import { runMainFlow } from '@/api/apps';
+import { runMainFlow, stopApp } from '@/api/apps';
 import store from '@/store';
 import { updateAppEvent, updateAppEventChannel, updateAppFlowData } from '@/api/appEvent';
 import { sleep } from '@/utils/common';
+import { queryEventItemBySceneIdOld } from '@/api/event';
 
 export const useFlowCallbacks = (
   nodes: Node[],
@@ -1004,7 +1005,7 @@ export const useFlowCallbacks = (
       const emptyEvent = eventList.find(item => item.topic.includes('**empty**'));
       newNode.data.component = {
         type: nodeType,
-        customDef: { eventId: emptyEvent.eventId, name: emptyEvent.name, topic: emptyEvent.topic }
+        customDef: { eventId: emptyEvent?.eventId ?? null, name: emptyEvent.name, topic: emptyEvent.topic }
       };
     }
     // 将未定义的节点动态追加进nodeTypes
@@ -1080,27 +1081,29 @@ export const useFlowCallbacks = (
           // 事件接收节点
           params.eventListenes.push({
             nodeName: nodeConfig.nodeName || '',
-            eventId: eventConfig?.eventId || '',
+            eventId: eventConfig?.eventId || null,
             topic: eventConfig?.topic || '',
             eventName: eventConfig?.name || '',
-            dataOuts: nodeConfig.dataOuts || []
+            dataOuts: nodeConfig.dataOuts || [],
+            nodeId: nodeConfig.nodeId
           });
         }
         else if (nodeType === 'EVENTSEND') {
           // 事件发送节点
           params.eventSends.push({
             nodeName: nodeConfig.nodeName || '',
-            eventId: eventConfig?.eventId || '',
+            eventId: eventConfig?.eventId || null,
             topic: eventConfig?.topic || '',
             eventName: eventConfig?.name || '',
-            dataIns: nodeConfig.dataIns || []
+            dataIns: nodeConfig.dataIns || [],
+            nodeId: nodeConfig.nodeId
           });
         }
       }
     });
     // 调用更新事件的API
     if (params.eventListenes.length > 0 || params.eventSends.length > 0) {
-      updateAppEvent(appid, params);
+      return params;
     }
   };
   const upDatePublish = async (revertedData) => {
@@ -1139,20 +1142,23 @@ export const useFlowCallbacks = (
         const revertedData = revertFlowData(nodes, edges);
         const upDatePublishCB = await upDatePublish(revertedData.nodeConfigs);
         const newRevertedData = reverseConvertFlowData(nodes, edges, upDatePublishCB);
-        const { flowData, currentAppData } = store.getState().ideContainer;
-        // console.log('revertedData:', revertedData);
-        // console.log('newRevertedData:', newRevertedData);
+        const { flowData, currentAppData, info } = store.getState().ideContainer;
         let params = {};
         // 更新复合组件/子流程
         if (currentAppData.key.includes('sub')) {
+          const appEventDefinition = updateEvent(revertedData.nodeConfigs, initialData.appId);
           params = {
             ...currentAppData?.compData || {},
-            components: newRevertedData
+            components: newRevertedData,
+            appEventDefinition,
+            sceneId: info.id
           };
-          updateEvent(revertedData.nodeConfigs, currentAppData.parentAppId);
           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));
           }
           else {
             Message.error(res.message);
@@ -1160,14 +1166,19 @@ export const useFlowCallbacks = (
         }
         // 更新主流程
         else {
+          const appEventDefinition = updateEvent(revertedData.nodeConfigs, initialData.appId);
           params = {
             ...flowData[currentAppData.id]?.main || {},
-            components: newRevertedData
+            components: newRevertedData,
+            appEventDefinition,
+            sceneId: info.id
           };
-          updateEvent(revertedData.nodeConfigs, initialData.appId);
           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));
           }
           else {
             Message.error(res.message);
@@ -1196,33 +1207,45 @@ export const useFlowCallbacks = (
 
       const eventMap = new Map();
       edges.forEach((edge: any) => {
-        const eventId = edge.data.displayData.eventId;
-        const dto = {
-          eventId: eventId,
-          topicDTO: {
-            topic: edge.data.displayData.topic,
-            eventName: edge.data.displayData.name
-          }
-        };
-        eventMap.set(eventId, dto);
+        // 应用组件的桩点id就是事件id
+        const sourceId = edge.source;
+        const targetId = edge.target;
+        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
+          });
+        }
       });
-      const appEventParams = Array.from(eventMap.values());
+      // 对eventId数组进行去重处理
+      const appEventParams = Array.from(eventMap.values()).map(item => ({
+        ...item,
+        eventId: Array.from(new Set(item.eventId))
+      }));
+
+      console.log('appEventParams:', appEventParams);
 
       updateAppFlowData(appFlowParams);
       if (appEventParams.length > 0) {
         for (const item of appEventParams) {
-          console.log('item:', item);
           await sleep(500);
           updateAppEventChannel(item);
         }
       }
-
     }
   }, [nodes, edges, initialData?.appId]);
   // 运行处理函数
   const handleRun = useCallback(async (running: boolean) => {
+    const { currentAppData, socketId } = store.getState().ideContainer;
     if (running) {
-      const { currentAppData, socketId } = store.getState().ideContainer;
       // 启动运行
       const params = {
         appId: currentAppData.id,
@@ -1250,6 +1273,8 @@ export const useFlowCallbacks = (
       // 设置运行状态为false
       dispatch(updateIsRunning(false));
 
+      stopApp(currentAppData.id);
+
       // 停止运行
       setEdges((eds) => eds.map(edge => ({
         ...edge,

src/pages/ideContainer/index.tsx

@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useRef } from 'react';
 import { useSelector, useDispatch } from 'react-redux';
-import { updateSocketId, updateNodeStatus, updateIsRunning, resetNodeStatus } from '@/store/ideContainer';
+import { updateSocketId, updateNodeStatus, updateEventListOld } from '@/store/ideContainer';
 import useWebSocket from '@/hooks/useWebSocket';
 import { isJSON, getUrlParams } from '@/utils/common';
 
@@ -31,7 +31,7 @@ import ComponentDeployment from '@/pages/componentDevelopment/componentDeploymen
 import ComponentTest from '@/pages/componentDevelopment/componentTest';
 import { getUserToken } from '@/api/user';
 import { Message } from '@arco-design/web-react';
-import { queryEventItemBySceneId } from '@/api/event';
+import { queryEventItemBySceneId, queryEventItemBySceneIdOld } from '@/api/event';
 
 type UrlParamsOptions = {
   identity?: string;
@@ -220,7 +220,9 @@ function IDEContainer() {
 
   const getEvent = async () => {
     const res: any = await queryEventItemBySceneId(urlParams.id);
+    const res1: any = await queryEventItemBySceneIdOld(urlParams.id);
     if (res.code === 200) dispatch(updateEventList(res.data));
+    if (res1.code === 200) dispatch(updateEventListOld(res1.data));
   };
 
   useEffect(() => {

src/pages/ideContainer/sideBar.tsx

@@ -17,11 +17,12 @@ import { menuData1, menuData2 } from './config/menuData';
 import { IconSearch, IconPlus } from '@arco-design/web-react/icon';
 import { Selected } from '@/pages/ideContainer/types';
 import { useDispatch, useSelector } from 'react-redux';
-import { updateMenuData, updateFlowData, updateCurrentAppData } from '@/store/ideContainer';
+import { updateMenuData, updateFlowData, updateCurrentAppData, updateEventListOld } from '@/store/ideContainer';
 import { addApp, getProjectEnv, editApp, deleteApp } from '@/api/apps';
 import _ from 'lodash';
 import { getAppInfoNew } from '@/api/appRes';
 import { getAppEventData } from '@/api/appEvent';
+import { queryEventItemBySceneIdOld } from '@/api/event';
 
 const TreeNode = Tree.Node;
 const FormItem = Form.Item;
@@ -191,7 +192,7 @@ const SideBar: React.FC<SideBarProps> = ({
   }); // 添加右键菜单状态
   const resizeBoxRef = useRef<HTMLDivElement>(null); // 引用第一个 ResizeBox 容器
   const contextMenuRef = useRef<HTMLDivElement>(null); // 右键菜单引用
-  const { menuData } = useSelector(state => state.ideContainer);
+  const { menuData, info } = useSelector(state => state.ideContainer);
   const dispatch = useDispatch();
 
   function getMenuData(): MenuItemType[] {
@@ -429,6 +430,9 @@ const SideBar: React.FC<SideBarProps> = ({
         newMenu[activeKey] = { ...newMenu[activeKey], children: currentMenu[index].children };
         return newMenu;
       });
+      // 获取最新的事件枚举表
+      const res1: any = await queryEventItemBySceneIdOld(info.id);
+      if (res1.code === 200) dispatch(updateEventListOld(res1.data));
     }
   };
 

src/pages/orchestration/application/index.tsx

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react';
 import FlowEditor from '@/pages/flowEditor/index';
 import { useSelector, useDispatch } from 'react-redux';
 import { getAppEventList } from '@/api/appEvent';
-import { getTopicList } from '@/api/event';
+import { getTopicList, queryEventItemBySceneId } from '@/api/event';
 import { updateEventTopicList } from '@/store/ideContainer';
 
 const ApplicationContainer = () => {
@@ -16,12 +16,14 @@ const ApplicationContainer = () => {
   };
 
   const getEventList = async () => {
-    const res: any = await getTopicList(info.id);
+    const res: any = await queryEventItemBySceneId(info.id);
 
     if (res.code === 200) {
-      dispatch(updateEventTopicList(res.data.map(v => {
-        return { label: v.eventName, value: v.topic };
-      })));
+      dispatch(updateEventTopicList(res.data
+        .filter(v => !v.topic.includes('**empty**')) // 过滤掉topic包含**empty**的项目
+        .map(v => {
+          return { label: v.name, value: v.topic };
+        })));
     }
   };
 

src/store/ideContainer.ts

@@ -8,6 +8,7 @@ interface IDEContainerState {
   canvasDataMap: any;
   projectComponentData: any;
   currentAppData: any;
+  eventListOld: any;
   eventList: any;
   eventTopicList: any;
   logBarStatus?: boolean;
@@ -24,6 +25,7 @@ const initialState: IDEContainerState = {
   canvasDataMap: {}, // 每个画布的缓存信息
   projectComponentData: {}, // 工程下的组件列表
   currentAppData: {}, // 当前选中的应用数据
+  eventListOld: [], // 工程下的事件列表
   eventList: [], // 工程下的事件列表
   eventTopicList: [], // 应用编排使用的事件名和topic列表
   logBarStatus: false,
@@ -58,6 +60,9 @@ const ideContainerSlice = createSlice({
     updateEventList(state, action) {
       state.eventList = action.payload;
     },
+    updateEventListOld(state, action) {
+      state.eventListOld = action.payload;
+    },
     updateEventTopicList(state, action) {
       state.eventTopicList = action.payload;
     },
@@ -98,6 +103,7 @@ export const {
   updateProjectComponentData,
   updateCurrentAppData,
   updateEventList,
+  updateEventListOld,
   updateEventTopicList,
   updateLogBarStatus,
   updateSocketId,