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

package/lib/core/editor/components/Sidebar/views/CanvasPanel/hooks/useCanvasThemeConfig.js

@@ -20,8 +20,6 @@ var _themes = _interopRequireDefault(require("../../../../../config/themes"));
 var _themeUtil = _interopRequireDefault(require("../../../../../utils/themeUtil"));
 
 function useCanvasThemeConfig(props) {
-  var _ref, _setGlobalTagTheme;
-
   var topo = props.topo;
 
   var _topo$store$useModel = topo.store.useModel('displayConfig'),
@@ -30,8 +28,8 @@ function useCanvasThemeConfig(props) {
 
   var canvasThemeName = displayConfig.canvasTheme || 'white';
 
-  var setCanvasTheme = function setCanvasTheme(_x) {
-    return (_ref = _ref || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(themeName) {
+  var setCanvasTheme = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(themeName) {
       var themeConfig;
       return _regenerator["default"].wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
@@ -58,12 +56,20 @@ function useCanvasThemeConfig(props) {
             return _context.stop();
         }
       }, _callee);
-    }))).apply(this, arguments);
-  }; // 设置资源/链路标注样式
+    }));
+
+    return function setCanvasTheme(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }(); // 设置资源/链路标注样式
 
 
   function setGlobalTagTheme(_x2) {
-    return (_setGlobalTagTheme = _setGlobalTagTheme || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(themeConfig) {
+    return _setGlobalTagTheme.apply(this, arguments);
+  }
+
+  function _setGlobalTagTheme() {
+    _setGlobalTagTheme = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(themeConfig) {
       var _topo$store$getModelS, nodeLabelStyle, defaultEdgeLabelStyle;
 
       return _regenerator["default"].wrap(function _callee2$(_context2) {
@@ -84,7 +90,8 @@ function useCanvasThemeConfig(props) {
             return _context2.stop();
         }
       }, _callee2);
-    }))).apply(this, arguments);
+    }));
+    return _setGlobalTagTheme.apply(this, arguments);
   }
 
   function setElementsTheme(themeConfig) {

package/lib/core/editor/components/Toolbar/widgets/BoxBackgroundButton/BoxBackgroundSetting.js

@@ -24,8 +24,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 function BoxBackgroundSetting(props) {
-  var _ref, _ref2;
-
   var topo = props.topo,
       fieldProps = props.fieldProps,
       setStyle = props.setStyle,
@@ -53,8 +51,8 @@ function BoxBackgroundSetting(props) {
     topo.historyManager.endTransaction();
   };
 
-  var backgroundChang = function backgroundChang(_x, _x2) {
-    return (_ref = _ref || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(value, type) {
+  var backgroundChang = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(value, type) {
       return _regenerator["default"].wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
@@ -84,8 +82,12 @@ function BoxBackgroundSetting(props) {
             return _context.stop();
         }
       }, _callee);
-    }))).apply(this, arguments);
-  };
+    }));
+
+    return function backgroundChang(_x, _x2) {
+      return _ref.apply(this, arguments);
+    };
+  }();
 
   var borderOpacityChange = function borderOpacityChange(value) {
     topo.historyManager.beginTransaction();
@@ -103,8 +105,8 @@ function BoxBackgroundSetting(props) {
     topo.historyManager.endTransaction();
   };
 
-  var borderColorChang = function borderColorChang(_x3, _x4) {
-    return (_ref2 = _ref2 || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(value, type) {
+  var borderColorChang = /*#__PURE__*/function () {
+    var _ref2 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(value, type) {
       return _regenerator["default"].wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
@@ -134,8 +136,12 @@ function BoxBackgroundSetting(props) {
             return _context2.stop();
         }
       }, _callee2);
-    }))).apply(this, arguments);
-  };
+    }));
+
+    return function borderColorChang(_x3, _x4) {
+      return _ref2.apply(this, arguments);
+    };
+  }();
 
   var leftInputChange = function leftInputChange(val) {
     setLeftInputVal(val);

package/lib/core/editor/components/Toolbar/widgets/FontColorButton.js

@@ -29,8 +29,6 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 /* eslint-disable jsx-a11y/alt-text */
 function FontColorDropdown(props) {
-  var _ref, _ref2;
-
   var color = props.color,
       onChange = props.onChange,
       topo = props.topo,
@@ -55,8 +53,8 @@ function FontColorDropdown(props) {
     topo.historyManager.endTransaction();
   };
 
-  var colorChang = function colorChang(_x, _x2) {
-    return (_ref = _ref || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(value, type) {
+  var colorChang = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(value, type) {
       return _regenerator["default"].wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
@@ -86,11 +84,15 @@ function FontColorDropdown(props) {
             return _context.stop();
         }
       }, _callee);
-    }))).apply(this, arguments);
-  };
+    }));
+
+    return function colorChang(_x, _x2) {
+      return _ref.apply(this, arguments);
+    };
+  }();
 
