@riil-frontend/component-topology 9.0.0-a.1 → 9.0.0-a.3

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

@@ -21,7 +21,7 @@ var LINE_TYPE_OPTIONS = [{
   label: '双折线',
   icon: 'topo_linear_icon_bilinear'
 }, {
-  value: 'flex',
+  value: 'doublearc',
   label: '双弧线',
   icon: 'topo_linear_icon_arcline'
 }];

package/es/core/hooks/useCiAttributeChange.js

@@ -0,0 +1,60 @@
+import _extends from "@babel/runtime/helpers/extends";
+import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { useEffect } from 'react';
+import CiCache from "../models/cache/CiCache";
+import useTopoEventListener from "./useTopoEventListener";
+
+function mergeData(cis, ciChangeData) {
+  if (!cis.find(function (item) {
+    return item.id === ciChangeData.id;
+  })) {
+    return cis;
+  }
+
+  return cis.map(function (ci) {
+    if (ci.id === ciChangeData.id) {
+      return _extends({}, ci, {
+        attributes: _extends({}, ci.attributes, ciChangeData.attributes)
+      });
+    }
+
+    return ci;
+  });
+}
+/**
+ * 监听ci属性变更
+ * 
+ * @param {*} props 
+ */
+
+
+export default function useCiAttributeChange(props) {
+  var topo = props.topo;
+  useTopoEventListener({
+    type: 'attribute',
+    onMessage: function onMessage(ciChangeData) {
+      // 更新拓扑数据
+      var topoData = topo.store.getModelState('topoMod').data;
+
+      if (topoData) {
+        var newData = _extends({}, topoData, {
+          nodes: mergeData(topoData.nodes, ciChangeData),
+          links: mergeData(topoData.links, ciChangeData),
+          linkGroups: mergeData(topoData.linkGroups, ciChangeData)
+        });
+
+        var topoDispatchers = topo.store.getModelDispatchers('topoMod');
+        topoDispatchers.update({
+          data: newData
+        });
+      } // 更新缓存
+
+
+      var ci = CiCache.getCi(ciChangeData.id);
+
+      if (ci) {
+        ci.attributes = _extends({}, ci.attributes, ciChangeData.attributes);
+      }
+    }
+  });
+}

package/es/core/hooks/usePolling.js

@@ -1,10 +1,14 @@
-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 { useEffect } from 'react';
 import { useRequest } from 'ahooks';
 import _ from 'lodash';
 import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import topoServer from '@riil-frontend/component-topology-common/es/services/topo';
