@riil-frontend/component-topology 11.0.7 → 11.0.9
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.css +1 -1
- package/build/index.js +27 -27
- package/es/components/VerticalIconTab/VerticalIconTab.js +1 -1
- package/es/core/components/TopoView/topoView.js +3 -0
- package/es/core/editor/components/BottomFloatTool/HelpIcon.module.scss +6 -0
- package/es/core/editor/hooks/useNewElementTheme.js +5 -1
- package/es/core/models/AttributeMetricDisplay.js +10 -58
- package/es/core/models/TopoApp.js +1 -1
- package/es/core/models/utils/nodeNameVisibleUtil.js +116 -0
- package/es/utils/topoData.js +10 -2
- package/lib/components/VerticalIconTab/VerticalIconTab.js +2 -2
- package/lib/core/components/TopoView/topoView.js +4 -0
- package/lib/core/editor/components/BottomFloatTool/HelpIcon.module.scss +6 -0
- package/lib/core/editor/hooks/useNewElementTheme.js +6 -1
- package/lib/core/models/AttributeMetricDisplay.js +11 -61
- package/lib/core/models/TopoApp.js +1 -1
- package/lib/core/models/utils/nodeNameVisibleUtil.js +128 -0
- package/lib/utils/topoData.js +11 -2
- package/package.json +2 -2
@@ -3,8 +3,8 @@ import _extends from "@babel/runtime/helpers/extends";
|
|
3
3
|
import _Balloon from "@alifd/next/es/balloon";
|
4
4
|
import React, { useState } from 'react';
|
5
5
|
import classNames from 'classnames';
|
6
|
-
import styles from "./VerticalIconTab.module.scss";
|
7
6
|
import variables from '@alifd/theme-19926/variables.js';
|
7
|
+
import styles from "./VerticalIconTab.module.scss";
|
8
8
|
/**
|
9
9
|
* 自定义标题
|
10
10
|
* @param {*} param0
|
@@ -27,6 +27,7 @@ import HistoryManager from "../../models/HistoryManager";
|
|
27
27
|
import editorStyles from "./editor.module.scss";
|
28
28
|
import basicIcons from "../../common/icons/basicIcons";
|
29
29
|
import HelpIcon from "../../editor/components/BottomFloatTool/HelpIcon";
|
30
|
+
import { updateNodesNameVisible } from "../../models/utils/nodeNameVisibleUtil";
|
30
31
|
|
31
32
|
var Topology = function Topology(props) {
|
32
33
|
var _classnames;
|
@@ -120,6 +121,7 @@ var Topology = function Topology(props) {
|
|
120
121
|
topoData: topoData,
|
121
122
|
htElements: topo.getDataModel().getDatas().toArray()
|
122
123
|
});
|
124
|
+
updateNodesNameVisible(topo);
|
123
125
|
upgradeV103GraphClusterNode(topo, topoData);
|
124
126
|
fixLink(topo);
|
125
127
|
handleClusterNoPermission(topo);
|
@@ -145,6 +147,7 @@ var Topology = function Topology(props) {
|
|
145
147
|
topoData: topoData,
|
146
148
|
htElements: topo.getDataModel().getDatas().toArray()
|
147
149
|
});
|
150
|
+
updateNodesNameVisible(topo);
|
148
151
|
upgradeV103GraphClusterNode(topo, topoData);
|
149
152
|
fixLink(topo);
|
150
153
|
handleClusterNoPermission(topo);
|
@@ -10,6 +10,7 @@
|
|
10
10
|
padding: 10px;
|
11
11
|
.next-balloon-close{
|
12
12
|
right: 10px;
|
13
|
+
top:8px
|
13
14
|
}
|
14
15
|
}
|
15
16
|
#dark.next-overlay-inner{
|
@@ -20,6 +21,7 @@
|
|
20
21
|
right: 10px;
|
21
22
|
/* color:$color-text1-5; */
|
22
23
|
color:#fff;
|
24
|
+
top:8px
|
23
25
|
}
|
24
26
|
}
|
25
27
|
#dark.next-overlay-inner:after{
|
@@ -47,12 +49,14 @@
|
|
47
49
|
color:$color-text1-6;
|
48
50
|
font-weight: 400;
|
49
51
|
line-height: 20px;
|
52
|
+
margin-top: 8px;
|
50
53
|
:global{
|
51
54
|
.next-row{
|
52
55
|
margin: 4px 0;
|
53
56
|
}
|
54
57
|
.next-col-8{
|
55
58
|
text-align: right;
|
59
|
+
color:$color-text1-4;
|
56
60
|
}
|
57
61
|
}
|
58
62
|
}
|
@@ -61,8 +65,10 @@
|
|
61
65
|
.darkBox{
|
62
66
|
background: #063658;
|
63
67
|
color:$color-text1-5;
|
68
|
+
opacity: 0.85;
|
64
69
|
.conten{
|
65
70
|
color:$color-text1-5;
|
71
|
+
opacity: 0.85;
|
66
72
|
}
|
67
73
|
}
|
68
74
|
}
|
@@ -1,6 +1,7 @@
|
|
1
1
|
import { useEffect } from 'react';
|
2
2
|
import THEMES from "../config/themes";
|
3
3
|
import ThemeUtil from "../utils/themeUtil";
|
4
|
+
import { setNewNodeNameVisible } from "../../models/utils/nodeNameVisibleUtil";
|
4
5
|
|
5
6
|
function useNewElementTheme(props) {
|
6
7
|
var topo = props.topo;
|
@@ -20,6 +21,7 @@ function useNewElementTheme(props) {
|
|
20
21
|
data = e.data;
|
21
22
|
|
22
23
|
if (kind === 'add') {
|
24
|
+
// 设置主题样式
|
23
25
|
var displayConfig = topo.store.getModelState('displayConfig');
|
24
26
|
var theme = displayConfig.canvasTheme || 'white';
|
25
27
|
var themeConfig = THEMES.find(function (item) {
|
@@ -31,7 +33,9 @@ function useNewElementTheme(props) {
|
|
31
33
|
}),
|
32
34
|
setElementTheme = _ThemeUtil.setElementTheme;
|
33
35
|
|
34
|
-
setElementTheme(data, themeConfig);
|
36
|
+
setElementTheme(data, themeConfig); // 临时放这里,新加入节点按配置显示隐藏名称
|
37
|
+
|
38
|
+
setNewNodeNameVisible(topo, data);
|
35
39
|
}
|
36
40
|
}
|
37
41
|
|
@@ -1,14 +1,12 @@
|
|
1
1
|
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
|
2
2
|
import _extends from "@babel/runtime/helpers/extends";
|
3
3
|
import _regeneratorRuntime from "@babel/runtime/regenerator";
|
4
|
-
import topoServer from '@riil-frontend/component-topology-common/es/services/topo';
|
5
4
|
import rlog from '@riil-frontend/component-topology-utils/es/rlog';
|
6
|
-
import { keyBy } from 'lodash';
|
7
5
|
import { DEFAULT_NODE_TAG_COMMON_CONFIG, DEFAULT_TIP_COMMON_CONFIG } from "../../constants/ResourceInfoDisplay";
|
8
|
-
import { queryCisByIds } from "../services";
|
9
6
|
import { isMonitoring } from "../utils/manageStatusUtil";
|
10
7
|
import AttributeFormatter from "./attributeFormatter";
|
11
8
|
import DictCache from "./cache/DictCache";
|
9
|
+
import { getNodesNameVisible as _getNodesNameVisible, updateNodesNameVisible as _updateNodesNameVisible } from "./utils/nodeNameVisibleUtil";
|
12
10
|
|
13
11
|
function isGraphField(item) {
|
14
12
|
return item.type === 'graph';
|
@@ -293,67 +291,21 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
293
291
|
});
|
294
292
|
});
|
295
293
|
return metricCodes;
|
296
|
-
}
|
297
|
-
/**
|
298
|
-
* 从配置获得节点名称是否显示
|
299
|
-
* @param {*} node
|
300
|
-
* @returns
|
301
|
-
*/
|
302
|
-
;
|
303
|
-
|
304
|
-
_proto.getNodeNameVisible = function getNodeNameVisible(node) {
|
305
|
-
// if (!this.topo.isViewMode()) {
|
306
|
-
// return true;
|
307
|
-
// }
|
308
|
-
var _this$getConfig3 = this.getConfig(),
|
309
|
-
nodeTag = _this$getConfig3.nodeTag;
|
310
|
-
|
311
|
-
var visible = true;
|
312
|
-
|
313
|
-
if (nodeTag) {
|
314
|
-
var isCustom = nodeTag.isCustom,
|
315
|
-
data = nodeTag.data;
|
316
|
-
var items = (isCustom ? data[node.ciType] : data) || [];
|
317
|
-
visible = !!items.filter(function (item) {
|
318
|
-
return item.type === 'graph';
|
319
|
-
}).length; // ipNode逻辑
|
320
|
-
|
321
|
-
if (isCustom && node.bindType === 'ip') {
|
322
|
-
visible = true;
|
323
|
-
}
|
324
|
-
}
|
325
|
-
|
326
|
-
return visible;
|
327
294
|
};
|
328
295
|
|
329
296
|
_proto.getNodesNameVisible = function getNodesNameVisible() {
|
330
|
-
|
331
|
-
|
332
|
-
var nodes = this.topo.dataModel.getNodes();
|
333
|
-
return nodes.map(function (node) {
|
334
|
-
// console.log("getNodesNameVisible", node);
|
335
|
-
return {
|
336
|
-
id: node.id,
|
337
|
-
visible: _this4.getNodeNameVisible(node)
|
338
|
-
};
|
339
|
-
});
|
297
|
+
return _getNodesNameVisible(this.topo);
|
340
298
|
}
|
341
299
|
/**
|
342
300
|
* 根据配置执行节点名称显示隐藏
|
301
|
+
* 1. 资源根据标注配置显示隐藏
|
302
|
+
* 2. 默认标注配置不勾选图片名称,图片节点名称不显示
|
303
|
+
* 3. 自定义标注配置,图片名称显示
|
343
304
|
*/
|
344
305
|
;
|
345
306
|
|
346
307
|
_proto.updateNodesNameVisible = function updateNodesNameVisible() {
|
347
|
-
|
348
|
-
this.getNodesNameVisible().forEach(function (_ref) {
|
349
|
-
var id = _ref.id,
|
350
|
-
visible = _ref.visible;
|
351
|
-
var ele = dm.getDataByTag(id); //
|
352
|
-
|
353
|
-
if (ele) {
|
354
|
-
ele.a('isShowName', visible);
|
355
|
-
}
|
356
|
-
});
|
308
|
+
_updateNodesNameVisible(this.topo);
|
357
309
|
}
|
358
310
|
/**
|
359
311
|
* 加载标注、悬浮框数据
|
@@ -457,7 +409,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
457
409
|
/*#__PURE__*/
|
458
410
|
function () {
|
459
411
|
var _translateRefAttribute = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3(ciDatas) {
|
460
|
-
var
|
412
|
+
var _this4 = this;
|
461
413
|
|
462
414
|
var refIdMap, ciRefAttributeMap, refIds, refCiMap;
|
463
415
|
return _regeneratorRuntime.wrap(function _callee3$(_context3) {
|
@@ -473,7 +425,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
473
425
|
attributeMap = ciData.attributeMap;
|
474
426
|
ciRefAttributeMap[id] = [];
|
475
427
|
|
476
|
-
var ciTypeMeta =
|
428
|
+
var ciTypeMeta = _this4.topo.ciTyeCache.getCiType(ciType);
|
477
429
|
|
478
430
|
if (ciTypeMeta) {
|
479
431
|
ciTypeMeta.attributes.filter(function (attributeMeta) {
|
@@ -653,14 +605,14 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
653
605
|
;
|
654
606
|
|
655
607
|
_proto.buildTagsTips = function buildTagsTips() {
|
656
|
-
var
|
608
|
+
var _this5 = this,
|
657
609
|
_this$extElementTagTi;
|
658
610
|
|
659
611
|
// 获取标注、悬浮框配置
|
660
612
|
var ciConfigs = this.getResourceTagTipConfig(); // console.log("buildTagsTips---ciConfigs", ciConfigs);
|
661
613
|
|
662
614
|
var ciTagsAndTips = ciConfigs.map(function (ciConfig) {
|
663
|
-
return
|
615
|
+
return _this5.buildElementTagsTips(ciConfig.id);
|
664
616
|
}); // console.log("ciTagsAndTips", ciTagsAndTips);
|
665
617
|
|
666
618
|
var extTagsAndTips = ((_this$extElementTagTi = this.extElementTagTipBuilder) === null || _this$extElementTagTi === void 0 ? void 0 : _this$extElementTagTi.getExtElementTagsAndTips()) || [];
|
@@ -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 "11.0.
|
27
|
+
var version = typeof "11.0.9" === 'string' ? "11.0.9" : null;
|
28
28
|
console.info("\u62D3\u6251\u7248\u672C: " + version);
|
29
29
|
/**
|
30
30
|
* 拓扑显示和编辑
|
@@ -0,0 +1,116 @@
|
|
1
|
+
import { getNodes, isNode } from "../../../utils/htElementUtils";
|
2
|
+
/**
|
3
|
+
* 根据配置执行节点名称显示隐藏
|
4
|
+
* 1. 资源根据标注配置显示隐藏
|
5
|
+
* 2. 默认标注配置不勾选图片名称,图片节点名称不显示
|
6
|
+
* 3. 自定义标注配置,图片名称显示
|
7
|
+
*/
|
8
|
+
|
9
|
+
export function updateNodesNameVisible(topo) {
|
10
|
+
getNodesNameVisible(topo).forEach(function (_ref) {
|
11
|
+
var htNode = _ref.htNode,
|
12
|
+
visible = _ref.visible;
|
13
|
+
var prevVisible = htNode.a('isShowName');
|
14
|
+
|
15
|
+
if (prevVisible !== visible) {
|
16
|
+
htNode.a('isShowName', visible);
|
17
|
+
}
|
18
|
+
});
|
19
|
+
}
|
20
|
+
/**
|
21
|
+
* 新加入节点按配置显示隐藏名称
|
22
|
+
* @param {*} topo
|
23
|
+
*/
|
24
|
+
|
25
|
+
export function setNewNodeNameVisible(topo, element) {
|
26
|
+
if (isNode(element)) {
|
27
|
+
var _topo$store$getModelS = topo.store.getModelState('displayConfig'),
|
28
|
+
nodeTag = _topo$store$getModelS.nodeTag;
|
29
|
+
|
30
|
+
var nameVisible = getNodeNameVisible({
|
31
|
+
node: element,
|
32
|
+
topo: topo,
|
33
|
+
nodeTag: nodeTag
|
34
|
+
});
|
35
|
+
element.a('isShowName', nameVisible);
|
36
|
+
}
|
37
|
+
}
|
38
|
+
export function getNodesNameVisible(topo) {
|
39
|
+
var _topo$store$getModelS2 = topo.store.getModelState('displayConfig'),
|
40
|
+
nodeTag = _topo$store$getModelS2.nodeTag;
|
41
|
+
|
42
|
+
var dm = topo.getDataModel();
|
43
|
+
var htNodes = getNodes(dm);
|
44
|
+
return htNodes.map(function (htNode) {
|
45
|
+
var node = topo.dataModel.getDataById(htNode.getTag());
|
46
|
+
return {
|
47
|
+
htNode: htNode,
|
48
|
+
node: node,
|
49
|
+
visible: getNodeNameVisible({
|
50
|
+
node: node,
|
51
|
+
topo: topo,
|
52
|
+
nodeTag: nodeTag
|
53
|
+
})
|
54
|
+
};
|
55
|
+
});
|
56
|
+
}
|
57
|
+
/**
|
58
|
+
* 从配置获得资源节点名称是否显示
|
59
|
+
* @param {*} node
|
60
|
+
* @returns
|
61
|
+
*/
|
62
|
+
|
63
|
+
export function getNodeNameVisible(_ref2) {
|
64
|
+
var node = _ref2.node,
|
65
|
+
topo = _ref2.topo,
|
66
|
+
nodeTag = _ref2.nodeTag;
|
67
|
+
|
68
|
+
if (node !== null && node !== void 0 && node.ciType) {
|
69
|
+
return getCiNodeNameVisible({
|
70
|
+
node: node,
|
71
|
+
nodeTag: nodeTag
|
72
|
+
});
|
73
|
+
} else {
|
74
|
+
return getCommonNodeNameVisible({
|
75
|
+
node: node,
|
76
|
+
nodeTag: nodeTag
|
77
|
+
});
|
78
|
+
}
|
79
|
+
} // 非CI节点
|
80
|
+
|
81
|
+
function getCommonNodeNameVisible(_ref3) {
|
82
|
+
var node = _ref3.node,
|
83
|
+
nodeTag = _ref3.nodeTag;
|
84
|
+
var visible = true;
|
85
|
+
|
86
|
+
if (nodeTag) {
|
87
|
+
var isCustom = nodeTag.isCustom,
|
88
|
+
data = nodeTag.data;
|
89
|
+
|
90
|
+
if (!isCustom) {
|
91
|
+
var items = data || [];
|
92
|
+
visible = !!items.filter(function (item) {
|
93
|
+
return item.type === 'graph';
|
94
|
+
}).length;
|
95
|
+
}
|
96
|
+
}
|
97
|
+
|
98
|
+
return visible;
|
99
|
+
}
|
100
|
+
|
101
|
+
function getCiNodeNameVisible(_ref4) {
|
102
|
+
var node = _ref4.node,
|
103
|
+
nodeTag = _ref4.nodeTag;
|
104
|
+
var visible = true;
|
105
|
+
|
106
|
+
if (nodeTag) {
|
107
|
+
var isCustom = nodeTag.isCustom,
|
108
|
+
data = nodeTag.data;
|
109
|
+
var items = (isCustom ? data[node.ciType] : data) || [];
|
110
|
+
visible = !!items.filter(function (item) {
|
111
|
+
return item.type === 'graph';
|
112
|
+
}).length;
|
113
|
+
}
|
114
|
+
|
115
|
+
return visible;
|
116
|
+
}
|
package/es/utils/topoData.js
CHANGED
@@ -11,6 +11,7 @@ import { getBackgroundImageUrl } from "../core/utils/backgroundUtil";
|
|
11
11
|
import { isClusterHtElement, processCluster } from "./clusterUtil";
|
12
12
|
import { isGroup } from "./htElementUtils";
|
13
13
|
import v140UpgradeSerializeNodeImageSize from "../core/upgrade/v140UpgradeSerializeNodeImageSize";
|
14
|
+
import { getNodeNameVisible } from "../core/models/utils/nodeNameVisibleUtil";
|
14
15
|
/**
|
15
16
|
* 查找数组中对应key的值为value的元素并返回,只查找第一个符合的元素
|
16
17
|
* @param {Array} arr 数组
|
@@ -63,13 +64,20 @@ var tfNode = function tfNode(topoEngine, node) {
|
|
63
64
|
*/
|
64
65
|
|
65
66
|
|
66
|
-
function updateNodeInfo(
|
67
|
+
function updateNodeInfo(topo, topoData) {
|
68
|
+
var _topo$store$getModelS = topo.store.getModelState('displayConfig'),
|
69
|
+
nodeTag = _topo$store$getModelS.nodeTag;
|
70
|
+
|
67
71
|
return _extends({}, topoData, {
|
68
72
|
nodes: topoData.nodes.map(function (node) {
|
69
73
|
var attributes = node.attributes;
|
70
74
|
return _extends({}, node, {
|
71
75
|
ipAddress: node.ipAddress || (attributes === null || attributes === void 0 ? void 0 : attributes.ipv4_address) || null,
|
72
|
-
isShowName:
|
76
|
+
isShowName: getNodeNameVisible({
|
77
|
+
node: node,
|
78
|
+
topo: topo,
|
79
|
+
nodeTag: nodeTag
|
80
|
+
})
|
73
81
|
});
|
74
82
|
})
|
75
83
|
});
|
@@ -15,10 +15,10 @@ var _react = _interopRequireWildcard(require("react"));
|
|
15
15
|
|
16
16
|
var _classnames = _interopRequireDefault(require("classnames"));
|
17
17
|
|
18
|
-
var _VerticalIconTabModule = _interopRequireDefault(require("./VerticalIconTab.module.scss"));
|
19
|
-
|
20
18
|
var _variables = _interopRequireDefault(require("@alifd/theme-19926/variables.js"));
|
21
19
|
|
20
|
+
var _VerticalIconTabModule = _interopRequireDefault(require("./VerticalIconTab.module.scss"));
|
21
|
+
|
22
22
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
23
23
|
|
24
24
|
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; }
|
@@ -57,6 +57,8 @@ var _basicIcons = _interopRequireDefault(require("../../common/icons/basicIcons"
|
|
57
57
|
|
58
58
|
var _HelpIcon = _interopRequireDefault(require("../../editor/components/BottomFloatTool/HelpIcon"));
|
59
59
|
|
60
|
+
var _nodeNameVisibleUtil = require("../../models/utils/nodeNameVisibleUtil");
|
61
|
+
|
60
62
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
61
63
|
|
62
64
|
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; }
|
@@ -159,6 +161,7 @@ var Topology = function Topology(props) {
|
|
159
161
|
htElements: topo.getDataModel().getDatas().toArray()
|
160
162
|
});
|
161
163
|
|
164
|
+
(0, _nodeNameVisibleUtil.updateNodesNameVisible)(topo);
|
162
165
|
(0, _clusterUtil.upgradeV103GraphClusterNode)(topo, topoData);
|
163
166
|
(0, _graphLinkUtil.fixLink)(topo);
|
164
167
|
(0, _clusterUtil.handleClusterNoPermission)(topo);
|
@@ -185,6 +188,7 @@ var Topology = function Topology(props) {
|
|
185
188
|
htElements: topo.getDataModel().getDatas().toArray()
|
186
189
|
});
|
187
190
|
|
191
|
+
(0, _nodeNameVisibleUtil.updateNodesNameVisible)(topo);
|
188
192
|
(0, _clusterUtil.upgradeV103GraphClusterNode)(topo, topoData);
|
189
193
|
(0, _graphLinkUtil.fixLink)(topo);
|
190
194
|
(0, _clusterUtil.handleClusterNoPermission)(topo);
|
@@ -10,6 +10,7 @@
|
|
10
10
|
padding: 10px;
|
11
11
|
.next-balloon-close{
|
12
12
|
right: 10px;
|
13
|
+
top:8px
|
13
14
|
}
|
14
15
|
}
|
15
16
|
#dark.next-overlay-inner{
|
@@ -20,6 +21,7 @@
|
|
20
21
|
right: 10px;
|
21
22
|
/* color:$color-text1-5; */
|
22
23
|
color:#fff;
|
24
|
+
top:8px
|
23
25
|
}
|
24
26
|
}
|
25
27
|
#dark.next-overlay-inner:after{
|
@@ -47,12 +49,14 @@
|
|
47
49
|
color:$color-text1-6;
|
48
50
|
font-weight: 400;
|
49
51
|
line-height: 20px;
|
52
|
+
margin-top: 8px;
|
50
53
|
:global{
|
51
54
|
.next-row{
|
52
55
|
margin: 4px 0;
|
53
56
|
}
|
54
57
|
.next-col-8{
|
55
58
|
text-align: right;
|
59
|
+
color:$color-text1-4;
|
56
60
|
}
|
57
61
|
}
|
58
62
|
}
|
@@ -61,8 +65,10 @@
|
|
61
65
|
.darkBox{
|
62
66
|
background: #063658;
|
63
67
|
color:$color-text1-5;
|
68
|
+
opacity: 0.85;
|
64
69
|
.conten{
|
65
70
|
color:$color-text1-5;
|
71
|
+
opacity: 0.85;
|
66
72
|
}
|
67
73
|
}
|
68
74
|
}
|
@@ -11,6 +11,8 @@ var _themes = _interopRequireDefault(require("../config/themes"));
|
|
11
11
|
|
12
12
|
var _themeUtil = _interopRequireDefault(require("../utils/themeUtil"));
|
13
13
|
|
14
|
+
var _nodeNameVisibleUtil = require("../../models/utils/nodeNameVisibleUtil");
|
15
|
+
|
14
16
|
function useNewElementTheme(props) {
|
15
17
|
var topo = props.topo;
|
16
18
|
var topoModState = topo.store.useModelState('topoMod');
|
@@ -29,6 +31,7 @@ function useNewElementTheme(props) {
|
|
29
31
|
data = e.data;
|
30
32
|
|
31
33
|
if (kind === 'add') {
|
34
|
+
// 设置主题样式
|
32
35
|
var displayConfig = topo.store.getModelState('displayConfig');
|
33
36
|
var theme = displayConfig.canvasTheme || 'white';
|
34
37
|
|
@@ -41,7 +44,9 @@ function useNewElementTheme(props) {
|
|
41
44
|
}),
|
42
45
|
setElementTheme = _ThemeUtil.setElementTheme;
|
43
46
|
|
44
|
-
setElementTheme(data, themeConfig);
|
47
|
+
setElementTheme(data, themeConfig); // 临时放这里,新加入节点按配置显示隐藏名称
|
48
|
+
|
49
|
+
(0, _nodeNameVisibleUtil.setNewNodeNameVisible)(topo, data);
|
45
50
|
}
|
46
51
|
}
|
47
52
|
|
@@ -11,22 +11,18 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
|
|
11
11
|
|
12
12
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
13
13
|
|
14
|
-
var _topo = _interopRequireDefault(require("@riil-frontend/component-topology-common/es/services/topo"));
|
15
|
-
|
16
14
|
var _rlog = _interopRequireDefault(require("@riil-frontend/component-topology-utils/es/rlog"));
|
17
15
|
|
18
|
-
var _lodash = require("lodash");
|
19
|
-
|
20
16
|
var _ResourceInfoDisplay = require("../../constants/ResourceInfoDisplay");
|
21
17
|
|
22
|
-
var _services = require("../services");
|
23
|
-
|
24
18
|
var _manageStatusUtil = require("../utils/manageStatusUtil");
|
25
19
|
|
26
20
|
var _attributeFormatter = _interopRequireDefault(require("./attributeFormatter"));
|
27
21
|
|
28
22
|
var _DictCache = _interopRequireDefault(require("./cache/DictCache"));
|
29
23
|
|
24
|
+
var _nodeNameVisibleUtil = require("./utils/nodeNameVisibleUtil");
|
25
|
+
|
30
26
|
function isGraphField(item) {
|
31
27
|
return item.type === 'graph';
|
32
28
|
}
|
@@ -310,67 +306,21 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
310
306
|
});
|
311
307
|
});
|
312
308
|
return metricCodes;
|
313
|
-
}
|
314
|
-
/**
|
315
|
-
* 从配置获得节点名称是否显示
|
316
|
-
* @param {*} node
|
317
|
-
* @returns
|
318
|
-
*/
|
319
|
-
;
|
320
|
-
|
321
|
-
_proto.getNodeNameVisible = function getNodeNameVisible(node) {
|
322
|
-
// if (!this.topo.isViewMode()) {
|
323
|
-
// return true;
|
324
|
-
// }
|
325
|
-
var _this$getConfig3 = this.getConfig(),
|
326
|
-
nodeTag = _this$getConfig3.nodeTag;
|
327
|
-
|
328
|
-
var visible = true;
|
329
|
-
|
330
|
-
if (nodeTag) {
|
331
|
-
var isCustom = nodeTag.isCustom,
|
332
|
-
data = nodeTag.data;
|
333
|
-
var items = (isCustom ? data[node.ciType] : data) || [];
|
334
|
-
visible = !!items.filter(function (item) {
|
335
|
-
return item.type === 'graph';
|
336
|
-
}).length; // ipNode逻辑
|
337
|
-
|
338
|
-
if (isCustom && node.bindType === 'ip') {
|
339
|
-
visible = true;
|
340
|
-
}
|
341
|
-
}
|
342
|
-
|
343
|
-
return visible;
|
344
309
|
};
|
345
310
|
|
346
311
|
_proto.getNodesNameVisible = function getNodesNameVisible() {
|
347
|
-
|
348
|
-
|
349
|
-
var nodes = this.topo.dataModel.getNodes();
|
350
|
-
return nodes.map(function (node) {
|
351
|
-
// console.log("getNodesNameVisible", node);
|
352
|
-
return {
|
353
|
-
id: node.id,
|
354
|
-
visible: _this4.getNodeNameVisible(node)
|
355
|
-
};
|
356
|
-
});
|
312
|
+
return (0, _nodeNameVisibleUtil.getNodesNameVisible)(this.topo);
|
357
313
|
}
|
358
314
|
/**
|
359
315
|
* 根据配置执行节点名称显示隐藏
|
316
|
+
* 1. 资源根据标注配置显示隐藏
|
317
|
+
* 2. 默认标注配置不勾选图片名称,图片节点名称不显示
|
318
|
+
* 3. 自定义标注配置,图片名称显示
|
360
319
|
*/
|
361
320
|
;
|
362
321
|
|
363
322
|
_proto.updateNodesNameVisible = function updateNodesNameVisible() {
|
364
|
-
|
365
|
-
this.getNodesNameVisible().forEach(function (_ref) {
|
366
|
-
var id = _ref.id,
|
367
|
-
visible = _ref.visible;
|
368
|
-
var ele = dm.getDataByTag(id); //
|
369
|
-
|
370
|
-
if (ele) {
|
371
|
-
ele.a('isShowName', visible);
|
372
|
-
}
|
373
|
-
});
|
323
|
+
(0, _nodeNameVisibleUtil.updateNodesNameVisible)(this.topo);
|
374
324
|
}
|
375
325
|
/**
|
376
326
|
* 加载标注、悬浮框数据
|
@@ -474,7 +424,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
474
424
|
/*#__PURE__*/
|
475
425
|
function () {
|
476
426
|
var _translateRefAttribute = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3(ciDatas) {
|
477
|
-
var
|
427
|
+
var _this4 = this;
|
478
428
|
|
479
429
|
var refIdMap, ciRefAttributeMap, refIds, refCiMap;
|
480
430
|
return _regenerator["default"].wrap(function _callee3$(_context3) {
|
@@ -490,7 +440,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
490
440
|
attributeMap = ciData.attributeMap;
|
491
441
|
ciRefAttributeMap[id] = [];
|
492
442
|
|
493
|
-
var ciTypeMeta =
|
443
|
+
var ciTypeMeta = _this4.topo.ciTyeCache.getCiType(ciType);
|
494
444
|
|
495
445
|
if (ciTypeMeta) {
|
496
446
|
ciTypeMeta.attributes.filter(function (attributeMeta) {
|
@@ -667,14 +617,14 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
667
617
|
;
|
668
618
|
|
669
619
|
_proto.buildTagsTips = function buildTagsTips() {
|
670
|
-
var
|
620
|
+
var _this5 = this,
|
671
621
|
_this$extElementTagTi;
|
672
622
|
|
673
623
|
// 获取标注、悬浮框配置
|
674
624
|
var ciConfigs = this.getResourceTagTipConfig(); // console.log("buildTagsTips---ciConfigs", ciConfigs);
|
675
625
|
|
676
626
|
var ciTagsAndTips = ciConfigs.map(function (ciConfig) {
|
677
|
-
return
|
627
|
+
return _this5.buildElementTagsTips(ciConfig.id);
|
678
628
|
}); // console.log("ciTagsAndTips", ciTagsAndTips);
|
679
629
|
|
680
630
|
var extTagsAndTips = ((_this$extElementTagTi = this.extElementTagTipBuilder) === null || _this$extElementTagTi === void 0 ? void 0 : _this$extElementTagTi.getExtElementTagsAndTips()) || [];
|
@@ -56,7 +56,7 @@ var _SelectionModel = _interopRequireDefault(require("./SelectionModel"));
|
|
56
56
|
var _CiCache = _interopRequireDefault(require("./cache/CiCache"));
|
57
57
|
|
58
58
|
// eslint-disable-next-line no-undef
|
59
|
-
var version = typeof "11.0.
|
59
|
+
var version = typeof "11.0.9" === 'string' ? "11.0.9" : null;
|
60
60
|
console.info("\u62D3\u6251\u7248\u672C: " + version);
|
61
61
|
/**
|
62
62
|
* 拓扑显示和编辑
|