@riil-frontend/component-topology 3.5.0-a.9 → 3.5.2

package/es/core/models/cache/CiTyeCache.js

@@ -148,6 +148,10 @@ var CiTyeCache = /*#__PURE__*/function () {
       if (type.id === connectType) {
         var metrics = ciType.metrics // 物理链路移除：ping状态、专线连通状态
         .filter(function (metric) {
+          if (connectType === 'exit') {
+            return true;
+          }
+
           return ['network_dedicated_line_status', 'ping_status'].indexOf(metric.code) === -1;
         }) // 按链路类型过滤对应指标
         .filter(function (metric) {

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

@@ -1,29 +1,70 @@
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _extends from "@babel/runtime/helpers/extends";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import topoService from "@riil-frontend/component-topology-common/es/services/topo";
 import keyBy from "lodash/keyBy";
-import { queryCisByIds } from "../../services";
-var interfaceTypeMap = {
-  "network.interface": {
-    displayName: "网络接口"
-  },
-  "network.agg_interface": {
-    displayName: "聚合接口"
-  }
-};
+import _ from "lodash";
+import { queryCisByIds, queryModelAsset } from "../../services"; // const interfaceTypeMap = {
+//   "network.interface": {
+//     displayName: "网络接口",
+//   },
+//   "network.agg_interface": {
+//     displayName: "聚合接口",
+//   },
+// };
+
 export function isAggLink(link) {
   return link.attributes["network_link.connect_type"] === "agg";
 }
-export function mergeLinksData(links, linkCis, nodes, interfaceCis) {
+export var getInterfaceObject = /*#__PURE__*/function () {
+  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(codes) {
+    var query, promises, result, ifDoc;
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            query = _.compact(_.uniq(codes));
+            promises = query.map(queryModelAsset);
+            _context.next = 4;
+            return Promise.all(promises);
+
+          case 4:
+            result = _context.sent;
+            ifDoc = {};
+            result.map(function (ifItem) {
+              ifDoc[ifItem.code] = {
+                displayName: ifItem.displayName
+              };
+            });
+            return _context.abrupt("return", ifDoc);
+
+          case 8:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee);
+  }));
+
+  return function getInterfaceObject(_x) {
+    return _ref.apply(this, arguments);
+  };
+}();
+export function mergeLinksData(links, linkCis, nodes, interfaceCis, interfaceDoc) {
   var linkCiMap = keyBy(linkCis, "id");
   return links.map(function (link) {
-    var _nodes$find, _nodes$find2, _interfaceCis$find, _interfaceCis$find2;
+    var _interfaceCis$find, _interfaceCis$find2;
 
     var linkCi = linkCiMap[link.id];
 
-    var attributes = _extends({}, linkCi === null || linkCi === void 0 ? void 0 : linkCi.attributes); // 翻译
+    var attributes = _extends({}, linkCi === null || linkCi === void 0 ? void 0 : linkCi.attributes);
 
+    var sourceNode = nodes.find(function (node) {
+      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 _extends({}, link, {
       id: linkCi.id,
@@ -32,18 +73,14 @@ export function mergeLinksData(links, linkCis, nodes, interfaceCis) {
       attributes: _extends({}, attributes, {
         // 源/目的设备
         "network_link.source_device_id_object": {
-          displayName: (_nodes$find = nodes.find(function (node) {
-            return node.id === attributes["network_link.source_device_id"];
-          })) === null || _nodes$find === void 0 ? void 0 : _nodes$find.name
+          displayName: sourceNode === null || sourceNode === void 0 ? void 0 : sourceNode.name
         },
         "network_link.destination_device_id_object": {
-          displayName: (_nodes$find2 = nodes.find(function (node) {
-            return node.id === attributes["network_link.destination_device_id"];
-          })) === null || _nodes$find2 === void 0 ? void 0 : _nodes$find2.name
+          displayName: targetNode === null || targetNode === void 0 ? void 0 : targetNode.name
         },
         // 源/目的接口类型
-        source_type_object: interfaceTypeMap[attributes.source_type],
-        destination_type_object: interfaceTypeMap[attributes.destination_type],
+        source_type_object: interfaceDoc[attributes.source_type],
+        destination_type_object: interfaceDoc[attributes.destination_type],
         // 源/目的接口
         source_id_object: {
           displayName: (_interfaceCis$find = interfaceCis.find(function (node) {
@@ -59,50 +96,58 @@ export function mergeLinksData(links, linkCis, nodes, interfaceCis) {
     });
   });
 }
-export function getLinksDetail(_x, _x2) {
+export function getLinksDetail(_x2, _x3) {
   return _getLinksDetail.apply(this, arguments);
 }
 
 function _getLinksDetail() {
-  _getLinksDetail = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(links, nodes) {
-    var linkCis, interfaceIds, interfaceCis;
-    return _regeneratorRuntime.wrap(function _callee$(_context) {
+  _getLinksDetail = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(links, nodes) {
+    var linkCis, interfaceIds, interfaceTypes, interfaceCis, interfaceDoc;
+    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
       while (1) {
-        switch (_context.prev = _context.next) {
+        switch (_context2.prev = _context2.next) {
           case 0:
             if (!(!links || !links.length)) {
-              _context.next = 2;
+              _context2.next = 2;
               break;
             }
 
-            return _context.abrupt("return", []);
+            return _context2.abrupt("return", []);
 
           case 2:
-            _context.next = 4;
+            _context2.next = 4;
             return topoService.relation.batchQueryRelation(links.map(function (link) {
               return link.id;
             }));
 
           case 4:
-            linkCis = _context.sent;
-            interfaceIds = [].concat(linkCis.map(function (item) {
-              return item.attributes.source_id;
-            }), linkCis.map(function (item) {
-              return item.attributes.destination_id;
-            }));
-            _context.next = 8;
+            linkCis = _context2.sent;
+            interfaceIds = [];
+            interfaceTypes = [];
+            linkCis.map(function (item) {
+              interfaceIds.push(item.attributes.source_id);
+              interfaceIds.push(item.attributes.destination_id);
+              interfaceTypes.push(item.attributes.source_type);
+              interfaceTypes.push(item.attributes.destination_type);
+            });
+            _context2.next = 10;
             return queryCisByIds(interfaceIds);
 
-          case 8:
-            interfaceCis = _context.sent;
-            return _context.abrupt("return", mergeLinksData(links, linkCis, nodes, interfaceCis));
-
           case 10:
+            interfaceCis = _context2.sent;
+            _context2.next = 13;
+            return getInterfaceObject(interfaceTypes);
+
+          case 13:
+            interfaceDoc = _context2.sent;
+            return _context2.abrupt("return", mergeLinksData(links, linkCis, nodes, interfaceCis, interfaceDoc));
+
+          case 15:
           case "end":
-            return _context.stop();
+            return _context2.stop();
         }
       }
-    }, _callee);
+    }, _callee2);
   }));
   return _getLinksDetail.apply(this, arguments);
 }

package/es/core/services/index.js

@@ -32,4 +32,32 @@ function _queryCisByIds() {
     }, _callee);
   }));
   return _queryCisByIds.apply(this, arguments);
+}
+
+export function queryModelAsset(_x2) {
+  return _queryModelAsset.apply(this, arguments);
+}
+
+function _queryModelAsset() {
+  _queryModelAsset = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(code) {
+    var result;
+    return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+      while (1) {
+        switch (_context2.prev = _context2.next) {
+          case 0:
+            _context2.next = 2;
+            return request.get("/mdc/v1/api/model-asset/" + code);
+
+          case 2:
+            result = _context2.sent;
+            return _context2.abrupt("return", result);
+
+          case 4:
+          case "end":
+            return _context2.stop();
+        }
+      }
+    }, _callee2);
+  }));
+  return _queryModelAsset.apply(this, arguments);
 }

package/es/core/utils/saveSerialize.js

@@ -0,0 +1,34 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import topoService from "@riil-frontend/component-topology-common/es/services/topo";
+/**
+ * 增加保存拓扑序列化数据方法，以便于拓扑中心和业务拓扑使用
+ * 
+ * @param {*} topo 
+ */
+
+export default function saveSerialize(_x) {
+  return _saveSerialize.apply(this, arguments);
+}
+
+function _saveSerialize() {
+  _saveSerialize = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(topo) {
+    var topoId, serialize;
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            topoId = topo.getId();
+            serialize = topo.getHtTopo().serialize();
+            _context.next = 4;
+            return topoService.saveSerializeData(topoId, serialize);
+
+          case 4:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee);
+  }));
+  return _saveSerialize.apply(this, arguments);
+}

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

