@riil-frontend/component-topology 9.0.0-a.8 → 9.0.1

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

@@ -8,6 +8,7 @@ exports.compatibleWith = void 0;
 exports.getLinksDetail = getLinksDetail;
 exports.isCrucialLink = isCrucialLink;
 exports.isExitLink = isExitLink;
+exports.mergeExportLinkData = void 0;
 exports.mergeLinksData = mergeLinksData;
 exports.showLinkByConfig = exports.plurals = void 0;
 
@@ -41,44 +42,51 @@ var _CiCache = _interopRequireDefault(require("../cache/CiCache"));
 
 /**
  * 是否关键链路
- * @param {*} link 
- * @returns 
+ * @param {*} link
+ * @returns
  */
 function isCrucialLink(link) {
-  return !!link.attributes['network_link.is_crucial'];
+  return !!link.attributes["network_link.is_crucial"];
 }
 /**
  * 是否出口链路
- * @param {*} link 
- * @returns 
+ * @param {*} link
+ * @returns
  */
 
 
 function isExitLink(link) {
-  return (link === null || link === void 0 ? void 0 : link.attributes) && !(link !== null && link !== void 0 && link.attributes['destination_id']);
+  return (link === null || link === void 0 ? void 0 : link.attributes) && !(link !== null && link !== void 0 && link.attributes["destination_id"]);
 }
 
 function mergeLinksData(links, linkCis, nodes, interfaceCiMap, interfaceDoc) {
-  var linkCiMap = (0, _keyBy["default"])(links, 'id');
+  var linkCiMap = (0, _keyBy["default"])(links, "id");
   return links.map(function (link) {
     var _interfaceCiMap$attri, _interfaceCiMap$attri2;
 
     var linkCi = linkCiMap[link.id];
     var attributes = (0, _extends2["default"])({}, linkCi === null || linkCi === void 0 ? void 0 : linkCi.attributes);
     var sourceNode = nodes.find(function (node) {
-      return node.id === attributes['network_link.source_device_id'];
+      return node.id === attributes["network_link.source_device_id"];
     });
     var targetNode = nodes.find(function (node) {
-      return node.id === attributes['network_link.destination_device_id'];
-    }); // 翻译
+      return node.id === attributes["network_link.destination_device_id"];
+    });
+    var target = link.target; // 目的端为ip节点
+
+    if (attributes["destination_type"] === "ip") {
+      target = "ip:" + attributes["network_link.destination_ipv4"];
+    } // 翻译
+
 
     return (0, _extends2["default"])({}, link, {
+      target: target,
       attributes: (0, _extends2["default"])({}, attributes, {
         // 源/目的设备
-        'network_link.source_device_id_object': {
+        "network_link.source_device_id_object": {
           displayName: sourceNode === null || sourceNode === void 0 ? void 0 : sourceNode.name
         },
-        'network_link.destination_device_id_object': {
+        "network_link.destination_device_id_object": {
           displayName: targetNode === null || targetNode === void 0 ? void 0 : targetNode.name
         },
         // 源/目的接口类型
@@ -86,10 +94,10 @@ function mergeLinksData(links, linkCis, nodes, interfaceCiMap, interfaceDoc) {
         destination_type_object: interfaceDoc[attributes.destination_type],
         // 源/目的接口
         source_id_object: {
-          displayName: (_interfaceCiMap$attri = interfaceCiMap[attributes.source_id]) === null || _interfaceCiMap$attri === void 0 ? void 0 : _interfaceCiMap$attri.attributes['display_name']
+          displayName: (_interfaceCiMap$attri = interfaceCiMap[attributes.source_id]) === null || _interfaceCiMap$attri === void 0 ? void 0 : _interfaceCiMap$attri.attributes["display_name"]
         },
         destination_id_object: {
-          displayName: (_interfaceCiMap$attri2 = interfaceCiMap[attributes.destination_id]) === null || _interfaceCiMap$attri2 === void 0 ? void 0 : _interfaceCiMap$attri2.attributes['display_name']
+          displayName: (_interfaceCiMap$attri2 = interfaceCiMap[attributes.destination_id]) === null || _interfaceCiMap$attri2 === void 0 ? void 0 : _interfaceCiMap$attri2.attributes["display_name"]
         }
       })
     });
@@ -129,7 +137,7 @@ function _getLinksDetail() {
             }), linkCis.map(function (item) {
               return item.attributes.destination_type;
             })))).filter(function (item) {
-              return item !== 'ip';
+              return item !== "ip";
             });
             _context.next = 7;
             return _CiCache["default"].load(interfaceIds);
