@riil-frontend/component-topology 13.0.0-dev.1 → 13.0.0-dev.2

package/es/components/ResourceSelectDrawer/ResourceSelectDrawer.js

@@ -64,7 +64,7 @@ function ResourceSelectDrawer(props) {
             _context.prev = 9;
             _context.t0 = _context["catch"](1);
             setLoading(false);
-            rlog.error('ResourceSelectDrawer.handleOk', _context.t0);
+            rlog.error('ResourceSelectDrawer.handleOk', _context.t0, _context.t0.stack);
 
           case 13:
           case "end":

package/es/core/components/TopoView/topoView.js

@@ -5,7 +5,7 @@ import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import TopoGraph, { TopoEvent } from '@riil-frontend/component-topology-graph';
 import PortalContainer from '@riil-frontend/component-topology-graph/es/components/PortalContainer';
-import { rlog } from '@riil-frontend/component-topology-utils'; // 通用
+import Logger from 'loglevel'; // 通用
 
 import showMessage from "../../utils/showMessage";
 import { TPL_TREE } from "../../../utils/template";
@@ -28,6 +28,7 @@ import editorStyles from "./editor.module.scss";
 import basicIcons from "../../common/icons/basicIcons";
 import HelpIcon from "../../editor/components/BottomFloatTool/HelpIcon";
 import { updateNodesNameVisible } from "../../models/utils/nodeNameVisibleUtil";
+var rlog = Logger.getLogger('topo');
 
 var Topology = function Topology(props) {
   var _classnames;
@@ -115,7 +116,7 @@ var Topology = function Topology(props) {
     }
   }, []);
   var handleGraphDataLoaded = useCallback(function () {
-    rlog.info('TopoView.handleGraphDataLoaded', new Date().toString(), {
+    rlog.info('TopoView.handleGraphDataLoaded: 数据加载完成', new Date().toString(), {
       topoMod: topo.store.getState().topoMod,
       topoData: topoData,
       htElements: topo.getDataModel().getDatas().toArray()
@@ -125,13 +126,15 @@ var Topology = function Topology(props) {
     fixLink(topo);
     handleClusterNoPermission(topo);
     updateEdgeExpanded(topo);
+    topo.selectionModel.init();
     var htHistoryManager = topo.getDataModel().getHistoryManager();
 
-    if (htHistoryManager) {
+    if (isEditMode && htHistoryManager) {
       topo.historyManager = new HistoryManager(topo, htHistoryManager);
+      topo.historyManager.clear();
+      rlog.info('TopoView.handleGraphDataLoaded: 初始化HistoryManager ', topo.historyManager.toString());
     }
 
-    topo.selectionModel.init();
     topoDispatchers.update({
       graphLoaded2: true
     });

package/es/core/editor/components/Toolbar/widgets/EdgeColorButton/EdgeColorButton.js

@@ -36,14 +36,14 @@ function EdgeColorButton(props) {
     });
   };
 
-  var getLines = function getLines(list) {
+  var getCustomLines = function getCustomLines(list) {
     return list.filter(isCustomEdge);
   };
 
   useEffect(function () {
     if (graphLoaded) {
       var edges = getEdgesBySelection(topo);
-      var list = getLines(edges);
+      var list = getCustomLines(edges);
       setLineWidth(1); // eslint-disable-next-line eqeqeq
 
       if (selection.length == 1 && list.length === 1) {

package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/LineType.js

@@ -32,21 +32,11 @@ var LINE_TYPE_OPTIONS = [{
   value: 'doublearc',
   label: '双弧线',
   icon: 'topo_linear_icon_arcline'
-} // {
-//   value: 'points',
-//   label: '自由线形',
-//   icon: 'topo_linear_icon_pointsline',
-// },
-];
-
-if (localStorage.getItem('topo.test.edge.customType') === 'true') {
-  LINE_TYPE_OPTIONS.push({
-    value: 'points',
-    label: '自由线形',
-    icon: 'topo_linear_icon_pointsline'
-  });
-}
-
+}, {
+  value: 'points',
+  label: '自由线形',
+  icon: 'topo_linear_icon_pointsline'
+}];
 var LineType = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var value = props.value,
       onChange = props.onChange,

package/es/core/editor/components/Toolbar/widgets/FontFamilyWidget.js

@@ -1,33 +1,8 @@
 import React, { useState, useEffect } from 'react';
-import DropdownMenu from "./components/DropdownMenu";
-import textStyleSettingRouter from "./components/textStyleSetting/textStyleSettingRouter.js";
+import FontFamilySelect from "./components/FontFamilySelect";
+import textStyleSettingRouter from "./components/textStyleSetting/textStyleSettingRouter";
 import WidgetBox from "./WidgetBox";
 
-function FontFamilySelect(props) {
-  var value = props.value,
-      onChange = props.onChange;
-  var items = ['宋体', '微软雅黑', '黑体', 'Arial'];
-  return /*#__PURE__*/React.createElement(DropdownMenu, {
-    value: (items.includes(value) ? value : null) || '',
-    valueRender: function valueRender(val) {
-      return /*#__PURE__*/React.createElement("div", {
-        style: {
-          width: 48
-        }
-      }, val || '微软雅黑');
-    },
-    onSelect: onChange
-  }, items.map(function (item) {
-    return /*#__PURE__*/React.createElement(DropdownMenu.Item, {
-      key: item
-    }, /*#__PURE__*/React.createElement("div", {
-      style: {
-        fontFamily: item
-      }
-    }, item));
-  }));
-}
-
 function FontFamilyWidget(props) {
   var topo = props.topo,
       showLabel = props.showLabel,

package/es/core/editor/components/Toolbar/widgets/FontSizeWidget.js

@@ -1,33 +1,8 @@
-import React, { useEffect, useState } from 'react';
-import DropdownMenu from "./components/DropdownMenu";
-import textStyleSettingRouter from "./components/textStyleSetting/textStyleSettingRouter.js";
+import React, { useEffect } from 'react';
+import FontSizeSelect from "./components/FontSizeSelect";
+import textStyleSettingRouter from "./components/textStyleSetting/textStyleSettingRouter";
 import WidgetBox from "./WidgetBox";
 
-function FontSizeSelect(props) {
-  var value = props.value,
-      disabled = props.disabled,
-      onChange = props.onChange;
-  var items = [12, 14, 16, 18, 20, 24, 30, 36, 48, 60, 80];
-  return /*#__PURE__*/React.createElement(DropdownMenu, {
-    value: "" + (value || ''),
-    valueRender: function valueRender(val) {
-      return /*#__PURE__*/React.createElement("div", {
-        style: {
-          width: 18
-        }
-      }, val || 20);
-    },
-    disabled: disabled,
-    onSelect: function onSelect(val) {
-      return onChange(parseInt(val, 10));
-    }
-  }, items.map(function (item) {
-    return /*#__PURE__*/React.createElement(DropdownMenu.Item, {
-      key: item
-    }, item);
-  }));
-}
-
 function FontSizeWidget(props) {
   var topo = props.topo,
       showLabel = props.showLabel,

package/es/core/editor/components/Toolbar/widgets/FontStyleButton.js

@@ -1,26 +1,7 @@
 import React, { useState, useEffect } from 'react';
-import variables from '@alifd/theme-19926/variables.js';
-import { isText } from "../../../../../utils/htElementUtils";
-import DropdownMenu from "./components/DropdownMenu";
-import textStyleSettingRouter from "./components/textStyleSetting/textStyleSettingRouter.js";
+import FontStyleSelect from "./components/FontStyleSelect";
+import textStyleSettingRouter from "./components/textStyleSetting/textStyleSettingRouter";
 import WidgetBox from "./WidgetBox";
-import Tooltip from "../components/Tooltip";
-var items = [{
-  key: 'bold',
-  label: '加粗',
-  icon: 'bold',
-  tooltip: '加粗'
-}, {
-  key: 'italic',
-  label: '斜体',
-  icon: 'Italics',
-  tooltip: '斜体'
-}, {
-  key: 'underline',
-  label: '下划线',
-  icon: 'Underline',
-  tooltip: '下划线'
-}];
 
 function buildValue(obj) {
   return Object.keys(obj).filter(function (key) {
@@ -89,39 +70,12 @@ function FontStyleButton(props) {
     tooltip: "\u6587\u5B57\u6837\u5F0F\uFF08\u52A0\u7C97\u3001\u659C\u4F53\u3001\u4E0B\u5212\u7EBF\uFF09",
     disabled: disabled,
     showLabel: showLabel
-  }, /*#__PURE__*/React.createElement(DropdownMenu, {
+  }, /*#__PURE__*/React.createElement(FontStyleSelect, {
     value: value,
-    valueRender: function valueRender() {
-      return /*#__PURE__*/React.createElement("img", {
-        src: "/img/topo/editor/toolbar/bold/" + (disabled ? 'Disable' : 'Normal') + ".svg",
-        alt: ""
-      });
-    },
-    multiple: true,
     disabled: disabled,
-    onSelect: handleSelect
-  }, items.map(function (item) {
-    return /*#__PURE__*/React.createElement(DropdownMenu.Item, {
-      key: item.key,
-      disabled: fieldDisabled[item.key]
-    }, /*#__PURE__*/React.createElement(Tooltip, {
-      trigger: /*#__PURE__*/React.createElement("div", {
-        style: {
-          display: 'flex',
-          alignItems: 'center'
-        }
-      }, /*#__PURE__*/React.createElement("img", {
-        src: "/img/topo/editor/toolbar/" + item.icon + "/" + (fieldDisabled[item.key] ? 'Disable' : 'Normal') + ".svg",
-        alt: ""
-      }), /*#__PURE__*/React.createElement("span", {
-        style: fieldDisabled[item.key] ? {} : {
-          color: variables['$color-text1-4']
-        }
-      }, item.label)),
-      align: "r",
-      popupStyle: {}
-    }, item.tooltip));
-  })));
+    fieldDisabled: fieldDisabled,
+    onChange: handleSelect
+  }));
 }
 
 export default textStyleSettingRouter(FontStyleButton, {

package/es/core/editor/components/Toolbar/widgets/components/FontFamilySelect.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import DropdownMenu from "./DropdownMenu";
+
+function FontFamilySelect(props) {
+  var value = props.value,
+      onChange = props.onChange;
+  var items = ['宋体', '微软雅黑', '黑体', 'Arial'];
+  return /*#__PURE__*/React.createElement(DropdownMenu, {
+    value: (items.includes(value) ? value : null) || '',
+    valueRender: function valueRender(val) {
+      return /*#__PURE__*/React.createElement("div", {
+        style: {
+          width: 48
+        }
+      }, val || '微软雅黑');
+    },
+    onSelect: onChange
+  }, items.map(function (item) {
+    return /*#__PURE__*/React.createElement(DropdownMenu.Item, {
+      key: item
+    }, /*#__PURE__*/React.createElement("div", {
+      style: {
+        fontFamily: item
+      }
+    }, item));
+  }));
+}
+
+export default FontFamilySelect;

package/es/core/editor/components/Toolbar/widgets/components/FontSizeSelect.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import DropdownMenu from "./DropdownMenu";
+
+function FontSizeSelect(props) {
+  var value = props.value,
+      disabled = props.disabled,
+      onChange = props.onChange;
+  var items = [12, 14, 16, 18, 20, 24, 30, 36, 48, 60, 80];
+  return /*#__PURE__*/React.createElement(DropdownMenu, {
+    value: "" + (value || ''),
+    valueRender: function valueRender(val) {
+      return /*#__PURE__*/React.createElement("div", {
+        style: {
+          width: 18
+        }
+      }, val || 20);
+    },
+    disabled: disabled,
+    onSelect: function onSelect(val) {
+      return onChange(parseInt(val, 10));
+    }
+  }, items.map(function (item) {
+    return /*#__PURE__*/React.createElement(DropdownMenu.Item, {
+      key: item
+    }, item);
+  }));
+}
+
+export default FontSizeSelect;

package/es/core/editor/components/Toolbar/widgets/components/FontStyleSelect.js

@@ -0,0 +1,71 @@
+import React from 'react';
+import variables from '@alifd/theme-19926/variables.js';
+import DropdownMenu from "./DropdownMenu";
+import Tooltip from "../../components/Tooltip";
+var items = [{
+  key: 'bold',
+  label: '加粗',
+  icon: 'bold',
+  tooltip: '加粗'
+}, {
+  key: 'italic',
+  label: '斜体',
+  icon: 'Italics',
+  tooltip: '斜体'
+}, {
+  key: 'underline',
+  label: '下划线',
+  icon: 'Underline',
+  tooltip: '下划线'
+}];
+
+function buildValue(obj) {
+  return Object.keys(obj).filter(function (key) {
+    return !!obj[key];
+  });
+}
+
+var fields = ['bold', 'italic', 'underline'];
+
+function FontStyleSelect(props) {
+  var value = props.value,
+      disabled = props.disabled,
+      onChange = props.onChange,
+      _props$fieldDisabled = props.fieldDisabled,
+      fieldDisabled = _props$fieldDisabled === void 0 ? {} : _props$fieldDisabled;
+  return /*#__PURE__*/React.createElement(DropdownMenu, {
+    value: value,
+    valueRender: function valueRender() {
+      return /*#__PURE__*/React.createElement("img", {
+        src: "/img/topo/editor/toolbar/bold/" + (disabled ? 'Disable' : 'Normal') + ".svg",
+        alt: ""
+      });
+    },
+    multiple: true,
+    disabled: disabled,
+    onSelect: onChange
+  }, items.map(function (item) {
+    return /*#__PURE__*/React.createElement(DropdownMenu.Item, {
+      key: item.key,
+      disabled: !!fieldDisabled[item.key]
+    }, /*#__PURE__*/React.createElement(Tooltip, {
+      trigger: /*#__PURE__*/React.createElement("div", {
+        style: {
+          display: 'flex',
+          alignItems: 'center'
+        }
+      }, /*#__PURE__*/React.createElement("img", {
+        src: "/img/topo/editor/toolbar/" + item.icon + "/" + (fieldDisabled[item.key] ? 'Disable' : 'Normal') + ".svg",
+        alt: ""
+      }), /*#__PURE__*/React.createElement("span", {
+        style: fieldDisabled[item.key] ? {} : {
+          color: variables['$color-text1-4']
+        }
+      }, item.label)),
+      align: "r",
+      popupStyle: {}
+    }, item.tooltip));
+  }));
+}
+
+export default FontStyleSelect;

package/es/core/editor/components/settings/core/updateElementProperty.js

@@ -1,7 +1,8 @@
+import Logger from 'loglevel';
+var rlog = Logger.getLogger('topo');
 export default function updateElementProperty(topo, name, value) {
-  // const element = topo.getDataModel().getDataById(selection[0].id);
   var element = topo.getSelectionModel().getFirstData();
-  console.info("updateElementProperty", topo.getSelectionModel().getSelection(), {
+  rlog.debug("updateElementProperty. ", {
     element: element,
     name: name,
     value: value

package/es/core/editor/components/settings/propertyViews/view/GlobalEdgeToggle.js

@@ -23,13 +23,13 @@ function GlobalEdgeToggle(props) {
         topo: topo,
         showType: 4
       });
-      topo.getHtTopo().expandAllEdgeGroups();
+      topo.getHtTopo().toggleAllEdgeGroups(true);
     } else {
       showLinkByConfig({
         topo: topo,
         showType: 1
       });
-      topo.getHtTopo().collapseAllEdgeGroups();
+      topo.getHtTopo().toggleAllEdgeGroups(false);
     }
 
     displayConfigDispatchers.update({

package/es/core/editor/hooks/useNewElementTheme.js

@@ -16,26 +16,30 @@ function useNewElementTheme(props) {
       inited = true;
     }
 
-    function handleDataModelChangeListener(e) {
-      var kind = e.kind,
-          data = e.data;
+    function handleAddElement(e) {
+      var data = e.data; // 设置主题样式
 
-      if (kind === 'add') {
-        // 设置主题样式
-        var displayConfig = topo.store.getModelState('displayConfig');
-        var theme = displayConfig.canvasTheme || 'white';
-        var themeConfig = THEMES.find(function (item) {
-          return item.name === theme;
-        });
+      var displayConfig = topo.store.getModelState('displayConfig');
+      var theme = displayConfig.canvasTheme || 'white';
+      var themeConfig = THEMES.find(function (item) {
+        return item.name === theme;
+      });
 
-        var _ThemeUtil2 = ThemeUtil({
-          topo: topo
-        }),
-            setElementTheme = _ThemeUtil2.setElementTheme;
+      var _ThemeUtil = ThemeUtil({
+        topo: topo
+      }),
+          setElementTheme = _ThemeUtil.setElementTheme;
 
-        setElementTheme(data, themeConfig); // 临时放这里，新加入节点按配置显示隐藏名称
+      setElementTheme(data, themeConfig); // 临时放这里，新加入节点按配置显示隐藏名称
+
+      setNewNodeNameVisible(topo, data);
+    }
 
-        setNewNodeNameVisible(topo, data);
+    function handleDataModelChangeListener(e) {
+      var kind = e.kind;
+
+      if (kind === 'add') {
+        handleAddElement(e);
       }
     }
 

package/es/core/editor/utils/edgeTypeStyleUtil.js

@@ -1,4 +1,4 @@
-import { getEdges, getEdgesBetweenNodes } from "../../../utils/htElementUtils";
+import { getEdges, getEdgesBetweenNodes, isEdgeVisible } from "../../../utils/htElementUtils";
 var ht = window.ht;
 export function getEdgesBySelection(topo) {
   var getChildrenNodeIds = function getChildrenNodeIds(nodes) {
@@ -14,6 +14,14 @@ export function getEdgesBySelection(topo) {
     return nodeIds;
   };
 
+  function getVisibleEdgesInNodes(gv, nodes) {
+    var nodeIds = getChildrenNodeIds(nodes);
+    var dm = gv.getDataModel();
+    return getEdges(dm).filter(function (edge) {
+      return nodeIds.includes(edge.getSource().getId()) && nodeIds.includes(edge.getTarget().getId());
+    }).filter(isEdgeVisible);
+  }
+
   var getSelectedEdges = function getSelectedEdges(gv) {
     var selection = gv.getSelectionModel().getSelection().toArray(); // 选中的连线
 
@@ -24,14 +32,8 @@ export function getEdgesBySelection(topo) {
     var nodes = selection.filter(function (element) {
       return element instanceof ht.Node;
     });
-    var nodeIds = getChildrenNodeIds(nodes);
-    var dm = gv.getDataModel();
-    getEdges(dm).forEach(function (edge) {
-      if (nodeIds.find(function (nodeId) {
-        return nodeId === edge.getSource().getId();
-      }) && nodeIds.find(function (nodeId) {
-        return nodeId === edge.getTarget().getId();
-      }) && !edges.find(function (item) {
+    getVisibleEdgesInNodes(gv, nodes).forEach(function (edge) {
+      if (!edges.find(function (item) {
         return item === edge;
       })) {
         edges.push(edge);
@@ -77,29 +79,6 @@ export function isNodeAllEdges(topo) {
   });
   return inEdges;
 }
-/**
- * 遍历连线及子连线
- * @param {*} topo 
- * @param {*} edges 
- * @param {*} operateEdgeFn 
- */
-
-export function loopEdgesAndChildren(topo, edges, operateEdgeFn) {
-  var htTopo = topo.getHtTopo();
-  edges.forEach(function (edge) {
-    operateEdgeFn(edge);
-
-    if (edge.isEdgeGroupAgent()) {
-      // 连线组折叠时同时设置子连线
-      var edgeChildren = edge.getEdgeGroup().getEdges().toArray();
-      htTopo.toggleEdgeGroup(edge.getSource(), edge.getTarget(), true);
-      edgeChildren.forEach(function (edgeChild) {
-        operateEdgeFn(edgeChild);
-      });
-      htTopo.toggleEdgeGroup(edge.getSource(), edge.getTarget(), false);
-    }
-  });
-}
 /**
  * 设置连线及子连线。带回退事务控制
  * @param {*} topo 

package/es/core/hooks/useGraphAlarmDisplay.js

@@ -126,6 +126,8 @@ export default function useGraphAlarmDisplay(options) {
     });
 
     function showAlarm() {
+      var _topo$historyManager, _topo$historyManager2;
+
       if (!graphLoaded) {
         return;
       }
@@ -156,7 +158,9 @@ export default function useGraphAlarmDisplay(options) {
         relateTopoAlarms: relateTopoAlarms
       }); // 更新到ht拓扑
 
+      (_topo$historyManager = topo.historyManager) === null || _topo$historyManager === void 0 ? void 0 : _topo$historyManager.setDisabled(true, '推送告警');
       topo.view.loadAlarm(elementsAlarmLevels);
+      (_topo$historyManager2 = topo.historyManager) === null || _topo$historyManager2 === void 0 ? void 0 : _topo$historyManager2.setDisabled(false, '推送告警');
     }
 
     return function () {

package/es/core/hooks/usePolling.js

@@ -4,11 +4,12 @@ import _regeneratorRuntime from "@babel/runtime/regenerator";
 import { useEffect } from 'react';
 import { useRequest } from 'ahooks';
 import _ from 'lodash';
-import { rlog } from '@riil-frontend/component-topology-utils';
+import Logger from 'loglevel';
 import { useCbbEventListener } from '@riil-frontend/component-riil-event-emitter';
 import DictCache from "../models/cache/DictCache";
 import useCiAttributeChange from "./useCiAttributeChange";
 import useHtDataPropertyChangeListener from "./ht/useHtDataPropertyChangeListener";
+var rlog = Logger.getLogger('topo');
 /**
  * 轮询获取指标hooks
  * @param {*} props