@riil-frontend/component-topology 12.1.0-dev.9 → 13.0.0-dev.1

package/es/core/editor/components/Sidebar/views/ImagePanel/ImagePanel.js

@@ -4,6 +4,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _Button from "@alifd/next/es/button";
 import _Icon from "@alifd/next/es/icon";
 import React, { useMemo, useState } from 'react';
+import NoDataPage from '@riil-frontend/component-no-data-page';
 import Collapse from "../../../../../../components/collapse/Collapse";
 import CiTypeImagePanel from "./CiTypeImagePanel";
 import CustomImagePanel from "./CustomImagePanel";
@@ -106,12 +107,16 @@ export default function ImagePanel(props) {
     }].filter(function (panel) {
       return !panel.hidden;
     });
+
+    if (!panels.length) {
+      return /*#__PURE__*/React.createElement(NoDataPage, null);
+    }
+
     return /*#__PURE__*/React.createElement(Collapse, {
       accordion: true,
       defaultExpandedKeys: ['资源图片'],
       style: {
-        border: 'none',
-        minWidth: '300px'
+        border: 'none'
       },
       fullheight: true,
       noContentPadding: true
@@ -140,6 +145,9 @@ export default function ImagePanel(props) {
       width: '100%'
     }
   })), /*#__PURE__*/React.createElement(_Box, {
-    flex: 1
+    flex: 1,
+    style: {
+      minWidth: '300px'
+    }
   }, renderImageContent()));
 }

package/es/core/editor/components/Toolbar/widgets/EdgeColorButton/EdgeColorButton.js

@@ -36,14 +36,14 @@ function EdgeColorButton(props) {
     });
   };
 
