@riil-frontend/component-topology 2.14.2-alpha.2 → 2.14.2-alpha.6

package/es/core/models/AttributeMetricDisplay.js

@@ -1,16 +1,23 @@
-import _extends from "@babel/runtime/helpers/extends";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _extends from "@babel/runtime/helpers/extends";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import topoServer from '@riil-frontend/component-topology-common/es/services/topo';
 import rlog from '@riil-frontend/component-topology-utils/es/rlog';
-import { DEFAULT_NODE_TAG_COMMON_CONFIG, DEFAULT_TIP_COMMON_CONFIG } from "../../constants/ResourceInfoDisplay";
+import { DEFAULT_NODE_TAG_COMMON_CONFIG, DEFAULT_TAG_COMMON_CONFIG, DEFAULT_TIP_COMMON_CONFIG } from "../../constants/ResourceInfoDisplay";
 import { findItem } from "../../utils/topoData";
 import AttributeFormatter from "./attributeFormatter";
 import DictCache from "./cache/DictCache";
+
+function filterUnExistedFields(fields, ciTypeMeta) {
+  return fields.filter(function (item) {
+    return item.type !== 'graph' && (item.type === 'attribute' && ciTypeMeta.attributeMap[item.code] || item.type === 'metric' && ciTypeMeta.metricMap[item.code] || item.type !== 'attribute' && item.type !== 'metric');
+  });
+}
 /**
  * 资源标注、悬浮框数据
  */
 
