@riil-frontend/component-topology 11.0.35 → 12.0.0-dev.2

package/lib/core/editor/utils/copyElementUtil.js

@@ -0,0 +1,187 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports.handleCopyHotkey = handleCopyHotkey;
+exports.handlePasteHotkey = handlePasteHotkey;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
+var _clipboardUtil = require("../../../utils/clipboardUtil");
+
+function handleCopyHotkey(event, options) {
+  var target = event.target || event.srcElement;
+  var tagName = target.tagName;
+
+  if (tagName !== 'BODY') {
+    copy(options.topo);
+  }
+}
+
+function handlePasteHotkey(event, options) {
+  var target = event.target || event.srcElement;
+  var tagName = target.tagName;
+
+  if (tagName !== 'BODY') {
+    paste(options);
+  }
+}
+
+function copy(topo) {
+  var gv = topo.getHtTopo().getGraphView();
+  var dm = gv.dm();
+  var sm = dm.sm();
+  var serializer = new ht.JSONSerializer(dm);
+
+  serializer.isSerializable = function (data) {
+    //可在此设置要选中的数据或者在copy处
+    // if(sm.co(data)){
+    //   if(data instanceof ht.Group){
+    //     sm.as(data.getChildren());
+    //   }
+    // }
+    return sm.co(data);
+  };
+
+  var copyData = {
+    copyTopoElements: true,
+    source: {
+      id: topo.id,
+      topoType: topo.viewProps.topoType
+    },
+    data: serializer.toJSON()
+  };
+  writeClipboard(JSON.stringify(copyData, null, 0));
+}
+
+function paste(_x) {
+  return _paste.apply(this, arguments);
+}
+
+function _paste() {
+  _paste = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(options) {
+    var topo, clipboardText, copyData;
+    return _regenerator["default"].wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
+        case 0:
+          topo = options.topo;
+          _context.next = 3;
+          return readClipboard();
+
+        case 3:
+          clipboardText = _context.sent;
+          copyData = parseCopyData(clipboardText, topo);
+
+          if (copyData) {
+            topo.historyManager.beginTransaction();
+            doPaste(topo, copyData.data);
+            topo.historyManager.endTransaction();
+          }
+
+        case 6:
+        case "end":
+          return _context.stop();
+      }
+    }, _callee);
+  }));
+  return _paste.apply(this, arguments);
+}
+
+function parseCopyData(clipboardText, topo) {
+  var copyData = null;
+
+  try {
+    copyData = JSON.parse(clipboardText); // 网络拓扑和业务拓扑之间不支持复制粘贴
+
+    if (!copyData.copyTopoElements || copyData.topoType !== topo.topoType) {
+      copyData = null;
+    }
+  } catch (error) {}
+
+  return copyData;
+}
+
+function validateTopoCopyText(clipboardText) {
+  // TODO
+  return true;
+}
+
+function doPaste(topo, clipboardText) {
+  // 解析剪切板内容
+  var parseDm = new ht.DataModel();
+  var parseSerializer = new ht.JSONSerializer(parseDm);
+  parseSerializer.deserialize(clipboardText);
+  var elements = parseDm.getDatas().toArray();
+  parseDm.clear(); // 添加到拓扑图
+
+  var gv = topo.getHtTopo().getGraphView();
+  var dm = gv.dm();
+  elements.forEach(function (d) {
+    dm.add(d);
+  }); // 粘贴之后进行处理
+
+  var sm = dm.sm();
+  sm.cs();
+  sm.as(elements); // 粘贴位置处理
+
+  if (isPasetToOriginTopo()) {
+    gv.moveSelection(60, 60);
+  } else {// 从拓扑图A复制到拓扑图B时，粘贴到拓扑图可视区域中心位置居中粘贴
+    // TODO
+  } // 若用户粘贴后的位置超出现有位置后，将视野拉到可视范围内
+  // TODO
+  // gv.translate(-60, -60)
+
+
+  copy(topo);
+}
+
+function isPasetToOriginTopo() {
+  // TODO
+  return true;
+}
+
+function writeClipboard(_x2) {
+  return _writeClipboard.apply(this, arguments);
+}
+
+function _writeClipboard() {
+  _writeClipboard = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(text) {
+    return _regenerator["default"].wrap(function _callee2$(_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
+        case 0:
+          localStorage.setItem('topo.copy.text', text);
+
+          _clipboardUtil.clipboard.writeText(text);
+
+        case 2:
+        case "end":
+          return _context2.stop();
+      }
+    }, _callee2);
+  }));
+  return _writeClipboard.apply(this, arguments);
+}
+
+function readClipboard() {
+  return _readClipboard.apply(this, arguments);
+}
+
+function _readClipboard() {
+  _readClipboard = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3() {
+    return _regenerator["default"].wrap(function _callee3$(_context3) {
+      while (1) switch (_context3.prev = _context3.next) {
+        case 0:
+          return _context3.abrupt("return", localStorage.getItem('topo.copy.text'));
+
+        case 1:
+        case "end":
+          return _context3.stop();
+      }
+    }, _callee3);
+  }));
+  return _readClipboard.apply(this, arguments);
+}