+import { useCbbEventListener } from '@riil-frontend/component-riil-event-emitter';
+import DictCache from "../models/cache/DictCache";
+import useCiAttributeChange from "./useCiAttributeChange";
 /**
  * 轮询获取指标hooks
  * @param {*} props
@@ -13,12 +17,158 @@ import rlog from '@riil-frontend/component-topology-utils/es/rlog';
 var usePolling = function usePolling(props) {
   var topo = props.topo;
   var store = topo.store;
+  useCiAttributeChange({
+    topo: topo
+  });
   var bizState = store.useModelState('topoBizMod');
   var resAndMetrics = bizState.resAndMetrics,
       pollingSwitch = bizState.pollingSwitch;
   var displayConfig = topo.store.useModelState('displayConfig');
   var resourceOverviewState = topo.store.useModelState('topoBaseInfoOverview');
-  var resIdsList = resAndMetrics === null || resAndMetrics === void 0 ? void 0 : resAndMetrics.resIdsList; // 轮询hooks
+  var resIdsList = resAndMetrics === null || resAndMetrics === void 0 ? void 0 : resAndMetrics.resIdsList;
+  /**
+   * 查询拓扑图资源的属性指标
+   * 
+   * @returns {array}
+   */
+
+  function fetchData() {
+    return _fetchData.apply(this, arguments);
+  }
+  /**
+   * 
+   * @returns {{id, attributes: object[], metrics: object[]}[]} 属性和指标
+   */
+
+
+  function _fetchData() {
+    _fetchData = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      var _topo$store$getModelS, resIdsList, nodeIdsList, codes, param, _yield$Promise$all, ciMetricResult, transformLinkData;
+
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              transformLinkData = function _transformLinkData(data) {
+                var _topo$dataModel$getDa = topo.dataModel.getData(),
+                    links = _topo$dataModel$getDa.links,
+                    linkGroups = _topo$dataModel$getDa.linkGroups;
+
+                var link = [].concat(links, linkGroups).find(function (item) {
+                  return item.id === data.id;
+                });
+
+                if (!link) {
+                  return data;
+                }
+
+                return _extends({}, data, {
+                  attributeMap: link.attributes || {}
+                });
+              };
+
+              _topo$store$getModelS = topo.store.getModelState('topoBizMod').resAndMetrics, resIdsList = _topo$store$getModelS.resIdsList, nodeIdsList = _topo$store$getModelS.nodeIdsList; // rlog.debug('根据ci的id获取属性的值-getCiArrByIds', resIdsList, metrics);
+              // 无资源，不查询
+
+              if (resIdsList.length) {
+                _context.next = 4;
+                break;
+              }
+
+              return _context.abrupt("return", []);
+
+            case 4:
+              // 需要查询的指标列表
+              codes = topo.attributeMetricDisplay.getResourceMetricCodes();
+              param = {
+                ciId: nodeIdsList,
+                codes: codes,
+                // 过滤掉不需要查询的
+                relationId: topo.attributeMetricDisplay.getEdges().map(function (edge) {
+                  return {
+                    ciId: edge.id,
+                    operation: edge.operation
+                  };
+                })
+              };
+              _context.t0 = Promise;
+              _context.t1 = // 查询指标值
+              topoServer.ciInfo.batchQueryCiInfo(param);
+              _context.next = 10;
+              return DictCache.init();
+
+            case 10:
+              _context.t2 = _context.sent;
+              _context.t3 = [_context.t1, _context.t2];
+              _context.next = 14;
+              return _context.t0.all.call(_context.t0, _context.t3);
+
+            case 14:
+              _yield$Promise$all = _context.sent;
+              ciMetricResult = _yield$Promise$all[0];
+              return _context.abrupt("return", ciMetricResult.map(function (data) {
+                var ci = topo.dataModel.getDataById(data.id);
+
+                var resultData = _extends({}, data, ci, {
+                  attributeMap: _extends({}, (ci === null || ci === void 0 ? void 0 : ci.attributes) || {})
+                });
+
+                resultData = transformLinkData(resultData); // 特殊处理：ipv6 从ipv6_address_list取第一个
+
+                // 特殊处理：ipv6 从ipv6_address_list取第一个
+                if (resultData.attributeMap.ipv6_address_list && !resultData.attributeMap.ipv6_address) {
+                  resultData.attributeMap.ipv6_address = (resultData.attributeMap.ipv6_address_list || '').split(',')[0];
+                }
+
+                return resultData;
+              }));
+
+            case 17:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
+    return _fetchData.apply(this, arguments);
+  }
+
+  function refresh() {
+    return _refresh.apply(this, arguments);
+  } // 轮询hooks
+
+
+  function _refresh() {
+    _refresh = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+      var data;
+      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              if (!(!pollingSwitch || !(resAndMetrics !== null && resAndMetrics !== void 0 && resAndMetrics.resIdsList.length))) {
+                _context2.next = 2;
+                break;
+              }
+
+              return _context2.abrupt("return");
+
+            case 2:
+              _context2.next = 4;
+              return fetchData();
+
+            case 4:
+              data = _context2.sent;
+              return _context2.abrupt("return", data);
+
+            case 6:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    }));
+    return _refresh.apply(this, arguments);
+  }
 
   var _useRequest = useRequest(refresh, {
     pollingInterval: 60 * 1000,
@@ -29,30 +179,13 @@ var usePolling = function usePolling(props) {
       if (result) {
         var dd = _.cloneDeep(result);
 
-        topo.attributeMetricDisplay.loadAttributeAndMetric(dd);
+        topo.attributeMetricDisplay.loadData(dd);
       }
     }
   }),
       loading = _useRequest.loading,
       startPoll = _useRequest.run,