@@ -159,43 +159,6 @@ function ResourceDetail(props) {
     getUser();
   }
 
-  useEffect(function () {
-    console.log('topoData', activeData.ciType, topoModData);
-
-    if (topoModData && activeData !== null && activeData !== void 0 && activeData.id) {
-      var id = activeData.id,
-          ciType = activeData.ciType;
-      var ciTypeMeta;
-
-      if (ciType === 'network_link') {
-        // 网络链路要按链路类型查询属性、指标
-        var linkGroups = topoModData.linkGroups,
-            links = topoModData.links;
-        var link = [].concat(linkGroups, links).find(function (item) {
-          return item.id === id;
-        });
-        var linkConnectType = link.attributes['network_link.connect_type'];
-        ciTypeMeta = topo.ciTyeCache.getNetworkLinkCiType(linkConnectType);
-      } else {
-        ciTypeMeta = topo.ciTyeCache.getCiType(ciType);
-      }
-
-      if (!ciTypeMeta) {
-        return;
-      }
-
-      var _ciTypeMeta = ciTypeMeta,
-          metrics = _ciTypeMeta.metrics; // 同步需要实时展示的指标
-
-      topoDispatchers.update({
-        id: id,
-        metricCodes: metrics.slice(0, 6).map(function (item) {
-          return item.code;
-        }) // 需要展示的关键指标 code
-
-      });
-    }
-  }, [topoModData, activeData]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_Drawer, {
     className: styles.baseInfo,
     closeMode: ['close', 'esc'],

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

@@ -1,11 +1,11 @@
-import React from 'react';
-import { Link } from 'react-router-dom';
+import React from "react";
+import { Link } from "react-router-dom";
 import styles from "./index.module.scss"; // url 处理，UICBB 的地址需截取前缀
 
 function formatUrl(url) {
   var _window, _window$location;
 
-  var prefix = '/default/pagecenter';
+  var prefix = "/default/pagecenter";
 
   if (((_window = window) === null || _window === void 0 ? void 0 : (_window$location = _window.location) === null || _window$location === void 0 ? void 0 : _window$location.pathname.indexOf(prefix)) === 0 && (url === null || url === void 0 ? void 0 : url.indexOf(prefix)) === 0) {
     return url.split(prefix)[1];
@@ -40,8 +40,8 @@ function BaseInfoContent(props) {
       data = props.data;
   var itemCols = {
     node: [{
-      label: '资源名称：',
-      objKey: 'resource',
+      label: "资源名称：",
+      objKey: "resource",
       render: function render(valueData, key) {
         var display_name = valueData.display_name,
             link = valueData.link;
@@ -52,43 +52,46 @@ function BaseInfoContent(props) {
         }, valueData ? /*#__PURE__*/React.createElement(Link, {
           className: styles.link,
           to: formatUrl(link)
-        }, display_name || '-') : '-');
+        }, display_name || "-") : "-");
       }
     }, {
-      label: 'IP地址：',
-      objKey: 'ipv4_address'
+      label: "IP地址：",
+      objKey: "ipv4_address"
     }, {
-      label: '资产编号：',
-      objKey: 'asset_number'
+      label: "资产编号：",
+      objKey: "asset_number"
     }, {
-      label: '资源类型：',
-      objKey: 'ciName'
+      label: "资源类型：",
+      objKey: "ciName"
     }, {
-      label: '资源位置：',
-      objKey: 'res_address'
+      label: "资源位置：",
+      objKey: "res_address"
     } // {
     //   label: '负责人：',
     //   objKey: 'principal'
     // },
     ],
     link: [{
-      label: '链路带宽：',
-      objKey: 'rated_bandwidth',
+      label: "链路带宽：",
+      objKey: "rated_bandwidth",
       style: {
-        width: '100%'
+        width: "100%"
       }
     }, {
-      label: '源IP地址：',
-      objKey: 'source_ipv4'
+      label: "源IP地址：",
+      objKey: "source_ipv4"
     }, {
-      label: '目的IP地址：',
-      objKey: 'destination_ipv4'
+      label: "目的IP地址：",
+      objKey: "destination_ipv4"
     }, {
-      label: '源端口：',
-      objKey: 'source_Interface'
+      label: "源端口：",
+      objKey: "source_Interface"
     }, {
-      label: '目的端口：',
-      objKey: 'destination_Interface'
+      label: "目的端口：",
+      objKey: "destination_Interface"
+    }, {
+      label: "连接方式：",
+      objKey: "network_link.connect_type"
     }]
   };
   return /*#__PURE__*/React.createElement(React.Fragment, null, (_itemCols$type = itemCols[type]) === null || _itemCols$type === void 0 ? void 0 : _itemCols$type.map(function (_ref, key) {
@@ -96,12 +99,12 @@ function BaseInfoContent(props) {
         objKey = _ref.objKey,
         style = _ref.style,
         render = _ref.render;
-    return data[objKey] === false ? '' : render ? render(data[objKey], key) : /*#__PURE__*/React.createElement(AttributeItem, {
+    return data[objKey] === false ? "" : render ? render(data[objKey], key) : /*#__PURE__*/React.createElement(AttributeItem, {
       key: key,
       label: label,
       style: style || {},
       contentTitle: data[objKey]
-    }, data[objKey] || '-');
+    }, data[objKey] || "-");
   }));
 } // 基本信息
 
@@ -126,6 +129,6 @@ export default function BaseInfo(props) {
   }
 
   return /*#__PURE__*/React.createElement("div", {
-    className: styles['base-info']
+    className: styles["base-info"]
   }, content);
 }

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

