@riil-frontend/component-topology 12.0.0-dev.25 → 12.0.0-dev.28
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 +2 -2
- package/es/core/hooks/useAlarm.js +119 -82
- package/es/core/hooks/useCmpLinkAlarm.js +62 -0
- package/es/core/hooks/useEventData.js +1 -2
- package/es/core/hooks/useGraphAlarmDisplay.js +34 -23
- package/es/core/models/Alarm.js +60 -145
- package/es/core/models/AttributeMetricDisplay.js +1 -1
- package/es/core/models/TopoApp.js +1 -1
- package/es/core/viewer/components/titlebar/widgets/AlarmButton.js +1 -5
- package/es/utils/ciRefAttributeTranslateUtil.js +1 -1
- package/lib/core/hooks/useAlarm.js +118 -80
- package/lib/core/hooks/useCmpLinkAlarm.js +71 -0
- package/lib/core/hooks/useEventData.js +1 -2
- package/lib/core/hooks/useGraphAlarmDisplay.js +34 -22
- package/lib/core/models/Alarm.js +60 -147
- package/lib/core/models/AttributeMetricDisplay.js +1 -1
- package/lib/core/models/TopoApp.js +1 -1
- package/lib/core/viewer/components/titlebar/widgets/AlarmButton.js +1 -5
- package/lib/utils/ciRefAttributeTranslateUtil.js +1 -1
- package/package.json +2 -2
@@ -2,128 +2,165 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import { useEffect } from "react";
|
3
3
|
import rlog from "@riil-frontend/component-topology-utils/es/rlog";
|
4
4
|
import useGraphAlarmDisplay from "./useGraphAlarmDisplay";
|
5
|
-
import useTopoEventListener from "./useTopoEventListener";
|
5
|
+
import useTopoEventListener from "./useTopoEventListener"; // 告警在活状态
|
6
|
+
|
7
|
+
var showAlarmStatus = ["toDeal", "dealing", "change", "woDealing"];
|
6
8
|
/**
|
7
|
-
*
|
8
|
-
*
|
9
|
-
* @
|
9
|
+
* 告警是否在活
|
10
|
+
* @param {*} alarm
|
11
|
+
* @returns
|
10
12
|
*/
|
11
13
|
|
12
|
-
|
13
|
-
|
14
|
-
|
14
|
+
var isAlarmAlive = function isAlarmAlive(alarm) {
|
15
|
+
return showAlarmStatus.indexOf(alarm.status) >= 0;
|
16
|
+
};
|
15
17
|
|
16
|
-
|
17
|
-
|
18
|
-
alarmListDefaultOpen = _topo$store$useModelS.alarmListDefaultOpen;
|
18
|
+
var handleRiskData = function handleRiskData(topo, receivedData) {
|
19
|
+
var _risks, _topo$viewProps, _topo$viewProps2;
|
19
20
|
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
|
21
|
+
// 非在活状态:
|
22
|
+
// 已修复 recovered
|
23
|
+
// 已关闭 closed
|
24
|
+
var prevRisks = topo.store.getModelState('topoAlarm').risks;
|
25
|
+
|
26
|
+
var isLiveRisk = function isLiveRisk(data) {
|
27
|
+
return ['recovered', 'closed'].indexOf(data.status) === -1;
|
28
|
+
};
|
24
29
|
|
25
|
-
var
|
26
|
-
var
|
30
|
+
var hasCiPermission = function hasCiPermission(data) {
|
31
|
+
var _data$resourceId;
|
27
32
|
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
33
|
+
var ciId = (_data$resourceId = data.resourceId) !== null && _data$resourceId !== void 0 ? _data$resourceId : data.ciId;
|
34
|
+
var ci = topo.dataModel.getDataById(ciId);
|
35
|
+
return !!(ci !== null && ci !== void 0 && ci.operation);
|
36
|
+
}; // 合并
|
32
37
|
|
33
|
-
var isLiveRisk = function isLiveRisk(data) {
|
34
|
-
return ['recovered', 'closed'].indexOf(data.status) === -1;
|
35
|
-
};
|
36
38
|
|
37
|
-
|
38
|
-
|
39
|
+
var risks = prevRisks.map(function (risk) {
|
40
|
+
var newRisk = receivedData.find(function (item) {
|
41
|
+
return item.id === risk.id;
|
42
|
+
});
|
43
|
+
return newRisk || risk;
|
44
|
+
}); // 新的
|
39
45
|
|
40
|
-
|
41
|
-
|
42
|
-
return
|
43
|
-
};
|
46
|
+
var addRisks = receivedData.filter(function (risk) {
|
47
|
+
return !prevRisks.find(function (item) {
|
48
|
+
return item.id === risk.id;
|
49
|
+
});
|
50
|
+
}).filter(hasCiPermission);
|
44
51
|
|
52
|
+
(_risks = risks).push.apply(_risks, addRisks); // 过滤掉无权限、非在活的
|
45
53
|
|
46
|
-
var risks = prevRisks.map(function (risk) {
|
47
|
-
var newRisk = receivedData.find(function (item) {
|
48
|
-
return item.id === risk.id;
|
49
|
-
});
|
50
|
-
return newRisk || risk;
|
51
|
-
}); // 新的
|
52
54
|
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
|
55
|
+
risks = risks.filter(isLiveRisk).filter(hasCiPermission).sort(function (a, b) {
|
56
|
+
return a.executeTime - b.executeTime;
|
57
|
+
});
|
58
|
+
rlog.debug('更新风险', {
|
59
|
+
prevRisks: prevRisks,
|
60
|
+
receivedData: receivedData,
|
61
|
+
risks: risks
|
62
|
+
});
|
63
|
+
topo.store.getModelDispatchers('topoAlarm').update({
|
64
|
+
risks: risks
|
65
|
+
}); // 获取配置
|
58
66
|
|
59
|
-
|
67
|
+
var _topo$store$getModelS = topo.store.getModelState('displayConfig'),
|
68
|
+
alarmSwitch = _topo$store$getModelS.alarmSwitch,
|
69
|
+
alarmListDefaultOpen = _topo$store$getModelS.alarmListDefaultOpen; // 告警静默
|
60
70
|
|
61
71
|
|
62
|
-
|
63
|
-
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
69
|
-
|
70
|
-
topo.store.getModelDispatchers('topoAlarm').update({
|
71
|
-
risks: risks
|
72
|
+
if (alarmSwitch === false) {
|
73
|
+
return;
|
74
|
+
} // 告警列表
|
75
|
+
|
76
|
+
|
77
|
+
if (addRisks.length && alarmListDefaultOpen) {
|
78
|
+
topo.alarm.updateState({
|
79
|
+
alarmPanelIsOpen: true
|
72
80
|
});
|
81
|
+
}
|
73
82
|
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
}
|
83
|
+
if ((_topo$viewProps = topo.viewProps) !== null && _topo$viewProps !== void 0 && _topo$viewProps.onRisk) {
|
84
|
+
topo.viewProps.onRisk(risks);
|
85
|
+
}
|
78
86
|
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
}
|
87
|
+
if ((_topo$viewProps2 = topo.viewProps) !== null && _topo$viewProps2 !== void 0 && _topo$viewProps2.onResourceEvent) {
|
88
|
+
topo.viewProps.onResourceEvent(topo.alarm.getEvents());
|
89
|
+
}
|
90
|
+
};
|
84
91
|
|
85
|
-
|
86
|
-
|
87
|
-
}
|
92
|
+
var handleRelateTopoAlarm = function handleRelateTopoAlarm(topo, data) {
|
93
|
+
var relateTopoAlarm = _extends({}, topo.store.getModelState('topoAlarm').relateTopoAlarm);
|
88
94
|
|
89
|
-
|
90
|
-
|
91
|
-
|
92
|
-
|
95
|
+
data.forEach(function (item) {
|
96
|
+
relateTopoAlarm[item.topoId] = item.alertLevel;
|
97
|
+
});
|
98
|
+
topo.store.getModelDispatchers('topoAlarm').update({
|
99
|
+
relateTopoAlarm: relateTopoAlarm
|
100
|
+
});
|
101
|
+
rlog.debug("\u5173\u8054\u62D3\u6251\u544A\u8B66\uFF1A\u6536\u5230 " + data.length, {
|
102
|
+
received: data,
|
103
|
+
all: relateTopoAlarm
|
104
|
+
});
|
105
|
+
};
|
106
|
+
/**
|
107
|
+
* 处理分级告警
|
108
|
+
* @param {*} alarms
|
109
|
+
* @returns
|
110
|
+
*/
|
93
111
|
|
94
|
-
var handleRelateTopoAlarm = function handleRelateTopoAlarm(data) {
|
95
|
-
var relateTopoAlarm = _extends({}, topo.store.getModelState('topoAlarm').relateTopoAlarm);
|
96
112
|
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
113
|
+
function convertAlarmData(alarms) {
|
114
|
+
return alarms.map(function (alarm) {
|
115
|
+
var resourceId = alarm.resourceId; // 分级资源id转换
|
116
|
+
|
117
|
+
if (alarm.cmpAlertId) {
|
118
|
+
resourceId = "sub:" + alarm.mainCiId;
|
119
|
+
}
|
120
|
+
|
121
|
+
return _extends({}, alarm, {
|
122
|
+
// 数据id
|
123
|
+
resourceId: resourceId,
|
124
|
+
// 是否在活
|
125
|
+
alive: isAlarmAlive(alarm)
|
106
126
|
});
|
107
|
-
};
|
127
|
+
});
|
128
|
+
}
|
129
|
+
/**
|
130
|
+
*
|
131
|
+
*
|
132
|
+
* @param {*} options
|
133
|
+
*/
|
134
|
+
|
135
|
+
|
136
|
+
export default function useAlarm(options) {
|
137
|
+
var topo = options.topo;
|
138
|
+
|
139
|
+
var _topo$store$useModelS = topo.store.useModelState('displayConfig'),
|
140
|
+
alarmSwitch = _topo$store$useModelS.alarmSwitch;
|
108
141
|
|
142
|
+
useGraphAlarmDisplay({
|
143
|
+
topo: topo,
|
144
|
+
alarmSwitch: alarmSwitch
|
145
|
+
}); // 订阅消息
|
109
146
|
|
110
147
|
useTopoEventListener({
|
111
148
|
type: 'alarm',
|
112
149
|
onMessage: function onMessage(data) {
|
113
150
|
rlog.debug("Topoget--AlertMesage------------", topo, data);
|
114
|
-
topo.alarm.handleAlarmEvent(data);
|
151
|
+
topo.alarm.handleAlarmEvent(convertAlarmData(data));
|
115
152
|
}
|
116
153
|
});
|
117
154
|
useTopoEventListener({
|
118
155
|
type: 'risk',
|
119
156
|
onMessage: function onMessage(data) {
|
120
|
-
handleRiskData(data);
|
157
|
+
handleRiskData(topo, data);
|
121
158
|
}
|
122
159
|
});
|
123
160
|
useTopoEventListener({
|
124
161
|
type: 'relateTopoAlarm',
|
125
162
|
onMessage: function onMessage(data) {
|
126
|
-
handleRelateTopoAlarm(data);
|
163
|
+
handleRelateTopoAlarm(topo, data);
|
127
164
|
}
|
128
165
|
});
|
129
166
|
}
|
@@ -0,0 +1,62 @@
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
2
|
+
import { useEffect, useMemo } from "react";
|
3
|
+
|
4
|
+
function addCmpLinkOfflineStatusForDisplayLineColor(cis, cmpLinkRunStatusList) {
|
5
|
+
return cis.map(function (ci) {
|
6
|
+
var cmpLinkRunStatusData = cmpLinkRunStatusList.find(function (item) {
|
7
|
+
return item.id === ci.id;
|
8
|
+
});
|
9
|
+
|
10
|
+
if (cmpLinkRunStatusData) {
|
11
|
+
return _extends({}, ci, {
|
12
|
+
manageStatus: cmpLinkRunStatusData.runStatus === '2' ? 0 : 3
|
13
|
+
});
|
14
|
+
}
|
15
|
+
|
16
|
+
return ci;
|
17
|
+
});
|
18
|
+
}
|
19
|
+
/**
|
20
|
+
* 分级链路下級鏈路
|
21
|
+
* @param {*} props
|
22
|
+
* @returns
|
23
|
+
*/
|
24
|
+
|
25
|
+
|
26
|
+
export default function useCmpLinkAlarm(props) {
|
27
|
+
var topo = props.topo;
|
28
|
+
|
29
|
+
var _topo$store$useModelS = topo.store.useModelState('topoBizMod'),
|
30
|
+
attrsAndMetrics = _topo$store$useModelS.attrsAndMetrics;
|
31
|
+
|
32
|
+
var cmpLinks = useMemo(function () {
|
33
|
+
return attrsAndMetrics.filter(function (item) {
|
34
|
+
return item.typeCode === 'network_link';
|
35
|
+
});
|
36
|
+
}, [attrsAndMetrics]);
|
37
|
+
var cmpLinkRunStatus = useMemo(function () {
|
38
|
+
return cmpLinks.map(function (item) {
|
39
|
+
return {
|
40
|
+
id: item.id,
|
41
|
+
runStatus: item.metrics.run_status
|
42
|
+
};
|
43
|
+
});
|
44
|
+
}, [cmpLinks]);
|
45
|
+
var cmpLinkAlarmLevels = useMemo(function () {
|
46
|
+
return cmpLinkRunStatus // 3:fault:重要故障; 4:urgently:紧急故障 』为红色
|
47
|
+
.filter(function (item) {
|
48
|
+
return ['3', '4'].includes(item.runStatus);
|
49
|
+
}).map(function (item) {
|
50
|
+
return {
|
51
|
+
id: item.id,
|
52
|
+
level: 1
|
53
|
+
};
|
54
|
+
});
|
55
|
+
}, [cmpLinkRunStatus]);
|
56
|
+
return {
|
57
|
+
cmpLinkRunStatus: cmpLinkRunStatus,
|
58
|
+
cmpLinkAlarmLevels: cmpLinkAlarmLevels,
|
59
|
+
addCmpLinkOfflineStatusForDisplayLineColor: addCmpLinkOfflineStatusForDisplayLineColor
|
60
|
+
};
|
61
|
+
}
|
62
|
+
;
|
@@ -1,7 +1,6 @@
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
2
2
|
export default function useEventData(props) {
|
3
|
-
var topo = props.topo;
|
4
|
-
var topoDatas = topo.dataModel.useDatas();
|
3
|
+
var topo = props.topo; // const topoDatas = topo.dataModel.useDatas()
|
5
4
|
|
6
5
|
var _topo$store$useModelS = topo.store.useModelState('topoAlarm'),
|
7
6
|
risks = _topo$store$useModelS.risks,
|
@@ -1,7 +1,8 @@
|
|
1
|
-
import { useEffect } from "react";
|
1
|
+
import { useEffect, useMemo } from "react";
|
2
2
|
import rlog from "@riil-frontend/component-topology-utils/es/rlog";
|
3
3
|
import { getElements } from "../../utils/htElementUtils";
|
4
4
|
import { removeManageStatus, showManageStatus } from "../utils/showGraphManageStatusUtil";
|
5
|
+
import useCmpLinkAlarm from "./useCmpLinkAlarm";
|
5
6
|
/**
|
6
7
|
* 获取ci的最高告警级别
|
7
8
|
* @param {Array} alarmList
|
@@ -9,16 +10,9 @@ import { removeManageStatus, showManageStatus } from "../utils/showGraphManageSt
|
|
9
10
|
* @returns
|
10
11
|
*/
|
11
12
|
|
12
|
-
function getCiAlarmLevelMap(alarmList
|
13
|
+
function getCiAlarmLevelMap(alarmList) {
|
13
14
|
var ciIdLevelMap = {};
|
14
|
-
|
15
|
-
var _item$resourceId;
|
16
|
-
|
17
|
-
return {
|
18
|
-
id: (_item$resourceId = item.resourceId) !== null && _item$resourceId !== void 0 ? _item$resourceId : item.ciId,
|
19
|
-
level: 5
|
20
|
-
};
|
21
|
-
})).forEach(function (item) {
|
15
|
+
alarmList.forEach(function (item) {
|
22
16
|
var level = ciIdLevelMap[item.id]; // 优先显示高等级告警。值小的等级高
|
23
17
|
|
24
18
|
if (!level || item.level < level) {
|
@@ -30,8 +24,8 @@ function getCiAlarmLevelMap(alarmList, risks) {
|
|
30
24
|
return ciIdLevelMap;
|
31
25
|
}
|
32
26
|
|
33
|
-
function getGraphCiElementAlarmLevels(resources, alarmList
|
34
|
-
var ciIdLevelMap = getCiAlarmLevelMap(alarmList
|
27
|
+
function getGraphCiElementAlarmLevels(resources, alarmList) {
|
28
|
+
var ciIdLevelMap = getCiAlarmLevelMap(alarmList);
|
35
29
|
return Object.keys(ciIdLevelMap).map(function (id) {
|
36
30
|
return {
|
37
31
|
id: id,
|
@@ -94,12 +88,30 @@ export default function useGraphAlarmDisplay(options) {
|
|
94
88
|
risks = _topo$alarm$useState.risks,
|
95
89
|
relateTopoAlarm = _topo$alarm$useState.relateTopoAlarm;
|
96
90
|
|
97
|
-
var
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
}
|
102
|
-
|
91
|
+
var oldResources = topo.dataModel.useCis(); // 分级拓扑下级链路特殊处理
|
92
|
+
|
93
|
+
var _useCmpLinkAlarm = useCmpLinkAlarm({
|
94
|
+
topo: topo
|
95
|
+
}),
|
96
|
+
cmpLinkAlarmLevels = _useCmpLinkAlarm.cmpLinkAlarmLevels,
|
97
|
+
cmpLinkRunStatus = _useCmpLinkAlarm.cmpLinkRunStatus,
|
98
|
+
addCmpLinkOfflineStatusForDisplayLineColor = _useCmpLinkAlarm.addCmpLinkOfflineStatusForDisplayLineColor;
|
99
|
+
|
100
|
+
var resources = useMemo(function () {
|
101
|
+
return addCmpLinkOfflineStatusForDisplayLineColor(oldResources, cmpLinkRunStatus);
|
102
|
+
}, [oldResources, cmpLinkRunStatus]); // ci告警级别
|
103
|
+
|
104
|
+
var cisEventLevel = useMemo(function () {
|
105
|
+
var levels = [].concat(alarmList || [], cmpLinkAlarmLevels, risks.map(function (item) {
|
106
|
+
var _item$resourceId;
|
107
|
+
|
108
|
+
return {
|
109
|
+
id: (_item$resourceId = item.resourceId) !== null && _item$resourceId !== void 0 ? _item$resourceId : item.ciId,
|
110
|
+
level: 5
|
111
|
+
};
|
112
|
+
}));
|
113
|
+
return getGraphCiElementAlarmLevels(resources, levels);
|
114
|
+
}, [resources, alarmList, cmpLinkAlarmLevels, risks]);
|
103
115
|
useEffect(function () {
|
104
116
|
showAlarm();
|
105
117
|
showManageStatus({
|
@@ -108,7 +120,7 @@ export default function useGraphAlarmDisplay(options) {
|
|
108
120
|
isEditMode: isEditMode,
|
109
121
|
graphLoaded: graphLoaded,
|
110
122
|
alarmSwitch: alarmSwitch,
|
111
|
-
cisEventLevel:
|
123
|
+
cisEventLevel: cisEventLevel
|
112
124
|
});
|
113
125
|
|
114
126
|
function showAlarm() {
|
@@ -120,12 +132,11 @@ export default function useGraphAlarmDisplay(options) {
|
|
120
132
|
// 告警静默
|
121
133
|
topo.view.loadAlarm([]);
|
122
134
|
return;
|
123
|
-
}
|
135
|
+
} // 关联拓扑告警
|
124
136
|
|
125
|
-
var finalAlarms = getCisEventLevel(); // 关联拓扑告警
|
126
137
|
|
127
138
|
var relateTopoAlarms = getRelateTopoNodeAlarmLevels(topo, relateTopoAlarm);
|
128
|
-
var elementsAlarmLevels = [].concat(
|
139
|
+
var elementsAlarmLevels = [].concat(cisEventLevel, relateTopoAlarms); // 将告警级别放入ht元素,便于测试
|
129
140
|
|
130
141
|
getElements(topo.getDataModel()).filter(function (item) {
|
131
142
|
return !!item.getTag();
|
@@ -152,5 +163,5 @@ export default function useGraphAlarmDisplay(options) {
|
|
152
163
|
resources: resources
|
153
164
|
});
|
154
165
|
};
|
155
|
-
}, [graphLoaded, resources, alarmSwitch,
|
166
|
+
}, [graphLoaded, resources, alarmSwitch, cisEventLevel, relateTopoAlarm]);
|
156
167
|
}
|