-  var getCustomLines = function getCustomLines(list) {
+  var getLines = function getLines(list) {
     return list.filter(isCustomEdge);
   };
 
   useEffect(function () {
     if (graphLoaded) {
       var edges = getEdgesBySelection(topo);
-      var list = getCustomLines(edges);
+      var list = getLines(edges);
       setLineWidth(1); // eslint-disable-next-line eqeqeq
 
       if (selection.length == 1 && list.length === 1) {

package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.js

@@ -32,11 +32,21 @@ var LINE_TYPE_OPTIONS = [{
   value: 'doublearc',
   label: '双弧线',
   icon: 'topo_linear_icon_arcline'
-}, {
-  value: 'points',
-  label: '自由线形',
-  icon: 'topo_linear_icon_pointsline'
-}];
+} // {
+//   value: 'points',
+//   label: '自由线形',
+//   icon: 'topo_linear_icon_pointsline',
+// },
+];
+
+if (localStorage.getItem('topo.test.edge.customType') === 'true') {
+  LINE_TYPE_OPTIONS.push({
+    value: 'points',
+    label: '自由线形',
+    icon: 'topo_linear_icon_pointsline'
+  });
+}
+
 var LineType = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var value = props.value,
       onChange = props.onChange,

package/es/core/editor/components/Toolbar/widgets/FontFamilyWidget.js

@@ -1,8 +1,33 @@
 import React, { useState, useEffect } from 'react';
-import FontFamilySelect from "./components/FontFamilySelect";
-import textStyleSettingRouter from "./components/textStyleSetting/textStyleSettingRouter";
+import DropdownMenu from "./components/DropdownMenu";
+import textStyleSettingRouter from "./components/textStyleSetting/textStyleSettingRouter.js";
 import WidgetBox from "./WidgetBox";
 
+function FontFamilySelect(props) {
+  var value = props.value,
+      onChange = props.onChange;
+  var items = ['宋体', '微软雅黑', '黑体', 'Arial'];
+  return /*#__PURE__*/React.createElement(DropdownMenu, {
+    value: (items.includes(value) ? value : null) || '',
+    valueRender: function valueRender(val) {
+      return /*#__PURE__*/React.createElement("div", {
+        style: {
+          width: 48
+        }
+      }, val || '微软雅黑');
+    },
+    onSelect: onChange
+  }, items.map(function (item) {
+    return /*#__PURE__*/React.createElement(DropdownMenu.Item, {
+      key: item
+    }, /*#__PURE__*/React.createElement("div", {
+      style: {
+        fontFamily: item
+      }
+    }, item));
+  }));
+}
+
 function FontFamilyWidget(props) {
   var topo = props.topo,
       showLabel = props.showLabel,

package/es/core/editor/components/Toolbar/widgets/FontSizeWidget.js

@@ -1,8 +1,33 @@
-import React, { useEffect } from 'react';
-import FontSizeSelect from "./components/FontSizeSelect";
-import textStyleSettingRouter from "./components/textStyleSetting/textStyleSettingRouter";
+import React, { useEffect, useState } from 'react';
+import DropdownMenu from "./components/DropdownMenu";
+import textStyleSettingRouter from "./components/textStyleSetting/textStyleSettingRouter.js";
 import WidgetBox from "./WidgetBox";
 
+function FontSizeSelect(props) {
+  var value = props.value,
+      disabled = props.disabled,
+      onChange = props.onChange;
+  var items = [12, 14, 16, 18, 20, 24, 30, 36, 48, 60, 80];
+  return /*#__PURE__*/React.createElement(DropdownMenu, {
+    value: "" + (value || ''),
+    valueRender: function valueRender(val) {
+      return /*#__PURE__*/React.createElement("div", {
+        style: {
+          width: 18
+        }
+      }, val || 20);
+    },
+    disabled: disabled,
+    onSelect: function onSelect(val) {
+      return onChange(parseInt(val, 10));
+    }
+  }, items.map(function (item) {
+    return /*#__PURE__*/React.createElement(DropdownMenu.Item, {
+      key: item
+    }, item);
+  }));
+}
+
 function FontSizeWidget(props) {
   var topo = props.topo,
       showLabel = props.showLabel,

package/es/core/editor/components/Toolbar/widgets/FontStyleButton.js

@@ -1,7 +1,26 @@
 import React, { useState, useEffect } from 'react';
-import FontStyleSelect from "./components/FontStyleSelect";
-import textStyleSettingRouter from "./components/textStyleSetting/textStyleSettingRouter";
+import variables from '@alifd/theme-19926/variables.js';
+import { isText } from "../../../../../utils/htElementUtils";
+import DropdownMenu from "./components/DropdownMenu";
+import textStyleSettingRouter from "./components/textStyleSetting/textStyleSettingRouter.js";
 import WidgetBox from "./WidgetBox";
+import Tooltip from "../components/Tooltip";
+var items = [{
+  key: 'bold',
+  label: '加粗',
+  icon: 'bold',
+  tooltip: '加粗'
+}, {
+  key: 'italic',
+  label: '斜体',
+  icon: 'Italics',
+  tooltip: '斜体'
+}, {
+  key: 'underline',
+  label: '下划线',
+  icon: 'Underline',
+  tooltip: '下划线'
+}];
 
 function buildValue(obj) {
   return Object.keys(obj).filter(function (key) {
@@ -70,12 +89,39 @@ function FontStyleButton(props) {
     tooltip: "\u6587\u5B57\u6837\u5F0F\uFF08\u52A0\u7C97\u3001\u659C\u4F53\u3001\u4E0B\u5212\u7EBF\uFF09",
     disabled: disabled,
     showLabel: showLabel
-  }, /*#__PURE__*/React.createElement(FontStyleSelect, {
+  }, /*#__PURE__*/React.createElement(DropdownMenu, {
     value: value,
+    valueRender: function valueRender() {
+      return /*#__PURE__*/React.createElement("img", {
+        src: "/img/topo/editor/toolbar/bold/" + (disabled ? 'Disable' : 'Normal') + ".svg",
+        alt: ""
+      });
+    },
+    multiple: true,
     disabled: disabled,
-    fieldDisabled: fieldDisabled,
-    onChange: handleSelect
-  }));
+    onSelect: handleSelect
+  }, items.map(function (item) {
+    return /*#__PURE__*/React.createElement(DropdownMenu.Item, {
+      key: item.key,
+      disabled: fieldDisabled[item.key]
+    }, /*#__PURE__*/React.createElement(Tooltip, {
+      trigger: /*#__PURE__*/React.createElement("div", {
+        style: {
+          display: 'flex',
+          alignItems: 'center'
+        }
+      }, /*#__PURE__*/React.createElement("img", {
+        src: "/img/topo/editor/toolbar/" + item.icon + "/" + (fieldDisabled[item.key] ? 'Disable' : 'Normal') + ".svg",
+        alt: ""
+      }), /*#__PURE__*/React.createElement("span", {
+        style: fieldDisabled[item.key] ? {} : {
+          color: variables['$color-text1-4']
+        }
+      }, item.label)),
+      align: "r",
+      popupStyle: {}
+    }, item.tooltip));
+  })));
 }
 
 export default textStyleSettingRouter(FontStyleButton, {

package/es/core/editor/utils/edgeTypeStyleUtil.js

@@ -1,4 +1,4 @@
-import { getEdges, getEdgesBetweenNodes, isEdgeVisible } from "../../../utils/htElementUtils";
+import { getEdges, getEdgesBetweenNodes } from "../../../utils/htElementUtils";
 var ht = window.ht;
 export function getEdgesBySelection(topo) {
   var getChildrenNodeIds = function getChildrenNodeIds(nodes) {
@@ -14,14 +14,6 @@ export function getEdgesBySelection(topo) {
     return nodeIds;
   };
 
-  function getVisibleEdgesInNodes(gv, nodes) {
-    var nodeIds = getChildrenNodeIds(nodes);
-    var dm = gv.getDataModel();
-    return getEdges(dm).filter(function (edge) {
-      return nodeIds.includes(edge.getSource().getId()) && nodeIds.includes(edge.getTarget().getId());
-    }).filter(isEdgeVisible);
-  }
-
   var getSelectedEdges = function getSelectedEdges(gv) {
     var selection = gv.getSelectionModel().getSelection().toArray(); // 选中的连线
 
@@ -32,8 +24,14 @@ export function getEdgesBySelection(topo) {
     var nodes = selection.filter(function (element) {
       return element instanceof ht.Node;
     });
-    getVisibleEdgesInNodes(gv, nodes).forEach(function (edge) {
-      if (!edges.find(function (item) {
+    var nodeIds = getChildrenNodeIds(nodes);
+    var dm = gv.getDataModel();
+    getEdges(dm).forEach(function (edge) {
+      if (nodeIds.find(function (nodeId) {
+        return nodeId === edge.getSource().getId();
+      }) && nodeIds.find(function (nodeId) {
+        return nodeId === edge.getTarget().getId();
+      }) && !edges.find(function (item) {
         return item === edge;
       })) {
         edges.push(edge);
@@ -79,6 +77,29 @@ export function isNodeAllEdges(topo) {
   });
   return inEdges;
 }
+/**
+ * 遍历连线及子连线
+ * @param {*} topo 
+ * @param {*} edges 
+ * @param {*} operateEdgeFn 
+ */
+
+export function loopEdgesAndChildren(topo, edges, operateEdgeFn) {
+  var htTopo = topo.getHtTopo();
+  edges.forEach(function (edge) {
+    operateEdgeFn(edge);
+
+    if (edge.isEdgeGroupAgent()) {
+      // 连线组折叠时同时设置子连线
+      var edgeChildren = edge.getEdgeGroup().getEdges().toArray();
+      htTopo.toggleEdgeGroup(edge.getSource(), edge.getTarget(), true);
+      edgeChildren.forEach(function (edgeChild) {
+        operateEdgeFn(edgeChild);
+      });
+      htTopo.toggleEdgeGroup(edge.getSource(), edge.getTarget(), false);
+    }
+  });
+}
 /**
  * 设置连线及子连线。带回退事务控制
  * @param {*} topo 

package/es/core/hooks/useTopoEdit.js

@@ -95,6 +95,10 @@ var useTopoEdit = function useTopoEdit(params) {
             return topoDispatchers.setTopoType(TPL_TREE);
 
           case 7:
+            // 更新配置
+            // resourceConfig.updateConfig(config);
+            // 更新配置对应的资源、链路
+            // editDispatchers.fetchDataByConfig();
             topo.historyManager.endTransaction();
 
           case 8:

package/es/core/models/TopoApp.js

@@ -10,7 +10,7 @@ import Alarm from "./Alarm";
 import TopoGraphView from "./TopoGraphView";
 import createStore from "../store/createStore";
 import buildProvider from "../components/buildProvider";
-import { getEdgeDatas, getGroupDatas, getNodeData, getNodeDatas, getNodes } from "../../utils/htElementUtils";
+import { getEdgeDatas, getGroupDatas, getNodeData, getNodeDatas, getNodes as _getNodes } from "../../utils/htElementUtils";
 import Test from "../test/Test";
 import { formatGroups } from "../../utils/topoData";
 import DictCache from "./cache/DictCache";
@@ -24,7 +24,7 @@ import ElementTagTipConfig from "./tagstips/ElementTagTipConfig";
 import SelectionModel from "./SelectionModel";
 import CiCache from "./cache/CiCache"; // eslint-disable-next-line no-undef
 
-var version = typeof "12.1.0-dev.9" === 'string' ? "12.1.0-dev.9" : null;
+var version = typeof "13.0.0-dev.1" === 'string' ? "13.0.0-dev.1" : null;
 console.info("\u62D3\u6251\u7248\u672C: " + version);
 /**
  * 拓扑显示和编辑
@@ -188,29 +188,38 @@ var Topo = /*#__PURE__*/function () {
 
   _proto.getData = function getData() {
     return {
-      groups: getGroupDatas(this.getDataModel()),
-      nodes: getNodes(this.getDataModel()).filter(function (node) {
-        return !!node.getTag();
-      }).map(getNodeData),
+      groups: this.getGroups(),
+      nodes: this.getNodes(),
+      lines: this.getLines(),
       customNodes: getNodeDatas(this.getDataModel()).filter(function (item) {
         return !item.id;
       }),
-      lines: getEdgeDatas(this.getDataModel()).filter(function (item) {
-        return !!item.id;
-      }),
-      customLines: getEdgeDatas(this.getDataModel()).filter(function (item) {
+      customLines: this.getEdges().filter(function (item) {
         return !item.id;
       })
     };
-  }
-  /**
-   * @deprecated 待移除。uicbb有使用
-   * @returns 
-   */
-  ;
+  };
+
+  _proto.getGroups = function getGroups() {
+    return getGroupDatas(this.getDataModel());
+  };
+
+  _proto.getNodes = function getNodes() {
+    var nodes = _getNodes(this.getDataModel()).filter(function (node) {
+      return !!node.getTag();
+    });
+
+    return nodes.map(getNodeData);
+  };
 
   _proto.getLines = function getLines() {
-    return this.getData().lines;
+    return this.getEdges().filter(function (item) {
+      return !!item.id;
+    });
+  };
+
+  _proto.getEdges = function getEdges() {
+    return getEdgeDatas(this.getDataModel());
   }
   /**
    * 全量更新数据
@@ -269,19 +278,18 @@ var Topo = /*#__PURE__*/function () {
   /*#__PURE__*/
   function () {
     var _addElements = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5(elements) {
-      var prevData, data;
+      var data;
       return _regeneratorRuntime.wrap(function _callee5$(_context5) {
         while (1) switch (_context5.prev = _context5.next) {
           case 0:
-            prevData = this.getData();
             data = {
-              groups: [].concat(prevData.groups, elements.groups || []),
-              nodes: [].concat(prevData.nodes, elements.nodes || []),
-              lines: [].concat(prevData.lines, elements.lines || [])
+              groups: [].concat(this.getGroups(), elements.groups || []),
+              nodes: [].concat(this.getNodes(), elements.nodes || []),
+              lines: [].concat(this.getLines(), elements.lines || [])
             };
             this.updateElements(data); // TODO 更新store，触发属性、指标模型加载，更新指标
 
-          case 3:
+          case 2:
           case "end":
             return _context5.stop();
         }

package/es/core/models/utils/linkUtils.js

@@ -2,9 +2,10 @@ import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _extends from "@babel/runtime/helpers/extends";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import keyBy from "lodash/keyBy";
-import _ from "lodash"; // 查询所有连线
+import _ from "lodash";
+import { queryCisByIds, queryModelAsset } from "../../services"; // 查询所有连线
 
-import { getEdges, isEdgeGroup } from "../../../utils/htElementUtils";
+import { getEdges } from "../../../utils/htElementUtils";
 import CiTypeCache from "../cache/CiTypeCache";
 import CiCache from "../cache/CiCache"; // const interfaceTypeMap = {
 //   "network.interface": {
@@ -31,20 +32,7 @@ export function isCrucialLink(link) {
  */
 
 export function isExitLink(link) {
-  var _link$attributes;
-
-  return (link === null || link === void 0 ? void 0 : (_link$attributes = link.attributes) === null || _link$attributes === void 0 ? void 0 : _link$attributes.destination_type) === "ip";
-}
-/**
- * 是否聚合链路
- * @param {*} link 
- * @returns 
- */
-
-export function isAggLink(link) {
-  var _link$attributes2, _link$attributes3;
-
-  return (link === null || link === void 0 ? void 0 : (_link$attributes2 = link.attributes) === null || _link$attributes2 === void 0 ? void 0 : _link$attributes2.destination_type) === "network.agg_interface" && (link === null || link === void 0 ? void 0 : (_link$attributes3 = link.attributes) === null || _link$attributes3 === void 0 ? void 0 : _link$attributes3.source_type) === "network.agg_interface";
+  return (link === null || link === void 0 ? void 0 : link.attributes) && !(link !== null && link !== void 0 && link.attributes["destination_id"]);
 }
 export function mergeLinksData(links, linkCis, nodes, interfaceCiMap, interfaceDoc) {
   var linkCiMap = keyBy(links, "id");
@@ -95,7 +83,7 @@ function _getLinksDetail() {
     return _regeneratorRuntime.wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
-          if (links !== null && links !== void 0 && links.length) {
+          if (!(!links || !links.length)) {
             _context.next = 2;
             break;
           }
@@ -103,6 +91,9 @@ function _getLinksDetail() {
           return _context.abrupt("return", []);
 
         case 2:
+          // const linkCis = await topoService.relation.batchQueryRelation(
+          //   links.map((link) => link.id)
+          // );
           linkCis = links;
           interfaceIds = [].concat(linkCis.map(function (item) {
             return item.attributes.source_id;
@@ -158,8 +149,7 @@ export var plurals = {
   2: ["phy"],
   3: ["agg"],
   4: ["phy", "agg"]
-}; // 待办：移到网络拓扑组件
-
+};
 export var showLinkByConfig = function showLinkByConfig(props) {
   var _plurals$compatibleWi;
 
@@ -171,29 +161,31 @@ export var showLinkByConfig = function showLinkByConfig(props) {
 
   var gv = topo.getGraphView();
   var dm = gv.getDataModel();
-  var edges = getEdges(dm).filter(function (edge) {
-    return !isEdgeGroup(edge);
-  }); // console.log("edges", edges);
+  var edges = getEdges(dm); // console.log("edges", edges);
 
   var showPhy = types.indexOf("phy") >= 0;
   var showAgg = types.indexOf("agg") >= 0; // console.log("edges----types",showType, types,showPhy, showAgg);
 
-  edges.forEach(function (edge) {
-    if (showType === 1 || showType === true) {
-      // 单链路全部显示
-      // console.log("单链路全部显示", edge);
-      edge.s("x.visible", true);
-    } else {
-      var d = topo.dataModel.getDataById(edge.getTag()); // 判断是否聚合链路
-
-      if (isAggLink(d)) {
-        edge.s("x.visible", showAgg);
+  if (Array.isArray(edges) && edges.length > 0) {
+    edges.forEach(function (edge) {
+      if (showType === 1 || showType === true) {
+        // 单链路全部显示
+        // console.log("单链路全部显示", edge);
+        edge.s("2d.visible", true);
       } else {
-        // console.log("edge", edge, d, showAgg);
-        edge.s("x.visible", showPhy);
+        var _d$attributes, _d$attributes2;
+
+        var d = topo.dataModel.getDataById(edge.getTag()); // 判断是否聚合链路
+
+        if ((d === null || d === void 0 ? void 0 : (_d$attributes = d.attributes) === null || _d$attributes === void 0 ? void 0 : _d$attributes.destination_type) === "network.agg_interface" && (d === null || d === void 0 ? void 0 : (_d$attributes2 = d.attributes) === null || _d$attributes2 === void 0 ? void 0 : _d$attributes2.source_type) === "network.agg_interface") {
+          edge.s("2d.visible", showAgg);
+        } else {
+          // console.log("edge", edge, d, showAgg);
+          edge.s("2d.visible", showPhy);
+        }
       }
-    }
-  });
+    });
+  }
 };
 export var mergeExportLinkData = function mergeExportLinkData(props) {
   var source = props.source,

package/es/core/utils/edgeUtil.js

@@ -1,13 +1,12 @@
 import rlog from "@riil-frontend/component-topology-utils/es/rlog";
 import { showLinkByConfig } from "../models/utils/linkUtils";
-import { isEdgeGroup } from "../../utils/htElementUtils";
 /**
  * 是否手工连线
  * @param {*} edge 
  */
 
 export function isCustomEdge(edge) {
-  return !isEdgeGroup(edge) && (edge.a('type') == 'line' || !edge.a('type'));
+  return !edge.isEdgeGroupAgent() && (edge.a('type') == 'line' || !edge.a('type'));
 }
 /**
  * 根据配置更新连线展开折叠状态

package/es/core/viewer/components/plugins/ElementDetailDrawer/hooks/useElementDetailManager.js

@@ -1,6 +1,5 @@
 import React, { useMemo } from 'react';
 import DefaultDetailContent from "../../ResourceDetail/DefaultDetailContent";
-import { isEdgeGroupAgent } from "../../../../../../utils/htElementUtils";
 
 function useElementDetailManager(props) {
   var topo = props.topo,
@@ -63,8 +62,9 @@ function useElementDetailManager(props) {
   }
 
   function openByHtElement(htElement) {
+    var isEdgeGroupAgent = htElement instanceof ht.Edge && htElement.isEdgeGroupAgent() && !htElement.s('edge.expanded');
     open({
-      id: isEdgeGroupAgent(htElement) || !htElement.getTag() ? "ht:" + htElement.getId() : htElement.getTag(),
+      id: isEdgeGroupAgent || !htElement.getTag() ? "ht:" + htElement.getId() : htElement.getTag(),
       htElement: htElement
     });
   }

package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/EventsCard.js

@@ -33,7 +33,7 @@ function EventsCard(props) {
     closeDetailDrawer();
 
     if (topo.viewProps.jumpto) {
-      topo.viewProps.jumpto(url);
+      topo.viewProps.jumpto(formatUrl(url));
     } else {
       getHistory().push(formatUrl(url));
     }

package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/LinkTopo.module.scss

@@ -1,7 +1,7 @@
 .container {
   width: 100%;
   height: 100%;
-  min-height: 250px;
+  min-height: 260px;
   position: relative;
   .floatBox{
     position: absolute;

package/es/networkTopo/models/EdgeGroupTagTipBuilder.js

@@ -1,4 +1,4 @@
-import { getEdgeGroupAgents, getEdgeGroups } from "../../utils/htElementUtils";
+import { getEdgeGroups } from "../../utils/htElementUtils";
 import { getEdgeGroupLinkIdConfig } from "../utils/edgeGroupTagUtil";
 
 var EdgeGroupTagTipBuilder = /*#__PURE__*/function () {
@@ -16,11 +16,11 @@ var EdgeGroupTagTipBuilder = /*#__PURE__*/function () {
 
     var topo = this.topo;
     var dm = this.topo.getDataModel();
-    var edgeGroupAgents = getEdgeGroupAgents(dm);
-    var edgeGroupsTagsTips = edgeGroupAgents.map(function (edgeGroupAgent) {
-      // 获取配置的链路
-      var linkId = getEdgeGroupLinkIdConfig(edgeGroupAgent, topo);
-      var edgeGroupId = [edgeGroupAgent.getSource().getId(), edgeGroupAgent.getTarget().getId()];
+    var edgeGroupsTagsTips = getEdgeGroups(dm).map(function (edgeGroup) {
+      var edge = edgeGroup.getEdges().getArray()[0]; // 获取配置的链路
+
+      var linkId = getEdgeGroupLinkIdConfig(edge, topo);
+      var edgeGroupId = [edge.getSourceAgent().getId(), edge.getTargetAgent().getId()];
       var data = {
         tags: [],
         tips: []
@@ -31,7 +31,7 @@ var EdgeGroupTagTipBuilder = /*#__PURE__*/function () {
       }
 
       return {
-        htId: edgeGroupAgent.getId(),
+        htId: edge.getId(),
         edgeGroupId: edgeGroupId,
         tags: data.tags,
         tips: data.tips,

package/es/networkTopo/utils/edgeGroupTagUtil.js

@@ -55,8 +55,8 @@ export function getEdgeGroupLinkIdConfig(edgeGroup, topo) {
   });
 }
 export function getEdgeGroupConfigId(edgeGroup) {
-  var sourceNode = edgeGroup.getSource();
-  var targetNode = edgeGroup.getTarget();
+  var sourceNode = edgeGroup.getSourceAgent();
+  var targetNode = edgeGroup.getTargetAgent();
   var sourceId = sourceNode.a('uuid');
   var targetId = targetNode.a('uuid');
   return [sourceId, targetId].sort().join(',');