@riil-frontend/component-topology 7.0.0-dev.10 → 7.0.0-dev.12

package/es/networkTopo/components/editor/propertyViews/edge/addLinkDrawer/AddLinkDrawer.js

@@ -1,630 +0,0 @@
-import _Drawer from "@alifd/next/es/drawer";
-import _Loading from "@alifd/next/es/loading";
-import _Message from "@alifd/next/es/message";
-import _extends from "@babel/runtime/helpers/extends";
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-import React, { useState, useEffect, useRef } from 'react';
-import _ from 'lodash';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
-import TopoCenterEvent from "../../../../../event";
-import EditLinkInfo from "./components/editLinkInfo";
-import styles from "./index.module.scss";
-import service from "./server";
-import { clone } from "../../../../../../utils/copyUtil";
-import { getInterfaceObject } from "../../../../../../core/models/utils/linkUtils";
-import { getEdgesBetweenNodes, getNodes, isGroup } from "../../../../../../utils/htElementUtils";
-import useAddLink from "./hooks/useAddLink";
-
-function AddLinkDrawer(props) {
-  var topo = props.topo,
-      lineData = props.lineData;
-  var store = topo.store;
-
-  var _topo$store$useModel = topo.store.useModel('topoMod'),
-      topoState = _topo$store$useModel[0],
-      topoDispatchers = _topo$store$useModel[1];
-
-  var _store$useModel = store.useModel('topoConfig'),
-      editState = _store$useModel[0],
-      editDispatchers = _store$useModel[1];
-
-  var addLinkIsOpen = editState.addLinkIsOpen,
-      currentLink = editState.currentLink;
-
-  var _useState = useState(),
-      link = _useState[0],
-      setLink = _useState[1];
-
-  var _useState2 = useState(true),
-      isAddMode = _useState2[0],
-      setIsAddMode = _useState2[1];
-
-  var _useState3 = useState(false),
-      loading = _useState3[0],
-      setLoading = _useState3[1];
-
-  var _useState4 = useState(false),
-      loadingFormData = _useState4[0],
-      setLoadingFormData = _useState4[1];
-
-  var _useState5 = useState(),
-      sourceIFDoc = _useState5[0],
-      setSourceIFDoc = _useState5[1];
-
-  var _useState6 = useState(),
-      targetIFDoc = _useState6[0],
-      setTargetIFDoc = _useState6[1]; // 保存后更新拓扑图状态
-
-
-  var linkNodesRef = useRef();
-
-  var _useAddLink = useAddLink({
-    topo: topo
-  }),
-      enterAddLinkMode = _useAddLink.enterAddLinkMode,
-      resetConnectableNodes = _useAddLink.resetConnectableNodes,
-      loadingConnectableNodes = _useAddLink.loadingConnectableNodes;
-
-  var getPortsById = /*#__PURE__*/function () {
-    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(id, currentLink) {
-      var result, links, ifTypes, ifDoc, usedPorts, portsDoc, ports;
-      return _regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              if (id) {
-                _context.next = 2;
-                break;
-              }
-
-              return _context.abrupt("return", {
-                ports: [],
-                portsDoc: {}
-              });
-
-            case 2:
-              _context.next = 4;
-              return service.getPortsById(id);
-
-            case 4:
-              result = _context.sent;
-              _context.next = 7;
-              return service.queryLinksByNodeId(id);
-
-            case 7:
-              links = _context.sent;
-              ifTypes = result.map(function (item) {
-                return item.type;
-              }); // console.log("端口类型列表", ifTypes);
-
-              _context.next = 11;
-              return getInterfaceObject(ifTypes);
-
-            case 11:
-              ifDoc = _context.sent;
-              // console.log("端口类型字典", ifDoc);
-              usedPorts = [];
-              links.data.map(function (link) {
-                // console.log("getPortsById-去重", links, id);
-                if (link.id !== (currentLink === null || currentLink === void 0 ? void 0 : currentLink.id)) {
-                  usedPorts.push(link.attributes.destination_id);
-                  usedPorts.push(link.attributes.source_id);
-                }
-              });
-              usedPorts = _.uniq(usedPorts); // rlog.debug("端口列表", result, links);
-              //const list = result[id];
-
-              portsDoc = {};
-              ports = result.map(function (item) {
-                var _ifDoc$item$type$disp, _ifDoc$item$type;
-
-                var obj = {
-                  value: item.id,
-                  label: item.name,
-                  type: item.type,
-                  typeName: (_ifDoc$item$type$disp = (_ifDoc$item$type = ifDoc[item.type]) === null || _ifDoc$item$type === void 0 ? void 0 : _ifDoc$item$type.displayName) !== null && _ifDoc$item$type$disp !== void 0 ? _ifDoc$item$type$disp : '',
-                  disabled: usedPorts.indexOf(item.id) >= 0,
-                  ratedBandwidth: parseInt(item.ratedBandwidth, 10)
-                };
-                portsDoc[item.id] = obj;
-                return obj;
-              }).filter(function (item) {
-                return !item.disabled;
-              });
-              return _context.abrupt("return", {
-                ports: ports,
-                portsDoc: portsDoc
-              });
-
-            case 18:
-            case "end":
-              return _context.stop();
-          }
-        }
-      }, _callee);
-    }));
-
-    return function getPortsById(_x, _x2) {
-      return _ref.apply(this, arguments);
-    };
-  }();
-  /**
-   * 连线第二个节点时的处理
-   * @param {*} e 
-   */
-
-
-  var handleSelectTargetNodeEvent = /*#__PURE__*/function () {
-    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(e) {
-      var sourcePorts, targetPorts, source, target;
-      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-        while (1) {
-          switch (_context2.prev = _context2.next) {
-            case 0:
-              resetConnectableNodes();
-              linkNodesRef.current = e;
-              rlog.debug('接到打开创建链路抽屉信息', e);
-              setIsAddMode(true);
-              setLoadingFormData(true);
-              _context2.prev = 5;
-              _context2.next = 8;
-              return getPortsById(e.source._attrObject.id);
-
-            case 8:
-              sourcePorts = _context2.sent;
-              _context2.next = 11;
-              return getPortsById(e.target._attrObject.id);
-
-            case 11:
-              targetPorts = _context2.sent;
-              setSourceIFDoc(sourcePorts.portsDoc);
-              setTargetIFDoc(targetPorts.portsDoc);
-              source = translationNode(e.source, sourcePorts);
-              target = translationNode(e.target, targetPorts);
-              editDispatchers.update({
-                addLinkIsOpen: true,
-                currentLink: null
-              });
-              setLink({
-                source: source,
-                target: target,
-                attributes: {
-                  display_name: '',
-                  name: '',
-                  source_id: '',
-                  source_type: '',
-                  'network_link.source_device_id': source.id,
-                  'network_link.source_device_ipv4': source.ipAddress,
-                  destination_id: '',
-                  destination_type: '',
-                  'network_link.destination_device_id': target.id,
-                  'network_link.destination_device_ipv4': target.ipAddress,
-                  'network_link.actual_bandwidth': null
-                }
-              });
-              _context2.next = 23;
-              break;
-
-            case 20:
-              _context2.prev = 20;
-              _context2.t0 = _context2["catch"](5);
-              rlog.error('出现异常', _context2.t0);
-
-            case 23:
-              setLoadingFormData(false);
-
-            case 24:
-            case "end":
-              return _context2.stop();
-          }
-        }
-      }, _callee2, null, [[5, 20]]);
-    }));
-
-    return function handleSelectTargetNodeEvent(_x3) {
-      return _ref2.apply(this, arguments);
-    };
-  }();
-
-  var handleSelectSourceNodeEvent = function handleSelectSourceNodeEvent(e) {
-    // rlog.debug("设置了起始节点", e);
-    topo.historyManager.setDisabled(true);
-    var enableNodes = getNodes(topo.getDataModel());
-    topo.view.topoClient.emitEvent('topo_link_set_connectable_nodes', enableNodes.filter(function (ele) {
-      return !(isGroup(ele) && !ele.a('ciType'));
-    }));
-    topo.historyManager.setDisabled(false);
-  };
-
-  var initEditLineData = /*#__PURE__*/function () {
-    var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
-      var _currentLink$attribut, _sourcePorts$ports, _currentLink$attribut2, _targetPorts$ports;
-
-      var sourcePorts, targetPorts;
-      return _regeneratorRuntime.wrap(function _callee3$(_context3) {
-        while (1) {
-          switch (_context3.prev = _context3.next) {
-            case 0:
-              _context3.next = 2;
-              return getPortsById(currentLink.source, currentLink);
-
-            case 2:
-              sourcePorts = _context3.sent;
-              _context3.next = 5;
-              return getPortsById(currentLink.target, currentLink);
-
-            case 5:
-              targetPorts = _context3.sent;
-              setSourceIFDoc(sourcePorts.portsDoc);
-              setTargetIFDoc(targetPorts.portsDoc);
-              setLink({
-                source: {
-                  ciData: topo.dataModel.getDataById(currentLink.source),
-                  id: currentLink.source,
-                  name: currentLink.attributes['network_link.source_device_id_object'].displayName,
-                  ciId: currentLink.attributes['network_link.source_device_id'],
-                  ciName: (_currentLink$attribut = currentLink.attributes.source_type_object) === null || _currentLink$attribut === void 0 ? void 0 : _currentLink$attribut.displayName,
-                  ciType: currentLink.attributes.source_type,
-                  interfaceSource: currentLink.interfaceSource,
-                  ports: (_sourcePorts$ports = sourcePorts.ports) !== null && _sourcePorts$ports !== void 0 ? _sourcePorts$ports : [],
-                  portsDoc: sourcePorts.portsDoc
-                },
-                target: {
-                  ciData: topo.dataModel.getDataById(currentLink.target),
-                  id: currentLink.target,
-                  name: currentLink.attributes['network_link.destination_device_id_object'].displayName,
-                  ciId: currentLink.attributes['network_link.destination_device_id'],
-                  ciName: (_currentLink$attribut2 = currentLink.attributes.destination_type_object) === null || _currentLink$attribut2 === void 0 ? void 0 : _currentLink$attribut2.displayName,
-                  ciType: currentLink.target !== '' ? currentLink.attributes.destination_type : 'customNode',
-                  interfaceTarget: currentLink.interfaceTarget,
-                  ports: (_targetPorts$ports = targetPorts.ports) !== null && _targetPorts$ports !== void 0 ? _targetPorts$ports : [],
-                  portsDoc: targetPorts.portsDoc
-                },
-                attributes: _extends({}, currentLink.attributes, {
-                  linkId: currentLink.id
-                })
-              });
-
-            case 9:
-            case "end":
-              return _context3.stop();
-          }
-        }
-      }, _callee3);
-    }));
-
-    return function initEditLineData() {
-      return _ref3.apply(this, arguments);
-    };
-  }();
-
-  useEffect(function () {
-    // rlog.debug("useEffect-----currentLink", currentLink);
-    if (currentLink) {
-      setIsAddMode(false);
-      initEditLineData();
-    }
-  }, [addLinkIsOpen]);
-  useEffect(function () {
-    if (!addLinkIsOpen) {
-      setLink(null);
-    }
-  }, [addLinkIsOpen]); // 注册事件
-
-  useEffect(function () {
-    var notifier = topo.view.topoClient.notifier; // rlog.debug("注册事件");
-    // 进入链路模式
-
-    notifier.on(TopoCenterEvent.TOPO_LINK_ENTER_CREATE_MODE, enterAddLinkMode); // 选择第一个节点
-
-    notifier.on(TopoCenterEvent.TOPO_LINK_SELECT_SOURCE_NODE, handleSelectSourceNodeEvent); // 选择第二个节点
-
-    notifier.on(TopoCenterEvent.TOPO_LINK_CREATED, handleSelectTargetNodeEvent);
-    return function () {
-      // 取消注册事件
-      // rlog.debug("取消注册事件");
-      notifier.off(TopoCenterEvent.TOPO_LINK_ENTER_CREATE_MODE, enterAddLinkMode);
-      notifier.off(TopoCenterEvent.TOPO_LINK_CREATED, handleSelectTargetNodeEvent);
-    };
-  }, []);
-
-  var translationNode = function translationNode(node, Ports) {
-    var _topo$ciTyeCache$getC, _topo$ciTyeCache$getC2, _attrObject$ciType, _Ports$ports;
-
-    var attrObject = node._attrObject;
-    return {
-      ciData: topo.dataModel.getDataById(attrObject.id),
-      id: attrObject.id,
-      name: attrObject.name,
-      ciId: attrObject.id,
-      ipAddress: attrObject.ipAddress,
-      ciName: (_topo$ciTyeCache$getC = (_topo$ciTyeCache$getC2 = topo.ciTyeCache.getCiType(attrObject.ciType)) === null || _topo$ciTyeCache$getC2 === void 0 ? void 0 : _topo$ciTyeCache$getC2.displayName) !== null && _topo$ciTyeCache$getC !== void 0 ? _topo$ciTyeCache$getC : attrObject.customName,
-      ciType: (_attrObject$ciType = attrObject.ciType) !== null && _attrObject$ciType !== void 0 ? _attrObject$ciType : 'customNode',
-      ports: (_Ports$ports = Ports.ports) !== null && _Ports$ports !== void 0 ? _Ports$ports : [],
-      portsDoc: Ports.portsDoc
-    };
-  };
-
-  var closeDrawer = function closeDrawer() {
-    //editDispatchers.update({ addLinkIsOpen: false });
-    // rlog.debug("关闭");
-    editDispatchers.update({
-      addLinkIsOpen: false,
-      currentLink: null
-    });
-  };
-
-  var addLinkToGraph = function addLinkToGraph(_ref4) {
-    var linkData = _ref4.linkData,
-        isExportLink = _ref4.isExportLink,
-        targetName = _ref4.targetName;
-    var htTopo = topo.getHtTopo();
-    var _linkNodesRef$current = linkNodesRef.current,
-        source = _linkNodesRef$current.source,
-        target = _linkNodesRef$current.target;
-
-    try {
-      // 获取两个节点间的连线数据列表
-      var edgesInNodes = getEdgesBetweenNodes(source, target);
-      var _isGroup = false; // linkType === "agg"
-
-      if (_isGroup) {
-        // 聚合链路
-        if (edgesInNodes.length === 0) {
-          htTopo.createEdge(source, target, linkData);
-        } else {
-          htTopo.setEdgeGroupData(source, target, linkData);
-        } // 切换到连线组状态
-
-
-        htTopo.toggleEdgeGroup(source, target, false);
-      } else {
-        // 有连线组无子连线时，设置连线数据，切换到连线并选中
-        var edge = htTopo.createEdge(source, target, linkData);
-
-        if (isExportLink && target.getTag() === undefined) {
-          // rlog.debug("addLinkToGraph-export-target", target, target.getTag());
-          target.a('name', targetName);
-        }
-
-        htTopo.toggleEdgeGroup(source, target, true);
-      }
-
-      topo.getGraphView().dm().sm().ss(topo.getDataModel().getDataByTag(linkData.id));
-    } catch (error) {
-      rlog.error('addLinkToGraph', error);
-    }
-  };
-
-  var mergeExportLinkData = function mergeExportLinkData(data, attributes, linkFormAttributes) {
-    var _sourceIFDoc$data$sou, _targetIFDoc$data$des;
-
-    // console.log("mergeExportLinkData", data, attributes);
-    return _extends({}, attributes, {
-      id: data.id,
-      name: data.name,
-      source: data['network_link.source_device_id'],
-      target: data['network_link.destination_device_id'],
-      operation: data.operation,
-      interfaceSource: data['source_id'],
-      interfaceTarget: data['destination_id'],
-      ciType: data.ciType,
-      attributes: _extends({}, attributes.attributes, linkFormAttributes, {
-        display_name: data.display_name,
-        name: data.name,
-        'network_link.actual_bandwidth': data['network_link.actual_bandwidth'],
-        'network_link.connect_type': data['network_link.connect_type'],
-        'network_link.destination_ipv4': data['network_link.destination_ipv4'],
-        'network_link.source_device_id': data['network_link.source_device_id'],
-        source_id: data.source_id,
-        support_templates: data.support_templates,
-        use: data.use,
-        source_id_object: {
-          displayName: (_sourceIFDoc$data$sou = sourceIFDoc[data.source_id]) === null || _sourceIFDoc$data$sou === void 0 ? void 0 : _sourceIFDoc$data$sou.label
-        },
-        destination_id_object: {
-          displayName: (_targetIFDoc$data$des = targetIFDoc[data.destination_id]) === null || _targetIFDoc$data$des === void 0 ? void 0 : _targetIFDoc$data$des.label
-        }
-      })
-    });
-  };
-
-  var onSave = /*#__PURE__*/function () {
-    var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4(data) {
-      var parm, result, config, isExportLink, exportLinkIdList, _yield$editDispatcher, elements, linkData, edge, aobj, target, links, linkAttrKey, newLinkData, newLinks, newData, _config, _yield$editDispatcher2, _elements;
-
-      return _regeneratorRuntime.wrap(function _callee4$(_context4) {
-        while (1) {
-          switch (_context4.prev = _context4.next) {
-            case 0:
-              //editDispatchers.update({ addLinkIsOpen: false });
-              // console.log("保存链路信息", isAddMode, data);
-              setLoading(true);
-              parm = {
-                attributes: data
-              };
-              result = null;
-
-              if (!isAddMode) {
-                _context4.next = 9;
-                break;
-              }
-
-              _context4.next = 6;
-              return service.addLink(parm);
-
-            case 6:
-              result = _context4.sent;
-              _context4.next = 13;
-              break;
-
-            case 9:
-              parm.id = currentLink.id;
-              _context4.next = 12;
-              return service.editLink(parm);
-
-            case 12:
-              result = _context4.sent;
-
-            case 13:
-              topo.historyManager.setDisabled(true, '保存链路');
-              _context4.prev = 14;
-
-              if (!result) {
-                _context4.next = 59;
-                break;
-              }
-
-              config = topo.resourceConfig.getConfigFromHt();
-              isExportLink = !data['network_link.destination_device_id']; // 新建后显示到图上
-
-              if (!isAddMode) {
-                _context4.next = 33;
-                break;
-              }
-
-              exportLinkIdList = config.exportLinkIdList;
-
-              if (isExportLink) {
-                exportLinkIdList.push(result);
-              }
-
-              _context4.next = 23;
-              return topo.resourceConfig.updateConfig(_extends({}, config, {
-                exportLinkIdList: exportLinkIdList
-              }));
-
-            case 23:
-              _context4.next = 25;
-              return editDispatchers.fetchDataByConfig();
-
-            case 25:
-              _yield$editDispatcher = _context4.sent;
-              elements = _yield$editDispatcher.elements;
-              linkData = elements.find(function (element) {
-                return element.id === result;
-              }); // console.log("创建成功-parm,linkData", parm, linkData);
-
-              topo.historyManager.setDisabled(true, '保存链路');
-              addLinkToGraph({
-                linkData: clone(linkData),
-                isExportLink: isExportLink,
-                targetName: data['network_link.destination_ipv4']
-              });
-
-              _Message.success('创建成功');
-
-              _context4.next = 56;
-              break;
-
-            case 33:
-              if (!isExportLink) {
-                _context4.next = 49;
-                break;
-              }
-
-              edge = topo.getGraphView().dm().sm().ld();
-              aobj = edge.getAttrObject();
-              edge.setAttrObject(_extends({}, aobj, data));
-              target = edge.getTarget();
-
-              if (target.getTag() === undefined) {
-                target.a('name', data['network_link.destination_ipv4']);
-              }
-
-              links = topoState.data.links;
-              linkAttrKey = links.findIndex(function (item) {
-                return item.id === aobj.id;
-              });
-              newLinkData = mergeExportLinkData(edge.getAttrObject(), links[linkAttrKey], data);
-              newLinks = clone(links);
-              newLinks.splice(linkAttrKey, 1, newLinkData);
-              newData = _extends({}, topoState.data, {
-                links: newLinks
-              });
-              _context4.next = 47;
-              return topoDispatchers.update({
-                data: newData
-              });
-
-            case 47:
-              _context4.next = 55;
-              break;
-
-            case 49:
-              _config = topo.resourceConfig.getConfigFromHt();
-              topo.resourceConfig.updateConfig(_config);
-              _context4.next = 53;
-              return editDispatchers.fetchDataByConfig();
-
-            case 53:
-              _yield$editDispatcher2 = _context4.sent;
-              _elements = _yield$editDispatcher2.elements;
-
-            case 55:
-              _Message.success('保存成功');
-
-            case 56:
-              _context4.next = 58;
-              return editDispatchers.update({
-                addLinkIsOpen: false,
-                currentLink: null
-              });
-
-            case 58:
-              topo.linkDynamicStyleExecutor.execute();
-
-            case 59:
-              _context4.next = 65;
-              break;
-
-            case 61:
-              _context4.prev = 61;
-              _context4.t0 = _context4["catch"](14);
-
-              _Message.error('保存失败');
-
-              rlog.error('保存链路信息异常', _context4.t0);
-
-            case 65:
-              setLoading(false);
-              topo.historyManager.setDisabled(false, '保存链路');
-
-            case 67:
-            case "end":
-              return _context4.stop();
-          }
-        }
-      }, _callee4, null, [[14, 61]]);
-    }));
-
-    return function onSave(_x4) {
-      return _ref5.apply(this, arguments);
-    };
-  }();
-
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_Loading, {
-    visible: loadingConnectableNodes,
-    fullScreen: true
-  }), /*#__PURE__*/React.createElement(_Loading, {
-    visible: loadingFormData,
-    fullScreen: true
-  }), /*#__PURE__*/React.createElement(_Drawer, {
-    closeMode: ['close', 'esc'],
-    visible: addLinkIsOpen,
-    onClose: closeDrawer,
-    title: isAddMode ? '添加链路' : '编辑链路',
-    className: styles.drawer
-  }, addLinkIsOpen && link && /*#__PURE__*/React.createElement(EditLinkInfo, {
-    lineData: link,
-    topo: topo,
-    onClose: closeDrawer,
-    addLinkIsOpen: addLinkIsOpen,
-    onSave: onSave,
-    loading: loading,
-    isAdd: isAddMode
-  })));
-}
-
-export default AddLinkDrawer;

package/es/networkTopo/components/editor/propertyViews/edge/addLinkDrawer/components/NetworkLinkForm.js

@@ -1,4 +0,0 @@
-import React from 'react';
-export default function NetworkLinkForm(props) {
-  return /*#__PURE__*/React.createElement("div", null, "LinkForm");
-}