-      stopPoll = _useRequest.cancel;
-
-  function convertData(data) {
-    return data.map(function (item) {
-      return _extends({}, item, {
-        attributes: convertAttrMap(item.attributes),
-        metrics: convertAttrMap(item.metrics)
-      });
-    });
-  }
-
-  function convertAttrMap(attrs) {
-    var map = {};
-    attrs.forEach(function (attr) {
-      map[attr.code] = attr.value;
-    });
-    return map;
-  } // 需要刷新数据的场景：显示模式、资源变化、配置变化、开关开启、概览
+      stopPoll = _useRequest.cancel; // 需要刷新数据的场景：显示模式、资源变化、配置变化、开关开启、概览
 
 
   useEffect(function () {
@@ -72,46 +205,16 @@ var usePolling = function usePolling(props) {
         stopPoll();
       }
     };
-  }, [pollingSwitch, resIdsList, displayConfig, resourceOverviewState.id, resourceOverviewState.metricCodes]);
-  /**
-   * 
-   * @returns {{id, attributes: object[], metrics: object[]}[]} 属性和指标
-   */
-
-  function refresh() {
-    return _refresh.apply(this, arguments);
-  }
-
-  function _refresh() {
-    _refresh = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-      return _regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              if (!(!pollingSwitch || !(resAndMetrics !== null && resAndMetrics !== void 0 && resAndMetrics.resIdsList.length))) {
-                _context.next = 2;
-                break;
-              }
-
-              return _context.abrupt("return");
-
-            case 2:
-              _context.next = 4;
-              return topo.attributeMetricDisplay.fetchData();
-
-            case 4:
-              return _context.abrupt("return", _context.sent);
-
-            case 5:
-            case "end":
-              return _context.stop();
-          }
-        }
-      }, _callee);
-    }));
-    return _refresh.apply(this, arguments);
-  }
+  }, [pollingSwitch, resIdsList, displayConfig, resourceOverviewState.id, resourceOverviewState.metricCodes]); // 属性变更监听更新
 
+  useCbbEventListener('topo', {
+    name: 'topo',
+    onMessage: function onMessage(message) {
+      if (message.type === 'attribute') {
+        var data = message.data;
+      }
+    }
+  });
   return {
     startPoll: startPoll,
     stopPoll: stopPoll

package/es/core/models/AttributeMetricDisplay.js

@@ -346,107 +346,50 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
     });
   }
   /**
-   * 查询拓扑图资源的属性指标
+   * 加载标注、悬浮框数据
    * 
-   * @returns {array}
+   * @param {array<{id, attributeMap: {}, metricMap: {}}>} data
    */
   ;
 
-  _proto.fetchData =
+  _proto.loadData =
   /*#__PURE__*/
   function () {
-    var _fetchData = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-      var topo, _topo$store$getModelS, resIdsList, nodeIdsList, codes, param, transformLinkData, result;
-
+    var _loadData = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(data) {
+      var topo, ciDatas, bizDispatchers;
       return _regeneratorRuntime.wrap(function _callee$(_context) {
         while (1) {
           switch (_context.prev = _context.next) {
             case 0:
-              transformLinkData = function _transformLinkData(data) {
-                var _topo$dataModel$getDa = topo.dataModel.getData(),
-                    links = _topo$dataModel$getDa.links,
-                    linkGroups = _topo$dataModel$getDa.linkGroups;
-
-                var link = [].concat(links, linkGroups).find(function (item) {
-                  return item.id === data.id;
-                });
-
-                if (!link) {
-                  return data;
-                }
-
-                var attributeMap = data.attributeMap;
-                attributeMap = _extends({}, link.attributes || {});
-                return _extends({}, data, {
-                  attributeMap: attributeMap
-                });
-              };
+              // rlog.debug('AttributeMetricDisplay.loadAttributeAndMetric', data);
+              topo = this.topo; // 设置ciType
 
-              topo = this.topo;
-              _topo$store$getModelS = topo.store.getModelState('topoBizMod').resAndMetrics, resIdsList = _topo$store$getModelS.resIdsList, nodeIdsList = _topo$store$getModelS.nodeIdsList; // rlog.debug('根据ci的id获取属性的值-getCiArrByIds', resIdsList, metrics);
-              // 无资源，不查询
+              ciDatas = data.filter(function (item) {
+                // 过滤不存在的ci，解决编辑模式删除资源后切换到显示模式报错
+                return !!topo.dataModel.getDataById(item.id);
+              }).map(function (item) {
+                return _extends({
+                  ciType: topo.dataModel.getDataById(item.id).ciType
+                }, item);
+              }); // 翻译引用属性
 
-              if (resIdsList.length) {
-                _context.next = 5;
-                break;
-              }
+              _context.next = 4;
+              return this.translateRefAttribute(ciDatas);
 
-              return _context.abrupt("return", []);
+            case 4:
+              ciDatas = _context.sent;
+              bizDispatchers = topo.store.getModelDispatchers('topoBizMod');
+              _context.next = 8;
+              return bizDispatchers.setAttrsAndMetrics(ciDatas);
 
-            case 5:
-              _context.next = 7;
+            case 8:
+              _context.next = 10;
               return DictCache.init();
 
-            case 7:
-              // 需要查询的指标列表
-              codes = this.getResourceMetricCodes();
-              param = {
-                ciId: nodeIdsList,
-                codes: codes,
-                // 过滤掉不需要查询的
-                relationId: this.getEdges().map(function (edge) {
-                  return {
-                    ciId: edge.id,
-                    operation: edge.operation
-                  };
-                })
-              };
-              /**
-               * 链路属性适配
-               * @param {*} data 
-               * @returns 
-               */
-
-              _context.next = 11;
-              return topoServer.ciInfo.batchQueryCiInfo(param);
+            case 10:
+              this.updateTagsTips();
 
             case 11:
-              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;
-                };
-
-                var resultData = _extends({}, data, {
-                  attributeMap: list2map(data.attributes),
-                  metricMap: list2map(data.metrics)
-                });
-
-                resultData = transformLinkData(resultData); // 特殊处理：ipv6 从ipv6_address_list取第一个
-
-                // 特殊处理：ipv6 从ipv6_address_list取第一个
-                if (resultData.attributeMap.ipv6_address_list && !resultData.attributeMap.ipv6_address) {
-                  resultData.attributeMap.ipv6_address = (resultData.attributeMap.ipv6_address_list || '').split(',')[0];
-                }
-
-                return resultData;
-              }));
-
-            case 13:
             case "end":
               return _context.stop();
           }
@@ -454,16 +397,17 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
       }, _callee, this);
     }));
 
