@riil-frontend/component-topology 3.1.12 → 3.3.0
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.js +36 -36
- package/demo/CHANGELOG/CHANGELOG.md +20 -1
- package/es/core/common/icons/icon.js +3 -28
- package/es/core/editor/components/settings/propertyViews/edge/CommonEdgePropertyView.js +135 -10
- package/es/core/editor/components/settings/propertyViews/edge/EdgePropertyView.js +5 -5
- package/es/core/models/TopoApp.js +1 -1
- package/es/core/models/topoData.js +21 -18
- package/es/core/models/utils/linkUtils.js +2 -1
- package/es/core/viewer/components/plugins/ResourceDetail/ResourceDetail.js +9 -5
- package/es/hooks/useResourceConfig.js +3 -2
- package/es/hooks/useSelection.js +16 -14
- package/es/models/topoConfig.js +20 -16
- package/es/models/topoMod.js +1 -0
- package/es/topoCenter/components/editor/propertyViews/edge/LinkPropertyView/Data/index.js +4 -2
- package/es/topoCenter/components/editor/propertyViews/edge/LinkPropertyView/LinkPropertyView.js +15 -3
- package/es/topoCenter/components/editor/propertyViews/edge/LinkPropertyView/Setting/index.js +3 -3
- package/es/topoCenter/components/editor/propertyViews/edge/addLinkDrawer/AddLinkDrawer.js +145 -100
- package/es/topoCenter/components/editor/propertyViews/edge/addLinkDrawer/components/editLinkInfo.js +45 -9
- package/es/topoCenter/components/editor/propertyViews/edge/link/LinkInfoPreview.js +26 -7
- package/es/topoCenter/event/index.js +1 -0
- package/es/topoCenter/hooks/editor/useDeleteEdges.js +46 -24
- package/es/topoCenter/services/link.js +43 -0
- package/es/topoCenter/utils/linPermissionUtil.js +25 -13
- package/es/utils/ResourceConfigUtil.js +38 -16
- package/es/utils/topoData.js +6 -7
- package/lib/core/common/icons/icon.js +3 -35
- package/lib/core/editor/components/settings/propertyViews/edge/CommonEdgePropertyView.js +145 -9
- package/lib/core/editor/components/settings/propertyViews/edge/EdgePropertyView.js +4 -5
- package/lib/core/models/TopoApp.js +1 -1
- package/lib/core/models/topoData.js +24 -17
- package/lib/core/models/utils/linkUtils.js +2 -1
- package/lib/core/viewer/components/plugins/ResourceDetail/ResourceDetail.js +9 -5
- package/lib/hooks/useResourceConfig.js +3 -2
- package/lib/hooks/useSelection.js +15 -11
- package/lib/models/topoConfig.js +24 -16
- package/lib/models/topoMod.js +1 -0
- package/lib/topoCenter/components/editor/propertyViews/edge/LinkPropertyView/Data/index.js +5 -2
- package/lib/topoCenter/components/editor/propertyViews/edge/LinkPropertyView/LinkPropertyView.js +16 -2
- package/lib/topoCenter/components/editor/propertyViews/edge/LinkPropertyView/Setting/index.js +2 -2
- package/lib/topoCenter/components/editor/propertyViews/edge/addLinkDrawer/AddLinkDrawer.js +144 -115
- package/lib/topoCenter/components/editor/propertyViews/edge/addLinkDrawer/components/editLinkInfo.js +46 -9
- package/lib/topoCenter/components/editor/propertyViews/edge/link/LinkInfoPreview.js +27 -7
- package/lib/topoCenter/event/index.js +2 -1
- package/lib/topoCenter/hooks/editor/useDeleteEdges.js +46 -24
- package/lib/topoCenter/services/link.js +44 -0
- package/lib/topoCenter/utils/linPermissionUtil.js +25 -13
- package/lib/utils/ResourceConfigUtil.js +36 -14
- package/lib/utils/topoData.js +6 -7
- package/package.json +3 -3
- package/CHANGELOG.md +0 -27
- package/es/core/common/icons/defaultIcons.js +0 -44
- package/es/core/common/icons/networkTopoCiTypeIcons.js +0 -9
- package/lib/core/common/icons/defaultIcons.js +0 -53
- package/lib/core/common/icons/networkTopoCiTypeIcons.js +0 -22
package/lib/topoCenter/components/editor/propertyViews/edge/addLinkDrawer/components/editLinkInfo.js
CHANGED
|
@@ -27,6 +27,8 @@ var _grid = _interopRequireDefault(require("@alifd/next/lib/grid"));
|
|
|
27
27
|
|
|
28
28
|
var _form = _interopRequireDefault(require("@alifd/next/lib/form"));
|
|
29
29
|
|
|
30
|
+
var _radio = _interopRequireDefault(require("@alifd/next/lib/radio"));
|
|
31
|
+
|
|
30
32
|
var _react = _interopRequireWildcard(require("react"));
|
|
31
33
|
|
|
32
34
|
var _rlog = _interopRequireDefault(require("@riil-frontend/component-topology-utils/es/rlog"));
|
|
@@ -37,6 +39,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
37
39
|
|
|
38
40
|
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; }
|
|
39
41
|
|
|
42
|
+
var RadioGroup = _radio["default"].Group;
|
|
40
43
|
var FormItem = _form["default"].Item;
|
|
41
44
|
var Row = _grid["default"].Row,
|
|
42
45
|
Col = _grid["default"].Col; // import LindInfoPreview from "../../link/LindInfoPreview";
|
|
@@ -60,9 +63,9 @@ function EditLinkInfo(props) {
|
|
|
60
63
|
|
|
61
64
|
var _topo$store$useModel2 = topo.store.useModel("topoBizMod"),
|
|
62
65
|
bizState = _topo$store$useModel2[0],
|
|
63
|
-
bizDispatchers = _topo$store$useModel2[1];
|
|
66
|
+
bizDispatchers = _topo$store$useModel2[1]; // const { resAndMetrics } = topoState;
|
|
67
|
+
// const { resAndMetrics } = bizState;
|
|
64
68
|
|
|
65
|
-
var resAndMetrics = topoState.resAndMetrics; // const { resAndMetrics } = bizState;
|
|
66
69
|
|
|
67
70
|
var source = lineData.source,
|
|
68
71
|
target = lineData.target,
|
|
@@ -80,6 +83,10 @@ function EditLinkInfo(props) {
|
|
|
80
83
|
targetValue = _useState3[0],
|
|
81
84
|
setTarget = _useState3[1];
|
|
82
85
|
|
|
86
|
+
var _useState4 = (0, _react.useState)(true),
|
|
87
|
+
connectEnable = _useState4[0],
|
|
88
|
+
setConnectEnable = _useState4[1];
|
|
89
|
+
|
|
83
90
|
var fieldOnChange = function fieldOnChange(name, value) {
|
|
84
91
|
var newValues = field.getValues();
|
|
85
92
|
|
|
@@ -111,7 +118,8 @@ function EditLinkInfo(props) {
|
|
|
111
118
|
}
|
|
112
119
|
};
|
|
113
120
|
|
|
114
|
-
var linkTypeJudge = function linkTypeJudge(sourceType, destinationType) {
|
|
121
|
+
var linkTypeJudge = function linkTypeJudge(sourceType, destinationType, type) {
|
|
122
|
+
console.log("linkTypeJudge", sourceType, destinationType, type);
|
|
115
123
|
var connect = "phy";
|
|
116
124
|
var support = "m.physical_link";
|
|
117
125
|
|
|
@@ -120,8 +128,9 @@ function EditLinkInfo(props) {
|
|
|
120
128
|
support = "m.agg_link";
|
|
121
129
|
}
|
|
122
130
|
|
|
123
|
-
if (
|
|
131
|
+
if (type === "exit") {
|
|
124
132
|
connect = "exit";
|
|
133
|
+
support = "m.exit_link";
|
|
125
134
|
}
|
|
126
135
|
|
|
127
136
|
return {
|
|
@@ -130,6 +139,11 @@ function EditLinkInfo(props) {
|
|
|
130
139
|
};
|
|
131
140
|
};
|
|
132
141
|
|
|
142
|
+
var connectHandleChange = function connectHandleChange(v) {
|
|
143
|
+
console.log("connectHandleChange", v);
|
|
144
|
+
field.setValue("connect_type", v);
|
|
145
|
+
};
|
|
146
|
+
|
|
133
147
|
var portsHandleChange = function portsHandleChange(type, value) {
|
|
134
148
|
var _sourceValue$portsDoc, _sourceValue$portsDoc2, _targetValue$portsDoc, _targetValue$portsDoc2;
|
|
135
149
|
|
|
@@ -156,15 +170,15 @@ function EditLinkInfo(props) {
|
|
|
156
170
|
if (errors) {
|
|
157
171
|
_rlog["default"].debug("saveHandleChange-error", errors, values);
|
|
158
172
|
} else {
|
|
159
|
-
var _sourceValue$portsDoc3, _sourceValue$portsDoc4, _targetValue$portsDoc3, _targetValue$portsDoc4, _sourceValue$ipAddres, _targetValue$ipAddres;
|
|
173
|
+
var _valus$destination_id, _sourceValue$portsDoc3, _sourceValue$portsDoc4, _targetValue$portsDoc3, _targetValue$portsDoc4, _sourceValue$ipAddres, _targetValue$ipAddres, _targetValue$id;
|
|
160
174
|
|
|
161
175
|
_rlog["default"].debug("saveHandleChange", valus, source, target);
|
|
162
176
|
|
|
163
177
|
var sourceId = valus["source_id"];
|
|
164
|
-
var destinationId = valus["destination_id"];
|
|
178
|
+
var destinationId = (_valus$destination_id = valus["destination_id"]) !== null && _valus$destination_id !== void 0 ? _valus$destination_id : "";
|
|
165
179
|
var sourceType = (_sourceValue$portsDoc3 = (_sourceValue$portsDoc4 = sourceValue.portsDoc[sourceId]) === null || _sourceValue$portsDoc4 === void 0 ? void 0 : _sourceValue$portsDoc4.type) !== null && _sourceValue$portsDoc3 !== void 0 ? _sourceValue$portsDoc3 : "";
|
|
166
180
|
var destinationType = (_targetValue$portsDoc3 = (_targetValue$portsDoc4 = targetValue.portsDoc[destinationId]) === null || _targetValue$portsDoc4 === void 0 ? void 0 : _targetValue$portsDoc4.type) !== null && _targetValue$portsDoc3 !== void 0 ? _targetValue$portsDoc3 : "";
|
|
167
|
-
var typeJudge = linkTypeJudge(sourceType, destinationType);
|
|
181
|
+
var typeJudge = linkTypeJudge(sourceType, destinationType, valus["connect_type"]);
|
|
168
182
|
var obj = {
|
|
169
183
|
display_name: valus["display_name"],
|
|
170
184
|
// 链路名称
|
|
@@ -184,7 +198,7 @@ function EditLinkInfo(props) {
|
|
|
184
198
|
// destination_type, // 必须
|
|
185
199
|
"network_link.source_device_id": sourceValue.id,
|
|
186
200
|
// 必须
|
|
187
|
-
"network_link.destination_device_id": targetValue.id,
|
|
201
|
+
"network_link.destination_device_id": (_targetValue$id = targetValue.id) !== null && _targetValue$id !== void 0 ? _targetValue$id : "",
|
|
188
202
|
// 必须
|
|
189
203
|
"network_link.connect_type": typeJudge.connect,
|
|
190
204
|
// 必须
|
|
@@ -201,6 +215,10 @@ function EditLinkInfo(props) {
|
|
|
201
215
|
obj["destination_id"] = destinationId; // 目的端口
|
|
202
216
|
|
|
203
217
|
obj["destination_type"] = destinationType;
|
|
218
|
+
} else {
|
|
219
|
+
obj["destination_id"] = ""; // 目的端口
|
|
220
|
+
|
|
221
|
+
obj["destination_type"] = "";
|
|
204
222
|
}
|
|
205
223
|
|
|
206
224
|
if (isAdd) {
|
|
@@ -303,7 +321,7 @@ function EditLinkInfo(props) {
|
|
|
303
321
|
}, /*#__PURE__*/_react["default"].createElement(FormItem, (0, _extends2["default"])({}, formItemLayout, {
|
|
304
322
|
labelAlign: labelAlign,
|
|
305
323
|
label: "\u76EE\u7684\u7AEF\u53E3",
|
|
306
|
-
required:
|
|
324
|
+
required: valus["connect_type"] !== "exit",
|
|
307
325
|
requiredMessage: "\u76EE\u7684\u7AEF\u53E3\u4E0D\u80FD\u4E3A\u7A7A"
|
|
308
326
|
}), targetValue.ipAddress ? /*#__PURE__*/_react["default"].createElement(_select["default"], {
|
|
309
327
|
name: "destination_id",
|
|
@@ -350,6 +368,25 @@ function EditLinkInfo(props) {
|
|
|
350
368
|
gutter: "16"
|
|
351
369
|
}, /*#__PURE__*/_react["default"].createElement(Col, {
|
|
352
370
|
span: "24"
|
|
371
|
+
}, /*#__PURE__*/_react["default"].createElement(FormItem, (0, _extends2["default"])({}, formItemLayout, {
|
|
372
|
+
labelAlign: labelAlign,
|
|
373
|
+
label: "\u94FE\u63A5\u65B9\u5F0F"
|
|
374
|
+
}), /*#__PURE__*/_react["default"].createElement(RadioGroup, {
|
|
375
|
+
name: "connect_type",
|
|
376
|
+
onChange: function onChange(v) {
|
|
377
|
+
connectHandleChange(v);
|
|
378
|
+
}
|
|
379
|
+
}, /*#__PURE__*/_react["default"].createElement(_radio["default"], {
|
|
380
|
+
id: "phy",
|
|
381
|
+
value: "phy",
|
|
382
|
+
disabled: target.ciType === "customNode"
|
|
383
|
+
}, "\u7269\u7406/\u805A\u5408"), /*#__PURE__*/_react["default"].createElement(_radio["default"], {
|
|
384
|
+
id: "exit",
|
|
385
|
+
value: "exit"
|
|
386
|
+
}, "\u51FA\u53E3"))))), /*#__PURE__*/_react["default"].createElement(Row, {
|
|
387
|
+
gutter: "16"
|
|
388
|
+
}, /*#__PURE__*/_react["default"].createElement(Col, {
|
|
389
|
+
span: "24"
|
|
353
390
|
}, /*#__PURE__*/_react["default"].createElement(FormItem, (0, _extends2["default"])({}, formItemLayout, {
|
|
354
391
|
labelAlign: labelAlign,
|
|
355
392
|
label: "\u5B9E\u9645\u5E26\u5BBD\uFF08Mbps\uFF09"
|
|
@@ -15,6 +15,8 @@ var _LinkInfoPreviewModule = _interopRequireDefault(require("./LinkInfoPreview.m
|
|
|
15
15
|
|
|
16
16
|
var _attributeFormatter = require("../../../../../../core/models/attributeFormatter");
|
|
17
17
|
|
|
18
|
+
var _rlog = _interopRequireDefault(require("@riil-frontend/component-topology-utils/es/rlog"));
|
|
19
|
+
|
|
18
20
|
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); }
|
|
19
21
|
|
|
20
22
|
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; }
|
|
@@ -45,8 +47,13 @@ function LindInfoPreview(props) {
|
|
|
45
47
|
}, {
|
|
46
48
|
label: "目的端口",
|
|
47
49
|
name: "destination_id"
|
|
48
|
-
},
|
|
49
|
-
|
|
50
|
+
}, {
|
|
51
|
+
label: "取值端口",
|
|
52
|
+
name: "network_link.value_port"
|
|
53
|
+
}, {
|
|
54
|
+
label: "链接方式",
|
|
55
|
+
name: "network_link.connect_type"
|
|
56
|
+
}, {
|
|
50
57
|
label: "实际带宽",
|
|
51
58
|
name: "network_link.actual_bandwidth"
|
|
52
59
|
}, {
|
|
@@ -57,14 +64,27 @@ function LindInfoPreview(props) {
|
|
|
57
64
|
var getValue = function getValue(name) {
|
|
58
65
|
var value;
|
|
59
66
|
|
|
60
|
-
if (data
|
|
61
|
-
|
|
67
|
+
if (data) {
|
|
68
|
+
if (data.attributes[name + "_object"]) {
|
|
69
|
+
value = data.attributes[name + "_object"].displayName;
|
|
70
|
+
} else {
|
|
71
|
+
value = data.attributes[name];
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
var attrMeta = topo.ciTyeCache.getCiType("network_link").attributeMap[name];
|
|
75
|
+
value = (0, _attributeFormatter.formatMetric)(value, attrMeta);
|
|
76
|
+
|
|
77
|
+
if (name === "network_link.value_port") {
|
|
78
|
+
value = "源端口";
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
if (name === "network_link.connect_type") {
|
|
82
|
+
value = data.attributes[name] === "exit" ? "出口" : "物理/聚合";
|
|
83
|
+
}
|
|
62
84
|
} else {
|
|
63
|
-
value =
|
|
85
|
+
value = "-";
|
|
64
86
|
}
|
|
65
87
|
|
|
66
|
-
var attrMeta = topo.ciTyeCache.getCiType("network_link").attributeMap[name];
|
|
67
|
-
value = (0, _attributeFormatter.formatMetric)(value, attrMeta);
|
|
68
88
|
return value;
|
|
69
89
|
};
|
|
70
90
|
|
|
@@ -7,4 +7,5 @@ var TopoCenterEvent = function TopoCenterEvent() {};
|
|
|
7
7
|
|
|
8
8
|
exports["default"] = TopoCenterEvent;
|
|
9
9
|
TopoCenterEvent.TOPO_LINK_ENTER_CREATE_MODE = "topo_link_enter_create_mode";
|
|
10
|
-
TopoCenterEvent.TOPO_LINK_CREATED = "topo_link_created";
|
|
10
|
+
TopoCenterEvent.TOPO_LINK_CREATED = "topo_link_created";
|
|
11
|
+
TopoCenterEvent.TOPO_LINK_SELECT_SOURCE_NODE = "topo_link_select_source_node";
|
|
@@ -56,31 +56,24 @@ var _default = function _default(_ref) {
|
|
|
56
56
|
return deleteable;
|
|
57
57
|
}
|
|
58
58
|
|
|
59
|
-
var
|
|
60
|
-
var
|
|
61
|
-
|
|
62
|
-
var isAgg = (0, _linkUtils.isAggLink)(link);
|
|
63
|
-
|
|
64
|
-
if (!checkLinkDeleteable(link)) {
|
|
65
|
-
return;
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
var htTopo = topo.getHtTopo();
|
|
69
|
-
confirmDeleteLink( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
|
|
70
|
-
var success, edgesInNodes, edgeGroupData, edgeData, _topo$store$getModel, topoState, topoDispatchers, _topoState$data, links, linkGroups;
|
|
59
|
+
var doDeleteLink = /*#__PURE__*/function () {
|
|
60
|
+
var _ref2 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(link, edge) {
|
|
61
|
+
var id, isAgg, success, htTopo, edgesInNodes, edgeGroupData, edgeData, _topo$store$getModel, topoState, topoDispatchers, _topoState$data, links, linkGroups;
|
|
71
62
|
|
|
72
63
|
return _regenerator["default"].wrap(function _callee$(_context) {
|
|
73
64
|
while (1) {
|
|
74
65
|
switch (_context.prev = _context.next) {
|
|
75
66
|
case 0:
|
|
76
|
-
|
|
67
|
+
id = link.id;
|
|
68
|
+
isAgg = (0, _linkUtils.isAggLink)(link);
|
|
69
|
+
_context.next = 4;
|
|
77
70
|
return _link["default"].deleteLink(id);
|
|
78
71
|
|
|
79
|
-
case
|
|
72
|
+
case 4:
|
|
80
73
|
success = _context.sent;
|
|
81
74
|
|
|
82
75
|
if (success) {
|
|
83
|
-
_context.next =
|
|
76
|
+
_context.next = 8;
|
|
84
77
|
break;
|
|
85
78
|
}
|
|
86
79
|
|
|
@@ -88,9 +81,10 @@ var _default = function _default(_ref) {
|
|
|
88
81
|
|
|
89
82
|
return _context.abrupt("return");
|
|
90
83
|
|
|
91
|
-
case
|
|
92
|
-
_message["default"].success('删除成功');
|
|
84
|
+
case 8:
|
|
85
|
+
_message["default"].success('删除成功');
|
|
93
86
|
|
|
87
|
+
htTopo = topo.getHtTopo(); // 获取两个节点间的连线数据列表
|
|
94
88
|
|
|
95
89
|
edgesInNodes = htTopo.getEdgeDatasInNodes(edge.getSource(), edge.getTarget());
|
|
96
90
|
|
|
@@ -114,28 +108,56 @@ var _default = function _default(_ref) {
|
|
|
114
108
|
|
|
115
109
|
_topo$store$getModel = topo.store.getModel('topoMod'), topoState = _topo$store$getModel[0], topoDispatchers = _topo$store$getModel[1];
|
|
116
110
|
_topoState$data = topoState.data, links = _topoState$data.links, linkGroups = _topoState$data.linkGroups;
|
|
117
|
-
_context.next =
|
|
111
|
+
_context.next = 16;
|
|
118
112
|
return topoDispatchers.update({
|
|
119
113
|
data: (0, _extends2["default"])({}, topoState.data, {
|
|
120
|
-
links: links.filter(function (
|
|
121
|
-
return
|
|
114
|
+
links: links.filter(function (item) {
|
|
115
|
+
return item.id !== id;
|
|
122
116
|
}),
|
|
123
|
-
linkGroups: linkGroups.filter(function (
|
|
124
|
-
return
|
|
117
|
+
linkGroups: linkGroups.filter(function (item) {
|
|
118
|
+
return item.id !== id;
|
|
125
119
|
})
|
|
126
120
|
})
|
|
127
121
|
});
|
|
128
122
|
|
|
129
|
-
case
|
|
123
|
+
case 16:
|
|
130
124
|
// 刷新链路动态线宽
|
|
131
125
|
topo.linkDynamicStyleExecutor.execute();
|
|
132
126
|
|
|
133
|
-
case
|
|
127
|
+
case 17:
|
|
134
128
|
case "end":
|
|
135
129
|
return _context.stop();
|
|
136
130
|
}
|
|
137
131
|
}
|
|
138
132
|
}, _callee);
|
|
133
|
+
}));
|
|
134
|
+
|
|
135
|
+
return function doDeleteLink(_x, _x2) {
|
|
136
|
+
return _ref2.apply(this, arguments);
|
|
137
|
+
};
|
|
138
|
+
}();
|
|
139
|
+
|
|
140
|
+
var deleteLink = function deleteLink(edge) {
|
|
141
|
+
var id = edge.getTag();
|
|
142
|
+
var link = topo.dataModel.getDataById(id);
|
|
143
|
+
|
|
144
|
+
if (!checkLinkDeleteable(link)) {
|
|
145
|
+
return;
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
confirmDeleteLink( /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
|
|
149
|
+
return _regenerator["default"].wrap(function _callee2$(_context2) {
|
|
150
|
+
while (1) {
|
|
151
|
+
switch (_context2.prev = _context2.next) {
|
|
152
|
+
case 0:
|
|
153
|
+
doDeleteLink(link, edge);
|
|
154
|
+
|
|
155
|
+
case 1:
|
|
156
|
+
case "end":
|
|
157
|
+
return _context2.stop();
|
|
158
|
+
}
|
|
159
|
+
}
|
|
160
|
+
}, _callee2);
|
|
139
161
|
})));
|
|
140
162
|
};
|
|
141
163
|
/**
|
|
@@ -156,6 +156,50 @@ var _default = {
|
|
|
156
156
|
}
|
|
157
157
|
}, _callee4, null, [[0, 7]]);
|
|
158
158
|
}))();
|
|
159
|
+
},
|
|
160
|
+
|
|
161
|
+
/**
|
|
162
|
+
* 查询可关联链路
|
|
163
|
+
*
|
|
164
|
+
* @param {array} ciIds
|
|
165
|
+
*/
|
|
166
|
+
queryAssociatedlinks: function queryAssociatedlinks(ids) {
|
|
167
|
+
return (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee5() {
|
|
168
|
+
var idtxt, parm, jsonParm, result;
|
|
169
|
+
return _regenerator["default"].wrap(function _callee5$(_context5) {
|
|
170
|
+
while (1) {
|
|
171
|
+
switch (_context5.prev = _context5.next) {
|
|
172
|
+
case 0:
|
|
173
|
+
idtxt = "'" + ids[0] + "','" + ids[1] + "'";
|
|
174
|
+
parm = {
|
|
175
|
+
condition: "type('network_link') && network_link.connect_type = 'exit' && network_link.source_device_id in [" + idtxt + "]",
|
|
176
|
+
sort: "name asc",
|
|
177
|
+
currentPage: 1,
|
|
178
|
+
pageSize: 20
|
|
179
|
+
};
|
|
180
|
+
jsonParm = JSON.stringify(parm);
|
|
181
|
+
console.log("queryAssociatedlinks", ids, idtxt, parm, jsonParm);
|
|
182
|
+
_context5.prev = 4;
|
|
183
|
+
_context5.next = 7;
|
|
184
|
+
return (0, _componentTopologyCommon.getRequest)().post("/mdc/v1/api/cmdb/commonQueryCiData", jsonParm);
|
|
185
|
+
|
|
186
|
+
case 7:
|
|
187
|
+
result = _context5.sent;
|
|
188
|
+
return _context5.abrupt("return", result);
|
|
189
|
+
|
|
190
|
+
case 11:
|
|
191
|
+
_context5.prev = 11;
|
|
192
|
+
_context5.t0 = _context5["catch"](4);
|
|
193
|
+
|
|
194
|
+
_rlog["default"].error("查询可关联链路", _context5.t0);
|
|
195
|
+
|
|
196
|
+
case 14:
|
|
197
|
+
case "end":
|
|
198
|
+
return _context5.stop();
|
|
199
|
+
}
|
|
200
|
+
}
|
|
201
|
+
}, _callee5, null, [[4, 11]]);
|
|
202
|
+
}))();
|
|
159
203
|
}
|
|
160
204
|
};
|
|
161
205
|
exports["default"] = _default;
|
|
@@ -3,27 +3,39 @@
|
|
|
3
3
|
exports.__esModule = true;
|
|
4
4
|
exports.getLinkPermission = getLinkPermission;
|
|
5
5
|
|
|
6
|
+
var isWriteable = function isWriteable(link, source, target, linkType) {
|
|
7
|
+
if (linkType === "exit") {
|
|
8
|
+
return ["write", "delete"].indexOf(source === null || source === void 0 ? void 0 : source.operation) !== -1;
|
|
9
|
+
} else {
|
|
10
|
+
return [source, target].filter(function (node) {
|
|
11
|
+
return ["write", "delete"].indexOf(node === null || node === void 0 ? void 0 : node.operation) !== -1;
|
|
12
|
+
}).length === 2;
|
|
13
|
+
}
|
|
14
|
+
};
|
|
6
15
|
/**
|
|
7
16
|
* 获得链路权限
|
|
8
|
-
*
|
|
9
|
-
* @param {*} link
|
|
10
|
-
* @param {*} nodes
|
|
11
|
-
* @returns
|
|
17
|
+
*
|
|
18
|
+
* @param {*} link
|
|
19
|
+
* @param {*} nodes
|
|
20
|
+
* @returns
|
|
12
21
|
*/
|
|
13
|
-
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
function getLinkPermission(edge, nodes, link) {
|
|
14
25
|
var source = nodes.find(function (node) {
|
|
15
|
-
return node.id ===
|
|
26
|
+
return node.id === edge.source;
|
|
16
27
|
});
|
|
17
28
|
var target = nodes.find(function (node) {
|
|
18
|
-
return node.id ===
|
|
19
|
-
});
|
|
29
|
+
return node.id === edge.target;
|
|
30
|
+
}); // console.log("getLinkPermission", edge, source, target, link);
|
|
31
|
+
|
|
32
|
+
var linkType = link.attributes["network_link.connect_type"]; //TODO 这里的逻辑因为 出口链路 可能需要调整
|
|
33
|
+
|
|
20
34
|
return {
|
|
21
|
-
readable: source.operation || target.operation,
|
|
22
|
-
writeable:
|
|
23
|
-
return ['write', 'delete'].indexOf(node.operation) !== -1;
|
|
24
|
-
}).length === 2,
|
|
35
|
+
readable: (source === null || source === void 0 ? void 0 : source.operation) || (target === null || target === void 0 ? void 0 : target.operation),
|
|
36
|
+
writeable: isWriteable(edge, source, target, linkType),
|
|
25
37
|
deleteable: [source, target].filter(function (node) {
|
|
26
|
-
return [
|
|
38
|
+
return ["write", "delete"].indexOf(node === null || node === void 0 ? void 0 : node.operation) !== -1;
|
|
27
39
|
}).length >= 1
|
|
28
40
|
};
|
|
29
41
|
}
|
|
@@ -11,19 +11,21 @@ var _htElementUtils = require("./htElementUtils");
|
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
13
|
* 从拓扑图解析出拓扑资源配置
|
|
14
|
-
*
|
|
15
|
-
* @param {ht.DataModel} dataModel
|
|
14
|
+
*
|
|
15
|
+
* @param {ht.DataModel} dataModel
|
|
16
16
|
* @returns {{layers, groups, resources}}
|
|
17
17
|
*/
|
|
18
|
-
function getResourceConfigFromHt(
|
|
19
|
-
|
|
18
|
+
function getResourceConfigFromHt(topo) {
|
|
19
|
+
var htTopo = topo.getHtTopo();
|
|
20
|
+
var dataModel = topo.getDataModel(); // 获得分层
|
|
21
|
+
|
|
20
22
|
var layerElements = (0, _htElementUtils.getLayers)(dataModel);
|
|
21
23
|
var layers = layerElements.map(function (layerElement) {
|
|
22
24
|
return {
|
|
23
25
|
id: layerElement.getTag(),
|
|
24
|
-
tag: layerElement.a(
|
|
25
|
-
name: layerElement.s(
|
|
26
|
-
order: layerElement.a(
|
|
26
|
+
tag: layerElement.a("tag"),
|
|
27
|
+
name: layerElement.s("label"),
|
|
28
|
+
order: layerElement.a("order"),
|
|
27
29
|
resources: {
|
|
28
30
|
"static": (0, _htElementUtils.getLayerChildrenNodes)(layerElement).filter(function (node) {
|
|
29
31
|
return !!node.getTag();
|
|
@@ -40,7 +42,7 @@ function getResourceConfigFromHt(dataModel) {
|
|
|
40
42
|
var viewNodes = (0, _htElementUtils.getNodes)(dataModel).filter(function (node) {
|
|
41
43
|
return !node.getParent();
|
|
42
44
|
}).filter(function (node) {
|
|
43
|
-
return node.a(
|
|
45
|
+
return node.a("type") === "node";
|
|
44
46
|
}).filter(function (node) {
|
|
45
47
|
return !!node.getTag();
|
|
46
48
|
});
|
|
@@ -51,20 +53,40 @@ function getResourceConfigFromHt(dataModel) {
|
|
|
51
53
|
}; // console.error('getResourceConfigFromHt', {
|
|
52
54
|
// viewNodes,
|
|
53
55
|
// });
|
|
56
|
+
// 查询出口链路列表
|
|
57
|
+
|
|
58
|
+
var exportLinkIdList = [];
|
|
59
|
+
var edges = (0, _htElementUtils.getEdges)(dataModel);
|
|
60
|
+
console.log(" 查询出口链路列表-edges", edges, dataModel);
|
|
61
|
+
edges.forEach(function (edge) {
|
|
62
|
+
var edgeData = htTopo.getEdgeData(edge); // eslint-disable-next-line no-underscore-dangle
|
|
63
|
+
|
|
64
|
+
var id = edgeData._attrObject.id;
|
|
65
|
+
|
|
66
|
+
if (id) {
|
|
67
|
+
var linkData = topo.dataModel.getDataById(id);
|
|
68
|
+
var connectType = linkData === null || linkData === void 0 ? void 0 : linkData.attributes["network_link.connect_type"];
|
|
54
69
|
|
|
70
|
+
if (connectType === "exit" && !exportLinkIdList.includes(id)) {
|
|
71
|
+
exportLinkIdList.push(id);
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
});
|
|
55
75
|
return {
|
|
56
|
-
layers: (0, _sortBy["default"])(layers,
|
|
57
|
-
groups: (0, _sortBy["default"])([].concat(layers, groups),
|
|
58
|
-
resources: resources
|
|
76
|
+
layers: (0, _sortBy["default"])(layers, "order"),
|
|
77
|
+
groups: (0, _sortBy["default"])([].concat(layers, groups), "order"),
|
|
78
|
+
resources: resources,
|
|
79
|
+
exportLinkIdList: exportLinkIdList // 出口链路id列表
|
|
80
|
+
|
|
59
81
|
};
|
|
60
82
|
}
|
|
61
83
|
|
|
62
84
|
function getGroupConfigByElement(groupElement) {
|
|
63
85
|
return {
|
|
64
86
|
id: groupElement.getTag(),
|
|
65
|
-
tag: groupElement.a(
|
|
66
|
-
name: groupElement.a(
|
|
67
|
-
order: groupElement.a(
|
|
87
|
+
tag: groupElement.a("tag"),
|
|
88
|
+
name: groupElement.a("name"),
|
|
89
|
+
order: groupElement.a("order"),
|
|
68
90
|
resources: {
|
|
69
91
|
"static": (0, _htElementUtils.getGroupChildrenNodes)(groupElement).filter(function (node) {
|
|
70
92
|
return !!node.getTag();
|
package/lib/utils/topoData.js
CHANGED
|
@@ -310,7 +310,7 @@ function buildTopoGraphData() {// TODO 构造拓扑图数据移到这里
|
|
|
310
310
|
}
|
|
311
311
|
|
|
312
312
|
function buildGlobal(_ref2) {
|
|
313
|
-
var _result$config, _engine$viewProps, _result$global2, _engine$options$viewe, _engine$options$edito, _engine$options$edito2;
|
|
313
|
+
var _result$config, _engine$viewProps, _result$global2, _result$customGlobal, _result$customGlobal2, _engine$options$viewe, _engine$options$edito, _engine$options$edito2;
|
|
314
314
|
|
|
315
315
|
var result = _ref2.data,
|
|
316
316
|
permission = _ref2.permission,
|
|
@@ -337,14 +337,14 @@ function buildGlobal(_ref2) {
|
|
|
337
337
|
};
|
|
338
338
|
}
|
|
339
339
|
|
|
340
|
-
return
|
|
340
|
+
return {
|
|
341
341
|
// 背景图
|
|
342
342
|
backgroundImgUrl: (_engine$viewProps = engine.viewProps) !== null && _engine$viewProps !== void 0 && _engine$viewProps.hideBackground ? null : (0, _backgroundUtil.getBackgroundImageUrl)(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.background),
|
|
343
343
|
control: (0, _extends2["default"])({
|
|
344
344
|
editable: _topoPermissionUtil["default"].isEditable(permission),
|
|
345
345
|
// 是否可编辑----控制[编辑]按钮
|
|
346
346
|
moveable: true
|
|
347
|
-
}, (result === null || result === void 0 ? void 0 : (_result$global2 = result.global) === null || _result$global2 === void 0 ? void 0 : _result$global2.control) || {}),
|
|
347
|
+
}, (result === null || result === void 0 ? void 0 : (_result$global2 = result.global) === null || _result$global2 === void 0 ? void 0 : _result$global2.control) || {}, (result === null || result === void 0 ? void 0 : (_result$customGlobal = result.customGlobal) === null || _result$customGlobal === void 0 ? void 0 : _result$customGlobal.control) || {}),
|
|
348
348
|
topoDisplayConfig: (0, _extends2["default"])({
|
|
349
349
|
// alarmSwitch: (result.global || {}).alarmSwitch ?? true,
|
|
350
350
|
showLog: false,
|
|
@@ -357,9 +357,8 @@ function buildGlobal(_ref2) {
|
|
|
357
357
|
// 是否显示链路名称
|
|
358
358
|
nodeLabelStyle: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nodeLabelStyle,
|
|
359
359
|
edgeFlow: edgeFlow
|
|
360
|
-
}, (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.topoDisplayConfig) || {}),
|
|
361
|
-
linkTo: linkTo
|
|
362
|
-
}, result.global || {}, {
|
|
360
|
+
}, (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.topoDisplayConfig) || {}, (result === null || result === void 0 ? void 0 : (_result$customGlobal2 = result.customGlobal) === null || _result$customGlobal2 === void 0 ? void 0 : _result$customGlobal2.topoDisplayConfig) || {}),
|
|
361
|
+
linkTo: linkTo,
|
|
363
362
|
viewMode: {
|
|
364
363
|
// 右键菜单
|
|
365
364
|
contextMenu: (0, _mergeContextmenu["default"])((0, _buildContextmenu["default"])(engine), (_engine$options$viewe = engine.options.viewer) === null || _engine$options$viewe === void 0 ? void 0 : _engine$options$viewe.contextmenu, engine)
|
|
@@ -372,7 +371,7 @@ function buildGlobal(_ref2) {
|
|
|
372
371
|
icons: (0, _icon.getEditorIcons)(engine),
|
|
373
372
|
// 获取默认节点图标,可选参数。如果无返回值则继续使用内部默认
|
|
374
373
|
getDefaultNodeIcon: engine.options.getDefaultNodeIcon
|
|
375
|
-
}
|
|
374
|
+
};
|
|
376
375
|
}
|
|
377
376
|
/**
|
|
378
377
|
* 将从后端接收的数据转化为topo组件中需要的数据
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@riil-frontend/component-topology",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.3.0",
|
|
4
4
|
"description": "拓扑",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"start": "build-scripts start",
|
|
@@ -68,7 +68,7 @@
|
|
|
68
68
|
"@riil-frontend/component-table-filter-tags": "latest",
|
|
69
69
|
"@riil-frontend/component-table-layout": "^2.0.2",
|
|
70
70
|
"@riil-frontend/component-topology-common": "^1.0.9",
|
|
71
|
-
"@riil-frontend/component-topology-graph": "^2.
|
|
71
|
+
"@riil-frontend/component-topology-graph": "^2.6.0",
|
|
72
72
|
"@riil-frontend/css": "^2.0.2",
|
|
73
73
|
"@riil-frontend/hooks": "latest",
|
|
74
74
|
"@riil-frontend/next-collapse": "^1.0.1-a.0",
|
|
@@ -110,6 +110,6 @@
|
|
|
110
110
|
"access": "public"
|
|
111
111
|
},
|
|
112
112
|
"license": "MIT",
|
|
113
|
-
"homepage": "https://unpkg.com/@riil-frontend/component-topology@3.
|
|
113
|
+
"homepage": "https://unpkg.com/@riil-frontend/component-topology@3.3.0/build/index.html",
|
|
114
114
|
"gitHead": "2da19ffccbb7ca60a8acf396e39f542c68bb33f5"
|
|
115
115
|
}
|
package/CHANGELOG.md
DELETED
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
## 3.1.11 2022-4-20 10:55:08
|
|
2
|
-
|
|
3
|
-
- 支持移除概览功能参数
|
|
4
|
-
|
|
5
|
-
## 3.1.10 2022-4-19 11:20:01
|
|
6
|
-
|
|
7
|
-
- 支持不显示区域添加资源按钮
|
|
8
|
-
- fix NEWITOM-16174【拓扑】上传自定义图片后,点击图片的属性面板,显示图片中显示的自定义图片显示顺序与上传后顺序不一致
|
|
9
|
-
## 3.1.8
|
|
10
|
-
|
|
11
|
-
- 支持自定义链路概览基本信息
|
|
12
|
-
- 编辑模式节点属性面板设置支持不显示图标设置
|
|
13
|
-
|
|
14
|
-
## v2.1.8
|
|
15
|
-
|
|
16
|
-
- 支持自定义分层添加资源组件
|
|
17
|
-
- 支持添加节点、连线接口 `addElements(data)`
|
|
18
|
-
|
|
19
|
-
## v2.1.3
|
|
20
|
-
|
|
21
|
-
- 支持自定义图标
|
|
22
|
-
|
|
23
|
-
## v2.0.1
|
|
24
|
-
|
|
25
|
-
新增功能
|
|
26
|
-
- 拓扑图全量更新数据接口,更新时保留元素样式
|
|
27
|
-
- 编辑模式右键菜单
|
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
-
import { iconFactory } from '@riil-frontend/component-topology-graph';
|
|
3
|
-
/**
|
|
4
|
-
* 资源面板图片-默认节点图标
|
|
5
|
-
*
|
|
6
|
-
* @type {(*|{url: *})[]}
|
|
7
|
-
*/
|
|
8
|
-
|
|
9
|
-
export var DEFAULT_NODE_ICONS = [{
|
|
10
|
-
id: 'ciType.switch',
|
|
11
|
-
name: '交换机'
|
|
12
|
-
}, {
|
|
13
|
-
id: 'system.coreswitch',
|
|
14
|
-
name: '核心交换机'
|
|
15
|
-
}, {
|
|
16
|
-
id: 'ciType.router',
|
|
17
|
-
name: '路由器',
|
|
18
|
-
ciType: 'network.router'
|
|
19
|
-
}, {
|
|
20
|
-
id: 'system.db',
|
|
21
|
-
name: '数据库'
|
|
22
|
-
}, {
|
|
23
|
-
id: 'system.dc',
|
|
24
|
-
name: '数据中心'
|
|
25
|
-
}, {
|
|
26
|
-
id: 'system.firewall',
|
|
27
|
-
name: '防火墙'
|
|
28
|
-
}, {
|
|
29
|
-
id: 'system.server',
|
|
30
|
-
name: '服务器'
|
|
31
|
-
}, {
|
|
32
|
-
id: 'system.cloud',
|
|
33
|
-
name: '云'
|
|
34
|
-
}, {
|
|
35
|
-
id: 'system.building',
|
|
36
|
-
name: '楼宇'
|
|
37
|
-
}, {
|
|
38
|
-
id: 'system.internet',
|
|
39
|
-
name: '互联网'
|
|
40
|
-
}].map(function (item) {
|
|
41
|
-
return _extends({}, item, {
|
|
42
|
-
url: iconFactory.getIconImageUrl(item.id)
|
|
43
|
-
});
|
|
44
|
-
});
|