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

package/lib/core/editor/components/EditorPlugin.js

@@ -13,8 +13,6 @@ var _IconManage = _interopRequireDefault(require("./iconManage/IconManage"));
 
 var _LinkDynamicStyleSettingDrawer = _interopRequireDefault(require("./LinkDynamicStyleSettingDrawer"));
 
-var _ResourceViewAttributeSettingPlugin = _interopRequireDefault(require("./ResourceViewAttributeSetting/ResourceViewAttributeSettingPlugin"));
-
 var _Link = _interopRequireDefault(require("../../../components/Link"));
 
 var _SaveLoading = _interopRequireDefault(require("./plugins/SaveLoading"));
@@ -23,13 +21,15 @@ var _MultipleResourceSelectPlugin = _interopRequireDefault(require("./plugins/Mu
 
 var _GroupAddResourceDrawerPlugin = _interopRequireDefault(require("./GroupAddResourceDrawerPlugin"));
 
+// import ResourceViewAttributeSettingPlugin from './ResourceViewAttributeSetting/ResourceViewAttributeSettingPlugin';
 function TopoEditorPlugin(props) {
   var topo = props.topo,
       topoContext = props.topoContext,
       topoEdit = props.topoEdit,
       editorProps = props.editorProps;
   var store = topo.store;
-  var plugins = [_SaveLoading["default"], _GroupAddResourceDrawerPlugin["default"], _MultipleResourceSelectPlugin["default"], _ResourceViewAttributeSettingPlugin["default"], _Link["default"], _IconManage["default"], _LinkDynamicStyleSettingDrawer["default"]].concat((editorProps === null || editorProps === void 0 ? void 0 : editorProps.plugins) || []);
+  var plugins = [_SaveLoading["default"], _GroupAddResourceDrawerPlugin["default"], _MultipleResourceSelectPlugin["default"], // ResourceViewAttributeSettingPlugin,
+  _Link["default"], _IconManage["default"], _LinkDynamicStyleSettingDrawer["default"]].concat((editorProps === null || editorProps === void 0 ? void 0 : editorProps.plugins) || []);
   return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, plugins.map(function (Plugin, index) {
     return /*#__PURE__*/_react["default"].createElement(Plugin, (0, _extends2["default"])({
       key: index,

package/lib/core/editor/components/settings/propertyViews/view/GlobalTootipSetting.js

@@ -11,7 +11,7 @@ var _react = _interopRequireWildcard(require("react"));
 
 require("@riil-frontend/css/lib/index.scss");
 
-var _Setting = _interopRequireDefault(require("../../../ResourceViewAttributeSetting/Setting"));
+var _Setting = _interopRequireDefault(require("../../../../../components/ResourceViewAttributeSetting/Setting"));
 
 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); }
 
@@ -19,6 +19,8 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 /**
  * 显示属性、指标配置
+ * 
+ * 已废弃
  */
 function GlobalTootipSetting(props) {
   var topo = props.topo;

package/lib/core/editor/components/settings/propertyViews/view/ViewPropertyView.js

@@ -45,10 +45,5 @@ function ViewPropertyView(props) {
     title: "\u5E03\u5C40"
   }, /*#__PURE__*/_react["default"].createElement(_GlobalLayout["default"], {
     topo: topo
-  })), /*#__PURE__*/_react["default"].createElement(CollapsePanel, {
-    key: "\u5C5E\u6027/\u6307\u6807\u663E\u793A\u8BBE\u7F6E",
-    title: "\u5C5E\u6027/\u6307\u6807\u663E\u793A\u8BBE\u7F6E"
-  }, /*#__PURE__*/_react["default"].createElement(_GlobalTootipSetting["default"], {
-    topo: topo
   }))))));
 }

package/lib/core/models/AttributeMetricDisplay.js

@@ -7,10 +7,10 @@ exports["default"] = void 0;
 
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 var _topo = _interopRequireDefault(require("@riil-frontend/component-topology-common/es/services/topo"));
 
 var _rlog = _interopRequireDefault(require("@riil-frontend/component-topology-utils/es/rlog"));
@@ -23,9 +23,16 @@ var _attributeFormatter = _interopRequireDefault(require("./attributeFormatter")
 
 var _DictCache = _interopRequireDefault(require("./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;
@@ -36,11 +43,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
     };
   }
   /**
@@ -64,41 +75,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 || _ResourceInfoDisplay.DEFAULT_NODE_TAG_COMMON_CONFIG),
       tips: getItems(nodeTip || _ResourceInfoDisplay.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
-      };
-    });
   }
   /**
    * 按链路类型获取对应的属性、指标配置
@@ -109,31 +92,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((0, _extends2["default"])({}, 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 = {};
@@ -145,8 +141,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 || _ResourceInfoDisplay.DEFAULT_TAG_COMMON_CONFIG, connectType),
+        tips: getItems(linkTip || _ResourceInfoDisplay.DEFAULT_TIP_COMMON_CONFIG, connectType)
       };
     });
     return linkConfig[link.detail.attributes['network_link.connect_type']] || {
@@ -166,9 +162,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) {
@@ -186,11 +183,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 = {
@@ -206,7 +218,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;
     });
   }
@@ -228,6 +251,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);
+    });
+  }
   /**
    * 查询拓扑图资源的属性指标
    * 
@@ -239,27 +310,48 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
   /*#__PURE__*/
   function () {
     var _getData = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].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 _regenerator["default"].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 = (0, _topoData.findItem)(links, 'id', data.id);
+
+                if (!link) {
+                  return data;
+                }
+
+                var attributeMap = data.attributeMap;
+
+                if (!Object.keys(attributeMap).length) {
+                  attributeMap = (0, _extends2["default"])({}, link.attributes || {});
+                }
+
+                return (0, _extends2["default"])({}, 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["default"].init();
 
-            case 5:
+            case 6:
               // 需要查询的指标列表
               codes = this.getResourceMetricCodes(); // if (!codes.length) {
               //   return [];
@@ -269,15 +361,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 _topo["default"].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((0, _extends2["default"])({}, data, {
+                  attributeMap: list2map(data.attributes),
+                  metricMap: list2map(data.metrics)
+                }), _this4.topo);
+              }));
+
+            case 12:
             case "end":
               return _context.stop();
           }