package/lib/core/hooks/useCiAttributeChange.js

@@ -14,15 +14,18 @@ var _CiCache = _interopRequireDefault(require("../models/cache/CiCache"));
 var _useTopoEventListener = _interopRequireDefault(require("./useTopoEventListener"));
 
 function mergeData(cis, ciChangeData) {
-  if (!cis.find(function (item) {
+  var matchData = function matchData(item) {
     return item.id === ciChangeData.id || item.ciId === ciChangeData.id;
-  })) {
+  };
+
+  if (!cis.find(matchData)) {
     return cis;
   }
 
   return cis.map(function (ci) {
-    if (ci.id === ciChangeData.id) {
+    if (matchData(ci)) {
       return (0, _extends2["default"])({}, ci, {
+        id: ci.id,
         attributes: (0, _extends2["default"])({}, ci.attributes, ciChangeData.attributes)
       });
     }

package/lib/core/hooks/usePolling.js

@@ -32,8 +32,6 @@ var _useHtDataPropertyChangeListener = _interopRequireDefault(require("./ht/useH
  * @param {*} props
  */
 var usePolling = function usePolling(props) {
-  var _fetchData, _refresh;
-
   var topo = props.topo;
   var store = topo.store;
   (0, _useCiAttributeChange["default"])({
@@ -52,7 +50,16 @@ var usePolling = function usePolling(props) {
    */
 
   function fetchData() {
-    return (_fetchData = _fetchData || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
+    return _fetchData.apply(this, arguments);
+  }
+  /**
+   * 
+   * @returns {{id, attributes: object[], metrics: object[]}[]} 属性和指标
+   */
+
+
+  function _fetchData() {
+    _fetchData = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
       var _topo$store$getModelS, resIdsList, nodeIdsList, codes, param, _yield$Promise$all, ciMetricsResult, mergeData, transformLinkData, adapterIpv6;
 
       return _regenerator["default"].wrap(function _callee$(_context) {
@@ -161,16 +168,17 @@ var usePolling = function usePolling(props) {
             return _context.stop();
         }
       }, _callee);
-    }))).apply(this, arguments);
+    }));
+    return _fetchData.apply(this, arguments);
   }
-  /**
-   * 
-   * @returns {{id, attributes: object[], metrics: object[]}[]} 属性和指标
-   */
-
 
   function refresh() {
-    return (_refresh = _refresh || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
+    return _refresh.apply(this, arguments);
+  } // 轮询hooks
+
+
+  function _refresh() {
+    _refresh = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
       var data;
       return _regenerator["default"].wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
@@ -195,9 +203,9 @@ var usePolling = function usePolling(props) {
             return _context2.stop();
         }
       }, _callee2);
-    }))).apply(this, arguments);
-  } // 轮询hooks
-
+    }));
+    return _refresh.apply(this, arguments);
+  }
 
   var _useRequest = (0, _ahooks.useRequest)(refresh, {
     pollingInterval: 60 * 1000,

package/lib/core/hooks/useResourceConfig.js

@@ -20,14 +20,12 @@ var _ResourceConfigUtil = _interopRequireDefault(require("../../utils/ResourceCo
 var _template = require("../../utils/template");
 
 function _default(props) {
-  var _ref, _ref2, _updateGroupResources, _addLayerStaticResources;
-
   var topo = props.topo;
   var store = topo.store;
   var editDispatchers = store.useModelDispatchers('topoConfig');
 
-  var loadConfig = function loadConfig() {
-    return (_ref = _ref || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
+  var loadConfig = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
       return _regenerator["default"].wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
@@ -39,8 +37,12 @@ function _default(props) {
             return _context.stop();
         }
       }, _callee);
-    }))).apply(this, arguments);
-  };
+    }));
+
+    return function loadConfig() {
+      return _ref.apply(this, arguments);
+    };
+  }();
   /**
    * 获取拓扑资源配置
    * 
@@ -68,8 +70,8 @@ function _default(props) {
     return getConfig().groups;
   }
 
-  var updateConfig = function updateConfig(_x) {
-    return (_ref2 = _ref2 || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(config) {
+  var updateConfig = /*#__PURE__*/function () {
+    var _ref2 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(config) {
       return _regenerator["default"].wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
@@ -81,8 +83,12 @@ function _default(props) {
             return _context2.stop();
         }
       }, _callee2);
