@riil-frontend/component-topology 0.3.1 → 0.3.2

package/lib/core/models/TopoApp.js

@@ -29,6 +29,8 @@ var _buildProvider = _interopRequireDefault(require("../components/buildProvider
 
 var _format = require("../../utils/format");
 
+var _htElementUtils = require("../../utils/htElementUtils");
+
 var _Test = _interopRequireDefault(require("../test/Test"));
 
 var topoDebug = {};
@@ -119,7 +121,8 @@ var TopoApp = /*#__PURE__*/function () {
 
   _proto.load = /*#__PURE__*/function () {
     var _load = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(data, options) {
-      var topoDispatchers;
+      var _data$groups, groups, _data$nodes, nodes, links, lines, topoDispatchers;
+
       return _regenerator["default"].wrap(function _callee2$(_context2) {
         while (1) {
           switch (_context2.prev = _context2.next) {
@@ -128,13 +131,18 @@ var TopoApp = /*#__PURE__*/function () {
                 options = {};
               }
 
+              _data$groups = data.groups, groups = _data$groups === void 0 ? [] : _data$groups, _data$nodes = data.nodes, nodes = _data$nodes === void 0 ? [] : _data$nodes, links = data.links, lines = data.lines;
               topoDispatchers = this.store.getModelDispatchers('topoMod');
-              _context2.next = 4;
+              _context2.next = 5;
               return topoDispatchers.openTopoPage((0, _extends2["default"])({
-                data: data
+                data: (0, _extends2["default"])({}, data, {
+                  groups: groups,
+                  nodes: nodes,
+                  links: links || lines || []
+                })
               }, options));
 
-            case 4:
+            case 5:
             case "end":
               return _context2.stop();
           }
@@ -167,14 +175,78 @@ var TopoApp = /*#__PURE__*/function () {
     }
 
     return clear;
-  }();
+  }()
+  /**
+   * 全量更新数据
+   *
+   * @param data {{groups: [], nodes: [], lines: []}}
+   */
+  ;
+
+  _proto.updateData =
+  /*#__PURE__*/
+  function () {
+    var _updateData = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4(data) {
+      var _data$groups2, groups, _data$nodes2, nodes, links, lines;
 
-  _proto.open = /*#__PURE__*/function () {
-    var _open = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4(id, mode) {
-      var lastId;
       return _regenerator["default"].wrap(function _callee4$(_context4) {
         while (1) {
           switch (_context4.prev = _context4.next) {
+            case 0:
+              _data$groups2 = data.groups, groups = _data$groups2 === void 0 ? [] : _data$groups2, _data$nodes2 = data.nodes, nodes = _data$nodes2 === void 0 ? [] : _data$nodes2, links = data.links, lines = data.lines;
+              this.view.topoClient.updateElements({
+                groups: groups,
+                nodes: nodes,
+                links: links || lines || []
+              });
+
+            case 2:
+            case "end":
+              return _context4.stop();
+          }
+        }
+      }, _callee4, this);
+    }));
+
+    function updateData(_x3) {
+      return _updateData.apply(this, arguments);
+    }
+
+    return updateData;
+  }()
+  /**
+   * 获取数据
+   * @return {{nodes: [], lines: [], customNodes: [], customLines: []}}
+   */
+  ;
+
+  _proto.getData = function getData() {
+    return {
+      nodes: this.getNodes(),
+      lines: this.getLines(),
+      customNodes: [],
+      customLines: []
+    };
+  };
+
+  _proto.getNodes = function getNodes() {
+    return (0, _htElementUtils.getNodes)(this.getDataModel());
+  };
+
+  _proto.getLines = function getLines() {
+    return this.getEdges();
+  };
+
+  _proto.getEdges = function getEdges() {
+    return (0, _htElementUtils.getEdges)(this.getDataModel());
+  };
+
+  _proto.open = /*#__PURE__*/function () {
+    var _open = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee5(id, mode) {
+      var lastId;
+      return _regenerator["default"].wrap(function _callee5$(_context5) {
+        while (1) {
+          switch (_context5.prev = _context5.next) {
             case 0:
               _rlog["default"].info('TopoApp.open 打开拓扑图', id); // 如果是切换拓扑图，注销原拓扑图
 
@@ -189,13 +261,13 @@ var TopoApp = /*#__PURE__*/function () {
 
             case 4:
             case "end":
-              return _context4.stop();
+              return _context5.stop();
           }
         }
-      }, _callee4, this);
+      }, _callee5, this);
     }));
 
-    function open(_x3, _x4) {
+    function open(_x4, _x5) {
       return _open.apply(this, arguments);
     }
 
@@ -203,19 +275,19 @@ var TopoApp = /*#__PURE__*/function () {
   }();
 
   _proto.close = /*#__PURE__*/function () {
-    var _close = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee5() {
-      return _regenerator["default"].wrap(function _callee5$(_context5) {
+    var _close = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee6() {
+      return _regenerator["default"].wrap(function _callee6$(_context6) {
         while (1) {
-          switch (_context5.prev = _context5.next) {
+          switch (_context6.prev = _context6.next) {
             case 0:
               _rlog["default"].info('关闭拓扑图', this.id);
 
               if (this.id) {
-                _context5.next = 3;
+                _context6.next = 3;
                 break;
               }
 
-              return _context5.abrupt("return");
+              return _context6.abrupt("return");
 
             case 3:
               this.alarm.close();
@@ -223,10 +295,10 @@ var TopoApp = /*#__PURE__*/function () {
 
             case 5:
             case "end":
-              return _context5.stop();
+              return _context6.stop();
           }
         }
-      }, _callee5, this);
+      }, _callee6, this);
     }));
 
     function close() {
@@ -237,16 +309,16 @@ var TopoApp = /*#__PURE__*/function () {
   }();
 
   _proto.refresh = /*#__PURE__*/function () {
-    var _refresh = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee6() {
-      return _regenerator["default"].wrap(function _callee6$(_context6) {
+    var _refresh = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee7() {
+      return _regenerator["default"].wrap(function _callee7$(_context7) {
         while (1) {
-          switch (_context6.prev = _context6.next) {
+          switch (_context7.prev = _context7.next) {
             case 0:
             case "end":
-              return _context6.stop();
+              return _context7.stop();
           }
         }
-      }, _callee6);
+      }, _callee7);
     }));
 
     function refresh() {
@@ -257,10 +329,7 @@ var TopoApp = /*#__PURE__*/function () {
   }();
 
   _proto.getDataModel = function getDataModel() {
-    return this.view.topoClient.htTopoClient._mainView._graphView.getDataModel();
-  };
-
-  _proto.updateData = function updateData() {// TODO
+    return this.view.topoClient.getDataModel();
   };
 
   _proto.getSelectionModel = function getSelectionModel() {
@@ -281,19 +350,19 @@ var TopoApp = /*#__PURE__*/function () {
   };
 
   _proto.openViewMode = /*#__PURE__*/function () {
-    var _openViewMode = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee7(id) {
-      return _regenerator["default"].wrap(function _callee7$(_context7) {
+    var _openViewMode = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee8(id) {
+      return _regenerator["default"].wrap(function _callee8$(_context8) {
         while (1) {
-          switch (_context7.prev = _context7.next) {
+          switch (_context8.prev = _context8.next) {
             case 0:
             case "end":
-              return _context7.stop();
+              return _context8.stop();
           }
         }
-      }, _callee7);
+      }, _callee8);
     }));
 
-    function openViewMode(_x5) {
+    function openViewMode(_x6) {
       return _openViewMode.apply(this, arguments);
     }
 
@@ -307,11 +376,11 @@ var TopoApp = /*#__PURE__*/function () {
   _proto.enterEditMode =
   /*#__PURE__*/
   function () {
-    var _enterEditMode = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee8() {
+    var _enterEditMode = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee9() {
       var topoDispatchers, editDispatchers, ciSetDoc, linkDynamicStyleDispatcher, iconManageDispatchers, topoTreeData;
-      return _regenerator["default"].wrap(function _callee8$(_context8) {
+      return _regenerator["default"].wrap(function _callee9$(_context9) {
         while (1) {
-          switch (_context8.prev = _context8.next) {
+          switch (_context9.prev = _context9.next) {
             case 0:
               this.view.topoClient.enterEditMode();
               topoDispatchers = this.store.getModelDispatchers('topoMod');
@@ -342,10 +411,10 @@ var TopoApp = /*#__PURE__*/function () {
 
             case 14:
             case "end":
-              return _context8.stop();
+              return _context9.stop();
           }
         }
-      }, _callee8, this);
+      }, _callee9, this);
     }));
 
     function enterEditMode() {
@@ -356,11 +425,11 @@ var TopoApp = /*#__PURE__*/function () {
   }();
 
   _proto.exitEditMode = /*#__PURE__*/function () {
-    var _exitEditMode = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee9() {
+    var _exitEditMode = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee10() {
       var editDispatchers;
-      return _regenerator["default"].wrap(function _callee9$(_context9) {
+      return _regenerator["default"].wrap(function _callee10$(_context10) {
         while (1) {
-          switch (_context9.prev = _context9.next) {
+          switch (_context10.prev = _context10.next) {
             case 0:
               this.view.topoClient.exitEditMode();
               editDispatchers = this.store.getModelDispatchers('topoCreateMod');
@@ -372,10 +441,10 @@ var TopoApp = /*#__PURE__*/function () {
 
             case 4:
             case "end":
-              return _context9.stop();
+              return _context10.stop();
           }
         }
-      }, _callee9, this);
+      }, _callee10, this);
     }));
 
     function exitEditMode() {
@@ -386,19 +455,19 @@ var TopoApp = /*#__PURE__*/function () {
   }();
 
   _proto.triggerSaveEvent = /*#__PURE__*/function () {
-    var _triggerSaveEvent = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee10() {
-      return _regenerator["default"].wrap(function _callee10$(_context10) {
+    var _triggerSaveEvent = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee11() {
+      return _regenerator["default"].wrap(function _callee11$(_context11) {
         while (1) {
-          switch (_context10.prev = _context10.next) {
+          switch (_context11.prev = _context11.next) {
             case 0:
               this.view.topoClient.saveExternal();
 
             case 1:
             case "end":
-              return _context10.stop();
+              return _context11.stop();
           }
         }
-      }, _callee10, this);
+      }, _callee11, this);
     }));
 
     function triggerSaveEvent() {
@@ -409,19 +478,19 @@ var TopoApp = /*#__PURE__*/function () {
   }();
 
   _proto.save = /*#__PURE__*/function () {
-    var _save = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee11() {
-      return _regenerator["default"].wrap(function _callee11$(_context11) {
+    var _save = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee12() {
+      return _regenerator["default"].wrap(function _callee12$(_context12) {
         while (1) {
-          switch (_context11.prev = _context11.next) {
+          switch (_context12.prev = _context12.next) {
             case 0:
               this.triggerSaveEvent();
 
             case 1:
             case "end":
-              return _context11.stop();
+              return _context12.stop();
           }
         }
-      }, _callee11, this);
+      }, _callee12, this);
     }));
 
     function save() {
@@ -432,19 +501,19 @@ var TopoApp = /*#__PURE__*/function () {
   }();
 
   _proto.exportImage = /*#__PURE__*/function () {
-    var _exportImage = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee12() {
-      return _regenerator["default"].wrap(function _callee12$(_context12) {
+    var _exportImage = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee13() {
+      return _regenerator["default"].wrap(function _callee13$(_context13) {
         while (1) {
-          switch (_context12.prev = _context12.next) {
+          switch (_context13.prev = _context13.next) {
             case 0:
               this.view.topoClient.exportImage();
 
             case 1:
             case "end":
-              return _context12.stop();
+              return _context13.stop();
           }
         }
-      }, _callee12, this);
+      }, _callee13, this);
     }));
 
     function exportImage() {
@@ -455,16 +524,16 @@ var TopoApp = /*#__PURE__*/function () {
   }();
 
   _proto.switchToViewMode = /*#__PURE__*/function () {
-    var _switchToViewMode = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee13() {
-      return _regenerator["default"].wrap(function _callee13$(_context13) {
+    var _switchToViewMode = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee14() {
+      return _regenerator["default"].wrap(function _callee14$(_context14) {
         while (1) {
-          switch (_context13.prev = _context13.next) {
+          switch (_context14.prev = _context14.next) {
             case 0:
             case "end":
-              return _context13.stop();
+              return _context14.stop();
           }
         }
-      }, _callee13);
+      }, _callee14);
     }));
 
     function switchToViewMode() {
@@ -475,16 +544,16 @@ var TopoApp = /*#__PURE__*/function () {
   }();
 
   _proto.switchToEditMode = /*#__PURE__*/function () {
-    var _switchToEditMode = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee14() {
-      return _regenerator["default"].wrap(function _callee14$(_context14) {
+    var _switchToEditMode = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee15() {
+      return _regenerator["default"].wrap(function _callee15$(_context15) {
         while (1) {
-          switch (_context14.prev = _context14.next) {
+          switch (_context15.prev = _context15.next) {
             case 0:
             case "end":
-              return _context14.stop();
+              return _context15.stop();
           }
         }
-      }, _callee14);
+      }, _callee15);
     }));
 
     function switchToEditMode() {

package/lib/core/models/common/TopoClient.js

@@ -53,7 +53,15 @@ var TopoClient = /*#__PURE__*/function () {
     this.emitEvent('', null);
   };
 
-  _proto.clear = function clear() {}
+  _proto.clear = function clear() {};
+
+  _proto.getDataModel = function getDataModel() {
+    return this.htTopoClient._mainView._graphView.getDataModel();
+  };
+
+  _proto.updateElements = function updateElements(elements) {
+    this.emitEvent('topo_update_elements', elements);
+  }
   /**
    * 搜索元素
    *

package/lib/icons/icons.js

@@ -0,0 +1,3 @@
+"use strict";
+
+var map = {};

package/lib/utils/htElementUtils.js

@@ -0,0 +1,66 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports.getElements = getElements;
+exports.getNodes = getNodes;
+exports.getEdges = getEdges;
+exports.getGroupNodes = getGroupNodes;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+function getElementData(element) {
+  var className = element.getClassName();
+  var commonData = {
+    className: className,
+    id: element.getId(),
+    tag: element.getTag(),
+    // 业务id
+    name: element.getName(),
+    attrObject: element.getAttrObject(),
+    styleMap: element.getStyleMap()
+  };
+
+  if (className === 'ht.Edge') {
+    return (0, _extends2["default"])({}, commonData);
+  }
+
+  return (0, _extends2["default"])({}, commonData, {
+    position: element.getPosition()
+  });
+}
+
+function getElements(dataModel) {
+  console.error(111, dataModel.getDatas().getArray());
+  return dataModel.getDatas().getArray();
+}
+
+function getNodes(dataModel) {
+  return getElements(dataModel).filter(function (element) {
+    return element.getClassName() === 'ht.Node';
+  }).map(function (element) {
+    var host = element.getHost();
+    return (0, _extends2["default"])({}, element.getAttrObject(), {
+      tag: element.getId(),
+      image: element.getImage(),
+      groupTag: host ? host.getId() : undefined
+    });
+  });
+}
+
+function getEdges(dataModel) {
+  return getElements(dataModel).filter(function (element) {
+    return element.getClassName() === 'ht.Edge';
+  }).map(function (element) {
+    return (0, _extends2["default"])({}, element.getAttrObject(), {
+      tag: element.getId()
+    });
+  });
+}
+
+function getGroupNodes(dataModel, groupIdOrTag) {
+  return getNodes(dataModel).filter(function (element) {
+    return element.groupId === groupIdOrTag || element.groupTag === groupIdOrTag;
+  });
+}

package/lib/utils/topoData.js

@@ -107,7 +107,7 @@ var tfGroup = function tfGroup(group) {
 
 function nodeAttributesAdapter(attributes) {
   if (Array.isArray(attributes)) {
-    var map = {};
+    var map = {}; // TODO
   }
 
   return attributes;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@riil-frontend/component-topology",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "description": "拓扑",
   "files": [
     "demo/",
@@ -13,6 +13,7 @@
   "stylePath": "style.js",
   "scripts": {
     "start": "build-scripts start",
+    "start:warch": "build-scripts start --watch",
     "build": "build-scripts build --config build.config.js",
     "test": "build-scripts test",
     "prepublishOnly": "npm run build",
@@ -48,7 +49,7 @@
     "@riil-frontend/component-riil-rule-tree": "^1.0.4",
     "@riil-frontend/component-table-filter-tags": "latest",
     "@riil-frontend/component-table-layout": "^1.0.0-a.16",
-    "@riil-frontend/component-topology-graph": "^0.5.4",
+    "@riil-frontend/component-topology-graph": "^0.5.5",
     "@riil-frontend/component-topology-utils": "^1.0.1",
     "@riil-frontend/css": "^1.0.10",
     "@riil-frontend/hooks": "latest",
@@ -87,5 +88,5 @@
     "access": "public"
   },
   "license": "MIT",
-  "homepage": "https://unpkg.com/@riil-frontend/component-topology@0.3.1/build/index.html"
+  "homepage": "https://unpkg.com/@riil-frontend/component-topology@0.3.2/build/index.html"
 }