@riil-frontend/component-topology 6.0.0-alpha.4 → 6.0.0-alpha.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (81) hide show
  1. package/build/1.js +2 -2
  2. package/build/2.js +1 -1
  3. package/build/index.css +1 -1
  4. package/build/index.js +21 -21
  5. package/es/components/VerticalIconTab/VerticalIconTab.module.scss +5 -1
  6. package/es/core/editor/components/Sidebar/Sidebar.js +23 -50
  7. package/es/core/editor/components/Sidebar/panes.js +32 -0
  8. package/es/core/editor/components/Sidebar/views/CanvasPanel/{ImagePanel.js → CanvasPanel.js} +1 -1
  9. package/es/core/editor/components/Sidebar/views/CanvasPanel/index.js +1 -1
  10. package/es/core/editor/components/Sidebar/views/ImagePanel/HtCustomImagePanel.js +2 -5
  11. package/es/core/editor/components/Sidebar/views/ImagePanel/HtImagePalette.js +2 -4
  12. package/es/core/editor/components/Sidebar/views/ImagePanel/HtImagePalette.module.scss +5 -0
  13. package/es/core/editor/components/Toolbar/EditorToolbar.js +9 -6
  14. package/es/core/editor/components/Toolbar/Toolbar.js +1 -1
  15. package/es/core/editor/components/Toolbar/Toolbar.module.scss +14 -3
  16. package/es/core/editor/components/Toolbar/widgets/AddResourceButton.js +6 -5
  17. package/es/core/editor/components/Toolbar/widgets/CanvasMoveWidget.js +13 -2
  18. package/es/core/editor/components/Toolbar/widgets/CanvasSelectWidget.js +11 -2
  19. package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/EdgeType.js +133 -3
  20. package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/EdgeType.module.scss +46 -0
  21. package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.js +46 -0
  22. package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.module.scss +31 -0
  23. package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/index.js +27 -6
  24. package/es/core/editor/components/Toolbar/widgets/HistoryRedoButton.js +2 -1
  25. package/es/core/editor/components/Toolbar/widgets/HistoryUndoButton.js +3 -2
  26. package/es/core/editor/components/Toolbar/widgets/NodeSizeButton/NodeSizeButton.js +2 -1
  27. package/es/core/editor/components/Toolbar/widgets/WidgetBox.js +7 -20
  28. package/es/core/editor/components/Toolbar/widgets/WidgetBox.module.scss +1 -0
  29. package/es/core/editor/components/Toolbar/widgets/components/ButtonBox.js +4 -2
  30. package/es/core/editor/components/Toolbar/widgets/components/DropdownButton.js +8 -5
  31. package/es/core/editor/components/settings/common/LineType/index.js +3 -19
  32. package/es/core/editor/components/settings/common/SizeInput/NodeSizeInput.js +3 -0
  33. package/es/core/editor/components/settings/propertyViews/multipleElements/MultipleElementLineType.js +2 -37
  34. package/es/core/{store/models → editor/store}/background.js +0 -0
  35. package/es/core/{store/models → editor/store}/historyManager.js +0 -0
  36. package/es/core/{store/models → editor/store}/topoEdit.js +8 -1
  37. package/es/core/editor/utils/edgeTypeStyleUtil.js +73 -0
  38. package/es/core/hooks/useTopoEdit.js +21 -54
  39. package/es/core/models/TopoApp.js +1 -1
  40. package/es/core/models/TopoGraphView.js +8 -2
  41. package/es/core/store/coreModels.js +6 -7
  42. package/lib/components/VerticalIconTab/VerticalIconTab.module.scss +5 -1
  43. package/lib/core/editor/components/Sidebar/Sidebar.js +22 -53
  44. package/lib/core/editor/components/Sidebar/panes.js +45 -0
  45. package/lib/core/editor/components/Sidebar/views/CanvasPanel/{ImagePanel.js → CanvasPanel.js} +2 -2
  46. package/lib/core/editor/components/Sidebar/views/CanvasPanel/index.js +2 -2
  47. package/lib/core/editor/components/Sidebar/views/ImagePanel/HtCustomImagePanel.js +2 -5
  48. package/lib/core/editor/components/Sidebar/views/ImagePanel/HtImagePalette.js +3 -4
  49. package/lib/core/editor/components/Sidebar/views/ImagePanel/HtImagePalette.module.scss +5 -0
  50. package/lib/core/editor/components/Toolbar/EditorToolbar.js +10 -6
  51. package/lib/core/editor/components/Toolbar/Toolbar.js +1 -1
  52. package/lib/core/editor/components/Toolbar/Toolbar.module.scss +14 -3
  53. package/lib/core/editor/components/Toolbar/widgets/AddResourceButton.js +6 -5
  54. package/lib/core/editor/components/Toolbar/widgets/CanvasMoveWidget.js +13 -2
  55. package/lib/core/editor/components/Toolbar/widgets/CanvasSelectWidget.js +11 -2
  56. package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/EdgeType.js +143 -3
  57. package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/EdgeType.module.scss +46 -0
  58. package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.js +61 -0
  59. package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.module.scss +31 -0
  60. package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/index.js +27 -5
  61. package/lib/core/editor/components/Toolbar/widgets/HistoryRedoButton.js +3 -1
  62. package/lib/core/editor/components/Toolbar/widgets/HistoryUndoButton.js +3 -1
  63. package/lib/core/editor/components/Toolbar/widgets/NodeSizeButton/NodeSizeButton.js +2 -1
  64. package/lib/core/editor/components/Toolbar/widgets/WidgetBox.js +9 -24
  65. package/lib/core/editor/components/Toolbar/widgets/WidgetBox.module.scss +1 -0
  66. package/lib/core/editor/components/Toolbar/widgets/components/ButtonBox.js +4 -2
  67. package/lib/core/editor/components/Toolbar/widgets/components/DropdownButton.js +8 -5
  68. package/lib/core/editor/components/settings/common/LineType/index.js +3 -18
  69. package/lib/core/editor/components/settings/common/SizeInput/NodeSizeInput.js +3 -0
  70. package/lib/core/editor/components/settings/propertyViews/multipleElements/MultipleElementLineType.js +2 -37
  71. package/lib/core/{store/models → editor/store}/background.js +0 -0
  72. package/lib/core/{store/models → editor/store}/historyManager.js +0 -0
  73. package/lib/core/{store/models → editor/store}/topoEdit.js +8 -1
  74. package/lib/core/editor/utils/edgeTypeStyleUtil.js +82 -0
  75. package/lib/core/hooks/useTopoEdit.js +21 -56
  76. package/lib/core/models/TopoApp.js +1 -1
  77. package/lib/core/models/TopoGraphView.js +8 -2
  78. package/lib/core/store/coreModels.js +5 -7
  79. package/package.json +2 -2
  80. package/es/core/store/models/topoView.js +0 -36
  81. package/lib/core/store/models/topoView.js +0 -47
