@riil-frontend/component-topology 6.0.0-alpha.30 → 6.0.0-alpha.31

package/lib/core/editor/components/Toolbar/widgets/NodeAlignWidget.module.scss

@@ -1,12 +1,28 @@
 .leftInput{
-  background: url('/img/topo/editor/toolbar/对齐/Disable.svg')no-repeat 5px center;
-  background-position: right center;
-  width: 100px;
+  width: 100px !important;
   margin-right: 10px;
   margin-left: 5px;
+  :global{
+    input{
+      background: url('/img/topo/editor/toolbar/对齐/水平间距_normal.svg')no-repeat 5px center !important;
+      background-position: right center !important;
+    }
+    .next-disabled input{
+      background: url('/img/topo/editor/toolbar/对齐/水平间距_disable.svg')no-repeat 5px center !important;
+      background-position: right center !important;
+    }
+  }
 }
 .rightInput{
-  width: 100px;
-  background: url('/img/topo/editor/toolbar/对齐/Disable.svg')no-repeat 5px center;
-  background-position: right center;
+  width: 100px !important;
+  :global{
+    input{
+      background: url('/img/topo/editor/toolbar/对齐/垂直间距 _normal.svg')no-repeat 5px center !important;
+      background-position: right center !important;
+    }
+    .next-disabled input{
+      background: url('/img/topo/editor/toolbar/对齐/垂直间距_disable.svg')no-repeat 5px center !important;
+      background-position: right center !important;
+    }
+  }
 }

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

