@riil-frontend/component-topology 8.0.0-a.4 → 8.0.0-a.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.
- package/build/index.css +1 -1
- package/build/index.js +12 -12
- package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/EdgeType.js +14 -8
- package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.js +7 -2
- package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.module.scss +4 -0
- package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/index.js +1 -1
- package/es/core/models/TopoApp.js +1 -1
- package/es/core/viewer/components/titlebar/widgets/SearchWidget.js +4 -0
- package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/EdgeType.js +15 -8
- package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.js +8 -2
- package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.module.scss +4 -0
- package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/index.js +1 -1
- package/lib/core/models/TopoApp.js +1 -1
- package/lib/core/viewer/components/titlebar/widgets/SearchWidget.js +4 -0
- package/package.json +2 -2
@@ -2,6 +2,7 @@ import _Field from "@alifd/next/es/field";
|
|
2
2
|
import _Select from "@alifd/next/es/select";
|
3
3
|
import _Form from "@alifd/next/es/form";
|
4
4
|
import React, { useEffect } from 'react';
|
5
|
+
import { getEdgesBySelection, loopEdgesAndChildren } from "../../../../utils/edgeTypeStyleUtil";
|
5
6
|
import styles from "./EdgeType.module.scss";
|
6
7
|
import LineType from "./LineType";
|
7
8
|
var FormItem = _Form.Item;
|
@@ -60,7 +61,7 @@ var LINE_MOLD_OPTIONS = [{
|
|
60
61
|
icon: 'topo_lineMold_dotted_two'
|
61
62
|
}];
|
62
63
|
|
63
|
-
function getValuesByEdges(
|
64
|
+
function getValuesByEdges(topo) {
|
64
65
|
function getStartPoint(edge) {
|
65
66
|
var icons = edge.s('icons') || {};
|
66
67
|
return ['sourceArrow', 'sourceSolidCircle', 'sourceNoneCircle'].filter(function (name) {
|
@@ -75,14 +76,18 @@ function getValuesByEdges(edges) {
|
|
75
76
|
})[0] || 'nil';
|
76
77
|
}
|
77
78
|
|
78
|
-
var
|
79
|
-
|
79
|
+
var selectionEdges = getEdgesBySelection(topo);
|
80
|
+
var edgeValues = [];
|
81
|
+
loopEdgesAndChildren(topo, selectionEdges, function (edge) {
|
82
|
+
edgeValues.push({
|
83
|
+
lineButton: edge.s('edge.type'),
|
80
84
|
startPoint: getStartPoint(edge),
|
81
85
|
endPoint: getEndPoint(edge),
|
82
86
|
lineMold: edge.a('lineMode') || 'solidLine'
|
83
|
-
};
|
87
|
+
});
|
84
88
|
});
|
85
89
|
var values = {
|
90
|
+
lineButton: undefined,
|
86
91
|
startPoint: undefined,
|
87
92
|
endPoint: undefined,
|
88
93
|
lineMold: undefined
|
@@ -103,12 +108,13 @@ function getValuesByEdges(edges) {
|
|
103
108
|
}
|
104
109
|
|
105
110
|
function EdgeType(props) {
|
106
|
-
var
|
111
|
+
var topo = props.topo,
|
112
|
+
selection = props.selection,
|
107
113
|
_onChange = props.onChange;
|
108
114
|
|
109
115
|
var field = _Field.useField({
|
110
116
|
autoUnmount: false,
|
111
|
-
values: getValuesByEdges(
|
117
|
+
values: getValuesByEdges(topo),
|
112
118
|
onChange: function onChange(name, value) {
|
113
119
|
if (['startPoint', 'endPoint'].includes(name) && value === 'nil') {
|
114
120
|
_onChange(name, null);
|
@@ -119,8 +125,8 @@ function EdgeType(props) {
|
|
119
125
|
});
|
120
126
|
|
121
127
|
useEffect(function () {
|
122
|
-
field.setValues(getValuesByEdges(
|
123
|
-
}, [
|
128
|
+
field.setValues(getValuesByEdges(topo));
|
129
|
+
}, [selection]);
|
124
130
|
return /*#__PURE__*/React.createElement("div", {
|
125
131
|
className: styles.lineBox
|
126
132
|
}, /*#__PURE__*/React.createElement(_Form, {
|
@@ -1,6 +1,7 @@
|
|
1
1
|
import _Button from "@alifd/next/es/button";
|
2
2
|
import _Balloon from "@alifd/next/es/balloon";
|
3
3
|
import React, { useState } from 'react';
|
4
|
+
import classNames from 'classnames';
|
4
5
|
import styles from "./LineType.module.scss";
|
5
6
|
var Tooltip = _Balloon.Tooltip;
|
6
7
|
var LINE_TYPE_OPTIONS = [{
|
@@ -25,11 +26,14 @@ var LINE_TYPE_OPTIONS = [{
|
|
25
26
|
icon: 'topo_linear_icon_arcline'
|
26
27
|
}];
|
27
28
|
var LineType = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
28
|
-
var
|
29
|
+
var value = props.value,
|
30
|
+
onChange = props.onChange;
|
29
31
|
|
30
32
|
function lineButton(item) {
|
33
|
+
var _classNames;
|
34
|
+
|
31
35
|
return /*#__PURE__*/React.createElement(_Button, {
|
32
|
-
className:
|
36
|
+
className: classNames(styles.redioBtn, (_classNames = {}, _classNames[styles.selected] = value === item.value, _classNames)),
|
33
37
|
onClick: function onClick() {
|
34
38
|
onChange(item.value);
|
35
39
|
}
|
@@ -50,4 +54,5 @@ var LineType = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
50
54
|
}, item.label);
|
51
55
|
}));
|
52
56
|
});
|
57
|
+
LineType.displayName = 'LineType';
|
53
58
|
export default LineType;
|
@@ -109,7 +109,7 @@ function EdgeTypeButton(props) {
|
|
109
109
|
disabled: disabled,
|
110
110
|
trigger: icon
|
111
111
|
}, !disabled && /*#__PURE__*/React.createElement(EdgeType, {
|
112
|
-
|
112
|
+
topo: topo,
|
113
113
|
selection: selection,
|
114
114
|
onChange: handleChange
|
115
115
|
})));
|
@@ -23,7 +23,7 @@ import topoFactory from "./topoFactory";
|
|
23
23
|
import ElementTagTipConfig from "./tagstips/ElementTagTipConfig";
|
24
24
|
import SelectionModel from "./SelectionModel"; // eslint-disable-next-line no-undef
|
25
25
|
|
26
|
-
var version = typeof "8.0.0-a.
|
26
|
+
var version = typeof "8.0.0-a.6" === 'string' ? "8.0.0-a.6" : null;
|
27
27
|
console.info("\u62D3\u6251\u7248\u672C: " + version);
|
28
28
|
/**
|
29
29
|
* 拓扑显示和编辑
|
@@ -13,6 +13,8 @@ var _form = _interopRequireDefault(require("@alifd/next/lib/form"));
|
|
13
13
|
|
14
14
|
var _react = _interopRequireWildcard(require("react"));
|
15
15
|
|
16
|
+
var _edgeTypeStyleUtil = require("../../../../utils/edgeTypeStyleUtil");
|
17
|
+
|
16
18
|
var _EdgeTypeModule = _interopRequireDefault(require("./EdgeType.module.scss"));
|
17
19
|
|
18
20
|
var _LineType = _interopRequireDefault(require("./LineType"));
|
@@ -77,7 +79,7 @@ var LINE_MOLD_OPTIONS = [{
|
|
77
79
|
icon: 'topo_lineMold_dotted_two'
|
78
80
|
}];
|
79
81
|
|
80
|
-
function getValuesByEdges(
|
82
|
+
function getValuesByEdges(topo) {
|
81
83
|
function getStartPoint(edge) {
|
82
84
|
var icons = edge.s('icons') || {};
|
83
85
|
return ['sourceArrow', 'sourceSolidCircle', 'sourceNoneCircle'].filter(function (name) {
|
@@ -92,14 +94,18 @@ function getValuesByEdges(edges) {
|
|
92
94
|
})[0] || 'nil';
|
93
95
|
}
|
94
96
|
|
95
|
-
var
|
96
|
-
|
97
|
+
var selectionEdges = (0, _edgeTypeStyleUtil.getEdgesBySelection)(topo);
|
98
|
+
var edgeValues = [];
|
99
|
+
(0, _edgeTypeStyleUtil.loopEdgesAndChildren)(topo, selectionEdges, function (edge) {
|
100
|
+
edgeValues.push({
|
101
|
+
lineButton: edge.s('edge.type'),
|
97
102
|
startPoint: getStartPoint(edge),
|
98
103
|
endPoint: getEndPoint(edge),
|
99
104
|
lineMold: edge.a('lineMode') || 'solidLine'
|
100
|
-
};
|
105
|
+
});
|
101
106
|
});
|
102
107
|
var values = {
|
108
|
+
lineButton: undefined,
|
103
109
|
startPoint: undefined,
|
104
110
|
endPoint: undefined,
|
105
111
|
lineMold: undefined
|
@@ -120,12 +126,13 @@ function getValuesByEdges(edges) {
|
|
120
126
|
}
|
121
127
|
|
122
128
|
function EdgeType(props) {
|
123
|
-
var
|
129
|
+
var topo = props.topo,
|
130
|
+
selection = props.selection,
|
124
131
|
_onChange = props.onChange;
|
125
132
|
|
126
133
|
var field = _field["default"].useField({
|
127
134
|
autoUnmount: false,
|
128
|
-
values: getValuesByEdges(
|
135
|
+
values: getValuesByEdges(topo),
|
129
136
|
onChange: function onChange(name, value) {
|
130
137
|
if (['startPoint', 'endPoint'].includes(name) && value === 'nil') {
|
131
138
|
_onChange(name, null);
|
@@ -136,8 +143,8 @@ function EdgeType(props) {
|
|
136
143
|
});
|
137
144
|
|
138
145
|
(0, _react.useEffect)(function () {
|
139
|
-
field.setValues(getValuesByEdges(
|
140
|
-
}, [
|
146
|
+
field.setValues(getValuesByEdges(topo));
|
147
|
+
}, [selection]);
|
141
148
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
142
149
|
className: _EdgeTypeModule["default"].lineBox
|
143
150
|
}, /*#__PURE__*/_react["default"].createElement(_form["default"], {
|
@@ -11,6 +11,8 @@ var _balloon = _interopRequireDefault(require("@alifd/next/lib/balloon"));
|
|
11
11
|
|
12
12
|
var _react = _interopRequireWildcard(require("react"));
|
13
13
|
|
14
|
+
var _classnames = _interopRequireDefault(require("classnames"));
|
15
|
+
|
14
16
|
var _LineTypeModule = _interopRequireDefault(require("./LineType.module.scss"));
|
15
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); }
|
@@ -41,11 +43,14 @@ var LINE_TYPE_OPTIONS = [{
|
|
41
43
|
}];
|
42
44
|
|
43
45
|
var LineType = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
|
44
|
-
var
|
46
|
+
var value = props.value,
|
47
|
+
onChange = props.onChange;
|
45
48
|
|
46
49
|
function lineButton(item) {
|
50
|
+
var _classNames;
|
51
|
+
|
47
52
|
return /*#__PURE__*/_react["default"].createElement(_button["default"], {
|
48
|
-
className: ""
|
53
|
+
className: (0, _classnames["default"])(_LineTypeModule["default"].redioBtn, (_classNames = {}, _classNames[_LineTypeModule["default"].selected] = value === item.value, _classNames)),
|
49
54
|
onClick: function onClick() {
|
50
55
|
onChange(item.value);
|
51
56
|
}
|
@@ -67,5 +72,6 @@ var LineType = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
|
|
67
72
|
}));
|
68
73
|
});
|
69
74
|
|
75
|
+
LineType.displayName = 'LineType';
|
70
76
|
var _default = LineType;
|
71
77
|
exports["default"] = _default;
|
@@ -128,7 +128,7 @@ function EdgeTypeButton(props) {
|
|
128
128
|
disabled: disabled,
|
129
129
|
trigger: icon
|
130
130
|
}, !disabled && /*#__PURE__*/_react["default"].createElement(_EdgeType["default"], {
|
131
|
-
|
131
|
+
topo: topo,
|
132
132
|
selection: selection,
|
133
133
|
onChange: handleChange
|
134
134
|
})));
|
@@ -54,7 +54,7 @@ var _ElementTagTipConfig = _interopRequireDefault(require("./tagstips/ElementTag
|
|
54
54
|
var _SelectionModel = _interopRequireDefault(require("./SelectionModel"));
|
55
55
|
|
56
56
|
// eslint-disable-next-line no-undef
|
57
|
-
var version = typeof "8.0.0-a.
|
57
|
+
var version = typeof "8.0.0-a.6" === 'string' ? "8.0.0-a.6" : null;
|
58
58
|
console.info("\u62D3\u6251\u7248\u672C: " + version);
|
59
59
|
/**
|
60
60
|
* 拓扑显示和编辑
|
@@ -65,6 +65,10 @@ function SearchWidget(props) {
|
|
65
65
|
|
66
66
|
var onChange = function onChange(value) {
|
67
67
|
setSearchValue(value);
|
68
|
+
|
69
|
+
if (!value) {
|
70
|
+
topo.searchElements(searchType, value);
|
71
|
+
}
|
68
72
|
};
|
69
73
|
|
70
74
|
return /*#__PURE__*/_react["default"].createElement(_search["default"], {
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@riil-frontend/component-topology",
|
3
|
-
"version": "8.0.0-a.
|
3
|
+
"version": "8.0.0-a.6",
|
4
4
|
"description": "拓扑",
|
5
5
|
"scripts": {
|
6
6
|
"start": "build-scripts start",
|
@@ -116,6 +116,6 @@
|
|
116
116
|
"access": "public"
|
117
117
|
},
|
118
118
|
"license": "MIT",
|
119
|
-
"homepage": "https://unpkg.com/@riil-frontend/component-topology@8.0.0-a.
|
119
|
+
"homepage": "https://unpkg.com/@riil-frontend/component-topology@8.0.0-a.6/build/index.html",
|
120
120
|
"gitHead": "2da19ffccbb7ca60a8acf396e39f542c68bb33f5"
|
121
121
|
}
|