@riil-frontend/component-topology 9.0.0-a.10 → 9.0.0-a.12

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.
Files changed (50) hide show
  1. package/build/1.js +2 -2
  2. package/build/2.js +1 -1
  3. package/build/index.css +1 -1
  4. package/build/index.js +17 -17
  5. package/es/components/VerticalIconTab/VerticalIconTab.module.scss +11 -5
  6. package/es/core/editor/components/BackgroundView/index.module.scss +3 -0
  7. package/es/core/editor/components/Sidebar/Sidebar.module.scss +7 -7
  8. package/es/core/editor/components/Sidebar/views/CanvasPanel/CanvasPanel.module.scss +1 -0
  9. package/es/core/editor/components/Sidebar/views/ComponentPanel.js +1 -1
  10. package/es/core/editor/components/Sidebar/views/ImagePanel/ImagePanel.js +2 -1
  11. package/es/core/editor/components/Sidebar/views/LinkPanel.js +1 -1
  12. package/es/core/editor/components/settings/core/updateElementProperty.js +6 -1
  13. package/es/core/editor/components/settings/propertyViews/node/data/BindIpInput.js +61 -0
  14. package/es/core/editor/components/settings/propertyViews/node/data/Data.js +27 -8
  15. package/es/core/hooks/useTopoEdit.js +133 -16
  16. package/es/core/models/TopoApp.js +1 -1
  17. package/es/core/models/utils/linkUtils.js +18 -0
  18. package/es/core/store/models/topoConfig.js +36 -7
  19. package/es/core/test/Test.js +52 -0
  20. package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/ResourceOverview.js +7 -78
  21. package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/hooks/useMetricPolling.js +27 -37
  22. package/es/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/services/index.js +57 -1
  23. package/es/networkTopo/services/link.js +1 -1
  24. package/es/networkTopo/services/topo/basic.js +4 -3
  25. package/es/networkTopo/services/topo/networkLink.js +45 -3
  26. package/es/networkTopo/utils/exitLinkUtil.js +110 -0
  27. package/es/utils/htElementUtils.js +43 -21
  28. package/lib/components/VerticalIconTab/VerticalIconTab.module.scss +11 -5
  29. package/lib/core/editor/components/BackgroundView/index.module.scss +3 -0
  30. package/lib/core/editor/components/Sidebar/Sidebar.module.scss +7 -7
  31. package/lib/core/editor/components/Sidebar/views/CanvasPanel/CanvasPanel.module.scss +1 -0
  32. package/lib/core/editor/components/Sidebar/views/ComponentPanel.js +1 -1
  33. package/lib/core/editor/components/Sidebar/views/ImagePanel/ImagePanel.js +2 -1
  34. package/lib/core/editor/components/Sidebar/views/LinkPanel.js +1 -1
  35. package/lib/core/editor/components/settings/core/updateElementProperty.js +6 -1
  36. package/lib/core/editor/components/settings/propertyViews/node/data/BindIpInput.js +74 -0
  37. package/lib/core/editor/components/settings/propertyViews/node/data/Data.js +28 -8
  38. package/lib/core/hooks/useTopoEdit.js +133 -15
  39. package/lib/core/models/TopoApp.js +1 -1
  40. package/lib/core/models/utils/linkUtils.js +21 -1
  41. package/lib/core/store/models/topoConfig.js +37 -7
  42. package/lib/core/test/Test.js +52 -0
  43. package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/ResourceOverview.js +6 -78
  44. package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/hooks/useMetricPolling.js +27 -36
  45. package/lib/core/viewer/components/plugins/ResourceDetail/components/ResourceOverview/components/LinkTopo/services/index.js +58 -1
  46. package/lib/networkTopo/services/topo/basic.js +5 -3
  47. package/lib/networkTopo/services/topo/networkLink.js +45 -3
  48. package/lib/networkTopo/utils/exitLinkUtil.js +115 -0
  49. package/lib/utils/htElementUtils.js +45 -21
  50. package/package.json +2 -2
@@ -3,8 +3,8 @@
3
3
 
4
4
  .tabs {
5
5
  height: 100%;
6
-
7
- }
6
+ display: flex;
7
+ }
8
8
 
9
9
  // 导航
