@riil-frontend/component-topology 6.0.0-alpha.8 → 6.0.0-alpha.9
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.
- package/build/1.js +2 -2
- package/build/2.js +1 -1
- package/build/index.css +1 -1
- package/build/index.js +21 -21
- package/es/core/common/icons/useIcons.js +7 -1
- package/es/core/editor/components/Sidebar/views/CanvasPanel/CanvasPanel.js +13 -18
- package/es/core/editor/components/Toolbar/EditorToolbar.js +16 -9
- package/es/core/editor/components/Toolbar/buttons.js +20 -18
- package/es/core/editor/components/Toolbar/widgets/AddResourceButton.js +2 -2
- package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/EdgeType.js +25 -8
- package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/EdgeType.module.scss +1 -3
- package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.js +14 -5
- package/es/core/editor/components/Toolbar/widgets/HistoryRedoButton.js +1 -1
- package/es/core/editor/components/Toolbar/widgets/HistoryUndoButton.js +2 -2
- package/es/core/editor/components/Toolbar/widgets/IconSelect/IconSelect.js +109 -0
- package/es/core/editor/components/Toolbar/widgets/IconSelect/constant.js +64 -0
- package/es/core/editor/components/Toolbar/widgets/IconSelect/index.js +101 -0
- package/es/core/editor/components/Toolbar/widgets/IconSelect/index.module.scss +151 -0
- package/es/core/editor/components/Toolbar/widgets/IconSelect/popUpContent.js +50 -0
- package/es/core/editor/components/Toolbar/widgets/NodeImageButton/BoxBackgroundSetting.js +14 -4
- package/es/core/editor/components/Toolbar/widgets/NodeImageButton/NodeImageButton.js +36 -6
- package/es/core/editor/components/Toolbar/widgets/NodeSizeButton/NodeSizeButton.js +87 -8
- package/es/core/editor/components/settings/common/NodeSizeInput/NodeSizeInput.js +3 -3
- package/es/core/editor/components/settings/common/SizeInput/NodeSizeInput.js +10 -6
- package/es/core/editor/components/settings/common/SizeInput/NodeSizeNumberPicker.js +7 -6
- package/es/core/editor/components/settings/propertyViews/multipleElements/BatchSetNodeSize/BatchSetNodeSize.js +8 -9
- package/es/core/editor/components/settings/propertyViews/view/BatchSetNodeSize.js +9 -6
- package/es/core/models/TopoApp.js +1 -1
- package/lib/core/common/icons/useIcons.js +7 -1
- package/lib/core/editor/components/Sidebar/views/CanvasPanel/CanvasPanel.js +13 -18
- package/lib/core/editor/components/Toolbar/EditorToolbar.js +14 -7
- package/lib/core/editor/components/Toolbar/buttons.js +21 -20
- package/lib/core/editor/components/Toolbar/widgets/AddResourceButton.js +2 -2
- package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/EdgeType.js +25 -8
- package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/EdgeType.module.scss +1 -3
- package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.js +15 -5
- package/lib/core/editor/components/Toolbar/widgets/HistoryRedoButton.js +1 -1
- package/lib/core/editor/components/Toolbar/widgets/HistoryUndoButton.js +2 -2
- package/lib/core/editor/components/Toolbar/widgets/IconSelect/IconSelect.js +126 -0
- package/lib/core/editor/components/Toolbar/widgets/IconSelect/constant.js +69 -0
- package/lib/core/editor/components/Toolbar/widgets/IconSelect/index.js +117 -0
- package/lib/core/editor/components/Toolbar/widgets/IconSelect/index.module.scss +151 -0
- package/lib/core/editor/components/Toolbar/widgets/IconSelect/popUpContent.js +62 -0
- package/lib/core/editor/components/Toolbar/widgets/NodeImageButton/BoxBackgroundSetting.js +20 -4
- package/lib/core/editor/components/Toolbar/widgets/NodeImageButton/NodeImageButton.js +35 -5
- package/lib/core/editor/components/Toolbar/widgets/NodeSizeButton/NodeSizeButton.js +87 -7
- package/lib/core/editor/components/settings/common/NodeSizeInput/NodeSizeInput.js +2 -2
- package/lib/core/editor/components/settings/common/SizeInput/NodeSizeInput.js +11 -7
- package/lib/core/editor/components/settings/common/SizeInput/NodeSizeNumberPicker.js +6 -6
- package/lib/core/editor/components/settings/propertyViews/multipleElements/BatchSetNodeSize/BatchSetNodeSize.js +6 -8
- package/lib/core/editor/components/settings/propertyViews/view/BatchSetNodeSize.js +7 -5
- package/lib/core/models/TopoApp.js +1 -1
- package/package.json +2 -2
@@ -0,0 +1,151 @@
|
|
1
|
+
@import "@alifd/next/variables";
|
2
|
+
|
3
|
+
.TopoIconSelect {
|
4
|
+
|
5
|
+
|
6
|
+
.iconSelect {}
|
7
|
+
|
8
|
+
|
9
|
+
|
10
|
+
}
|
11
|
+
|
12
|
+
.iconCollapse {
|
13
|
+
width: 240px;
|
14
|
+
max-height: 218px;
|
15
|
+
overflow-y: auto;
|
16
|
+
|
17
|
+
:global {
|
18
|
+
.#{$css-prefix}collapse-panel-expanded {
|
19
|
+
.#{$css-prefix}collapse-panel-content {
|
20
|
+
padding: 0px 0px 5px 0px;
|
21
|
+
}
|
22
|
+
}
|
23
|
+
|
24
|
+
.#{$css-prefix}collapse-panel {
|
25
|
+
border-top: none;
|
26
|
+
background-color: #FFF;
|
27
|
+
}
|
28
|
+
|
29
|
+
.#{$css-prefix}collapse-panel-title {
|
30
|
+
background: none;
|
31
|
+
font-size: 12px;
|
32
|
+
font-family: PingFangSC-Medium, PingFang SC;
|
33
|
+
font-weight: 500;
|
34
|
+
color: #4D6277;
|
35
|
+
line-height: 17px;
|
36
|
+
}
|
37
|
+
|
38
|
+
.#{$css-prefix}collapse-panel:not(:first-child) {
|
39
|
+
border-top: none;
|
40
|
+
}
|
41
|
+
|
42
|
+
.#{$css-prefix}collapse-panel-content {
|
43
|
+
padding: 0px 0px 5px 0px;
|
44
|
+
}
|
45
|
+
}
|
46
|
+
}
|
47
|
+
|
48
|
+
.iconSelect {
|
49
|
+
width: 100%;
|
50
|
+
|
51
|
+
.selected {
|
52
|
+
height: 26px;
|
53
|
+
display: block;
|
54
|
+
|
55
|
+
.iconImgWrapper {
|
56
|
+
display: inline-block;
|
57
|
+
width: 18px;
|
58
|
+
height: 18px;
|
59
|
+
line-height: 18px;
|
60
|
+
text-align: center;
|
61
|
+
// vertical-align: middle;
|
62
|
+
}
|
63
|
+
|
64
|
+
.iconImg {
|
65
|
+
display: inline-block;
|
66
|
+
width: auto;
|
67
|
+
height: auto;
|
68
|
+
max-width: 18px;
|
69
|
+
max-height: 18px;
|
70
|
+
vertical-align: middle;
|
71
|
+
}
|
72
|
+
|
73
|
+
.icontitle {
|
74
|
+
text-align: left;
|
75
|
+
vertical-align: top;
|
76
|
+
display: inline-block;
|
77
|
+
font-size: 12px;
|
78
|
+
font-family: PingFangSC-Regular, PingFang SC;
|
79
|
+
font-weight: 400;
|
80
|
+
color: #4D6277;
|
81
|
+
//margin-top: 2px;
|
82
|
+
line-height: 26px;
|
83
|
+
margin-left: 7px;
|
84
|
+
}
|
85
|
+
|
86
|
+
:global {
|
87
|
+
.#{$css-prefix}tag {
|
88
|
+
background: none;
|
89
|
+
}
|
90
|
+
}
|
91
|
+
}
|
92
|
+
}
|
93
|
+
|
94
|
+
|
95
|
+
|
96
|
+
.collPanel {
|
97
|
+
padding: 5px;
|
98
|
+
}
|
99
|
+
|
100
|
+
|
101
|
+
|
102
|
+
|
103
|
+
.iconli {
|
104
|
+
width: 52px;
|
105
|
+
height: 68px;
|
106
|
+
text-align: center;
|
107
|
+
border: 2px solid #FFF;
|
108
|
+
overflow: hidden;
|
109
|
+
cursor: pointer;
|
110
|
+
|
111
|
+
.iconImgWrapper {
|
112
|
+
width: 32px;
|
113
|
+
height: 32px;
|
114
|
+
line-height: 32px;
|
115
|
+
text-align: center;
|
116
|
+
margin: 5px 8px 5px 8px;
|
117
|
+
}
|
118
|
+
|
119
|
+
.iconImg {
|
120
|
+
display: inline-block;
|
121
|
+
width: auto;
|
122
|
+
height: auto;
|
123
|
+
max-width: 32px;
|
124
|
+
max-height: 32px;
|
125
|
+
vertical-align: middle;
|
126
|
+
}
|
127
|
+
|
128
|
+
.icontitle {
|
129
|
+
width: 48px;
|
130
|
+
max-width: 50px;
|
131
|
+
text-align: center;
|
132
|
+
font-size: 12px;
|
133
|
+
-webkit-text-size-adjust: none;
|
134
|
+
display: block;
|
135
|
+
white-space: nowrap;
|
136
|
+
text-overflow: ellipsis;
|
137
|
+
overflow: hidden;
|
138
|
+
font-family: PingFangSC-Regular, PingFang SC;
|
139
|
+
font-weight: 400;
|
140
|
+
color: #4D6277;
|
141
|
+
line-height: 11px;
|
142
|
+
}
|
143
|
+
|
144
|
+
|
145
|
+
// float: left;
|
146
|
+
}
|
147
|
+
|
148
|
+
.selectedTag {
|
149
|
+
border-radius: 4px;
|
150
|
+
border: 2px solid #4C89FF;
|
151
|
+
}
|
@@ -0,0 +1,62 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4
|
+
|
5
|
+
exports.__esModule = true;
|
6
|
+
exports["default"] = void 0;
|
7
|
+
|
8
|
+
var _box = _interopRequireDefault(require("@alifd/next/lib/box"));
|
9
|
+
|
10
|
+
var _collapse = _interopRequireDefault(require("@alifd/next/lib/collapse"));
|
11
|
+
|
12
|
+
var _react = _interopRequireDefault(require("react"));
|
13
|
+
|
14
|
+
var _indexModule = _interopRequireDefault(require("./index.module.scss"));
|
15
|
+
|
16
|
+
var Panel = _collapse["default"].Panel;
|
17
|
+
|
18
|
+
function PopUpContent(props) {
|
19
|
+
var iconList = props.iconList,
|
20
|
+
onChange = props.onChange,
|
21
|
+
selectedId = props.selectedId;
|
22
|
+
|
23
|
+
var itemOnClick = function itemOnClick(e) {
|
24
|
+
onChange(e);
|
25
|
+
};
|
26
|
+
|
27
|
+
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_collapse["default"], {
|
28
|
+
className: _indexModule["default"].iconCollapse,
|
29
|
+
defaultExpandedKeys: [0]
|
30
|
+
}, iconList.map(function (item, index) {
|
31
|
+
return /*#__PURE__*/_react["default"].createElement(Panel, {
|
32
|
+
title: item.name,
|
33
|
+
key: index,
|
34
|
+
className: _indexModule["default"].collPanel
|
35
|
+
}, /*#__PURE__*/_react["default"].createElement(_box["default"], {
|
36
|
+
spacing: 4,
|
37
|
+
direction: "row",
|
38
|
+
wrap: true
|
39
|
+
}, item.icons.map(function (icon, idx) {
|
40
|
+
return /*#__PURE__*/_react["default"].createElement("div", {
|
41
|
+
key: idx,
|
42
|
+
className: _indexModule["default"].iconli + " " + (selectedId === icon.id ? _indexModule["default"].selectedTag : ''),
|
43
|
+
onClick: function onClick() {
|
44
|
+
itemOnClick(icon);
|
45
|
+
},
|
46
|
+
title: icon.name
|
47
|
+
}, /*#__PURE__*/_react["default"].createElement("div", {
|
48
|
+
className: _indexModule["default"].iconImgWrapper
|
49
|
+
}, /*#__PURE__*/_react["default"].createElement("img", {
|
50
|
+
className: _indexModule["default"].iconImg,
|
51
|
+
alt: "",
|
52
|
+
src: icon.url,
|
53
|
+
size: "xxl"
|
54
|
+
})), /*#__PURE__*/_react["default"].createElement("span", {
|
55
|
+
className: _indexModule["default"].icontitle
|
56
|
+
}, icon.name));
|
57
|
+
})));
|
58
|
+
})));
|
59
|
+
}
|
60
|
+
|
61
|
+
var _default = PopUpContent;
|
62
|
+
exports["default"] = _default;
|
@@ -5,11 +5,27 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
5
5
|
exports.__esModule = true;
|
6
6
|
exports["default"] = void 0;
|
7
7
|
|
8
|
-
var _react =
|
8
|
+
var _react = _interopRequireWildcard(require("react"));
|
9
9
|
|
10
|
-
|
11
|
-
|
12
|
-
|
10
|
+
var _IconSelect = _interopRequireDefault(require("../IconSelect"));
|
11
|
+
|
12
|
+
var _useIcons = require("../../../../../common/icons/useIcons");
|
13
|
+
|
14
|
+
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); }
|
15
|
+
|
16
|
+
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; }
|
17
|
+
|
18
|
+
function BoxBackgroundSetting(props, ref) {
|
19
|
+
var value = props.value,
|
20
|
+
onChange = props.onChange,
|
21
|
+
topo = props.topo;
|
22
|
+
(0, _react.useEffect)(function () {}, []);
|
23
|
+
var icons = (0, _useIcons.useNodeIcons)(topo);
|
24
|
+
return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_IconSelect["default"], {
|
25
|
+
value: value,
|
26
|
+
iconList: icons,
|
27
|
+
onChange: onChange
|
28
|
+
}));
|
13
29
|
}
|
14
30
|
|
15
31
|
var _default = BoxBackgroundSetting;
|
@@ -23,8 +23,8 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
23
23
|
|
24
24
|
/**
|
25
25
|
* 替换图片设置
|
26
|
-
* @param {*} props
|
27
|
-
* @returns
|
26
|
+
* @param {*} props
|
27
|
+
* @returns
|
28
28
|
*/
|
29
29
|
function NodeImageButton(props) {
|
30
30
|
var topo = props.topo,
|
@@ -33,13 +33,41 @@ function NodeImageButton(props) {
|
|
33
33
|
|
34
34
|
var _useState = (0, _react.useState)(true),
|
35
35
|
disabled = _useState[0],
|
36
|
-
setDisabled = _useState[1];
|
36
|
+
setDisabled = _useState[1];
|
37
|
+
|
38
|
+
var _useState2 = (0, _react.useState)(),
|
39
|
+
imgVal = _useState2[0],
|
40
|
+
setImgVal = _useState2[1]; // 选中的元素
|
37
41
|
|
38
42
|
|
39
43
|
var selection = topo.selectionManager.useSelection();
|
40
44
|
(0, _react.useEffect)(function () {
|
41
|
-
|
45
|
+
console.log("NodeImageButton-selection", selection);
|
46
|
+
|
47
|
+
if (selection && selection.length > 0) {
|
48
|
+
setDisabled(false);
|
49
|
+
setImgVal(selection[0].image);
|
50
|
+
} else {
|
51
|
+
setDisabled(true);
|
52
|
+
}
|
42
53
|
}, [selection]);
|
54
|
+
|
55
|
+
var onChange = function onChange(prop) {
|
56
|
+
console.log("onChange-prop", prop, selection); //const { name, value } = prop;
|
57
|
+
// const gv = topo.view.topoClient.getGraphView();
|
58
|
+
//const element = topo.getSelectionModel().getFirstData();
|
59
|
+
|
60
|
+
var elements = topo.getSelectionModel();
|
61
|
+
console.log("onChange-elements", elements);
|
62
|
+
elements.each(function (element) {
|
63
|
+
element.setImage(prop);
|
64
|
+
}); // selection.map((element) => {
|
65
|
+
// element.setImage(prop);
|
66
|
+
// });
|
67
|
+
// if (name === "image") {
|
68
|
+
// }
|
69
|
+
};
|
70
|
+
|
43
71
|
var icon = disabled ? /*#__PURE__*/_react["default"].createElement("img", {
|
44
72
|
src: "/img/topo/editor/toolbar/\u66FF\u6362\u56FE\u7247/Disable.svg",
|
45
73
|
alt: ""
|
@@ -55,7 +83,9 @@ function NodeImageButton(props) {
|
|
55
83
|
disabled: disabled,
|
56
84
|
trigger: icon
|
57
85
|
}, /*#__PURE__*/_react["default"].createElement(_BoxBackgroundSetting["default"], {
|
58
|
-
topo: topo
|
86
|
+
topo: topo,
|
87
|
+
onChange: onChange,
|
88
|
+
value: imgVal
|
59
89
|
})));
|
60
90
|
}
|
61
91
|
|
@@ -9,7 +9,11 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
|
|
9
9
|
|
10
10
|
var _react = _interopRequireWildcard(require("react"));
|
11
11
|
|
12
|
-
var _BatchSetNodeSize = _interopRequireDefault(require("../../../settings/propertyViews/
|
12
|
+
var _BatchSetNodeSize = _interopRequireDefault(require("../../../settings/propertyViews/multipleElements/BatchSetNodeSize/BatchSetNodeSize"));
|
13
|
+
|
14
|
+
var _NodeSizeInput = _interopRequireDefault(require("../../../settings/common/NodeSizeInput/NodeSizeInput"));
|
15
|
+
|
16
|
+
var _useSettingRuntimeState = _interopRequireDefault(require("../../../settings/useSettingRuntimeState"));
|
13
17
|
|
14
18
|
var _WidgetBox = _interopRequireDefault(require("../WidgetBox"));
|
15
19
|
|
@@ -23,8 +27,8 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
23
27
|
|
24
28
|
/**
|
25
29
|
* 图片尺寸设置
|
26
|
-
* @param {*} props
|
27
|
-
* @returns
|
30
|
+
* @param {*} props
|
31
|
+
* @returns
|
28
32
|
*/
|
29
33
|
function NodeSizeButton(props) {
|
30
34
|
var topo = props.topo,
|
@@ -33,13 +37,49 @@ function NodeSizeButton(props) {
|
|
33
37
|
|
34
38
|
var _useState = (0, _react.useState)(true),
|
35
39
|
disabled = _useState[0],
|
36
|
-
setDisabled = _useState[1];
|
40
|
+
setDisabled = _useState[1];
|
41
|
+
|
42
|
+
var _useState2 = (0, _react.useState)(),
|
43
|
+
size = _useState2[0],
|
44
|
+
setSize = _useState2[1]; // 选中的元素
|
37
45
|
|
38
46
|
|
39
47
|
var selection = topo.selectionManager.useSelection();
|
48
|
+
var settingRuntimeState = (0, _useSettingRuntimeState["default"])();
|
40
49
|
(0, _react.useEffect)(function () {
|
41
|
-
|
50
|
+
if (selection && selection.length > 0) {
|
51
|
+
console.log("NodeSizeButton-selection", selection);
|
52
|
+
setDisabled(false);
|
53
|
+
|
54
|
+
if (selection.length === 1) {
|
55
|
+
setSize({
|
56
|
+
width: selection[0].width,
|
57
|
+
height: selection[0].height
|
58
|
+
});
|
59
|
+
}
|
60
|
+
} else {
|
61
|
+
setDisabled(true);
|
62
|
+
setSize({
|
63
|
+
width: null,
|
64
|
+
height: null
|
65
|
+
});
|
66
|
+
}
|
42
67
|
}, [selection]);
|
68
|
+
|
69
|
+
var _onChange = function onChange(prop) {
|
70
|
+
console.log("onChange-prop", prop);
|
71
|
+
var name = prop.name,
|
72
|
+
value = prop.value;
|
73
|
+
var gv = topo.view.topoClient.getGraphView();
|
74
|
+
var element = topo.getSelectionModel().getFirstData();
|
75
|
+
|
76
|
+
if (name === "width") {
|
77
|
+
element.setWidth(value);
|
78
|
+
} else if (name === "height") {
|
79
|
+
element.setHeight(value);
|
80
|
+
}
|
81
|
+
};
|
82
|
+
|
43
83
|
return /*#__PURE__*/_react["default"].createElement(_WidgetBox["default"], {
|
44
84
|
label: "\u56FE\u7247\u5C3A\u5BF8",
|
45
85
|
tooltip: "\u56FE\u7247\u5C3A\u5BF8",
|
@@ -48,11 +88,51 @@ function NodeSizeButton(props) {
|
|
48
88
|
style: {
|
49
89
|
width: 136
|
50
90
|
}
|
51
|
-
}, /*#__PURE__*/_react["default"].createElement(_BatchSetNodeSize["default"], {
|
91
|
+
}, selection.length > 1 ? /*#__PURE__*/_react["default"].createElement(_BatchSetNodeSize["default"], {
|
92
|
+
topo: topo,
|
93
|
+
size: "small",
|
94
|
+
value: size,
|
95
|
+
disabled: disabled,
|
96
|
+
showLabel: false,
|
97
|
+
hasTrigger: false,
|
98
|
+
onChange: function onChange(size) {
|
99
|
+
topo.historyManager.beginTransaction();
|
100
|
+
|
101
|
+
_onChange({
|
102
|
+
name: "width",
|
103
|
+
value: size.width
|
104
|
+
});
|
105
|
+
|
106
|
+
_onChange({
|
107
|
+
name: "height",
|
108
|
+
value: size.height
|
109
|
+
});
|
110
|
+
|
111
|
+
topo.historyManager.endTransaction();
|
112
|
+
}
|
113
|
+
}) : /*#__PURE__*/_react["default"].createElement(_NodeSizeInput["default"], {
|
52
114
|
topo: topo,
|
53
115
|
size: "small",
|
116
|
+
value: size,
|
117
|
+
disabled: disabled,
|
54
118
|
showLabel: false,
|
55
|
-
hasTrigger: false
|
119
|
+
hasTrigger: false,
|
120
|
+
settingRuntimeState: settingRuntimeState,
|
121
|
+
onChange: function onChange(size) {
|
122
|
+
topo.historyManager.beginTransaction();
|
123
|
+
|
124
|
+
_onChange({
|
125
|
+
name: "width",
|
126
|
+
value: size.width
|
127
|
+
});
|
128
|
+
|
129
|
+
_onChange({
|
130
|
+
name: "height",
|
131
|
+
value: size.height
|
132
|
+
});
|
133
|
+
|
134
|
+
topo.historyManager.endTransaction();
|
135
|
+
}
|
56
136
|
})));
|
57
137
|
}
|
58
138
|
|
@@ -124,14 +124,14 @@ function NodeSizeInput(props) {
|
|
124
124
|
return val ? Math.round(val) : val;
|
125
125
|
}
|
126
126
|
|
127
|
-
return /*#__PURE__*/_react["default"].createElement(_SizeInput["default"], {
|
127
|
+
return /*#__PURE__*/_react["default"].createElement(_SizeInput["default"], (0, _extends3["default"])({}, props, {
|
128
128
|
value: value,
|
129
129
|
lock: lock,
|
130
130
|
max: max,
|
131
131
|
step: step,
|
132
132
|
onChange: handleChange,
|
133
133
|
onLockChange: switchLock
|
134
|
-
});
|
134
|
+
}));
|
135
135
|
}
|
136
136
|
|
137
137
|
NodeSizeInput.propTypes = {
|
@@ -17,12 +17,12 @@ var _react = _interopRequireWildcard(require("react"));
|
|
17
17
|
|
18
18
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
19
19
|
|
20
|
+
var _rlog = _interopRequireDefault(require("@riil-frontend/component-topology-utils/es/rlog"));
|
21
|
+
|
20
22
|
var _NodeSizeNumberPicker = _interopRequireDefault(require("./NodeSizeNumberPicker"));
|
21
23
|
|
22
24
|
var _NodeSizeInputModule = _interopRequireDefault(require("./NodeSizeInput.module.scss"));
|
23
25
|
|
24
|
-
var _rlog = _interopRequireDefault(require("@riil-frontend/component-topology-utils/es/rlog"));
|
25
|
-
|
26
26
|
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); }
|
27
27
|
|
28
28
|
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; }
|
@@ -42,12 +42,13 @@ function SizeInput(props) {
|
|
42
42
|
max = props.max,
|
43
43
|
step = props.step,
|
44
44
|
onChange = props.onChange,
|
45
|
-
lock = props.lock,
|
46
|
-
onLockChange = props.onLockChange,
|
47
45
|
_props$showLabel = props.showLabel,
|
48
46
|
showLabel = _props$showLabel === void 0 ? true : _props$showLabel,
|
49
47
|
hasTrigger = props.hasTrigger,
|
50
|
-
size = props.size
|
48
|
+
size = props.size,
|
49
|
+
lock = props.lock,
|
50
|
+
disabled = props.disabled,
|
51
|
+
onLockChange = props.onLockChange;
|
51
52
|
|
52
53
|
var handleChange = function handleChange(name, attrValue) {
|
53
54
|
var _extends2;
|
@@ -88,9 +89,11 @@ function SizeInput(props) {
|
|
88
89
|
}, /*#__PURE__*/_react["default"].createElement(_NodeSizeNumberPicker["default"], {
|
89
90
|
value: parseValue(value.width),
|
90
91
|
label: showLabel ? '宽:' : '',
|
92
|
+
innerAfter: showLabel ? undefined : 'W',
|
91
93
|
min: 1,
|
92
94
|
max: max,
|
93
95
|
step: step,
|
96
|
+
disabled: disabled,
|
94
97
|
placeholder: "\u8BF7\u8F93\u5165",
|
95
98
|
size: size,
|
96
99
|
hasTrigger: hasTrigger,
|
@@ -118,11 +121,12 @@ function SizeInput(props) {
|
|
118
121
|
}
|
119
122
|
}, /*#__PURE__*/_react["default"].createElement(_NodeSizeNumberPicker["default"], {
|
120
123
|
value: parseValue(value.height),
|
121
|
-
label: showLabel ? '高:' : ''
|
122
|
-
,
|
124
|
+
label: showLabel ? '高:' : '',
|
125
|
+
innerAfter: showLabel ? undefined : 'H',
|
123
126
|
min: 1,
|
124
127
|
max: max,
|
125
128
|
step: step,
|
129
|
+
disabled: disabled,
|
126
130
|
placeholder: "\u8BF7\u8F93\u5165",
|
127
131
|
size: size,
|
128
132
|
hasTrigger: hasTrigger,
|
@@ -13,7 +13,7 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
|
|
13
13
|
|
14
14
|
var _react = _interopRequireWildcard(require("react"));
|
15
15
|
|
16
|
-
var _excluded = ["value", "onChange", "min", "onBlur", "onKeyDown"];
|
16
|
+
var _excluded = ["value", "onChange", "min", "onBlur", "onKeyDown", "disabled"];
|
17
17
|
|
18
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); }
|
19
19
|
|
@@ -31,6 +31,7 @@ function NodeSizeNumberPicker(props) {
|
|
31
31
|
min = props.min,
|
32
32
|
onBlur = props.onBlur,
|
33
33
|
onKeyDown = props.onKeyDown,
|
34
|
+
disabled = props.disabled,
|
34
35
|
otherProps = (0, _objectWithoutPropertiesLoose2["default"])(props, _excluded);
|
35
36
|
|
36
37
|
var _useState = (0, _react.useState)(value),
|
@@ -63,13 +64,13 @@ function NodeSizeNumberPicker(props) {
|
|
63
64
|
|
64
65
|
var handleChange = function handleChange(value, e) {
|
65
66
|
// 失去焦点最大最小值
|
66
|
-
if (e.type ===
|
67
|
+
if (e.type === "blur") {
|
67
68
|
onChange(!value ? min : value);
|
68
69
|
return;
|
69
70
|
} // 加减号立即变更
|
70
71
|
|
71
72
|
|
72
|
-
if (e.triggerType ===
|
73
|
+
if (e.triggerType === "up" || e.triggerType === "down") {
|
73
74
|
onChange(value);
|
74
75
|
return;
|
75
76
|
}
|
@@ -80,10 +81,9 @@ function NodeSizeNumberPicker(props) {
|
|
80
81
|
return /*#__PURE__*/_react["default"].createElement(_numberPicker["default"], (0, _extends2["default"])({}, otherProps, {
|
81
82
|
value: inputValue,
|
82
83
|
min: min,
|
84
|
+
disabled: disabled,
|
83
85
|
onChange: handleChange,
|
84
86
|
onBlur: handleBlur,
|
85
87
|
onKeyDown: handleKeyDown
|
86
88
|
}));
|
87
|
-
}
|
88
|
-
|
89
|
-
;
|
89
|
+
}
|
@@ -94,7 +94,7 @@ function BatchSetNodeSize(props) {
|
|
94
94
|
if (lock) {
|
95
95
|
var _setSize;
|
96
96
|
|
97
|
-
setSize((_setSize = {}, _setSize[name] = value, _setSize[name ===
|
97
|
+
setSize((_setSize = {}, _setSize[name] = value, _setSize[name === "width" ? "height" : "width"] = undefined, _setSize));
|
98
98
|
} else {
|
99
99
|
var _extends2;
|
100
100
|
|
@@ -103,11 +103,11 @@ function BatchSetNodeSize(props) {
|
|
103
103
|
|
104
104
|
topo.historyManager.beginTransaction();
|
105
105
|
nodes.forEach(function (node) {
|
106
|
-
if (name ===
|
106
|
+
if (name === "width") {
|
107
107
|
if (lock) {
|
108
108
|
var height = nodesSizeRatioMap.getNodeHeight(node, value);
|
109
109
|
|
110
|
-
_rlog["default"].debug(
|
110
|
+
_rlog["default"].debug("多元素锁定设置宽", node, value, height);
|
111
111
|
|
112
112
|
node.setHeight(height);
|
113
113
|
}
|
@@ -133,12 +133,10 @@ function BatchSetNodeSize(props) {
|
|
133
133
|
nodesSizeRatioMap.reset();
|
134
134
|
};
|
135
135
|
|
136
|
-
return /*#__PURE__*/_react["default"].createElement(_SizeInput["default"], {
|
136
|
+
return /*#__PURE__*/_react["default"].createElement(_SizeInput["default"], (0, _extends3["default"])({}, props, {
|
137
137
|
value: size,
|
138
138
|
lock: lock,
|
139
139
|
onChange: handleChange,
|
140
140
|
onLockChange: onLockChange
|
141
|
-
});
|
142
|
-
}
|
143
|
-
|
144
|
-
;
|
141
|
+
}));
|
142
|
+
}
|
@@ -15,11 +15,13 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
15
15
|
|
16
16
|
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; }
|
17
17
|
|
18
|
+
// 这个似乎不需要了
|
18
19
|
function BatchSetNodeSize(props) {
|
19
|
-
var
|
20
|
+
var value = props.value,
|
21
|
+
size = props.size,
|
22
|
+
disabled = props.disabled;
|
20
23
|
return /*#__PURE__*/_react["default"].createElement(_SizeInput["default"], (0, _extends2["default"])({}, props, {
|
21
|
-
|
24
|
+
disabled: disabled,
|
25
|
+
value: value
|
22
26
|
}));
|
23
|
-
}
|
24
|
-
|
25
|
-
;
|
27
|
+
}
|
@@ -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.
|
55
|
+
var version = typeof "6.0.0-alpha.9" === 'string' ? "6.0.0-alpha.9" : null;
|
56
56
|
console.info("\u62D3\u6251\u7248\u672C: " + version);
|
57
57
|
/**
|
58
58
|
* 拓扑显示和编辑
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@riil-frontend/component-topology",
|
3
|
-
"version": "6.0.0-alpha.
|
3
|
+
"version": "6.0.0-alpha.9",
|
4
4
|
"description": "拓扑",
|
5
5
|
"scripts": {
|
6
6
|
"start": "build-scripts start",
|
@@ -115,6 +115,6 @@
|
|
115
115
|
"access": "public"
|
116
116
|
},
|
117
117
|
"license": "MIT",
|
118
|
-
"homepage": "https://unpkg.com/@riil-frontend/component-topology@6.0.0-alpha.
|
118
|
+
"homepage": "https://unpkg.com/@riil-frontend/component-topology@6.0.0-alpha.9/build/index.html",
|
119
119
|
"gitHead": "2da19ffccbb7ca60a8acf396e39f542c68bb33f5"
|
120
120
|
}
|