-    }))).apply(this, arguments);
-  }; // 查找分组
+    }));
+
+    return function updateConfig(_x) {
+      return _ref2.apply(this, arguments);
+    };
+  }(); // 查找分组
 
 
   var getGroupById = function getGroupById(groupId) {
@@ -179,7 +185,11 @@ function _default(props) {
   function addGroupAt(group, index) {}
 
   function updateGroupResources(_x2, _x3) {
-    return (_updateGroupResources = _updateGroupResources || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3(groupData, resources) {
+    return _updateGroupResources.apply(this, arguments);
+  }
+
+  function _updateGroupResources() {
+    _updateGroupResources = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3(groupData, resources) {
       var config;
       return _regenerator["default"].wrap(function _callee3$(_context3) {
         while (1) switch (_context3.prev = _context3.next) {
@@ -204,7 +214,8 @@ function _default(props) {
             return _context3.stop();
         }
       }, _callee3);
-    }))).apply(this, arguments);
+    }));
+    return _updateGroupResources.apply(this, arguments);
   }
 
   function matchGroup(group, data) {
@@ -212,7 +223,18 @@ function _default(props) {
   }
 
   function addLayerStaticResources(_x4, _x5) {
-    return (_addLayerStaticResources = _addLayerStaticResources || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4(data, newResourceIds) {
+    return _addLayerStaticResources.apply(this, arguments);
+  }
+  /**
+   * 从拓扑图解析出拓扑资源配置
+   * 
+   * @param {ht.DataModel} dataModel 
+   * @returns {{layers, groups, resources}}
+   */
+
+
+  function _addLayerStaticResources() {
+    _addLayerStaticResources = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4(data, newResourceIds) {
       var config;
       return _regenerator["default"].wrap(function _callee4$(_context4) {
         while (1) switch (_context4.prev = _context4.next) {
@@ -239,15 +261,9 @@ function _default(props) {
             return _context4.stop();
         }
       }, _callee4);
-    }))).apply(this, arguments);
+    }));
+    return _addLayerStaticResources.apply(this, arguments);
   }
-  /**
-   * 从拓扑图解析出拓扑资源配置
-   * 
-   * @param {ht.DataModel} dataModel 
-   * @returns {{layers, groups, resources}}
-   */
-
 
   function getConfigFromHt() {
     return _ResourceConfigUtil["default"].getResourceConfigFromHt(topo);