@riil-frontend/component-topology 13.0.0-dev.9 → 13.0.1
Sign up to get free protection for your applications and to get access to all the features.
- package/build/index.js +26 -26
- package/es/core/components/AlarmListPanel/components/AlarmListItem.js +10 -1
- package/es/core/components/AlarmListPanel/index.js +2 -1
- package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.js +6 -5
- package/es/core/hooks/useGraphAlarmDisplay.js +45 -18
- package/es/core/hooks/useLinkAlarmDisplay.js +163 -0
- package/es/core/hooks/useManageStatus.js +1 -0
- package/es/core/hooks/usePolling.js +78 -24
- package/es/core/hooks/useTopoEdit.js +2 -1
- package/es/core/models/TopoApp.js +1 -1
- package/es/core/models/utils/linkUtils.js +30 -24
- package/es/core/store/models/topoMod.js +3 -6
- package/es/core/utils/graphLinkUtil.js +1 -0
- package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/ResourceOverview.js +2 -1
- package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/LinkTopo.js +3 -2
- package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/LinkTopoCard.js +4 -2
- package/es/networkTopo/utils/relateTopoDataUtil.js +2 -4
- package/lib/core/components/AlarmListPanel/components/AlarmListItem.js +10 -1
- package/lib/core/components/AlarmListPanel/index.js +2 -1
- package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.js +6 -5
- package/lib/core/hooks/useGraphAlarmDisplay.js +46 -18
- package/lib/core/hooks/useLinkAlarmDisplay.js +175 -0
- package/lib/core/hooks/useManageStatus.js +1 -0
- package/lib/core/hooks/usePolling.js +73 -19
- package/lib/core/hooks/useTopoEdit.js +2 -1
- package/lib/core/models/TopoApp.js +1 -1
- package/lib/core/models/utils/linkUtils.js +30 -24
- package/lib/core/store/models/topoMod.js +3 -6
- package/lib/core/utils/graphLinkUtil.js +1 -0
- package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/ResourceOverview.js +2 -1
- package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/LinkTopo.js +3 -2
- package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/LinkTopoCard.js +4 -2
- package/lib/networkTopo/utils/relateTopoDataUtil.js +1 -4
- package/package.json +2 -2
- package/es/networkTopo/utils/__tests__/relateTopoData.js +0 -110
- package/lib/networkTopo/utils/__tests__/relateTopoData.js +0 -115
@@ -46,40 +46,35 @@ export function isAggLink(link) {
|
|
46
46
|
|
47
47
|
return (link === null || link === void 0 ? void 0 : (_link$attributes2 = link.attributes) === null || _link$attributes2 === void 0 ? void 0 : _link$attributes2.destination_type) === "network.agg_interface" && (link === null || link === void 0 ? void 0 : (_link$attributes3 = link.attributes) === null || _link$attributes3 === void 0 ? void 0 : _link$attributes3.source_type) === "network.agg_interface";
|
48
48
|
}
|
49
|
-
export function mergeLinksData(links, linkCis, nodes,
|
49
|
+
export function mergeLinksData(links, linkCis, nodes, ciMap, interfaceDoc) {
|
50
50
|
var linkCiMap = keyBy(links, "id");
|
51
51
|
return links.map(function (link) {
|
52
|
-
var
|
52
|
+
var _ciMap$attributes$net, _ciMap$attributes$net2, _ciMap$attributes$sou, _ciMap$attributes$des;
|
53
53
|
|
54
54
|
var linkCi = linkCiMap[link.id];
|
55
55
|
|
56
|
-
var attributes = _extends({}, linkCi === null || linkCi === void 0 ? void 0 : linkCi.attributes);
|
56
|
+
var attributes = _extends({}, linkCi === null || linkCi === void 0 ? void 0 : linkCi.attributes); // 翻译
|
57
57
|
|
58
|
-
var sourceNode = nodes.find(function (node) {
|
59
|
-
return node.id === attributes["network_link.source_device_id"];
|
60
|
-
});
|
61
|
-
var targetNode = nodes.find(function (node) {
|
62
|
-
return node.id === attributes["network_link.destination_device_id"];
|
63
|
-
}); // 翻译
|
64
58
|
|
65
59
|
return _extends({}, link, {
|
60
|
+
breakState: false,
|
66
61
|
attributes: _extends({}, attributes, {
|
67
62
|
// 源/目的设备
|
68
63
|
"network_link.source_device_id_object": {
|
69
|
-
displayName:
|
64
|
+
displayName: (_ciMap$attributes$net = ciMap[attributes["network_link.source_device_id"]]) === null || _ciMap$attributes$net === void 0 ? void 0 : _ciMap$attributes$net.attributes["display_name"]
|
70
65
|
},
|
71
66
|
"network_link.destination_device_id_object": {
|
72
|
-
displayName:
|
67
|
+
displayName: (_ciMap$attributes$net2 = ciMap[attributes["network_link.destination_device_id"]]) === null || _ciMap$attributes$net2 === void 0 ? void 0 : _ciMap$attributes$net2.attributes["display_name"]
|
73
68
|
},
|
74
69
|
// 源/目的接口类型
|
75
70
|
source_type_object: interfaceDoc[attributes.source_type],
|
76
71
|
destination_type_object: interfaceDoc[attributes.destination_type],
|
77
72
|
// 源/目的接口
|
78
73
|
source_id_object: {
|
79
|
-
displayName: (
|
74
|
+
displayName: (_ciMap$attributes$sou = ciMap[attributes.source_id]) === null || _ciMap$attributes$sou === void 0 ? void 0 : _ciMap$attributes$sou.attributes["display_name"]
|
80
75
|
},
|
81
76
|
destination_id_object: {
|
82
|
-
displayName: (
|
77
|
+
displayName: (_ciMap$attributes$des = ciMap[attributes.destination_id]) === null || _ciMap$attributes$des === void 0 ? void 0 : _ciMap$attributes$des.attributes["display_name"]
|
83
78
|
}
|
84
79
|
})
|
85
80
|
});
|
@@ -91,7 +86,7 @@ export function getLinksDetail(_x, _x2) {
|
|
91
86
|
|
92
87
|
function _getLinksDetail() {
|
93
88
|
_getLinksDetail = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(links, nodes) {
|
94
|
-
var linkCis,
|
89
|
+
var linkCis, ciMap, ciIds, interfaceTypes, loadCiMap, interfaceDoc;
|
95
90
|
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
96
91
|
while (1) switch (_context.prev = _context.next) {
|
97
92
|
case 0:
|
@@ -104,11 +99,20 @@ function _getLinksDetail() {
|
|
104
99
|
|
105
100
|
case 2:
|
106
101
|
linkCis = links;
|
107
|
-
|
102
|
+
ciMap = keyBy(nodes, "id");
|
103
|
+
ciIds = _.uniq([].concat(linkCis.map(function (item) {
|
104
|
+
return item.attributes['network_link.destination_device_id'];
|
105
|
+
}), linkCis.map(function (item) {
|
106
|
+
return item.attributes['network_link.source_device_id'];
|
107
|
+
}), linkCis.map(function (item) {
|
108
108
|
return item.attributes.source_id;
|
109
109
|
}), linkCis.map(function (item) {
|
110
110
|
return item.attributes.destination_id;
|
111
|
-
}))
|
111
|
+
}))).filter(function (item) {
|
112
|
+
return !!item;
|
113
|
+
}).filter(function (item) {
|
114
|
+
return !ciMap[item];
|
115
|
+
});
|
112
116
|
interfaceTypes = _.compact(_.uniq([].concat(linkCis.map(function (item) {
|
113
117
|
return item.attributes.source_type;
|
114
118
|
}), linkCis.map(function (item) {
|
@@ -116,19 +120,21 @@ function _getLinksDetail() {
|
|
116
120
|
})))).filter(function (item) {
|
117
121
|
return item !== "ip";
|
118
122
|
});
|
119
|
-
_context.next =
|
120
|
-
return CiCache.load(
|
123
|
+
_context.next = 8;
|
124
|
+
return CiCache.load(ciIds);
|
121
125
|
|
122
|
-
case
|
123
|
-
|
124
|
-
_context.next =
|
126
|
+
case 8:
|
127
|
+
loadCiMap = _context.sent;
|
128
|
+
_context.next = 11;
|
125
129
|
return CiTypeCache.load(interfaceTypes);
|
126
130
|
|
127
|
-
case
|
131
|
+
case 11:
|
128
132
|
interfaceDoc = _context.sent;
|
129
|
-
|
133
|
+
Object.assign(ciMap, loadCiMap); // console.log('getLinksDetail-mergeLinksData', { relations, interfaceIds, interfaceCis, })
|
134
|
+
|
135
|
+
return _context.abrupt("return", mergeLinksData(links, linkCis, nodes, ciMap, interfaceDoc));
|
130
136
|
|
131
|
-
case
|
137
|
+
case 14:
|
132
138
|
case "end":
|
133
139
|
return _context.stop();
|
134
140
|
}
|
@@ -395,7 +395,8 @@ export default function (topoApp) {
|
|
395
395
|
globalConfig: extraConfig,
|
396
396
|
type: (_result$config = result.config) === null || _result$config === void 0 ? void 0 : _result$config.showType,
|
397
397
|
topoData: topoData,
|
398
|
-
resAndMetrics: resAndMetrics
|
398
|
+
resAndMetrics: resAndMetrics,
|
399
|
+
loading: false
|
399
400
|
});
|
400
401
|
|
401
402
|
case 47:
|
@@ -425,11 +426,7 @@ export default function (topoApp) {
|
|
425
426
|
rlog.info('topoMod.initTopoData 初始化拓扑图数据完成. 耗时: ', endTime.diff(startTime, 'seconds', true));
|
426
427
|
topoApp.options.onLoad();
|
427
428
|
|
428
|
-
|
429
|
-
loading: false
|
430
|
-
});
|
431
|
-
|
432
|
-
case 62:
|
429
|
+
case 61:
|
433
430
|
case "end":
|
434
431
|
return _context4.stop();
|
435
432
|
}
|
@@ -11,6 +11,7 @@ export function fixLink(topo) {
|
|
11
11
|
edges.forEach(function (edge) {
|
12
12
|
var source = edge.getSource();
|
13
13
|
var target = edge.getTarget();
|
14
|
+
console.log('fixLink', edge, source, target);
|
14
15
|
var linkData = linkDatas.find(function (data) {
|
15
16
|
return data.id === edge.getTag();
|
16
17
|
}); // TODO 判断两端互相切换
|
@@ -883,7 +883,8 @@ export default function ResourceOverview(props) {
|
|
883
883
|
return item.code;
|
884
884
|
}),
|
885
885
|
getOverviewConfig: resourceOverviewProps.getOverviewConfig,
|
886
|
-
saveOverviewConfig: resourceOverviewProps.saveOverviewConfig
|
886
|
+
saveOverviewConfig: resourceOverviewProps.saveOverviewConfig,
|
887
|
+
jumpto: topo.viewProps.jumpto
|
887
888
|
}) : /*#__PURE__*/React.createElement(BlockBox, {
|
888
889
|
headerTitle: "\u5173\u952E\u6307\u6807",
|
889
890
|
headerExtra: /*#__PURE__*/React.createElement(Configurator, {
|
@@ -7,7 +7,8 @@ import styles from "./LinkTopo.module.scss";
|
|
7
7
|
export default function LinkTopo(props) {
|
8
8
|
var data = props.data,
|
9
9
|
linkMetricCodes = props.linkMetricCodes,
|
10
|
-
openFlow = props.openFlow
|
10
|
+
openFlow = props.openFlow,
|
11
|
+
jumpto = props.jumpto;
|
11
12
|
var metricData = useMetricPolling({
|
12
13
|
linkCi: data,
|
13
14
|
linkMetricCodes: linkMetricCodes
|
@@ -33,7 +34,7 @@ export default function LinkTopo(props) {
|
|
33
34
|
data: data // 链路ci数据
|
34
35
|
,
|
35
36
|
isNarrow: true,
|
36
|
-
jumpto: getHistory().push
|
37
|
+
jumpto: jumpto || getHistory().push
|
37
38
|
}, metricData, {
|
38
39
|
openFlow: openFlow
|
39
40
|
})));
|
@@ -13,7 +13,8 @@ export default function LinkTopoCard(props) {
|
|
13
13
|
defaultCols = props.defaultCols,
|
14
14
|
metricCol = props.metricCol,
|
15
15
|
metricColChange = props.metricColChange,
|
16
|
-
metricCodes = props.metricCodes
|
16
|
+
metricCodes = props.metricCodes,
|
17
|
+
jumpto = props.jumpto; // eslint-disable-next-line camelcase
|
17
18
|
|
18
19
|
var supportTemplates = (data === null || data === void 0 ? void 0 : (_data$attributes = data.attributes) === null || _data$attributes === void 0 ? void 0 : _data$attributes.support_templates) || ''; // 该资源监控模板
|
19
20
|
|
@@ -104,6 +105,7 @@ export default function LinkTopoCard(props) {
|
|
104
105
|
linkMetricCodes: openFlow && openFlow.name == '查看流量构成' ? metricCodes : metricCodes.filter(function (i) {
|
105
106
|
return i != 'netDelayRatio' && i != 'retansRatio';
|
106
107
|
}),
|
107
|
-
openFlow: openFlow
|
108
|
+
openFlow: openFlow,
|
109
|
+
jumpto: jumpto
|
108
110
|
}));
|
109
111
|
}
|
@@ -1,13 +1,12 @@
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
2
2
|
// 关联拓扑数据
|
3
|
-
|
3
|
+
|
4
4
|
/**
|
5
5
|
* 升级历史数据:子拓扑节点序列化数据
|
6
6
|
* 构造子拓扑节点
|
7
7
|
* 构造子拓扑链路
|
8
8
|
* @param {*} ctx
|
9
9
|
*/
|
10
|
-
|
11
10
|
export function processBothTopoData(topoData) {
|
12
11
|
var nodes = topoData.nodes,
|
13
12
|
links = topoData.links;
|
@@ -55,7 +54,7 @@ export function buildTopoNode(topoId) {
|
|
55
54
|
// name: ,
|
56
55
|
bindType: "topo",
|
57
56
|
// 绑定资源类型。关联资源 值为空,关联IP ip
|
58
|
-
|
57
|
+
bindTopo: topoId,
|
59
58
|
// TODO 所属区域,从序列化拿
|
60
59
|
// 'groupId': null,
|
61
60
|
// 'groupTag': null,
|
@@ -69,7 +68,6 @@ export function buildTopoNode(topoId) {
|
|
69
68
|
}
|
70
69
|
|
71
70
|
function buildTopoLinks(links) {
|
72
|
-
// links.push(...topoLinks)
|
73
71
|
return links.map(function (link) {
|
74
72
|
return _extends({}, link, {
|
75
73
|
"source": link.sourceType ? link.sourceType + ':' + link.source : link.source,
|
@@ -115,6 +115,11 @@ function SubListItem(props) {
|
|
115
115
|
var subNode = topo.getData().nodes.find(function (node) {
|
116
116
|
return node.ciId === alarmInfo.mainCiId;
|
117
117
|
});
|
118
|
+
|
119
|
+
var _useState = (0, _react.useState)(),
|
120
|
+
balloonVisible = _useState[0],
|
121
|
+
setBalloonVisible = _useState[1];
|
122
|
+
|
118
123
|
var plarm = alarmInfo.cmpCode ? "\u3010" + (subNode === null || subNode === void 0 ? void 0 : subNode.sourceName) + "\u3011" : "【本级平台】";
|
119
124
|
return /*#__PURE__*/_react["default"].createElement(_list["default"].Item, {
|
120
125
|
className: _indexModule["default"].AlarmListItem,
|
@@ -136,6 +141,8 @@ function SubListItem(props) {
|
|
136
141
|
}, "\u67E5\u770B\u8BE6\u60C5"),
|
137
142
|
closable: true,
|
138
143
|
triggerType: "click",
|
144
|
+
visible: balloonVisible,
|
145
|
+
onVisibleChange: setBalloonVisible,
|
139
146
|
align: "bl",
|
140
147
|
popupClassName: _indexModule["default"]["enjoydata-alarm-table-balloon"],
|
141
148
|
popupStyle: {
|
@@ -144,7 +151,9 @@ function SubListItem(props) {
|
|
144
151
|
}
|
145
152
|
}, creatAlarmTips((0, _extends2["default"])({}, alarmInfo, {
|
146
153
|
sourceName: plarm
|
147
|
-
})
|
154
|
+
}), function () {
|
155
|
+
setBalloonVisible(false);
|
156
|
+
})) : /*#__PURE__*/_react["default"].createElement("div", {
|
148
157
|
className: _indexModule["default"].listLink
|
149
158
|
}, /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
150
159
|
onClick: onClick,
|
@@ -39,6 +39,7 @@ function AlarmListPanel(props, ref) {
|
|
39
39
|
var alarmListProps = (0, _useAlarmList["default"])({
|
40
40
|
alarmData: alarmData
|
41
41
|
});
|
42
|
+
var alarmLink = topo.isCMPTopo ? '/default/cmp/gradAlarm' : '/default/alarmCenter/alarmList';
|
42
43
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
43
44
|
className: _indexModule["default"].AlarmListPanel,
|
44
45
|
id: "AlarmListPanel"
|
@@ -56,7 +57,7 @@ function AlarmListPanel(props, ref) {
|
|
56
57
|
onClick: onClose
|
57
58
|
}, /*#__PURE__*/_react["default"].createElement(_Link["default"], {
|
58
59
|
className: _indexModule["default"].listTitleLink,
|
59
|
-
to:
|
60
|
+
to: alarmLink
|
60
61
|
}, "\u67E5\u770B\u6240\u6709\u544A\u8B66"))),
|
61
62
|
extra:
|
62
63
|
/*#__PURE__*/
|
@@ -48,11 +48,12 @@ var LINE_TYPE_OPTIONS = [{
|
|
48
48
|
value: 'doublearc',
|
49
49
|
label: '双弧线',
|
50
50
|
icon: 'topo_linear_icon_arcline'
|
51
|
-
}
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
}
|
51
|
+
} // {
|
52
|
+
// value: 'points',
|
53
|
+
// label: '自由线形',
|
54
|
+
// icon: 'topo_linear_icon_pointsline',
|
55
|
+
// },
|
56
|
+
];
|
56
57
|
|
57
58
|
var LineType = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
|
58
59
|
var value = props.value,
|
@@ -15,11 +15,13 @@ var _showGraphManageStatusUtil = require("../utils/showGraphManageStatusUtil");
|
|
15
15
|
|
16
16
|
var _useCmpLinkAlarm2 = _interopRequireDefault(require("./useCmpLinkAlarm"));
|
17
17
|
|
18
|
+
var _useLinkAlarmDisplay2 = _interopRequireDefault(require("./useLinkAlarmDisplay"));
|
19
|
+
|
18
20
|
/**
|
19
21
|
* 获取ci的最高告警级别
|
20
|
-
* @param {Array} alarmList
|
21
|
-
* @param {*} risks
|
22
|
-
* @returns
|
22
|
+
* @param {Array} alarmList
|
23
|
+
* @param {*} risks
|
24
|
+
* @returns
|
23
25
|
*/
|
24
26
|
function getCiAlarmLevelMap(alarmList) {
|
25
27
|
var ciIdLevelMap = {};
|
@@ -51,9 +53,9 @@ function getGraphCiElementAlarmLevels(resources, alarmList) {
|
|
51
53
|
}
|
52
54
|
/**
|
53
55
|
* 获得关联拓扑节点告警级别
|
54
|
-
* @param {*} topo
|
55
|
-
* @param {*} relateTopoAlarm
|
56
|
-
* @returns
|
56
|
+
* @param {*} topo
|
57
|
+
* @param {*} relateTopoAlarm
|
58
|
+
* @returns
|
57
59
|
*/
|
58
60
|
|
59
61
|
|
@@ -61,7 +63,7 @@ function getRelateTopoNodeAlarmLevels(topo, relateTopoAlarm) {
|
|
61
63
|
return Object.keys(relateTopoAlarm).map(function (topoId) {
|
62
64
|
var level = relateTopoAlarm[topoId];
|
63
65
|
var relateTopoNode = topo.getDataModel().getDatas().toArray().find(function (node) {
|
64
|
-
return "" + node.a(
|
66
|
+
return "" + node.a("bindTopo") === "" + topoId;
|
65
67
|
});
|
66
68
|
|
67
69
|
if (!level || !relateTopoNode) {
|
@@ -81,18 +83,18 @@ function getRelateTopoNodeAlarmLevels(topo, relateTopoAlarm) {
|
|
81
83
|
function getGraphElementAlarmLevels(resources) {}
|
82
84
|
/**
|
83
85
|
* 告警显示到ht拓扑
|
84
|
-
*
|
85
|
-
* @param {*} options
|
86
|
+
*
|
87
|
+
* @param {*} options
|
86
88
|
*/
|
87
89
|
|
88
90
|
|
89
91
|
function useGraphAlarmDisplay(options) {
|
90
92
|
var topo = options.topo,
|
91
93
|
alarmSwitch = options.alarmSwitch;
|
92
|
-
var topoState = topo.store.useModelState(
|
94
|
+
var topoState = topo.store.useModelState("topoMod");
|
93
95
|
var graphLoaded = topoState.graphLoaded,
|
94
96
|
viewState = topoState.viewState;
|
95
|
-
var isEditMode = viewState ===
|
97
|
+
var isEditMode = viewState === "edit";
|
96
98
|
|
97
99
|
var _topo$alarm$useState = topo.alarm.useState(),
|
98
100
|
alarmList = _topo$alarm$useState.alarmList,
|
@@ -110,12 +112,28 @@ function useGraphAlarmDisplay(options) {
|
|
110
112
|
cmpLinkRunStatus = _useCmpLinkAlarm.cmpLinkRunStatus,
|
111
113
|
addCmpLinkOfflineStatusForDisplayLineColor = _useCmpLinkAlarm.addCmpLinkOfflineStatusForDisplayLineColor;
|
112
114
|
|
113
|
-
var
|
115
|
+
var cmpRes = (0, _react.useMemo)(function () {
|
114
116
|
return addCmpLinkOfflineStatusForDisplayLineColor(oldResources, cmpLinkRunStatus);
|
115
|
-
}, [oldResources, cmpLinkRunStatus]); //
|
117
|
+
}, [oldResources, cmpLinkRunStatus]); // 拓扑链路特殊处理
|
118
|
+
|
119
|
+
var _useLinkAlarmDisplay = (0, _useLinkAlarmDisplay2["default"])({
|
120
|
+
topo: topo,
|
121
|
+
resources: cmpRes,
|
122
|
+
graphLoaded: graphLoaded,
|
123
|
+
alarmList: alarmList
|
124
|
+
}),
|
125
|
+
linkRunStatus = _useLinkAlarmDisplay.linkRunStatus,
|
126
|
+
getlinkAlarmLevels = _useLinkAlarmDisplay.getlinkAlarmLevels; // const resources = useMemo(() => addLinkOfflineStatusForDisplayLineColor(cmpRes, linkRunStatus), [cmpRes, linkRunStatus])
|
127
|
+
|
128
|
+
|
129
|
+
var linkAlarmLevels = getlinkAlarmLevels(alarmList, cmpRes); // 排除掉处于断开状态的链路
|
130
|
+
|
131
|
+
var resources = cmpRes.filter(function (item) {
|
132
|
+
return !item.breakState;
|
133
|
+
}); // ci告警级别
|
116
134
|
|
117
135
|
var cisEventLevel = (0, _react.useMemo)(function () {
|
118
|
-
var levels = [].concat(alarmList || [], cmpLinkAlarmLevels, risks.map(function (item) {
|
136
|
+
var levels = [].concat(alarmList || [], cmpLinkAlarmLevels, linkAlarmLevels, risks.map(function (item) {
|
119
137
|
var _item$resourceId;
|
120
138
|
|
121
139
|
return {
|
@@ -135,6 +153,16 @@ function useGraphAlarmDisplay(options) {
|
|
135
153
|
alarmSwitch: alarmSwitch,
|
136
154
|
cisEventLevel: cisEventLevel
|
137
155
|
});
|
156
|
+
setOffLinkColor();
|
157
|
+
|
158
|
+
function setOffLinkColor() {
|
159
|
+
oldResources.forEach(function (item) {
|
160
|
+
if (item.breakState) {
|
161
|
+
var element = topo.getDataModel().getDataByTag(item.id);
|
162
|
+
element === null || element === void 0 ? void 0 : element.s("edge.color", "#C9CED2");
|
163
|
+
}
|
164
|
+
});
|
165
|
+
}
|
138
166
|
|
139
167
|
function showAlarm() {
|
140
168
|
var _topo$historyManager, _topo$historyManager2;
|
@@ -161,19 +189,19 @@ function useGraphAlarmDisplay(options) {
|
|
161
189
|
var alarmLevel = (_elementsAlarmLevels$ = elementsAlarmLevels.find(function (item) {
|
162
190
|
return item.id === element.getTag() || item.elementId === element.getId();
|
163
191
|
})) === null || _elementsAlarmLevels$ === void 0 ? void 0 : _elementsAlarmLevels$.level;
|
164
|
-
element.a(
|
192
|
+
element.a("alarmLevel", alarmLevel);
|
165
193
|
});
|
166
194
|
|
167
|
-
_rlog["default"].debug(
|
195
|
+
_rlog["default"].debug("推送告警 => ht", {
|
168
196
|
alarms: elementsAlarmLevels,
|
169
197
|
relateTopoAlarmMap: relateTopoAlarm,
|
170
198
|
relateTopoAlarms: relateTopoAlarms
|
171
199
|
}); // 更新到ht拓扑
|
172
200
|
|
173
201
|
|
174
|
-
(_topo$historyManager = topo.historyManager) === null || _topo$historyManager === void 0 ? void 0 : _topo$historyManager.setDisabled(true,
|
202
|
+
(_topo$historyManager = topo.historyManager) === null || _topo$historyManager === void 0 ? void 0 : _topo$historyManager.setDisabled(true, "推送告警");
|
175
203
|
topo.view.loadAlarm(elementsAlarmLevels);
|
176
|
-
(_topo$historyManager2 = topo.historyManager) === null || _topo$historyManager2 === void 0 ? void 0 : _topo$historyManager2.setDisabled(false,
|
204
|
+
(_topo$historyManager2 = topo.historyManager) === null || _topo$historyManager2 === void 0 ? void 0 : _topo$historyManager2.setDisabled(false, "推送告警");
|
177
205
|
}
|
178
206
|
|
179
207
|
return function () {
|
@@ -0,0 +1,175 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4
|
+
|
5
|
+
exports.__esModule = true;
|
6
|
+
exports["default"] = useLinkAlarmDisplay;
|
7
|
+
|
8
|
+
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
9
|
+
|
10
|
+
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
11
|
+
|
12
|
+
var _react = require("react");
|
13
|
+
|
14
|
+
var _ahooks = require("ahooks");
|
15
|
+
|
16
|
+
var _lodash = _interopRequireDefault(require("lodash"));
|
17
|
+
|
18
|
+
var _DictCache = _interopRequireDefault(require("../models/cache/DictCache"));
|
19
|
+
|
20
|
+
function getLinkDev(datas) {
|
21
|
+
console.log("datas------------------", datas);
|
22
|
+
var linkDevDoc = {};
|
23
|
+
var linkIds = datas.filter(function (item) {
|
24
|
+
return item.ciType === "network_link";
|
25
|
+
}).map(function (item) {
|
26
|
+
linkDevDoc[item.id] = [item.source, item.target];
|
27
|
+
return item.id;
|
28
|
+
});
|
29
|
+
return {
|
30
|
+
linkIds: linkIds,
|
31
|
+
linkDevDoc: linkDevDoc
|
32
|
+
};
|
33
|
+
}
|
34
|
+
|
35
|
+
function getlinkAlarmLevels(alarmList, resources) {
|
36
|
+
var _getLinkDev = getLinkDev(resources),
|
37
|
+
linkDevDoc = _getLinkDev.linkDevDoc;
|
38
|
+
|
39
|
+
console.log("linkAlarmLevels-----------1", linkDevDoc, alarmList);
|
40
|
+
|
41
|
+
if (!alarmList) {
|
42
|
+
return [];
|
43
|
+
}
|
44
|
+
|
45
|
+
var alarms = alarmList.filter(function (alarm) {
|
46
|
+
return alarm.obj.alertTypeCode === "availAlert";
|
47
|
+
}).map(function (item) {
|
48
|
+
return item.id;
|
49
|
+
});
|
50
|
+
return Object.keys(linkDevDoc).filter(function (item) {
|
51
|
+
return _lodash["default"].intersection(linkDevDoc[item], alarms).length > 0;
|
52
|
+
}).map(function (item) {
|
53
|
+
return {
|
54
|
+
id: item,
|
55
|
+
level: 1
|
56
|
+
};
|
57
|
+
});
|
58
|
+
;
|
59
|
+
}
|
60
|
+
/**
|
61
|
+
* 处理链路显示
|
62
|
+
* @param {*} props
|
63
|
+
* @returns
|
64
|
+
*/
|
65
|
+
|
66
|
+
|
67
|
+
function useLinkAlarmDisplay(props) {
|
68
|
+
var topo = props.topo,
|
69
|
+
resources = props.resources,
|
70
|
+
graphLoaded = props.graphLoaded,
|
71
|
+
alarmList = props.alarmList;
|
72
|
+
|
73
|
+
var _useState = (0, _react.useState)(getLinkDev(resources).linkIds),
|
74
|
+
linkIds = _useState[0],
|
75
|
+
setLinkIds = _useState[1];
|
76
|
+
|
77
|
+
var _useState2 = (0, _react.useState)([]),
|
78
|
+
linkRunStatus = _useState2[0],
|
79
|
+
setLinkRunStatus = _useState2[1];
|
80
|
+
|
81
|
+
var _useState3 = (0, _react.useState)(getLinkDev(resources).linkDevDoc),
|
82
|
+
linkDev = _useState3[0],
|
83
|
+
setLinkDev = _useState3[1];
|
84
|
+
|
85
|
+
console.log("alarmList----------sssss", alarmList);
|
86
|
+
(0, _react.useEffect)(function () {
|
87
|
+
var ids = getLinkDev(resources).linkIds;
|
88
|
+
|
89
|
+
if (linkIds.join(",") !== ids.join(",")) {
|
90
|
+
setLinkIds(ids);
|
91
|
+
}
|
92
|
+
}, [resources]);
|
93
|
+
|
94
|
+
function getLinkRunStatus(_x) {
|
95
|
+
return _getLinkRunStatus.apply(this, arguments);
|
96
|
+
} // 轮询hooks
|
97
|
+
|
98
|
+
|
99
|
+
function _getLinkRunStatus() {
|
100
|
+
_getLinkRunStatus = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(ids) {
|
101
|
+
var _yield$Promise$all, ciMetricsResult;
|
102
|
+
|
103
|
+
return _regenerator["default"].wrap(function _callee$(_context) {
|
104
|
+
while (1) switch (_context.prev = _context.next) {
|
105
|
+
case 0:
|
106
|
+
if (ids.length) {
|
107
|
+
_context.next = 2;
|
108
|
+
break;
|
109
|
+
}
|
110
|
+
|
111
|
+
return _context.abrupt("return", []);
|
112
|
+
|
113
|
+
case 2:
|
114
|
+
_context.t0 = Promise;
|
115
|
+
_context.t1 = // 查询指标值
|
116
|
+
topo.serverApi.ciInfo.batchQueryCiInfo({
|
117
|
+
ciId: [],
|
118
|
+
codes: ["run_status", "remote_ping_status"],
|
119
|
+
relationId: ids.map(function (id) {
|
120
|
+
return {
|
121
|
+
ciId: id,
|
122
|
+
operation: "delete"
|
123
|
+
};
|
124
|
+
})
|
125
|
+
});
|
126
|
+
_context.next = 6;
|
127
|
+
return _DictCache["default"].init();
|
128
|
+
|
129
|
+
case 6:
|
130
|
+
_context.t2 = _context.sent;
|
131
|
+
_context.t3 = [_context.t1, _context.t2];
|
132
|
+
_context.next = 10;
|
133
|
+
return _context.t0.all.call(_context.t0, _context.t3);
|
134
|
+
|
135
|
+
case 10:
|
136
|
+
_yield$Promise$all = _context.sent;
|
137
|
+
ciMetricsResult = _yield$Promise$all[0];
|
138
|
+
console.log("getLinkRunStatus", ciMetricsResult);
|
139
|
+
return _context.abrupt("return", ciMetricsResult);
|
140
|
+
|
141
|
+
case 14:
|
142
|
+
case "end":
|
143
|
+
return _context.stop();
|
144
|
+
}
|
145
|
+
}, _callee);
|
146
|
+
}));
|
147
|
+
return _getLinkRunStatus.apply(this, arguments);
|
148
|
+
}
|
149
|
+
|
150
|
+
var _useRequest = (0, _ahooks.useRequest)(getLinkRunStatus, {
|
151
|
+
pollingInterval: 60 * 1000,
|
152
|
+
pollingWhenHidden: false,
|
153
|
+
// debounceInterval: 200,
|
154
|
+
manual: true,
|
155
|
+
onSuccess: function onSuccess(result) {
|
156
|
+
setLinkRunStatus(result.map(function (item) {
|
157
|
+
return {
|
158
|
+
id: item.id,
|
159
|
+
runStatus: item.metrics.run_status
|
160
|
+
};
|
161
|
+
}));
|
162
|
+
}
|
163
|
+
}),
|
164
|
+
run = _useRequest.run;
|
165
|
+
|
166
|
+
(0, _react.useEffect)(function () {
|
167
|
+
if (graphLoaded) {
|
168
|
+
run(linkIds);
|
169
|
+
}
|
170
|
+
}, [graphLoaded, linkIds]);
|
171
|
+
return {
|
172
|
+
linkRunStatus: linkRunStatus,
|
173
|
+
getlinkAlarmLevels: getlinkAlarmLevels
|
174
|
+
};
|
175
|
+
}
|
@@ -12,6 +12,7 @@ var _react = require("react");
|
|
12
12
|
var _useTopoEventListener = _interopRequireDefault(require("./useTopoEventListener"));
|
13
13
|
|
14
14
|
ht.Default.setImage('resource.subIcon.unMoniter', '/img/topo/alarmStatusIcon/未监控.svg');
|
15
|
+
ht.Default.setImage('resource.link.linkbreak', '/img/topo/link-break.svg');
|
15
16
|
/**
|
16
17
|
* 监听监控状态推送
|
17
18
|
* 节点、连线监控状态置灰
|