@riil-frontend/component-topology 13.0.0-dev.16 → 13.0.0-dev.17
Sign up to get free protection for your applications and to get access to all the features.
- package/build/index.js +12 -12
- 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/models/TopoApp.js +1 -1
- package/es/core/models/utils/linkUtils.js +1 -0
- package/es/core/utils/edgeUtil.js +1 -1
- package/es/core/utils/graphLinkUtil.js +1 -0
- 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/models/TopoApp.js +1 -1
- package/lib/core/models/utils/linkUtils.js +1 -0
- package/lib/core/utils/edgeUtil.js +1 -1
- package/lib/core/utils/graphLinkUtil.js +1 -0
- package/package.json +2 -2
@@ -3,11 +3,12 @@ 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
5
|
import useCmpLinkAlarm from "./useCmpLinkAlarm";
|
6
|
+
import useLinkAlarmDisplay from "./useLinkAlarmDisplay";
|
6
7
|
/**
|
7
8
|
* 获取ci的最高告警级别
|
8
|
-
* @param {Array} alarmList
|
9
|
-
* @param {*} risks
|
10
|
-
* @returns
|
9
|
+
* @param {Array} alarmList
|
10
|
+
* @param {*} risks
|
11
|
+
* @returns
|
11
12
|
*/
|
12
13
|
|
13
14
|
function getCiAlarmLevelMap(alarmList) {
|
@@ -40,9 +41,9 @@ function getGraphCiElementAlarmLevels(resources, alarmList) {
|
|
40
41
|
}
|
41
42
|
/**
|
42
43
|
* 获得关联拓扑节点告警级别
|
43
|
-
* @param {*} topo
|
44
|
-
* @param {*} relateTopoAlarm
|
45
|
-
* @returns
|
44
|
+
* @param {*} topo
|
45
|
+
* @param {*} relateTopoAlarm
|
46
|
+
* @returns
|
46
47
|
*/
|
47
48
|
|
48
49
|
|
@@ -50,7 +51,7 @@ function getRelateTopoNodeAlarmLevels(topo, relateTopoAlarm) {
|
|
50
51
|
return Object.keys(relateTopoAlarm).map(function (topoId) {
|
51
52
|
var level = relateTopoAlarm[topoId];
|
52
53
|
var relateTopoNode = topo.getDataModel().getDatas().toArray().find(function (node) {
|
53
|
-
return "" + node.a(
|
54
|
+
return "" + node.a("bindTopo") === "" + topoId;
|
54
55
|
});
|
55
56
|
|
56
57
|
if (!level || !relateTopoNode) {
|
@@ -70,18 +71,18 @@ function getRelateTopoNodeAlarmLevels(topo, relateTopoAlarm) {
|
|
70
71
|
function getGraphElementAlarmLevels(resources) {}
|
71
72
|
/**
|
72
73
|
* 告警显示到ht拓扑
|
73
|
-
*
|
74
|
-
* @param {*} options
|
74
|
+
*
|
75
|
+
* @param {*} options
|
75
76
|
*/
|
76
77
|
|
77
78
|
|
78
79
|
export default function useGraphAlarmDisplay(options) {
|
79
80
|
var topo = options.topo,
|
80
81
|
alarmSwitch = options.alarmSwitch;
|
81
|
-
var topoState = topo.store.useModelState(
|
82
|
+
var topoState = topo.store.useModelState("topoMod");
|
82
83
|
var graphLoaded = topoState.graphLoaded,
|
83
84
|
viewState = topoState.viewState;
|
84
|
-
var isEditMode = viewState ===
|
85
|
+
var isEditMode = viewState === "edit";
|
85
86
|
|
86
87
|
var _topo$alarm$useState = topo.alarm.useState(),
|
87
88
|
alarmList = _topo$alarm$useState.alarmList,
|
@@ -99,12 +100,28 @@ export default function useGraphAlarmDisplay(options) {
|
|
99
100
|
cmpLinkRunStatus = _useCmpLinkAlarm.cmpLinkRunStatus,
|
100
101
|
addCmpLinkOfflineStatusForDisplayLineColor = _useCmpLinkAlarm.addCmpLinkOfflineStatusForDisplayLineColor;
|
101
102
|
|
102
|
-
var
|
103
|
+
var cmpRes = useMemo(function () {
|
103
104
|
return addCmpLinkOfflineStatusForDisplayLineColor(oldResources, cmpLinkRunStatus);
|
104
|
-
}, [oldResources, cmpLinkRunStatus]); //
|
105
|
+
}, [oldResources, cmpLinkRunStatus]); // 拓扑链路特殊处理
|
106
|
+
|
107
|
+
var _useLinkAlarmDisplay = useLinkAlarmDisplay({
|
108
|
+
topo: topo,
|
109
|
+
resources: cmpRes,
|
110
|
+
graphLoaded: graphLoaded,
|
111
|
+
alarmList: alarmList
|
112
|
+
}),
|
113
|
+
linkRunStatus = _useLinkAlarmDisplay.linkRunStatus,
|
114
|
+
getlinkAlarmLevels = _useLinkAlarmDisplay.getlinkAlarmLevels; // const resources = useMemo(() => addLinkOfflineStatusForDisplayLineColor(cmpRes, linkRunStatus), [cmpRes, linkRunStatus])
|
115
|
+
|
116
|
+
|
117
|
+
var linkAlarmLevels = getlinkAlarmLevels(alarmList, cmpRes); // 排除掉处于断开状态的链路
|
118
|
+
|
119
|
+
var resources = cmpRes.filter(function (item) {
|
120
|
+
return !item.breakState;
|
121
|
+
}); // ci告警级别
|
105
122
|
|
106
123
|
var cisEventLevel = useMemo(function () {
|
107
|
-
var levels = [].concat(alarmList || [], cmpLinkAlarmLevels, risks.map(function (item) {
|
124
|
+
var levels = [].concat(alarmList || [], cmpLinkAlarmLevels, linkAlarmLevels, risks.map(function (item) {
|
108
125
|
var _item$resourceId;
|
109
126
|
|
110
127
|
return {
|
@@ -124,6 +141,16 @@ export default function useGraphAlarmDisplay(options) {
|
|
124
141
|
alarmSwitch: alarmSwitch,
|
125
142
|
cisEventLevel: cisEventLevel
|
126
143
|
});
|
144
|
+
setOffLinkColor();
|
145
|
+
|
146
|
+
function setOffLinkColor() {
|
147
|
+
oldResources.forEach(function (item) {
|
148
|
+
if (item.breakState) {
|
149
|
+
var element = topo.getDataModel().getDataByTag(item.id);
|
150
|
+
element === null || element === void 0 ? void 0 : element.s("edge.color", "#C9CED2");
|
151
|
+
}
|
152
|
+
});
|
153
|
+
}
|
127
154
|
|
128
155
|
function showAlarm() {
|
129
156
|
var _topo$historyManager, _topo$historyManager2;
|
@@ -150,17 +177,17 @@ export default function useGraphAlarmDisplay(options) {
|
|
150
177
|
var alarmLevel = (_elementsAlarmLevels$ = elementsAlarmLevels.find(function (item) {
|
151
178
|
return item.id === element.getTag() || item.elementId === element.getId();
|
152
179
|
})) === null || _elementsAlarmLevels$ === void 0 ? void 0 : _elementsAlarmLevels$.level;
|
153
|
-
element.a(
|
180
|
+
element.a("alarmLevel", alarmLevel);
|
154
181
|
});
|
155
|
-
rlog.debug(
|
182
|
+
rlog.debug("推送告警 => ht", {
|
156
183
|
alarms: elementsAlarmLevels,
|
157
184
|
relateTopoAlarmMap: relateTopoAlarm,
|
158
185
|
relateTopoAlarms: relateTopoAlarms
|
159
186
|
}); // 更新到ht拓扑
|
160
187
|
|
161
|
-
(_topo$historyManager = topo.historyManager) === null || _topo$historyManager === void 0 ? void 0 : _topo$historyManager.setDisabled(true,
|
188
|
+
(_topo$historyManager = topo.historyManager) === null || _topo$historyManager === void 0 ? void 0 : _topo$historyManager.setDisabled(true, "推送告警");
|
162
189
|
topo.view.loadAlarm(elementsAlarmLevels);
|
163
|
-
(_topo$historyManager2 = topo.historyManager) === null || _topo$historyManager2 === void 0 ? void 0 : _topo$historyManager2.setDisabled(false,
|
190
|
+
(_topo$historyManager2 = topo.historyManager) === null || _topo$historyManager2 === void 0 ? void 0 : _topo$historyManager2.setDisabled(false, "推送告警");
|
164
191
|
}
|
165
192
|
|
166
193
|
return function () {
|
@@ -0,0 +1,163 @@
|
|
1
|
+
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
|
2
|
+
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
3
|
+
import { useEffect, useState, useMemo } from "react";
|
4
|
+
import { useRequest } from "ahooks";
|
5
|
+
import _ from "lodash";
|
6
|
+
import DictCache from "../models/cache/DictCache";
|
7
|
+
|
8
|
+
function getLinkDev(datas) {
|
9
|
+
console.log("datas------------------", datas);
|
10
|
+
var linkDevDoc = {};
|
11
|
+
var linkIds = datas.filter(function (item) {
|
12
|
+
return item.ciType === "network_link";
|
13
|
+
}).map(function (item) {
|
14
|
+
linkDevDoc[item.id] = [item.source, item.target];
|
15
|
+
return item.id;
|
16
|
+
});
|
17
|
+
return {
|
18
|
+
linkIds: linkIds,
|
19
|
+
linkDevDoc: linkDevDoc
|
20
|
+
};
|
21
|
+
}
|
22
|
+
|
23
|
+
function getlinkAlarmLevels(alarmList, resources) {
|
24
|
+
var _getLinkDev = getLinkDev(resources),
|
25
|
+
linkDevDoc = _getLinkDev.linkDevDoc;
|
26
|
+
|
27
|
+
console.log("linkAlarmLevels-----------1", linkDevDoc, alarmList);
|
28
|
+
|
29
|
+
if (!alarmList) {
|
30
|
+
return [];
|
31
|
+
}
|
32
|
+
|
33
|
+
var alarms = alarmList.filter(function (alarm) {
|
34
|
+
return alarm.obj.alertTypeCode === "availAlert";
|
35
|
+
}).map(function (item) {
|
36
|
+
return item.id;
|
37
|
+
});
|
38
|
+
return Object.keys(linkDevDoc).filter(function (item) {
|
39
|
+
return _.intersection(linkDevDoc[item], alarms).length > 0;
|
40
|
+
}).map(function (item) {
|
41
|
+
return {
|
42
|
+
id: item,
|
43
|
+
level: 1
|
44
|
+
};
|
45
|
+
});
|
46
|
+
;
|
47
|
+
}
|
48
|
+
/**
|
49
|
+
* 处理链路显示
|
50
|
+
* @param {*} props
|
51
|
+
* @returns
|
52
|
+
*/
|
53
|
+
|
54
|
+
|
55
|
+
export default function useLinkAlarmDisplay(props) {
|
56
|
+
var topo = props.topo,
|
57
|
+
resources = props.resources,
|
58
|
+
graphLoaded = props.graphLoaded,
|
59
|
+
alarmList = props.alarmList;
|
60
|
+
|
61
|
+
var _useState = useState(getLinkDev(resources).linkIds),
|
62
|
+
linkIds = _useState[0],
|
63
|
+
setLinkIds = _useState[1];
|
64
|
+
|
65
|
+
var _useState2 = useState([]),
|
66
|
+
linkRunStatus = _useState2[0],
|
67
|
+
setLinkRunStatus = _useState2[1];
|
68
|
+
|
69
|
+
var _useState3 = useState(getLinkDev(resources).linkDevDoc),
|
70
|
+
linkDev = _useState3[0],
|
71
|
+
setLinkDev = _useState3[1];
|
72
|
+
|
73
|
+
console.log("alarmList----------sssss", alarmList);
|
74
|
+
useEffect(function () {
|
75
|
+
var ids = getLinkDev(resources).linkIds;
|
76
|
+
|
77
|
+
if (linkIds.join(",") !== ids.join(",")) {
|
78
|
+
setLinkIds(ids);
|
79
|
+
}
|
80
|
+
}, [resources]);
|
81
|
+
|
82
|
+
function getLinkRunStatus(_x) {
|
83
|
+
return _getLinkRunStatus.apply(this, arguments);
|
84
|
+
} // 轮询hooks
|
85
|
+
|
86
|
+
|
87
|
+
function _getLinkRunStatus() {
|
88
|
+
_getLinkRunStatus = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(ids) {
|
89
|
+
var _yield$Promise$all, ciMetricsResult;
|
90
|
+
|
91
|
+
return _regeneratorRuntime.wrap(function _callee$(_context) {
|
92
|
+
while (1) switch (_context.prev = _context.next) {
|
93
|
+
case 0:
|
94
|
+
if (ids.length) {
|
95
|
+
_context.next = 2;
|
96
|
+
break;
|
97
|
+
}
|
98
|
+
|
99
|
+
return _context.abrupt("return", []);
|
100
|
+
|
101
|
+
case 2:
|
102
|
+
_context.t0 = Promise;
|
103
|
+
_context.t1 = // 查询指标值
|
104
|
+
topo.serverApi.ciInfo.batchQueryCiInfo({
|
105
|
+
ciId: [],
|
106
|
+
codes: ["run_status", "remote_ping_status"],
|
107
|
+
relationId: ids.map(function (id) {
|
108
|
+
return {
|
109
|
+
ciId: id,
|
110
|
+
operation: "delete"
|
111
|
+
};
|
112
|
+
})
|
113
|
+
});
|
114
|
+
_context.next = 6;
|
115
|
+
return DictCache.init();
|
116
|
+
|
117
|
+
case 6:
|
118
|
+
_context.t2 = _context.sent;
|
119
|
+
_context.t3 = [_context.t1, _context.t2];
|
120
|
+
_context.next = 10;
|
121
|
+
return _context.t0.all.call(_context.t0, _context.t3);
|
122
|
+
|
123
|
+
case 10:
|
124
|
+
_yield$Promise$all = _context.sent;
|
125
|
+
ciMetricsResult = _yield$Promise$all[0];
|
126
|
+
console.log("getLinkRunStatus", ciMetricsResult);
|
127
|
+
return _context.abrupt("return", ciMetricsResult);
|
128
|
+
|
129
|
+
case 14:
|
130
|
+
case "end":
|
131
|
+
return _context.stop();
|
132
|
+
}
|
133
|
+
}, _callee);
|
134
|
+
}));
|
135
|
+
return _getLinkRunStatus.apply(this, arguments);
|
136
|
+
}
|
137
|
+
|
138
|
+
var _useRequest = useRequest(getLinkRunStatus, {
|
139
|
+
pollingInterval: 60 * 1000,
|
140
|
+
pollingWhenHidden: false,
|
141
|
+
// debounceInterval: 200,
|
142
|
+
manual: true,
|
143
|
+
onSuccess: function onSuccess(result) {
|
144
|
+
setLinkRunStatus(result.map(function (item) {
|
145
|
+
return {
|
146
|
+
id: item.id,
|
147
|
+
runStatus: item.metrics.run_status
|
148
|
+
};
|
149
|
+
}));
|
150
|
+
}
|
151
|
+
}),
|
152
|
+
run = _useRequest.run;
|
153
|
+
|
154
|
+
useEffect(function () {
|
155
|
+
if (graphLoaded) {
|
156
|
+
run(linkIds);
|
157
|
+
}
|
158
|
+
}, [graphLoaded, linkIds]);
|
159
|
+
return {
|
160
|
+
linkRunStatus: linkRunStatus,
|
161
|
+
getlinkAlarmLevels: getlinkAlarmLevels
|
162
|
+
};
|
163
|
+
}
|
@@ -2,6 +2,7 @@ import { rlog } from '@riil-frontend/component-topology-utils';
|
|
2
2
|
import { useEffect } from 'react';
|
3
3
|
import useTopoEventListener from "./useTopoEventListener";
|
4
4
|
ht.Default.setImage('resource.subIcon.unMoniter', '/img/topo/alarmStatusIcon/未监控.svg');
|
5
|
+
ht.Default.setImage('resource.link.linkbreak', '/img/topo/link-break.svg');
|
5
6
|
/**
|
6
7
|
* 监听监控状态推送
|
7
8
|
* 节点、连线监控状态置灰
|
@@ -1,15 +1,15 @@
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
2
2
|
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
|
3
3
|
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
4
|
-
import { useEffect } from
|
5
|
-
import { useRequest } from
|
6
|
-
import _ from
|
7
|
-
import Logger from
|
8
|
-
import { useCbbEventListener } from
|
4
|
+
import { useEffect } from "react";
|
5
|
+
import { useRequest } from "ahooks";
|
6
|
+
import _ from "lodash";
|
7
|
+
import Logger from "loglevel";
|
8
|
+
import { useCbbEventListener } from "@riil-frontend/component-riil-event-emitter";
|
9
9
|
import DictCache from "../models/cache/DictCache";
|
10
10
|
import useCiAttributeChange from "./useCiAttributeChange";
|
11
11
|
import useHtDataPropertyChangeListener from "./ht/useHtDataPropertyChangeListener";
|
12
|
-
var rlog = Logger.getLogger(
|
12
|
+
var rlog = Logger.getLogger("topo");
|
13
13
|
/**
|
14
14
|
* 轮询获取指标hooks
|
15
15
|
* @param {*} props
|
@@ -21,15 +21,15 @@ var usePolling = function usePolling(props) {
|
|
21
21
|
useCiAttributeChange({
|
22
22
|
topo: topo
|
23
23
|
});
|
24
|
-
var bizState = store.useModelState(
|
24
|
+
var bizState = store.useModelState("topoBizMod");
|
25
25
|
var resAndMetrics = bizState.resAndMetrics,
|
26
26
|
pollingSwitch = bizState.pollingSwitch;
|
27
|
-
var displayConfig = topo.store.useModelState(
|
28
|
-
var resourceOverviewState = topo.store.useModelState(
|
27
|
+
var displayConfig = topo.store.useModelState("displayConfig");
|
28
|
+
var resourceOverviewState = topo.store.useModelState("topoBaseInfoOverview");
|
29
29
|
var resIdsList = resAndMetrics === null || resAndMetrics === void 0 ? void 0 : resAndMetrics.resIdsList;
|
30
30
|
/**
|
31
31
|
* 查询拓扑图资源的属性指标
|
32
|
-
*
|
32
|
+
*
|
33
33
|
* @returns {array}
|
34
34
|
*/
|
35
35
|
|
@@ -37,7 +37,7 @@ var usePolling = function usePolling(props) {
|
|
37
37
|
return _fetchData.apply(this, arguments);
|
38
38
|
}
|
39
39
|
/**
|
40
|
-
*
|
40
|
+
*
|
41
41
|
* @returns {{id, attributes: object[], metrics: object[]}[]} 属性和指标
|
42
42
|
*/
|
43
43
|
|
@@ -53,7 +53,7 @@ var usePolling = function usePolling(props) {
|
|
53
53
|
var ipv6 = data.attributeMap.ipv6_address;
|
54
54
|
|
55
55
|
if (!ipv6 && data.attributeMap.ipv6_address_list) {
|
56
|
-
ipv6 = (data.attributeMap.ipv6_address_list ||
|
56
|
+
ipv6 = (data.attributeMap.ipv6_address_list || "").split(",")[0];
|
57
57
|
}
|
58
58
|
|
59
59
|
return _extends({}, data, {
|
@@ -85,9 +85,62 @@ var usePolling = function usePolling(props) {
|
|
85
85
|
// 合并属性、指标
|
86
86
|
var _topo$dataModel$getDa = topo.dataModel.getData(),
|
87
87
|
nodes = _topo$dataModel$getDa.nodes,
|
88
|
-
links = _topo$dataModel$getDa.links;
|
89
|
-
|
90
|
-
|
88
|
+
links = _topo$dataModel$getDa.links; // console.log('fetchData-mergeData',ciMetricsResult, nodes, links)
|
89
|
+
// 判断通断状态
|
90
|
+
|
91
|
+
|
92
|
+
var breakLinks = links.filter(function (item) {
|
93
|
+
return item.ciType === "network_link";
|
94
|
+
}).map(function (link) {
|
95
|
+
console.log("fetchData-mergeData", link);
|
96
|
+
var breakFlag = false;
|
97
|
+
ciMetricsResult.forEach(function (item) {
|
98
|
+
if (item.id === link.id) {
|
99
|
+
if (item.metrics.hasOwnProperty("run_status")) {
|
100
|
+
if (item.metrics.run_status !== "1") {
|
101
|
+
breakFlag = true;
|
102
|
+
}
|
103
|
+
}
|
104
|
+
|
105
|
+
if (link.attributes["network_link.is_crucial"] && item.metrics.hasOwnProperty("remote_ping_status")) {
|
106
|
+
if (item.metrics.remote_ping_status !== "1") {
|
107
|
+
breakFlag = true;
|
108
|
+
}
|
109
|
+
}
|
110
|
+
}
|
111
|
+
});
|
112
|
+
var element = topo.getDataModel().getDataByTag(link.id);
|
113
|
+
|
114
|
+
if (!element) {
|
115
|
+
return;
|
116
|
+
}
|
117
|
+
|
118
|
+
if (breakFlag) {
|
119
|
+
console.log("link.setNodeStyleIcon-breakFlag", element);
|
120
|
+
topo.getHtTopo().setNodeStyleIcon(element, {
|
121
|
+
styleIcon: "linkbreak",
|
122
|
+
position: 17,
|
123
|
+
icon: "resource.link.linkbreak"
|
124
|
+
});
|
125
|
+
topo.dataModel.updateData([_extends({}, link, {
|
126
|
+
breakState: true
|
127
|
+
})]);
|
128
|
+
element === null || element === void 0 ? void 0 : element.s("edge.color", "#C9CED2");
|
129
|
+
return link.id; //element.a('linkbreak',true);
|
130
|
+
} else {
|
131
|
+
// 恢复状态
|
132
|
+
element.removeStyleIcon("linkbreak");
|
133
|
+
topo.dataModel.updateData([_extends({}, link, {
|
134
|
+
breakState: false
|
135
|
+
})]);
|
136
|
+
element === null || element === void 0 ? void 0 : element.a('linkbreak', false);
|
137
|
+
return undefined; // topo.getHtTopo().setNodeStyleIcon(element, { styleIcon: 'linkbreak',position: 17, icon: 'resource.link.linkbreak' });
|
138
|
+
}
|
139
|
+
});
|
140
|
+
console.log('link-break', breakLinks, links);
|
141
|
+
return [].concat(nodes, links.filter(function (link) {
|
142
|
+
return !breakLinks.includes(link.id);
|
143
|
+
})).filter(function (item) {
|
91
144
|
return !!item.ciType;
|
92
145
|
}).map(function (ciData) {
|
93
146
|
var resultData = _extends({}, ciData, {
|
@@ -107,7 +160,7 @@ var usePolling = function usePolling(props) {
|
|
107
160
|
});
|
108
161
|
};
|
109
162
|
|
110
|
-
_topo$store$getModelS = topo.store.getModelState(
|
163
|
+
_topo$store$getModelS = topo.store.getModelState("topoBizMod").resAndMetrics, resIdsList = _topo$store$getModelS.resIdsList, nodeIdsList = _topo$store$getModelS.nodeIdsList; // rlog.debug('根据ci的id获取属性的值-getCiArrByIds', resIdsList, metrics);
|
111
164
|
// 无资源,不查询
|
112
165
|
|
113
166
|
if (resIdsList.length) {
|
@@ -122,7 +175,8 @@ var usePolling = function usePolling(props) {
|
|
122
175
|
codes = topo.attributeMetricDisplay.getResourceMetricCodes();
|
123
176
|
param = {
|
124
177
|
ciId: nodeIdsList,
|
125
|
-
codes: codes,
|
178
|
+
codes: [].concat(codes, ["run_status", "remote_ping_status"]),
|
179
|
+
// 判断链路通断状态
|
126
180
|
// 过滤掉不需要查询的
|
127
181
|
relationId: topo.attributeMetricDisplay.getEdges().map(function (edge) {
|
128
182
|
return {
|
@@ -212,7 +266,7 @@ var usePolling = function usePolling(props) {
|
|
212
266
|
|
213
267
|
useEffect(function () {
|
214
268
|
if (topo.options.enableDefaultMetricLoader) {
|
215
|
-
rlog.debug(
|
269
|
+
rlog.debug("usePolling.useEffect: 开始轮询", {
|
216
270
|
pollingSwitch: pollingSwitch,
|
217
271
|
resIdsList: resIdsList,
|
218
272
|
resourceOverviewState: resourceOverviewState,
|
@@ -223,16 +277,16 @@ var usePolling = function usePolling(props) {
|
|
223
277
|
|
224
278
|
return function () {
|
225
279
|
if (loading) {
|
226
|
-
rlog.debug(
|
280
|
+
rlog.debug("usePolling.useEffect: 结束轮询", resAndMetrics);
|
227
281
|
stopPoll();
|
228
282
|
}
|
229
283
|
};
|
230
284
|
}, [pollingSwitch, resIdsList, displayConfig, resourceOverviewState.id, resourceOverviewState.metricCodes]); // 属性变更监听更新
|
231
285
|
|
232
|
-
useCbbEventListener(
|
233
|
-
name:
|
286
|
+
useCbbEventListener("topo", {
|
287
|
+
name: "topo",
|
234
288
|
onMessage: function onMessage(message) {
|
235
|
-
if (message.type ===
|
289
|
+
if (message.type === "attribute") {
|
236
290
|
var data = message.data;
|
237
291
|
}
|
238
292
|
}
|
@@ -243,8 +297,8 @@ var usePolling = function usePolling(props) {
|
|
243
297
|
onChange: function onChange(e) {
|
244
298
|
var property = e.property,
|
245
299
|
data = e.data;
|
246
|
-
var isGroupExpandedChanged = data instanceof ht.Group && property ===
|
247
|
-
var isEdgeExpandedChanged = data instanceof ht.Edge && property ===
|
300
|
+
var isGroupExpandedChanged = data instanceof ht.Group && property === "expanded";
|
301
|
+
var isEdgeExpandedChanged = data instanceof ht.Edge && property === "edge.expanded";
|
248
302
|
|
249
303
|
if (isGroupExpandedChanged || isEdgeExpandedChanged) {
|
250
304
|
topo.attributeMetricDisplay.updateTagsTips();
|
@@ -24,7 +24,7 @@ import ElementTagTipConfig from "./tagstips/ElementTagTipConfig";
|
|
24
24
|
import SelectionModel from "./SelectionModel";
|
25
25
|
import CiCache from "./cache/CiCache"; // eslint-disable-next-line no-undef
|
26
26
|
|
27
|
-
var version = typeof "13.0.0-dev.
|
27
|
+
var version = typeof "13.0.0-dev.17" === 'string' ? "13.0.0-dev.17" : null;
|
28
28
|
console.info("\u62D3\u6251\u7248\u672C: " + version);
|
29
29
|
/**
|
30
30
|
* 拓扑显示和编辑
|
@@ -41,7 +41,7 @@ export var updateEdgeExpanded = function updateEdgeExpanded(topo) {
|
|
41
41
|
htTopo.toggleAllEdgeGroups(false);
|
42
42
|
rlog.debug("updateEdgeExpanded 折叠");
|
43
43
|
} else {
|
44
|
-
htTopo.toggleAllEdgeGroups(true);
|
44
|
+
//htTopo.toggleAllEdgeGroups(true);
|
45
45
|
showLinkByConfig({
|
46
46
|
topo: topo,
|
47
47
|
showType: expandAllEdges,
|
@@ -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 判断两端互相切换
|
@@ -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 () {
|