@@ -15,6 +15,7 @@ import alarmService from "../../../../../../services/alarm";
 import service from "../../../../../../services/overview";
 import BaseInfoBlock from "./BaseInfoBlock";
 import BlockBox from "./BlockBox";
+import useMetricModels from "./hooks/useMetricModels";
 import styles from "./index.module.scss";
 import ResourceOverviewMetric from "./ResourceOverviewMetric";
 import useCiAttrAndMetricData from "./useCiAttrAndMetricData"; // url 处理，UICBB 的地址需截取前缀
@@ -45,9 +46,7 @@ export default function ResourceOverview(props) {
       userId = props.userId,
       viewerProps = props.viewerProps;
   var resourceOverviewProps = (viewerProps === null || viewerProps === void 0 ? void 0 : (_viewerProps$resource = viewerProps.resourceDetailProps) === null || _viewerProps$resource === void 0 ? void 0 : _viewerProps$resource.resourceOverviewProps) || {};
-  var data = useMemo(function () {
-    return topo.dataModel.getDataById(id);
-  }, [id]);
+  var data = topo.dataModel.useDataById(id);
   var ciAttrAndMetricData = useCiAttrAndMetricData({
     topo: topo,
     id: id
@@ -79,7 +78,9 @@ export default function ResourceOverview(props) {
     // 目的IP地址
     source_Interface: '',
     // 源端口
-    destination_Interface: '' // 目的端口
+    destination_Interface: '',
+    // 目的端口,
+    'network_link.connect_type': '' // 连接方式,
 
   }),
       baseInfo = _useState[0],
@@ -111,9 +112,26 @@ export default function ResourceOverview(props) {
 
     return typeMeta;
   }, [id]);
+
+  var _useMetricModels = useMetricModels({
+    data: {
+      type: type,
+      id: id,
+      ciType: ciType
+    },
+    isMonite: data.manageStatus !== 0,
+    ciTypeMeta: ciTypeMeta,
+    topo: topo,
+    resourceOverviewProps: resourceOverviewProps
+  }),
+      monitorMetricModels = _useMetricModels.metricModels,
+      metricInitLoading = _useMetricModels.initLoading;
+
   useEffect(function () {
-    init();
-  }, [ciAttrAndMetricData, ciTypeMeta, id]);
+    if (monitorMetricModels) {
+      init();
+    }
+  }, [ciAttrAndMetricData, ciTypeMeta, monitorMetricModels, id]);
 
   function init() {
     return _init.apply(this, arguments);
@@ -121,79 +139,59 @@ export default function ResourceOverview(props) {
 
   function _init() {
     _init = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-      var _topo$options$resourc, _modelAttributeMap$ow, _modelAttributeMap$, _modelAttributeMap$2, _modelAttributeMap$3, _modelAttributeMap$di, _modelAttributeMap$ip, _modelAttributeMap$as, _modelAttributeMap$5, _modelAttributeMap$6, _modelAttributeMap$so, _attributeMap$source_, _modelAttributeMap$de, _attributeMap$destina;
+      var _topo$options$resourc, _modelAttributeMap$ow, _modelAttributeMap$, _modelAttributeMap$2, _modelAttributeMap$3, _modelAttributeMap$di, _modelAttributeMap$ip, _modelAttributeMap$as, _modelAttributeMap$5, _modelAttributeMap$6, _modelAttributeMap$so, _attributeMap$source_, _modelAttributeMap$de, _attributeMap$destina, _modelAttributeMap$ne;
 
-      var modelMetrics, ciName, modelAttributeMap, domain, displayMetricModels, metricCodes, isAppTopoFlag, attributeMap, metrics, res_address, _attributeMap$, rated_bandwidth, _modelAttributeMap$4;
+      var displayMetricModels, ciName, modelAttributeMap, domain, isAppTopoFlag, attributeMap, metrics, res_address, _attributeMap$, rated_bandwidth, _modelAttributeMap$4, connect_type;
 
       return _regeneratorRuntime.wrap(function _callee$(_context) {
         while (1) {
           switch (_context.prev = _context.next) {
             case 0:
-              console.log('初始化/更新概览 props', props); // 指标模型
-
-              modelMetrics = ciTypeMeta.metrics, ciName = ciTypeMeta.displayName, modelAttributeMap = ciTypeMeta.attributeMap, domain = ciTypeMeta.domain;
-              displayMetricModels = modelMetrics.slice(0, 6);
+              console.log('初始化/更新概览 props', props);
+              displayMetricModels = monitorMetricModels; // 指标模型
 
-              if (resourceOverviewProps !== null && resourceOverviewProps !== void 0 && resourceOverviewProps.getMetricCodes) {
-                metricCodes = resourceOverviewProps === null || resourceOverviewProps === void 0 ? void 0 : resourceOverviewProps.getMetricCodes({
-                  id: id,
-                  type: type,
-                  ciType: ciType
-                });
-
-                if (metricCodes) {
-                  displayMetricModels = metricCodes.map(function (code) {
-                    return modelMetrics.find(function (item) {
-                      return item.code === code;
-                    });
-                  }).filter(function (item) {
-                    return !!item;
-                  });
-                }
-              }
-
-              displayMetricModels = displayMetricModels.slice(0, 6); // 应用拓扑处理
+              ciName = ciTypeMeta.displayName, modelAttributeMap = ciTypeMeta.attributeMap, domain = ciTypeMeta.domain; // 应用拓扑处理
 
               isAppTopoFlag = !!((_topo$options$resourc = topo.options.resourceOverviewDrawer) !== null && _topo$options$resourc !== void 0 && _topo$options$resourc.getData);
               console.log('应用拓扑判断', topo, isAppTopoFlag);
               setIsAppTopo(isAppTopoFlag);
 
               if (!isAppTopoFlag) {
-                _context.next = 11;
+                _context.next = 9;
                 break;
               }
 
               initAppTopo(displayMetricModels, modelAttributeMap, ciName, domain);
               return _context.abrupt("return");
 
-            case 11:
+            case 9:
               // 拓扑（默认） ---------------------------
               // 基本信息
               attributeMap = ciAttrAndMetricData.attributeMap, metrics = ciAttrAndMetricData.metrics;
-              console.log('基本信息', attributeMap, modelAttributeMap); // userVisible
+              console.log('基本信息x', attributeMap, modelAttributeMap); // userVisible
               // 位置
 
               res_address = false;
 
               if (!((_modelAttributeMap$ow = modelAttributeMap.owned_computer_room) !== null && _modelAttributeMap$ow !== void 0 && _modelAttributeMap$ow.userVisible)) {
-                _context.next = 20;
+                _context.next = 18;
                 break;
               }
 
-              _context.next = 17;
+              _context.next = 15;
               return getAddressFormat(attributeMap);
 
-            case 17:
+            case 15:
               res_address = _context.sent;
-              _context.next = 21;
+              _context.next = 19;
               break;
 
-            case 20:
+            case 18:
               if ((_modelAttributeMap$ = modelAttributeMap[ciType + ".computer_room"]) !== null && _modelAttributeMap$ !== void 0 && _modelAttributeMap$.userVisible || (_modelAttributeMap$2 = modelAttributeMap[ciType + ".area"]) !== null && _modelAttributeMap$2 !== void 0 && _modelAttributeMap$2.userVisible) {
                 res_address = attributeMap[ciType + ".computer_room "] || attributeMap[ciType + ".area"] ? " " + (((_attributeMap$ = attributeMap[ciType + ".area_object"]) === null || _attributeMap$ === void 0 ? void 0 : _attributeMap$.displayName) || '') + " " + (attributeMap[ciType + ".computer_room"] || '') : false;
               }
 
-            case 21:
+            case 19:
               // 链路带宽(取实际带宽)
               rated_bandwidth = false;
 
@@ -201,6 +199,7 @@ export default function ResourceOverview(props) {
                 rated_bandwidth = attributeMap[ciType + ".actual_bandwidth"] ? attributeMap[ciType + ".actual_bandwidth"] + " " + ((_modelAttributeMap$4 = modelAttributeMap[ciType + ".actual_bandwidth"]) === null || _modelAttributeMap$4 === void 0 ? void 0 : _modelAttributeMap$4.unit) : '';
               }
 
+              connect_type = attributeMap['network_link.connect_type'] === 'exit' ? '出口' : '物理/聚合';
               setBaseInfo({
                 // 资源
                 // display_name: modelAttributeMap['display_name'] ? attributeMap.display_name : false,
@@ -220,7 +219,8 @@ export default function ResourceOverview(props) {
                 source_ipv4: (_modelAttributeMap$5 = modelAttributeMap[ciType + ".source_ipv4"]) !== null && _modelAttributeMap$5 !== void 0 && _modelAttributeMap$5.userVisible ? attributeMap[ciType + ".source_ipv4"] : false,
                 destination_ipv4: (_modelAttributeMap$6 = modelAttributeMap[ciType + ".destination_ipv4"]) !== null && _modelAttributeMap$6 !== void 0 && _modelAttributeMap$6.userVisible ? attributeMap[ciType + ".destination_ipv4"] : false,
                 source_Interface: (_modelAttributeMap$so = modelAttributeMap.source_id) !== null && _modelAttributeMap$so !== void 0 && _modelAttributeMap$so.userVisible ? (_attributeMap$source_ = attributeMap.source_id_object) === null || _attributeMap$source_ === void 0 ? void 0 : _attributeMap$source_.displayName : false,
-                destination_Interface: (_modelAttributeMap$de = modelAttributeMap.destination_id) !== null && _modelAttributeMap$de !== void 0 && _modelAttributeMap$de.userVisible ? (_attributeMap$destina = attributeMap.destination_id_object) === null || _attributeMap$destina === void 0 ? void 0 : _attributeMap$destina.displayName : false
+                destination_Interface: (_modelAttributeMap$de = modelAttributeMap.destination_id) !== null && _modelAttributeMap$de !== void 0 && _modelAttributeMap$de.userVisible ? (_attributeMap$destina = attributeMap.destination_id_object) === null || _attributeMap$destina === void 0 ? void 0 : _attributeMap$destina.displayName : false,
+                'network_link.connect_type': (_modelAttributeMap$ne = modelAttributeMap['network_link.connect_type']) !== null && _modelAttributeMap$ne !== void 0 && _modelAttributeMap$ne.userVisible ? connect_type : false
               }); // 资源/链路-关键指标 数据 metrics，模型 topo.ciTyeCache.getCiType(ciType)
 
               setIndicator(displayMetricModels.map(function (item) {
@@ -233,7 +233,7 @@ export default function ResourceOverview(props) {
 
               getAlarmRiskData(id);
 
-            case 26:
+            case 25:
             case "end":
               return _context.stop();
           }
@@ -642,7 +642,8 @@ export default function ResourceOverview(props) {
       data: data,
       ciAttrAndMetricData: ciAttrAndMetricData
     },
-    data: indicator
+    data: indicator,
+    loading: metricInitLoading
   })), /*#__PURE__*/React.createElement(BlockBox, {
     headerTitle: "\u6700\u8FD1\u7684\u544A\u8B66\u548C\u98CE\u9669"
   }, /*#__PURE__*/React.createElement("div", {