@riil-frontend/component-topology 10.0.22 → 10.0.23
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 +1 -1
- package/es/core/editor/components/Sidebar/views/ImagePanel/HtCustomImagePanel.js +7 -0
- package/es/core/editor/components/Sidebar/views/ImagePanel/ImagePanel.js +2 -0
- package/es/core/models/AttributeMetricDisplay.js +79 -67
- package/es/core/models/TopoApp.js +1 -1
- package/es/core/models/utils/linkUtils.js +1 -8
- package/es/core/viewer/components/plugins/ElementDetailDrawer/hooks/useElementDetailManager.js +16 -3
- package/es/core/viewer/components/plugins/ResourceDetail/DefaultDetailContent.js +0 -1
- package/es/core/viewer/components/plugins/ResourceDetail/ResourceDetailDrawer.js +3 -3
- package/es/core/viewer/components/plugins/ResourceDetail/ResourceDetailPlugin.js +1 -1
- package/es/networkTopo/models/EdgeGroupTagTipBuilder.js +49 -0
- package/es/networkTopo/models/ExtElementTagTipBuilder.js +22 -0
- package/es/networkTopo/models/TopoCenter.js +2 -2
- package/es/networkTopo/utils/edgeGroupTagUtil.js +10 -0
- package/es/utils/htElementUtils.js +3 -0
- package/lib/core/editor/components/Sidebar/views/ImagePanel/HtCustomImagePanel.js +7 -0
- package/lib/core/editor/components/Sidebar/views/ImagePanel/ImagePanel.js +2 -0
- package/lib/core/models/AttributeMetricDisplay.js +75 -64
- package/lib/core/models/TopoApp.js +1 -1
- package/lib/core/models/utils/linkUtils.js +1 -8
- package/lib/core/viewer/components/plugins/ElementDetailDrawer/hooks/useElementDetailManager.js +15 -2
- package/lib/core/viewer/components/plugins/ResourceDetail/DefaultDetailContent.js +0 -1
- package/lib/core/viewer/components/plugins/ResourceDetail/ResourceDetailDrawer.js +3 -3
- package/lib/core/viewer/components/plugins/ResourceDetail/ResourceDetailPlugin.js +1 -1
- package/lib/networkTopo/models/EdgeGroupTagTipBuilder.js +55 -0
- package/lib/networkTopo/models/ExtElementTagTipBuilder.js +30 -0
- package/lib/networkTopo/models/TopoCenter.js +2 -2
- package/lib/networkTopo/utils/edgeGroupTagUtil.js +15 -0
- package/lib/utils/htElementUtils.js +5 -0
- package/package.json +2 -2
@@ -46,6 +46,13 @@ export default function HtCustomImagePanel(props) {
|
|
46
46
|
}
|
47
47
|
};
|
48
48
|
}, []);
|
49
|
+
useEffect(function () {
|
50
|
+
var view = viewRef.current;
|
51
|
+
|
52
|
+
if (view && view.setIcons) {
|
53
|
+
view.setIcons(icons);
|
54
|
+
}
|
55
|
+
}, [icons]);
|
49
56
|
return /*#__PURE__*/React.createElement("div", {
|
50
57
|
ref: divRef,
|
51
58
|
className: styles.container
|
@@ -63,6 +63,7 @@ export default function ImagePanel(props) {
|
|
63
63
|
var renderImageContent = function renderImageContent() {
|
64
64
|
var panels = [{
|
65
65
|
key: '资源图片',
|
66
|
+
hidden: searchValue && !resourceIcons.length,
|
66
67
|
render: function render() {
|
67
68
|
return /*#__PURE__*/React.createElement(CollapsePanel, {
|
68
69
|
key: "\u8D44\u6E90\u56FE\u7247",
|
@@ -74,6 +75,7 @@ export default function ImagePanel(props) {
|
|
74
75
|
}
|
75
76
|
}, {
|
76
77
|
key: '基础图片',
|
78
|
+
hidden: searchValue && !basicIcons.length,
|
77
79
|
render: function render() {
|
78
80
|
return /*#__PURE__*/React.createElement(CollapsePanel, {
|
79
81
|
key: "\u57FA\u7840\u56FE\u7247",
|
@@ -1,23 +1,22 @@
|
|
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
|
5
|
-
import rlog from
|
6
|
-
import { keyBy } from
|
4
|
+
import topoServer from '@riil-frontend/component-topology-common/es/services/topo';
|
5
|
+
import rlog from '@riil-frontend/component-topology-utils/es/rlog';
|
6
|
+
import { keyBy } from 'lodash';
|
7
7
|
import { DEFAULT_NODE_TAG_COMMON_CONFIG, DEFAULT_TIP_COMMON_CONFIG } from "../../constants/ResourceInfoDisplay";
|
8
|
-
import { findItem } from "../../utils/topoData";
|
9
8
|
import { queryCisByIds } from "../services";
|
10
9
|
import { isMonitoring } from "../utils/manageStatusUtil";
|
11
10
|
import AttributeFormatter from "./attributeFormatter";
|
12
11
|
import DictCache from "./cache/DictCache";
|
13
12
|
|
14
13
|
function isGraphField(item) {
|
15
|
-
return item.type ===
|
14
|
+
return item.type === 'graph';
|
16
15
|
}
|
17
16
|
|
18
17
|
function filterUnExistedFields(fields, ciTypeMeta) {
|
19
18
|
function isFieldExisted(item, ciTypeMeta) {
|
20
|
-
return item.type ===
|
19
|
+
return item.type === 'attribute' && ciTypeMeta.attributeMap[item.code] || item.type === 'metric' && ciTypeMeta.metricMap[item.code] || item.type !== 'attribute' && item.type !== 'metric';
|
21
20
|
}
|
22
21
|
|
23
22
|
return fields.filter(function (item) {
|
@@ -34,7 +33,8 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
34
33
|
var _this$topo$options$ta;
|
35
34
|
|
36
35
|
this.topo = topo;
|
37
|
-
|
36
|
+
this.formatter = new AttributeFormatter(this.topo);
|
37
|
+
var ExtElementTagTipBuilder = (_this$topo$options$ta = this.topo.options.tagTip) === null || _this$topo$options$ta === void 0 ? void 0 : _this$topo$options$ta.extElementTagTipBuilder;
|
38
38
|
|
39
39
|
if (ExtElementTagTipBuilder) {
|
40
40
|
this.extElementTagTipBuilder = new ExtElementTagTipBuilder(this);
|
@@ -44,7 +44,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
44
44
|
var _proto = AttributeMetricDisplay.prototype;
|
45
45
|
|
46
46
|
_proto.getConfig = function getConfig() {
|
47
|
-
var _this$topo$store$getM = this.topo.store.getModelState(
|
47
|
+
var _this$topo$store$getM = this.topo.store.getModelState('displayConfig'),
|
48
48
|
nodeTag = _this$topo$store$getM.nodeTag,
|
49
49
|
nodeTip = _this$topo$store$getM.nodeTip,
|
50
50
|
linkTag = _this$topo$store$getM.linkTag,
|
@@ -108,7 +108,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
108
108
|
|
109
109
|
return [].concat(links.map(function (link) {
|
110
110
|
return _extends({}, link, {
|
111
|
-
type:
|
111
|
+
type: 'edge'
|
112
112
|
});
|
113
113
|
}));
|
114
114
|
};
|
@@ -121,14 +121,14 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
121
121
|
|
122
122
|
|
123
123
|
var nodeArr = [];
|
124
|
-
nodes.
|
125
|
-
if (
|
124
|
+
nodes.forEach(function (node) {
|
125
|
+
if (node.ciType) {
|
126
126
|
var ciType = node.ciType;
|
127
127
|
|
128
128
|
var ciTypeConfig = _this.getNodeCiTypeConfig(ciType);
|
129
129
|
|
130
130
|
nodeArr.push({
|
131
|
-
type:
|
131
|
+
type: 'node',
|
132
132
|
id: node.id,
|
133
133
|
ciType: ciType,
|
134
134
|
tags: _this.filterCiFiledConfigItems(node, ciTypeConfig.tags),
|
@@ -151,7 +151,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
151
151
|
|
152
152
|
if (!isMonitoring(data)) {
|
153
153
|
list = list.filter(function (item) {
|
154
|
-
return item.type !==
|
154
|
+
return item.type !== 'metric';
|
155
155
|
});
|
156
156
|
}
|
157
157
|
|
@@ -160,7 +160,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
160
160
|
;
|
161
161
|
|
162
162
|
_proto.getModelType = function getModelType(ci) {
|
163
|
-
if (ci.ciType ===
|
163
|
+
if (ci.ciType === 'network_link') {
|
164
164
|
return ci.attributes.support_templates;
|
165
165
|
}
|
166
166
|
|
@@ -200,9 +200,9 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
200
200
|
return {
|
201
201
|
tags: getItems(linkTagConfig),
|
202
202
|
tagLinkArrow: {
|
203
|
-
1:
|
204
|
-
2:
|
205
|
-
3:
|
203
|
+
1: 'both',
|
204
|
+
2: 'from',
|
205
|
+
3: 'to'
|
206
206
|
}[linkTagConfig === null || linkTagConfig === void 0 ? void 0 : linkTagConfig.type] || undefined,
|
207
207
|
tips: getItems(linkTip || defaultLinkTipConfig)
|
208
208
|
};
|
@@ -262,7 +262,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
262
262
|
}
|
263
263
|
}); // 增加概览需要的指标字段
|
264
264
|
|
265
|
-
var overviewState = _this3.topo.store.getModelState(
|
265
|
+
var overviewState = _this3.topo.store.getModelState('topoBaseInfoOverview');
|
266
266
|
|
267
267
|
if (overviewState.id === fields.id) {
|
268
268
|
overviewState.metricCodes.forEach(function (code) {
|
@@ -315,10 +315,10 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
315
315
|
data = nodeTag.data;
|
316
316
|
var items = (isCustom ? data[node.ciType] : data) || [];
|
317
317
|
visible = !!items.filter(function (item) {
|
318
|
-
return item.type ===
|
318
|
+
return item.type === 'graph';
|
319
319
|
}).length; // ipNode逻辑
|
320
320
|
|
321
|
-
if (isCustom && node.bindType ===
|
321
|
+
if (isCustom && node.bindType === 'ip') {
|
322
322
|
visible = true;
|
323
323
|
}
|
324
324
|
}
|
@@ -351,7 +351,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
351
351
|
var ele = dm.getDataByTag(id); //
|
352
352
|
|
353
353
|
if (ele) {
|
354
|
-
ele.a(
|
354
|
+
ele.a('isShowName', visible);
|
355
355
|
}
|
356
356
|
});
|
357
357
|
}
|
@@ -388,7 +388,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
388
388
|
|
389
389
|
case 4:
|
390
390
|
ciDatas = _context.sent;
|
391
|
-
bizDispatchers = topo.store.getModelDispatchers(
|
391
|
+
bizDispatchers = topo.store.getModelDispatchers('topoBizMod');
|
392
392
|
_context.next = 8;
|
393
393
|
return bizDispatchers.setAttrsAndMetrics(ciDatas);
|
394
394
|
|
@@ -557,7 +557,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
557
557
|
|
558
558
|
var elementTagsAndTips = this.buildTagsTips() // 开锁状态下禁用悬停展示悬浮框
|
559
559
|
.map(function (item) {
|
560
|
-
var _topo$store$getModelS = topo.store.getModelState(
|
560
|
+
var _topo$store$getModelS = topo.store.getModelState('lock'),
|
561
561
|
lock = _topo$store$getModelS.lock;
|
562
562
|
|
563
563
|
return lock ? item : _extends({}, item, {
|
@@ -567,9 +567,9 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
567
567
|
.map(function (item) {
|
568
568
|
var tags = item.tags;
|
569
569
|
|
570
|
-
if (item.type ===
|
570
|
+
if (item.type === 'edge') {
|
571
571
|
var allNoValue = tags.data.filter(function (tItem) {
|
572
|
-
return tItem.value ===
|
572
|
+
return tItem.value === '- ';
|
573
573
|
}).length === tags.data.length;
|
574
574
|
|
575
575
|
if (allNoValue) {
|
@@ -587,9 +587,9 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
587
587
|
if (htTopo) {
|
588
588
|
var _topo$historyManager, _topo$historyManager2;
|
589
589
|
|
590
|
-
(_topo$historyManager = topo.historyManager) === null || _topo$historyManager === void 0 ? void 0 : _topo$historyManager.setDisabled(true,
|
590
|
+
(_topo$historyManager = topo.historyManager) === null || _topo$historyManager === void 0 ? void 0 : _topo$historyManager.setDisabled(true, '加载标注');
|
591
591
|
htTopo.loadTagAndTip(JSON.parse(JSON.stringify(elementTagsAndTips)));
|
592
|
-
(_topo$historyManager2 = topo.historyManager) === null || _topo$historyManager2 === void 0 ? void 0 : _topo$historyManager2.setDisabled(false,
|
592
|
+
(_topo$historyManager2 = topo.historyManager) === null || _topo$historyManager2 === void 0 ? void 0 : _topo$historyManager2.setDisabled(false, '加载标注');
|
593
593
|
}
|
594
594
|
}
|
595
595
|
/**
|
@@ -599,7 +599,52 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
599
599
|
;
|
600
600
|
|
601
601
|
_proto.getData = function getData() {
|
602
|
-
return this.topo.store.getModelState(
|
602
|
+
return this.topo.store.getModelState('topoBizMod').attrsAndMetrics;
|
603
|
+
};
|
604
|
+
|
605
|
+
_proto.buildElementTagsTips = function buildElementTagsTips(id) {
|
606
|
+
var ciConfigs = this.getResourceTagTipConfig();
|
607
|
+
var ciConfig = ciConfigs.find(function (item) {
|
608
|
+
return item.id === id;
|
609
|
+
});
|
610
|
+
var ciDataItem = this.getData().find(function (item) {
|
611
|
+
return item.id === id;
|
612
|
+
}); // console.log("buildTagsTips-ciDataItem", ciDataItem);
|
613
|
+
|
614
|
+
if (!ciDataItem) {
|
615
|
+
return {
|
616
|
+
id: ciConfig.id,
|
617
|
+
tags: [],
|
618
|
+
tips: []
|
619
|
+
};
|
620
|
+
} // 获取ci数据
|
621
|
+
|
622
|
+
|
623
|
+
var ciData = _extends({}, ciDataItem, {
|
624
|
+
ciType: ciConfig.ciType
|
625
|
+
}); // console.log("AttributeFormatter-----", ciData, ciConfig);
|
626
|
+
|
627
|
+
|
628
|
+
var tags = this.formatter.formatAttrs(ciConfig.tags, ciData) // 展示的所有标注不带对应的名字(包括属性和指标)
|
629
|
+
.map(function (item) {
|
630
|
+
return _extends({}, item, {
|
631
|
+
name: ''
|
632
|
+
});
|
633
|
+
}); // 链路标注箭头
|
634
|
+
|
635
|
+
if (ciConfig.type === 'edge') {
|
636
|
+
tags = {
|
637
|
+
data: tags,
|
638
|
+
linkArrow: ciConfig.tagLinkArrow
|
639
|
+
};
|
640
|
+
}
|
641
|
+
|
642
|
+
return {
|
643
|
+
type: ciConfig.type,
|
644
|
+
id: ciConfig.id,
|
645
|
+
tags: tags,
|
646
|
+
tips: this.formatter.formatAttrs(ciConfig.tips, ciData)
|
647
|
+
};
|
603
648
|
}
|
604
649
|
/**
|
605
650
|
* 构造标注、悬浮框数据
|
@@ -608,51 +653,18 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
|
|
608
653
|
;
|
609
654
|
|
610
655
|
_proto.buildTagsTips = function buildTagsTips() {
|
611
|
-
var
|
656
|
+
var _this6 = this,
|
657
|
+
_this$extElementTagTi;
|
612
658
|
|
659
|
+
// 获取标注、悬浮框配置
|
613
660
|
var ciConfigs = this.getResourceTagTipConfig(); // console.log("buildTagsTips---ciConfigs", ciConfigs);
|
614
661
|
|
615
|
-
var formatter = new AttributeFormatter(this.topo);
|
616
662
|
var ciTagsAndTips = ciConfigs.map(function (ciConfig) {
|
617
|
-
|
618
|
-
|
619
|
-
if (!ciDataItem) {
|
620
|
-
return {
|
621
|
-
id: ciConfig.id,
|
622
|
-
tags: [],
|
623
|
-
tips: []
|
624
|
-
};
|
625
|
-
} // 获取ci数据
|
626
|
-
|
627
|
-
|
628
|
-
var ciData = _extends({}, ciDataItem, {
|
629
|
-
ciType: ciConfig.ciType
|
630
|
-
}); // console.log("AttributeFormatter-----", ciData, ciConfig);
|
631
|
-
|
632
|
-
|
633
|
-
var tags = formatter.formatAttrs(ciConfig.tags, ciData) // 展示的所有标注不带对应的名字(包括属性和指标)
|
634
|
-
.map(function (item) {
|
635
|
-
return _extends({}, item, {
|
636
|
-
name: ''
|
637
|
-
});
|
638
|
-
}); // 链路标注箭头
|
639
|
-
|
640
|
-
if (ciConfig.type === "edge") {
|
641
|
-
tags = {
|
642
|
-
data: tags,
|
643
|
-
linkArrow: ciConfig.tagLinkArrow
|
644
|
-
};
|
645
|
-
}
|
646
|
-
|
647
|
-
return {
|
648
|
-
type: ciConfig.type,
|
649
|
-
id: ciConfig.id,
|
650
|
-
tags: tags,
|
651
|
-
tips: formatter.formatAttrs(ciConfig.tips, ciData)
|
652
|
-
};
|
663
|
+
return _this6.buildElementTagsTips(ciConfig.id);
|
653
664
|
}); // console.log("ciTagsAndTips", ciTagsAndTips);
|
654
665
|
|
655
|
-
var
|
666
|
+
var extTagsAndTips = ((_this$extElementTagTi = this.extElementTagTipBuilder) === null || _this$extElementTagTi === void 0 ? void 0 : _this$extElementTagTi.getExtElementTagsAndTips()) || [];
|
667
|
+
var elementTagsAndTips = [].concat(ciTagsAndTips, extTagsAndTips); // 刷新标注、浮层
|
656
668
|
// rlog.debug('AttributeMetricDisplay.buildTagsTips', {tagsAndTips: elementTagsAndTips, ciConfigs});
|
657
669
|
|
658
670
|
return elementTagsAndTips;
|
@@ -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 "10.0.
|
27
|
+
var version = typeof "10.0.23" === 'string' ? "10.0.23" : null;
|
28
28
|
console.info("\u62D3\u6251\u7248\u672C: " + version);
|
29
29
|
/**
|
30
30
|
* 拓扑显示和编辑
|
@@ -48,16 +48,9 @@ export function mergeLinksData(links, linkCis, nodes, interfaceCiMap, interfaceD
|
|
48
48
|
});
|
49
49
|
var targetNode = nodes.find(function (node) {
|
50
50
|
return node.id === attributes["network_link.destination_device_id"];
|
51
|
-
});
|
52
|
-
var target = link.target; // 目的端为ip节点
|
53
|
-
|
54
|
-
if (attributes["destination_type"] === "ip") {
|
55
|
-
target = "ip:" + attributes["network_link.destination_ipv4"];
|
56
|
-
} // 翻译
|
57
|
-
|
51
|
+
}); // 翻译
|
58
52
|
|
59
53
|
return _extends({}, link, {
|
60
|
-
target: target,
|
61
54
|
attributes: _extends({}, attributes, {
|
62
55
|
// 源/目的设备
|
63
56
|
"network_link.source_device_id_object": {
|
package/es/core/viewer/components/plugins/ElementDetailDrawer/hooks/useElementDetailManager.js
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
import React, {
|
1
|
+
import React, { useMemo } from 'react';
|
2
2
|
import DefaultDetailContent from "../../ResourceDetail/DefaultDetailContent";
|
3
3
|
|
4
4
|
function useElementDetailManager(props) {
|
@@ -160,6 +160,7 @@ function useElementDetailManager(props) {
|
|
160
160
|
|
161
161
|
if (getCustomDetailContent) {
|
162
162
|
widget = getCustomDetailContent({
|
163
|
+
topo: topo,
|
163
164
|
id: id,
|
164
165
|
resourceData: resourceData,
|
165
166
|
htElement: htElement
|
@@ -178,18 +179,30 @@ function useElementDetailManager(props) {
|
|
178
179
|
}
|
179
180
|
|
180
181
|
function getDetailContentById(id) {
|
181
|
-
var htElement =
|
182
|
+
var htElement = getHtElement(id);
|
182
183
|
return getDetailContent({
|
183
184
|
id: id,
|
184
185
|
htElement: htElement
|
185
186
|
});
|
186
187
|
}
|
187
188
|
|
188
|
-
|
189
|
+
function getHtElement(id) {
|
190
|
+
var htElement = topo.getDataModel().getDataByTag(id) || topo.getDataModel().getDataById(id.replace('ht:', ''));
|
191
|
+
return htElement;
|
192
|
+
}
|
193
|
+
|
194
|
+
var htElement = useMemo(function () {
|
195
|
+
return visible ? getHtElement(id) : null;
|
196
|
+
}, [visible, id]);
|
197
|
+
var Content = visible && id ? getDetailContent({
|
198
|
+
id: id,
|
199
|
+
htElement: htElement
|
200
|
+
}) : null;
|
189
201
|
var elementDetailManager = {
|
190
202
|
visible: visible,
|
191
203
|
id: id,
|
192
204
|
resourceData: resourceData,
|
205
|
+
htElement: htElement,
|
193
206
|
Content: Content,
|
194
207
|
init: init,
|
195
208
|
destroy: destroy,
|
@@ -20,6 +20,7 @@ function ResourceDetailDrawer(props) {
|
|
20
20
|
});
|
21
21
|
var visible = detailManager.visible,
|
22
22
|
id = detailManager.id,
|
23
|
+
htElement = detailManager.htElement,
|
23
24
|
resourceData = detailManager.resourceData,
|
24
25
|
Content = detailManager.Content;
|
25
26
|
useEffect(function () {
|
@@ -43,11 +44,10 @@ function ResourceDetailDrawer(props) {
|
|
43
44
|
onClose: detailManager.close
|
44
45
|
}, visible && /*#__PURE__*/React.createElement(Content, _extends({}, props, {
|
45
46
|
topo: topo,
|
46
|
-
visible: visible,
|
47
47
|
id: id,
|
48
|
+
htElement: htElement,
|
48
49
|
viewerProps: viewerProps,
|
49
|
-
onClose: detailManager.close
|
50
|
-
onChangeActive: detailManager.open
|
50
|
+
onClose: detailManager.close
|
51
51
|
})));
|
52
52
|
}
|
53
53
|
|
@@ -11,7 +11,7 @@ function ResourceDetailPlugin(props) {
|
|
11
11
|
var _topo$store$useModelS = topo.store.useModelState('topoMod'),
|
12
12
|
graphLoaded = _topo$store$useModelS.graphLoaded;
|
13
13
|
|
14
|
-
if (graphLoaded || hideResourceDetailDrawer) {
|
14
|
+
if (!graphLoaded || hideResourceDetailDrawer) {
|
15
15
|
return null;
|
16
16
|
}
|
17
17
|
|
@@ -0,0 +1,49 @@
|
|
1
|
+
import { getEdgeGroups } from "../../utils/htElementUtils";
|
2
|
+
import { getEdgeGroupLinkIdConfig } from "../utils/edgeGroupTagUtil";
|
3
|
+
|
4
|
+
var EdgeGroupTagTipBuilder = /*#__PURE__*/function () {
|
5
|
+
function EdgeGroupTagTipBuilder(amDisplay) {
|
6
|
+
this.amDisplay = void 0;
|
7
|
+
this.topo = void 0;
|
8
|
+
this.amDisplay = amDisplay;
|
9
|
+
this.topo = amDisplay.topo;
|
10
|
+
}
|
11
|
+
|
12
|
+
var _proto = EdgeGroupTagTipBuilder.prototype;
|
13
|
+
|
14
|
+
_proto.getExtElementTagsAndTips = function getExtElementTagsAndTips() {
|
15
|
+
var _this = this;
|
16
|
+
|
17
|
+
var topo = this.topo;
|
18
|
+
var dm = this.topo.getDataModel();
|
19
|
+
var edgeGroupsTagsTips = getEdgeGroups(dm).map(function (edgeGroup) {
|
20
|
+
var edge = edgeGroup.getEdges().getArray()[0]; // 获取配置的链路
|
21
|
+
|
22
|
+
var linkId = getEdgeGroupLinkIdConfig(edge, topo);
|
23
|
+
var edgeGroupId = [edge.getSource().getId(), edge.getTarget().getId()];
|
24
|
+
var data = {
|
25
|
+
tags: [],
|
26
|
+
tips: []
|
27
|
+
};
|
28
|
+
|
29
|
+
if (linkId) {
|
30
|
+
data = _this.amDisplay.buildElementTagsTips(linkId);
|
31
|
+
}
|
32
|
+
|
33
|
+
return {
|
34
|
+
// edgeGroupId,
|
35
|
+
tags: data.tags,
|
36
|
+
tips: data.tips,
|
37
|
+
type: 'edgeGroup'
|
38
|
+
};
|
39
|
+
}).filter(function (item) {
|
40
|
+
return !!item;
|
41
|
+
});
|
42
|
+
return edgeGroupsTagsTips;
|
43
|
+
};
|
44
|
+
|
45
|
+
return EdgeGroupTagTipBuilder;
|
46
|
+
}();
|
47
|
+
|
48
|
+
export { EdgeGroupTagTipBuilder as default };
|
49
|
+
;
|
@@ -0,0 +1,22 @@
|
|
1
|
+
import IpNodeTagsTipsBuilder from "./IpNodeTagsTipsBuilder";
|
2
|
+
import EdgeGroupTagTipBuilder from "./EdgeGroupTagTipBuilder";
|
3
|
+
|
4
|
+
var ExtElementTagTipBuilder = /*#__PURE__*/function () {
|
5
|
+
function ExtElementTagTipBuilder(amDisplay) {
|
6
|
+
this.amDisplay = void 0;
|
7
|
+
this.topo = void 0;
|
8
|
+
this.amDisplay = amDisplay;
|
9
|
+
this.topo = amDisplay.topo;
|
10
|
+
}
|
11
|
+
|
12
|
+
var _proto = ExtElementTagTipBuilder.prototype;
|
13
|
+
|
14
|
+
_proto.getExtElementTagsAndTips = function getExtElementTagsAndTips() {
|
15
|
+
return [].concat(new IpNodeTagsTipsBuilder(this.amDisplay).getExtElementTagsAndTips(), new EdgeGroupTagTipBuilder(this.amDisplay).getExtElementTagsAndTips());
|
16
|
+
};
|
17
|
+
|
18
|
+
return ExtElementTagTipBuilder;
|
19
|
+
}();
|
20
|
+
|
21
|
+
export { ExtElementTagTipBuilder as default };
|
22
|
+
;
|
@@ -9,7 +9,7 @@ import createMenuCommands from "../../contextmenu/createMenuCommands";
|
|
9
9
|
import getTopoData from "../getTopoData";
|
10
10
|
import customStoreModels from "../store";
|
11
11
|
import { DEFAULT_LINK_TAG_COMMON_CONFIG, DEFAULT_TIP_COMMON_CONFIG } from "../../constants/ResourceInfoDisplay";
|
12
|
-
import
|
12
|
+
import ExtElementTagTipBuilder from "./ExtElementTagTipBuilder";
|
13
13
|
|
14
14
|
var TopoCenter = /*#__PURE__*/function (_TopoApp) {
|
15
15
|
_inheritsLoose(TopoCenter, _TopoApp);
|
@@ -30,7 +30,7 @@ var TopoCenter = /*#__PURE__*/function (_TopoApp) {
|
|
30
30
|
getDefaultLinkTipConfig: function getDefaultLinkTipConfig() {
|
31
31
|
return DEFAULT_TIP_COMMON_CONFIG;
|
32
32
|
},
|
33
|
-
|
33
|
+
extElementTagTipBuilder: ExtElementTagTipBuilder
|
34
34
|
}
|
35
35
|
})) || this;
|
36
36
|
_this.resourceConfig = null;
|
@@ -0,0 +1,10 @@
|
|
1
|
+
// 获得连线组标注配置的链路id。无配置时取默认链路
|
2
|
+
export function getEdgeGroupLinkIdConfig(edgeGroup, topo) {
|
3
|
+
var _links$;
|
4
|
+
|
5
|
+
// const { } = options
|
6
|
+
var sourceId = edgeGroup.getSource().getTag();
|
7
|
+
var targetId = edgeGroup.getTarget().getTag();
|
8
|
+
var links = topo.dataModel.getEdgesBetweenTwoNodes(sourceId, targetId);
|
9
|
+
return (_links$ = links[0]) === null || _links$ === void 0 ? void 0 : _links$.id;
|
10
|
+
}
|
@@ -202,6 +202,9 @@ export function getEdgeGroups(dataModel) {
|
|
202
202
|
});
|
203
203
|
return edgeGroups;
|
204
204
|
}
|
205
|
+
export function getEdgeGroupAgents(dataModel) {
|
206
|
+
return getEdges(dataModel).filter(isEdgeGroupAgent);
|
207
|
+
}
|
205
208
|
export function getEdgeDatas(dataModel) {
|
206
209
|
return getEdges(dataModel).map(function (element) {
|
207
210
|
var _element$getSource, _element$getTarget;
|
@@ -60,6 +60,13 @@ function HtCustomImagePanel(props) {
|
|
60
60
|
}
|
61
61
|
};
|
62
62
|
}, []);
|
63
|
+
(0, _react.useEffect)(function () {
|
64
|
+
var view = viewRef.current;
|
65
|
+
|
66
|
+
if (view && view.setIcons) {
|
67
|
+
view.setIcons(icons);
|
68
|
+
}
|
69
|
+
}, [icons]);
|
63
70
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
64
71
|
ref: divRef,
|
65
72
|
className: _HtImagePaletteModule["default"].container
|
@@ -87,6 +87,7 @@ function ImagePanel(props) {
|
|
87
87
|
var renderImageContent = function renderImageContent() {
|
88
88
|
var panels = [{
|
89
89
|
key: '资源图片',
|
90
|
+
hidden: searchValue && !resourceIcons.length,
|
90
91
|
render: function render() {
|
91
92
|
return /*#__PURE__*/_react["default"].createElement(CollapsePanel, {
|
92
93
|
key: "\u8D44\u6E90\u56FE\u7247",
|
@@ -98,6 +99,7 @@ function ImagePanel(props) {
|
|
98
99
|
}
|
99
100
|
}, {
|
100
101
|
key: '基础图片',
|
102
|
+
hidden: searchValue && !basicIcons.length,
|
101
103
|
render: function render() {
|
102
104
|
return /*#__PURE__*/_react["default"].createElement(CollapsePanel, {
|
103
105
|
key: "\u57FA\u7840\u56FE\u7247",
|