@riil-frontend/component-topology 11.0.1 → 11.0.3
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 +1 -1
- package/build/index.js +11 -11
- package/es/components/BatchAttrMetric2/SelectTable.js +21 -0
- package/es/components/BatchAttrMetric2/constant.js +30 -0
- package/es/components/BatchAttrMetric2/index.js +75 -0
- package/es/components/BatchAttrMetric2/index.module.scss +76 -0
- package/es/components/BatchAttrMetric2/setting.js +188 -0
- package/es/components/BatchAttrMetric2/utils.js +80 -0
- package/es/components/ModelAttrSelectDrawer/components/ModelAttrSelect.js +7 -0
- package/es/components/ModelAttrSelectDrawer/components/ModelAttrSelectDrawer.js +36 -0
- package/es/components/ModelAttrSelectDrawer/index.js +2 -0
- package/es/core/components/DisplaySettingDrawer/NodeTag.js +1 -0
- package/es/core/models/TopoApp.js +1 -1
- package/es/core/models/tagstips/ElementTagTipConfig.js +15 -5
- package/es/core/utils/showGraphManageStatusUtil.js +5 -4
- package/es/core/viewer/components/plugins/ResourceDetail/ResourceDetail.js +12 -3
- package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/ResourceOverview.js +7 -7
- package/es/utils/tree.js +2 -9
- package/es/utils/treeUtil.js +13 -0
- package/lib/components/BatchAttrMetric2/SelectTable.js +29 -0
- package/lib/components/BatchAttrMetric2/constant.js +36 -0
- package/lib/components/BatchAttrMetric2/index.js +93 -0
- package/lib/components/BatchAttrMetric2/index.module.scss +76 -0
- package/lib/components/BatchAttrMetric2/setting.js +216 -0
- package/lib/components/BatchAttrMetric2/utils.js +97 -0
- package/lib/components/ModelAttrSelectDrawer/components/ModelAttrSelect.js +15 -0
- package/lib/components/ModelAttrSelectDrawer/components/ModelAttrSelectDrawer.js +51 -0
- package/lib/components/ModelAttrSelectDrawer/index.js +11 -0
- package/lib/core/components/DisplaySettingDrawer/NodeTag.js +1 -0
- package/lib/core/models/TopoApp.js +1 -1
- package/lib/core/models/tagstips/ElementTagTipConfig.js +15 -5
- package/lib/core/utils/showGraphManageStatusUtil.js +5 -4
- package/lib/core/viewer/components/plugins/ResourceDetail/ResourceDetail.js +12 -3
- package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/ResourceOverview.js +7 -8
- package/lib/utils/tree.js +3 -11
- package/lib/utils/treeUtil.js +20 -0
- package/package.json +3 -2
@@ -0,0 +1,21 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
export default function SelectTable(props) {
|
3
|
+
return /*#__PURE__*/React.createElement(Table, {
|
4
|
+
fixedHeader: true,
|
5
|
+
hasBorder: false,
|
6
|
+
dataSource: tableData,
|
7
|
+
emptyContent: /*#__PURE__*/React.createElement(NoDataPage, {
|
8
|
+
type: "table"
|
9
|
+
}),
|
10
|
+
rowSelection: {
|
11
|
+
selectedRowKeys: selectedRowKeys,
|
12
|
+
onChange: onTableSelect,
|
13
|
+
getProps: function getProps(_ref) {
|
14
|
+
var id = _ref.id;
|
15
|
+
return {
|
16
|
+
disabled: !selectedRowKeys.includes(id) && selectedRowKeys.length >= limit
|
17
|
+
};
|
18
|
+
}
|
19
|
+
}
|
20
|
+
}, columnNodes);
|
21
|
+
}
|
@@ -0,0 +1,30 @@
|
|
1
|
+
// 选择类型
|
2
|
+
export var SELECT_TYPE = {
|
3
|
+
single: {
|
4
|
+
showTree: false,
|
5
|
+
showCiNum: false,
|
6
|
+
drawerWidth: "calc(" + 5 + "/24 * 100%)"
|
7
|
+
},
|
8
|
+
batch: {
|
9
|
+
showTree: true,
|
10
|
+
showCiNum: true,
|
11
|
+
drawerWidth: "calc(" + 10 + "/24 * 100%)"
|
12
|
+
}
|
13
|
+
}; // 数据类型
|
14
|
+
|
15
|
+
export var DATA_TYPE = {
|
16
|
+
tag: {
|
17
|
+
drawerTitle: '选择图数据',
|
18
|
+
maxSelect: 4,
|
19
|
+
label: '图',
|
20
|
+
poslabel: '拓扑图上',
|
21
|
+
message: "\u56FE\u6570\u636E\uFF1A\u9009\u62E9\u7684\u6307\u6807\u548C\u5C5E\u6027\u5C06\u4F1A\u663E\u793A\u5728\u62D3\u6251\u56FE\u4E0A\uFF0C\u6700\u591A\u652F\u6301\u52FE\u9009 4 \u9879\u3002"
|
22
|
+
},
|
23
|
+
tip: {
|
24
|
+
drawerTitle: '选择Tooltips显示数据',
|
25
|
+
maxSelect: 10,
|
26
|
+
label: 'Tootip',
|
27
|
+
poslabel: 'Tooltip中',
|
28
|
+
message: "Tootip\u6570\u636E\uFF1A\u9009\u62E9\u7684\u6307\u6807\u548C\u5C5E\u6027\u5C06\u4F1A\u663E\u793A\u5728Tooltip\u4E2D\uFF0C\u6700\u591A\u652F\u6301\u52FE\u9009 10 \u9879\u3002"
|
29
|
+
}
|
30
|
+
};
|
@@ -0,0 +1,75 @@
|
|
1
|
+
import _Drawer from "@alifd/next/es/drawer";
|
2
|
+
import _extends from "@babel/runtime/helpers/extends";
|
3
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
4
|
+
var _excluded = ["saveCb", "showType"],
|
5
|
+
_excluded2 = ["drawerTitle", "drawerWidth"];
|
6
|
+
import React, { forwardRef, useImperativeHandle, useState } from 'react';
|
7
|
+
import { useBoolean } from 'ahooks';
|
8
|
+
import PropTypes from 'prop-types';
|
9
|
+
import styles from "./index.module.scss";
|
10
|
+
import SettingPage from "./setting";
|
11
|
+
import { SELECT_TYPE, DATA_TYPE } from "./constant";
|
12
|
+
/**
|
13
|
+
* 属性指标配置抽屉
|
14
|
+
*/
|
15
|
+
|
16
|
+
var BatchAttrMetricDrawer = /*#__PURE__*/forwardRef(function (props, ref) {
|
17
|
+
var _saveCb = props.saveCb,
|
18
|
+
showType = props.showType,
|
19
|
+
settingProps = _objectWithoutPropertiesLoose(props, _excluded);
|
20
|
+
|
21
|
+
var _useBoolean = useBoolean(false),
|
22
|
+
visible = _useBoolean[0],
|
23
|
+
_useBoolean$ = _useBoolean[1],
|
24
|
+
setTrue = _useBoolean$.setTrue,
|
25
|
+
setFalse = _useBoolean$.setFalse;
|
26
|
+
|
27
|
+
var selectType = 'batch';
|
28
|
+
useImperativeHandle(ref, function () {
|
29
|
+
return {
|
30
|
+
/**
|
31
|
+
* 展开抽屉
|
32
|
+
*/
|
33
|
+
show: function show(entryConfig) {
|
34
|
+
if (entryConfig === void 0) {
|
35
|
+
entryConfig = {};
|
36
|
+
}
|
37
|
+
|
38
|
+
setTrue();
|
39
|
+
}
|
40
|
+
};
|
41
|
+
});
|
42
|
+
|
43
|
+
var config = _extends({}, SELECT_TYPE[selectType], DATA_TYPE[showType]);
|
44
|
+
|
45
|
+
var drawerTitle = config.drawerTitle,
|
46
|
+
drawerWidth = config.drawerWidth,
|
47
|
+
pageConfig = _objectWithoutPropertiesLoose(config, _excluded2);
|
48
|
+
|
49
|
+
return /*#__PURE__*/React.createElement(_Drawer, {
|
50
|
+
closeMode: ['close', 'esc'],
|
51
|
+
visible: visible,
|
52
|
+
onClose: setFalse,
|
53
|
+
title: drawerTitle,
|
54
|
+
className: styles.drawer,
|
55
|
+
width: drawerWidth
|
56
|
+
}, visible && /*#__PURE__*/React.createElement(SettingPage, _extends({}, pageConfig, settingProps, {
|
57
|
+
cancelCb: setFalse,
|
58
|
+
saveCb: function saveCb(values) {
|
59
|
+
setFalse();
|
60
|
+
|
61
|
+
_saveCb(showType, values);
|
62
|
+
}
|
63
|
+
})));
|
64
|
+
});
|
65
|
+
BatchAttrMetricDrawer.displayName = 'BatchAttrMetricDrawer';
|
66
|
+
BatchAttrMetricDrawer.propTypes = {
|
67
|
+
// 数据项
|
68
|
+
dataSource: PropTypes.array.isRequired,
|
69
|
+
// 保存回调
|
70
|
+
saveCb: PropTypes.func
|
71
|
+
};
|
72
|
+
BatchAttrMetricDrawer.defaultProps = {
|
73
|
+
saveCb: function saveCb() {}
|
74
|
+
};
|
75
|
+
export default BatchAttrMetricDrawer;
|
@@ -0,0 +1,76 @@
|
|
1
|
+
@import "@alifd/next/variables";
|
2
|
+
|
3
|
+
.drawer {
|
4
|
+
& > div {
|
5
|
+
overflow: hidden !important;
|
6
|
+
}
|
7
|
+
:global {
|
8
|
+
.#{$css-prefix}drawer-body {
|
9
|
+
padding: 0;
|
10
|
+
height: calc(100% - 45px);
|
11
|
+
}
|
12
|
+
}
|
13
|
+
}
|
14
|
+
.layout {
|
15
|
+
height: 100%;
|
16
|
+
display: flex;
|
17
|
+
flex-direction: column;
|
18
|
+
& > div:last-child > button:first-child {
|
19
|
+
float: left;
|
20
|
+
line-height: 24px;
|
21
|
+
}
|
22
|
+
:global {
|
23
|
+
.riil-footer {
|
24
|
+
position: unset;
|
25
|
+
}
|
26
|
+
}
|
27
|
+
}
|
28
|
+
.message {
|
29
|
+
padding: 16px 24px 0;
|
30
|
+
}
|
31
|
+
.content {
|
32
|
+
padding: 16px 24px 0;
|
33
|
+
flex: auto;
|
34
|
+
overflow: hidden;
|
35
|
+
& > div:first-child:not(:last-child) {
|
36
|
+
box-shadow: 1px 0px 0px 0px #E4E9EE;
|
37
|
+
padding-right: $s-4;
|
38
|
+
}
|
39
|
+
& > div:last-child:not(:first-child) {
|
40
|
+
padding-left: $s-4;
|
41
|
+
}
|
42
|
+
:global {
|
43
|
+
.#{$css-prefix}table-header-node.#{$css-prefix}table-selection {
|
44
|
+
.#{$css-prefix}checkbox-wrapper {
|
45
|
+
display: none;
|
46
|
+
}
|
47
|
+
}
|
48
|
+
.#{$css-prefix}table-cell-wrapper {
|
49
|
+
white-space: unset !important;
|
50
|
+
}
|
51
|
+
}
|
52
|
+
}
|
53
|
+
.tree-wrap {
|
54
|
+
:global {
|
55
|
+
.#{$css-prefix}tree-node-label-wrapper {
|
56
|
+
width: 1px;
|
57
|
+
.tree-node-label > span {
|
58
|
+
display: inline-block;
|
59
|
+
width: calc(100% - 24px);
|
60
|
+
overflow: hidden;
|
61
|
+
text-overflow: ellipsis;
|
62
|
+
white-space: nowrap;
|
63
|
+
}
|
64
|
+
}
|
65
|
+
}
|
66
|
+
}
|
67
|
+
.table-wrap {
|
68
|
+
height: calc(100% + 1.5px);
|
69
|
+
}
|
70
|
+
.tip-content {
|
71
|
+
max-height: 250px;
|
72
|
+
overflow: auto;
|
73
|
+
& > div {
|
74
|
+
line-height: 20px;
|
75
|
+
}
|
76
|
+
}
|
@@ -0,0 +1,188 @@
|
|
1
|
+
import _Button from "@alifd/next/es/button";
|
2
|
+
import _Table from "@alifd/next/es/table";
|
3
|
+
import _Search from "@alifd/next/es/search";
|
4
|
+
import _Grid from "@alifd/next/es/grid";
|
5
|
+
import _Message from "@alifd/next/es/message";
|
6
|
+
import _extends from "@babel/runtime/helpers/extends";
|
7
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
8
|
+
var _excluded = ["value", "defaultSet", "dataSource"];
|
9
|
+
import React, { useState, useMemo } from 'react';
|
10
|
+
import rlog from '@riil-frontend/component-topology-utils/es/rlog';
|
11
|
+
import ActionTree from '@riil-frontend/component-action-tree';
|
12
|
+
import NoDataPage from '@riil-frontend/component-topology-common/es/components/NoDataPage';
|
13
|
+
import TableLayout from '@riil-frontend/component-table-layout';
|
14
|
+
import RiilHooks from '@riil-frontend/hooks';
|
15
|
+
import * as utils from "./utils";
|
16
|
+
import styles from "./index.module.scss";
|
17
|
+
import { loopTreeNode } from "../../utils/treeUtil";
|
18
|
+
|
19
|
+
var Setting = function Setting(_ref) {
|
20
|
+
var _ref$value = _ref.value,
|
21
|
+
value = _ref$value === void 0 ? {} : _ref$value,
|
22
|
+
defaultSet = _ref.defaultSet,
|
23
|
+
dataSource = _ref.dataSource,
|
24
|
+
props = _objectWithoutPropertiesLoose(_ref, _excluded);
|
25
|
+
|
26
|
+
var limit = props.limit,
|
27
|
+
saveCb = props.saveCb;
|
28
|
+
var allCiSet = useMemo(function () {
|
29
|
+
var map = {};
|
30
|
+
loopTreeNode(dataSource, function (item) {
|
31
|
+
map[item.id] = item;
|
32
|
+
});
|
33
|
+
return map;
|
34
|
+
}, [dataSource]);
|
35
|
+
|
36
|
+
var _useState = useState(Object.keys(allCiSet)[0]),
|
37
|
+
ciType = _useState[0],
|
38
|
+
setCiType = _useState[1];
|
39
|
+
|
40
|
+
var _useState2 = useState(''),
|
41
|
+
search = _useState2[0],
|
42
|
+
setSearch = _useState2[1];
|
43
|
+
|
44
|
+
var _useState3 = useState(value),
|
45
|
+
selected = _useState3[0],
|
46
|
+
setSelected = _useState3[1];
|
47
|
+
|
48
|
+
var selectedRowKeys = selected[ciType] || [];
|
49
|
+
|
50
|
+
var _RiilHooks$useTableCo = RiilHooks.useTableColumn({
|
51
|
+
columns: [{
|
52
|
+
width: '100%',
|
53
|
+
dataIndex: 'name',
|
54
|
+
title: '数据',
|
55
|
+
cellOption: {
|
56
|
+
nowrap: true
|
57
|
+
}
|
58
|
+
}, {
|
59
|
+
width: '70px',
|
60
|
+
dataIndex: 'type',
|
61
|
+
title: '类型',
|
62
|
+
cellOption: {
|
63
|
+
nowrap: {
|
64
|
+
nowrapCell: utils.typeCell,
|
65
|
+
title: utils.typeCell
|
66
|
+
}
|
67
|
+
}
|
68
|
+
}]
|
69
|
+
}),
|
70
|
+
columnNodes = _RiilHooks$useTableCo.columnNodes;
|
71
|
+
|
72
|
+
var onTreeSelect = function onTreeSelect(_ref2) {
|
73
|
+
var selectedKey = _ref2[0];
|
74
|
+
|
75
|
+
if (selectedKey && allCiSet[selectedKey].type !== 'folder') {
|
76
|
+
setCiType(selectedKey);
|
77
|
+
}
|
78
|
+
};
|
79
|
+
|
80
|
+
var onTableSelect = function onTableSelect(selectedKeys) {
|
81
|
+
var values = _extends({}, selected);
|
82
|
+
|
83
|
+
rlog.debug('Setting-allCiSet-onTableSelect', limit, selectedKeys, selected);
|
84
|
+
values[ciType] = selectedKeys;
|
85
|
+
setSelected(values);
|
86
|
+
};
|
87
|
+
|
88
|
+
var saveSelected = function saveSelected() {
|
89
|
+
saveCb(selected);
|
90
|
+
};
|
91
|
+
|
92
|
+
var onReset = function onReset() {
|
93
|
+
setSelected({});
|
94
|
+
};
|
95
|
+
|
96
|
+
var tableData = useMemo(function () {
|
97
|
+
var _allCiSet$ciType;
|
98
|
+
|
99
|
+
// console.log('allCiSet,ciType,search', allCiSet, ciType, search);
|
100
|
+
var list = ((_allCiSet$ciType = allCiSet[ciType]) === null || _allCiSet$ciType === void 0 ? void 0 : _allCiSet$ciType.list) || [];
|
101
|
+
|
102
|
+
if (search) {
|
103
|
+
list = list.filter(function (item) {
|
104
|
+
var _item$name;
|
105
|
+
|
106
|
+
return ((_item$name = item.name) === null || _item$name === void 0 ? void 0 : _item$name.toUpperCase().indexOf(search.toUpperCase())) !== -1;
|
107
|
+
});
|
108
|
+
}
|
109
|
+
|
110
|
+
return list;
|
111
|
+
}, [allCiSet, ciType, search]);
|
112
|
+
|
113
|
+
function onSearch(value) {
|
114
|
+
// console.log('search', search);
|
115
|
+
setSearch(value);
|
116
|
+
}
|
117
|
+
|
118
|
+
return /*#__PURE__*/React.createElement("div", {
|
119
|
+
className: styles.layout
|
120
|
+
}, /*#__PURE__*/React.createElement("div", {
|
121
|
+
className: styles.message
|
122
|
+
}, /*#__PURE__*/React.createElement(_Message, {
|
123
|
+
type: "notice"
|
124
|
+
}, props.label + "\u6570\u636E\uFF1A\u9009\u62E9\u7684\u6307\u6807\u548C\u5C5E\u6027\u5C06\u4F1A\u663E\u793A\u5728" + props.poslabel + "\uFF0C\u6700\u591A\u652F\u6301\u52FE\u9009 " + limit + " \u9879\u3002")), /*#__PURE__*/React.createElement(_Grid.Row, {
|
125
|
+
className: styles.content
|
126
|
+
}, /*#__PURE__*/React.createElement(_Grid.Col, {
|
127
|
+
span: 8,
|
128
|
+
className: styles['tree-wrap']
|
129
|
+
}, /*#__PURE__*/React.createElement(ActionTree, {
|
130
|
+
dataSource: dataSource,
|
131
|
+
onSelect: onTreeSelect,
|
132
|
+
draggable: false,
|
133
|
+
treeProps: {
|
134
|
+
selectedKeys: [ciType]
|
135
|
+
}
|
136
|
+
})), /*#__PURE__*/React.createElement(_Grid.Col, {
|
137
|
+
className: styles['table-wrap']
|
138
|
+
}, /*#__PURE__*/React.createElement(TableLayout, {
|
139
|
+
filterItems: /*#__PURE__*/React.createElement("div", {
|
140
|
+
className: styles.filter
|
141
|
+
}, /*#__PURE__*/React.createElement(_Search, {
|
142
|
+
// className={styles.search}
|
143
|
+
style: {
|
144
|
+
width: 200
|
145
|
+
},
|
146
|
+
shape: "simple",
|
147
|
+
placeholder: "\u8BF7\u8F93\u5165\u5173\u952E\u5B57",
|
148
|
+
onSearch: onSearch,
|
149
|
+
onChange: function onChange(val) {
|
150
|
+
return !val && onSearch('');
|
151
|
+
},
|
152
|
+
hasClear: true
|
153
|
+
})),
|
154
|
+
table: /*#__PURE__*/React.createElement(_Table, {
|
155
|
+
fixedHeader: true,
|
156
|
+
hasBorder: false,
|
157
|
+
dataSource: tableData,
|
158
|
+
emptyContent: /*#__PURE__*/React.createElement(NoDataPage, {
|
159
|
+
type: "table"
|
160
|
+
}),
|
161
|
+
rowSelection: {
|
162
|
+
selectedRowKeys: selectedRowKeys,
|
163
|
+
onChange: onTableSelect,
|
164
|
+
getProps: function getProps(_ref3) {
|
165
|
+
var id = _ref3.id;
|
166
|
+
return {
|
167
|
+
disabled: !selectedRowKeys.includes(id) && selectedRowKeys.length >= limit
|
168
|
+
};
|
169
|
+
}
|
170
|
+
}
|
171
|
+
}, columnNodes)
|
172
|
+
}))), /*#__PURE__*/React.createElement("div", {
|
173
|
+
className: "riil-footer right"
|
174
|
+
}, /*#__PURE__*/React.createElement(_Button, {
|
175
|
+
text: true,
|
176
|
+
type: "primary",
|
177
|
+
onClick: onReset
|
178
|
+
}, "\u91CD\u7F6E"), /*#__PURE__*/React.createElement(_Button, {
|
179
|
+
type: "primary",
|
180
|
+
onClick: function onClick() {
|
181
|
+
saveSelected();
|
182
|
+
}
|
183
|
+
}, "\u786E\u5B9A"), /*#__PURE__*/React.createElement(_Button, {
|
184
|
+
onClick: props.cancelCb
|
185
|
+
}, "\u53D6\u6D88")));
|
186
|
+
};
|
187
|
+
|
188
|
+
export default Setting;
|
@@ -0,0 +1,80 @@
|
|
1
|
+
import React from "react";
|
2
|
+
import styles from "./index.module.scss";
|
3
|
+
import rlog from "@riil-frontend/component-topology-utils/es/rlog";
|
4
|
+
/**
|
5
|
+
* 获取树结构数据源
|
6
|
+
* @param {*} allCiSet 数据源
|
7
|
+
* @returns
|
8
|
+
*/
|
9
|
+
|
10
|
+
export var treeDs = function treeDs(allCiSet) {
|
11
|
+
return Object.keys(allCiSet).map(function (key) {
|
12
|
+
var _allCiSet$key, _allCiSet$key2;
|
13
|
+
|
14
|
+
return {
|
15
|
+
id: key,
|
16
|
+
label: (_allCiSet$key = allCiSet[key]) === null || _allCiSet$key === void 0 ? void 0 : _allCiSet$key.name,
|
17
|
+
icon: "/img/model/" + ((_allCiSet$key2 = allCiSet[key]) === null || _allCiSet$key2 === void 0 ? void 0 : _allCiSet$key2.icon) + ".svg"
|
18
|
+
};
|
19
|
+
});
|
20
|
+
}; // 由于属性和指标code存在重复,拼接code与类型作为id
|
21
|
+
|
22
|
+
var toId = function toId(_ref) {
|
23
|
+
var code = _ref.code,
|
24
|
+
type = _ref.type;
|
25
|
+
return type ? code + "-" + type : code;
|
26
|
+
}; // id反解析回对象
|
27
|
+
|
28
|
+
|
29
|
+
var reverseToId = function reverseToId(id) {
|
30
|
+
var _id$split = id.split("-"),
|
31
|
+
code = _id$split[0],
|
32
|
+
type = _id$split[1];
|
33
|
+
|
34
|
+
return {
|
35
|
+
code: code,
|
36
|
+
type: type
|
37
|
+
};
|
38
|
+
};
|
39
|
+
/**
|
40
|
+
* 获取默认选择项,用于重置
|
41
|
+
* @param {*} allCiSet 数据源
|
42
|
+
* @param {*} defaultSet 默认选择项数据源
|
43
|
+
* @param {*} dataType 数据类型
|
44
|
+
* @returns
|
45
|
+
*/
|
46
|
+
|
47
|
+
|
48
|
+
export var defaultSelected = function defaultSelected(allCiSet, defaultSet, dataType) {
|
49
|
+
if (defaultSet === void 0) {
|
50
|
+
defaultSet = {};
|
51
|
+
}
|
52
|
+
|
53
|
+
var values = {};
|
54
|
+
Object.keys(allCiSet).forEach(function (key) {
|
55
|
+
var ciTypeSelected = defaultSet[key] || defaultSet[allCiSet[key].code]; // 没有ci类型对应的默认配置 -> 使用通用的配置项
|
56
|
+
// const selected = (ciTypeSelected || defaultSet['common'])[dataType] || [];
|
57
|
+
|
58
|
+
var selected = [];
|
59
|
+
var selectedIds = selected.map(function (item) {
|
60
|
+
return toId(item);
|
61
|
+
});
|
62
|
+
var data = allCiSet[key].list;
|
63
|
+
var selectedData = data === null || data === void 0 ? void 0 : data.filter(function (item) {
|
64
|
+
return selectedIds.includes(item.id);
|
65
|
+
});
|
66
|
+
values[key] = selectedData.map(function (item) {
|
67
|
+
return item.id;
|
68
|
+
}) || [];
|
69
|
+
});
|
70
|
+
return values;
|
71
|
+
};
|
72
|
+
export var typeCell = function typeCell(text) {
|
73
|
+
if (text === "attribute") {
|
74
|
+
return "属性";
|
75
|
+
} else if (text === "metric") {
|
76
|
+
return "指标";
|
77
|
+
}
|
78
|
+
|
79
|
+
return "-";
|
80
|
+
};
|
@@ -0,0 +1,36 @@
|
|
1
|
+
import React, { forwardRef } from 'react';
|
2
|
+
import PropTypes from 'prop-types';
|
3
|
+
import BatchAttrMetricDrawer from "../../BatchAttrMetric2";
|
4
|
+
var ModelAttrSelectDrawer = /*#__PURE__*/forwardRef(function (props, ref) {
|
5
|
+
var value = props.value,
|
6
|
+
dataSource = props.dataSource,
|
7
|
+
limit = props.limit,
|
8
|
+
showType = props.showType,
|
9
|
+
onOk = props.onOk;
|
10
|
+
return /*#__PURE__*/React.createElement(BatchAttrMetricDrawer, {
|
11
|
+
ref: ref,
|
12
|
+
value: value,
|
13
|
+
dataSource: dataSource,
|
14
|
+
limit: limit,
|
15
|
+
showType: showType,
|
16
|
+
saveCb: onOk
|
17
|
+
});
|
18
|
+
});
|
19
|
+
ModelAttrSelectDrawer.displayName = 'ModelAttrSelectDrawer';
|
20
|
+
ModelAttrSelectDrawer.propTypes = {
|
21
|
+
// 数据项
|
22
|
+
dataSource: PropTypes.array,
|
23
|
+
value: PropTypes.object,
|
24
|
+
limit: PropTypes.number,
|
25
|
+
showType: PropTypes.oneOf(['tag', 'tip', null]),
|
26
|
+
// 保存回调
|
27
|
+
onOk: PropTypes.func
|
28
|
+
};
|
29
|
+
ModelAttrSelectDrawer.defaultProps = {
|
30
|
+
dataSource: [],
|
31
|
+
value: {},
|
32
|
+
limit: 999,
|
33
|
+
showType: null,
|
34
|
+
onOk: function onOk(val) {}
|
35
|
+
};
|
36
|
+
export default ModelAttrSelectDrawer;
|
@@ -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.3" === 'string' ? "11.0.3" : null;
|
28
28
|
console.info("\u62D3\u6251\u7248\u672C: " + version);
|
29
29
|
/**
|
30
30
|
* 拓扑显示和编辑
|
@@ -85,7 +85,7 @@ var ElementTagTipConfig = /*#__PURE__*/function () {
|
|
85
85
|
_proto.getLinkConfigItems = function getLinkConfigItems() {
|
86
86
|
var mtCodes = getLinkMtCodes(this.topoData);
|
87
87
|
var linkFidldMap = this.getLinkFidldMap();
|
88
|
-
|
88
|
+
var list = [{
|
89
89
|
id: 'm.critical_link',
|
90
90
|
label: '关键链路'
|
91
91
|
}, {
|
@@ -100,6 +100,14 @@ var ElementTagTipConfig = /*#__PURE__*/function () {
|
|
100
100
|
list: linkFidldMap[t.id] || []
|
101
101
|
});
|
102
102
|
});
|
103
|
+
return list; // return [
|
104
|
+
// { id: 'ax1', label: '本级平台', children: list, type: 'folder', disabled: true },
|
105
|
+
// {
|
106
|
+
// id: 'bb22', label: '下级平台', type: 'folder', children: [
|
107
|
+
// { id: 'xvdafa', label: '关键链路', icon: '/img/model/networkLink.svg' },
|
108
|
+
// ]
|
109
|
+
// },
|
110
|
+
// ]
|
103
111
|
};
|
104
112
|
|
105
113
|
_proto.getFiedldMapByType = function getFiedldMapByType(mtCodes, type) {
|
@@ -127,16 +135,18 @@ var ElementTagTipConfig = /*#__PURE__*/function () {
|
|
127
135
|
map[mtCode] = [].concat(extItems, attributes.map(function (item) {
|
128
136
|
return {
|
129
137
|
type: 'attribute',
|
130
|
-
|
138
|
+
id: "attribute:" + item.code,
|
139
|
+
code: "attribute:" + item.code,
|
131
140
|
name: item.name,
|
132
|
-
|
141
|
+
typeName: '属性'
|
133
142
|
};
|
134
143
|
}), metrics.map(function (item) {
|
135
144
|
return {
|
136
145
|
type: 'metric',
|
137
|
-
|
146
|
+
id: "metric:" + item.code,
|
147
|
+
code: "metric:" + item.code,
|
138
148
|
name: item.name,
|
139
|
-
|
149
|
+
typeName: '指标'
|
140
150
|
};
|
141
151
|
}));
|
142
152
|
});
|
@@ -20,15 +20,16 @@ export function showManageStatus(options) {
|
|
20
20
|
manageStatus = resource.manageStatus,
|
21
21
|
permission = resource.permission;
|
22
22
|
var isNotMonite = manageStatus === 0;
|
23
|
-
var readable = !!(permission !== null && permission !== void 0 && permission.readable);
|
23
|
+
var readable = !!(permission !== null && permission !== void 0 && permission.readable); // 没有告警且有查看权限,才显示未监控状态
|
24
|
+
|
24
25
|
var showUnMoniteStatus = !hasAlarm(id) && isNotMonite && readable;
|
25
26
|
var element = topo.getDataModel().getDataByTag(id);
|
26
|
-
if (!element) return;
|
27
|
+
if (!element) return; // ht元素设置是否显示监控状态,是否展示,用于缩小色块时显示未监控颜色
|
28
|
+
|
29
|
+
element.a('ci.isMonitoring', !showUnMoniteStatus);
|
27
30
|
|
28
31
|
if (type === 'node') {
|
29
32
|
try {
|
30
|
-
element.a('isMonitoring', showUnMoniteStatus); // 用于缩小色块时显示未监控颜色
|
31
|
-
|
32
33
|
if (showUnMoniteStatus) {
|
33
34
|
topo.getHtTopo().setNodeStyleIcon(element, {
|
34
35
|
styleIcon: 'unMoniter',
|
@@ -1,4 +1,6 @@
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
2
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
|
3
|
+
var _excluded = ["canShow", "getCustomDetailContent"];
|
2
4
|
import React from 'react';
|
3
5
|
import Tab from "../../../../../components/FullheightTab";
|
4
6
|
import ClusterMemberTable from "./components/ClusterMemberTable";
|
@@ -11,11 +13,18 @@ export default function ResourceDetail(props) {
|
|
11
13
|
var topo = props.topo,
|
12
14
|
userId = props.userId,
|
13
15
|
activeData = props.activeData,
|
14
|
-
resourceData = props.resourceData
|
16
|
+
resourceData = props.resourceData,
|
17
|
+
viewerProps = props.viewerProps;
|
18
|
+
|
19
|
+
var canShow = props.canShow,
|
20
|
+
getCustomDetailContent = props.getCustomDetailContent,
|
21
|
+
widgetProps = _objectWithoutPropertiesLoose(props, _excluded);
|
22
|
+
|
15
23
|
var tabBodys = [{
|
16
24
|
title: '资源概览',
|
17
|
-
content: /*#__PURE__*/React.createElement(ResourceOverview, _extends({},
|
18
|
-
userId: userId
|
25
|
+
content: /*#__PURE__*/React.createElement(ResourceOverview, _extends({}, widgetProps, activeData, {
|
26
|
+
userId: userId,
|
27
|
+
resourceDetailProps: viewerProps === null || viewerProps === void 0 ? void 0 : viewerProps.resourceDetailProps
|
19
28
|
}))
|
20
29
|
}, {
|
21
30
|
title: '集群成员',
|
@@ -17,7 +17,6 @@ import { rlog } from '@riil-frontend/component-topology-utils/lib/rlog'; // impo
|
|
17
17
|
|
18
18
|
import Link from "../../../../../../../components/Link";
|
19
19
|
import { queryCisByIds, commonQueryCiData } from "../../../../../../services";
|
20
|
-
import alarmService from "../../../../../../services/alarm";
|
21
20
|
import service from "../../../../../../services/overview";
|
22
21
|
import BaseInfoBlock from "./BaseInfoBlock";
|
23
22
|
import BlockBox from "./BlockBox";
|
@@ -44,21 +43,23 @@ function formatUrl(url) {
|
|
44
43
|
}
|
45
44
|
}
|
46
45
|
/**
|
47
|
-
*
|
46
|
+
* 资源概览。
|
47
|
+
* 业务拓扑集成了,修改时请注意
|
48
48
|
*/
|
49
49
|
|
50
50
|
|
51
51
|
export default function ResourceOverview(props) {
|
52
|
-
var
|
52
|
+
var _data$attributes;
|
53
53
|
|
54
54
|
var topo = props.topo,
|
55
55
|
id = props.id,
|
56
56
|
type = props.type,
|
57
57
|
ciType = props.ciType,
|
58
|
+
resourceData = props.resourceData,
|
58
59
|
userId = props.userId,
|
59
|
-
|
60
|
+
resourceDetailProps = props.resourceDetailProps,
|
60
61
|
style = props.style;
|
61
|
-
var resourceOverviewProps = (
|
62
|
+
var resourceOverviewProps = (resourceDetailProps === null || resourceDetailProps === void 0 ? void 0 : resourceDetailProps.resourceOverviewProps) || {}; // 是否是业务拓扑
|
62
63
|
|
63
64
|
var isAppTopo = !!resourceOverviewProps.getData;
|
64
65
|
|
@@ -432,8 +433,7 @@ export default function ResourceOverview(props) {
|
|
432
433
|
id: id,
|
433
434
|
ciType: ciType,
|
434
435
|
type: type,
|
435
|
-
|
436
|
-
name: props.name ? props.name : props.resourceData.attributes.name
|
436
|
+
name: resourceData.name ? resourceData.name : resourceData.attributes.name
|
437
437
|
}; // 基本信息设置改变
|
438
438
|
|
439
439
|
function baseInfoColChange(_x6) {
|