@@ -315,7 +427,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
 
             case 4:
               // 获取标注、悬浮框配置
-              ciConfigs = topo.attributeMetricDisplay.getResourceTagTipConfig();
+              ciConfigs = this.getResourceTagTipConfig();
               formatter = new _attributeFormatter["default"](this.topo);
               tagAndTip = ciConfigs.map(function (ciConfig) {
                 // 获取ci数据
@@ -329,7 +441,10 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
                 };
               }); // 刷新标注、浮层
 
-              _rlog["default"].debug('TopoView:sendAttributesData', tagAndTip);
+              _rlog["default"].debug('属性指标:loadAttributeAndMetric', {
+                tagAndTip: tagAndTip,
+                ciConfigs: ciConfigs
+              });
 
               topo.getHtTopo().loadTagAndTip(tagAndTip);
 

package/lib/core/models/TopoApp.js

@@ -33,8 +33,6 @@ var _Test = _interopRequireDefault(require("../test/Test"));
 
 var _topoData = require("../../utils/topoData");
 
-var _attrAndMetric = require("./attrAndMetric");
-
 var _DictCache = _interopRequireDefault(require("./cache/DictCache"));
 
 var _AttributeMetricDisplay = _interopRequireDefault(require("./AttributeMetricDisplay"));
@@ -63,6 +61,7 @@ var TopoApp = /*#__PURE__*/function () {
     this.store = void 0;
     this.serverApi = _topo["default"];
     this.ciTyeCache = _CiTyeCache["default"];
+    this.dictCache = _DictCache["default"];
     this.test = void 0;
     this.options = (0, _extends2["default"])({
       enableDefaultAlarmLoader: true,
@@ -623,9 +622,15 @@ var TopoApp = /*#__PURE__*/function () {
     }
 
     return exitEditMode;
-  }();
+  }()
+  /**
+   * 后续待优化，移除该接口，由ht提供原子接口获取相关数据
+   */
+  ;
 
-  _proto.triggerSaveEvent = /*#__PURE__*/function () {
+  _proto.triggerSaveEvent =
+  /*#__PURE__*/
+  function () {
     var _triggerSaveEvent = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee14() {
       return _regenerator["default"].wrap(function _callee14$(_context14) {
         while (1) {
@@ -646,9 +651,15 @@ var TopoApp = /*#__PURE__*/function () {
     }
 
     return triggerSaveEvent;
-  }();
+  }()
+  /**
+   * 后续待优化，移除该接口，由ht提供原子接口获取相关数据
+   */
+  ;
 
-  _proto.save = /*#__PURE__*/function () {
+  _proto.save =
+  /*#__PURE__*/
+  function () {
     var _save = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee15() {
       return _regenerator["default"].wrap(function _callee15$(_context15) {
         while (1) {
@@ -726,21 +737,11 @@ var TopoApp = /*#__PURE__*/function () {
         while (1) {
           switch (_context17.prev = _context17.next) {
             case 0:
-              _context17.next = 2;
-              return _DictCache["default"].init();
-
-            case 2:
-              (0, _attrAndMetric.updateAttrsAndMetrics)({
-                topo: this,
-                data: data
-              });
-
-            case 3:
             case "end":
               return _context17.stop();
           }
         }
-      }, _callee17, this);
+      }, _callee17);
     }));
 
     function loadAttrsAndMetrics(_x11) {

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

@@ -5,6 +5,8 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 exports.__esModule = true;
 exports["default"] = void 0;
 
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
 var _utils = require("@riil-frontend/utils");
 
 var _topoData = require("../../../utils/topoData");
@@ -32,6 +34,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 {};
+}
 /**
  * 标注值格式化
  */
@@ -43,9 +72,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)
     };
   }
 
@@ -68,16 +95,15 @@ var AttributeFormatter = /*#__PURE__*/function () {
 
     var attrCode = item.code;
     var metricMeta = this.topo.ciTyeCache.getCiType(ciData.ciType)[attrType + "Map"][attrCode];
-    var metricValue = (_findItem = (0, _topoData.findItem)(ciData[attrType + "s"], 'code', attrCode)) === null || _findItem === void 0 ? void 0 : _findItem.value;
-    return {
+    var metricValue = ciData[attrType + "Map"][attrCode] || ((_findItem = (0, _topoData.findItem)(ciData[attrType + "s"], 'code', attrCode)) === null || _findItem === void 0 ? void 0 : _findItem.value);
+    return (0, _extends2["default"])({
       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) {