-  var backgroundChang = function backgroundChang(_x3, _x4) {
-    return (_ref2 = _ref2 || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(value, type) {
+  var backgroundChang = /*#__PURE__*/function () {
+    var _ref2 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(value, type) {
       return _regenerator["default"].wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
@@ -120,8 +122,12 @@ function FontColorDropdown(props) {
             return _context2.stop();
         }
       }, _callee2);
-    }))).apply(this, arguments);
-  };
+    }));
+
+    return function backgroundChang(_x3, _x4) {
+      return _ref2.apply(this, arguments);
+    };
+  }();
 
   var onFocus = function onFocus() {// topo.historyManager.beginTransaction();
   };

package/lib/core/editor/components/settings/propertyViews/layer/DataTab/DefaultLayerAddResourceDrawer.js

@@ -18,16 +18,14 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 var LayerAddResourceDrawer = function LayerAddResourceDrawer(props) {
-  var _ref;
-
   var visible = props.visible,
       layer = props.layer,
       topo = props.topo,
       topoEdit = props.topoEdit,
       onClose = props.onClose;
 
-  var onOk = function onOk(_x) {
-    return (_ref = _ref || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(selected) {
+  var onOk = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(selected) {
       var layerData;
       return _regenerator["default"].wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
@@ -44,8 +42,12 @@ var LayerAddResourceDrawer = function LayerAddResourceDrawer(props) {
             return _context.stop();
         }
       }, _callee);
-    }))).apply(this, arguments);
-  };
+    }));
+
+    return function onOk(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }();
 
   return /*#__PURE__*/_react["default"].createElement(_NetworkTopoResourceSelectDrawer["default"], {
     visible: visible,

package/lib/core/editor/components/settings/propertyViews/node/data/BindResourceDrawer.js

@@ -26,16 +26,14 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
  * @constructor
  */
 var BindResourceDrawer = function BindResourceDrawer(props) {
-  var _ref;
-
   var visible = props.visible,
       topoEditApi = props.topoEditApi,
       node = props.node,
       currentResId = props.currentResId,
       onClose = props.onClose;
 
-  var handleSave = function handleSave(_x) {
-    return (_ref = _ref || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(selected) {
+  var handleSave = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(selected) {
       var result;
       return _regenerator["default"].wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
@@ -66,8 +64,12 @@ var BindResourceDrawer = function BindResourceDrawer(props) {
             return _context.stop();
         }
       }, _callee);
-    }))).apply(this, arguments);
-  };
+    }));
+
+    return function handleSave(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }();
 
   return /*#__PURE__*/_react["default"].createElement(_NetworkTopoResourceSelectDrawer["default"], {
     visible: visible,

package/lib/core/editor/components/settings/propertyViews/node/data/Data.js

@@ -56,8 +56,6 @@ function getBindType(values) {
 }
 
 function Data(props) {
-  var _ref;
-
   var node = props.node,
       topo = props.topo,
       topoEditApi = props.topoEditApi,
@@ -96,8 +94,8 @@ function Data(props) {
     }
   };
 
-  var handleBindTopoChange = function handleBindTopoChange(_x, _x2) {
-    return (_ref = _ref || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(value, data) {
+  var handleBindTopoChange = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(value, data) {
       return _regenerator["default"].wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
@@ -116,8 +114,12 @@ function Data(props) {
             return _context.stop();
         }
       }, _callee);
-    }))).apply(this, arguments);
-  };
+    }));
+
+    return function handleBindTopoChange(_x, _x2) {
+      return _ref.apply(this, arguments);
+    };
+  }();
 
   var RelateTopoTree = editorProps === null || editorProps === void 0 ? void 0 : editorProps.relateTopoTree;
   return /*#__PURE__*/_react["default"].createElement(_collapse["default"], {

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

@@ -16,8 +16,6 @@ var _NodeSizeInput = _interopRequireDefault(require("../../common/NodeSizeInput/
 var _useBackgroundSizeConfig = _interopRequireDefault(require("./hooks/useBackgroundSizeConfig"));
 
 function BackgroundSize(props) {
-  var _ref;
-
   var topo = props.topo,
       backgroundConfig = props.backgroundConfig,
       settingRuntimeState = props.settingRuntimeState;
@@ -26,8 +24,8 @@ function BackgroundSize(props) {
     current: backgroundConfig.current
   });
 
-  var setSize = function setSize(_x) {
-    return (_ref = _ref || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(size) {
+  var setSize = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(size) {
       return _regenerator["default"].wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
@@ -43,8 +41,12 @@ function BackgroundSize(props) {
             return _context.stop();
         }
       }, _callee);
-    }))).apply(this, arguments);
-  };
+    }));
+
+    return function setSize(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }();
 
   return /*#__PURE__*/_react["default"].createElement(_NodeSizeInput["default"], {
     nodeId: backgroundSizeConfig.nodeId,

package/lib/core/editor/components/titlebar/TopoEditorTitleBar.js

@@ -34,8 +34,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 function TopoEditorTitleBar(props) {
-  var _ref;
-
   var topo = props.topo,
       topoEditApi = props.topoEditApi;
   var store = topo.store;
@@ -50,8 +48,8 @@ function TopoEditorTitleBar(props) {
       exitFlag = _useState[0],
       setExitFlag = _useState[1];
 
-  var saveAndExit = function saveAndExit() {
-    return (_ref = _ref || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
+  var saveAndExit = /*#__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:
@@ -66,8 +64,12 @@ function TopoEditorTitleBar(props) {
             return _context.stop();
         }
       }, _callee);
-    }))).apply(this, arguments);
-  };
+    }));
+
+    return function saveAndExit() {
+      return _ref.apply(this, arguments);
+    };
+  }();
 
   (0, _react.useEffect)(function () {
     if (!saving && exitFlag) {
@@ -96,13 +98,11 @@ function TopoEditorTitleBar(props) {
   }, "\u4FDD\u5B58"), /*#__PURE__*/_react["default"].createElement(_button["default"], {
     className: _TitleBarModule["default"].button,
     onClick: function onClick() {
-      var _onOk, _onCancel;
-
       _dialog["default"].confirm({
         title: '提示',
         content: '若直接退出，图上修改的内容将不会保存！',
-        onOk: function onOk() {
-          return (_onOk = _onOk || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
+        onOk: function () {
+          var _onOk = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
             return _regenerator["default"].wrap(function _callee2$(_context2) {
               while (1) switch (_context2.prev = _context2.next) {
                 case 0:
@@ -113,10 +113,16 @@ function TopoEditorTitleBar(props) {
                   return _context2.stop();
               }
             }, _callee2);
-          }))).apply(this, arguments);
-        },
-        onCancel: function onCancel() {
-          return (_onCancel = _onCancel || (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3() {
+          }));
+
+          function onOk() {
+            return _onOk.apply(this, arguments);
+          }
+
+          return onOk;
+        }(),
+        onCancel: function () {
+          var _onCancel = (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:
@@ -127,8 +133,14 @@ function TopoEditorTitleBar(props) {
                   return _context3.stop();
               }
             }, _callee3);
-          }))).apply(this, arguments);
-        },
+          }));
+
+          function onCancel() {
+            return _onCancel.apply(this, arguments);
+          }
+
+          return onCancel;
+        }(),
         cancelProps: {
           children: '退出'
         },

package/lib/core/editor/hooks/useKeyboardShortcut.js

@@ -1,49 +1,52 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 exports.__esModule = true;
 exports["default"] = useKeyboardShortcut;
 
-var _react = _interopRequireWildcard(require("react"));
+var _hotkeysJs = _interopRequireDefault(require("hotkeys-js"));
+
+var _react = require("react");
+
+var _copyElementUtil = require("../utils/copyElementUtil");
+
+function initKeyboardShortcuts(props) {
+  var topo = props.topo,
+      topoEdit = props.topoEdit; // 撤销
+
+  (0, _hotkeysJs["default"])('ctrl+z, command+z', function (event) {
+    topo.historyManager.undo();
+  }); // 重做
+
+  (0, _hotkeysJs["default"])('ctrl+y, command+y', function (event) {}); // 空格：切换选择/移动
 
-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); }
+  (0, _hotkeysJs["default"])('space', function (event) {
+    var _topo$store$getModelS = topo.store.getModelState('topoEdit'),
+        viewMouseMode = _topo$store$getModelS.viewMouseMode;
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+    topoEdit.setViewMouseMode(viewMouseMode === 'select' ? 'move' : 'select');
+  }); // 复制
+
+  (0, _hotkeysJs["default"])('ctrl+c, command+c', function (event) {
+    return (0, _copyElementUtil.handleCopyHotkey)(event, props);
+  }); // 粘贴
+
+  (0, _hotkeysJs["default"])('ctrl+v, command+v', function (event) {
+    return (0, _copyElementUtil.handlePasteHotkey)(event, props);
+  });
+}
+
+function unbindKeyboardShortcuts(props) {
+  _hotkeysJs["default"].unbind();
+} // 快捷键
 