@@ -173,10 +181,10 @@ var compatibleWith = function compatibleWith(value) {
 exports.compatibleWith = compatibleWith;
 var plurals = {
   0: [],
-  1: ['phy'],
-  2: ['phy'],
-  3: ['agg'],
-  4: ['phy', 'agg']
+  1: ["phy"],
+  2: ["phy"],
+  3: ["agg"],
+  4: ["phy", "agg"]
 };
 exports.plurals = plurals;
 
@@ -193,29 +201,48 @@ var showLinkByConfig = function showLinkByConfig(props) {
   var dm = gv.getDataModel();
   var edges = (0, _htElementUtils.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);
+  var showPhy = types.indexOf("phy") >= 0;
+  var showAgg = types.indexOf("agg") >= 0; // console.log("edges----types",showType, types,showPhy, showAgg);
 
   if (Array.isArray(edges) && edges.length > 0) {
     edges.map(function (edge) {
       if (showType === 1 || showType === true) {
         // 单链路全部显示
         // console.log("单链路全部显示", edge);
-        edge.s('2d.visible', true);
+        edge.s("2d.visible", true);
       } else {
         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);
+        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);
+          edge.s("2d.visible", showPhy);
         }
       }
     });
   }
 };
 
-exports.showLinkByConfig = showLinkByConfig;
+exports.showLinkByConfig = showLinkByConfig;
+
+var mergeExportLinkData = function mergeExportLinkData(props) {
+  var source = props.source,
+      target = props.target,
+      link = props.link;
+  var attrObj = link.attributes;
+  var linkData = (0, _extends2["default"])({}, link, {
+    name: attrObj.name,
+    source: attrObj["network_link.source_device_id"],
+    target: attrObj.destination_type === "ip" ? target.getTag() : attrObj["network_link.destination_device_id"],
+    operation: attrObj.operation,
+    interfaceSource: attrObj["source_id"],
+    interfaceTarget: attrObj["destination_id"],
+    ciType: link.typeCode
+  });
+  return linkData;
+};
+
+exports.mergeExportLinkData = mergeExportLinkData;

package/lib/core/store/models/topoConfig.js

@@ -27,6 +27,8 @@ var _topoData = require("../../../utils/topoData");
 
 var _topoData2 = require("../../../core/models/topoData");
 
