@riil-frontend/component-topology 5.0.0-alpha.21 → 5.0.0-alpha.23
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.js +12 -12
- package/es/core/hooks/useTopoEdit.js +205 -153
- package/es/core/models/HistoryManager.js +4 -0
- package/es/core/models/TopoApp.js +1 -1
- package/es/core/viewer/components/plugins/ResourceDetail/ResourceDetail.js +51 -249
- package/es/core/viewer/components/plugins/ResourceDetail/ResourceDetailDrawer.js +256 -0
- package/es/core/viewer/components/plugins/ResourceDetail/ResourceDetailPlugin.js +2 -2
- package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/ResourceOverview.js +38 -21
- package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/LinkTopo.js +40 -2
- package/lib/core/hooks/useTopoEdit.js +204 -152
- package/lib/core/models/HistoryManager.js +4 -0
- package/lib/core/models/TopoApp.js +1 -1
- package/lib/core/viewer/components/plugins/ResourceDetail/ResourceDetail.js +51 -261
- package/lib/core/viewer/components/plugins/ResourceDetail/ResourceDetailDrawer.js +283 -0
- package/lib/core/viewer/components/plugins/ResourceDetail/ResourceDetailPlugin.js +2 -2
- package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/ResourceOverview.js +38 -21
- package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/LinkTopo.js +41 -2
- package/package.json +2 -2
|
@@ -539,7 +539,7 @@ export default function ResourceOverview(props) {
|
|
|
539
539
|
_baseInfoColChange = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5(col) {
|
|
540
540
|
var _col;
|
|
541
541
|
|
|
542
|
-
var infoData, attributeMap, _iterator, _step, item, value, contentTitle, link, node, _data, _ref2, _ref2$, _item, _attributeMap, object, _object, displayName, attr;
|
|
542
|
+
var infoData, attributeMap, _iterator, _step, item, value, contentTitle, link, address, owned_computer_room, owned_cabinet, roomLink, node, _data, _ref2, _ref2$, _item, _attributeMap, object, _object, displayName, attr;
|
|
543
543
|
|
|
544
544
|
return _regeneratorRuntime.wrap(function _callee5$(_context5) {
|
|
545
545
|
while (1) {
|
|
@@ -569,7 +569,7 @@ export default function ResourceOverview(props) {
|
|
|
569
569
|
|
|
570
570
|
case 11:
|
|
571
571
|
if ((_step = _iterator()).done) {
|
|
572
|
-
_context5.next =
|
|
572
|
+
_context5.next = 48;
|
|
573
573
|
break;
|
|
574
574
|
}
|
|
575
575
|
|
|
@@ -577,7 +577,7 @@ export default function ResourceOverview(props) {
|
|
|
577
577
|
value = formatMetric(attributeMap[item.dataIndex], ciTypeMeta.attributeMap[item.dataIndex]);
|
|
578
578
|
contentTitle = value;
|
|
579
579
|
_context5.t0 = item.dataIndex;
|
|
580
|
-
_context5.next = _context5.t0 === 'display_name' ? 18 : _context5.t0 === 'ciName' ? 22 : _context5.t0 === 'res_address' ? 25 : _context5.t0 === 'imageName' ?
|
|
580
|
+
_context5.next = _context5.t0 === 'display_name' ? 18 : _context5.t0 === 'ciName' ? 22 : _context5.t0 === 'res_address' ? 25 : _context5.t0 === 'imageName' ? 32 : 36;
|
|
581
581
|
break;
|
|
582
582
|
|
|
583
583
|
case 18:
|
|
@@ -587,36 +587,53 @@ export default function ResourceOverview(props) {
|
|
|
587
587
|
onClick: onClose
|
|
588
588
|
}, /*#__PURE__*/React.createElement(Link, {
|
|
589
589
|
className: styles.link,
|
|
590
|
-
title: attributeMap.display_name ||
|
|
590
|
+
title: attributeMap.display_name || '',
|
|
591
591
|
to: formatUrl(link)
|
|
592
|
-
}, attributeMap.display_name ||
|
|
593
|
-
contentTitle = attributeMap.display_name ||
|
|
594
|
-
return _context5.abrupt("break",
|
|
592
|
+
}, attributeMap.display_name || '-'));
|
|
593
|
+
contentTitle = attributeMap.display_name || '-';
|
|
594
|
+
return _context5.abrupt("break", 37);
|
|
595
595
|
|
|
596
596
|
case 22:
|
|
597
597
|
value = ciTypeMeta.displayName;
|
|
598
598
|
contentTitle = value;
|
|
599
|
-
return _context5.abrupt("break",
|
|
599
|
+
return _context5.abrupt("break", 37);
|
|
600
600
|
|
|
601
601
|
case 25:
|
|
602
602
|
_context5.next = 27;
|
|
603
603
|
return getAddressFormat(attributeMap);
|
|
604
604
|
|
|
605
605
|
case 27:
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
606
|
+
address = _context5.sent;
|
|
607
|
+
owned_computer_room = attributeMap.owned_computer_room, owned_cabinet = attributeMap.owned_cabinet; // 跳转3D机房定位设备
|
|
608
|
+
|
|
609
|
+
if (owned_computer_room && owned_cabinet) {
|
|
610
|
+
// /visual/room/index_runtime.html?type=preview&room_id=00000000383e3381&rack_id=11&device_id=122
|
|
611
|
+
roomLink = "/visual/room/index_runtime.html?type=preview&room_id=" + owned_computer_room + "&rack_id=" + owned_cabinet + "&device_id=" + id;
|
|
612
|
+
value = /*#__PURE__*/React.createElement("span", {
|
|
613
|
+
onClick: onClose
|
|
614
|
+
}, /*#__PURE__*/React.createElement(Link, {
|
|
615
|
+
className: styles.link,
|
|
616
|
+
title: address,
|
|
617
|
+
to: roomLink,
|
|
618
|
+
target: "_blank"
|
|
619
|
+
}, address));
|
|
620
|
+
} else {
|
|
621
|
+
value = address;
|
|
622
|
+
}
|
|
609
623
|
|
|
610
|
-
|
|
624
|
+
contentTitle = address;
|
|
625
|
+
return _context5.abrupt("break", 37);
|
|
626
|
+
|
|
627
|
+
case 32:
|
|
611
628
|
node = topo.getDataModel().getDataByTag(id);
|
|
612
629
|
value = (node === null || node === void 0 ? void 0 : node.a('customName')) || (node === null || node === void 0 ? void 0 : node.a('name')) || '-';
|
|
613
630
|
contentTitle = value;
|
|
614
|
-
return _context5.abrupt("break",
|
|
631
|
+
return _context5.abrupt("break", 37);
|
|
615
632
|
|
|
616
|
-
case
|
|
617
|
-
return _context5.abrupt("break",
|
|
633
|
+
case 36:
|
|
634
|
+
return _context5.abrupt("break", 37);
|
|
618
635
|
|
|
619
|
-
case
|
|
636
|
+
case 37:
|
|
620
637
|
// 拿翻译字段属性数据
|
|
621
638
|
if (attributeMap[item.dataIndex] && attributeMap[item.dataIndex + ".name"]) {
|
|
622
639
|
value = attributeMap[item.dataIndex + ".name"];
|
|
@@ -652,15 +669,15 @@ export default function ResourceOverview(props) {
|
|
|
652
669
|
contentTitle: contentTitle
|
|
653
670
|
}));
|
|
654
671
|
|
|
655
|
-
case
|
|
672
|
+
case 46:
|
|
656
673
|
_context5.next = 11;
|
|
657
674
|
break;
|
|
658
675
|
|
|
659
|
-
case
|
|
676
|
+
case 48:
|
|
660
677
|
settBaseInfoInitLoading(false);
|
|
661
678
|
setBaseInfo(infoData);
|
|
662
679
|
|
|
663
|
-
case
|
|
680
|
+
case 50:
|
|
664
681
|
case "end":
|
|
665
682
|
return _context5.stop();
|
|
666
683
|
}
|
|
@@ -696,8 +713,8 @@ export default function ResourceOverview(props) {
|
|
|
696
713
|
condition: "id('" + id + "')",
|
|
697
714
|
refAttribute: true,
|
|
698
715
|
orders: [{
|
|
699
|
-
name:
|
|
700
|
-
type:
|
|
716
|
+
name: 'CREATED_TIME',
|
|
717
|
+
type: 'asc'
|
|
701
718
|
}],
|
|
702
719
|
pageIndex: 1,
|
|
703
720
|
pageSize: 100000
|
|
@@ -1,12 +1,50 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import CrucialLinkTopo from '@riil-frontend/component-crucial-link-topo';
|
|
3
|
+
import { request } from '@riil-frontend/component-topology-utils';
|
|
3
4
|
import styles from "./LinkTopo.module.scss";
|
|
4
5
|
export default function LinkTopo(props) {
|
|
6
|
+
var data = props.data; // 资源节点上方色块展示资源的发送速率发送带宽利用率、接收速率发送接收利用率、总错包数
|
|
7
|
+
|
|
8
|
+
var sourceMetrics = {
|
|
9
|
+
out_rate: '5M/s',
|
|
10
|
+
// 发送速率
|
|
11
|
+
out_bandwidth_utilization: '20%',
|
|
12
|
+
// 发送带宽利用率
|
|
13
|
+
in_rate: '6M/s',
|
|
14
|
+
// 接收速率
|
|
15
|
+
in_bandwidth_utilization: '15%',
|
|
16
|
+
// 接收带宽利用率
|
|
17
|
+
total_errors_packets: '151' // 总错包数
|
|
18
|
+
|
|
19
|
+
};
|
|
20
|
+
var destinationMetrics = {
|
|
21
|
+
out_rate: '5M/s',
|
|
22
|
+
// 发送速率
|
|
23
|
+
out_bandwidth_utilization: '20%',
|
|
24
|
+
// 发送带宽利用率
|
|
25
|
+
in_rate: '6M/s',
|
|
26
|
+
// 接收速率
|
|
27
|
+
in_bandwidth_utilization: '15%',
|
|
28
|
+
// 接收带宽利用率
|
|
29
|
+
total_errors_packets: '151' // 总错包数
|
|
30
|
+
|
|
31
|
+
};
|
|
32
|
+
var linkMetrics = [{
|
|
33
|
+
code: 'xxxx',
|
|
34
|
+
name: '端到端ping时延',
|
|
35
|
+
value: '500ms'
|
|
36
|
+
}];
|
|
5
37
|
return /*#__PURE__*/React.createElement("div", {
|
|
6
38
|
className: styles.container
|
|
7
39
|
}, /*#__PURE__*/React.createElement(CrucialLinkTopo, {
|
|
8
|
-
request:
|
|
9
|
-
data:
|
|
40
|
+
request: request,
|
|
41
|
+
data: data // 链路ci数据
|
|
42
|
+
,
|
|
43
|
+
sourceMetrics: sourceMetrics // 源设备指标列表
|
|
44
|
+
,
|
|
45
|
+
destinationMetrics: destinationMetrics // 目的设备指标列表
|
|
46
|
+
,
|
|
47
|
+
linkMetrics: linkMetrics // 链路指标列表
|
|
10
48
|
|
|
11
49
|
}));
|
|
12
50
|
}
|