@@ -17,8 +17,6 @@ var _useSettingRuntimeState = _interopRequireDefault(require("../../../settings/
 
 var _WidgetBox = _interopRequireDefault(require("../WidgetBox"));
 
-var _BoxBackgroundSetting = _interopRequireDefault(require("./BoxBackgroundSetting"));
-
 var _NodeSizeButtonModule = _interopRequireDefault(require("./NodeSizeButton.module.scss"));
 
 var _htElementUtils = require("../../../../../../utils/htElementUtils");
@@ -48,10 +46,15 @@ function NodeSizeButton(props) {
       setSize = _useState2[1]; // 选中的元素
 
 
-  var selection = topo.selectionManager.useHtSelection();
+  var selection = topo.selectionManager.useSelection();
   var settingRuntimeState = (0, _useSettingRuntimeState["default"])();
   (0, _react.useEffect)(function () {
-    var nodes = selection.filter(function (ele) {
+    var elements = selection.map(function (item) {
+      return item.id;
+    }).map(function (id) {
+      return topo.getDataModel().getDataById(id);
+    });
+    var nodes = elements.filter(function (ele) {
       return (0, _htElementUtils.isGroup)(ele) || (0, _htElementUtils.isNode)(ele);
     });
 
@@ -76,12 +79,11 @@ function NodeSizeButton(props) {
   var _onChange = function onChange(prop) {
     var name = prop.name,
         value = prop.value;
-    var gv = topo.view.topoClient.getGraphView();
     var element = topo.getSelectionModel().getFirstData();
 
-    if (name === "width") {
+    if (name === 'width') {
       element.setWidth(value);
-    } else if (name === "height") {
+    } else if (name === 'height') {
       element.setHeight(value);
     }
   };
@@ -125,12 +127,12 @@ function NodeSizeButton(props) {
       topo.historyManager.beginTransaction();
 
       _onChange({
-        name: "width",
+        name: 'width',
         value: size.width
       });
 
       _onChange({
-        name: "height",
+        name: 'height',
         value: size.height
       });
 

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

@@ -29,22 +29,34 @@ function DropdownButton(props) {
       children = props.children;
 
   var _useState = (0, _react.useState)(false),
-      active = _useState[0],
-      setActive = _useState[1];
+      visible = _useState[0],
+      setVisible = _useState[1];
 
   var button = /*#__PURE__*/_react["default"].createElement(_ButtonBox["default"], {
-    active: active,
+    active: visible,
     disabled: disabled,
     showArrow: showArrow
   }, trigger);
 
+  var renderContent = function renderContent() {
+    if (!visible) {
+      return /*#__PURE__*/_react["default"].createElement("div", null);
+    }
+
+    if (showContainer) {
+      return /*#__PURE__*/_react["default"].createElement(PopupCard, null, children);
+    }
+
+    return children;
+  };
+
   return /*#__PURE__*/_react["default"].createElement(_dropdown["default"], {
-    visible: active,
+    visible: visible,
     disabled: disabled,
     trigger: button,
     triggerType: "click",
-    onVisibleChange: setActive
-  }, !showContainer ? children : /*#__PURE__*/_react["default"].createElement(PopupCard, null, children));
+    onVisibleChange: setVisible
+  }, renderContent());
 }
 
 DropdownButton.propTypes = {

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

@@ -16,18 +16,23 @@ var _DropdownButton = _interopRequireDefault(require("./DropdownButton"));
 function DropdownMenu(props) {
   var value = props.value,
       children = props.children,
+      multiple = props.multiple,
       onChange = props.onChange,
       valueRender = props.valueRender;
   var selectedKeys = Array.isArray(value) ? value : [value];
   var valueDisplay = valueRender ? valueRender(value) : value;
+  var selectMode = multiple ? 'multiple' : 'single';
+
+  var menu = /*#__PURE__*/_react["default"].createElement(_menu["default"], {
+    selectMode: selectMode,
+    selectedKeys: selectedKeys,
+    onSelect: onChange
+  }, children);
+
   return /*#__PURE__*/_react["default"].createElement(_DropdownButton["default"], {
     trigger: valueDisplay,
     showContainer: false
-  }, /*#__PURE__*/_react["default"].createElement(_menu["default"], {
-    selectMode: "single",
-    selectedKeys: selectedKeys,
-    onSelect: onChange
-  }, children));
+  }, multiple ? /*#__PURE__*/_react["default"].createElement("div", null, menu) : menu);
 }
 
 _DropdownButton["default"].propTypes = {

package/lib/core/editor/components/settings/CloseablePanel.js

@@ -11,12 +11,16 @@ var _icon = _interopRequireDefault(require("@alifd/next/lib/icon"));
 
 var _react = _interopRequireDefault(require("react"));
 
+var _CloseablePanelModule = _interopRequireDefault(require("./CloseablePanel.module.scss"));
+
 function CloseablePanel(props) {
   var prefix = props.prefix,
       title = props.title,
       onClose = props.onClose,
       children = props.children;
-  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("div", {
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: _CloseablePanelModule["default"].panel
+  }, /*#__PURE__*/_react["default"].createElement("div", {
     className: prefix + "drawer-header",
     role: "heading",
     "aria-level": "1"
@@ -28,7 +32,9 @@ function CloseablePanel(props) {
   }, /*#__PURE__*/_react["default"].createElement(_icon["default"], {
     type: "close",
     className: "next-drawer-close-icon"
-  }))), /*#__PURE__*/_react["default"].createElement("div", null, children));
+  }))), /*#__PURE__*/_react["default"].createElement("div", {
+    className: _CloseablePanelModule["default"].body
+  }, children));
 }
 
 CloseablePanel.defaultProps = {

package/lib/core/editor/components/settings/CloseablePanel.module.scss

@@ -0,0 +1,9 @@
+.panel {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  background: #FFFFFF;
+}
+.body {
+  flex: 1;
+}

package/lib/core/editor/components/settings/PropertyView.js

@@ -11,12 +11,12 @@ var _classnames = _interopRequireDefault(require("classnames"));
 
 var _Settings = _interopRequireDefault(require("./Settings"));
 
-var _SettingsModule = _interopRequireDefault(require("./Settings.module.scss"));
-
 var _OpenPropertyPanelListener = _interopRequireDefault(require("./OpenPropertyPanelListener"));
 
 var _CloseablePanel = _interopRequireDefault(require("./CloseablePanel"));
 
+var _SettingsModule = _interopRequireDefault(require("./Settings.module.scss"));
+
 function PropertyView(props) {
   var _classNames;
 
@@ -41,10 +41,6 @@ function PropertyView(props) {
   }
 
   var renderContent = function renderContent() {
-    if (!graphLoaded) {
-      return null;
-    }
-
     return /*#__PURE__*/_react["default"].createElement(_OpenPropertyPanelListener["default"], {
       topo: topo
     }, /*#__PURE__*/_react["default"].createElement(_Settings["default"], {
@@ -65,5 +61,5 @@ function PropertyView(props) {
         propertyPanelVisible: false
       });
     }
-  }), renderContent());
+  }, renderContent()));
 }

package/lib/core/editor/components/settings/common/AlignSetting/index.js

@@ -23,8 +23,7 @@ function AlignSetting(props) {
       return !(0, _htElementUtils.isLayer)(ele) && !(0, _htElementUtils.isEdge)(ele);
     }); // console.info("element--selectList", element, selectList);
 
-    topo.view.topoClient.htTopoClient.setAlignmentBySelectionNodes(type, nodes); // topo.view.topoClient.htTopoClient.setElementsSpace(nodes,'h',300)
-
+    topo.view.topoClient.htTopoClient.setAlignmentBySelectionNodes(type, nodes);
     topo.historyManager.endTransaction();
   };
 

package/lib/core/editor/components/settings/propertyViews/edge/CommonEdgePropertyView.js