+var _networkLink = _interopRequireDefault(require("../../../networkTopo/services/topo/networkLink"));
+
 var _getTopoData = require("../../../networkTopo/getTopoData");
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -264,24 +266,26 @@ function _default(topoApp) {
           var _this2 = this;
 
           return (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
-            var editState, resources, _editState$groups, groups, _editState$exportLink, exportLinkIdList, query, data;
+            var editState, resources, _editState$groups, groups, _editState$exportLink, exportLinkIdList, _editState$ipNodes, ipNodes, query, data;
 
             return _regenerator["default"].wrap(function _callee2$(_context2) {
               while (1) {
                 switch (_context2.prev = _context2.next) {
                   case 0:
                     editState = rootState.topoConfig;
-                    resources = editState.resources, _editState$groups = editState.groups, groups = _editState$groups === void 0 ? [] : _editState$groups, _editState$exportLink = editState.exportLinkIdList, exportLinkIdList = _editState$exportLink === void 0 ? [] : _editState$exportLink;
+                    resources = editState.resources, _editState$groups = editState.groups, groups = _editState$groups === void 0 ? [] : _editState$groups, _editState$exportLink = editState.exportLinkIdList, exportLinkIdList = _editState$exportLink === void 0 ? [] : _editState$exportLink, _editState$ipNodes = editState.ipNodes, ipNodes = _editState$ipNodes === void 0 ? [] : _editState$ipNodes;
+                    console.log("editState", editState);
                     query = {
                       id: rootState.topoMod.topoId,
                       resources: resources,
                       groups: groups,
-                      exportLinkIdList: exportLinkIdList
+                      exportLinkIdList: exportLinkIdList,
+                      ipNodes: ipNodes
                     };
-                    _context2.next = 5;
+                    _context2.next = 6;
                     return _this2.getTopoByConditions(query);
 
-                  case 5:
+                  case 6:
                     data = _context2.sent;
 
                     _rlog["default"].debug("按配置查询拓扑数据", {
@@ -294,7 +298,7 @@ function _default(topoApp) {
 
                     return _context2.abrupt("return", data);
 
-                  case 8:
+                  case 9:
                   case "end":
                     return _context2.stop();
                 }
@@ -330,36 +334,42 @@ function _default(topoApp) {
           var _this4 = this;
 
           return (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4() {
-            var topoId, resources, groups, exportLinkIdList, viewConditions, groupInfo, data, _yield$Promise$all, dataWithLinkDetail, _combTopoData, topoData, resAndMetrics, topoDataTrans;
+            var topoId, resources, groups, exportLinkIdList, ipNodes, viewConditions, groupInfo, data, _yield$Promise$all, dataWithLinkDetail, _combTopoData, topoData, resAndMetrics, topoDataTrans;
 
             return _regenerator["default"].wrap(function _callee4$(_context4) {
               while (1) {
                 switch (_context4.prev = _context4.next) {
                   case 0:
-                    // rlog.debug("getTopoByConditions--------", params);
-                    topoId = params.id, resources = params.resources, groups = params.groups, exportLinkIdList = params.exportLinkIdList;
+                    _rlog["default"].debug("getTopoByConditions--------", params);
+
+                    topoId = params.id, resources = params.resources, groups = params.groups, exportLinkIdList = params.exportLinkIdList, ipNodes = params.ipNodes;
                     viewConditions = (0, _topoData2.resToConditions)(resources);
                     groupInfo = (0, _utils.isAvailableArray)(groups) && groups.map(function (group) {
                       return (0, _extends2["default"])({}, group, {
                         layout: (0, _topoData2.getLayoutId)(group.layout),
                         resources: (0, _topoData2.resToConditions)(group.resources)
                       });
-                    }); // rlog.debug("getTopoByConditions--------", viewConditions, groupInfo);
+                    });
 
-                    _context4.next = 5;
-                    return topoApp.serverApi.getTopoDataByResource(topoId, viewConditions, groupInfo, exportLinkIdList);
+                    _rlog["default"].debug("getTopoByConditions--------", viewConditions, groupInfo);
 
-                  case 5:
+                    _context4.next = 7;
+                    return topoApp.serverApi.getTopoDataByResource(topoId, viewConditions, groupInfo, exportLinkIdList, ipNodes);
+
+                  case 7:
                     data = _context4.sent;
-                    _context4.next = 8;
+
+                    _rlog["default"].debug("getTopoByConditions--------data", data);
+
+                    _context4.next = 11;
                     return (0, _getTopoData.buildData)(data);
 
-                  case 8:
+                  case 11:
                     data = _context4.sent;
-                    _context4.next = 11;
+                    _context4.next = 14;
                     return Promise.all([(0, _getTopoData.addLinkData)(data), topoApp.ciTyeCache.getCiTypeMap((0, _topoData.getCiTypes)(data)), dispatch.customIcon.loadCustomIcons()]);
 
-                  case 11:
+                  case 14:
                     _yield$Promise$all = _context4.sent;
                     dataWithLinkDetail = _yield$Promise$all[0];
                     _combTopoData = (0, _topoData.combTopoData)({
@@ -386,7 +396,7 @@ function _default(topoApp) {
                       topoDataTrans: topoDataTrans
                     });
 
-                  case 19:
+                  case 22:
                   case "end":
                     return _context4.stop();
                 }
@@ -416,7 +426,7 @@ function _default(topoApp) {
                       }))
                     };
 
-                    _rlog["default"].debug('saveGlobalConfig', config);
+                    _rlog["default"].debug("saveGlobalConfig", config);
 
                     _context5.next = 5;
                     return topoApp.serverApi.saveTopoSettings(topoApp.id, config);
@@ -485,6 +495,33 @@ function _default(topoApp) {
         switchToViewMode: function switchToViewMode() {
           this.reset();
           dispatch.topoMod.switchToViewMode();
+        },
+        queryAllLinkByIp: function queryAllLinkByIp(data) {
+          return (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee8() {
+            var _result$data;
+
+            var ids, ip, result;
+            return _regenerator["default"].wrap(function _callee8$(_context8) {
+              while (1) {
+                switch (_context8.prev = _context8.next) {
+                  case 0:
+                    ids = data.ids, ip = data.ip;
+                    console.log("queryAllLinkByIp", ids, ip);
+                    _context8.next = 4;
+                    return _networkLink["default"].queryLinksByIp(ids, ip);
+
+                  case 4:
+                    result = _context8.sent;
+                    console.log("queryAllLinkByIp-result", result);
+                    return _context8.abrupt("return", (_result$data = result === null || result === void 0 ? void 0 : result.data) !== null && _result$data !== void 0 ? _result$data : []);
+
+                  case 7:
+                  case "end":
+                    return _context8.stop();
+                }
+              }
+            }, _callee8);
+          }))();
         }
       };
     }

package/lib/core/test/Test.js

@@ -27,6 +27,58 @@ var Test = /*#__PURE__*/function () {
   _proto.onReady = function onReady() {// TODO 待移除测试代码
     // this.iconManage.openUpload()
     // this.topo.store.getModelDispatchers('linkDynamicStyleConfig').open({type: 'networkLink'});
+  }
+  /**
+   * 关联IP示例代码
+   */
+  ;
+
+  _proto.createExportLink = function createExportLink() {
+    var htTopo = this.topo.getHtTopo();
+    var dm = htTopo.getGraphView().dm(); // 设置节点关联IP
+
+    var nodeElement = htTopo.getGraphView().sm().fd();
+    var ip = {
+      'id': 'ip:1.1.1.1',
+      'name': '1.1.1.1',
+      customName: null,
+      // 'groupId': null,
+      // 'groupTag': null,
+      'ipAddress': '1.1.1.1',
+      // 'attributes': [],
+      // 'metrics': [],
+      'type': 'node' // 'dtype': 'device'
+
+    };
+    nodeElement.a(ip);
+    nodeElement.setTag('ip:1.1.1.1');
+    var link = {
+      'id': '0000000019b462d1',
+      'name': '172.17.160.116(Gi2/2/0/1) - 172.27.130.13(Gi 0/9)',
+      'source': '00000000029f9411',
+      'target': 'ip:1.1.1.1',
+      'operation': 'delete',
+      'interfaceSource': '0000000018080aee',
+      'interfaceTarget': '000000000341b015',
+      'ciType': 'network_link',
+      'attributes': [],
+      'manageStatus': 0,
+      'permission': {
+        'readable': true,
+        'writeable': true,
+        'deleteable': true
+      },
+      'metrics': [],
+      'type': 'link',
+      'dtype': 'link'
+    };
+    var createElementsData = {
+      groups: [],
+      nodes: [],
+      links: [link],
+      linkGroups: []
+    };
+    htTopo.createElements(createElementsData);
   };
 
   return Test;

package/lib/core/utils/graphLinkUtil.js

@@ -12,7 +12,7 @@ var _htElementUtils = require("../../utils/htElementUtils");
 function fixLink(topo) {
   var linkDatas = topo.dataModel.getEdges();
   var dm = topo.getHtTopo().getGraphView().dm();
-  var edges = (0, _htElementUtils.getEdges)(dm);
+  var edges = (0, _htElementUtils.getElements)(dm).filter(_htElementUtils.isEdge);
   edges.forEach(function (edge) {
     var source = edge.getSource();
     var target = edge.getTarget();
@@ -21,15 +21,20 @@ function fixLink(topo) {
     }); // TODO 判断两端互相切换
     // const isChange = 
 
-    if (linkData && source.getTag() !== linkData.source) {
+    if (linkData && (source === null || source === void 0 ? void 0 : source.getTag()) !== linkData.source) {
       var node = dm.getDataByTag(linkData.source);
-      edge.setSource(node);
+
+      if (node) {
+        edge.setSource(node);
+      }
     }
 
-    if (linkData && linkData.target && target.getTag() !== linkData.target) {
+    if (linkData && linkData.target && (target === null || target === void 0 ? void 0 : target.getTag()) !== linkData.target) {
       var _node = dm.getDataByTag(linkData.target);
 
-      edge.setTarget(_node);
+      if (_node) {
+        edge.setTarget(_node);
+      }
     } // TODO 两端互相切换，交换两端样式
 
   });

package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/BaseInfo.js

@@ -5,6 +5,8 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 exports.__esModule = true;
 exports["default"] = BaseInfo;
 
+var _switch = _interopRequireDefault(require("@alifd/next/lib/switch"));
+
 var _react = _interopRequireDefault(require("react"));
 
 var _indexModule = _interopRequireDefault(require("./index.module.scss"));
@@ -64,6 +66,12 @@ function BaseInfo(props) {
       data = props.data,
       baseInfo = props.baseInfo,
       renderContent = props.renderContent;
+
+  var onChange = function onChange(checked) {
+    topo.topoCrucialLinkFn([data.id], !checked);
+  };
+
+  var defaultChecked = topo.dataModel.getDataById(data.id).attributes['network_link.is_crucial'] || false;
   var content = renderContent ? renderContent({
     type: type,
     data: data,
@@ -79,5 +87,11 @@ function BaseInfo(props) {
 
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: _indexModule["default"]["base-info"]
-  }, content);
+  }, content, type == 'link' && /*#__PURE__*/_react["default"].createElement("div", {
+    className: _indexModule["default"].isCrucialLink
+  }, "\u662F\u5426\u5173\u952E\uFF1A", /*#__PURE__*/_react["default"].createElement(_switch["default"], {
+    defaultChecked: defaultChecked,
+    onChange: onChange,
+    size: "small"
+  })));
 }

package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/ResourceOverview.js

@@ -53,8 +53,6 @@ var _LinkTopoCard = _interopRequireDefault(require("./components/LinkTopo/LinkTo
 
 var _EventsCard = _interopRequireDefault(require("./EventsCard"));
 
-var _services2 = require("./components/LinkTopo/services");
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -726,7 +724,7 @@ function ResourceOverview(props) {
     _metricColChange = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee8(col) {
       var _col2, _col3;
 
-      var codes, endTime, params, _ref5, times, metricList, newMetricList, metricLists;
+      var codes, endTime, params, _ref5, times, metricList, metricLists;
 
       return _regenerator["default"].wrap(function _callee8$(_context8) {
         while (1) {
@@ -774,16 +772,7 @@ function ResourceOverview(props) {
 
             case 11:
               metricList = _context8.sent;
-              _context8.next = 14;
-              return queryMetricList({
-                'name': data.attributes.display_name
-              }, {
-                'id': data.attributes.name
-              });
-
-            case 14:
-              newMetricList = _context8.sent;
-              metricLists = metricList.concat(getNewMetricList(newMetricList));
+              metricLists = metricList.concat(getNewMetricList());
 
               _rlog.rlog.debug('metricColChange', metricLists, monitorMetricModels);
 
@@ -811,7 +800,7 @@ function ResourceOverview(props) {
                 }, 60000);
               }
 
-            case 20:
+            case 17:
             case "end":
               return _context8.stop();
           }
@@ -821,73 +810,12 @@ function ResourceOverview(props) {
     return _metricColChange.apply(this, arguments);
   }
 
-  function queryMetricList(_x9, _x10) {
-    return _queryMetricList.apply(this, arguments);
-  }
-
-  function _queryMetricList() {
-    _queryMetricList = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee9(data, param) {
-      var checkMenus, isOpen, list;
-      return _regenerator["default"].wrap(function _callee9$(_context9) {
-        while (1) {
-          switch (_context9.prev = _context9.next) {
-            case 0:
-              if (!(ciType !== 'network_link')) {
-                _context9.next = 2;
-                break;
-              }
-
-              return _context9.abrupt("return", []);
-
-            case 2:
-              _context9.next = 4;
-              return (0, _services2.checkMenu)();
-
-            case 4:
-              checkMenus = _context9.sent;
-
-              if (!(checkMenus[0].passed == 'PASS')) {
-                _context9.next = 14;
-                break;
-              }
-
-              _context9.next = 8;
-              return (0, _services2.isOpenFlow)(data);
-
-            case 8:
-              isOpen = _context9.sent;
-
-              if (!isOpen) {
-                _context9.next = 14;
-                break;
-              }
-
-              _context9.next = 12;
-              return (0, _services2.queryLastestValue)(param);
-
-            case 12:
-              list = _context9.sent;
-              return _context9.abrupt("return", list);
-
-            case 14:
-              return _context9.abrupt("return", []);
-
-            case 15:
-            case "end":
-              return _context9.stop();
-          }
-        }
-      }, _callee9);
-    }));
-    return _queryMetricList.apply(this, arguments);
-  }
-
-  var getNewMetricList = function getNewMetricList(data) {
+  var getNewMetricList = function getNewMetricList() {
     return [{
       errorMsg: null,
       mainCiId: "netDelayRatio",
       metricCode: "netDelayRatio",
-      metricValue: data.upNetDelayRatio + ' ms' + '|' + data.downNetDelayRatio + ' ms',
+      metricValue: '0',
       subCiId: '',
       subCiType: null,
       mainCiType: null
@@ -895,7 +823,7 @@ function ResourceOverview(props) {
       errorMsg: null,
       mainCiId: "retansRatio",
       metricCode: "retansRatio",
-      metricValue: data.upRetransRatio + ' %' + '|' + data.downRetansRatio + ' %',
+      metricValue: '0',
       subCiId: '',
       subCiType: null,
       mainCiType: null
@@ -959,6 +887,7 @@ function ResourceOverview(props) {
     ciTypeMeta: ciTypeMeta,
     baseInfo: baseInfo,
     isAppTopo: isAppTopo,
+    topo: topo,
     headerExtra: function headerExtra(p) {
       var _resourceOverviewProp3;
 

package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/LinkTopo.js

@@ -25,6 +25,20 @@ function LinkTopo(props) {
     linkCi: data,
     linkMetricCodes: linkMetricCodes
   });
+  var linkMetrics = [].concat(metricData.linkMetrics, metricData.linkOther);
+  var linkMetricsList = [];
+
+  if (linkMetrics.length > 0) {
+    linkMetricCodes.forEach(function (e) {
+      var linkMetricsData = linkMetrics.filter(function (i) {
+        return e == i.code;
+      });
+      if (linkMetricsData.length > 0) linkMetricsList.push(linkMetricsData[0]);
+    });
+    metricData.linkMetrics = linkMetricsList;
+    metricData.linkOther = [];
+  }
+
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: _LinkTopoModule["default"].container
   }, /*#__PURE__*/_react["default"].createElement(_componentCrucialLinkTopo["default"], (0, _extends2["default"])({