10
10
  .nav {
@@ -49,17 +49,23 @@
49
49
 
50
50
  // 标签页内容区
51
51
  .content {
52
- width: 260px;
52
+ // width: 260px;
53
53
  height: 100%;
54
54
  border-left: none !important;
55
- border-right: 1px solid var(--tab-wrapped-border-line-color);
56
55
  transition: width .1s linear;
56
+ overflow: initial !important;
57
57
 
58
58
  :global {
59
59
  .#{$css-prefix}tabs-tabpane {
60
- width: 100%;
60
+ position: absolute;
61
+ left: 0;
62
+ top: 0;
63
+ z-index: 1;
64
+ // width: 250px;
61
65
  height: 100%;
62
66
  overflow: auto;
67
+ background: #FFF;
68
+ border-right: 1px solid var(--tab-wrapped-border-line-color);
63
69
  }
64
70
  }
65
71
 
@@ -1,8 +1,11 @@
1
1
  @import "~@alifd/next/variables.scss";
2
2
 
3
3
  .background-view {
4
+ width: 260px;
4
5
  padding: 16px;
5
6
  background: #fff;
7
+ height: 100%;
8
+ overflow: auto;
6
9
  .option {
7
10
  text-align: right;
8
11
  button {
@@ -1,19 +1,19 @@
1
1
  .sidebar {
2
2
  // border-right: 1px solid #E6E7EB;
3
3
  position: relative;
4
- width: 60px;
4
+ // width: 60px;
5
5
 
6
6
  .tabsContainer {
7
- position: absolute;
8
- width: 60px;
7
+ // position: absolute;
8
+ // left: 0;
9
+ // top: 0;
10
+ // z-index: 1;
11
+ // width: 60px;
9
12
  height: 100%;
10
- left: 0;
11
- top: 0;
12
- z-index: 1;
13
13
  background: #FFF;
14
14
 
15
15
  &.expanded {
16
- width: 320px;
16
+ // width: 320px;
17
17
  }
18
18
  }
19
19
  }
@@ -1,6 +1,7 @@
1
1
  @import "~@alifd/next/variables.scss";
2
2
 
3
3
  .canvasToggle {
4
+ width: 260px;
4
5
  display: flex;
5
6
  flex-wrap: wrap;
6
7
  .canvas {
@@ -34,7 +34,7 @@ export default function ComponentPanel(props) {
34
34
  return /*#__PURE__*/React.createElement("div", {
35
35
  ref: divRef,
36
36
  style: {
37
- width: '100%',
37
+ width: '260px',
38
38
  height: '100%'
39
39
  }
40
40
  });
@@ -24,7 +24,8 @@ export default function ImagePanel(props) {
24
24
  accordion: true,
25
25
  defaultExpandedKeys: ['资源图片'],
26
26
  style: {
27
- border: 'none'
27
+ border: 'none',
28
+ minWidth: '300px'
28
29
  },
29
30
  fullheight: true,
30
31
  noContentPadding: true
@@ -34,7 +34,7 @@ function LinkPanel(props) {
34
34
  return /*#__PURE__*/React.createElement("div", {
35
35
  ref: divRef,
36
36
  style: {
37
- width: '100%',
37
+ width: '260px',
38
38
  height: '100%'
39
39
  }
40
40
  });
@@ -1,6 +1,11 @@
1
1
  export default function updateElementProperty(topo, name, value) {
2
2
  // const element = topo.getDataModel().getDataById(selection[0].id);
3
- var element = topo.getSelectionModel().getFirstData(); // console.info("updateElementProperty",topo.getSelectionModel().getSelection(), { selection, element, name, value });
3
+ var element = topo.getSelectionModel().getFirstData();
4
+ console.info("updateElementProperty", topo.getSelectionModel().getSelection(), {
5
+ element: element,
6
+ name: name,
7
+ value: value
8
+ });
4
9
 
5
10
  if (name.startsWith('attrObject.')) {
6
11
  element.setAttr(name.replace('attrObject.', ''), value);
@@ -0,0 +1,61 @@
1
+ import _Button from "@alifd/next/es/button";
2
+ import _Input from "@alifd/next/es/input";
3
+ import React, { useState } from "react";
4
+
5
+ /**
6
+ * @return {React.ReactNode | null}
7
+ */
8
+ export default function BindIpInput(props) {
9
+ var _node$attrObjectIpv;
10
+
11
+ var nodeElement = props.nodeElement,
12
+ topo = props.topo,
13
+ topoEditApi = props.topoEditApi,
14
+ node = props.node,
15
+ onChange = props.onChange,
16
+ value = props.value; // const currentResId = node.tag;
17
+
18
+ console.log("nodeElement, topo, topoEditApi, node", nodeElement, topo, topoEditApi, node, value);
19
+
20
+ var _useState = useState(''),
21
+ error = _useState[0],
22
+ setError = _useState[1];
23
+
24
+ var _useState2 = useState((_node$attrObjectIpv = node["attrObject.ipv4"]) !== null && _node$attrObjectIpv !== void 0 ? _node$attrObjectIpv : ""),
25
+ txtValue = _useState2[0],
26
+ setTxtValue = _useState2[1];
27
+
28
+ var saveIp = function saveIp(v) {
29
+ console.log("saveIp", txtValue);
30
+ var rex = /^((25[0-5]|2[0-4]\d|((1\d{2})|([1-9]?\d)))\.){3}(25[0-5]|2[0-4]\d|((1\d{2})|([1-9]?\d)))$/;
31
+ var reg = txtValue.match(rex);
32
+
33
+ if (reg === null) {
34
+ setError('error');
35
+ } else {
36
+ setError('');
37
+ onChange(txtValue);
38
+ topoEditApi.relateNodeIp(txtValue, nodeElement);
39
+ }
40
+ };
41
+
42
+ return /*#__PURE__*/React.createElement("div", {
43
+ style: {
44
+ display: "flex"
45
+ }
46
+ }, /*#__PURE__*/React.createElement(_Input, {
47
+ placeholder: "\u8BF7\u8F93\u5165Ip\u5730\u5740",
48
+ name: "attrObject.ipv4",
49
+ state: error,
50
+ value: txtValue,
51
+ maxLength: 128,
52
+ onChange: setTxtValue
53
+ }), /*#__PURE__*/React.createElement(_Button, {
54
+ type: "primary",
55
+ text: true,
56
+ onClick: saveIp,
57
+ style: {
58
+ marginLeft: 10
59
+ }
60
+ }, "\u4FDD\u5B58"));
61
+ }
@@ -9,19 +9,21 @@ import React, { useEffect } from "react";
9
9
  import textStyles from "../../../../../../common/text.module.scss";
10
10
  import NodeRelateResourceButton from "./NodeRelateResourceButton";
11
11
  import PlatformDisplay from "./PlatformDisplay";
12
+ import BindIpInput from "./BindIpInput";
12
13
  var Option = _Select.Option;
13
14
  var CollapsePanel = _Collapse.Panel;
14
15
 
15
16
  function parseValues(values) {
16
17
  return _extends({}, values, {
17
18
  "attrObject.customName": values["attrObject.customName"] || values["attrObject.name"],
18
- "attrObject.bindTopo": values["attrObject.bindTopo"] || "" // 解决切换节点时关联拓扑选项未重置
19
-
19
+ "attrObject.bindTopo": values["attrObject.bindTopo"] || "",
20
+ // 解决切换节点时关联拓扑选项未重置
21
+ "attrObject.ipv4": values["attrObject.ipv4"] || ""
20
22
  });
21
23
  }
22
24
 
23
25
  function getBindType(values) {
24
- if (values.tag) {
26
+ if (values.tag && !values.tag.startsWith('Ip_')) {
25
27
  return "resource";
26
28
  }
27
29
 
@@ -40,6 +42,7 @@ export default function Data(props) {
40
42
  _onChange = props.onChange,
41
43
  editorProps = props.editorProps;
42
44
  var bindType = getBindType(values);
45
+ console.log("node, values", node, values);
43
46
 
44
47
  var field = _Field.useField({
45
48
  autoUnmount: false,
@@ -107,7 +110,7 @@ export default function Data(props) {
107
110
  }, /*#__PURE__*/React.createElement(_Form, {
108
111
  field: field,
109
112
  labelAlign: "top"
110
- }, !values.tag && /*#__PURE__*/React.createElement(_Form.Item, {
113
+ }, (!values.tag || bindType === "ip") && /*#__PURE__*/React.createElement(_Form.Item, {
111
114
  label: "\u5173\u8054\u7C7B\u578B"
112
115
  }, /*#__PURE__*/React.createElement(_Select, {
113
116
  name: "bindType",
@@ -121,7 +124,9 @@ export default function Data(props) {
121
124
  value: "none"
122
125
  }, "\u672A\u5173\u8054"), /*#__PURE__*/React.createElement(Option, {
123
126
  value: "resource"
124
- }, "\u5173\u8054\u8D44\u6E90"), RelateTopoTree && /*#__PURE__*/React.createElement(Option, {
127
+ }, "\u5173\u8054\u8D44\u6E90"), /*#__PURE__*/React.createElement(Option, {
128
+ value: "ip"
129
+ }, "\u5173\u8054IP"), RelateTopoTree && /*#__PURE__*/React.createElement(Option, {
125
130
  value: "topo"
126
131
  }, "\u5173\u8054\u62D3\u6251"))), bindType === "resource" && /*#__PURE__*/React.createElement(_Form.Item, {
127
132
  label: "\u5173\u8054\u8D44\u6E90"
@@ -135,7 +140,7 @@ export default function Data(props) {
135
140
  flex: 1,
136
141
  paddingRight: 16,
137
142
  color: "#4D6277",
138
- lineHeight: '20px'
143
+ lineHeight: "20px"
139
144
  },
140
145
  title: values.tag ? values.name : null
141
146
  }, values.tag ? values.name : "—"), /*#__PURE__*/React.createElement(NodeRelateResourceButton, {
@@ -144,13 +149,27 @@ export default function Data(props) {
144
149
  topo: topo,
145
150
  topoEditApi: topoEditApi,
146
151
  nodeBindResourceDrawerComponent: editorProps.nodeBindResourceDrawerComponent
147
- }))), bindType === "topo" && RelateTopoTree && /*#__PURE__*/React.createElement(_Form.Item, {
152
+ }))), bindType === "ip" && /*#__PURE__*/React.createElement(_Form.Item, {
153
+ label: "\u5173\u8054IP" // style={{ display: "flex" }}
154
+ ,
155
+ pattern: /^((25[0-5]|2[0-4]\d|((1\d{2})|([1-9]?\d)))\.){3}(25[0-5]|2[0-4]\d|((1\d{2})|([1-9]?\d)))$/,
156
+ patternTrigger: "onBlur",
157
+ patternMessage: "IP\u5730\u5740\u683C\u5F0F\u4E0D\u6B63\u786E"
158
+ }, /*#__PURE__*/React.createElement(BindIpInput, {
159
+ nodeElement: node,
160
+ node: values,
161
+ topo: topo,
162
+ topoEditApi: topoEditApi,
163
+ placeholder: "\u8BF7\u8F93\u5165",
164
+ name: "attrObject.ipv4",
165
+ maxLength: 128
166
+ })), bindType === "topo" && RelateTopoTree && /*#__PURE__*/React.createElement(_Form.Item, {
148
167
  label: "\u5173\u8054\u62D3\u6251"
149
168
  }, /*#__PURE__*/React.createElement(RelateTopoTree, {
150
169
  name: "attrObject.bindTopo",
151
170
  topo: topo,
152
171
  onChange: handleBindTopoChange
153
- })), (editorProps === null || editorProps === void 0 ? void 0 : editorProps.topoType) === 'cmpTopo' && node.getTag() && /*#__PURE__*/React.createElement(_Form.Item, {
172
+ })), (editorProps === null || editorProps === void 0 ? void 0 : editorProps.topoType) === "cmpTopo" && node.getTag() && /*#__PURE__*/React.createElement(_Form.Item, {
154
173
  label: "\u6240\u5C5E\u5E73\u53F0"
155
174
  }, /*#__PURE__*/React.createElement(PlatformDisplay, props)))));
156
175
  }
@@ -8,12 +8,13 @@ import rlog from "@riil-frontend/component-topology-utils/es/rlog";
8
8
  import { TopoEvent } from "@riil-frontend/component-topology-graph";
9
9
  import { TPL_BLANK, TPL_TREE } from "../../utils/template";
10
10
  import topoPermissonUtil from "../../utils/topoPermissionUtil";
11
- import { getElements, getGroupElementByTag, isEdge, isExistedElement, isGroup, isLayer, isNode } from "../../utils/htElementUtils";
11
+ import { getElements, getGroupElementByTag, isEdge, isExistedElement, isGroup, isLayer, isNode, getNodes } from "../../utils/htElementUtils";
12
12
  import useResourceConfig from "./useResourceConfig";
13
13
  import useGroupAddResource from "./useGroupAddResource";
14
14
  import { findGroupChildren } from "../../utils/topoData";
15
15
  import { getGroupChildrenResourceElements } from "../../utils/htElementDataUtil";
16
16
  import { isClusterHtElement, isClusterMemberHtElement } from "../../utils/clusterUtil";
17
+ import { mergeExportLinkData } from "../models/utils/linkUtils";
17
18
 
18
19
  var useTopoEdit = function useTopoEdit(params) {
19
20
  var topo = params.topo,
@@ -315,7 +316,7 @@ var useTopoEdit = function useTopoEdit(params) {
315
316
 
316
317
  edges.map(function (edge) {
317
318
  if (edge.a("dtype") === "link" && exportLinkIdList.indexOf(edge.getTag()) >= 0) {
318
- // exLink.push(edge);
319
+ // exLink.push(edge);
319
320
  topo.getGraphView().dm().remove(edge);
320
321
  exportLinkIdList.splice(config.exportLinkIdList.indexOf(edge.getTag()), 1);
321
322
  }
@@ -378,8 +379,8 @@ var useTopoEdit = function useTopoEdit(params) {
378
379
  };
379
380
  /**
380
381
  * 获得未存在的连线元素
381
- * @param {*} elements
382
- * @returns
382
+ * @param {*} elements
383
+ * @returns
383
384
  */
384
385
 
385
386
 
@@ -392,8 +393,8 @@ var useTopoEdit = function useTopoEdit(params) {
392
393
  }
393
394
  /**
394
395
  * 获得未存在的元素
395
- * @param {Array} elements
396
- * @returns
396
+ * @param {Array} elements
397
+ * @returns
397
398
  */
398
399
 
399
400
 
@@ -569,7 +570,7 @@ var useTopoEdit = function useTopoEdit(params) {
569
570
  elements = _yield$editDispatcher4.elements;
570
571
  // 2022-11-10 修复 添加资源后分层重新布局问题,仅布局新增资源。替换api topo.updateElements(data)
571
572
  newElements = findUNExistedElements(elements);
572
- rlog.debug('添加分层资源', {
573
+ rlog.debug("添加分层资源", {
573
574
  layer: group,
574
575
  newElements: newElements
575
576
  });
@@ -642,8 +643,8 @@ var useTopoEdit = function useTopoEdit(params) {
642
643
  }
643
644
  /**
644
645
  * 未选中元素添加资源
645
- *
646
- * @param {*} data
646
+ *
647
+ * @param {*} data
647
648
  */
648
649
 
649
650
 
@@ -800,7 +801,7 @@ var useTopoEdit = function useTopoEdit(params) {
800
801
  newLinkElements = findUNExistedLinkElements(elements);
801
802
  createElementsData = null;
802
803
 
803
- if (newData.type === 'group') {
804
+ if (newData.type === "group") {
804
805
  groupChildren = findGroupChildren(elements, newData);
805
806
  newGroupChildren = [];
806
807
  existedGroupChildren = [];
@@ -817,10 +818,10 @@ var useTopoEdit = function useTopoEdit(params) {
817
818
  groups: [newData],
818
819
  nodes: newGroupChildren,
819
820
  links: newLinkElements.filter(function (item) {
820
- return item.type === 'link';
821
+ return item.type === "link";
821
822
  }),
822
823
  linkGroups: newLinkElements.filter(function (item) {
823
- return item.type === 'linkGroup';
824
+ return item.type === "linkGroup";
824
825
  })
825
826
  };
826
827
  htTopo.createElements(createElementsData); // 切换前图上如果存在集群内的节点,切换节点为集群后,移到集群内
@@ -835,16 +836,16 @@ var useTopoEdit = function useTopoEdit(params) {
835
836
  groups: [],
836
837
  nodes: [newData],
837
838
  links: newLinkElements.filter(function (item) {
838
- return item.type === 'link';
839
+ return item.type === "link";
839
840
  }),
840
841
  linkGroups: newLinkElements.filter(function (item) {
841
- return item.type === 'linkGroup';
842
+ return item.type === "linkGroup";
842
843
  })
843
844
  };
844
845
  htTopo.createElements(createElementsData);
845
846
  }
846
847
 
847
- rlog.debug('批量创建元素', createElementsData); // 恢复图标、大小、位置
848
+ rlog.debug("批量创建元素", createElementsData); // 恢复图标、大小、位置
848
849
 
849
850
  newElement = dm.getDataByTag(newData.id);
850
851
 
@@ -960,6 +961,117 @@ var useTopoEdit = function useTopoEdit(params) {
960
961
  return _ref8.apply(this, arguments);
961
962
  };
962
963
  }();
964
+ /**
965
+ * 关联IP的图片节点
966
+ */
967
+
968
+
969
+ function relateNodeIp(_x15, _x16) {
970
+ return _relateNodeIp.apply(this, arguments);
971
+ }
972
+
973
+ function _relateNodeIp() {
974
+ _relateNodeIp = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee16(txtValue, nodeElement) {
975
+ var dm, htTopo, elements, _yield$editDispatcher5, elementDatas, isUnique, ipTxt, ids, ip, re, config, linksData, createElementsData;
976
+
977
+ return _regeneratorRuntime.wrap(function _callee16$(_context16) {
978
+ while (1) {
979
+ switch (_context16.prev = _context16.next) {
980
+ case 0:
981
+ // console.log("bindIPtoNode", data);
982
+ // 根据配置查询拓扑数据
983
+ dm = topo.getDataModel();
984
+ htTopo = topo.getHtTopo();
985
+ elements = getNodes(dm);
986
+ _context16.next = 5;
987
+ return editDispatchers.fetchDataByConfig();
988
+
989
+ case 5:
990
+ _yield$editDispatcher5 = _context16.sent;
991
+ elementDatas = _yield$editDispatcher5.elementDatas;
992
+ console.log("bindIPtoNode", txtValue, nodeElement, elements);
993
+ console.log("elementDatas", elementDatas);
994
+ isUnique = true;
995
+ ipTxt = txtValue;
996
+ ids = []; // 执行唯一性验证
997
+
998
+ elements.map(function (element) {
999
+ // if (node.getId() !== element.getId()) {
1000
+ // }
1001
+ if (element.getTag()) {
1002
+ ids.push(element.getTag());
1003
+ }
1004
+ });
1005
+ ip = {
1006
+ id: "ip_1.1.1.1",
1007
+ name: "1.1.1.1",
1008
+ customName: null,
1009
+ // 'groupId': null,
1010
+ // 'groupTag': null,
1011
+ ipAddress: "1.1.1.1",
1012
+ // 'attributes': [],
1013
+ // 'metrics': [],
1014
+ type: "node" // 'dtype': 'device'
1015
+
1016
+ }; // 获取关联链路
1017
+
1018
+ if (!isUnique) {
1019
+ _context16.next = 27;
1020
+ break;
1021
+ }
1022
+
1023
+ nodeElement.a(ip);
1024
+ nodeElement.setName(txtValue);
1025
+ nodeElement.a("name", txtValue);
1026
+ nodeElement.a("customName", null);
1027
+ nodeElement.setTag("ip_" + txtValue);
1028
+ _context16.next = 22;
1029
+ return editDispatchers.queryAllLinkByIp({
1030
+ ids: ids,
1031
+ ip: txtValue
1032
+ });
1033
+
1034
+ case 22:
1035
+ re = _context16.sent;
1036
+ console.log("queryAllLinkByIp", re);
1037
+ config = resourceConfig.getConfig();
1038
+ console.log("resourceConfig.getConfig", config);
1039
+
1040
+ if (re && re.length > 0) {
1041
+ linksData = [];
1042
+ re.map(function (link) {
1043
+ var sourceId = link.attributes["network_link.source_device_id"];
1044
+ var source = dm.getDataByTag(sourceId);
1045
+ var target = nodeElement; // console.log("source, nodeElement, link", source, target, link);
1046
+
1047
+ if (source && target) {
1048
+ var linkData = mergeExportLinkData({
1049
+ source: source,
1050
+ target: target,
1051
+ link: link
1052
+ });
1053
+ console.log("linkData", linkData);
1054
+ linksData.push(linkData); // htTopo.createEdge(source, target, link);
1055
+ }
1056
+ });
1057
+ createElementsData = {
1058
+ groups: [],
1059
+ nodes: [],
1060
+ links: [].concat(linksData),
1061
+ linkGroups: []
1062
+ };
1063
+ htTopo.createElements(createElementsData); // htTopo.addElements({ lines: [...re] });
1064
+ }
1065
+
1066
+ case 27:
1067
+ case "end":
1068
+ return _context16.stop();
1069
+ }
1070
+ }
1071
+ }, _callee16);
1072
+ }));
1073
+ return _relateNodeIp.apply(this, arguments);
1074
+ }
963
1075
 
964
1076
  var onEvent = function onEvent(e) {
965
1077
  var map = {};
@@ -977,7 +1089,7 @@ var useTopoEdit = function useTopoEdit(params) {
977
1089
  */
978
1090
 
979
1091
  var setViewMouseMode = function setViewMouseMode(mode) {
980
- rlog.debug('设置视图鼠标模式', mode);
1092
+ rlog.debug("设置视图鼠标模式", mode);
981
1093
  topo.getHtTopo().setViewMouseMode(mode);
982
1094
  topoEditDispatchers.update({
983
1095
  viewMouseMode: mode
@@ -1055,6 +1167,11 @@ var useTopoEdit = function useTopoEdit(params) {
1055
1167
  */
1056
1168
  onDeleteElement: onDeleteElement,
1057
1169
 
1170
+ /**
1171
+ * 绑定图片ip
1172
+ */
1173
+ relateNodeIp: relateNodeIp,
1174
+
1058
1175
  /**
1059
1176
  * 拓扑图保存回调
1060
1177
  */
@@ -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 "9.0.0-a.10" === 'string' ? "9.0.0-a.10" : null;
27
+ var version = typeof "9.0.0-a.12" === 'string' ? "9.0.0-a.12" : null;
28
28
  console.info("\u62D3\u6251\u7248\u672C: " + version);
29
29
  /**
30
30
  * 拓扑显示和编辑
@@ -188,4 +188,22 @@ export var showLinkByConfig = function showLinkByConfig(props) {
188
188
  }
189
189
  });
190
190
  }
191
+ };
192
+ export var mergeExportLinkData = function mergeExportLinkData(props) {
193
+ var source = props.source,
194
+ target = props.target,
195
+ link = props.link;
196
+ var attrObj = link.attributes;
197
+
198
+ var linkData = _extends({}, link, {
199
+ name: attrObj.name,
200
+ source: attrObj["network_link.source_device_id"],
201
+ target: attrObj.destination_type === 'ip' ? target.getTag() : attrObj["network_link.destination_device_id"],
202
+ operation: attrObj.operation,
203
+ interfaceSource: attrObj["source_id"],
204
+ interfaceTarget: attrObj["destination_id"],
205
+ ciType: link.typeCode
206
+ });
207
+
208
+ return linkData;
191
209
  };
@@ -13,6 +13,7 @@ import { removeFromArray } from "../../../utils/format";
13
13
  import { DEFAULT_GROUP } from "../../../utils/template";
14
14
  import { combTopoData, getCiTypes } from "../../../utils/topoData";
15
15
  import { saveTopo as _saveTopo, resToConditions, getLayoutId } from "../../../core/models/topoData";
16
+ import networkLinkServer from "../../../networkTopo/services/topo/networkLink";
16
17
  import { addLinkData, buildData as buildTopoData } from "../../../networkTopo/getTopoData";
17
18
 
18
19
  var newGroupWithUUID = function newGroupWithUUID(group) {
@@ -244,19 +245,20 @@ export default function (topoApp) {
244
245
  var _this2 = this;
245
246
 
246
247
  return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
247
- var editState, resources, _editState$groups, groups, _editState$exportLink, exportLinkIdList, query, data;
248
+ var editState, resources, _editState$groups, groups, _editState$exportLink, exportLinkIdList, _editState$ipNodes, ipNodes, query, data;
248
249
 
249
250
  return _regeneratorRuntime.wrap(function _callee2$(_context2) {
250
251
  while (1) {
251
252
  switch (_context2.prev = _context2.next) {
252
253
  case 0:
253
254
  editState = rootState.topoConfig;
254
- resources = editState.resources, _editState$groups = editState.groups, groups = _editState$groups === void 0 ? [] : _editState$groups, _editState$exportLink = editState.exportLinkIdList, exportLinkIdList = _editState$exportLink === void 0 ? [] : _editState$exportLink;
255
+ resources = editState.resources, _editState$groups = editState.groups, groups = _editState$groups === void 0 ? [] : _editState$groups, _editState$exportLink = editState.exportLinkIdList, exportLinkIdList = _editState$exportLink === void 0 ? [] : _editState$exportLink, _editState$ipNodes = editState.ipNodes, ipNodes = _editState$ipNodes === void 0 ? [] : _editState$ipNodes;
255
256
  query = {
256
257
  id: rootState.topoMod.topoId,
257
258
  resources: resources,
258
259
  groups: groups,
259
- exportLinkIdList: exportLinkIdList
260
+ exportLinkIdList: exportLinkIdList,
261
+ ipNodes: ipNodes
260
262
  };
261
263
  _context2.next = 5;
262
264
  return _this2.getTopoByConditions(query);
@@ -308,14 +310,14 @@ export default function (topoApp) {
308
310
  var _this4 = this;
309
311
 
310
312
  return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
311
- var topoId, resources, groups, exportLinkIdList, viewConditions, groupInfo, data, _yield$Promise$all, dataWithLinkDetail, _combTopoData, topoData, resAndMetrics, topoDataTrans;
313
+ var topoId, resources, groups, exportLinkIdList, ipNodes, viewConditions, groupInfo, data, _yield$Promise$all, dataWithLinkDetail, _combTopoData, topoData, resAndMetrics, topoDataTrans;
312
314
 
313
315
  return _regeneratorRuntime.wrap(function _callee4$(_context4) {
314
316
  while (1) {
315
317
  switch (_context4.prev = _context4.next) {
316
318
  case 0:
317
319
  // rlog.debug("getTopoByConditions--------", params);
318
- topoId = params.id, resources = params.resources, groups = params.groups, exportLinkIdList = params.exportLinkIdList;
320
+ topoId = params.id, resources = params.resources, groups = params.groups, exportLinkIdList = params.exportLinkIdList, ipNodes = params.ipNodes;
319
321
  viewConditions = resToConditions(resources);
320
322
  groupInfo = isAvailableArray(groups) && groups.map(function (group) {
321
323
  return _extends({}, group, {
@@ -325,7 +327,7 @@ export default function (topoApp) {
325
327
  }); // rlog.debug("getTopoByConditions--------", viewConditions, groupInfo);
326
328
 
327
329
  _context4.next = 5;
328
- return topoApp.serverApi.getTopoDataByResource(topoId, viewConditions, groupInfo, exportLinkIdList);
330
+ return topoApp.serverApi.getTopoDataByResource(topoId, viewConditions, groupInfo, exportLinkIdList, ipNodes);
329
331
 
330
332
  case 5:
331
333
  data = _context4.sent;
@@ -393,7 +395,7 @@ export default function (topoApp) {
393
395
  }].concat(displayConfig.saveHistories || [])
394
396
  }))
395
397
  };
396
- rlog.debug('saveGlobalConfig', config);
398
+ rlog.debug("saveGlobalConfig", config);
397
399
  _context5.next = 5;
398
400
  return topoApp.serverApi.saveTopoSettings(topoApp.id, config);
399
401
 
@@ -461,6 +463,33 @@ export default function (topoApp) {
461
463
  switchToViewMode: function switchToViewMode() {
462
464
  this.reset();
463
465
  dispatch.topoMod.switchToViewMode();
466
+ },
467
+ queryAllLinkByIp: function queryAllLinkByIp(data) {
468
+ return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee8() {
469
+ var _result$data;
470
+
471
+ var ids, ip, result;
472
+ return _regeneratorRuntime.wrap(function _callee8$(_context8) {
473
+ while (1) {
474
+ switch (_context8.prev = _context8.next) {
475
+ case 0:
476
+ ids = data.ids, ip = data.ip;
477
+ console.log("queryAllLinkByIp", ids, ip);
478
+ _context8.next = 4;
479
+ return networkLinkServer.queryLinksByIp(ids, ip);
480
+
481
+ case 4:
482
+ result = _context8.sent;
483
+ console.log("queryAllLinkByIp-result", result);
484
+ return _context8.abrupt("return", (_result$data = result === null || result === void 0 ? void 0 : result.data) !== null && _result$data !== void 0 ? _result$data : []);
485
+
486
+ case 7:
487
+ case "end":
488
+ return _context8.stop();
489
+ }
490
+ }
491
+ }, _callee8);
492
+ }))();
464
493
  }
465
494
  };
466
495
  }