@riil-frontend/component-topology 13.0.0-dev.1 → 13.0.0-dev.2
Sign up to get free protection for your applications and to get access to all the features.
- package/build/1.js +1 -1
- package/build/index.js +14 -14
- package/es/components/ResourceSelectDrawer/ResourceSelectDrawer.js +1 -1
- package/es/core/components/TopoView/topoView.js +7 -4
- package/es/core/editor/components/Toolbar/widgets/EdgeColorButton/EdgeColorButton.js +2 -2
- package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.js +5 -15
- package/es/core/editor/components/Toolbar/widgets/FontFamilyWidget.js +2 -27
- package/es/core/editor/components/Toolbar/widgets/FontSizeWidget.js +3 -28
- package/es/core/editor/components/Toolbar/widgets/FontStyleButton.js +6 -52
- package/es/core/editor/components/Toolbar/widgets/components/FontFamilySelect.js +29 -0
- package/es/core/editor/components/Toolbar/widgets/components/FontSizeSelect.js +29 -0
- package/es/core/editor/components/Toolbar/widgets/components/FontStyleSelect.js +71 -0
- package/es/core/editor/components/settings/core/updateElementProperty.js +3 -2
- package/es/core/editor/components/settings/propertyViews/view/GlobalEdgeToggle.js +2 -2
- package/es/core/editor/hooks/useNewElementTheme.js +20 -16
- package/es/core/editor/utils/edgeTypeStyleUtil.js +11 -32
- package/es/core/hooks/useGraphAlarmDisplay.js +4 -0
- package/es/core/hooks/usePolling.js +2 -1
- package/es/core/hooks/useTopoEdit.js +206 -248
- package/es/core/models/AttributeMetricDisplay.js +4 -3
- package/es/core/models/HistoryManager.js +11 -9
- package/es/core/models/TopoApp.js +39 -45
- package/es/core/models/topoData.js +7 -14
- package/es/core/models/utils/linkUtils.js +36 -28
- package/es/core/store/models/topoConfig.js +14 -17
- package/es/core/utils/edgeUtil.js +7 -10
- package/es/core/viewer/components/plugins/ElementDetailDrawer/hooks/useElementDetailManager.js +2 -2
- package/es/networkTopo/models/EdgeGroupTagTipBuilder.js +7 -7
- package/es/networkTopo/models/LinkDynamicStyleExecutor.js +7 -63
- package/es/networkTopo/services/topo/basic.js +4 -2
- package/es/networkTopo/utils/edgeGroupTagUtil.js +2 -2
- package/es/networkTopo/utils/exitLinkUtil.js +23 -11
- package/es/networkTopo/utils/relateTopoDataUtil.js +38 -0
- package/es/style.js +1 -1
- package/es/utils/clusterUtil.js +3 -3
- package/es/utils/htElementUtils.js +16 -84
- package/lib/components/ResourceSelectDrawer/ResourceSelectDrawer.js +1 -1
- package/lib/core/components/TopoView/topoView.js +15 -19
- package/lib/core/editor/components/Toolbar/widgets/EdgeColorButton/EdgeColorButton.js +2 -2
- package/lib/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.js +5 -14
- package/lib/core/editor/components/Toolbar/widgets/FontFamilyWidget.js +3 -28
- package/lib/core/editor/components/Toolbar/widgets/FontSizeWidget.js +3 -28
- package/lib/core/editor/components/Toolbar/widgets/FontStyleButton.js +6 -56
- package/lib/core/editor/components/Toolbar/widgets/components/FontFamilySelect.js +38 -0
- package/lib/core/editor/components/Toolbar/widgets/components/FontSizeSelect.js +38 -0
- package/lib/core/editor/components/Toolbar/widgets/components/FontStyleSelect.js +83 -0
- package/lib/core/editor/components/settings/core/updateElementProperty.js +7 -2
- package/lib/core/editor/components/settings/propertyViews/view/GlobalEdgeToggle.js +2 -2
- package/lib/core/editor/hooks/useNewElementTheme.js +20 -16
- package/lib/core/editor/utils/edgeTypeStyleUtil.js +10 -33
- package/lib/core/hooks/useGraphAlarmDisplay.js +4 -0
- package/lib/core/hooks/usePolling.js +6 -5
- package/lib/core/hooks/useTopoEdit.js +212 -272
- package/lib/core/models/AttributeMetricDisplay.js +6 -6
- package/lib/core/models/HistoryManager.js +13 -17
- package/lib/core/models/TopoApp.js +39 -43
- package/lib/core/models/topoData.js +7 -14
- package/lib/core/models/utils/linkUtils.js +36 -27
- package/lib/core/store/models/topoConfig.js +20 -31
- package/lib/core/utils/edgeUtil.js +8 -10
- package/lib/core/viewer/components/plugins/ElementDetailDrawer/hooks/useElementDetailManager.js +3 -2
- package/lib/networkTopo/models/EdgeGroupTagTipBuilder.js +6 -6
- package/lib/networkTopo/models/LinkDynamicStyleExecutor.js +6 -64
- package/lib/networkTopo/services/topo/basic.js +4 -2
- package/lib/networkTopo/utils/edgeGroupTagUtil.js +2 -2
- package/lib/networkTopo/utils/exitLinkUtil.js +23 -11
- package/lib/networkTopo/utils/relateTopoDataUtil.js +49 -0
- package/lib/style.js +1 -1
- package/lib/utils/clusterUtil.js +2 -2
- package/lib/utils/htElementUtils.js +19 -93
- package/package.json +2 -2
- package/es/networkTopo/models/LinkTagsTipsBuilder.js +0 -235
- package/lib/networkTopo/models/LinkTagsTipsBuilder.js +0 -245
@@ -1,7 +1,5 @@
|
|
1
|
-
import { rlog } from '@riil-frontend/component-topology-utils';
|
2
1
|
import { isClusterHtElement } from "../../utils/clusterUtil";
|
3
|
-
import {
|
4
|
-
import { getLinksBetweenNodes } from "../utils/linkUtil"; // network_link.actual_bandwidth
|
2
|
+
import { isNode } from "../../utils/htElementUtils"; // network_link.actual_bandwidth
|
5
3
|
|
6
4
|
function calcEdgeWidth(actualBandwidth) {
|
7
5
|
if (!actualBandwidth) {
|
@@ -52,16 +50,17 @@ var LinkDynamicStyleExecutor = /*#__PURE__*/function () {
|
|
52
50
|
var _proto = LinkDynamicStyleExecutor.prototype;
|
53
51
|
|
54
52
|
_proto.execute = function execute() {
|
55
|
-
var
|
53
|
+
var _topo$historyManager,
|
54
|
+
_this = this,
|
55
|
+
_topo$historyManager2;
|
56
56
|
|
57
57
|
var topo = this.topo;
|
58
58
|
|
59
59
|
var _topo$dataModel$getDa = topo.dataModel.getData(),
|
60
|
-
links = _topo$dataModel$getDa.links
|
61
|
-
linkGroups = _topo$dataModel$getDa.linkGroups;
|
60
|
+
links = _topo$dataModel$getDa.links;
|
62
61
|
|
63
62
|
var dataModel = this.topo.getDataModel();
|
64
|
-
|
63
|
+
(_topo$historyManager = topo.historyManager) === null || _topo$historyManager === void 0 ? void 0 : _topo$historyManager.setDisabled(true, '链路动态粗细'); // 1、如果连线可见,设置线宽
|
65
64
|
|
66
65
|
links.forEach(function (link) {
|
67
66
|
var edge = dataModel.getDataByTag(link.id);
|
@@ -69,63 +68,8 @@ var LinkDynamicStyleExecutor = /*#__PURE__*/function () {
|
|
69
68
|
if (edge) {
|
70
69
|
edge.s('edge.width', _this.calcLinkEdgeWidth(link));
|
71
70
|
}
|
72
|
-
}); // 2、如果连线组关联链路并可见,设置线宽
|
73
|
-
|
74
|
-
linkGroups.forEach(function (link) {
|
75
|
-
// 聚合链路是连线/连线组,并可以查询到
|
76
|
-
var edge = topo.getDataModel().getDataByTag(link.id);
|
77
|
-
|
78
|
-
if (edge) {
|
79
|
-
edge.s('edge.width', _this.calcLinkEdgeWidth(link));
|
80
|
-
return;
|
81
|
-
} // 聚合链路是连线组(编辑模式还未关联业务信息)
|
82
|
-
|
83
|
-
|
84
|
-
var edgeGroup = getEdgeGroupByNodeTags(dataModel, link.source, link.target);
|
85
|
-
|
86
|
-
if (edgeGroup) {
|
87
|
-
var edgeGroupAgent = edgeGroup.getEdgeGroupAgent(); // 判断是显示的连线组元素
|
88
|
-
|
89
|
-
if (edgeGroupAgent) {
|
90
|
-
edgeGroup.getEdgeGroupAgent().s('edge.width', _this.calcLinkEdgeWidth(link));
|
91
|
-
}
|
92
|
-
} else {
|
93
|
-
rlog.warn('动态链路样式执行:未找到聚合链路的ht元素', link);
|
94
|
-
}
|
95
|
-
}); // 3、如果连线组未关联链路并可见,设置线宽。
|
96
|
-
|
97
|
-
var edges = getEdges(dataModel);
|
98
|
-
edges.forEach(function (edge) {
|
99
|
-
try {
|
100
|
-
// 获取两端代理节点
|
101
|
-
var sourceAgent = edge.getSourceAgent();
|
102
|
-
var targetAgent = edge.getTargetAgent();
|
103
|
-
var sourceId = sourceAgent.getTag();
|
104
|
-
var targetId = targetAgent.getTag(); // 查询是否有聚合链路
|
105
|
-
|
106
|
-
var aggLink = linkGroups.find(function (link) {
|
107
|
-
return link.source === sourceId && link.target === targetId || link.target === sourceId && link.source === targetId;
|
108
|
-
}); // 如果连线组未关联链路并可见
|
109
|
-
|
110
|
-
if (!aggLink && edge.isEdgeGroupAgent()) {
|
111
|
-
// 查询两端代理节点(包含子节点)间的子链路列表
|
112
|
-
var sourceCiIds = getChildrenNodeCiIds([sourceAgent]);
|
113
|
-
var targetCiIds = getChildrenNodeCiIds([targetAgent]);
|
114
|
-
var aggLinks = getLinksBetweenNodes(linkGroups, sourceCiIds, targetCiIds);
|
115
|
-
var phyLinks = getLinksBetweenNodes(links, sourceCiIds, targetCiIds);
|
116
|
-
var linkBetweenNodes = aggLinks.length ? aggLinks : phyLinks; // 如果有子链路,计算线宽并设置
|
117
|
-
|
118
|
-
if (linkBetweenNodes.length) {
|
119
|
-
var edgeWidth = _this.calcEdgeGroupEdgeWidth(linkBetweenNodes);
|
120
|
-
|
121
|
-
edge.s('edge.width', edgeWidth);
|
122
|
-
}
|
123
|
-
}
|
124
|
-
} catch (error) {
|
125
|
-
rlog.error('连线组未关联链路并可见,设置线宽:异常', edge, error);
|
126
|
-
}
|
127
71
|
});
|
128
|
-
topo.historyManager
|
72
|
+
(_topo$historyManager2 = topo.historyManager) === null || _topo$historyManager2 === void 0 ? void 0 : _topo$historyManager2.setDisabled(false, '链路动态粗细');
|
129
73
|
}
|
130
74
|
/**
|
131
75
|
* 处理单个连线组切换。有链路时设置
|
@@ -413,7 +413,7 @@ export default _extends({
|
|
413
413
|
* @param {Array} groups
|
414
414
|
* @returns
|
415
415
|
*/
|
416
|
-
getTopoDataByResource: function getTopoDataByResource(id, resources, groups) {
|
416
|
+
getTopoDataByResource: function getTopoDataByResource(id, resources, groups, relateTopoIdList) {
|
417
417
|
return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee13() {
|
418
418
|
var _result$nodes2, _result$links2;
|
419
419
|
|
@@ -433,7 +433,9 @@ export default _extends({
|
|
433
433
|
|
434
434
|
obj = prepareGroupParams(data);
|
435
435
|
_context13.next = 5;
|
436
|
-
return request.post(API_ROOT + "/structure/byCondition/" + id, _extends({}, obj
|
436
|
+
return request.post(API_ROOT + "/structure/byCondition/" + id, _extends({}, obj, {
|
437
|
+
relateTopoIdList: relateTopoIdList
|
438
|
+
}));
|
437
439
|
|
438
440
|
case 5:
|
439
441
|
result = _context13.sent;
|
@@ -55,8 +55,8 @@ export function getEdgeGroupLinkIdConfig(edgeGroup, topo) {
|
|
55
55
|
});
|
56
56
|
}
|
57
57
|
export function getEdgeGroupConfigId(edgeGroup) {
|
58
|
-
var sourceNode = edgeGroup.
|
59
|
-
var targetNode = edgeGroup.
|
58
|
+
var sourceNode = edgeGroup.getSource();
|
59
|
+
var targetNode = edgeGroup.getTarget();
|
60
60
|
var sourceId = sourceNode.a('uuid');
|
61
61
|
var targetId = targetNode.a('uuid');
|
62
62
|
return [sourceId, targetId].sort().join(',');
|
@@ -239,9 +239,10 @@ function updateLinkTarget(links, nodes) {
|
|
239
239
|
|
240
240
|
|
241
241
|
export function processByConditionResult(topoData, groupConfigs) {
|
242
|
-
var
|
242
|
+
var groups = topoData.groups,
|
243
|
+
nodes = topoData.nodes,
|
243
244
|
links = topoData.links;
|
244
|
-
var ipNodes = getIpNodes(groupConfigs,
|
245
|
+
var ipNodes = getIpNodes(groupConfigs, topoData); // 出口链路目的端设置为IP节点或者ping资源节点id
|
245
246
|
|
246
247
|
var newLinks = updateLinkTarget(links, nodes);
|
247
248
|
return _extends({}, topoData, {
|
@@ -249,15 +250,26 @@ export function processByConditionResult(topoData, groupConfigs) {
|
|
249
250
|
links: newLinks
|
250
251
|
});
|
251
252
|
|
252
|
-
function getIpNodes(groupConfigs,
|
253
|
-
var
|
254
|
-
|
255
|
-
|
256
|
-
|
257
|
-
|
258
|
-
|
259
|
-
|
253
|
+
function getIpNodes(groupConfigs, _ref) {
|
254
|
+
var groups = _ref.groups,
|
255
|
+
nodes = _ref.nodes;
|
256
|
+
var ipNodes = [];
|
257
|
+
groupConfigs.forEach(function (g) {
|
258
|
+
g.condition.linkIps // 过滤ping资源对应的ip节点
|
259
|
+
.filter(function (ip) {
|
260
|
+
return !findPingNode(nodes, ip);
|
261
|
+
}).map(function (ip) {
|
262
|
+
var topoGroup = g.topoGroup;
|
263
|
+
var group = groups.find(function (item) {
|
264
|
+
return item.id === topoGroup.id || item.tag === topoGroup.tag;
|
265
|
+
});
|
266
|
+
ipNodes.push(_extends({}, buildIpNode(ip), {
|
267
|
+
// 解决区域里有ip添加资源ip消失的问题
|
268
|
+
'groupId': group === null || group === void 0 ? void 0 : group.id,
|
269
|
+
'groupTag': group === null || group === void 0 ? void 0 : group.tag
|
270
|
+
}));
|
271
|
+
});
|
260
272
|
});
|
261
|
-
return
|
273
|
+
return ipNodes;
|
262
274
|
}
|
263
275
|
}
|
@@ -0,0 +1,38 @@
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
2
|
+
// 关联拓扑数据
|
3
|
+
|
4
|
+
/**
|
5
|
+
* 升级历史数据:子拓扑节点序列化数据
|
6
|
+
* 构造子拓扑节点
|
7
|
+
* 构造子拓扑链路
|
8
|
+
* @param {*} ctx
|
9
|
+
*/
|
10
|
+
export function processBothTopoData(ctx) {
|
11
|
+
var topoData = ctx.topoData;
|
12
|
+
var serialize = upgradeSerializeRelateTopoNode(topoData.serialize);
|
13
|
+
return _extends({}, topoData, {
|
14
|
+
serialize: serialize
|
15
|
+
});
|
16
|
+
}
|
17
|
+
/**
|
18
|
+
* 构造子拓扑节点
|
19
|
+
* 构造子拓扑链路
|
20
|
+
* @param {*} ctx
|
21
|
+
*/
|
22
|
+
|
23
|
+
export function processByConditionTopoData(ctx) {
|
24
|
+
var topoData = ctx.topoData;
|
25
|
+
return _extends({}, topoData);
|
26
|
+
}
|
27
|
+
/**
|
28
|
+
* 升级历史数据:子拓扑节点序列化数据
|
29
|
+
* @param {*} serialize
|
30
|
+
*/
|
31
|
+
|
32
|
+
function upgradeSerializeRelateTopoNode(serialize) {
|
33
|
+
return serialize;
|
34
|
+
}
|
35
|
+
|
36
|
+
function getRelateTopoIdsFromSerialize(serialize) {
|
37
|
+
return serialize;
|
38
|
+
}
|
package/es/style.js
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
import '@riil-frontend/component-topology-graph/es/style';
|
2
2
|
import '@alifd/next/es/box/style';
|
3
|
-
import '@riil-frontend/component-topology-utils/es/style';
|
4
3
|
import '@alifd/next/es/message/style';
|
4
|
+
import '@riil-frontend/component-topology-utils/es/style';
|
5
5
|
import '@riil-frontend/utils/es/style';
|
6
6
|
import '@riil-frontend/component-riil-event-emitter/es/style';
|
7
7
|
import '@alifd/next/es/menu-button/style';
|
package/es/utils/clusterUtil.js
CHANGED
@@ -5,7 +5,7 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
5
5
|
*/
|
6
6
|
import { transformTopoElements } from "@riil-frontend/component-topology-graph/es/utils";
|
7
7
|
import rlog from "@riil-frontend/component-topology-utils/es/rlog";
|
8
|
-
import { getGroups,
|
8
|
+
import { getGroups, containsElement } from "./htElementUtils";
|
9
9
|
import { findGroupChildren } from "./topoData";
|
10
10
|
export function isCluster(node) {
|
11
11
|
return !!node.cluster;
|
@@ -76,7 +76,7 @@ export function isClusterHtElement(element) {
|
|
76
76
|
return !!element.a('cluster');
|
77
77
|
}
|
78
78
|
export function isClusterMemberHtElement(element) {
|
79
|
-
return element
|
79
|
+
return (element === null || element === void 0 ? void 0 : element.getParent()) && isClusterHtElement(element.getParent());
|
80
80
|
}
|
81
81
|
/**
|
82
82
|
* 集群无权限时收起
|
@@ -111,7 +111,7 @@ export function upgradeV103GraphClusterNode(topo, topoData) {
|
|
111
111
|
var topoDataTrans = transformTopoElements(topoData);
|
112
112
|
var dm = topo.getDataModel();
|
113
113
|
var unExistedList = topoDataTrans.filter(function (data) {
|
114
|
-
return !
|
114
|
+
return !containsElement(dm, data);
|
115
115
|
});
|
116
116
|
|
117
117
|
if (!unExistedList.length) {
|
@@ -115,9 +115,6 @@ export function getNodeData(element) {
|
|
115
115
|
export function getEdges(dataModel) {
|
116
116
|
return getElements(dataModel).filter(isValidEdge);
|
117
117
|
}
|
118
|
-
export function isEdgeGroupExpanded(edge) {
|
119
|
-
return isEdge(edge) && edge.getEdgeGroup() && !!edge.s("edge.expanded");
|
120
|
-
}
|
121
118
|
/**
|
122
119
|
* 是否连线组代理
|
123
120
|
* @param {*} edge
|
@@ -125,7 +122,10 @@ export function isEdgeGroupExpanded(edge) {
|
|
125
122
|
*/
|
126
123
|
|
127
124
|
export function isEdgeGroupAgent(edge) {
|
128
|
-
return isEdge(edge) && edge.
|
125
|
+
return isEdge(edge) && edge.a('x.edgegroup.isEdgeGroup');
|
126
|
+
}
|
127
|
+
export function isEdgeVisible(edge) {
|
128
|
+
return edge.s('2d.visible') || edge.s('2d.visible') === undefined;
|
129
129
|
}
|
130
130
|
/**
|
131
131
|
* 获得两个节点间的连线列表
|
@@ -152,61 +152,18 @@ export function getEdgesBetweenNodes(node1, node2) {
|
|
152
152
|
return edges;
|
153
153
|
}
|
154
154
|
/**
|
155
|
-
*
|
156
|
-
* @
|
155
|
+
* 获得连线组连线列表
|
156
|
+
* @param {*} dataModel
|
157
|
+
* @returns
|
157
158
|
*/
|
158
159
|
|
159
|
-
export function getEdgeGroupByNodes(node1, node2) {
|
160
|
-
var htEdgeGroup = null;
|
161
|
-
getEdgesBetweenNodes(node1, node2).forEach(function (edge) {
|
162
|
-
if (!htEdgeGroup) {
|
163
|
-
htEdgeGroup = edge.getEdgeGroup();
|
164
|
-
}
|
165
|
-
});
|
166
|
-
|
167
|
-
if (!htEdgeGroup) {
|
168
|
-
return null;
|
169
|
-
}
|
170
|
-
|
171
|
-
return new EdgeGroup(htEdgeGroup);
|
172
|
-
}
|
173
|
-
/**
|
174
|
-
* 获得节点间的连线组,连线<=1时返回null
|
175
|
-
* @returns
|
176
|
-
*/
|
177
|
-
|
178
|
-
export function getEdgeGroupByNodeTags(dataModel, nodeTag1, nodeTag2) {
|
179
|
-
var node1 = dataModel.getDataByTag(nodeTag1);
|
180
|
-
var node2 = dataModel.getDataByTag(nodeTag2);
|
181
|
-
|
182
|
-
if (!node1 || !node2) {
|
183
|
-
console.warn("getEdgeGroupByNodes 未找到节点", {
|
184
|
-
node1: node1,
|
185
|
-
node2: node2,
|
186
|
-
nodeTag1: nodeTag1,
|
187
|
-
nodeTag2: nodeTag2
|
188
|
-
});
|
189
|
-
return null;
|
190
|
-
}
|
191
|
-
|
192
|
-
return getEdgeGroupByNodes(node1, node2);
|
193
|
-
}
|
194
|
-
export function getEdgeGroups(dataModel) {
|
195
|
-
var edgeGroups = [];
|
196
|
-
getEdges(dataModel).forEach(function (edge) {
|
197
|
-
var group = edge.getEdgeGroup();
|
198
|
-
|
199
|
-
if (group && !edgeGroups.includes(group)) {
|
200
|
-
edgeGroups.push(group);
|
201
|
-
}
|
202
|
-
});
|
203
|
-
return edgeGroups;
|
204
|
-
}
|
205
160
|
export function getEdgeGroupAgents(dataModel) {
|
206
161
|
return getEdges(dataModel).filter(isEdgeGroupAgent);
|
207
162
|
}
|
208
163
|
export function getEdgeDatas(dataModel) {
|
209
|
-
return getEdges(dataModel).
|
164
|
+
return getEdges(dataModel).filter(function (edge) {
|
165
|
+
return !isEdgeGroupAgent(edge);
|
166
|
+
}).map(function (element) {
|
210
167
|
var _element$getSource, _element$getTarget;
|
211
168
|
|
212
169
|
return _extends({}, element.getAttrObject(), {
|
@@ -309,9 +266,13 @@ export function setElementRuntimeStyle(element, name, value) {
|
|
309
266
|
}
|
310
267
|
/**
|
311
268
|
* 判断拓扑图是否存在元素
|
269
|
+
*
|
270
|
+
* @param {*} dataModel
|
271
|
+
* @param {{id?: string, tag?: string}} data
|
272
|
+
* @returns
|
312
273
|
*/
|
313
274
|
|
314
|
-
export function
|
275
|
+
export function containsElement(dataModel, data) {
|
315
276
|
if (dataModel.getDataByTag(data.id)) {
|
316
277
|
return true;
|
317
278
|
} // 识别区域
|
@@ -320,34 +281,5 @@ export function isExistedElement(htTopo, dataModel, data) {
|
|
320
281
|
var element = getElements(dataModel).find(function (item) {
|
321
282
|
return data.tag && item.a("tag") === data.tag;
|
322
283
|
});
|
323
|
-
|
324
|
-
if (element) {
|
325
|
-
return true;
|
326
|
-
} // 连线/连线组
|
327
|
-
|
328
|
-
|
329
|
-
var edges = getEdges(dataModel);
|
330
|
-
|
331
|
-
for (var i = 0; i < edges.length; i++) {
|
332
|
-
var edge = edges[i]; // 如果连线组折叠,判断子连线
|
333
|
-
|
334
|
-
var edgeData = htTopo.getEdgeData(edge);
|
335
|
-
|
336
|
-
if (edgeData) {
|
337
|
-
// eslint-disable-next-line no-underscore-dangle
|
338
|
-
var id = edgeData._attrObject.id;
|
339
|
-
|
340
|
-
if (id === data.id) {
|
341
|
-
return true;
|
342
|
-
}
|
343
|
-
} // 如果连线组展开,判断连线组
|
344
|
-
// eslint-disable-next-line no-underscore-dangle
|
345
|
-
|
346
|
-
|
347
|
-
if (edge.__edgeGroup && edge.__edgeGroup._tag === data.id) {
|
348
|
-
return true;
|
349
|
-
}
|
350
|
-
}
|
351
|
-
|
352
|
-
return false;
|
284
|
+
return !!element;
|
353
285
|
}
|
@@ -83,7 +83,7 @@ function ResourceSelectDrawer(props) {
|
|
83
83
|
_context.t0 = _context["catch"](1);
|
84
84
|
setLoading(false);
|
85
85
|
|
86
|
-
_componentTopologyUtils.rlog.error('ResourceSelectDrawer.handleOk', _context.t0);
|
86
|
+
_componentTopologyUtils.rlog.error('ResourceSelectDrawer.handleOk', _context.t0, _context.t0.stack);
|
87
87
|
|
88
88
|
case 13:
|
89
89
|
case "end":
|
@@ -19,7 +19,7 @@ var _componentTopologyGraph = _interopRequireWildcard(require("@riil-frontend/co
|
|
19
19
|
|
20
20
|
var _PortalContainer = _interopRequireDefault(require("@riil-frontend/component-topology-graph/es/components/PortalContainer"));
|
21
21
|
|
22
|
-
var
|
22
|
+
var _loglevel = _interopRequireDefault(require("loglevel"));
|
23
23
|
|
24
24
|
var _showMessage = _interopRequireDefault(require("../../utils/showMessage"));
|
25
25
|
|
@@ -66,6 +66,8 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
66
66
|
// 通用
|
67
67
|
// 显示模式
|
68
68
|
// 编辑模式
|
69
|
+
var rlog = _loglevel["default"].getLogger('topo');
|
70
|
+
|
69
71
|
var Topology = function Topology(props) {
|
70
72
|
var _classnames;
|
71
73
|
|
@@ -138,40 +140,39 @@ var Topology = function Topology(props) {
|
|
138
140
|
(0, _react.useEffect)(function () {
|
139
141
|
// 拓扑退出注销
|
140
142
|
return function () {
|
141
|
-
|
142
|
-
|
143
|
+
rlog.info('TopoView 退出');
|
143
144
|
topo.selectionModel.destroy();
|
144
145
|
topoDispatchers.reset();
|
145
146
|
};
|
146
147
|
}, []);
|
147
148
|
var onGraphCreated = (0, _react.useCallback)(function (topoClient) {
|
148
149
|
topo.view.onCreatedView(topoClient);
|
149
|
-
|
150
|
-
_componentTopologyUtils.rlog.info('TopoView.onGraphCreated');
|
150
|
+
rlog.info('TopoView.onGraphCreated');
|
151
151
|
|
152
152
|
if (onReady) {
|
153
153
|
onReady();
|
154
154
|
}
|
155
155
|
}, []);
|
156
156
|
var handleGraphDataLoaded = (0, _react.useCallback)(function () {
|
157
|
-
|
157
|
+
rlog.info('TopoView.handleGraphDataLoaded: 数据加载完成', new Date().toString(), {
|
158
158
|
topoMod: topo.store.getState().topoMod,
|
159
159
|
topoData: topoData,
|
160
160
|
htElements: topo.getDataModel().getDatas().toArray()
|
161
161
|
});
|
162
|
-
|
163
162
|
(0, _nodeNameVisibleUtil.updateNodesNameVisible)(topo);
|
164
163
|
(0, _clusterUtil.upgradeV103GraphClusterNode)(topo, topoData);
|
165
164
|
(0, _graphLinkUtil.fixLink)(topo);
|
166
165
|
(0, _clusterUtil.handleClusterNoPermission)(topo);
|
167
166
|
(0, _edgeUtil.updateEdgeExpanded)(topo);
|
167
|
+
topo.selectionModel.init();
|
168
168
|
var htHistoryManager = topo.getDataModel().getHistoryManager();
|
169
169
|
|
170
|
-
if (htHistoryManager) {
|
170
|
+
if (isEditMode && htHistoryManager) {
|
171
171
|
topo.historyManager = new _HistoryManager["default"](topo, htHistoryManager);
|
172
|
+
topo.historyManager.clear();
|
173
|
+
rlog.info('TopoView.handleGraphDataLoaded: 初始化HistoryManager ', topo.historyManager.toString());
|
172
174
|
}
|
173
175
|
|
174
|
-
topo.selectionModel.init();
|
175
176
|
topoDispatchers.update({
|
176
177
|
graphLoaded2: true
|
177
178
|
});
|
@@ -181,12 +182,11 @@ var Topology = function Topology(props) {
|
|
181
182
|
}
|
182
183
|
}, [topoData]);
|
183
184
|
var handleGraphLoaded = (0, _react.useCallback)(function () {
|
184
|
-
|
185
|
+
rlog.info('TopoView.handleGraphLoaded', new Date().toString(), {
|
185
186
|
topoMod: topo.store.getState().topoMod,
|
186
187
|
topoData: topoData,
|
187
188
|
htElements: topo.getDataModel().getDatas().toArray()
|
188
189
|
});
|
189
|
-
|
190
190
|
(0, _nodeNameVisibleUtil.updateNodesNameVisible)(topo);
|
191
191
|
(0, _clusterUtil.upgradeV103GraphClusterNode)(topo, topoData);
|
192
192
|
(0, _graphLinkUtil.fixLink)(topo);
|
@@ -223,8 +223,7 @@ var Topology = function Topology(props) {
|
|
223
223
|
}, [topoData]);
|
224
224
|
|
225
225
|
var rightEventHandle = function rightEventHandle(event) {
|
226
|
-
|
227
|
-
|
226
|
+
rlog.debug('右键事件', event);
|
228
227
|
var contextMenu = topo.view.contextMenu;
|
229
228
|
|
230
229
|
if (contextMenu.containsCommand(event.data.id)) {
|
@@ -233,8 +232,7 @@ var Topology = function Topology(props) {
|
|
233
232
|
};
|
234
233
|
|
235
234
|
var onRefresh = function onRefresh(e) {
|
236
|
-
|
237
|
-
|
235
|
+
rlog.debug('TopoView:onRefresh', e);
|
238
236
|
onRefreshTopo ? onRefreshTopo() : topoDispatchers.refreshTopo();
|
239
237
|
};
|
240
238
|
/**
|
@@ -244,8 +242,7 @@ var Topology = function Topology(props) {
|
|
244
242
|
|
245
243
|
|
246
244
|
var handleEvent = function handleEvent(event) {
|
247
|
-
|
248
|
-
|
245
|
+
rlog.debug('TopoView:onEvent', event);
|
249
246
|
onEvent && onEvent(event);
|
250
247
|
topoEdit.onEvent(event);
|
251
248
|
|
@@ -272,8 +269,7 @@ var Topology = function Topology(props) {
|
|
272
269
|
break;
|
273
270
|
|
274
271
|
case _componentTopologyGraph.TopoEvent.EVENT_CONTEXT_TOOL:
|
275
|
-
|
276
|
-
|
272
|
+
rlog.debug('自定义工具栏事件', event);
|
277
273
|
break;
|
278
274
|
|
279
275
|
default:
|
@@ -53,14 +53,14 @@ function EdgeColorButton(props) {
|
|
53
53
|
});
|
54
54
|
};
|
55
55
|
|
56
|
-
var
|
56
|
+
var getCustomLines = function getCustomLines(list) {
|
57
57
|
return list.filter(_edgeUtil.isCustomEdge);
|
58
58
|
};
|
59
59
|
|
60
60
|
(0, _react.useEffect)(function () {
|
61
61
|
if (graphLoaded) {
|
62
62
|
var edges = (0, _edgeTypeStyleUtil.getEdgesBySelection)(topo);
|
63
|
-
var list =
|
63
|
+
var list = getCustomLines(edges);
|
64
64
|
setLineWidth(1); // eslint-disable-next-line eqeqeq
|
65
65
|
|
66
66
|
if (selection.length == 1 && list.length === 1) {
|
@@ -48,20 +48,11 @@ var LINE_TYPE_OPTIONS = [{
|
|
48
48
|
value: 'doublearc',
|
49
49
|
label: '双弧线',
|
50
50
|
icon: 'topo_linear_icon_arcline'
|
51
|
-
}
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
];
|
57
|
-
|
58
|
-
if (localStorage.getItem('topo.test.edge.customType') === 'true') {
|
59
|
-
LINE_TYPE_OPTIONS.push({
|
60
|
-
value: 'points',
|
61
|
-
label: '自由线形',
|
62
|
-
icon: 'topo_linear_icon_pointsline'
|
63
|
-
});
|
64
|
-
}
|
51
|
+
}, {
|
52
|
+
value: 'points',
|
53
|
+
label: '自由线形',
|
54
|
+
icon: 'topo_linear_icon_pointsline'
|
55
|
+
}];
|
65
56
|
|
66
57
|
var LineType = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
|
67
58
|
var value = props.value,
|
@@ -7,9 +7,9 @@ exports["default"] = void 0;
|
|
7
7
|
|
8
8
|
var _react = _interopRequireWildcard(require("react"));
|
9
9
|
|
10
|
-
var
|
10
|
+
var _FontFamilySelect = _interopRequireDefault(require("./components/FontFamilySelect"));
|
11
11
|
|
12
|
-
var _textStyleSettingRouter = _interopRequireDefault(require("./components/textStyleSetting/textStyleSettingRouter
|
12
|
+
var _textStyleSettingRouter = _interopRequireDefault(require("./components/textStyleSetting/textStyleSettingRouter"));
|
13
13
|
|
14
14
|
var _WidgetBox = _interopRequireDefault(require("./WidgetBox"));
|
15
15
|
|
@@ -17,31 +17,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
17
17
|
|
18
18
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
19
19
|
|
20
|
-
function FontFamilySelect(props) {
|
21
|
-
var value = props.value,
|
22
|
-
onChange = props.onChange;
|
23
|
-
var items = ['宋体', '微软雅黑', '黑体', 'Arial'];
|
24
|
-
return /*#__PURE__*/_react["default"].createElement(_DropdownMenu["default"], {
|
25
|
-
value: (items.includes(value) ? value : null) || '',
|
26
|
-
valueRender: function valueRender(val) {
|
27
|
-
return /*#__PURE__*/_react["default"].createElement("div", {
|
28
|
-
style: {
|
29
|
-
width: 48
|
30
|
-
}
|
31
|
-
}, val || '微软雅黑');
|
32
|
-
},
|
33
|
-
onSelect: onChange
|
34
|
-
}, items.map(function (item) {
|
35
|
-
return /*#__PURE__*/_react["default"].createElement(_DropdownMenu["default"].Item, {
|
36
|
-
key: item
|
37
|
-
}, /*#__PURE__*/_react["default"].createElement("div", {
|
38
|
-
style: {
|
39
|
-
fontFamily: item
|
40
|
-
}
|
41
|
-
}, item));
|
42
|
-
}));
|
43
|
-
}
|
44
|
-
|
45
20
|
function FontFamilyWidget(props) {
|
46
21
|
var topo = props.topo,
|
47
22
|
showLabel = props.showLabel,
|
@@ -51,7 +26,7 @@ function FontFamilyWidget(props) {
|
|
51
26
|
label: "\u5B57\u4F53",
|
52
27
|
tooltip: "\u5B57\u4F53",
|
53
28
|
showLabel: showLabel
|
54
|
-
}, /*#__PURE__*/_react["default"].createElement(
|
29
|
+
}, /*#__PURE__*/_react["default"].createElement(_FontFamilySelect["default"], {
|
55
30
|
value: style.fontFamily,
|
56
31
|
onChange: function onChange(val) {
|
57
32
|
topo.historyManager.beginTransaction();
|
@@ -7,9 +7,9 @@ exports["default"] = void 0;
|
|
7
7
|
|
8
8
|
var _react = _interopRequireWildcard(require("react"));
|
9
9
|
|
10
|
-
var
|
10
|
+
var _FontSizeSelect = _interopRequireDefault(require("./components/FontSizeSelect"));
|
11
11
|
|
12
|
-
var _textStyleSettingRouter = _interopRequireDefault(require("./components/textStyleSetting/textStyleSettingRouter
|
12
|
+
var _textStyleSettingRouter = _interopRequireDefault(require("./components/textStyleSetting/textStyleSettingRouter"));
|
13
13
|
|
14
14
|
var _WidgetBox = _interopRequireDefault(require("./WidgetBox"));
|
15
15
|
|
@@ -17,31 +17,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
17
17
|
|
18
18
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
19
19
|
|
20
|
-
function FontSizeSelect(props) {
|
21
|
-
var value = props.value,
|
22
|
-
disabled = props.disabled,
|
23
|
-
onChange = props.onChange;
|
24
|
-
var items = [12, 14, 16, 18, 20, 24, 30, 36, 48, 60, 80];
|
25
|
-
return /*#__PURE__*/_react["default"].createElement(_DropdownMenu["default"], {
|
26
|
-
value: "" + (value || ''),
|
27
|
-
valueRender: function valueRender(val) {
|
28
|
-
return /*#__PURE__*/_react["default"].createElement("div", {
|
29
|
-
style: {
|
30
|
-
width: 18
|
31
|
-
}
|
32
|
-
}, val || 20);
|
33
|
-
},
|
34
|
-
disabled: disabled,
|
35
|
-
onSelect: function onSelect(val) {
|
36
|
-
return onChange(parseInt(val, 10));
|
37
|
-
}
|
38
|
-
}, items.map(function (item) {
|
39
|
-
return /*#__PURE__*/_react["default"].createElement(_DropdownMenu["default"].Item, {
|
40
|
-
key: item
|
41
|
-
}, item);
|
42
|
-
}));
|
43
|
-
}
|
44
|
-
|
45
20
|
function FontSizeWidget(props) {
|
46
21
|
var topo = props.topo,
|
47
22
|
showLabel = props.showLabel,
|
@@ -57,7 +32,7 @@ function FontSizeWidget(props) {
|
|
57
32
|
tooltip: "\u5B57\u53F7",
|
58
33
|
showLabel: showLabel,
|
59
34
|
disabled: disabled
|
60
|
-
}, /*#__PURE__*/_react["default"].createElement(
|
35
|
+
}, /*#__PURE__*/_react["default"].createElement(_FontSizeSelect["default"], {
|
61
36
|
value: style.fontSize,
|
62
37
|
disabled: disabled,
|
63
38
|
onChange: function onChange(val) {
|