@riil-frontend/component-topology 6.0.0-alpha.32 → 6.0.0-alpha.34
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 +1 -1
- package/build/index.css +1 -1
- package/build/index.js +12 -12
- package/es/core/editor/components/Toolbar/widgets/FontColorButton.js +0 -4
- package/es/core/editor/components/Toolbar/widgets/FontFamilyWidget.js +5 -1
- package/es/core/editor/components/Toolbar/widgets/FontSizeWidget.js +5 -1
- package/es/core/editor/components/Toolbar/widgets/FontStyleButton.js +5 -1
- package/es/core/editor/components/Toolbar/widgets/components/ButtonBox.js +1 -1
- package/es/core/editor/components/Toolbar/widgets/components/ButtonBox.module.scss +3 -0
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/ElementTextStyleSetting.js +3 -2
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/textStyleUtil.js +25 -2
- package/es/core/editor/components/Toolbar/widgets/components/textStyleSetting/textStyleSettingRouter.js +4 -1
- package/es/core/models/TopoApp.js +1 -1
- package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/hooks/useMetricPolling.js +3 -4
- package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/services/index.js +19 -5
- package/lib/core/editor/components/Toolbar/widgets/FontColorButton.js +0 -5
- package/lib/core/editor/components/Toolbar/widgets/FontFamilyWidget.js +5 -1
- package/lib/core/editor/components/Toolbar/widgets/FontSizeWidget.js +5 -1
- package/lib/core/editor/components/Toolbar/widgets/FontStyleButton.js +5 -1
- package/lib/core/editor/components/Toolbar/widgets/components/ButtonBox.js +1 -1
- package/lib/core/editor/components/Toolbar/widgets/components/ButtonBox.module.scss +3 -0
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/ElementTextStyleSetting.js +3 -2
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/ElementTextStyleSetting/textStyleUtil.js +25 -2
- package/lib/core/editor/components/Toolbar/widgets/components/textStyleSetting/textStyleSettingRouter.js +4 -1
- package/lib/core/models/TopoApp.js +1 -1
- package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/hooks/useMetricPolling.js +3 -4
- package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/services/index.js +19 -5
- package/package.json +2 -2
- package/es/core/editor/components/Toolbar/hooks/textStyleSetting/EmptySetting.js +0 -8
- package/es/core/editor/components/Toolbar/hooks/textStyleSetting/edgeTagSetting.js +0 -8
- package/es/core/editor/components/Toolbar/hooks/textStyleSetting/globalTag.js +0 -36
- package/es/core/editor/components/Toolbar/hooks/textStyleSetting/nodeTagSetting.js +0 -8
- package/es/core/editor/components/Toolbar/hooks/textStyleSetting/text.js +0 -8
- package/es/core/editor/components/Toolbar/hooks/useFontStyleSetting.js +0 -75
- package/lib/core/editor/components/Toolbar/hooks/textStyleSetting/EmptySetting.js +0 -13
- package/lib/core/editor/components/Toolbar/hooks/textStyleSetting/edgeTagSetting.js +0 -13
- package/lib/core/editor/components/Toolbar/hooks/textStyleSetting/globalTag.js +0 -47
- package/lib/core/editor/components/Toolbar/hooks/textStyleSetting/nodeTagSetting.js +0 -13
- package/lib/core/editor/components/Toolbar/hooks/textStyleSetting/text.js +0 -13
- package/lib/core/editor/components/Toolbar/hooks/useFontStyleSetting.js +0 -90
@@ -5,7 +5,6 @@ import WidgetBox from "./WidgetBox";
|
|
5
5
|
import ColorPanel from "../../../../../components/ColorPanel";
|
6
6
|
import FontColorRange from "../../../../../components/ColorPanel/components/FontColorRange";
|
7
7
|
import styles from "./FontColorButton.module.scss";
|
8
|
-
import useFontStyleSetting from "../hooks/useFontStyleSetting";
|
9
8
|
|
10
9
|
function FontFamilySelect(props) {
|
11
10
|
var value = props.value,
|
@@ -16,9 +15,6 @@ function FontFamilySelect(props) {
|
|
16
15
|
disabled = _useState[0],
|
17
16
|
setDisabled = _useState[1];
|
18
17
|
|
19
|
-
var fontStyleSetting = useFontStyleSetting({
|
20
|
-
topo: topo
|
21
|
-
});
|
22
18
|
console.log(topo, 'topo这里需要处理颜色改变的事情');
|
23
19
|
|
24
20
|
var backOpacityChange = function backOpacityChange(value) {
|
@@ -40,11 +40,15 @@ function FontFamilyWidget(props) {
|
|
40
40
|
}, /*#__PURE__*/React.createElement(FontFamilySelect, {
|
41
41
|
value: style.fontFamily,
|
42
42
|
onChange: function onChange(val) {
|
43
|
+
topo.historyManager.beginTransaction();
|
43
44
|
setStyle({
|
44
45
|
fontFamily: val
|
45
46
|
});
|
47
|
+
topo.historyManager.endTransaction();
|
46
48
|
}
|
47
49
|
}));
|
48
50
|
}
|
49
51
|
|
50
|
-
export default textStyleSettingRouter(FontFamilyWidget
|
52
|
+
export default textStyleSettingRouter(FontFamilyWidget, {
|
53
|
+
names: ['fontFamily']
|
54
|
+
});
|
@@ -37,11 +37,15 @@ function FontSizeWidget(props) {
|
|
37
37
|
}, /*#__PURE__*/React.createElement(FontSizeSelect, {
|
38
38
|
value: style.fontSize,
|
39
39
|
onChange: function onChange(val) {
|
40
|
+
topo.historyManager.beginTransaction();
|
40
41
|
setStyle({
|
41
42
|
fontSize: val
|
42
43
|
});
|
44
|
+
topo.historyManager.endTransaction();
|
43
45
|
}
|
44
46
|
}));
|
45
47
|
}
|
46
48
|
|
47
|
-
export default textStyleSettingRouter(FontSizeWidget
|
49
|
+
export default textStyleSettingRouter(FontSizeWidget, {
|
50
|
+
names: ['fontSize']
|
51
|
+
});
|
@@ -73,7 +73,9 @@ function FontStyleButton(props) {
|
|
73
73
|
*/
|
74
74
|
|
75
75
|
var handleChange = function handleChange(selectedKeys) {
|
76
|
+
topo.historyManager.beginTransaction();
|
76
77
|
setStyle(formatStyle(selectedKeys));
|
78
|
+
topo.historyManager.endTransaction();
|
77
79
|
};
|
78
80
|
|
79
81
|
return /*#__PURE__*/React.createElement(WidgetBox, {
|
@@ -105,4 +107,6 @@ function FontStyleButton(props) {
|
|
105
107
|
})));
|
106
108
|
}
|
107
109
|
|
108
|
-
export default textStyleSettingRouter(FontStyleButton
|
110
|
+
export default textStyleSettingRouter(FontStyleButton, {
|
111
|
+
names: ['bold', 'italic', 'underline']
|
112
|
+
});
|
@@ -23,7 +23,7 @@ function ButtonBox(props) {
|
|
23
23
|
}, otherProps), children, showArrow && /*#__PURE__*/React.createElement(React.Fragment, null, "\xA0", /*#__PURE__*/React.createElement(_Icon, {
|
24
24
|
type: "tree_fold_arrow",
|
25
25
|
size: "xxs",
|
26
|
-
className: classNames(styles.icon, (_classNames2 = {}, _classNames2[styles.active] = active, _classNames2))
|
26
|
+
className: classNames(styles.icon, (_classNames2 = {}, _classNames2[styles.active] = active, _classNames2[styles.disabled] = disabled, _classNames2))
|
27
27
|
})));
|
28
28
|
}
|
29
29
|
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
2
2
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
3
|
-
var _excluded = ["Component"];
|
3
|
+
var _excluded = ["Component", "styleNames"];
|
4
4
|
import React, { useMemo, useState } from 'react';
|
5
5
|
import { getTextStyle, setTextStyle } from "./textStyleUtil";
|
6
6
|
|
@@ -8,6 +8,7 @@ function ElementTextStyleSetting(props) {
|
|
8
8
|
var topo = props.topo;
|
9
9
|
|
10
10
|
var Component = props.Component,
|
11
|
+
styleNames = props.styleNames,
|
11
12
|
widgetProps = _objectWithoutPropertiesLoose(props, _excluded); // 选中的元素
|
12
13
|
|
13
14
|
|
@@ -20,7 +21,7 @@ function ElementTextStyleSetting(props) {
|
|
20
21
|
return topo.getHtTopo().getGraphView().getSelectionModel().getSelection().toArray();
|
21
22
|
}, [selection, topo]);
|
22
23
|
var value = useMemo(function () {
|
23
|
-
return getTextStyle(htSelection) || {};
|
24
|
+
return getTextStyle(htSelection, styleNames) || {};
|
24
25
|
}, [htSelection, topo]);
|
25
26
|
var setStyle = useMemo(function () {
|
26
27
|
return function (style) {
|
@@ -27,12 +27,35 @@ export function getElementTextStyle(element) {
|
|
27
27
|
|
28
28
|
return null;
|
29
29
|
}
|
30
|
-
export function getTextStyle(htSelection) {
|
30
|
+
export function getTextStyle(htSelection, styleNames) {
|
31
31
|
if (htSelection.length === 1) {
|
32
32
|
var element = htSelection[0];
|
33
33
|
return getElementTextStyle(element);
|
34
|
-
}
|
34
|
+
} else if (htSelection.length) {
|
35
|
+
// 多选时值相同返回?
|
36
|
+
var values = htSelection.map(function (element) {
|
37
|
+
return getElementTextStyle(element);
|
38
|
+
}).filter(function (item) {
|
39
|
+
return !!item;
|
40
|
+
});
|
35
41
|
|
42
|
+
if (!values.length) {
|
43
|
+
return null;
|
44
|
+
}
|
45
|
+
|
46
|
+
var value = {};
|
47
|
+
styleNames.forEach(function (styleName) {
|
48
|
+
var val = values[0][styleName];
|
49
|
+
var different = values.filter(function (obj) {
|
50
|
+
return obj[styleName] !== val;
|
51
|
+
});
|
52
|
+
|
53
|
+
if (!different.length) {
|
54
|
+
value[styleName] = val;
|
55
|
+
}
|
56
|
+
});
|
57
|
+
return Object.keys(value).length ? value : null;
|
58
|
+
}
|
36
59
|
|
37
60
|
return null;
|
38
61
|
}
|
@@ -4,13 +4,16 @@ import ElementTextStyleSetting from "./ElementTextStyleSetting/ElementTextStyleS
|
|
4
4
|
import GlobalTagStyleSetting from "./GlobalTagStyleSetting/GlobalTagStyleSetting";
|
5
5
|
|
6
6
|
function textStyleSettingRouter(Component, options) {
|
7
|
+
var names = (options === null || options === void 0 ? void 0 : options.names) || [];
|
7
8
|
return function TextStyleSettingButton(props) {
|
8
9
|
var topo = props.topo;
|
9
10
|
var selection = topo.selectionManager.useHtSelection();
|
10
11
|
var Widget = !selection.length ? GlobalTagStyleSetting : ElementTextStyleSetting;
|
11
12
|
return /*#__PURE__*/React.createElement(Widget, _extends({
|
12
13
|
Component: Component
|
13
|
-
}, props
|
14
|
+
}, props, {
|
15
|
+
styleNames: names
|
16
|
+
}));
|
14
17
|
};
|
15
18
|
}
|
16
19
|
|
@@ -22,7 +22,7 @@ import topoFactory from "./topoFactory";
|
|
22
22
|
import ElementTagTipConfig from "./tagstips/ElementTagTipConfig";
|
23
23
|
import SelectionManager from "./SelectionManager"; // eslint-disable-next-line no-undef
|
24
24
|
|
25
|
-
var version = typeof "6.0.0-alpha.
|
25
|
+
var version = typeof "6.0.0-alpha.34" === 'string' ? "6.0.0-alpha.34" : null;
|
26
26
|
console.info("\u62D3\u6251\u7248\u672C: " + version);
|
27
27
|
/**
|
28
28
|
* 拓扑显示和编辑
|
@@ -13,7 +13,8 @@ export default function useMetricPolling(_ref) {
|
|
13
13
|
sourceMetrics: null,
|
14
14
|
destinationMetrics: null,
|
15
15
|
// 链路指标列表
|
16
|
-
linkMetrics: []
|
16
|
+
linkMetrics: [],
|
17
|
+
linkMetricsTs: null
|
17
18
|
}),
|
18
19
|
data = _useState[0],
|
19
20
|
setData = _useState[1]; // 轮询hooks
|
@@ -25,9 +26,7 @@ export default function useMetricPolling(_ref) {
|
|
25
26
|
debounceInterval: 200,
|
26
27
|
manual: true,
|
27
28
|
onSuccess: function onSuccess(result) {
|
28
|
-
setData(_extends({}, data,
|
29
|
-
linkMetrics: result
|
30
|
-
}));
|
29
|
+
setData(_extends({}, data, result));
|
31
30
|
rlog.info('链路拓扑指标轮询', result);
|
32
31
|
}
|
33
32
|
});
|
@@ -68,6 +68,8 @@ export function queryLinkLatestMetrics(_x3, _x4) {
|
|
68
68
|
|
69
69
|
function _queryLinkLatestMetrics() {
|
70
70
|
_queryLinkLatestMetrics = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(linkCi, linkMetricCodes) {
|
71
|
+
var _linkMetrics$;
|
72
|
+
|
71
73
|
var linkMetrics, resultData;
|
72
74
|
return _regeneratorRuntime.wrap(function _callee3$(_context3) {
|
73
75
|
while (1) {
|
@@ -91,6 +93,10 @@ function _queryLinkLatestMetrics() {
|
|
91
93
|
|
92
94
|
case 5:
|
93
95
|
linkMetrics = _context3.sent;
|
96
|
+
_context3.next = 8;
|
97
|
+
return ciTypeCache.load([linkCi.ciType || linkCi.typeCode]);
|
98
|
+
|
99
|
+
case 8:
|
94
100
|
// format
|
95
101
|
resultData = linkMetricCodes.map(function (code) {
|
96
102
|
var _linkMetrics$find;
|
@@ -98,16 +104,19 @@ function _queryLinkLatestMetrics() {
|
|
98
104
|
var value = (_linkMetrics$find = linkMetrics.find(function (m) {
|
99
105
|
return m.metricCode === code;
|
100
106
|
})) === null || _linkMetrics$find === void 0 ? void 0 : _linkMetrics$find.metricValue;
|
101
|
-
var metricDef = ciTypeCache.getMetric(linkCi.ciType, code);
|
107
|
+
var metricDef = ciTypeCache.getMetric(linkCi.ciType || linkCi.typeCode, code);
|
102
108
|
return {
|
103
109
|
code: code,
|
104
110
|
name: metricDef.name,
|
105
111
|
value: formatMetric(value, metricDef) || ''
|
106
112
|
};
|
107
113
|
});
|
108
|
-
return _context3.abrupt("return",
|
114
|
+
return _context3.abrupt("return", {
|
115
|
+
linkMetrics: resultData,
|
116
|
+
linkMetricsTs: (_linkMetrics$ = linkMetrics[0]) === null || _linkMetrics$ === void 0 ? void 0 : _linkMetrics$.ts
|
117
|
+
});
|
109
118
|
|
110
|
-
case
|
119
|
+
case 10:
|
111
120
|
case "end":
|
112
121
|
return _context3.stop();
|
113
122
|
}
|
@@ -130,6 +139,8 @@ function _queryLinkInterfacesLatestMetrics() {
|
|
130
139
|
switch (_context4.prev = _context4.next) {
|
131
140
|
case 0:
|
132
141
|
parseInterfaceMetrics = function _parseInterfaceMetric(subCiId) {
|
142
|
+
var _metrics$;
|
143
|
+
|
133
144
|
var metrics = interfaceMetrics.filter(function (metric) {
|
134
145
|
return metric.subCiId === subCiId;
|
135
146
|
});
|
@@ -139,11 +150,14 @@ function _queryLinkInterfacesLatestMetrics() {
|
|
139
150
|
var value = (_metrics$find = metrics.find(function (m) {
|
140
151
|
return m.metricCode === code;
|
141
152
|
})) === null || _metrics$find === void 0 ? void 0 : _metrics$find.metricValue;
|
142
|
-
var metricDef = ciTypeCache.getMetric(linkCi.ciType, code);
|
153
|
+
var metricDef = ciTypeCache.getMetric(linkCi.ciType || linkCi.typeCode, code);
|
143
154
|
var formatValue = formatMetric(value, metricDef);
|
144
155
|
res[code] = formatValue === 'undefined' ? '-' : formatValue;
|
145
156
|
return res;
|
146
|
-
}, {
|
157
|
+
}, {
|
158
|
+
_ts: (_metrics$ = metrics[0]) === null || _metrics$ === void 0 ? void 0 : _metrics$.ts // 指标时间
|
159
|
+
|
160
|
+
});
|
147
161
|
};
|
148
162
|
|
149
163
|
_linkCi$attributes = linkCi.attributes, sourceType = _linkCi$attributes.source_type, sourceId = _linkCi$attributes.source_id, destinationId = _linkCi$attributes.destination_id, destinationType = _linkCi$attributes.destination_type;
|
@@ -17,8 +17,6 @@ var _FontColorRange = _interopRequireDefault(require("../../../../../components/
|
|
17
17
|
|
18
18
|
var _FontColorButtonModule = _interopRequireDefault(require("./FontColorButton.module.scss"));
|
19
19
|
|
20
|
-
var _useFontStyleSetting = _interopRequireDefault(require("../hooks/useFontStyleSetting"));
|
21
|
-
|
22
20
|
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); }
|
23
21
|
|
24
22
|
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; }
|
@@ -33,9 +31,6 @@ function FontFamilySelect(props) {
|
|
33
31
|
disabled = _useState[0],
|
34
32
|
setDisabled = _useState[1];
|
35
33
|
|
36
|
-
var fontStyleSetting = (0, _useFontStyleSetting["default"])({
|
37
|
-
topo: topo
|
38
|
-
});
|
39
34
|
console.log(topo, 'topo这里需要处理颜色改变的事情');
|
40
35
|
|
41
36
|
var backOpacityChange = function backOpacityChange(value) {
|
@@ -54,13 +54,17 @@ function FontFamilyWidget(props) {
|
|
54
54
|
}, /*#__PURE__*/_react["default"].createElement(FontFamilySelect, {
|
55
55
|
value: style.fontFamily,
|
56
56
|
onChange: function onChange(val) {
|
57
|
+
topo.historyManager.beginTransaction();
|
57
58
|
setStyle({
|
58
59
|
fontFamily: val
|
59
60
|
});
|
61
|
+
topo.historyManager.endTransaction();
|
60
62
|
}
|
61
63
|
}));
|
62
64
|
}
|
63
65
|
|
64
|
-
var _default = (0, _textStyleSettingRouter["default"])(FontFamilyWidget
|
66
|
+
var _default = (0, _textStyleSettingRouter["default"])(FontFamilyWidget, {
|
67
|
+
names: ['fontFamily']
|
68
|
+
});
|
65
69
|
|
66
70
|
exports["default"] = _default;
|
@@ -51,13 +51,17 @@ function FontSizeWidget(props) {
|
|
51
51
|
}, /*#__PURE__*/_react["default"].createElement(FontSizeSelect, {
|
52
52
|
value: style.fontSize,
|
53
53
|
onChange: function onChange(val) {
|
54
|
+
topo.historyManager.beginTransaction();
|
54
55
|
setStyle({
|
55
56
|
fontSize: val
|
56
57
|
});
|
58
|
+
topo.historyManager.endTransaction();
|
57
59
|
}
|
58
60
|
}));
|
59
61
|
}
|
60
62
|
|
61
|
-
var _default = (0, _textStyleSettingRouter["default"])(FontSizeWidget
|
63
|
+
var _default = (0, _textStyleSettingRouter["default"])(FontSizeWidget, {
|
64
|
+
names: ['fontSize']
|
65
|
+
});
|
62
66
|
|
63
67
|
exports["default"] = _default;
|
@@ -89,7 +89,9 @@ function FontStyleButton(props) {
|
|
89
89
|
*/
|
90
90
|
|
91
91
|
var handleChange = function handleChange(selectedKeys) {
|
92
|
+
topo.historyManager.beginTransaction();
|
92
93
|
setStyle(formatStyle(selectedKeys));
|
94
|
+
topo.historyManager.endTransaction();
|
93
95
|
};
|
94
96
|
|
95
97
|
return /*#__PURE__*/_react["default"].createElement(_WidgetBox["default"], {
|
@@ -121,6 +123,8 @@ function FontStyleButton(props) {
|
|
121
123
|
})));
|
122
124
|
}
|
123
125
|
|
124
|
-
var _default = (0, _textStyleSettingRouter["default"])(FontStyleButton
|
126
|
+
var _default = (0, _textStyleSettingRouter["default"])(FontStyleButton, {
|
127
|
+
names: ['bold', 'italic', 'underline']
|
128
|
+
});
|
125
129
|
|
126
130
|
exports["default"] = _default;
|
@@ -36,7 +36,7 @@ function ButtonBox(props) {
|
|
36
36
|
}, otherProps), children, showArrow && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, "\xA0", /*#__PURE__*/_react["default"].createElement(_icon["default"], {
|
37
37
|
type: "tree_fold_arrow",
|
38
38
|
size: "xxs",
|
39
|
-
className: (0, _classnames["default"])(_ButtonBoxModule["default"].icon, (_classNames2 = {}, _classNames2[_ButtonBoxModule["default"].active] = active, _classNames2))
|
39
|
+
className: (0, _classnames["default"])(_ButtonBoxModule["default"].icon, (_classNames2 = {}, _classNames2[_ButtonBoxModule["default"].active] = active, _classNames2[_ButtonBoxModule["default"].disabled] = disabled, _classNames2))
|
40
40
|
})));
|
41
41
|
}
|
42
42
|
|
@@ -13,7 +13,7 @@ var _react = _interopRequireWildcard(require("react"));
|
|
13
13
|
|
14
14
|
var _textStyleUtil = require("./textStyleUtil");
|
15
15
|
|
16
|
-
var _excluded = ["Component"];
|
16
|
+
var _excluded = ["Component", "styleNames"];
|
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
|
|
@@ -22,6 +22,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
22
22
|
function ElementTextStyleSetting(props) {
|
23
23
|
var topo = props.topo;
|
24
24
|
var Component = props.Component,
|
25
|
+
styleNames = props.styleNames,
|
25
26
|
widgetProps = (0, _objectWithoutPropertiesLoose2["default"])(props, _excluded); // 选中的元素
|
26
27
|
|
27
28
|
var selection = topo.selectionManager.useSelection();
|
@@ -33,7 +34,7 @@ function ElementTextStyleSetting(props) {
|
|
33
34
|
return topo.getHtTopo().getGraphView().getSelectionModel().getSelection().toArray();
|
34
35
|
}, [selection, topo]);
|
35
36
|
var value = (0, _react.useMemo)(function () {
|
36
|
-
return (0, _textStyleUtil.getTextStyle)(htSelection) || {};
|
37
|
+
return (0, _textStyleUtil.getTextStyle)(htSelection, styleNames) || {};
|
37
38
|
}, [htSelection, topo]);
|
38
39
|
var setStyle = (0, _react.useMemo)(function () {
|
39
40
|
return function (style) {
|
@@ -38,12 +38,35 @@ function getElementTextStyle(element) {
|
|
38
38
|
return null;
|
39
39
|
}
|
40
40
|
|
41
|
-
function getTextStyle(htSelection) {
|
41
|
+
function getTextStyle(htSelection, styleNames) {
|
42
42
|
if (htSelection.length === 1) {
|
43
43
|
var element = htSelection[0];
|
44
44
|
return getElementTextStyle(element);
|
45
|
-
}
|
45
|
+
} else if (htSelection.length) {
|
46
|
+
// 多选时值相同返回?
|
47
|
+
var values = htSelection.map(function (element) {
|
48
|
+
return getElementTextStyle(element);
|
49
|
+
}).filter(function (item) {
|
50
|
+
return !!item;
|
51
|
+
});
|
46
52
|
|
53
|
+
if (!values.length) {
|
54
|
+
return null;
|
55
|
+
}
|
56
|
+
|
57
|
+
var value = {};
|
58
|
+
styleNames.forEach(function (styleName) {
|
59
|
+
var val = values[0][styleName];
|
60
|
+
var different = values.filter(function (obj) {
|
61
|
+
return obj[styleName] !== val;
|
62
|
+
});
|
63
|
+
|
64
|
+
if (!different.length) {
|
65
|
+
value[styleName] = val;
|
66
|
+
}
|
67
|
+
});
|
68
|
+
return Object.keys(value).length ? value : null;
|
69
|
+
}
|
47
70
|
|
48
71
|
return null;
|
49
72
|
}
|
@@ -14,13 +14,16 @@ var _ElementTextStyleSetting = _interopRequireDefault(require("./ElementTextStyl
|
|
14
14
|
var _GlobalTagStyleSetting = _interopRequireDefault(require("./GlobalTagStyleSetting/GlobalTagStyleSetting"));
|
15
15
|
|
16
16
|
function textStyleSettingRouter(Component, options) {
|
17
|
+
var names = (options === null || options === void 0 ? void 0 : options.names) || [];
|
17
18
|
return function TextStyleSettingButton(props) {
|
18
19
|
var topo = props.topo;
|
19
20
|
var selection = topo.selectionManager.useHtSelection();
|
20
21
|
var Widget = !selection.length ? _GlobalTagStyleSetting["default"] : _ElementTextStyleSetting["default"];
|
21
22
|
return /*#__PURE__*/_react["default"].createElement(Widget, (0, _extends2["default"])({
|
22
23
|
Component: Component
|
23
|
-
}, props
|
24
|
+
}, props, {
|
25
|
+
styleNames: names
|
26
|
+
}));
|
24
27
|
};
|
25
28
|
}
|
26
29
|
|
@@ -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.34" === 'string' ? "6.0.0-alpha.34" : null;
|
56
56
|
console.info("\u62D3\u6251\u7248\u672C: " + version);
|
57
57
|
/**
|
58
58
|
* 拓扑显示和编辑
|
@@ -29,7 +29,8 @@ function useMetricPolling(_ref) {
|
|
29
29
|
sourceMetrics: null,
|
30
30
|
destinationMetrics: null,
|
31
31
|
// 链路指标列表
|
32
|
-
linkMetrics: []
|
32
|
+
linkMetrics: [],
|
33
|
+
linkMetricsTs: null
|
33
34
|
}),
|
34
35
|
data = _useState[0],
|
35
36
|
setData = _useState[1]; // 轮询hooks
|
@@ -41,9 +42,7 @@ function useMetricPolling(_ref) {
|
|
41
42
|
debounceInterval: 200,
|
42
43
|
manual: true,
|
43
44
|
onSuccess: function onSuccess(result) {
|
44
|
-
setData((0, _extends2["default"])({}, data,
|
45
|
-
linkMetrics: result
|
46
|
-
}));
|
45
|
+
setData((0, _extends2["default"])({}, data, result));
|
47
46
|
|
48
47
|
_rlog["default"].info('链路拓扑指标轮询', result);
|
49
48
|
}
|
@@ -86,6 +86,8 @@ function queryLinkLatestMetrics(_x3, _x4) {
|
|
86
86
|
|
87
87
|
function _queryLinkLatestMetrics() {
|
88
88
|
_queryLinkLatestMetrics = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3(linkCi, linkMetricCodes) {
|
89
|
+
var _linkMetrics$;
|
90
|
+
|
89
91
|
var linkMetrics, resultData;
|
90
92
|
return _regenerator["default"].wrap(function _callee3$(_context3) {
|
91
93
|
while (1) {
|
@@ -109,6 +111,10 @@ function _queryLinkLatestMetrics() {
|
|
109
111
|
|
110
112
|
case 5:
|
111
113
|
linkMetrics = _context3.sent;
|
114
|
+
_context3.next = 8;
|
115
|
+
return _CiTypeCache["default"].load([linkCi.ciType || linkCi.typeCode]);
|
116
|
+
|
117
|
+
case 8:
|
112
118
|
// format
|
113
119
|
resultData = linkMetricCodes.map(function (code) {
|
114
120
|
var _linkMetrics$find;
|
@@ -117,7 +123,7 @@ function _queryLinkLatestMetrics() {
|
|
117
123
|
return m.metricCode === code;
|
118
124
|
})) === null || _linkMetrics$find === void 0 ? void 0 : _linkMetrics$find.metricValue;
|
119
125
|
|
120
|
-
var metricDef = _CiTypeCache["default"].getMetric(linkCi.ciType, code);
|
126
|
+
var metricDef = _CiTypeCache["default"].getMetric(linkCi.ciType || linkCi.typeCode, code);
|
121
127
|
|
122
128
|
return {
|
123
129
|
code: code,
|
@@ -125,9 +131,12 @@ function _queryLinkLatestMetrics() {
|
|
125
131
|
value: (0, _attributeFormatter.formatMetric)(value, metricDef) || ''
|
126
132
|
};
|
127
133
|
});
|
128
|
-
return _context3.abrupt("return",
|
134
|
+
return _context3.abrupt("return", {
|
135
|
+
linkMetrics: resultData,
|
136
|
+
linkMetricsTs: (_linkMetrics$ = linkMetrics[0]) === null || _linkMetrics$ === void 0 ? void 0 : _linkMetrics$.ts
|
137
|
+
});
|
129
138
|
|
130
|
-
case
|
139
|
+
case 10:
|
131
140
|
case "end":
|
132
141
|
return _context3.stop();
|
133
142
|
}
|
@@ -150,6 +159,8 @@ function _queryLinkInterfacesLatestMetrics() {
|
|
150
159
|
switch (_context4.prev = _context4.next) {
|
151
160
|
case 0:
|
152
161
|
parseInterfaceMetrics = function _parseInterfaceMetric(subCiId) {
|
162
|
+
var _metrics$;
|
163
|
+
|
153
164
|
var metrics = interfaceMetrics.filter(function (metric) {
|
154
165
|
return metric.subCiId === subCiId;
|
155
166
|
});
|
@@ -160,12 +171,15 @@ function _queryLinkInterfacesLatestMetrics() {
|
|
160
171
|
return m.metricCode === code;
|
161
172
|
})) === null || _metrics$find === void 0 ? void 0 : _metrics$find.metricValue;
|
162
173
|
|
163
|
-
var metricDef = _CiTypeCache["default"].getMetric(linkCi.ciType, code);
|
174
|
+
var metricDef = _CiTypeCache["default"].getMetric(linkCi.ciType || linkCi.typeCode, code);
|
164
175
|
|
165
176
|
var formatValue = (0, _attributeFormatter.formatMetric)(value, metricDef);
|
166
177
|
res[code] = formatValue === 'undefined' ? '-' : formatValue;
|
167
178
|
return res;
|
168
|
-
}, {
|
179
|
+
}, {
|
180
|
+
_ts: (_metrics$ = metrics[0]) === null || _metrics$ === void 0 ? void 0 : _metrics$.ts // 指标时间
|
181
|
+
|
182
|
+
});
|
169
183
|
};
|
170
184
|
|
171
185
|
_linkCi$attributes = linkCi.attributes, sourceType = _linkCi$attributes.source_type, sourceId = _linkCi$attributes.source_id, destinationId = _linkCi$attributes.destination_id, destinationType = _linkCi$attributes.destination_type;
|
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.34",
|
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.34/build/index.html",
|
119
119
|
"gitHead": "2da19ffccbb7ca60a8acf396e39f542c68bb33f5"
|
120
120
|
}
|
@@ -1,36 +0,0 @@
|
|
1
|
-
import _extends from "@babel/runtime/helpers/extends";
|
2
|
-
var defaultStyle = {
|
3
|
-
color: '#AFB9C2',
|
4
|
-
fontFamily: '微软雅黑'
|
5
|
-
};
|
6
|
-
export function useValues(topo) {
|
7
|
-
var displayConfigState = topo.store.useModelState('displayConfig');
|
8
|
-
var nodeLabelStyle = displayConfigState.nodeLabelStyle,
|
9
|
-
defaultEdgeLabelStyle = displayConfigState.defaultEdgeLabelStyle;
|
10
|
-
return {
|
11
|
-
color: (nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.color) || defaultStyle.color,
|
12
|
-
fontFamily: (nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.fontFamily) || defaultStyle.fontFamily,
|
13
|
-
fontSize: nodeLabelStyle === null || nodeLabelStyle === void 0 ? void 0 : nodeLabelStyle.fontSize
|
14
|
-
};
|
15
|
-
}
|
16
|
-
export var setGlobalTagStyle = function setGlobalTagStyle(topo, styleData) {
|
17
|
-
var _topo$store$getModel = topo.store.getModel('displayConfig'),
|
18
|
-
displayConfigState = _topo$store$getModel[0],
|
19
|
-
displayConfigDispatchers = _topo$store$getModel[1];
|
20
|
-
|
21
|
-
var nodeLabelStyle = displayConfigState.nodeLabelStyle,
|
22
|
-
defaultEdgeLabelStyle = displayConfigState.defaultEdgeLabelStyle;
|
23
|
-
|
24
|
-
var globalNodeLabelStyle = _extends({}, nodeLabelStyle, styleData);
|
25
|
-
|
26
|
-
topo.getHtTopo().setGlobalNodeLabelStyle(globalNodeLabelStyle);
|
27
|
-
|
28
|
-
var globalEdgeTagStyle = _extends({}, defaultEdgeLabelStyle, styleData);
|
29
|
-
|
30
|
-
topo.getHtTopo().setGlobalEdgeTagStyle(globalEdgeTagStyle);
|
31
|
-
displayConfigDispatchers.update({
|
32
|
-
nodeLabelStyle: globalNodeLabelStyle,
|
33
|
-
defaultEdgeLabelStyle: globalEdgeTagStyle
|
34
|
-
});
|
35
|
-
};
|
36
|
-
export function setStyle() {}
|