-    function fetchData() {
-      return _fetchData.apply(this, arguments);
+    function loadData(_x) {
+      return _loadData.apply(this, arguments);
     }
 
-    return fetchData;
+    return loadData;
   }()
   /**
    * 加载标注、悬浮框数据
+   * 业务拓扑使用
    * 
-   * @param {array} data
+   * @param {array<{id, attributes: [], attributeMap: {}, metrics: [], metricMap: {}}>} data
    */
   ;
 
@@ -471,40 +415,14 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
   /*#__PURE__*/
   function () {
     var _loadAttributeAndMetric = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(data) {
-      var topo, ciDatas, bizDispatchers;
       return _regeneratorRuntime.wrap(function _callee2$(_context2) {
         while (1) {
           switch (_context2.prev = _context2.next) {
             case 0:
-              // rlog.debug('AttributeMetricDisplay.loadAttributeAndMetric', data);
-              topo = this.topo; // 设置ciType
-
-              ciDatas = data.filter(function (item) {
-                // 过滤不存在的ci，解决编辑模式删除资源后切换到显示模式报错
-                return !!topo.dataModel.getDataById(item.id);
-              }).map(function (item) {
-                return _extends({
-                  ciType: topo.dataModel.getDataById(item.id).ciType
-                }, item);
-              }); // 翻译引用属性
-
-              _context2.next = 4;
-              return this.translateRefAttribute(ciDatas);
-
-            case 4:
-              ciDatas = _context2.sent;
-              bizDispatchers = topo.store.getModelDispatchers('topoBizMod');
-              _context2.next = 8;
-              return bizDispatchers.setAttrsAndMetrics(ciDatas);
+              _context2.next = 2;
+              return this.loadData(data);
 
-            case 8:
-              _context2.next = 10;
-              return DictCache.init();
-
-            case 10:
-              this.updateTagsTips();
-
-            case 11:
+            case 2:
             case "end":
               return _context2.stop();
           }
@@ -512,7 +430,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
       }, _callee2, this);
     }));
 
-    function loadAttributeAndMetric(_x) {
+    function loadAttributeAndMetric(_x2) {
       return _loadAttributeAndMetric.apply(this, arguments);
     }
 
@@ -520,7 +438,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
   }()
   /**
    * 临时由前端翻译引用属性名称
-   * @param {array} ciDatas 
+   * @param {array<{id, ciType, attributeMap: {}, ...}>} ciDatas 
    * @returns 
    */
   ;