+
 var AttributeMetricDisplay = /*#__PURE__*/function () {
   function AttributeMetricDisplay(topo) {
     this.topo = topo;
@@ -21,11 +28,15 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
   _proto.getConfig = function getConfig(config) {
     var _ref = config || this.topo.store.getModelState('displayConfig'),
         nodeTag = _ref.nodeTag,
-        nodeTip = _ref.nodeTip;
+        nodeTip = _ref.nodeTip,
+        linkTag = _ref.linkTag,
+        linkTip = _ref.linkTip;
 
     return {
       nodeTag: nodeTag,
-      nodeTip: nodeTip
+      nodeTip: nodeTip,
+      linkTag: linkTag,
+      linkTip: linkTip
     };
   }
   /**
@@ -49,41 +60,13 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
           data = cfg.data;
       var items = isCustom ? data[ciType] : data; // TODO 过滤类型不存在的属性和指标、图上名称
 
-      return items.filter(function (item) {
-        return item.type !== 'graph' && (item.type === 'attribute' && ciTypeMeta.attributeMap[item.code] || item.type === 'metric' && ciTypeMeta.metricMap[item.code] || item.type !== 'attribute' && item.type !== 'metric');
-      });
+      return filterUnExistedFields(items, ciTypeMeta);
     }
 
     return {
       tags: getItems(nodeTag || DEFAULT_NODE_TAG_COMMON_CONFIG),
       tips: getItems(nodeTip || DEFAULT_TIP_COMMON_CONFIG)
     };
-  } // 获取资源节点是否显示名称配置
-  ;
-
-  _proto.getNodeNameVisibleConfig = function getNodeNameVisibleConfig(config) {
-    var nodes = this.topo.store.getModelState('topoMod').data.nodes;
-
-    var _this$getConfig2 = this.getConfig(config),
-        nodeTag = _this$getConfig2.nodeTag;
-
-    return nodes.map(function (node) {
-      var visible = true;
-
-      if (nodeTag) {
-        var isCustom = nodeTag.isCustom,
-            data = nodeTag.data;
-        var items = isCustom ? data[node.ciType] : data;
-        visible = !!items.filter(function (item) {
-          return item.type === 'graph';
-        }).length;
-      }
-
-      return {
-        id: node.id,
-        visible: visible
-      };
-    });
   }
   /**
    * 按链路类型获取对应的属性、指标配置
@@ -94,31 +77,44 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
   ;
 
   _proto.getNetworkLinkConfig = function getNetworkLinkConfig(link, config) {
-    var _this$getConfig3 = this.getConfig(config),
-        linkTag = _this$getConfig3.linkTag,
-        linkTip = _this$getConfig3.linkTip;
+    var _this$getConfig2 = this.getConfig(config),
+        linkTag = _this$getConfig2.linkTag,
+        linkTip = _this$getConfig2.linkTip;
 
     var linkConnectType = link.detail.attributes['network_link.connect_type'];
-    var ciTypeModel = this.topo.ciTyeCache.getNetworkLinkCiType(linkConnectType);
+    var ciTypeMeta = this.topo.ciTyeCache.getNetworkLinkCiType(linkConnectType);
 
     function getItems(cfg, connectType) {
+      if (!ciTypeMeta) {
+        return [];
+      }
+
       var isCustom = cfg.isCustom,
           data = cfg.data;
-      var items = isCustom ? data[connectType.id] : data;
-      var arr = [];
-      items.forEach(function (item) {
+      var configItems = (isCustom ? data[connectType.id] : data) || [];
+      var items = [];
+      configItems.forEach(function (item) {
         if (item.type === 'metric') {
-          if (ciTypeModel.metricMap[item.code]) {
-            arr.push(item);
-          } else if (ciTypeModel.metricMap[item.code]) {}
+          var finalCode = null;
+          var code = item.code;
+
+          if (ciTypeMeta.metricMap[code]) {
+            finalCode = code;
+          } else if (ciTypeMeta.metricMap["" + connectType.metricPprefix + code]) {
+            finalCode = "" + connectType.metricPprefix + code;
+          }
+
+          if (finalCode) {
+            items.push(_extends({}, item, {
+              code: finalCode
+            }));
+          }
         } else {
-          arr.push(item);
+          items.push(item);
         }
-      }); // TODO 过滤不存在的，图上名称、IP地址 如果不存在需要过滤
+      }); // 过滤不存在的
 
-      return items.filter(function (item) {
-        return item.type !== 'graph';
-      });
+      return filterUnExistedFields(items, ciTypeMeta);
     }
 
     var linkConfig = {};
@@ -130,8 +126,8 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
       metricPprefix: 'agg_link.'
     }].forEach(function (connectType) {
       linkConfig[connectType.id] = {
-        tags: getItems(linkTag, connectType),
-        tips: getItems(linkTip, connectType)
+        tags: getItems(linkTag || DEFAULT_TAG_COMMON_CONFIG, connectType),
+        tips: getItems(linkTip || DEFAULT_TIP_COMMON_CONFIG, connectType)
       };
     });
     return linkConfig[link.detail.attributes['network_link.connect_type']] || {
@@ -151,9 +147,10 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
   _proto.getResourceTagTipConfig = function getResourceTagTipConfig(data, config) {
     var _this = this;
 
-    var _ref2 = data || this.topo.store.getModelState('topoMod').data,
+    // 获得图上业务节点、业务连线
+    var _ref2 = data || this.topo.getData(),
         nodes = _ref2.nodes,
-        links = _ref2.links; // 无权限不显示标注、悬浮框
+        lines = _ref2.lines; // 无权限不显示标注、悬浮框
 
 
     var filterByPermission = function filterByPermission(resource, items) {
@@ -171,11 +168,26 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
         tags: filterByPermission(node, ciTypeConfig.tags),
         tips: filterByPermission(node, ciTypeConfig.tips)
       };
+    }), lines.filter(function (link) {
+      return link.ciType === 'network_link';
+    }).map(function (link) {
+      var ciType = link.ciType;
+
+      var ciTypeConfig = _this.getNetworkLinkConfig(link, config);
+
+      return {
+        code: link.id,
+        ciType: ciType,
+        tags: filterByPermission(link, ciTypeConfig.tags),
+        tips: filterByPermission(link, ciTypeConfig.tips)
+      };
     }));
   } // 获取资源属性、指标配置（不包含显示名称）
   ;
 
   _proto.getResourceFields = function getResourceFields() {
+    var _this2 = this;
+
     return this.getResourceTagTipConfig().map(function (ciConfig) {
       // 非标注需要的属性往这里添加。例如动态改变带宽需要链路带宽
       var fields = {
@@ -191,7 +203,18 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
         if (Array.isArray(arr) && arr.indexOf(code) === -1) {
           arr.push(code);
         }
-      });
+      }); // 增加概览需要的指标字段
+
+      var overviewState = _this2.topo.store.getModelState('topoBaseInfoOverview');
+
+      if (overviewState.id === fields.id) {
+        overviewState.metricCodes.forEach(function (code) {
+          if (fields.metrics.indexOf(code) === -1) {
+            fields.metrics.push(code);
+          }
+        });
+      }
+
       return fields;
     });
   }
@@ -213,6 +236,54 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
     });
     return metricCodes;
   }
+  /**
+   * 从配置获得节点名称是否显示
+   * @param {*} node 
+   * @returns 
+   */
+  ;
+
+  _proto.getNodeNameVisible = function getNodeNameVisible(node) {
+    var _this$getConfig3 = this.getConfig(),
+        nodeTag = _this$getConfig3.nodeTag;
+
+    var visible = true;
+
+    if (nodeTag) {
+      var isCustom = nodeTag.isCustom,
+          data = nodeTag.data;
+      var items = isCustom ? data[node.ciType] : data;
+      visible = !!items.filter(function (item) {
+        return item.type === 'graph';
+      }).length;
+    }
+
+    return visible;
+  }
+  /**
+   * 根据配置执行节点名称显示隐藏
+   */
+  ;
+
+  _proto.updateNodesNameVisible = function updateNodesNameVisible() {
+    var _this3 = this;
+
+    var dm = this.topo.getDataModel();
+
+    var _this$topo$getData = this.topo.getData(),
+        nodes = _this$topo$getData.nodes;
+
+    nodes.map(function (node) {
+      return {
+        id: node.id,
+        visible: _this3.getNodeNameVisible(node)
+      };
+    }).forEach(function (_ref3) {
+      var id = _ref3.id,
+          visible = _ref3.visible;
+      dm.getDataByTag(id).a('isShowName', visible);
+    });
+  }
   /**
    * 查询拓扑图资源的属性指标
    * 
@@ -224,27 +295,48 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
   /*#__PURE__*/
   function () {
     var _getData = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-      var _this$topo$store$getS, resIdsList, nodeIdsList, linkIdsList, codes, param;
+      var _this4 = this;
+
+      var _this$topo$store$getS, resIdsList, nodeIdsList, linkIdsList, codes, param, linkAdapter, result;
 
       return _regeneratorRuntime.wrap(function _callee$(_context) {
         while (1) {
           switch (_context.prev = _context.next) {
             case 0:
+              linkAdapter = function _linkAdapter(data, topo) {
+                var links = topo.store.getModelState('topoMod').data.links;
+                var link = findItem(links, 'id', data.id);
+
+                if (!link) {
+                  return data;
+                }
+
+                var attributeMap = data.attributeMap;
+
+                if (!Object.keys(attributeMap).length) {
+                  attributeMap = _extends({}, link.attributes || {});
+                }
+
+                return _extends({}, data, {
+                  attributeMap: attributeMap
+                });
+              };
+
               _this$topo$store$getS = this.topo.store.getState().topoBizMod.resAndMetrics, resIdsList = _this$topo$store$getS.resIdsList, nodeIdsList = _this$topo$store$getS.nodeIdsList, linkIdsList = _this$topo$store$getS.linkIdsList; // rlog.debug('根据ci的id获取属性的值-getCiArrByIds', resIdsList, metrics);
               // 无资源，不查询
 
               if (resIdsList.length) {
-                _context.next = 3;
+                _context.next = 4;
                 break;
               }
 
               return _context.abrupt("return", []);
 
-            case 3:
-              _context.next = 5;
+            case 4:
+              _context.next = 6;
               return DictCache.init();
 
-            case 5:
+            case 6:
               // 需要查询的指标列表
               codes = this.getResourceMetricCodes(); // if (!codes.length) {
               //   return [];
@@ -254,15 +346,35 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
                 ciId: nodeIdsList,
                 codes: codes,
                 relationId: linkIdsList
-              }; // rlog.debug('AttributeMetricDisplay.getMetrics', param);
-
-              _context.next = 9;
+              };
+              /**
+               * 链路属性适配
+               * @param {*} data 
+               * @param {*} topo 
+               * @returns 
+               */
+
+              _context.next = 10;
               return topoServer.ciInfo.batchQueryCiInfo(param);
 
-            case 9:
-              return _context.abrupt("return", _context.sent);
-
             case 10:
+              result = _context.sent;
+              return _context.abrupt("return", result.map(function (data) {
+                var list2map = function list2map(list) {
+                  var map = {};
+                  (list || []).forEach(function (item) {
+                    map[item.code] = item.value;
+                  });
+                  return map;
+                };
+
+                return linkAdapter(_extends({}, data, {
+                  attributeMap: list2map(data.attributes),
+                  metricMap: list2map(data.metrics)
+                }), _this4.topo);
+              }));
+
+            case 12:
             case "end":
               return _context.stop();
           }
@@ -300,7 +412,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
 
             case 4:
               // 获取标注、悬浮框配置
-              ciConfigs = topo.attributeMetricDisplay.getResourceTagTipConfig();
+              ciConfigs = this.getResourceTagTipConfig();
               formatter = new AttributeFormatter(this.topo);
               tagAndTip = ciConfigs.map(function (ciConfig) {
                 // 获取ci数据
@@ -315,7 +427,10 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
                 };
               }); // 刷新标注、浮层
 
-              rlog.debug('TopoView:sendAttributesData', tagAndTip);
+              rlog.debug('属性指标:loadAttributeAndMetric', {
+                tagAndTip: tagAndTip,
+                ciConfigs: ciConfigs
+              });
               topo.getHtTopo().loadTagAndTip(tagAndTip);
 
             case 9:

package/es/core/models/TopoApp.js

@@ -12,7 +12,6 @@ import buildProvider from "../components/buildProvider";
 import { getEdgeDatas, getGroupDatas, getNodeDatas } from "../../utils/htElementUtils";
 import Test from "../test/Test";
 import { formatGroups } from "../../utils/topoData";
-import { updateAttrsAndMetrics } from "./attrAndMetric";
 import DictCache from "./cache/DictCache";
 import AttributeMetricDisplay from "./AttributeMetricDisplay";
 import TopoDataModel from "./TopoDataModel";
@@ -38,6 +37,7 @@ var TopoApp = /*#__PURE__*/function () {
     this.store = void 0;
     this.serverApi = topoService;
     this.ciTyeCache = CiTyeCache;
+    this.dictCache = DictCache;
     this.test = void 0;
     this.options = _extends({
       enableDefaultAlarmLoader: true,
@@ -597,9 +597,15 @@ var TopoApp = /*#__PURE__*/function () {
     }
 
     return exitEditMode;
-  }();
+  }()
+  /**
+   * 后续待优化，移除该接口，由ht提供原子接口获取相关数据
+   */
+  ;
 
-  _proto.triggerSaveEvent = /*#__PURE__*/function () {
+  _proto.triggerSaveEvent =
+  /*#__PURE__*/
+  function () {
     var _triggerSaveEvent = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee14() {
       return _regeneratorRuntime.wrap(function _callee14$(_context14) {
         while (1) {
@@ -620,9 +626,15 @@ var TopoApp = /*#__PURE__*/function () {
     }
 
     return triggerSaveEvent;
-  }();
+  }()
+  /**
+   * 后续待优化，移除该接口，由ht提供原子接口获取相关数据
+   */
+  ;
 
-  _proto.save = /*#__PURE__*/function () {
+  _proto.save =
+  /*#__PURE__*/
+  function () {
     var _save = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee15() {
       return _regeneratorRuntime.wrap(function _callee15$(_context15) {
         while (1) {
@@ -700,21 +712,11 @@ var TopoApp = /*#__PURE__*/function () {
         while (1) {
           switch (_context17.prev = _context17.next) {
             case 0:
-              _context17.next = 2;
-              return DictCache.init();
-
-            case 2:
-              updateAttrsAndMetrics({
-                topo: this,
-                data: data
-              });
-
-            case 3:
             case "end":
               return _context17.stop();
           }
         }
-      }, _callee17, this);
+      }, _callee17);
     }));
 
     function loadAttrsAndMetrics(_x11) {

package/es/core/models/attributeFormatter/index.js

@@ -1,3 +1,4 @@
+import _extends from "@babel/runtime/helpers/extends";
 import { metricValueFormat } from '@riil-frontend/utils';
 import { findItem } from "../../../utils/topoData";
 import DictCache from "../cache/DictCache";
@@ -23,6 +24,33 @@ function formatMetric(val, metricInfo) {
     return "" + val;
   }
 }
+
+function addLinkMetricUnderlineArrow(metricCode) {
+  var map = {
+    // 总流速和总带宽利用率：双向箭头
+    'link.total_flow_rate': 'both',
+    'link.bandwidth_utilization': 'both',
+    // 发送速率和发送带宽利用率：背向取值端口的箭头 指向目的
+    'link.out_rate': 'to',
+    'link.out_bandwidth_utilization': 'to',
+    // 接收速率和接收带宽利用率：指向取值端口的箭头 指向源
+    'link.in_rate': 'from',
+    'link.in_bandwidth_utilization': 'from'
+  };
+  var codes = Object.keys(map);
+
+  for (var i = 0; i < codes.length; i++) {
+    var code = codes[i];
+
+    if (metricCode.endsWith(code)) {
+      return {
+        underlineArrow: map[code]
+      };
+    }
+  }
+
+  return {};
+}
 /**
  * 标注值格式化
  */
@@ -34,9 +62,7 @@ var AttributeFormatter = /*#__PURE__*/function () {
     this.transformMap = {
       attribute: this.attributeTransform.bind(this),
       metric: this.metricTransform.bind(this),
-      ciType: this.ciTypeAttrTransform.bind(this),
-      linkMetric: null // TODO 链路自定义转换
-
+      ciType: this.ciTypeAttrTransform.bind(this)
     };
   }
 
@@ -59,16 +85,15 @@ var AttributeFormatter = /*#__PURE__*/function () {
 
     var attrCode = item.code;
     var metricMeta = this.topo.ciTyeCache.getCiType(ciData.ciType)[attrType + "Map"][attrCode];
-    var metricValue = (_findItem = findItem(ciData[attrType + "s"], 'code', attrCode)) === null || _findItem === void 0 ? void 0 : _findItem.value;
-    return {
+    var metricValue = ciData[attrType + "Map"][attrCode] || ((_findItem = findItem(ciData[attrType + "s"], 'code', attrCode)) === null || _findItem === void 0 ? void 0 : _findItem.value);
+    return _extends({
       type: item.type,
       code: item.code,
       // 属性code
       name: (metricMeta === null || metricMeta === void 0 ? void 0 : metricMeta.name) || '',
       // 属性名称
-      value: formatMetric(metricValue, metricMeta) // 属性数值
-
-    };
+      value: formatMetric(metricValue, metricMeta)
+    }, addLinkMetricUnderlineArrow(attrCode));
   };
 
   _proto.attributeTransform = function attributeTransform(item, ciData) {