-var ht = window.ht; // 快捷键
 
 function useKeyboardShortcut(props) {
-  var topo = props.topo,
-      topoEdit = props.topoEdit;
   (0, _react.useEffect)(function () {
-    var handleKeyDown = function handleKeyDown(e) {
-      if (e.target.tagName === 'INPUT') {
-        return;
-      }
-
-      var isCtrlDown = ht.Default.isCtrlDown;
-
-      if (isCtrlDown(e)) {
-        if (e.keyCode === 90) {
-          // ctrl+z 撤销
-          topo.historyManager.undo();
-        } //  else if (e.keyCode == 89) {//ctrl+y 重做
-        //   this.redo();
-        // }
-
-      }
-
-      if (e.keyCode === 32 && e.target.nodeName !== 'TEXTAREA') {
-        // 空格
-        var _topo$store$getModelS2 = topo.store.getModelState('topoEdit'),
-            viewMouseMode = _topo$store$getModelS2.viewMouseMode;
-
-        topoEdit.setViewMouseMode(viewMouseMode === 'select' ? 'move' : 'select');
-      }
-    };
-
-    window.addEventListener('keydown', handleKeyDown);
+    initKeyboardShortcuts(props);
     return function () {
-      window.removeEventListener('keydown', handleKeyDown);
+      unbindKeyboardShortcuts(props);
     };
   }, []);
 }

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