@@ -0,0 +1,31 @@
1
+ .lineType{
2
+ display:flex;
3
+ .redioBtn {
4
+ width: 24px;
5
+ height: 24px;
6
+ border-radius: 4px;
7
+ border: none !important;
8
+ color: #4D6277;
9
+ padding: 0;
10
+ margin-right: 16px;
11
+ text-align: center;
12
+
13
+ .iconImg {
14
+ vertical-align: middle;
15
+ }
16
+
17
+ &:active {
18
+ background: #F2F7FD !important;
19
+ }
20
+
21
+ &:hover {
22
+ background: #F2F7FD !important;
23
+ }
24
+ }
25
+ .redioBtn:last-child{
26
+ margin-right: 0;
27
+ }
28
+ }
29
+ .iconImg {
30
+ vertical-align: middle;
31
+ }
@@ -9,6 +9,8 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
9
9
 
10
10
  var _react = _interopRequireWildcard(require("react"));
11
11
 
12
+ var _edgeTypeStyleUtil = require("../../../../utils/edgeTypeStyleUtil");
13
+
12
14
  var _DropdownButton = _interopRequireDefault(require("../components/DropdownButton"));
13
15
 
14
16
  var _WidgetBox = _interopRequireDefault(require("../WidgetBox"));
@@ -31,15 +33,32 @@ function EdgeTypeButton(props) {
31
33
  showLabel = props.showLabel,
32
34
  otherProps = (0, _objectWithoutPropertiesLoose2["default"])(props, _excluded);
33
35
 
34
- var _useState = (0, _react.useState)(true),
36
+ var _useState = (0, _react.useState)(false),
35
37
  disabled = _useState[0],
36
- setDisabled = _useState[1]; // 选中的元素
38
+ setDisabled = _useState[1]; // 拓扑图是否加载
39
+
40
+
41
+ var _topo$store$useModelS = topo.store.useModelState('topoMod'),
42
+ graphLoaded = _topo$store$useModelS.graphLoaded; // 选中的元素
37
43
 
38
44
 
39
45
  var selection = topo.selectionManager.useSelection();
40
46
  (0, _react.useEffect)(function () {
41
- setDisabled(false);
42
- }, [selection]);
47
+ if (graphLoaded) {
48
+ var edges = (0, _edgeTypeStyleUtil.getEdgesBySelection)(topo);
49
+ console.info('xxxx', edges, selection);
50
+ setDisabled(!edges.length);
51
+ }
52
+ }, [selection, graphLoaded]);
53
+
54
+ var handleChange = function handleChange(name, value) {
55
+ var edges = (0, _edgeTypeStyleUtil.getEdgesBySelection)(topo);
56
+
57
+ if (name === 'lineButton') {
58
+ (0, _edgeTypeStyleUtil.setEdgesType)(edges, value, topo);
59
+ }
60
+ };
61
+
43
62
  var icon = disabled ? /*#__PURE__*/_react["default"].createElement("img", {
44
63
  src: "/img/topo/editor/toolbar/\u7EBF\u5F62/Disable.svg",
45
64
  alt: ""
@@ -50,11 +69,14 @@ function EdgeTypeButton(props) {
50
69
  return /*#__PURE__*/_react["default"].createElement(_WidgetBox["default"], {
51
70
  label: "\u7EBF\u5F62",
52
71
  tooltip: "\u7EBF\u5F62",
72
+ disabled: disabled,
53
73
  showLabel: showLabel
54
74
  }, /*#__PURE__*/_react["default"].createElement(_DropdownButton["default"], {
55
75
  disabled: disabled,
56
76
  trigger: icon
57
- }, /*#__PURE__*/_react["default"].createElement(_EdgeType["default"], null)));
77
+ }, /*#__PURE__*/_react["default"].createElement(_EdgeType["default"], {
78
+ onChange: handleChange
79
+ })));
58
80
  }
