@riil-frontend/component-topology 2.7.3 → 2.8.1
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 +2 -2
- package/build/index.css +1 -1
- package/build/index.js +40 -40
- package/es/components/ResourceList/ResourceSelect.js +15 -14
- package/es/components/TagSelect/index.js +60 -0
- package/es/components/TagSelect/index.scss +27 -0
- package/es/components/TemplateButton/index.js +12 -3
- package/es/components/TemplateButton/index.module.scss +13 -26
- package/es/components/TemplateSelect/index.js +40 -18
- package/es/models/linkDynamicStyle.js +21 -6
- package/es/topoCenter/store/topoTreeMod.js +4 -24
- package/es/utils/template.js +1 -1
- package/es/utils/tree.js +14 -0
- package/lib/components/ResourceList/ResourceSelect.js +15 -15
- package/lib/components/TagSelect/index.js +76 -0
- package/lib/components/TagSelect/index.scss +27 -0
- package/lib/components/TemplateButton/index.js +13 -4
- package/lib/components/TemplateButton/index.module.scss +13 -26
- package/lib/components/TemplateSelect/index.js +42 -18
- package/lib/models/linkDynamicStyle.js +21 -6
- package/lib/topoCenter/store/topoTreeMod.js +3 -23
- package/lib/utils/template.js +1 -1
- package/lib/utils/tree.js +16 -0
- package/package.json +4 -4
|
@@ -1,41 +1,28 @@
|
|
|
1
1
|
@import "@alifd/next/variables";
|
|
2
2
|
|
|
3
3
|
.card {
|
|
4
|
-
display:
|
|
4
|
+
display: flex;
|
|
5
5
|
flex-direction: column;
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
border: 1px solid #c4c6cf;
|
|
9
|
-
width: 120px;
|
|
10
|
-
height: 136px;
|
|
11
|
-
background-color: #fff;
|
|
12
|
-
text-align: center;
|
|
6
|
+
width: 100%;
|
|
7
|
+
height: 100%;
|
|
13
8
|
cursor: pointer;
|
|
14
|
-
|
|
15
|
-
margin-right: 12px;
|
|
16
|
-
|
|
17
|
-
&:hover, &:focus, &.selected {
|
|
18
|
-
border-color: $color-brand1-5;
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
&.sizeNormal {
|
|
22
|
-
width: 120px;
|
|
23
|
-
height: 136px;
|
|
24
|
-
}
|
|
9
|
+
}
|
|
25
10
|
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
11
|
+
.iconWrapper {
|
|
12
|
+
display: flex;
|
|
13
|
+
flex: 1;
|
|
14
|
+
justify-content: center;
|
|
15
|
+
align-items: center;
|
|
30
16
|
}
|
|
31
17
|
|
|
32
18
|
.icon {
|
|
33
|
-
width:
|
|
19
|
+
width: 120px;
|
|
34
20
|
}
|
|
35
21
|
|
|
36
22
|
.text {
|
|
37
|
-
font-size:
|
|
38
|
-
margin-top:
|
|
23
|
+
font-size: 18px;
|
|
24
|
+
margin-top: 16px;
|
|
25
|
+
padding-bottom: 24px;
|
|
39
26
|
color: $color-text1-3;
|
|
40
27
|
outline: none;
|
|
41
28
|
}
|
|
@@ -5,6 +5,8 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
5
5
|
exports.__esModule = true;
|
|
6
6
|
exports["default"] = void 0;
|
|
7
7
|
|
|
8
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
|
+
|
|
8
10
|
var _tag = _interopRequireDefault(require("@alifd/next/lib/tag"));
|
|
9
11
|
|
|
10
12
|
var _react = _interopRequireDefault(require("react"));
|
|
@@ -15,30 +17,52 @@ var _indexModule = _interopRequireDefault(require("./index.module.scss"));
|
|
|
15
17
|
|
|
16
18
|
var _TemplateGroup = _interopRequireDefault(require("../TemplateGroup"));
|
|
17
19
|
|
|
20
|
+
var _TagSelect = _interopRequireDefault(require("../TagSelect"));
|
|
21
|
+
|
|
18
22
|
var TagGroup = _tag["default"].Group,
|
|
19
23
|
SelectableTag = _tag["default"].Selectable;
|
|
20
24
|
|
|
21
25
|
var TemplateSelect = function TemplateSelect(props) {
|
|
22
|
-
|
|
26
|
+
var _data$filter$;
|
|
27
|
+
|
|
23
28
|
// return (
|
|
24
|
-
// <
|
|
25
|
-
// {data.map((item) => (
|
|
26
|
-
// <SelectableTag
|
|
27
|
-
// key={item.name}
|
|
28
|
-
// checked={item.selected}
|
|
29
|
-
// onChange={() => {}}
|
|
30
|
-
// >
|
|
31
|
-
// <TemplateButton
|
|
32
|
-
// key={item.id}
|
|
33
|
-
// {...item}
|
|
34
|
-
// size={size}
|
|
35
|
-
// >
|
|
36
|
-
// {item.name}
|
|
37
|
-
// </TemplateButton>
|
|
38
|
-
// </SelectableTag>
|
|
39
|
-
// ))}
|
|
40
|
-
// </TagGroup>
|
|
29
|
+
// <TemplateGroup {...props}/>
|
|
41
30
|
// )
|
|
31
|
+
var _props$data = props.data,
|
|
32
|
+
data = _props$data === void 0 ? [] : _props$data,
|
|
33
|
+
size = props.size,
|
|
34
|
+
boxProps = props.boxProps,
|
|
35
|
+
tagProps = props.tagProps,
|
|
36
|
+
itemProps = props.itemProps;
|
|
37
|
+
var value = (_data$filter$ = data.filter(function (item) {
|
|
38
|
+
return item.selected;
|
|
39
|
+
})[0]) === null || _data$filter$ === void 0 ? void 0 : _data$filter$.id;
|
|
40
|
+
return /*#__PURE__*/_react["default"].createElement(_TagSelect["default"], {
|
|
41
|
+
defaultValue: value,
|
|
42
|
+
dataSource: data.map(function (item) {
|
|
43
|
+
return {
|
|
44
|
+
key: item.id,
|
|
45
|
+
content: /*#__PURE__*/_react["default"].createElement(_TemplateButton["default"], (0, _extends2["default"])({
|
|
46
|
+
key: item.id
|
|
47
|
+
}, item, {
|
|
48
|
+
size: size
|
|
49
|
+
}, itemProps), item.name)
|
|
50
|
+
};
|
|
51
|
+
}),
|
|
52
|
+
boxProps: boxProps,
|
|
53
|
+
tagProps: tagProps
|
|
54
|
+
});
|
|
55
|
+
return /*#__PURE__*/_react["default"].createElement(TagGroup, null, data.map(function (item) {
|
|
56
|
+
return /*#__PURE__*/_react["default"].createElement(SelectableTag, {
|
|
57
|
+
key: item.name,
|
|
58
|
+
checked: item.selected,
|
|
59
|
+
onChange: function onChange() {}
|
|
60
|
+
}, /*#__PURE__*/_react["default"].createElement(_TemplateButton["default"], (0, _extends2["default"])({
|
|
61
|
+
key: item.id
|
|
62
|
+
}, item, {
|
|
63
|
+
size: size
|
|
64
|
+
}), item.name));
|
|
65
|
+
}));
|
|
42
66
|
};
|
|
43
67
|
|
|
44
68
|
var _default = TemplateSelect;
|
|
@@ -221,13 +221,28 @@ function _default(engine) {
|
|
|
221
221
|
|
|
222
222
|
links = [];
|
|
223
223
|
|
|
224
|
-
if (isEdit && rootState.topoCreateMod.elements.links.length) {
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
224
|
+
if (!(isEdit && rootState.topoCreateMod.elements.links.length)) {
|
|
225
|
+
_context3.next = 9;
|
|
226
|
+
break;
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
links = rootState.topoCreateMod.elements.links;
|
|
230
|
+
_context3.next = 12;
|
|
231
|
+
break;
|
|
232
|
+
|
|
233
|
+
case 9:
|
|
234
|
+
if (rootState.topoMod.topoData) {
|
|
235
|
+
_context3.next = 11;
|
|
236
|
+
break;
|
|
237
|
+
}
|
|
238
|
+
|
|
239
|
+
return _context3.abrupt("return");
|
|
229
240
|
|
|
241
|
+
case 11:
|
|
242
|
+
links = rootState.topoMod.topoData.links;
|
|
230
243
|
|
|
244
|
+
case 12:
|
|
245
|
+
// 获取属性。无权限的属性为 []
|
|
231
246
|
allLinkAttributes = rootState.topoBizMod.attrsAndMetrics; // 告警
|
|
232
247
|
|
|
233
248
|
alarmMap = rootState.topoBizMod.alarmDoc; // 如果是显示模式,过滤有告警的链路
|
|
@@ -281,7 +296,7 @@ function _default(engine) {
|
|
|
281
296
|
engine.view.topoClient.batchSetLineStyle(linkStyleMap);
|
|
282
297
|
}
|
|
283
298
|
|
|
284
|
-
case
|
|
299
|
+
case 19:
|
|
285
300
|
case "end":
|
|
286
301
|
return _context3.stop();
|
|
287
302
|
}
|
|
@@ -21,27 +21,7 @@ var _tree = require("../../utils/tree");
|
|
|
21
21
|
|
|
22
22
|
var clone = function clone(data) {
|
|
23
23
|
return JSON.parse(JSON.stringify(data));
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
function findSelectedParentIds(data, selectedId) {
|
|
28
|
-
// 选中 id 为 -1,则没有默认选中项
|
|
29
|
-
if (selectedId == '-1') return [];
|
|
30
|
-
var node = {};
|
|
31
|
-
(0, _tree.loopTree)(data, selectedId, function (item, index, arr, pid) {
|
|
32
|
-
node = {
|
|
33
|
-
item: item,
|
|
34
|
-
pid: pid
|
|
35
|
-
};
|
|
36
|
-
});
|
|
37
|
-
if (!node.item) return [];
|
|
38
|
-
|
|
39
|
-
if (node.pid != -1 && node.item.id) {
|
|
40
|
-
return node.item.type === 0 ? ["" + node.item.id].concat(findSelectedParentIds(data, node.pid)) : [].concat(findSelectedParentIds(data, node.pid));
|
|
41
|
-
} else {
|
|
42
|
-
return ["" + node.item.id];
|
|
43
|
-
}
|
|
44
|
-
}
|
|
24
|
+
};
|
|
45
25
|
/**
|
|
46
26
|
* TODO 导航树相关增删改移到拓扑中心
|
|
47
27
|
*/
|
|
@@ -94,7 +74,7 @@ function _default(topoApp) {
|
|
|
94
74
|
treeData: (0, _tree.treeNodeCount)(treeData),
|
|
95
75
|
defId: defId,
|
|
96
76
|
selectedNode: [selectedTopoId],
|
|
97
|
-
expandedKeys:
|
|
77
|
+
expandedKeys: (0, _tree.findParentIdsById)(treeData, selectedTopoId)
|
|
98
78
|
}); // console.log('resTreeData', resTreeData, rootState.topoMod.topoId);
|
|
99
79
|
|
|
100
80
|
|
|
@@ -383,7 +363,7 @@ function _default(topoApp) {
|
|
|
383
363
|
}
|
|
384
364
|
|
|
385
365
|
var expandedKeys = [].concat(treeState.expandedKeys || []);
|
|
386
|
-
var parentIds =
|
|
366
|
+
var parentIds = (0, _tree.findParentIdsById)(treeState.treeData, id);
|
|
387
367
|
expandedKeys.push.apply(expandedKeys, parentIds);
|
|
388
368
|
this.update({
|
|
389
369
|
selectedNode: ["" + id],
|
package/lib/utils/template.js
CHANGED
package/lib/utils/tree.js
CHANGED
|
@@ -4,6 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
|
|
5
5
|
exports.__esModule = true;
|
|
6
6
|
exports.findNodeById = findNodeById;
|
|
7
|
+
exports.findParentIdsById = findParentIdsById;
|
|
7
8
|
exports.formatTree = formatTree;
|
|
8
9
|
exports.treeNodeCount = exports.loopTreeFun = exports.loopTreeByKey = exports.loopTree = exports.iconImg = void 0;
|
|
9
10
|
|
|
@@ -103,6 +104,21 @@ function findNodeById(tree, id) {
|
|
|
103
104
|
});
|
|
104
105
|
return node;
|
|
105
106
|
}
|
|
107
|
+
/**
|
|
108
|
+
* 按id查找祖先节点id列表
|
|
109
|
+
*/
|
|
110
|
+
|
|
111
|
+
|
|
112
|
+
function findParentIdsById(tree, id) {
|
|
113
|
+
var node = findNodeById(tree, id);
|
|
114
|
+
var parentId = "" + node.parentId;
|
|
115
|
+
|
|
116
|
+
if (parentId === '-1') {
|
|
117
|
+
return [];
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
return [parentId].concat(findParentIdsById(tree, parentId));
|
|
121
|
+
}
|
|
106
122
|
/**
|
|
107
123
|
* 递归循环遍历树匹配KEY
|
|
108
124
|
* @param {array} json
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@riil-frontend/component-topology",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.8.1",
|
|
4
4
|
"description": "拓扑",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"start": "build-scripts start",
|
|
@@ -52,7 +52,7 @@
|
|
|
52
52
|
},
|
|
53
53
|
"devDependencies": {
|
|
54
54
|
"@alifd/next": "^1.21.16",
|
|
55
|
-
"@alifd/theme-19926": "^0.
|
|
55
|
+
"@alifd/theme-19926": "^0.20.0",
|
|
56
56
|
"@formily/next": "1.3.13",
|
|
57
57
|
"@formily/next-components": "1.3.13",
|
|
58
58
|
"@iceworks/spec": "^1.0.0",
|
|
@@ -67,7 +67,7 @@
|
|
|
67
67
|
"@riil-frontend/component-row-delete-ballon": "^1.0.2",
|
|
68
68
|
"@riil-frontend/component-table-filter-tags": "latest",
|
|
69
69
|
"@riil-frontend/component-table-layout": "^2.0.2",
|
|
70
|
-
"@riil-frontend/component-topology-graph": "^2.2.
|
|
70
|
+
"@riil-frontend/component-topology-graph": "^2.2.5",
|
|
71
71
|
"@riil-frontend/css": "^2.0.2",
|
|
72
72
|
"@riil-frontend/hooks": "latest",
|
|
73
73
|
"@riil-frontend/next-collapse": "^1.0.1-a.0",
|
|
@@ -102,6 +102,6 @@
|
|
|
102
102
|
"access": "public"
|
|
103
103
|
},
|
|
104
104
|
"license": "MIT",
|
|
105
|
-
"homepage": "https://unpkg.com/@riil-frontend/component-topology@2.
|
|
105
|
+
"homepage": "https://unpkg.com/@riil-frontend/component-topology@2.8.1/build/index.html",
|
|
106
106
|
"gitHead": "62eadeca07c85ed047f2e933676f62015eff98cc"
|
|
107
107
|
}
|