@riil-frontend/component-topology 2.14.2-alpha.2 → 2.14.2-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.
- package/build/1.js +2 -2
- package/build/2.js +1 -1
- package/build/index.css +1 -1
- package/build/index.js +22 -22
- package/demo/1/345/237/272/346/234/254//350/207/252/345/256/232/344/271/211/345/261/236/346/200/247/345/222/214/346/214/207/346/240/207.md +1 -1
- package/demo/API//346/250/241/345/236/213.md +29 -0
- package/es/components/BatchAttrMetric/constant.js +4 -0
- package/es/components/BatchAttrMetric/index.js +8 -10
- package/es/components/BatchAttrMetric/setting.js +6 -4
- package/es/components/BatchAttrMetric/utils.js +39 -32
- package/es/constants/ResourceTypeLimit.js +1 -1
- package/es/core/components/DisplaySettingDrawer/DisplaySettingDrawer.js +6 -5
- package/es/core/components/DisplaySettingDrawer/LinkTag.js +8 -6
- package/es/core/components/DisplaySettingDrawer/LinkTip.js +9 -7
- package/es/core/components/DisplaySettingDrawer/NodeTag.js +2 -0
- package/es/core/components/DisplaySettingDrawer/NodeTip.js +2 -0
- package/es/core/components/DisplaySettingDrawer/ResourceDisplay/BasicConfig.js +30 -9
- package/es/core/components/ResourceViewAttributeSetting/Setting.js +123 -0
- package/es/core/editor/components/EditorPlugin.js +4 -3
- package/es/core/editor/components/settings/propertyViews/view/GlobalTootipSetting.js +3 -1
- package/es/core/editor/components/settings/propertyViews/view/ViewPropertyView.js +0 -5
- package/es/core/models/AttributeMetricDisplay.js +181 -66
- package/es/core/models/TopoApp.js +18 -16
- package/es/core/models/attributeFormatter/index.js +33 -8
- package/es/core/models/common/Alarm.js +45 -31
- package/es/core/models/utils/linkUtils.js +14 -2
- package/es/core/utils/exportData.js +33 -0
- package/es/core/utils/linkPollingAttributesAdapter.js +3 -0
- package/es/core/viewer/components/plugins/BaseInfo/components/ResourceOverview/index.js +264 -0
- package/es/core/viewer/components/plugins/BaseInfo/components/ResourceOverview/index.module.scss +73 -0
- package/es/core/viewer/components/plugins/BaseInfo/index.js +127 -0
- package/es/core/viewer/components/plugins/BaseInfo/index.module.scss +24 -0
- package/es/core/viewer/components/plugins/ViewerPlugin.js +2 -1
- package/es/core/viewer/components/titlebar/widgets/MoreButtonMenu.js +5 -0
- package/es/getStoreModels.js +3 -1
- package/es/hooks/useAlarm.js +1 -1
- package/es/hooks/usePolling.js +2 -1
- package/es/models/topoAlarm.js +43 -17
- package/es/models/topoBaseInfoOverview.js +43 -0
- package/es/models/topoBizMod.js +0 -70
- package/es/style.js +8 -7
- package/es/utils/topoData.js +266 -155
- package/lib/components/BatchAttrMetric/constant.js +4 -0
- package/lib/components/BatchAttrMetric/index.js +8 -10
- package/lib/components/BatchAttrMetric/setting.js +8 -5
- package/lib/components/BatchAttrMetric/utils.js +39 -35
- package/lib/constants/ResourceTypeLimit.js +1 -1
- package/lib/core/components/DisplaySettingDrawer/DisplaySettingDrawer.js +6 -5
- package/lib/core/components/DisplaySettingDrawer/LinkTag.js +8 -6
- package/lib/core/components/DisplaySettingDrawer/LinkTip.js +9 -7
- package/lib/core/components/DisplaySettingDrawer/NodeTag.js +2 -0
- package/lib/core/components/DisplaySettingDrawer/NodeTip.js +2 -0
- package/lib/core/components/DisplaySettingDrawer/ResourceDisplay/BasicConfig.js +32 -8
- package/lib/core/{editor/components → components}/ResourceViewAttributeSetting/Setting.js +77 -71
- package/lib/core/editor/components/EditorPlugin.js +3 -3
- package/lib/core/editor/components/settings/propertyViews/view/GlobalTootipSetting.js +3 -1
- package/lib/core/editor/components/settings/propertyViews/view/ViewPropertyView.js +0 -5
- package/lib/core/models/AttributeMetricDisplay.js +181 -66
- package/lib/core/models/TopoApp.js +18 -17
- package/lib/core/models/attributeFormatter/index.js +34 -8
- package/lib/core/models/common/Alarm.js +46 -33
- package/lib/core/models/utils/linkUtils.js +12 -2
- package/lib/core/utils/exportData.js +44 -0
- package/lib/core/utils/linkPollingAttributesAdapter.js +10 -0
- package/lib/core/viewer/components/plugins/BaseInfo/components/ResourceOverview/index.js +284 -0
- package/lib/core/viewer/components/plugins/BaseInfo/components/ResourceOverview/index.module.scss +73 -0
- package/lib/core/viewer/components/plugins/BaseInfo/index.js +146 -0
- package/lib/core/viewer/components/plugins/BaseInfo/index.module.scss +24 -0
- package/lib/core/viewer/components/plugins/ViewerPlugin.js +3 -1
- package/lib/core/viewer/components/titlebar/widgets/MoreButtonMenu.js +6 -0
- package/lib/getStoreModels.js +4 -1
- package/lib/hooks/useAlarm.js +1 -1
- package/lib/hooks/usePolling.js +2 -1
- package/lib/models/topoAlarm.js +43 -17
- package/lib/models/topoBaseInfoOverview.js +55 -0
- package/lib/models/topoBizMod.js +0 -70
- package/lib/style.js +8 -7
- package/lib/utils/topoData.js +267 -151
- package/package.json +2 -2
- package/es/core/editor/components/ResourceViewAttributeSetting/ResourceViewAttributeSettingPlugin.js +0 -57
- package/es/core/editor/components/ResourceViewAttributeSetting/Setting.js +0 -114
- package/es/core/models/attrAndMetric.js +0 -131
- package/lib/core/editor/components/ResourceViewAttributeSetting/ResourceViewAttributeSettingPlugin.js +0 -73
- package/lib/core/models/attrAndMetric.js +0 -148
|
@@ -79,3 +79,32 @@ await topo.load(data);
|
|
|
79
79
|
lines: [],
|
|
80
80
|
}
|
|
81
81
|
```
|
|
82
|
+
|
|
83
|
+
#### 查询
|
|
84
|
+
|
|
85
|
+
#### 加载属性、指标数据
|
|
86
|
+
示例:
|
|
87
|
+
```
|
|
88
|
+
topo.attributeMetricDisplay.loadAttributeAndMetric([{
|
|
89
|
+
id: '资源id',
|
|
90
|
+
attributes: [{
|
|
91
|
+
code: "asset_number",
|
|
92
|
+
name: "资产编号",
|
|
93
|
+
value: "123123"
|
|
94
|
+
}],
|
|
95
|
+
metric: []
|
|
96
|
+
}])
|
|
97
|
+
|
|
98
|
+
topo.attributeMetricDisplay.loadAttributeAndMetric([{
|
|
99
|
+
id: '资源id',
|
|
100
|
+
attributes: {
|
|
101
|
+
name: "`2312312",
|
|
102
|
+
serial_number: "`2312312"
|
|
103
|
+
},
|
|
104
|
+
metric: {
|
|
105
|
+
aaa: 1111,
|
|
106
|
+
bbb: 222
|
|
107
|
+
}
|
|
108
|
+
}])
|
|
109
|
+
```
|
|
110
|
+
|
|
@@ -16,11 +16,15 @@ export var DATA_TYPE = {
|
|
|
16
16
|
tag: {
|
|
17
17
|
drawerTitle: '选择图数据',
|
|
18
18
|
maxSelect: 4,
|
|
19
|
+
label: '图',
|
|
20
|
+
poslabel: '拓扑图上',
|
|
19
21
|
message: "\u56FE\u6570\u636E\uFF1A\u9009\u62E9\u7684\u6307\u6807\u548C\u5C5E\u6027\u5C06\u4F1A\u663E\u793A\u5728\u62D3\u6251\u56FE\u4E0A\uFF0C\u6700\u591A\u652F\u6301\u52FE\u9009 4 \u9879\u3002"
|
|
20
22
|
},
|
|
21
23
|
tip: {
|
|
22
24
|
drawerTitle: '选择Tooltips显示数据',
|
|
23
25
|
maxSelect: 10,
|
|
26
|
+
label: 'Tootip',
|
|
27
|
+
poslabel: 'Tooltip中',
|
|
24
28
|
message: "Tootip\u6570\u636E\uFF1A\u9009\u62E9\u7684\u6307\u6807\u548C\u5C5E\u6027\u5C06\u4F1A\u663E\u793A\u5728Tooltip\u4E2D\uFF0C\u6700\u591A\u652F\u6301\u52FE\u9009 10 \u9879\u3002"
|
|
25
29
|
}
|
|
26
30
|
};
|
|
@@ -24,14 +24,14 @@ var BatchAttrMetricDrawer = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
24
24
|
setFalse = _useBoolean$.setFalse; // 选择类型,single/batch
|
|
25
25
|
|
|
26
26
|
|
|
27
|
-
var _useState = useState(),
|
|
27
|
+
var _useState = useState('batch'),
|
|
28
28
|
selectType = _useState[0],
|
|
29
29
|
setSelectType = _useState[1]; // 数据类型,tip/tag
|
|
30
30
|
|
|
31
31
|
|
|
32
32
|
var _useState2 = useState(),
|
|
33
|
-
|
|
34
|
-
|
|
33
|
+
showType = _useState2[0],
|
|
34
|
+
setShowType = _useState2[1];
|
|
35
35
|
|
|
36
36
|
useImperativeHandle(ref, function () {
|
|
37
37
|
return {
|
|
@@ -46,14 +46,14 @@ var BatchAttrMetricDrawer = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
46
46
|
entryConfig = {};
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
-
setSelectType(entryConfig.selectType);
|
|
50
|
-
|
|
49
|
+
// setSelectType(entryConfig.selectType);
|
|
50
|
+
setShowType(entryConfig.showType);
|
|
51
51
|
setTrue();
|
|
52
52
|
}
|
|
53
53
|
};
|
|
54
54
|
});
|
|
55
55
|
|
|
56
|
-
var config = _extends({}, SELECT_TYPE[selectType], DATA_TYPE[
|
|
56
|
+
var config = _extends({}, SELECT_TYPE[selectType], DATA_TYPE[showType]);
|
|
57
57
|
|
|
58
58
|
var drawerTitle = config.drawerTitle,
|
|
59
59
|
drawerWidth = config.drawerWidth,
|
|
@@ -67,18 +67,16 @@ var BatchAttrMetricDrawer = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
67
67
|
className: styles.drawer,
|
|
68
68
|
width: drawerWidth
|
|
69
69
|
}, /*#__PURE__*/React.createElement(SettingPage, _extends({}, pageConfig, props, {
|
|
70
|
-
dataType:
|
|
70
|
+
dataType: showType,
|
|
71
71
|
cancelCb: setFalse,
|
|
72
72
|
saveCb: function saveCb(values) {
|
|
73
73
|
setFalse();
|
|
74
74
|
|
|
75
|
-
_saveCb(
|
|
75
|
+
_saveCb(showType, values, selectType);
|
|
76
76
|
}
|
|
77
77
|
})));
|
|
78
78
|
});
|
|
79
79
|
BatchAttrMetricDrawer.propTypes = {
|
|
80
|
-
// 默认选择项,用于执行重置
|
|
81
|
-
defaultSet: PropTypes.any.isRequired,
|
|
82
80
|
// 数据项
|
|
83
81
|
allCiSet: PropTypes.any.isRequired,
|
|
84
82
|
// 保存回调
|
|
@@ -21,8 +21,9 @@ var Setting = function Setting(_ref) {
|
|
|
21
21
|
dataType = _ref.dataType,
|
|
22
22
|
props = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
23
23
|
|
|
24
|
-
|
|
25
|
-
|
|
24
|
+
// const allCiSet = utils.dsTransform(props.allCiSet);
|
|
25
|
+
var allCiSet = props.allCiSet,
|
|
26
|
+
limit = props.limit; // rlog.debug('Setting-allCiSet',props, allCiSet);
|
|
26
27
|
|
|
27
28
|
var _useState = useState(Object.keys(allCiSet)[0]),
|
|
28
29
|
ciType = _useState[0],
|
|
@@ -50,6 +51,7 @@ var Setting = function Setting(_ref) {
|
|
|
50
51
|
var onTableSelect = function onTableSelect(selectedKeys) {
|
|
51
52
|
var values = _extends({}, selected);
|
|
52
53
|
|
|
54
|
+
rlog.debug('Setting-allCiSet-onTableSelect', limit, selectedKeys, selected);
|
|
53
55
|
values[ciType] = selectedKeys;
|
|
54
56
|
setSelected(values);
|
|
55
57
|
};
|
|
@@ -65,7 +67,7 @@ var Setting = function Setting(_ref) {
|
|
|
65
67
|
className: styles.message
|
|
66
68
|
}, /*#__PURE__*/React.createElement(_Message, {
|
|
67
69
|
type: "notice"
|
|
68
|
-
}, props.
|
|
70
|
+
}, props.label + "\u6570\u636E\uFF1A\u9009\u62E9\u7684\u6307\u6807\u548C\u5C5E\u6027\u5C06\u4F1A\u663E\u793A\u5728" + props.poslabel + "\uFF0C\u6700\u591A\u652F\u6301\u52FE\u9009 " + limit + " \u9879\u3002")), /*#__PURE__*/React.createElement(_Grid.Row, {
|
|
69
71
|
className: styles.content
|
|
70
72
|
}, props.showTree && /*#__PURE__*/React.createElement(_Grid.Col, {
|
|
71
73
|
span: 8,
|
|
@@ -93,7 +95,7 @@ var Setting = function Setting(_ref) {
|
|
|
93
95
|
getProps: function getProps(_ref3) {
|
|
94
96
|
var id = _ref3.id;
|
|
95
97
|
return {
|
|
96
|
-
disabled: !selectedRowKeys.includes(id) && selectedRowKeys.length >=
|
|
98
|
+
disabled: !selectedRowKeys.includes(id) && selectedRowKeys.length >= limit
|
|
97
99
|
};
|
|
98
100
|
}
|
|
99
101
|
}
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
import _Balloon from "@alifd/next/es/balloon";
|
|
2
|
-
import _Button from "@alifd/next/es/button";
|
|
3
1
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
|
4
2
|
import _extends from "@babel/runtime/helpers/extends";
|
|
5
3
|
var _excluded = ["list"];
|
|
@@ -110,11 +108,16 @@ export var initSelected = function initSelected(allCiSet, dataType) {
|
|
|
110
108
|
*/
|
|
111
109
|
|
|
112
110
|
export var defaultSelected = function defaultSelected(allCiSet, defaultSet, dataType) {
|
|
111
|
+
if (defaultSet === void 0) {
|
|
112
|
+
defaultSet = {};
|
|
113
|
+
}
|
|
114
|
+
|
|
113
115
|
var values = {};
|
|
114
116
|
Object.keys(allCiSet).forEach(function (key) {
|
|
115
117
|
var ciTypeSelected = defaultSet[key] || defaultSet[allCiSet[key].code]; // 没有ci类型对应的默认配置 -> 使用通用的配置项
|
|
118
|
+
// const selected = (ciTypeSelected || defaultSet['common'])[dataType] || [];
|
|
116
119
|
|
|
117
|
-
var selected =
|
|
120
|
+
var selected = [];
|
|
118
121
|
var selectedIds = selected.map(function (item) {
|
|
119
122
|
return toId(item);
|
|
120
123
|
});
|
|
@@ -147,9 +150,9 @@ var typeCell = function typeCell(text) {
|
|
|
147
150
|
|
|
148
151
|
|
|
149
152
|
export var columns = function columns(dataType, showCiNum) {
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
+
// const dataTypeUp = `${dataType[0].toUpperCase()}${dataType.slice(1)}`;
|
|
154
|
+
// const ciNumKey = `ci${dataTypeUp}Num`;
|
|
155
|
+
// const ciArrKey = `ci${dataTypeUp}Arr`;
|
|
153
156
|
var values = [{
|
|
154
157
|
width: '100%',
|
|
155
158
|
dataIndex: 'name',
|
|
@@ -157,29 +160,33 @@ export var columns = function columns(dataType, showCiNum) {
|
|
|
157
160
|
cellOption: {
|
|
158
161
|
nowrap: true
|
|
159
162
|
}
|
|
160
|
-
}, {
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
163
|
+
}, // {
|
|
164
|
+
// width: '50%',
|
|
165
|
+
// dataIndex: ciNumKey,
|
|
166
|
+
// title: '匹配资源',
|
|
167
|
+
// cell: (text, index, record) => {
|
|
168
|
+
// const trigger = (
|
|
169
|
+
// <Button text type="primary">
|
|
170
|
+
// {text || 0}
|
|
171
|
+
// </Button>
|
|
172
|
+
// );
|
|
173
|
+
// return (
|
|
174
|
+
// <Balloon
|
|
175
|
+
// needAdjust
|
|
176
|
+
// trigger={trigger}
|
|
177
|
+
// closable={false}
|
|
178
|
+
// triggerType={text ? 'hover' : []}
|
|
179
|
+
// >
|
|
180
|
+
// <div className={styles['tip-content']}>
|
|
181
|
+
// {record[ciArrKey].map((ci, i) => (
|
|
182
|
+
// <div key={i}>{ci}</div>
|
|
183
|
+
// ))}
|
|
184
|
+
// </div>
|
|
185
|
+
// </Balloon>
|
|
186
|
+
// );
|
|
187
|
+
// },
|
|
188
|
+
// },
|
|
189
|
+
{
|
|
183
190
|
width: '70px',
|
|
184
191
|
dataIndex: 'type',
|
|
185
192
|
title: '类型',
|
|
@@ -190,7 +197,7 @@ export var columns = function columns(dataType, showCiNum) {
|
|
|
190
197
|
}
|
|
191
198
|
}
|
|
192
199
|
}];
|
|
193
|
-
return
|
|
194
|
-
|
|
195
|
-
|
|
200
|
+
return values; // return showCiNum
|
|
201
|
+
// ? values
|
|
202
|
+
// : values.filter((item) => item.dataIndex !== ciNumKey);
|
|
196
203
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
// 拓扑中心资源类型限制
|
|
2
2
|
export var RESOURCE_LIMIT_TYPES = [// 网络设备
|
|
3
|
-
'common_network', 'switch', 'switch_cluster', // 操作系统
|
|
3
|
+
'common_network', 'switch', 'switch_cluster', 'router', // 操作系统
|
|
4
4
|
'linux', 'windows', // 数据库
|
|
5
5
|
'oracle', 'asm_disk_group', 'oracle_rac', // 中间件
|
|
6
6
|
'tomcat', // 业务
|
|
@@ -43,28 +43,29 @@ export default function DisplaySettingDrawer(props) {
|
|
|
43
43
|
// 刷新指标配置
|
|
44
44
|
displayConfigDispatchers = topo.store.getModelDispatchers('displayConfig');
|
|
45
45
|
displayConfigDispatchers.update(displayConfig);
|
|
46
|
+
topo.attributeMetricDisplay.updateNodesNameVisible();
|
|
46
47
|
setLoading(false);
|
|
47
48
|
onClose();
|
|
48
49
|
|
|
49
50
|
_Message.success('保存成功');
|
|
50
51
|
|
|
51
|
-
_context.next =
|
|
52
|
+
_context.next = 20;
|
|
52
53
|
break;
|
|
53
54
|
|
|
54
|
-
case
|
|
55
|
-
_context.prev =
|
|
55
|
+
case 15:
|
|
56
|
+
_context.prev = 15;
|
|
56
57
|
_context.t0 = _context["catch"](1);
|
|
57
58
|
setLoading(false);
|
|
58
59
|
console.error('DisplaySettingDrawer.handleOk', _context.t0);
|
|
59
60
|
|
|
60
61
|
_Message.success('保存失败');
|
|
61
62
|
|
|
62
|
-
case
|
|
63
|
+
case 20:
|
|
63
64
|
case "end":
|
|
64
65
|
return _context.stop();
|
|
65
66
|
}
|
|
66
67
|
}
|
|
67
|
-
}, _callee, null, [[1,
|
|
68
|
+
}, _callee, null, [[1, 15]]);
|
|
68
69
|
}));
|
|
69
70
|
|
|
70
71
|
return function handleOk() {
|
|
@@ -4,22 +4,22 @@ import { DEFAULT_TAG_COMMON_CONFIG } from "../../../constants/ResourceInfoDispla
|
|
|
4
4
|
import BasicConfig from "./ResourceDisplay/BasicConfig"; // 默认中可配置内容包括总速率、带宽利用率、发送速率、发送带宽利用率、接收速率、接收带宽利用率
|
|
5
5
|
|
|
6
6
|
var CommonOptions = [{
|
|
7
|
-
value: 'metric:
|
|
7
|
+
value: 'metric:total_flow_rate',
|
|
8
8
|
label: '总流速'
|
|
9
9
|
}, {
|
|
10
|
-
value: 'metric:
|
|
10
|
+
value: 'metric:bandwidth_utilization',
|
|
11
11
|
label: '带宽利用率'
|
|
12
12
|
}, {
|
|
13
|
-
value: 'metric:
|
|
13
|
+
value: 'metric:out_rate',
|
|
14
14
|
label: '发送速率'
|
|
15
15
|
}, {
|
|
16
|
-
value: 'metric:
|
|
16
|
+
value: 'metric:out_bandwidth_utilization',
|
|
17
17
|
label: '发送带宽利用率'
|
|
18
18
|
}, {
|
|
19
|
-
value: 'metric:
|
|
19
|
+
value: 'metric:in_rate',
|
|
20
20
|
label: '接收速率'
|
|
21
21
|
}, {
|
|
22
|
-
value: 'metric:
|
|
22
|
+
value: 'metric:in_bandwidth_utilization',
|
|
23
23
|
label: '接收带宽利用率'
|
|
24
24
|
}];
|
|
25
25
|
/**
|
|
@@ -33,6 +33,8 @@ function LinkTag(props, ref) {
|
|
|
33
33
|
ref: ref
|
|
34
34
|
}, props, {
|
|
35
35
|
limit: 2,
|
|
36
|
+
elementType: "link",
|
|
37
|
+
showType: "tag",
|
|
36
38
|
commonOptions: CommonOptions,
|
|
37
39
|
defaultCommonConfig: DEFAULT_TAG_COMMON_CONFIG
|
|
38
40
|
}));
|
|
@@ -4,16 +4,16 @@ import { DEFAULT_TIP_COMMON_CONFIG } from "../../../constants/ResourceInfoDispla
|
|
|
4
4
|
import BasicConfig from "./ResourceDisplay/BasicConfig"; // 源端口、目的端口、总流量、带宽利用率
|
|
5
5
|
|
|
6
6
|
var CommonOptions = [{
|
|
7
|
-
value: 'attribute:
|
|
8
|
-
label: '
|
|
7
|
+
value: 'attribute:source_id',
|
|
8
|
+
label: '源端编号'
|
|
9
9
|
}, {
|
|
10
|
-
value: 'attribute:
|
|
11
|
-
label: '
|
|
10
|
+
value: 'attribute:destination_id',
|
|
11
|
+
label: '目的端编号'
|
|
12
12
|
}, {
|
|
13
|
-
value: 'metric:
|
|
14
|
-
label: '
|
|
13
|
+
value: 'metric:total_flow_rate',
|
|
14
|
+
label: '总流速'
|
|
15
15
|
}, {
|
|
16
|
-
value: 'metric:
|
|
16
|
+
value: 'metric:bandwidth_utilization',
|
|
17
17
|
label: '带宽利用率'
|
|
18
18
|
}];
|
|
19
19
|
/**
|
|
@@ -27,6 +27,8 @@ function LinkTip(props, ref) {
|
|
|
27
27
|
ref: ref
|
|
28
28
|
}, props, {
|
|
29
29
|
limit: 4,
|
|
30
|
+
elementType: "link",
|
|
31
|
+
showType: "tip",
|
|
30
32
|
commonOptions: CommonOptions,
|
|
31
33
|
defaultCommonConfig: DEFAULT_TIP_COMMON_CONFIG
|
|
32
34
|
}));
|
|
@@ -1,17 +1,19 @@
|
|
|
1
1
|
import _Button from "@alifd/next/es/button";
|
|
2
2
|
import _Box from "@alifd/next/es/box";
|
|
3
3
|
import _Radio from "@alifd/next/es/radio";
|
|
4
|
-
import React, { useEffect, useImperativeHandle, useState } from
|
|
5
|
-
import PropTypes from
|
|
4
|
+
import React, { useEffect, useImperativeHandle, useRef, useState } from "react";
|
|
5
|
+
import PropTypes from "prop-types";
|
|
6
6
|
import { DEFAULT_CUSTOM_CONFIG } from "../../../../constants/ResourceInfoDisplay";
|
|
7
7
|
import CommonCheckboxGroup from "./CommonCheckboxGroup";
|
|
8
|
+
import ResourceDiplayInfoSetting from "../../ResourceViewAttributeSetting/Setting";
|
|
9
|
+
import rlog from "@riil-frontend/component-topology-utils/es/rlog";
|
|
8
10
|
/**
|
|
9
11
|
* 配置类型
|
|
10
12
|
*/
|
|
11
13
|
|
|
12
14
|
var ConfigType = {
|
|
13
|
-
DEFAULT:
|
|
14
|
-
CUSTOM:
|
|
15
|
+
DEFAULT: "0",
|
|
16
|
+
CUSTOM: "1"
|
|
15
17
|
};
|
|
16
18
|
|
|
17
19
|
function BasicConfig(props, ref) {
|
|
@@ -30,7 +32,13 @@ function BasicConfig(props, ref) {
|
|
|
30
32
|
|
|
31
33
|
useImperativeHandle(ref, function () {
|
|
32
34
|
return {};
|
|
33
|
-
});
|
|
35
|
+
});
|
|
36
|
+
var tooltipSettingRef = useRef(); // 打开指标抽屉
|
|
37
|
+
|
|
38
|
+
var openSetting = function openSetting() {
|
|
39
|
+
tooltipSettingRef.current.openGlobalTootipSetting();
|
|
40
|
+
}; // 切换类型
|
|
41
|
+
|
|
34
42
|
|
|
35
43
|
var handleTypeChange = function handleTypeChange(type) {
|
|
36
44
|
var newIsCustom = type === ConfigType.CUSTOM;
|
|
@@ -39,12 +47,18 @@ function BasicConfig(props, ref) {
|
|
|
39
47
|
};
|
|
40
48
|
|
|
41
49
|
var handleCommonCheckboxGroupChange = function handleCommonCheckboxGroupChange(selected) {
|
|
50
|
+
rlog.debug("handleCommonCheckboxGroupChange", selected);
|
|
42
51
|
onChange({
|
|
43
52
|
isCustom: isCustom,
|
|
44
53
|
data: selected
|
|
45
54
|
});
|
|
46
55
|
};
|
|
47
56
|
|
|
57
|
+
var handleCustomChange = function handleCustomChange(parm) {
|
|
58
|
+
rlog.debug("handleCustomChange", parm);
|
|
59
|
+
onChange(parm);
|
|
60
|
+
};
|
|
61
|
+
|
|
48
62
|
return /*#__PURE__*/React.createElement(_Box, {
|
|
49
63
|
spacing: 8,
|
|
50
64
|
direction: "column"
|
|
@@ -59,10 +73,18 @@ function BasicConfig(props, ref) {
|
|
|
59
73
|
value: ConfigType.DEFAULT
|
|
60
74
|
}, "\u9ED8\u8BA4"), /*#__PURE__*/React.createElement(_Radio, {
|
|
61
75
|
value: ConfigType.CUSTOM
|
|
62
|
-
}, "\u81EA\u5B9A\u4E49"))), isCustom && /*#__PURE__*/React.createElement(_Button, {
|
|
76
|
+
}, "\u81EA\u5B9A\u4E49"))), isCustom && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_Button, {
|
|
63
77
|
type: "primary",
|
|
64
|
-
text: true
|
|
65
|
-
|
|
78
|
+
text: true,
|
|
79
|
+
onClick: openSetting
|
|
80
|
+
}, showType === 'tag' ? '选择图数据' : '选择Tooltip数据'), /*#__PURE__*/React.createElement(ResourceDiplayInfoSetting, {
|
|
81
|
+
ref: tooltipSettingRef,
|
|
82
|
+
topo: topo,
|
|
83
|
+
limit: limit,
|
|
84
|
+
elementType: elementType,
|
|
85
|
+
showType: showType,
|
|
86
|
+
onChange: handleCustomChange
|
|
87
|
+
}))), !isCustom && /*#__PURE__*/React.createElement(CommonCheckboxGroup, {
|
|
66
88
|
value: data,
|
|
67
89
|
dataSource: commonOptions,
|
|
68
90
|
limit: limit,
|
|
@@ -70,5 +92,4 @@ function BasicConfig(props, ref) {
|
|
|
70
92
|
}));
|
|
71
93
|
}
|
|
72
94
|
|
|
73
|
-
;
|
|
74
95
|
export default /*#__PURE__*/React.forwardRef(BasicConfig);
|
|
@@ -0,0 +1,123 @@
|
|
|
1
|
+
import React, { useState, useEffect, useRef, useCallback, useImperativeHandle, forwardRef } from "react";
|
|
2
|
+
import { TopoEvent } from "@riil-frontend/component-topology-graph";
|
|
3
|
+
import rlog from "@riil-frontend/component-topology-utils/es/rlog";
|
|
4
|
+
import BatchAttrMetricDrawer from "../../../components/BatchAttrMetric";
|
|
5
|
+
import { updateAllCiDoc, updateCiDoc } from "../../../utils/topoData";
|
|
6
|
+
/**
|
|
7
|
+
* 资源显示属性、指标配置
|
|
8
|
+
*/
|
|
9
|
+
|
|
10
|
+
var ResourceDiplayInfoSetting = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
11
|
+
var topo = props.topo,
|
|
12
|
+
elementType = props.elementType,
|
|
13
|
+
showType = props.showType,
|
|
14
|
+
limit = props.limit,
|
|
15
|
+
onChange = props.onChange;
|
|
16
|
+
var batchAttrMetric = useRef();
|
|
17
|
+
|
|
18
|
+
var _useState = useState({}),
|
|
19
|
+
markData = _useState[0],
|
|
20
|
+
setMarkarkData = _useState[1];
|
|
21
|
+
|
|
22
|
+
var _topo$store$useModel = topo.store.useModel("topoBizMod"),
|
|
23
|
+
bizState = _topo$store$useModel[0],
|
|
24
|
+
bizDispatchers = _topo$store$useModel[1]; // rlog.debug('TopoView---income', topoId, viewState);
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
var allCiSet = bizState.allCiSet,
|
|
28
|
+
ciSetDoc = bizState.ciSetDoc,
|
|
29
|
+
setConfig = bizState.setConfig,
|
|
30
|
+
resAndMetrics = bizState.resAndMetrics;
|
|
31
|
+
var allCiModSet = resAndMetrics.allCiModSet,
|
|
32
|
+
allLinkModSet = resAndMetrics.allLinkModSet;
|
|
33
|
+
|
|
34
|
+
var openMarkSetting = function openMarkSetting(parm) {
|
|
35
|
+
// rlog.debug('openMarkSetting', parm, allCiSet, ciSetDoc, setConfig,allCiModSet,allLinkModSet);
|
|
36
|
+
rlog.debug("openMarkSetting", parm, allCiSet, elementType, showType, allCiModSet, allLinkModSet);
|
|
37
|
+
setMarkarkData(elementType === "node" ? allCiModSet : allLinkModSet);
|
|
38
|
+
/**
|
|
39
|
+
* 已修改,目前只有批量设置
|
|
40
|
+
*/
|
|
41
|
+
// if (parm.selectType === 'batch') {
|
|
42
|
+
// setMarkarkData(setConfig ?? allCiModSet);
|
|
43
|
+
// } else {
|
|
44
|
+
// const setObj = {};
|
|
45
|
+
// if (ciSetDoc?.hasOwnProperty(parm.ciId)) {
|
|
46
|
+
// setObj[parm.ciId] = {
|
|
47
|
+
// ...ciSetDoc[parm.ciId],
|
|
48
|
+
// tag: ((ciSetDoc[parm.ciId] || {}).tag || []).map((t) => {
|
|
49
|
+
// // return t.split('-')[0];
|
|
50
|
+
// return t.code;
|
|
51
|
+
// }),
|
|
52
|
+
// tip: ((ciSetDoc[parm.ciId] || {}).tip || []).map((t) => {
|
|
53
|
+
// return t.code;
|
|
54
|
+
// }),
|
|
55
|
+
// };
|
|
56
|
+
// } else {
|
|
57
|
+
// setObj[parm.ciId] = {
|
|
58
|
+
// code: '',
|
|
59
|
+
// list: [],
|
|
60
|
+
// tag: [],
|
|
61
|
+
// tip: [],
|
|
62
|
+
// };
|
|
63
|
+
// }
|
|
64
|
+
// rlog.debug('setMarkarkData', setObj);
|
|
65
|
+
// setMarkarkData(setObj);
|
|
66
|
+
// }
|
|
67
|
+
|
|
68
|
+
batchAttrMetric.current.show({
|
|
69
|
+
showType: showType
|
|
70
|
+
});
|
|
71
|
+
}; // 保存指标设置
|
|
72
|
+
|
|
73
|
+
|
|
74
|
+
var saveMarkSetting = function saveMarkSetting(dataType, parm, selectType) {
|
|
75
|
+
rlog.debug("saveMarkSetting", dataType, parm, allCiSet);
|
|
76
|
+
|
|
77
|
+
if (elementType === "node") {
|
|
78
|
+
onChange({
|
|
79
|
+
isCustom: true,
|
|
80
|
+
data: parm
|
|
81
|
+
});
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
if (elementType === "link") {
|
|
85
|
+
onChange({
|
|
86
|
+
isCustom: true,
|
|
87
|
+
data: parm
|
|
88
|
+
});
|
|
89
|
+
} // const doc = ciSetDoc;
|
|
90
|
+
// let ciDoc = {};
|
|
91
|
+
// let allCiset = allCiSet;
|
|
92
|
+
// if (selectType === 'single') {
|
|
93
|
+
// const singleResult = updateCiDoc(dataType, parm, doc, allCiSet);
|
|
94
|
+
// ciDoc = singleResult.cidoc;
|
|
95
|
+
// allCiset = singleResult.allciset;
|
|
96
|
+
// } else {
|
|
97
|
+
// const allResult = updateAllCiDoc(dataType, parm, doc, allCiSet);
|
|
98
|
+
// ciDoc = allResult.cidoc;
|
|
99
|
+
// allCiset = allResult.allciset;
|
|
100
|
+
// }
|
|
101
|
+
// rlog.debug('saveMarkSetting', {parm, allCiSet, ciDoc, allCiset});
|
|
102
|
+
// topo.view.topoClient.setTagAndTipConfig(ciDoc);
|
|
103
|
+
// bizDispatchers.update({ ciSetDoc: ciDoc, setConfig: allCiset });
|
|
104
|
+
|
|
105
|
+
};
|
|
106
|
+
|
|
107
|
+
useImperativeHandle(ref, function () {
|
|
108
|
+
return {
|
|
109
|
+
show: openMarkSetting,
|
|
110
|
+
openGlobalTootipSetting: function openGlobalTootipSetting() {
|
|
111
|
+
openMarkSetting();
|
|
112
|
+
}
|
|
113
|
+
};
|
|
114
|
+
});
|
|
115
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(BatchAttrMetricDrawer, {
|
|
116
|
+
ref: batchAttrMetric,
|
|
117
|
+
allCiSet: markData,
|
|
118
|
+
limit: limit,
|
|
119
|
+
showType: showType,
|
|
120
|
+
saveCb: saveMarkSetting
|
|
121
|
+
}));
|
|
122
|
+
});
|
|
123
|
+
export default ResourceDiplayInfoSetting;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import IconManage from "./iconManage/IconManage";
|
|
4
|
-
import LinkDynamicStyleSettingDrawer from "./LinkDynamicStyleSettingDrawer";
|
|
5
|
-
|
|
4
|
+
import LinkDynamicStyleSettingDrawer from "./LinkDynamicStyleSettingDrawer"; // import ResourceViewAttributeSettingPlugin from './ResourceViewAttributeSetting/ResourceViewAttributeSettingPlugin';
|
|
5
|
+
|
|
6
6
|
import LinkDrawer from "../../../components/Link";
|
|
7
7
|
import SaveLoading from "./plugins/SaveLoading";
|
|
8
8
|
import MultipleResourceSelectPlugin from "./plugins/MultipleResourceSelectPlugin";
|
|
@@ -13,7 +13,8 @@ export default function TopoEditorPlugin(props) {
|
|
|
13
13
|
topoEdit = props.topoEdit,
|
|
14
14
|
editorProps = props.editorProps;
|
|
15
15
|
var store = topo.store;
|
|
16
|
-
var plugins = [SaveLoading, GroupAddResourceDrawerPlugin, MultipleResourceSelectPlugin, ResourceViewAttributeSettingPlugin,
|
|
16
|
+
var plugins = [SaveLoading, GroupAddResourceDrawerPlugin, MultipleResourceSelectPlugin, // ResourceViewAttributeSettingPlugin,
|
|
17
|
+
LinkDrawer, IconManage, LinkDynamicStyleSettingDrawer].concat((editorProps === null || editorProps === void 0 ? void 0 : editorProps.plugins) || []);
|
|
17
18
|
return /*#__PURE__*/React.createElement(React.Fragment, null, plugins.map(function (Plugin, index) {
|
|
18
19
|
return /*#__PURE__*/React.createElement(Plugin, _extends({
|
|
19
20
|
key: index,
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import _Button from "@alifd/next/es/button";
|
|
2
2
|
import React, { useState, useEffect, useRef, useCallback } from 'react';
|
|
3
3
|
import '@riil-frontend/css/lib/index.scss';
|
|
4
|
-
import ResourceDiplayInfoSetting from "
|
|
4
|
+
import ResourceDiplayInfoSetting from "../../../../../components/ResourceViewAttributeSetting/Setting";
|
|
5
5
|
/**
|
|
6
6
|
* 显示属性、指标配置
|
|
7
|
+
*
|
|
8
|
+
* 已废弃
|
|
7
9
|
*/
|
|
8
10
|
|
|
9
11
|
export default function GlobalTootipSetting(props) {
|
|
@@ -28,10 +28,5 @@ export default function ViewPropertyView(props) {
|
|
|
28
28
|
title: "\u5E03\u5C40"
|
|
29
29
|
}, /*#__PURE__*/React.createElement(GlobalLayout, {
|
|
30
30
|
topo: topo
|
|
31
|
-
})), /*#__PURE__*/React.createElement(CollapsePanel, {
|
|
32
|
-
key: "\u5C5E\u6027/\u6307\u6807\u663E\u793A\u8BBE\u7F6E",
|
|
33
|
-
title: "\u5C5E\u6027/\u6307\u6807\u663E\u793A\u8BBE\u7F6E"
|
|
34
|
-
}, /*#__PURE__*/React.createElement(GlobalTootipSetting, {
|
|
35
|
-
topo: topo
|
|
36
31
|
}))))));
|
|
37
32
|
}
|