@@ -0,0 +1,182 @@
+"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"));
+
+function handleCopyHotkey(event, options) {
+  var target = event.target || event.srcElement;
+  var tagName = target.tagName;
+
+  if (tagName !== 'BODY') {
+    copy(options);
+  }
+}
+
+function handlePasteHotkey(event, options) {
+  var target = event.target || event.srcElement;
+  var tagName = target.tagName;
+
+  if (tagName !== 'BODY') {
+    paste(options);
+  }
+}
+
+function copy(options) {
+  var topo = options.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(); // 添加到拓扑图
+
+  var gv = topo.getHtTopo().getGraphView();
+  var dm = gv.dm();
+  elements.forEach(function (d) {
+    dm.add(d);
+  });
+  parseDm.clear(); // 粘贴之后进行处理
+
+  var sm = dm.sm();
+  sm.cs();
+  sm.as(elements); // 粘贴位置处理
+
+  if (isPasetToOriginTopo()) {
+    gv.moveSelection(60, 60);
+  } else {// 从拓扑图A复制到拓扑图B时，粘贴到拓扑图可视区域中心位置居中粘贴
+    // TODO
+  } // 若用户粘贴后的位置超出现有位置后，将视野拉到可视范围内
+  // TODO
+  // gv.translate(-60, -60)
+
+}
+
+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:
+          navigator.clipboard.writeText(text);
+
+        case 1:
+        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", navigator.clipboard.readText());
+
+        case 1:
+        case "end":
+          return _context3.stop();
+      }
+    }, _callee3);
+  }));
+  return _readClipboard.apply(this, arguments);
+}