@@ -531,7 +449,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
     var _translateRefAttribute = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(ciDatas) {
       var _this5 = this;
 
-      var refIdMap, ciRefAttributeMap, refIds, refCis, refCiMap;
+      var refIdMap, ciRefAttributeMap, refIds, refCiMap;
       return _regeneratorRuntime.wrap(function _callee3$(_context3) {
         while (1) {
           switch (_context3.prev = _context3.next) {
@@ -577,11 +495,10 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
 
             case 6:
               _context3.next = 8;
-              return queryCisByIds(refIds);
+              return this.topo.ciCache.load(refIds);
 
             case 8:
-              refCis = _context3.sent;
-              refCiMap = keyBy(refCis, 'id');
+              refCiMap = _context3.sent;
               rlog.debug('translateRefAttribute', {
                 ciRefAttributeMap: ciRefAttributeMap,
                 refIds: refIds,
@@ -607,15 +524,15 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
                 });
               }));
 
-            case 12:
+            case 11:
             case "end":
               return _context3.stop();
           }
         }
-      }, _callee3);
+      }, _callee3, this);
     }));
 
-    function translateRefAttribute(_x2) {
+    function translateRefAttribute(_x3) {
       return _translateRefAttribute.apply(this, arguments);
     }
 
@@ -636,8 +553,8 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
 
     var elementTagsAndTips = this.buildTagsTips() // 开锁状态下禁用悬停展示悬浮框
     .map(function (item) {
-      var _topo$store$getModelS2 = topo.store.getModelState('lock'),
-          lock = _topo$store$getModelS2.lock;
+      var _topo$store$getModelS = topo.store.getModelState('lock'),
+          lock = _topo$store$getModelS.lock;
 
       return lock ? item : _extends({}, item, {
         tips: []

package/es/core/models/TopoApp.js

@@ -21,9 +21,10 @@ import { updateEdgeExpanded } from "../utils/edgeUtil";
 import PluginManager from "./PluginManager";
 import topoFactory from "./topoFactory";
 import ElementTagTipConfig from "./tagstips/ElementTagTipConfig";
-import SelectionModel from "./SelectionModel"; // eslint-disable-next-line no-undef
+import SelectionModel from "./SelectionModel";
+import CiCache from "./cache/CiCache"; // eslint-disable-next-line no-undef
 
-var version = typeof "9.0.0-a.1" === 'string' ? "9.0.0-a.1" : null;
+var version = typeof "9.0.0-a.3" === 'string' ? "9.0.0-a.3" : null;
 console.info("\u62D3\u6251\u7248\u672C: " + version);
 /**
  * 拓扑显示和编辑
@@ -43,6 +44,7 @@ var Topo = /*#__PURE__*/function () {
     this.CiTypeCache = CiTypeCache;
     this.ciTyeCache = CiTypeCache;
     this.dictCache = DictCache;
+    this.ciCache = CiCache;
     this.elementTagTipConfig = new ElementTagTipConfig(this);
     this.test = void 0;
     this.uid = void 0;

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

@@ -1,6 +1,5 @@
 import rlog from '@riil-frontend/component-topology-utils/es/rlog';
 import { metricValueFormat } from '@riil-frontend/utils';
-import { findItem } from "../../../utils/topoData";
 import DictCache from "../cache/DictCache";
 /**
    * 格式化指标
@@ -54,14 +53,14 @@ var AttributeFormatter = /*#__PURE__*/function () {
   };
 
   _proto.commonTransform = function commonTransform(item, ciData, attrType) {
-    var _findItem;
-
     var fieldCode = item.code;
     var fieldMeta = this.topo.ciTyeCache.getCiType(ciData.ciType)[attrType + "Map"][fieldCode];
-    var fieldValue = ciData[attrType + "Map"][fieldCode] || ((_findItem = findItem(ciData[attrType + "s"], 'code', fieldCode)) === null || _findItem === void 0 ? void 0 : _findItem.value);
+    var fieldValue = (ciData[attrType + "Map"] || ciData[attrType + "s"])[fieldCode]; // 引用属性
 
-    if (ciData[attrType + "Map"][fieldCode + "_object"]) {
-      fieldValue = ciData[attrType + "Map"][fieldCode + "_object"].displayName;
+    if (attrType === 'attribute') {
+      if (ciData[attrType + "Map"][fieldCode + "_object"]) {
+        fieldValue = ciData[attrType + "Map"][fieldCode + "_object"].displayName;
+      }
     }
 
     return {

package/es/core/models/cache/CiCache.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Ci缓存
+ */
+declare class CiCache {
+    /**
+     * @param {object<string, object>}
+     */
+    ciMap: {};
+    /**
+     *
+     * @param ids {string[]}
+     * @returns {Promise<Object>}
+     */
+    load(ids: string[]): Promise<Object>;
+    getCi(id: string): Object;
+}
+declare const _default: CiCache;
+export default _default;