59
81
 
60
82
  var _default = EdgeTypeButton;
@@ -9,6 +9,8 @@ var _react = _interopRequireDefault(require("react"));
9
9
 
10
10
  var _WidgetBox = _interopRequireDefault(require("./WidgetBox"));
11
11
 
12
+ var _ButtonBox = _interopRequireDefault(require("./components/ButtonBox"));
13
+
12
14
  function HistoryRedoButton(props) {
13
15
  var topo = props.topo,
14
16
  showLabel = props.showLabel;
@@ -21,7 +23,7 @@ function HistoryRedoButton(props) {
21
23
  label: "\u6062\u590D",
22
24
  tooltip: "\u6062\u590D",
23
25
  showLabel: showLabel
24
- }, /*#__PURE__*/_react["default"].createElement(_WidgetBox["default"].ButtonBox, null, /*#__PURE__*/_react["default"].createElement("img", {
26
+ }, /*#__PURE__*/_react["default"].createElement(_ButtonBox["default"], null, /*#__PURE__*/_react["default"].createElement("img", {
25
27
  src: "/img/topo/editor/toolbar/redo/" + (disabled ? 'Disable' : 'Normal') + ".svg",
26
28
  alt: ""
27
29
  })));
@@ -7,6 +7,8 @@ exports["default"] = void 0;
7
7
 
8
8
  var _react = _interopRequireDefault(require("react"));
9
9
 
10
+ var _ButtonBox = _interopRequireDefault(require("./components/ButtonBox"));
11
+
10
12
  var _WidgetBox = _interopRequireDefault(require("./WidgetBox"));
11
13
 
12
14
  // import { Icon, Button } from '@alifd/next';
@@ -23,7 +25,7 @@ function HistoryUndoButton(props) {
23
25
  label: "\u64A4\u9500",
24
26
  tooltip: "\u64A4\u9500",
25
27
  showLabel: showLabel
26
- }, /*#__PURE__*/_react["default"].createElement(_WidgetBox["default"].ButtonBox, {
28
+ }, /*#__PURE__*/_react["default"].createElement(_ButtonBox["default"], {
27
29
  disabled: disabled,
28
30
  onClick: function onClick() {
29
31
  topo.historyManager.undo();
@@ -51,7 +51,8 @@ function NodeSizeButton(props) {
51
51
  }, /*#__PURE__*/_react["default"].createElement(_BatchSetNodeSize["default"], {
52
52
  topo: topo,
53
53
  size: "small",
54
- showLabel: false
54
+ showLabel: false,
55
+ hasTrigger: false
55
56
  })));
56
57
  }
57
58
 
@@ -5,19 +5,13 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  exports.__esModule = true;
6
6
  exports["default"] = void 0;
7
7
 
8
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
-
10
- var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
11
-
12
8
  var _balloon = _interopRequireDefault(require("@alifd/next/lib/balloon"));
13
9
 
14
- var _classnames = _interopRequireDefault(require("classnames"));
15
-
16
10
  var _react = _interopRequireDefault(require("react"));
17
11
 
18
- var _WidgetBoxModule = _interopRequireDefault(require("./WidgetBox.module.scss"));
12
+ var _ButtonBox = _interopRequireDefault(require("./components/ButtonBox"));
19
13
 
20
- var _excluded = ["active", "disabled", "children"];
14
+ var _WidgetBoxModule = _interopRequireDefault(require("./WidgetBox.module.scss"));
21
15
 
22
16
  function WidgetBox(props) {
23
17
  var label = props.label,
@@ -26,9 +20,8 @@ function WidgetBox(props) {
26
20
  disabled = props.disabled,
27
21
  children = props.children;
28
22
 
29
- var button = /*#__PURE__*/_react["default"].createElement("button", {
23
+ var button = /*#__PURE__*/_react["default"].createElement("div", {
30
24
  disabled: disabled,
31
- type: "button",
32
25
  className: _WidgetBoxModule["default"].container
33
26
  }, /*#__PURE__*/_react["default"].createElement("div", {
34
27
  className: _WidgetBoxModule["default"].content
@@ -42,22 +35,14 @@ function WidgetBox(props) {
42
35
 
43
36
  return /*#__PURE__*/_react["default"].createElement(_balloon["default"].Tooltip, {
44
37
  trigger: button,
45
- align: "b"
38
+ align: "b" // 解决遮挡下拉浮层问题
39
+ ,
40
+ popupStyle: {
41
+ zIndex: 1000
42
+ }
46
43
  }, tooltip);
47
44
  }
48
45
 
49
- function ButtonBox(props) {
50
- var _classNames;
51
-
52
- var active = props.active,
53
- disabled = props.disabled,
54
- children = props.children,
55
- otherProps = (0, _objectWithoutPropertiesLoose2["default"])(props, _excluded);
56
- return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
57
- className: (0, _classnames["default"])(_WidgetBoxModule["default"].ButtonBox, (_classNames = {}, _classNames[_WidgetBoxModule["default"].ButtonBoxActive] = active, _classNames[_WidgetBoxModule["default"].ButtonBoxDisabled] = disabled, _classNames))
58
- }, otherProps), children);
59
- }
60
-
61
- WidgetBox.ButtonBox = ButtonBox;
46
+ WidgetBox.ButtonBox = _ButtonBox["default"];
62
47
  var _default = WidgetBox;
63
48
  exports["default"] = _default;
@@ -8,6 +8,7 @@
8
8
  border-width: 0;
9
9
  background-color: transparent;
10
10
  border-color: transparent;
11
+ user-select: none;
11
12
 
12
13
  &[disabled] {
13
14
  cursor: not-allowed;
@@ -19,7 +19,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
19
19
 
20
20
  var _ButtonBoxModule = _interopRequireDefault(require("./ButtonBox.module.scss"));
21
21
 
22
- var _excluded = ["active", "disabled", "showArrow", "children"];
22
+ var _excluded = ["active", "disabled", "showArrow", "children", "onClick"];
23
23
 
24
24
  function ButtonBox(props) {
25
25
  var _classNames, _classNames2;
@@ -28,9 +28,11 @@ function ButtonBox(props) {
28
28
  disabled = props.disabled,
29
29
  showArrow = props.showArrow,
30
30
  children = props.children,
31
+ onClick = props.onClick,
31
32
  otherProps = (0, _objectWithoutPropertiesLoose2["default"])(props, _excluded);
32
33
  return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
33
- className: (0, _classnames["default"])(_ButtonBoxModule["default"].ButtonBox, (_classNames = {}, _classNames[_ButtonBoxModule["default"].ButtonBoxActive] = active, _classNames[_ButtonBoxModule["default"].ButtonBoxDisabled] = disabled, _classNames))
34
+ className: (0, _classnames["default"])(_ButtonBoxModule["default"].ButtonBox, (_classNames = {}, _classNames[_ButtonBoxModule["default"].ButtonBoxActive] = active, _classNames[_ButtonBoxModule["default"].ButtonBoxDisabled] = disabled, _classNames)),
35
+ onClick: disabled ? undefined : onClick
34
36
  }, otherProps), children, showArrow && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, "\xA0", /*#__PURE__*/_react["default"].createElement(_icon["default"], {
35
37
  type: "tree_fold_arrow",
36
38
  size: "xxs",
@@ -21,6 +21,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
21
21
 
22
22
  function DropdownButton(props) {
23
23
  var trigger = props.trigger,
24
+ disabled = props.disabled,
24
25
  _props$showArrow = props.showArrow,
25
26
  showArrow = _props$showArrow === void 0 ? true : _props$showArrow,
26
27
  _props$showContainer = props.showContainer,
@@ -28,19 +29,21 @@ function DropdownButton(props) {
28
29
  children = props.children;
29
30
 
30
31
  var _useState = (0, _react.useState)(false),
31
- visible = _useState[0],
32
- setVisible = _useState[1];
32
+ active = _useState[0],
33
+ setActive = _useState[1];
33
34
 
34
35
  var button = /*#__PURE__*/_react["default"].createElement(_ButtonBox["default"], {
35
- active: visible,
36
+ active: active,
37
+ disabled: disabled,
36
38
  showArrow: showArrow
37
39
  }, trigger);
38
40
 
39
41
  return /*#__PURE__*/_react["default"].createElement(_dropdown["default"], {
40
- visible: visible,
42
+ visible: active,
43
+ disabled: disabled,
41
44
  trigger: button,
42
45
  triggerType: "click",
43
- onVisibleChange: setVisible
46
+ onVisibleChange: setActive
44
47
  }, !showContainer ? children : /*#__PURE__*/_react["default"].createElement(PopupCard, null, children));
45
48
  }
46
49
 
@@ -13,6 +13,8 @@ var _react = _interopRequireWildcard(require("react"));
13
13
 
14
14
  var _LineTypeModule = _interopRequireDefault(require("./LineType.module.scss"));
15
15
 
16
+ var _edgeTypeStyleUtil = require("../../../../utils/edgeTypeStyleUtil");
17
+
16
18
  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); }
17
19
 
18
20
  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; }
@@ -81,24 +83,7 @@ var LineType = function LineType(props) {
81
83
 
82
84
  var setLineType = function setLineType(type) {
83
85
  var edges = getEdges();
84
- var htTopo = topo.getHtTopo();
85
- edges.forEach(function (edge) {
86
- htTopo.setGraphLinear(edge, {
87
- type: type
88
- });
89
-
90
- if (edge.isEdgeGroupAgent()) {
91
- // 连线组折叠时同时设置子连线
92
- var edgeChildren = edge.getEdgeGroup().getEdges().toArray();
93
- htTopo.toggleEdgeGroup(edge.getSource(), edge.getTarget(), true);
94
- edgeChildren.forEach(function (edgeChild) {
95
- htTopo.setGraphLinear(edgeChild, {
96
- type: type
97
- });
98
- });
99
- htTopo.toggleEdgeGroup(edge.getSource(), edge.getTarget(), false);
100
- }
101
- });
86
+ (0, _edgeTypeStyleUtil.setEdgesType)(edges, type, topo);
102
87
  };
103
88
 
104
89
  var handleChange = function handleChange(data) {
@@ -46,6 +46,7 @@ function SizeInput(props) {
46
46
  onLockChange = props.onLockChange,
47
47
  _props$showLabel = props.showLabel,
48
48
  showLabel = _props$showLabel === void 0 ? true : _props$showLabel,
49
+ hasTrigger = props.hasTrigger,
49
50
  size = props.size;
50
51
 
51
52
  var handleChange = function handleChange(name, attrValue) {
@@ -92,6 +93,7 @@ function SizeInput(props) {
92
93
  step: step,
93
94
  placeholder: "\u8BF7\u8F93\u5165",
94
95
  size: size,
96
+ hasTrigger: hasTrigger,
95
97
  style: {
96
98
  width: '100%'
97
99
  },
@@ -123,6 +125,7 @@ function SizeInput(props) {
123
125
  step: step,
124
126
  placeholder: "\u8BF7\u8F93\u5165",
125
127
  size: size,
128
+ hasTrigger: hasTrigger,
126
129
  style: {
127
130
  width: '100%'
128
131
  },
@@ -7,7 +7,7 @@ exports["default"] = MultipleElementLineType;
7
7
 
8
8
  var _react = _interopRequireDefault(require("react"));
9
9
 
10
- var _htElementUtils = require("../../../../../../utils/htElementUtils");
10
+ var _edgeTypeStyleUtil = require("../../../../utils/edgeTypeStyleUtil");
11
11
 
12
12
  var _LineType = _interopRequireDefault(require("../../common/LineType"));
13
13
 
@@ -16,43 +16,8 @@ function MultipleElementLineType(props) {
16
16
 
17
17
  var setLineType = function setLineType(type) {};
18
18
 
19
- var getChildrenNodeIds = function getChildrenNodeIds(nodes) {
20
- var nodeIds = nodes.map(function (node) {
21
- return node.getId();
22
- });
23
- nodes.forEach(function (node) {
24
- if (node instanceof ht.Group) {
25
- var children = node.getChildren().toArray();
26
- nodeIds.push.apply(nodeIds, getChildrenNodeIds(children));
27
- }
28
- });
29
- return nodeIds;
30
- };
31
-
32
19
  var getSelectedEdges = function getSelectedEdges() {
33
- var gv = topo.getGraphView();
34
- var selection = gv.getSelectionModel().getSelection().toArray();
35
- var edges = selection.filter(function (element) {
36
- return element instanceof ht.Edge;
37
- }); // 查询选中节点间的连线
38
-
39
- var nodes = selection.filter(function (element) {
40
- return element instanceof ht.Node;
41
- });
42
- var nodeIds = getChildrenNodeIds(nodes);
43
- var dm = gv.getDataModel();
44
- (0, _htElementUtils.getEdges)(dm).forEach(function (edge) {
45
- if (nodeIds.find(function (nodeId) {
46
- return nodeId === edge.getSource().getId();
47
- }) && nodeIds.find(function (nodeId) {
48
- return nodeId === edge.getTarget().getId();
49
- }) && !edges.find(function (item) {
50
- return item === edge;
51
- })) {
52
- edges.push(edge);
53
- }
54
- });
55
- return edges;
20
+ return (0, _edgeTypeStyleUtil.getEdgesBySelection)(topo);
56
21
  };
57
22
 
58
23
  return /*#__PURE__*/_react["default"].createElement(_LineType["default"], {
@@ -21,7 +21,14 @@ var _topo = _interopRequireDefault(require("@riil-frontend/component-topology-co
21
21
  var _default = {
22
22
  // 定义 model 的初始 state
23
23
  state: {
24
- saving: false
24
+ // 是否就绪
25
+ ready: false,
26
+ // 保存状态
27
+ saving: false,
28
+ // 选择/拖动模式模式。默认选择模式 select|move
29
+ viewMouseMode: 'select',
30
+ // 资源面板展开项
31
+ resourceTabactiveKey: null
25
32
  },
26
33
  // 定义改变该模型状态的纯函数
27
34
  reducers: {
@@ -0,0 +1,82 @@
1
+ "use strict";
2
+
3
+ exports.__esModule = true;
4
+ exports.getEdgesBySelection = getEdgesBySelection;
5
+ exports.setEdgesType = setEdgesType;
6
+
7
+ var _htElementUtils = require("../../../utils/htElementUtils");
8
+
9
+ var ht = window.ht;
10
+
11
+ function getEdgesBySelection(topo) {
12
+ var getChildrenNodeIds = function getChildrenNodeIds(nodes) {
13
+ var nodeIds = nodes.map(function (node) {
14
+ return node.getId();
15
+ });
16
+ nodes.forEach(function (node) {
17
+ if (node instanceof ht.Group) {
18
+ var children = node.getChildren().toArray();
19
+ nodeIds.push.apply(nodeIds, getChildrenNodeIds(children));
20
+ }
21
+ });
22
+ return nodeIds;
23
+ };
24
+
25
+ var getSelectedEdges = function getSelectedEdges(topo) {
26
+ var gv = topo.getGraphView();
27
+ var selection = gv.getSelectionModel().getSelection().toArray(); // 选中的连线
28
+
29
+ var edges = selection.filter(function (element) {
30
+ return element instanceof ht.Edge;
31
+ }); // 查询选中节点间的连线
32
+
33
+ var nodes = selection.filter(function (element) {
34
+ return element instanceof ht.Node;
35
+ });
36
+ var nodeIds = getChildrenNodeIds(nodes);
37
+ var dm = gv.getDataModel();
38
+ (0, _htElementUtils.getEdges)(dm).forEach(function (edge) {
39
+ if (nodeIds.find(function (nodeId) {
40
+ return nodeId === edge.getSource().getId();
41
+ }) && nodeIds.find(function (nodeId) {
42
+ return nodeId === edge.getTarget().getId();
43
+ }) && !edges.find(function (item) {
44
+ return item === edge;
45
+ })) {
46
+ edges.push(edge);
47
+ }
48
+ });
49
+ return edges;
50
+ };
51
+
52
+ return getSelectedEdges(topo);
53
+ }
54
+ /**
55
+ * 批量设置连线线形
56
+ *
57
+ * @param {*} edges
58
+ * @param {*} type
59
+ * @param {*} topo
60
+ */
61
+
62
+
63
+ function setEdgesType(edges, type, topo) {
64
+ var htTopo = topo.getHtTopo();
65
+ edges.forEach(function (edge) {
66
+ htTopo.setGraphLinear(edge, {
67
+ type: type
68
+ });
69
+
70
+ if (edge.isEdgeGroupAgent()) {
71
+ // 连线组折叠时同时设置子连线
72
+ var edgeChildren = edge.getEdgeGroup().getEdges().toArray();
73
+ htTopo.toggleEdgeGroup(edge.getSource(), edge.getTarget(), true);
74
+ edgeChildren.forEach(function (edgeChild) {
75
+ htTopo.setGraphLinear(edgeChild, {
76
+ type: type
77
+ });
78
+ });
79
+ htTopo.toggleEdgeGroup(edge.getSource(), edge.getTarget(), false);
80
+ }
81
+ });
82
+ }
@@ -65,8 +65,6 @@ var useTopoEdit = function useTopoEdit(params) {
65
65
  editDispatchers = _store$useModel[1];
66
66
 
67
67
  var topoDispatchers = store.useModelDispatchers("topoMod");
68
- var _editState$groups = editState.groups,
69
- groups = _editState$groups === void 0 ? [] : _editState$groups;
70
68
 
71
69
  var _useState = (0, _react.useState)(false),
72
70
  showComboResDrawer = _useState[0],
@@ -315,57 +313,6 @@ var useTopoEdit = function useTopoEdit(params) {
315
313
  var deleteNode = function deleteNode(node) {
316
314
  emitEvent(_componentTopologyGraph.TopoEvent.EVENT_TRIGGER_DELETE, node);
317
315
  };
318
- /**
319
- * 删除视图内的资源
320
- */
321
-
322
-
323
- var deleteViewNode = function deleteViewNode(node) {
324
- var nodeId = node.id;
325
- var viewResources = resourceConfig.getViewResources();
326
- var index = viewResources["static"].indexOf(nodeId);
327
-
328
- if (index > -1) {
329
- editDispatchers.updateResources({
330
- "static": viewResources["static"].filter(function (item) {
331
- return item !== nodeId;
332
- })
333
- });
334
- }
335
- };
336
- /**
337
- * 删除容器内的单个资源
338
- *
339
- * @param allGroups
340
- * @param node 资源
341
- */
342
-
343
-
344
- var deleteGroupNode = function deleteGroupNode(allGroups, node) {
345
- var nodeId = node.id; // 更新容器内的资源
346
-
347
- var newGroups = allGroups.map(function (g) {
348
- var newGroup = g;
349
-
350
- if (resourceConfig.isGroupContainsNode(g, node)) {
351
- newGroup = (0, _extends2["default"])({}, g, {
352
- resources: resourceConfig.removeStaticResource(g.resources, nodeId)
353
- });
354
- }
355
-
356
- return newGroup;
357
- });
358
-
359
- _rlog["default"].info("删除容器内的单个资源", {
360
- groups: groups,
361
- node: node,
362
- newGroups: newGroups
363
- });
364
-
365
- editDispatchers.update({
366
- groups: newGroups
367
- });
368
- };
369
316
 
370
317
  var handleDeleteNode = function handleDeleteNode(element) {
371
318
  var _topo$options$editor;
@@ -677,9 +624,13 @@ var useTopoEdit = function useTopoEdit(params) {
677
624
  topo.linkDynamicStyleExecutor.execute();
678
625
  }
679
626
 
680
- topo.historyManager.endTransaction();
627
+ topo.historyManager.endTransaction(); // 添加资源后隐藏资源面板
681
628
 
682
- case 12:
629
+ topoEditDispatchers.update({
630
+ resourceTabactiveKey: null
631
+ });
632
+
633
+ case 13:
683
634
  case "end":
684
635
  return _context15.stop();
685
636
  }
@@ -762,8 +713,11 @@ var useTopoEdit = function useTopoEdit(params) {
762
713
 
763
714
  case 9:
764
715
  topo.historyManager.endTransaction();
716
+ topoEditDispatchers.update({
717
+ resourceTabactiveKey: null
718
+ });
765
719
 
766
- case 10:
720
+ case 11:
767
721
  case "end":
768
722
  return _context7.stop();
769
723
  }
@@ -1156,6 +1110,16 @@ var useTopoEdit = function useTopoEdit(params) {
1156
1110
 
1157
1111
  var effectsState = store.useModelEffectsState("topoConfig");
1158
1112
  var topoLoading = effectsState.getTopoByConditions.isLoading;
1113
+ /**
1114
+ * 设置视图鼠标模式
1115
+ */
1116
+
1117
+ var setViewMouseMode = (0, _react.useCallback)(function (mode) {
1118
+ topo.getHtTopo().setViewMouseMode(mode);
1119
+ topoEditDispatchers.update({
1120
+ viewMouseMode: mode
1121
+ });
1122
+ }, []);
1159
1123
  return {
1160
1124
  resourceConfig: resourceConfig,
1161
1125
 
@@ -1163,6 +1127,7 @@ var useTopoEdit = function useTopoEdit(params) {
1163
1127
  * 拓扑结构加载中状态
1164
1128
  */
1165
1129
  topoLoading: topoLoading,
1130
+ setViewMouseMode: setViewMouseMode,
1166
1131
 
1167
1132
  /**
1168
1133
  * 资源绑定(多选)抽屉显示状态
@@ -52,7 +52,7 @@ var _ElementTagTipConfig = _interopRequireDefault(require("./tagstips/ElementTag
52
52
  var _SelectionManager = _interopRequireDefault(require("./SelectionManager"));
53
53
 
54
54
  // eslint-disable-next-line no-undef
55
- var version = typeof "6.0.0-alpha.4" === 'string' ? "6.0.0-alpha.4" : null;
55
+ var version = typeof "6.0.0-alpha.6" === 'string' ? "6.0.0-alpha.6" : null;
56
56
  console.info("\u62D3\u6251\u7248\u672C: " + version);
57
57
  /**
58
58
  * 拓扑显示和编辑
@@ -36,10 +36,16 @@ var TopoGraphView = /*#__PURE__*/function () {
36
36
  this.contextMenu = new _ContextMenu["default"]();
37
37
  };
38
38
 
39
- _proto.getHtDataModel = function getHtDataModel() {
39
+ _proto.getHtGraphView = function getHtGraphView() {
40
40
  var _this$topoClient;
41
41
 
42
- return (_this$topoClient = this.topoClient) === null || _this$topoClient === void 0 ? void 0 : _this$topoClient.getDataModel();
42
+ return (_this$topoClient = this.topoClient) === null || _this$topoClient === void 0 ? void 0 : _this$topoClient.getGraphView();
43
+ };
44
+
45
+ _proto.getHtDataModel = function getHtDataModel() {
46
+ var _this$topoClient2;
47
+
48
+ return (_this$topoClient2 = this.topoClient) === null || _this$topoClient2 === void 0 ? void 0 : _this$topoClient2.getDataModel();
43
49
  }
44
50
  /**
45
51
  * 缩放平移整个拓扑以展示所有的图元