@@ -62,8 +62,10 @@ function CommonEdgePropertyView(props) {
   }, [values]);
 
   var setLineColor = function setLineColor(color) {
-    var style = edge.a("styles") || {};
+    // 同时修改实线、虚线
     edge.s("edge.color", color);
+    edge.s("edge.dash.color", color);
+    var style = edge.a("styles") || {};
     edge.a("styles", (0, _extends2["default"])({}, style, {
       color: color
     }));
@@ -114,6 +116,10 @@ function CommonEdgePropertyView(props) {
     style: {
       width: "100%"
     },
+    onChange: function onChange(val) {
+      // 同时修改实线、虚线的线宽
+      edge.s('edge.dash.width', val);
+    },
     onFocus: function onFocus() {
       topo.historyManager.beginTransaction();
     },

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

@@ -0,0 +1 @@
+"use strict";

package/lib/core/hooks/usePolling.js

@@ -74,11 +74,8 @@ var usePolling = function usePolling(props) {
 
 
   (0, _react.useEffect)(function () {
-    var isViewer = topoState.viewState === 'view';
-
-    if (topo.options.enableDefaultMetricLoader && isViewer) {
+    if (topo.options.enableDefaultMetricLoader) {
       _rlog["default"].debug('usePolling.useEffect: 开始轮询', {
-        isViewer: isViewer,
         pollingSwitch: pollingSwitch,
         resIdsList: resIdsList,
         resourceOverviewState: resourceOverviewState,
@@ -95,7 +92,7 @@ var usePolling = function usePolling(props) {
         stopPoll();
       }
     };
-  }, [topoState.viewState, pollingSwitch, resIdsList, displayConfig, resourceOverviewState.id, resourceOverviewState.metricCodes]);
+  }, [pollingSwitch, resIdsList, displayConfig, resourceOverviewState.id, resourceOverviewState.metricCodes]);
   /**
    * 
    * @returns {{id, attributes: object[], metrics: object[]}[]} 属性和指标

package/lib/core/models/AttributeMetricDisplay.js

@@ -668,7 +668,11 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
     var htTopo = topo.getHtTopo();
 
     if (htTopo) {
+      var _topo$historyManager, _topo$historyManager2;
+
+      (_topo$historyManager = topo.historyManager) === null || _topo$historyManager === void 0 ? void 0 : _topo$historyManager.setDisabled(true, '加载标注');
       htTopo.loadTagAndTip(JSON.parse(JSON.stringify(elementTagsAndTips)));
+      (_topo$historyManager2 = topo.historyManager) === null || _topo$historyManager2 === void 0 ? void 0 : _topo$historyManager2.setDisabled(false, '加载标注');
     }
   }
   /**

package/lib/core/models/TopoApp.js

@@ -52,7 +52,7 @@ var _ElementTagTipConfig = _interopRequireDefault(require("./tagstips/ElementTag
 var _SelectionManager = _interopRequireDefault(require("./SelectionManager"));
 
 // eslint-disable-next-line no-undef
-var version = typeof "6.0.0-alpha.30" === 'string' ? "6.0.0-alpha.30" : null;
+var version = typeof "6.0.0-alpha.31" === 'string' ? "6.0.0-alpha.31" : null;
 console.info("\u62D3\u6251\u7248\u672C: " + version);
 /**
  * 拓扑显示和编辑

package/lib/utils/htElementUtils.js

@@ -31,6 +31,7 @@ exports.isExistedElement = isExistedElement;
 exports.isGroup = isGroup;
 exports.isLayer = isLayer;
 exports.isNode = isNode;
+exports.isText = isText;
 exports.isValidEdge = isValidEdge;
 exports.setElementRuntimeStyle = setElementRuntimeStyle;
 
@@ -95,6 +96,10 @@ function isLayer(element) {
   return element instanceof ht.Grid;
 }
 
+function isText(element) {
+  return element instanceof ht.Text && element.a('isText');
+}
+
 function getElements(dataModel) {
   // console.error(111, dataModel.getDatas().getArray())
   return dataModel.getDatas().getArray();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@riil-frontend/component-topology",
-  "version": "6.0.0-alpha.30",
+  "version": "6.0.0-alpha.31",
   "description": "拓扑",
   "scripts": {
     "start": "build-scripts start",
@@ -115,6 +115,6 @@
     "access": "public"
   },
   "license": "MIT",
-  "homepage": "https://unpkg.com/@riil-frontend/component-topology@6.0.0-alpha.30/build/index.html",
+  "homepage": "https://unpkg.com/@riil-frontend/component-topology@6.0.0-alpha.31/build/index.html",
   "gitHead": "2da19ffccbb7ca60a8acf396e39f542c68bb33f5"
 }