@riil-frontend/component-topology 11.0.7 → 11.0.10
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/1.js +2 -2
- package/build/2.js +1 -1
- package/build/index.css +1 -1
- package/build/index.js +21 -21
- package/es/components/ModelAttrSelectDrawer/index.js +2 -2
- package/es/core/components/DisplaySettingDrawer/NodeTag.js +3 -6
- package/es/core/components/DisplaySettingDrawer/NodeTip.js +4 -7
- package/es/core/components/ResourceViewAttributeSetting/nodeCiTypeAttrUtil.js +10 -87
- package/es/core/editor/components/BottomFloatTool/HelpIcon.js +3 -96
- package/es/core/hooks/useCanvasThemeConfig.js +4 -16
- package/es/core/hooks/useTopoEdit.js +8 -12
- package/es/core/models/TopoApp.js +1 -1
- package/es/core/models/tagstips/ElementTagTipConfig.js +37 -43
- package/lib/components/ModelAttrSelectDrawer/index.js +2 -2
- package/lib/core/components/DisplaySettingDrawer/NodeTag.js +3 -7
- package/lib/core/components/DisplaySettingDrawer/NodeTip.js +4 -8
- package/lib/core/components/ResourceViewAttributeSetting/nodeCiTypeAttrUtil.js +10 -88
- package/lib/core/editor/components/BottomFloatTool/HelpIcon.js +3 -104
- package/lib/core/hooks/useCanvasThemeConfig.js +4 -16
- package/lib/core/hooks/useTopoEdit.js +8 -12
- package/lib/core/models/TopoApp.js +1 -1
- package/lib/core/models/tagstips/ElementTagTipConfig.js +37 -43
- package/package.json +2 -2
- package/es/components/ModelAttrSelectDrawer/components/MultipleTypeAttributeSelectDrawer.js +0 -82
- package/es/core/components/DisplaySettingDrawer/components/NodeAttrSettingDrawer.js +0 -40
- package/es/core/editor/components/BottomFloatTool/HelpIcon.module.scss +0 -68
- package/lib/components/ModelAttrSelectDrawer/components/MultipleTypeAttributeSelectDrawer.js +0 -97
- package/lib/core/components/DisplaySettingDrawer/components/NodeAttrSettingDrawer.js +0 -60
- package/lib/core/editor/components/BottomFloatTool/HelpIcon.module.scss +0 -68
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
export default
|
|
1
|
+
import ModelAttrSelectDrawer from "./components/ModelAttrSelectDrawer";
|
|
2
|
+
export default ModelAttrSelectDrawer;
|
|
@@ -3,7 +3,6 @@ import React from 'react';
|
|
|
3
3
|
import PropTypes from 'prop-types';
|
|
4
4
|
import { DEFAULT_NODE_TAG_COMMON_CONFIG } from "../../../constants/ResourceInfoDisplay";
|
|
5
5
|
import BasicConfig from "./ResourceDisplay/BasicConfig";
|
|
6
|
-
import NodeAttrSettingDrawer from "./components/NodeAttrSettingDrawer";
|
|
7
6
|
var defaultCommonOptions = [{
|
|
8
7
|
value: 'graph:name',
|
|
9
8
|
label: '图片名称'
|
|
@@ -20,17 +19,15 @@ var defaultCommonOptions = [{
|
|
|
20
19
|
var NodeTag = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
21
20
|
var commonOptions = props.commonOptions;
|
|
22
21
|
return /*#__PURE__*/React.createElement(BasicConfig, _extends({
|
|
23
|
-
ref: ref
|
|
22
|
+
ref: ref
|
|
23
|
+
}, props, {
|
|
24
24
|
limit: 3,
|
|
25
25
|
elementType: "node",
|
|
26
26
|
showType: "tag",
|
|
27
27
|
commonOptions: commonOptions || defaultCommonOptions,
|
|
28
28
|
defaultCommonConfig: DEFAULT_NODE_TAG_COMMON_CONFIG,
|
|
29
|
-
customSettingDrawer: function customSettingDrawer(params) {
|
|
30
|
-
return /*#__PURE__*/React.createElement(NodeAttrSettingDrawer, params);
|
|
31
|
-
},
|
|
32
29
|
type: "node"
|
|
33
|
-
}
|
|
30
|
+
}));
|
|
34
31
|
});
|
|
35
32
|
NodeTag.displayName = 'NodeTag';
|
|
36
33
|
NodeTag.propTypes = {
|
|
@@ -3,7 +3,6 @@ import React from 'react';
|
|
|
3
3
|
import PropTypes from 'prop-types';
|
|
4
4
|
import { DEFAULT_TIP_COMMON_CONFIG } from "../../../constants/ResourceInfoDisplay";
|
|
5
5
|
import BasicConfig from "./ResourceDisplay/BasicConfig";
|
|
6
|
-
import NodeAttrSettingDrawer from "./components/NodeAttrSettingDrawer";
|
|
7
6
|
var defaultCommonOptions = [{
|
|
8
7
|
value: 'attribute:display_name',
|
|
9
8
|
label: '显示名称'
|
|
@@ -20,16 +19,14 @@ var defaultCommonOptions = [{
|
|
|
20
19
|
var NodeTip = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
21
20
|
var commonOptions = props.commonOptions;
|
|
22
21
|
return /*#__PURE__*/React.createElement(BasicConfig, _extends({
|
|
23
|
-
ref: ref
|
|
22
|
+
ref: ref
|
|
23
|
+
}, props, {
|
|
24
24
|
limit: 4,
|
|
25
25
|
elementType: "node",
|
|
26
26
|
showType: "tip",
|
|
27
27
|
commonOptions: commonOptions || defaultCommonOptions,
|
|
28
|
-
defaultCommonConfig: DEFAULT_TIP_COMMON_CONFIG
|
|
29
|
-
|
|
30
|
-
return /*#__PURE__*/React.createElement(NodeAttrSettingDrawer, params);
|
|
31
|
-
}
|
|
32
|
-
}, props));
|
|
28
|
+
defaultCommonConfig: DEFAULT_TIP_COMMON_CONFIG
|
|
29
|
+
}));
|
|
33
30
|
});
|
|
34
31
|
NodeTip.propTypes = {
|
|
35
32
|
commonOptions: PropTypes.array
|
|
@@ -1,88 +1,4 @@
|
|
|
1
|
-
import { getCiTypesFromCiElements } from "../../../utils/topoData";
|
|
2
|
-
/**
|
|
3
|
-
* 获取节点标注、悬浮框配置
|
|
4
|
-
* @param {*} topo
|
|
5
|
-
* @returns
|
|
6
|
-
*/
|
|
7
|
-
|
|
8
|
-
export function getNodeModels(topo) {
|
|
9
|
-
var data = topo.store.getModelState('topoMod').data;
|
|
10
|
-
var ciTypeMap = topo.ciTyeCache.ciTypes;
|
|
11
|
-
return getNodeModSet();
|
|
12
|
-
|
|
13
|
-
function getNodeModSet() {
|
|
14
|
-
var ciTypes = getCiTypesFromCiElements(data.nodes);
|
|
15
|
-
return getMods(ciTypes);
|
|
16
|
-
}
|
|
17
|
-
/**
|
|
18
|
-
*
|
|
19
|
-
* @param {array} ciTypeCodes
|
|
20
|
-
* @returns
|
|
21
|
-
*/
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
function getMods(ciTypeCodes) {
|
|
25
|
-
return Object.keys(ciTypeMap).filter(function (item) {
|
|
26
|
-
return ciTypeCodes.includes(item);
|
|
27
|
-
}).map(function (key) {
|
|
28
|
-
var ciTypeObj = ciTypeMap[key];
|
|
29
|
-
return {
|
|
30
|
-
id: ciTypeObj.code,
|
|
31
|
-
label: ciTypeObj.displayName,
|
|
32
|
-
icon: ciTypeObj.icon,
|
|
33
|
-
list: ciModfilter(ciTypeObj, 'node')
|
|
34
|
-
};
|
|
35
|
-
});
|
|
36
|
-
}
|
|
37
|
-
/**
|
|
38
|
-
* 过滤ci元数据中的属性和指标,用于属性和指标显示设置
|
|
39
|
-
* @param {} ciTypeObj
|
|
40
|
-
* @returns
|
|
41
|
-
*/
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
function ciModfilter(ciTypeObj, type) {
|
|
45
|
-
var custom = [];
|
|
46
|
-
|
|
47
|
-
if (type === 'node') {
|
|
48
|
-
custom.push.apply(custom, [{
|
|
49
|
-
id: 'graph:name',
|
|
50
|
-
code: 'name',
|
|
51
|
-
name: '图片名称',
|
|
52
|
-
type: 'custom'
|
|
53
|
-
}, {
|
|
54
|
-
id: 'ciType:display_name',
|
|
55
|
-
code: 'ciType',
|
|
56
|
-
name: '资源类型',
|
|
57
|
-
type: 'custom'
|
|
58
|
-
}]);
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
var attributes = ciTypeObj.attributes.filter(function (attr) {
|
|
62
|
-
return !!attr.userVisible;
|
|
63
|
-
}).map(function (item) {
|
|
64
|
-
return {
|
|
65
|
-
type: 'attribute',
|
|
66
|
-
id: "attribute:" + item.code,
|
|
67
|
-
code: "attribute:" + item.code,
|
|
68
|
-
name: item.name,
|
|
69
|
-
typeName: '属性'
|
|
70
|
-
};
|
|
71
|
-
});
|
|
72
|
-
var metrics = ciTypeObj.metrics.map(function (item) {
|
|
73
|
-
return {
|
|
74
|
-
type: 'metric',
|
|
75
|
-
id: "metric:" + item.code,
|
|
76
|
-
code: "metric:" + item.code,
|
|
77
|
-
name: item.name,
|
|
78
|
-
typeName: '指标'
|
|
79
|
-
};
|
|
80
|
-
});
|
|
81
|
-
return [].concat(custom, attributes, metrics);
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
;
|
|
85
|
-
} // 资源类型含有属性和指标集合
|
|
1
|
+
import { getCiTypesFromCiElements } from "../../../utils/topoData"; // 资源类型含有属性和指标集合
|
|
86
2
|
|
|
87
3
|
export function getNodeCiModSet(params) {
|
|
88
4
|
var topo = params.topo;
|
|
@@ -113,7 +29,8 @@ export function getNodeCiModSet(params) {
|
|
|
113
29
|
icon: ciTypeObj.icon,
|
|
114
30
|
list: ciModfilter(ciTypeObj, globalConfig, 'node', ciTypeObj.code)
|
|
115
31
|
};
|
|
116
|
-
});
|
|
32
|
+
}); // console.log("modSet--------------------", modSet);
|
|
33
|
+
|
|
117
34
|
return modSet;
|
|
118
35
|
}
|
|
119
36
|
/**
|
|
@@ -143,7 +60,13 @@ export function getNodeCiModSet(params) {
|
|
|
143
60
|
(_tags$data$code = tags.data[code]) === null || _tags$data$code === void 0 ? void 0 : _tags$data$code.map(function (item) {
|
|
144
61
|
tagArr.push(item.code + "-" + item.type);
|
|
145
62
|
});
|
|
146
|
-
}
|
|
63
|
+
} // rlog.debug(
|
|
64
|
+
// "过滤ci元数据中的属性和指标,用于属性和指标显示设置",
|
|
65
|
+
// globalSetting,
|
|
66
|
+
// tipArr,
|
|
67
|
+
// tagArr
|
|
68
|
+
// );
|
|
69
|
+
|
|
147
70
|
|
|
148
71
|
var custom = [];
|
|
149
72
|
|
|
@@ -1,101 +1,8 @@
|
|
|
1
|
-
import
|
|
2
|
-
import _Grid from "@alifd/next/es/grid";
|
|
3
|
-
import React, { useState, useEffect } from 'react';
|
|
4
|
-
import styles from "./HelpIcon.module.scss";
|
|
5
|
-
import useCanvasThemeConfig from "../../../hooks/useCanvasThemeConfig";
|
|
1
|
+
import React from 'react';
|
|
6
2
|
|
|
7
3
|
function HelpIcon(props) {
|
|
8
|
-
var topo = props.topo
|
|
9
|
-
|
|
10
|
-
var localStorageVal = localStorage.getItem(topoType + 'helpBoxHidden');
|
|
11
|
-
|
|
12
|
-
var _useState = useState(),
|
|
13
|
-
helpBoxIsShow = _useState[0],
|
|
14
|
-
setHelpBoxIsShow = _useState[1]; //TODO:在主得style里面需要增加color与background属性,根据外部传值进行改变,默认值为$color-text1-4,#fff
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
var Row = _Grid.Row,
|
|
18
|
-
Col = _Grid.Col;
|
|
19
|
-
|
|
20
|
-
var _useCanvasThemeConfig = useCanvasThemeConfig({
|
|
21
|
-
topo: topo
|
|
22
|
-
}),
|
|
23
|
-
themeConfig = _useCanvasThemeConfig.themeConfig;
|
|
24
|
-
|
|
25
|
-
var helpIconNames = themeConfig.editor.helpIcon;
|
|
26
|
-
|
|
27
|
-
var onChange = function onChange(visible, type) {
|
|
28
|
-
if (type != 'docClick') {
|
|
29
|
-
setHelpBoxIsShow(visible);
|
|
30
|
-
localStorage.setItem(topoType + 'helpBoxHidden', !visible);
|
|
31
|
-
}
|
|
32
|
-
};
|
|
33
|
-
|
|
34
|
-
var topoModState = topo.store.useModelState('topoMod');
|
|
35
|
-
var graphLoaded = topoModState.graphLoaded;
|
|
36
|
-
useEffect(function () {
|
|
37
|
-
if (graphLoaded) {
|
|
38
|
-
setHelpBoxIsShow(localStorageVal == 'true' ? false : true);
|
|
39
|
-
}
|
|
40
|
-
}, [topo, graphLoaded]);
|
|
41
|
-
return /*#__PURE__*/React.createElement(_Balloon, {
|
|
42
|
-
triggerType: "click",
|
|
43
|
-
align: "t",
|
|
44
|
-
trigger: /*#__PURE__*/React.createElement("div", {
|
|
45
|
-
className: styles.topoHelpIconBtn,
|
|
46
|
-
onClick: function onClick() {
|
|
47
|
-
open;
|
|
48
|
-
}
|
|
49
|
-
}, /*#__PURE__*/React.createElement("img", {
|
|
50
|
-
src: "/img/topo/editor/bottomFloatTool/default.svg",
|
|
51
|
-
alt: "",
|
|
52
|
-
style: {
|
|
53
|
-
width: '15px',
|
|
54
|
-
height: '15px'
|
|
55
|
-
}
|
|
56
|
-
})),
|
|
57
|
-
closable: true,
|
|
58
|
-
visible: helpBoxIsShow,
|
|
59
|
-
onVisibleChange: onChange,
|
|
60
|
-
shouldUpdatePosition: true,
|
|
61
|
-
id: helpIconNames
|
|
62
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
63
|
-
className: styles.topoHelpIcon
|
|
64
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
65
|
-
className: styles[helpIconNames + 'Box']
|
|
66
|
-
}, /*#__PURE__*/React.createElement("span", {
|
|
67
|
-
className: styles.title
|
|
68
|
-
}, "\u5FEB\u6377\u952E"), /*#__PURE__*/React.createElement("div", {
|
|
69
|
-
className: styles.conten
|
|
70
|
-
}, /*#__PURE__*/React.createElement(Row, null, /*#__PURE__*/React.createElement(Col, {
|
|
71
|
-
span: "16"
|
|
72
|
-
}, "\u590D\u5236"), /*#__PURE__*/React.createElement(Col, {
|
|
73
|
-
span: "8"
|
|
74
|
-
}, "ctrl/\u2318+c")), /*#__PURE__*/React.createElement(Row, null, /*#__PURE__*/React.createElement(Col, {
|
|
75
|
-
span: "16"
|
|
76
|
-
}, "\u7C98\u8D34"), /*#__PURE__*/React.createElement(Col, {
|
|
77
|
-
span: "8"
|
|
78
|
-
}, "ctrl/\u2318+v")), /*#__PURE__*/React.createElement(Row, null, /*#__PURE__*/React.createElement(Col, {
|
|
79
|
-
span: "16"
|
|
80
|
-
}, "\u64A4\u9500"), /*#__PURE__*/React.createElement(Col, {
|
|
81
|
-
span: "8"
|
|
82
|
-
}, "ctrl/\u2318+z")), /*#__PURE__*/React.createElement(Row, null, /*#__PURE__*/React.createElement(Col, {
|
|
83
|
-
span: "16"
|
|
84
|
-
}, "\u6062\u590D"), /*#__PURE__*/React.createElement(Col, {
|
|
85
|
-
span: "8"
|
|
86
|
-
}, "ctrl/\u2318+y")), /*#__PURE__*/React.createElement(Row, null, /*#__PURE__*/React.createElement(Col, {
|
|
87
|
-
span: "16"
|
|
88
|
-
}, "\u6587\u5B57\u52A0\u7C97"), /*#__PURE__*/React.createElement(Col, {
|
|
89
|
-
span: "8"
|
|
90
|
-
}, "ctrl/\u2318+b")), /*#__PURE__*/React.createElement(Row, null, /*#__PURE__*/React.createElement(Col, {
|
|
91
|
-
span: "16"
|
|
92
|
-
}, "\u9009\u62E9-\u62D6\u5230"), /*#__PURE__*/React.createElement(Col, {
|
|
93
|
-
span: "8"
|
|
94
|
-
}, "\u7A7A\u683C")), /*#__PURE__*/React.createElement(Row, null, /*#__PURE__*/React.createElement(Col, {
|
|
95
|
-
span: "16"
|
|
96
|
-
}, "\u9000\u51FA\u94FE\u8DEF/\u7EBF\u7ED8\u5236"), /*#__PURE__*/React.createElement(Col, {
|
|
97
|
-
span: "8"
|
|
98
|
-
}, "\u9F20\u6807\u53F3\u952E"))))));
|
|
4
|
+
var topo = props.topo;
|
|
5
|
+
return /*#__PURE__*/React.createElement("div", null, "HelpIcon");
|
|
99
6
|
}
|
|
100
7
|
|
|
101
8
|
export default HelpIcon;
|
|
@@ -6,16 +6,12 @@ var themeMap = [{
|
|
|
6
6
|
color: '#FFFFFF',
|
|
7
7
|
editor: {
|
|
8
8
|
// 快捷帮助
|
|
9
|
-
helpIcon:
|
|
9
|
+
helpIcon: {}
|
|
10
10
|
}
|
|
11
11
|
}, {
|
|
12
12
|
name: 'lightblue',
|
|
13
13
|
label: '蓝色',
|
|
14
|
-
color: '#F9FBFF'
|
|
15
|
-
editor: {
|
|
16
|
-
// 快捷帮助
|
|
17
|
-
helpIcon: 'white'
|
|
18
|
-
}
|
|
14
|
+
color: '#F9FBFF'
|
|
19
15
|
}, // {
|
|
20
16
|
// name: 'yellow',
|
|
21
17
|
// label: '黄色',
|
|
@@ -29,19 +25,11 @@ var themeMap = [{
|
|
|
29
25
|
{
|
|
30
26
|
name: 'dark',
|
|
31
27
|
label: '深色',
|
|
32
|
-
color: '#031425'
|
|
33
|
-
editor: {
|
|
34
|
-
// 快捷帮助
|
|
35
|
-
helpIcon: 'dark'
|
|
36
|
-
}
|
|
28
|
+
color: '#031425'
|
|
37
29
|
}, {
|
|
38
30
|
name: 'poly',
|
|
39
31
|
label: 'Poly',
|
|
40
|
-
backgroundImage: '/img/topo/themes/poly.png'
|
|
41
|
-
editor: {
|
|
42
|
-
// 快捷帮助
|
|
43
|
-
helpIcon: 'dark'
|
|
44
|
-
}
|
|
32
|
+
backgroundImage: '/img/topo/themes/poly.png'
|
|
45
33
|
}].reduce(function (map, item) {
|
|
46
34
|
var _extends2;
|
|
47
35
|
|
|
@@ -234,8 +234,7 @@ var useTopoEdit = function useTopoEdit(params) {
|
|
|
234
234
|
content: "是否仅删除区域或将区域包含的内容一同删除?",
|
|
235
235
|
//footer:()=>{return <><Button type="primary" onClick={doDeleteOnlyGroup}>仅删除区域</Button><Button type="primary" onClick={doDeleteOnlyGroup}>确定</Button></>},
|
|
236
236
|
okProps: {
|
|
237
|
-
children: "仅删除区域"
|
|
238
|
-
type: "normal"
|
|
237
|
+
children: "仅删除区域"
|
|
239
238
|
},
|
|
240
239
|
cancelProps: {
|
|
241
240
|
children: "全部删除"
|
|
@@ -290,30 +289,27 @@ var useTopoEdit = function useTopoEdit(params) {
|
|
|
290
289
|
});
|
|
291
290
|
|
|
292
291
|
function doDeleteOnlyGroup() {
|
|
293
|
-
|
|
294
|
-
|
|
292
|
+
// console.log("仅删除区域", topo.view.topoClient, data);
|
|
295
293
|
var children = getGroupChildren(group);
|
|
296
294
|
children.map(function (child) {
|
|
297
|
-
child.setParent(null);
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
// viewRect.y + nodeRect.height + 4
|
|
302
|
-
// ); // 解决集群从区域内移出时,连线位置未更新的问题
|
|
295
|
+
child.setParent(null);
|
|
296
|
+
var viewRect = topo.getGraphView().getViewRect();
|
|
297
|
+
var nodeRect = child.getRect();
|
|
298
|
+
child.setPosition(viewRect.x + nodeRect.width + 2, viewRect.y + nodeRect.height + 4); // 解决集群从区域内移出时,连线位置未更新的问题
|
|
303
299
|
|
|
304
300
|
setTimeout(function () {
|
|
305
301
|
child.iv();
|
|
306
302
|
topo.historyManager.endTransaction();
|
|
307
303
|
}, 50);
|
|
308
304
|
});
|
|
309
|
-
topo.view.topoClient.deleteGroup(data);
|
|
310
|
-
topo.historyManager.endTransaction(); // console.log("仅删除区域", children, group);
|
|
305
|
+
topo.view.topoClient.deleteGroup(data); // console.log("仅删除区域", children, group);
|
|
311
306
|
}
|
|
312
307
|
|
|
313
308
|
function doDelete() {
|
|
314
309
|
topo.historyManager.beginTransaction(); // FIXME 。如果命中其他的动态条件,则立即显示
|
|
315
310
|
|
|
316
311
|
topo.view.topoClient.deleteGroup(data);
|
|
312
|
+
topo.historyManager.endTransaction();
|
|
317
313
|
}
|
|
318
314
|
};
|
|
319
315
|
|
|
@@ -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.10" === 'string' ? "11.0.10" : null;
|
|
28
28
|
console.info("\u62D3\u6251\u7248\u672C: " + version);
|
|
29
29
|
/**
|
|
30
30
|
* 拓扑显示和编辑
|
|
@@ -70,7 +70,7 @@ var ElementTagTipConfig = /*#__PURE__*/function () {
|
|
|
70
70
|
|
|
71
71
|
_proto.getNodeFiedldMap = function getNodeFiedldMap() {
|
|
72
72
|
var mtCodes = getNodeMtCodes(this.topoData);
|
|
73
|
-
return this.
|
|
73
|
+
return this.getFiedldMapByType(mtCodes, 'node');
|
|
74
74
|
}
|
|
75
75
|
/**
|
|
76
76
|
* 获得节点字段配置项map
|
|
@@ -79,13 +79,8 @@ var ElementTagTipConfig = /*#__PURE__*/function () {
|
|
|
79
79
|
|
|
80
80
|
_proto.getLinkFidldMap = function getLinkFidldMap() {
|
|
81
81
|
var mtCodes = getLinkMtCodes(this.topoData);
|
|
82
|
-
return this.
|
|
83
|
-
}
|
|
84
|
-
/**
|
|
85
|
-
* 获取链路标注悬浮框属性配置数据
|
|
86
|
-
* @returns
|
|
87
|
-
*/
|
|
88
|
-
;
|
|
82
|
+
return this.getFiedldMapByType(mtCodes, 'link');
|
|
83
|
+
};
|
|
89
84
|
|
|
90
85
|
_proto.getLinkConfigItems = function getLinkConfigItems() {
|
|
91
86
|
var mtCodes = getLinkMtCodes(this.topoData);
|
|
@@ -115,48 +110,47 @@ var ElementTagTipConfig = /*#__PURE__*/function () {
|
|
|
115
110
|
// ]
|
|
116
111
|
};
|
|
117
112
|
|
|
118
|
-
_proto.
|
|
113
|
+
_proto.getFiedldMapByType = function getFiedldMapByType(mtCodes, type) {
|
|
119
114
|
var _this = this;
|
|
120
115
|
|
|
121
116
|
var map = {};
|
|
122
117
|
mtCodes.forEach(function (mtCode) {
|
|
123
118
|
var ciType = _this.mtCiTypeMap[mtCode];
|
|
124
|
-
map[mtCode] = _this.getFiedldMapByType(ciType, type, mtCode);
|
|
125
|
-
});
|
|
126
|
-
return map;
|
|
127
|
-
};
|
|
128
119
|
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
120
|
+
var attributes = _this.topo.ciTyeCache.getCiType(ciType).attributes.filter(function (attr) {
|
|
121
|
+
return !!attr.userVisible;
|
|
122
|
+
});
|
|
123
|
+
|
|
124
|
+
var metrics = _this.getMtMetricModels(mtCode);
|
|
125
|
+
|
|
126
|
+
var extItems = type === 'node' ? [{
|
|
127
|
+
lavel: '图片名称',
|
|
128
|
+
value: 'graph:name',
|
|
129
|
+
typeName: null
|
|
130
|
+
}, {
|
|
131
|
+
lavel: '资源类型',
|
|
132
|
+
value: 'ciType:name',
|
|
133
|
+
typeName: null
|
|
134
|
+
}] : [];
|
|
135
|
+
map[mtCode] = [].concat(extItems, attributes.map(function (item) {
|
|
136
|
+
return {
|
|
137
|
+
type: 'attribute',
|
|
138
|
+
id: "attribute:" + item.code,
|
|
139
|
+
code: "attribute:" + item.code,
|
|
140
|
+
name: item.name,
|
|
141
|
+
typeName: '属性'
|
|
142
|
+
};
|
|
143
|
+
}), metrics.map(function (item) {
|
|
144
|
+
return {
|
|
145
|
+
type: 'metric',
|
|
146
|
+
id: "metric:" + item.code,
|
|
147
|
+
code: "metric:" + item.code,
|
|
148
|
+
name: item.name,
|
|
149
|
+
typeName: '指标'
|
|
150
|
+
};
|
|
151
|
+
}));
|
|
132
152
|
});
|
|
133
|
-
|
|
134
|
-
var extItems = type === 'node' ? [{
|
|
135
|
-
lavel: '图片名称',
|
|
136
|
-
value: 'graph:name',
|
|
137
|
-
typeName: null
|
|
138
|
-
}, {
|
|
139
|
-
lavel: '资源类型',
|
|
140
|
-
value: 'ciType:name',
|
|
141
|
-
typeName: null
|
|
142
|
-
}] : [];
|
|
143
|
-
return [].concat(extItems, attributes.map(function (item) {
|
|
144
|
-
return {
|
|
145
|
-
type: 'attribute',
|
|
146
|
-
id: "attribute:" + item.code,
|
|
147
|
-
code: "attribute:" + item.code,
|
|
148
|
-
name: item.name,
|
|
149
|
-
typeName: '属性'
|
|
150
|
-
};
|
|
151
|
-
}), metrics.map(function (item) {
|
|
152
|
-
return {
|
|
153
|
-
type: 'metric',
|
|
154
|
-
id: "metric:" + item.code,
|
|
155
|
-
code: "metric:" + item.code,
|
|
156
|
-
name: item.name,
|
|
157
|
-
typeName: '指标'
|
|
158
|
-
};
|
|
159
|
-
}));
|
|
153
|
+
return map;
|
|
160
154
|
};
|
|
161
155
|
|
|
162
156
|
_proto.getMtMetricModels = function getMtMetricModels(mtCode) {
|
|
@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
5
5
|
exports.__esModule = true;
|
|
6
6
|
exports["default"] = void 0;
|
|
7
7
|
|
|
8
|
-
var
|
|
8
|
+
var _ModelAttrSelectDrawer = _interopRequireDefault(require("./components/ModelAttrSelectDrawer"));
|
|
9
9
|
|
|
10
|
-
var _default =
|
|
10
|
+
var _default = _ModelAttrSelectDrawer["default"];
|
|
11
11
|
exports["default"] = _default;
|
|
@@ -15,8 +15,6 @@ var _ResourceInfoDisplay = require("../../../constants/ResourceInfoDisplay");
|
|
|
15
15
|
|
|
16
16
|
var _BasicConfig = _interopRequireDefault(require("./ResourceDisplay/BasicConfig"));
|
|
17
17
|
|
|
18
|
-
var _NodeAttrSettingDrawer = _interopRequireDefault(require("./components/NodeAttrSettingDrawer"));
|
|
19
|
-
|
|
20
18
|
var defaultCommonOptions = [{
|
|
21
19
|
value: 'graph:name',
|
|
22
20
|
label: '图片名称'
|
|
@@ -33,17 +31,15 @@ var defaultCommonOptions = [{
|
|
|
33
31
|
var NodeTag = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
|
|
34
32
|
var commonOptions = props.commonOptions;
|
|
35
33
|
return /*#__PURE__*/_react["default"].createElement(_BasicConfig["default"], (0, _extends2["default"])({
|
|
36
|
-
ref: ref
|
|
34
|
+
ref: ref
|
|
35
|
+
}, props, {
|
|
37
36
|
limit: 3,
|
|
38
37
|
elementType: "node",
|
|
39
38
|
showType: "tag",
|
|
40
39
|
commonOptions: commonOptions || defaultCommonOptions,
|
|
41
40
|
defaultCommonConfig: _ResourceInfoDisplay.DEFAULT_NODE_TAG_COMMON_CONFIG,
|
|
42
|
-
customSettingDrawer: function customSettingDrawer(params) {
|
|
43
|
-
return /*#__PURE__*/_react["default"].createElement(_NodeAttrSettingDrawer["default"], params);
|
|
44
|
-
},
|
|
45
41
|
type: "node"
|
|
46
|
-
}
|
|
42
|
+
}));
|
|
47
43
|
});
|
|
48
44
|
|
|
49
45
|
NodeTag.displayName = 'NodeTag';
|
|
@@ -15,8 +15,6 @@ var _ResourceInfoDisplay = require("../../../constants/ResourceInfoDisplay");
|
|
|
15
15
|
|
|
16
16
|
var _BasicConfig = _interopRequireDefault(require("./ResourceDisplay/BasicConfig"));
|
|
17
17
|
|
|
18
|
-
var _NodeAttrSettingDrawer = _interopRequireDefault(require("./components/NodeAttrSettingDrawer"));
|
|
19
|
-
|
|
20
18
|
var defaultCommonOptions = [{
|
|
21
19
|
value: 'attribute:display_name',
|
|
22
20
|
label: '显示名称'
|
|
@@ -33,16 +31,14 @@ var defaultCommonOptions = [{
|
|
|
33
31
|
var NodeTip = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
|
|
34
32
|
var commonOptions = props.commonOptions;
|
|
35
33
|
return /*#__PURE__*/_react["default"].createElement(_BasicConfig["default"], (0, _extends2["default"])({
|
|
36
|
-
ref: ref
|
|
34
|
+
ref: ref
|
|
35
|
+
}, props, {
|
|
37
36
|
limit: 4,
|
|
38
37
|
elementType: "node",
|
|
39
38
|
showType: "tip",
|
|
40
39
|
commonOptions: commonOptions || defaultCommonOptions,
|
|
41
|
-
defaultCommonConfig: _ResourceInfoDisplay.DEFAULT_TIP_COMMON_CONFIG
|
|
42
|
-
|
|
43
|
-
return /*#__PURE__*/_react["default"].createElement(_NodeAttrSettingDrawer["default"], params);
|
|
44
|
-
}
|
|
45
|
-
}, props));
|
|
40
|
+
defaultCommonConfig: _ResourceInfoDisplay.DEFAULT_TIP_COMMON_CONFIG
|
|
41
|
+
}));
|
|
46
42
|
});
|
|
47
43
|
|
|
48
44
|
NodeTip.propTypes = {
|
|
@@ -2,95 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
exports.__esModule = true;
|
|
4
4
|
exports.getNodeCiModSet = getNodeCiModSet;
|
|
5
|
-
exports.getNodeModels = getNodeModels;
|
|
6
5
|
|
|
7
6
|
var _topoData = require("../../../utils/topoData");
|
|
8
7
|
|
|
9
|
-
|
|
10
|
-
* 获取节点标注、悬浮框配置
|
|
11
|
-
* @param {*} topo
|
|
12
|
-
* @returns
|
|
13
|
-
*/
|
|
14
|
-
function getNodeModels(topo) {
|
|
15
|
-
var data = topo.store.getModelState('topoMod').data;
|
|
16
|
-
var ciTypeMap = topo.ciTyeCache.ciTypes;
|
|
17
|
-
return getNodeModSet();
|
|
18
|
-
|
|
19
|
-
function getNodeModSet() {
|
|
20
|
-
var ciTypes = (0, _topoData.getCiTypesFromCiElements)(data.nodes);
|
|
21
|
-
return getMods(ciTypes);
|
|
22
|
-
}
|
|
23
|
-
/**
|
|
24
|
-
*
|
|
25
|
-
* @param {array} ciTypeCodes
|
|
26
|
-
* @returns
|
|
27
|
-
*/
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
function getMods(ciTypeCodes) {
|
|
31
|
-
return Object.keys(ciTypeMap).filter(function (item) {
|
|
32
|
-
return ciTypeCodes.includes(item);
|
|
33
|
-
}).map(function (key) {
|
|
34
|
-
var ciTypeObj = ciTypeMap[key];
|
|
35
|
-
return {
|
|
36
|
-
id: ciTypeObj.code,
|
|
37
|
-
label: ciTypeObj.displayName,
|
|
38
|
-
icon: ciTypeObj.icon,
|
|
39
|
-
list: ciModfilter(ciTypeObj, 'node')
|
|
40
|
-
};
|
|
41
|
-
});
|
|
42
|
-
}
|
|
43
|
-
/**
|
|
44
|
-
* 过滤ci元数据中的属性和指标,用于属性和指标显示设置
|
|
45
|
-
* @param {} ciTypeObj
|
|
46
|
-
* @returns
|
|
47
|
-
*/
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
function ciModfilter(ciTypeObj, type) {
|
|
51
|
-
var custom = [];
|
|
52
|
-
|
|
53
|
-
if (type === 'node') {
|
|
54
|
-
custom.push.apply(custom, [{
|
|
55
|
-
id: 'graph:name',
|
|
56
|
-
code: 'name',
|
|
57
|
-
name: '图片名称',
|
|
58
|
-
type: 'custom'
|
|
59
|
-
}, {
|
|
60
|
-
id: 'ciType:display_name',
|
|
61
|
-
code: 'ciType',
|
|
62
|
-
name: '资源类型',
|
|
63
|
-
type: 'custom'
|
|
64
|
-
}]);
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
var attributes = ciTypeObj.attributes.filter(function (attr) {
|
|
68
|
-
return !!attr.userVisible;
|
|
69
|
-
}).map(function (item) {
|
|
70
|
-
return {
|
|
71
|
-
type: 'attribute',
|
|
72
|
-
id: "attribute:" + item.code,
|
|
73
|
-
code: "attribute:" + item.code,
|
|
74
|
-
name: item.name,
|
|
75
|
-
typeName: '属性'
|
|
76
|
-
};
|
|
77
|
-
});
|
|
78
|
-
var metrics = ciTypeObj.metrics.map(function (item) {
|
|
79
|
-
return {
|
|
80
|
-
type: 'metric',
|
|
81
|
-
id: "metric:" + item.code,
|
|
82
|
-
code: "metric:" + item.code,
|
|
83
|
-
name: item.name,
|
|
84
|
-
typeName: '指标'
|
|
85
|
-
};
|
|
86
|
-
});
|
|
87
|
-
return [].concat(custom, attributes, metrics);
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
;
|
|
91
|
-
} // 资源类型含有属性和指标集合
|
|
92
|
-
|
|
93
|
-
|
|
8
|
+
// 资源类型含有属性和指标集合
|
|
94
9
|
function getNodeCiModSet(params) {
|
|
95
10
|
var topo = params.topo;
|
|
96
11
|
var data = topo.store.getModelState('topoMod').data;
|
|
@@ -120,7 +35,8 @@ function getNodeCiModSet(params) {
|
|
|
120
35
|
icon: ciTypeObj.icon,
|
|
121
36
|
list: ciModfilter(ciTypeObj, globalConfig, 'node', ciTypeObj.code)
|
|
122
37
|
};
|
|
123
|
-
});
|
|
38
|
+
}); // console.log("modSet--------------------", modSet);
|
|
39
|
+
|
|
124
40
|
return modSet;
|
|
125
41
|
}
|
|
126
42
|
/**
|
|
@@ -150,7 +66,13 @@ function getNodeCiModSet(params) {
|
|
|
150
66
|
(_tags$data$code = tags.data[code]) === null || _tags$data$code === void 0 ? void 0 : _tags$data$code.map(function (item) {
|
|
151
67
|
tagArr.push(item.code + "-" + item.type);
|
|
152
68
|
});
|
|
153
|
-
}
|
|
69
|
+
} // rlog.debug(
|
|
70
|
+
// "过滤ci元数据中的属性和指标,用于属性和指标显示设置",
|
|
71
|
+
// globalSetting,
|
|
72
|
+
// tipArr,
|
|
73
|
+
// tagArr
|
|
74
|
+
// );
|
|
75
|
+
|
|
154
76
|
|
|
155
77
|
var custom = [];
|
|
156
78
|
|