@riil-frontend/component-topology 12.0.0-dev.4 → 12.0.0-dev.41

package/es/components/BatchAttrMetric/setting.js

@@ -7,7 +7,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 var _excluded = ["value", "defaultSet", "dataSource"];
 import React, { useState, useMemo, useEffect } from 'react';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import ActionTree from '@riil-frontend/component-action-tree';
 import NoDataPage from '@riil-frontend/component-topology-common/es/components/NoDataPage';
 import TableLayout from '@riil-frontend/component-table-layout';

package/es/components/ModelAttrSelectDrawer/components/MultipleTypeAttributeSelectDrawer.js

@@ -1,5 +1,5 @@
 import React, { useState, useEffect, useRef, useImperativeHandle, forwardRef } from 'react';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import ModelAttrSelectDrawer from "./ModelAttrSelectDrawer";
 
 function parseValue(value) {

package/es/components/ResourceSelectDrawer/ResourceSelectDrawer.js

@@ -2,7 +2,7 @@ import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import React, { useState, useEffect, useRef, useCallback } from 'react';
 import PropTypes from 'prop-types';
-import rlog from '@riil-frontend/component-topology-utils/lib/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import Drawer from "../Drawer";
 import ResourceSelectList from "./ResourceSelectList";
 import styles from "./ResourceSelectDrawer.module.scss";

package/es/components/TemplateButton/index.module.scss

@@ -26,7 +26,7 @@
   line-height: 20px;
   font-size: 18px;
   margin-top: 14px;
-  color: $color-text1-3;
+  color: $color-text1-4;
   outline: none;
 }
 

package/es/core/components/AlarmListPanel/components/AlarmListItem.js

@@ -1,3 +1,5 @@
+import _Balloon from "@alifd/next/es/balloon";
+import _extends from "@babel/runtime/helpers/extends";
 import _List from "@alifd/next/es/list";
 import _Icon from "@alifd/next/es/icon";
 import React, { useState, useEffect } from 'react';
@@ -30,7 +32,8 @@ function AlarmListItem(props) {
   // 传入参数
   var topo = props.topo,
       alarmInfo = props.alarmInfo,
-      onClick = props.onClick;
+      onClick = props.onClick; // console.log("AlarmListPanel", topo, alarmInfo);
+
   return /*#__PURE__*/React.createElement(_List.Item, {
     className: styles.AlarmListItem,
     media: /*#__PURE__*/React.createElement(_Icon, {
@@ -85,10 +88,62 @@ function RiskListItem(props) {
   }, "\u67E5\u770B\u8BE6\u60C5"))));
 }
 
+function SubListItem(props) {
+  // 传入参数
+  var topo = props.topo,
+      alarmInfo = props.alarmInfo,
+      onClick = props.onClick;
+  var creatAlarmTips = topo.viewProps.creatAlarmTips;
+  var subNode = topo.getData().nodes.find(function (node) {
+    return node.ciId === alarmInfo.mainCiId;
+  });
+  var plarm = alarmInfo.cmpCode ? "\u3010" + (subNode === null || subNode === void 0 ? void 0 : subNode.sourceName) + "\u3011" : "【本级平台】";
+  return /*#__PURE__*/React.createElement(_List.Item, {
+    className: styles.AlarmListItem,
+    media: /*#__PURE__*/React.createElement(_Icon, {
+      type: "gaojing-3",
+      size: "xs",
+      className: styles["alarm-color-icon"] + " alarm-color-icon-lv" + alarmInfo.alertLevel
+    })
+  }, /*#__PURE__*/React.createElement("span", {
+    className: styles.content
+  }, /*#__PURE__*/React.createElement("div", {
+    className: styles.list,
+    onClick: function onClick() {
+      getNode(topo, alarmInfo);
+    }
+  }, "" + plarm + alarmInfo.alertObject + alarmInfo.alertTitle), alarmInfo.cmpCode ? /*#__PURE__*/React.createElement(_Balloon, {
+    trigger: /*#__PURE__*/React.createElement("span", {
+      className: styles.listLink
+    }, "\u67E5\u770B\u8BE6\u60C5"),
+    closable: true,
+    triggerType: "click",
+    align: "bl",
+    popupClassName: styles["enjoydata-alarm-table-balloon"],
+    popupStyle: {
+      maxWidth: "700px",
+      width: 530
+    }
+  }, creatAlarmTips(_extends({}, alarmInfo, {
+    sourceName: plarm
+  }))) : /*#__PURE__*/React.createElement("div", {
+    className: styles.listLink
+  }, /*#__PURE__*/React.createElement(Link, {
+    onClick: onClick,
+    to: alarmLink(alarmInfo)
+  }, "\u67E5\u770B\u8BE6\u60C5"))));
+}
+
 function ListItem(props) {
-  var alarmInfo = props.alarmInfo;
-  var ListItemWidget = alarmInfo.eventType === 'risk' ? RiskListItem : AlarmListItem;
-  return /*#__PURE__*/React.createElement(ListItemWidget, props);
+  var topo = props.topo,
+      alarmInfo = props.alarmInfo;
+
+  if (topo.isCMPTopo) {
+    return /*#__PURE__*/React.createElement(SubListItem, props);
+  } else {
+    var ListItemWidget = alarmInfo.eventType === "risk" ? RiskListItem : AlarmListItem;
+    return /*#__PURE__*/React.createElement(ListItemWidget, props);
+  }
 }
 
 export default ListItem;

package/es/core/components/AlarmListPanel/index.js

@@ -3,7 +3,7 @@ import _Button from "@alifd/next/es/button";
 import _Card from "@alifd/next/es/card";
 import React, { useState, useEffect } from 'react';
 import NoDataPage from '@riil-frontend/component-no-data-page';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import AlarmListItem from "./components/AlarmListItem";
 import styles from "./index.module.scss";
 import { alarmListDemo } from "./mocks";

package/es/core/components/DisplaySettingDrawer/DisplaySetting.js

@@ -3,7 +3,7 @@ import _Form from "@alifd/next/es/form";
 import _extends from "@babel/runtime/helpers/extends";
 import _Field from "@alifd/next/es/field";
 import React, { useEffect, useImperativeHandle, useState } from 'react';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import NodeTag from "./NodeTag";
 import EdgeFlow from "./EdgeFlow";
 import NodeTip from "./NodeTip";

package/es/core/components/DisplaySettingDrawer/DisplaySettingDrawer.js

@@ -2,8 +2,8 @@ import _Message from "@alifd/next/es/message";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _extends from "@babel/runtime/helpers/extends";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
-import React, { useEffect, useRef, useState } from 'react';
-import rlog from '@riil-frontend/component-topology-utils/lib/rlog';
+import React, { useRef, useState } from 'react';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import Drawer from "../../../components/Drawer";
 import DisplaySetting from "./DisplaySetting";
 import useDisplaySetting from "./hooks/useDisplaySetting";

package/es/core/components/DisplaySettingDrawer/ResourceDisplay/BasicConfig.js

@@ -2,7 +2,7 @@ import _Button from "@alifd/next/es/button";
 import _Box from "@alifd/next/es/box";
 import _Radio from "@alifd/next/es/radio";
 import React, { useImperativeHandle, useRef } from 'react';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import { DEFAULT_CUSTOM_CONFIG } from "../../../../constants/ResourceInfoDisplay";
 import CommonCheckboxGroup from "./CommonCheckboxGroup";
 import ResourceDiplayInfoSetting from "../../ResourceViewAttributeSetting/Setting";

package/es/core/components/DisplaySettingDrawer/components/NodeAttrSettingDrawer.js

@@ -3,7 +3,7 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutP
 var _excluded = ["topo", "showType", "value"];
 import React, { forwardRef, useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
-import rlog from '@riil-frontend/component-topology-utils/lib/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import ModelAttrSelectDrawer from "../../../../components/ModelAttrSelectDrawer";
 import { getNodeModels } from "../../ResourceViewAttributeSetting/nodeCiTypeAttrUtil";
 /**

package/es/core/components/ResourceViewAttributeSetting/Setting.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
 var _excluded = ["topo", "elementType", "showType", "value"];
 import React, { forwardRef, useState } from 'react';
-import rlog from '@riil-frontend/component-topology-utils/lib/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import { getNodeModels } from "./nodeCiTypeAttrUtil";
 import ModelAttrSelectDrawer from "../../../components/ModelAttrSelectDrawer";
 /**

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/es/rlog'; // 通用
+import { rlog } from '@riil-frontend/component-topology-utils'; // 通用
 
 import showMessage from "../../utils/showMessage";
 import { TPL_TREE } from "../../../utils/template";
@@ -161,7 +161,11 @@ var Topology = function Topology(props) {
 
     if (initSelectionId) {
       var ele = topo.getHtTopo().getGraphView().dm().getDataByTag(initSelectionId);
-      topo.getHtTopo().getGraphView().sm().setSelection([ele]);
+
+      if (ele) {
+        topo.getHtTopo().getGraphView().sm().setSelection([ele]);
+      }
+
       var selectionDispatchers = topo.store.getModelDispatchers('selection');
       selectionDispatchers.update({
         initSelectionId: null

package/es/core/editor/components/BackgroundView/index.js

@@ -13,7 +13,7 @@ import UploadDialog from "./UploadDialog";
 import api from "../../../services/background";
 import { getBackgroundImageUrl, getBackgroundThumbnailImageUrl } from "../../../utils/backgroundUtil";
 import { getImageSize } from "../../../utils/imageUtil";
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 
 function List(props) {
   var selected = props.selected,

package/es/core/editor/components/CustomIconPlugin/UploadIconDialog.js

@@ -11,7 +11,7 @@ import React from 'react';
 import topoServer from '@riil-frontend/component-topology-common/es/services/topo/index';
 import _ from 'lodash';
 import { getToken } from '@riil-frontend/utils';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import { validateSpecialCharacter } from "../../../../utils/SpecialCharacterValidateUtil";
 import "./UploadIconDialog.scss";
 import styles from "./UploadIconDialog.module.scss";

package/es/core/editor/components/EditorPlugin.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useEffect } from 'react';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import CustomIconPlugin from "./CustomIconPlugin";
 import SaveLoading from "./plugins/SaveLoading";
 import GroupAddResourceDrawerPlugin from "./GroupAddResourceDrawerPlugin";

package/es/core/editor/components/Sidebar/views/ComponentPanel.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useRef } from 'react';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 /**
  * 组件面板
  * @param {*} props 

package/es/core/editor/components/Sidebar/views/ImagePanel/CiTypeImagePanel.js

@@ -1,5 +1,5 @@
 import React, { useMemo } from 'react';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import ImagePalette from "./HtImagePalette";
 /**
  * 组件面板

package/es/core/editor/components/Sidebar/views/ImagePanel/CustomImagePanel.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useRef, useMemo } from 'react';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import { getUserCustomIconsForHt } from "../../../../../common/icons/icon";
 import HtCustomImagePanel from "./HtCustomImagePanel";
 /**

package/es/core/editor/components/Sidebar/views/ImagePanel/HtCustomImagePanel.js

@@ -1,6 +1,6 @@
 import React, { useEffect, useRef } from 'react';
 import ResizeObserver from 'resize-observer-polyfill';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import styles from "./HtImagePalette.module.scss";
 /**
  * 组件面板

package/es/core/editor/components/Sidebar/views/ImagePanel/HtImagePalette.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useRef } from 'react';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import ResizeObserver from 'resize-observer-polyfill';
 import styles from "./HtImagePalette.module.scss";
 /**

package/es/core/editor/components/Sidebar/views/ImagePanel/ImagePalette.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useRef } from 'react';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 /**
  * 组件面板
  * @param {*} props 

package/es/core/editor/components/Sidebar/views/LinkPanel.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useRef } from 'react';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 /**
  * 链路面板
  * @param {*} props 

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

@@ -1,6 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useEffect, useState } from 'react';
 import { getEdgesBySelection } from "../../../../utils/edgeTypeStyleUtil";
+import { isCustomEdge } from "../../../../../utils/edgeUtil";
 import DropdownButton from "../components/DropdownButton";
 import WidgetBox from "../WidgetBox";
 import Content from "./Content";
@@ -36,15 +37,7 @@ function EdgeColorButton(props) {
   };
 
   var getLines = function getLines(list) {
-    // eslint-disable-next-line prefer-const
-    var arr = [];
-    loopEdges(list, function (edge) {
-      // eslint-disable-next-line eqeqeq
-      if (edge.getAttrObject().type == 'line') {
-        arr.push(edge);
-      }
-    });
-    return arr;
+    return list.filter(isCustomEdge);
   };
 
   useEffect(function () {
@@ -53,7 +46,7 @@ function EdgeColorButton(props) {
       var list = getLines(edges);
       setLineWidth(1); // eslint-disable-next-line eqeqeq
 
-      if (selection.length == 1 && selection[0].a('type') == 'line') {
+      if (selection.length == 1 && list.length === 1) {
         setLineWidth(list[0] && (list[0].a('styles') && list[0].a('styles').width || list[0].getStyleMap()['edge.width']) || 2);
       }
 
@@ -67,7 +60,7 @@ function EdgeColorButton(props) {
     var edges = getEdgesBySelection(topo);
     loopEdges(edges, function (edge) {
       // eslint-disable-next-line eqeqeq
-      if (edge.getAttrObject().type == 'line') {
+      if (isCustomEdge(edge)) {
         var color = colors.hex;
         edge.s('edge.color', color);
         edge.s('edge.dash.color', color);
@@ -95,7 +88,7 @@ function EdgeColorButton(props) {
     topo.historyManager.beginTransaction();
     loopEdges(edges, function (edge) {
       // eslint-disable-next-line eqeqeq
-      if (edge.getAttrObject().type == 'line') {
+      if (isCustomEdge(edge)) {
         edge.s('edge.dash.width', width);
         edge.s('edge.width', width);
         var style = edge.a('styles') || {};

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

@@ -1,8 +1,9 @@
+import _Box from "@alifd/next/es/box";
 import _Field from "@alifd/next/es/field";
 import _Select from "@alifd/next/es/select";
 import _Form from "@alifd/next/es/form";
 import React, { useEffect, useState } from 'react';
-import { getEdgesBySelection, loopEdgesAndChildren, isNodeAllEdges } from "../../../../utils/edgeTypeStyleUtil";
+import { getEdgesBySelection, isNodeAllEdges } from "../../../../utils/edgeTypeStyleUtil";
 import styles from "./EdgeType.module.scss";
 import LineType from "./LineType";
 var FormItem = _Form.Item;
@@ -142,12 +143,19 @@ function EdgeType(props) {
     className: styles.lineBox
   }, /*#__PURE__*/React.createElement(_Form, {
     field: field,
-    inline: true,
     labelAlign: "top"
   }, /*#__PURE__*/React.createElement(FormItem, null, /*#__PURE__*/React.createElement(LineType, {
     name: "lineButton"
-  })), /*#__PURE__*/React.createElement(FormItem, {
-    label: "\u8D77\u70B9"
+  })), /*#__PURE__*/React.createElement(_Form.Item, null, /*#__PURE__*/React.createElement(_Box, {
+    direction: "row",
+    style: {
+      gap: 8
+    }
+  }, /*#__PURE__*/React.createElement(FormItem, {
+    label: "\u8D77\u70B9",
+    style: {
+      margin: 0
+    }
   }, /*#__PURE__*/React.createElement(_Select, {
     name: "startPoint",
     placeholder: " ",
@@ -155,7 +163,8 @@ function EdgeType(props) {
       container: function container(trigger) {
         return trigger.parentNode;
       }
-    }
+    },
+    className: styles.endPointSelect
   }, START_TYPE_OPTIONS.map(function (item, index) {
     return /*#__PURE__*/React.createElement(Option, {
       value: item.value,
@@ -168,7 +177,10 @@ function EdgeType(props) {
       className: styles.iconImg
     }));
   }))), /*#__PURE__*/React.createElement(FormItem, {
-    label: "\u7EC8\u70B9"
+    label: "\u7EC8\u70B9",
+    style: {
+      margin: 0
+    }
   }, /*#__PURE__*/React.createElement(_Select, {
     name: "endPoint",
     placeholder: " ",
@@ -176,7 +188,8 @@ function EdgeType(props) {
       container: function container(trigger) {
         return trigger.parentNode;
       }
-    }
+    },
+    className: styles.endPointSelect
   }, END_TYPE_OPTIONS.map(function (item, index) {
     return /*#__PURE__*/React.createElement(Option, {
       value: item.value,
@@ -189,7 +202,10 @@ function EdgeType(props) {
       className: styles.iconImg
     }));
   }))), /*#__PURE__*/React.createElement(FormItem, {
-    label: "\u7C7B\u578B"
+    label: "\u7C7B\u578B",
+    style: {
+      margin: 0
+    }
   }, /*#__PURE__*/React.createElement(_Select, {
     name: "lineMold",
     popupProps: {
@@ -197,7 +213,8 @@ function EdgeType(props) {
         return trigger.parentNode;
       }
     },
-    placeholder: " "
+    placeholder: " ",
+    className: styles.lineMoldSelect
   }, LINE_MOLD_OPTIONS.map(function (item, index) {
     return /*#__PURE__*/React.createElement(Option, {
       value: item.value,
@@ -209,7 +226,7 @@ function EdgeType(props) {
       alt: "",
       className: styles.iconImg
     }));
-  })))));
+  })))))));
 }
 
 EdgeType.defaultProps = {

package/es/core/editor/components/Toolbar/widgets/EdgeTypeButton/EdgeType.module.scss

@@ -1,10 +1,30 @@
 @import '~@alifd/next/variables.scss';
 
 .lineBox{
-  width: 236px;
   background: #FFFFFF;
   border-radius: 4px;
   margin-bottom: -7px;
+
+  .endPointSelect {
+    min-width: 0;
+    width: 64px;
+    :global {
+      .#{$css-prefix}select-inner {
+        min-width:0 !important;
+      }
+    }
+  }
+
+  .lineMoldSelect {
+    min-width: 0;
+    width: 88px;
+    :global {
+      .#{$css-prefix}select-inner {
+        min-width:0 !important;
+      }
+    }
+  }
+
   :global {
     .#{$css-prefix}form-item:first-child{
       margin-top: 0;

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

@@ -38,6 +38,15 @@ var LINE_TYPE_OPTIONS = [{
 //   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'
+  });
+}
+
 var LineType = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var value = props.value,
       onChange = props.onChange,

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

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useEffect, useState } from 'react';
-import { getEdgesBySelection, setEdgesAndChildren, setEdgesType } from "../../../../utils/edgeTypeStyleUtil";
+import { getEdgesBySelection, setEdgesType, updateEdgesData } from "../../../../utils/edgeTypeStyleUtil";
 import DropdownButton from "../components/DropdownButton";
 import WidgetBox from "../WidgetBox";
 import { EDGE_END_POINT_TYPE_MAP, LINE_MOLD_MAP } from "./constants";
@@ -52,7 +52,7 @@ function EdgeTypeButton(props) {
       return;
     }
 
-    setEdgesAndChildren(topo, edges, function (edge) {
+    updateEdgesData(topo, edges, function (edge) {
       if (name === 'startPoint') {
         // 删除设置
         ['sourceArrow', 'sourceSolidCircle', 'sourceNoneCircle'].forEach(function (iconName) {

package/es/core/editor/components/Toolbar/widgets/Layout/index.js

@@ -7,7 +7,7 @@ import React, { useState, useMemo } from 'react';
 import LayoutSettings from "./components/LayoutSettings";
 import WidgetBox from "../WidgetBox";
 import DropdownButton from "../components/DropdownButton";
-import { isGroup, isLayer } from "../../../../../../utils/htElementDataUtil";
+import { isGroup, isLayer, isNode } from "../../../../../../utils/htElementDataUtil";
 
 function Layout(props) {
   var topo = props.topo,
@@ -24,6 +24,11 @@ function Layout(props) {
       selection = _topo$store$useModelS.selection;
 
   var setDisabled = function setDisabled(data) {
+    if (topoShowType !== 'layers' && selection.length === 1) {
+      //中心节点布局，选中一个节点非分层情况下，需要星型和树形布局亮起来
+      return data == 'rectangle' || data == 'hierarchical';
+    }
+
     if (topoShowType == 'layers' && selection.length == 1 && !isGroup(selection[0])) {
       return data != 'rectangle';
     } else {
@@ -41,7 +46,11 @@ function Layout(props) {
 
 
     if (topoShowType != 'layers' && selection.length == 1) {
-      topo.getHtTopo().layoutInContainer(layouType);
+      if (layouType == 'hierarchical') {
+        topo.getHtTopo().layoutInContainer(layouType);
+      } else {
+        topo.getHtTopo().layoutTopoBySelectNode(layouType, selectionElements[0]);
+      }
     } // eslint-disable-next-line eqeqeq
 
 
@@ -56,7 +65,7 @@ function Layout(props) {
     topo.historyManager.beginTransaction();
     setLayout(v); // eslint-disable-next-line eqeqeq
 
-    if (topoShowType != 'layers' && ((_selection$ = selection[0]) === null || _selection$ === void 0 ? void 0 : _selection$.className) != 'ht.Node' || topoShowType == 'partition' && selection.length == 1 || topoShowType == 'layers' && selection.length == 1) {
+    if (topoShowType != 'layers' && ((_selection$ = selection[0]) === null || _selection$ === void 0 ? void 0 : _selection$.className) != 'ht.Node' || topoShowType == 'partition' && selection.length == 1 || topoShowType == 'layers' && selection.length == 1 || topoShowType !== 'layers' && selection.length === 1) {
       globalLayout(v);
     }
 
@@ -135,6 +144,11 @@ function isLayoutEnabled(props) {
 
   if (topoShowType !== 'layers' && !selection.length) {
     return true;
+  } //中心节点布局,选中一个节点不是分层的情况下，按钮亮起
+
+
+  if (topoShowType !== 'layers' && selection.length === 1 && (isNode(selection[0]) || isGroup(selection[0]))) {
+    return true;
   }
 
   return false;

package/es/core/editor/components/settings/common/NodeSizeInput/NodeSizeInput.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useState } from 'react';
 import PropTypes from 'prop-types';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import SizeInput from "../SizeInput";
 var NODE_SIZE_LOCK = 'NODE_SIZE_LOCK';
 /**

package/es/core/editor/components/settings/common/SizeInput/NodeSizeInput.js

@@ -4,7 +4,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _Form from "@alifd/next/es/form";
 import React, { useState } from 'react';
 import PropTypes from 'prop-types';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import NodeSizeNumberPicker from "./NodeSizeNumberPicker";
 import styles from "./NodeSizeInput.module.scss";
 var FormItem = _Form.Item;

package/es/core/editor/components/settings/propertyViews/layer/BasicSetting.js

@@ -1,7 +1,7 @@
 import _Form from "@alifd/next/es/form";
 import _extends from "@babel/runtime/helpers/extends";
 import _Field from "@alifd/next/es/field";
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import React, { useEffect } from 'react';
 import { SPECIAL_CHARACTER_FORM_ITEM_VALIDATE_PROPS, validateSpecialCharacter } from "../../../../../../utils/SpecialCharacterValidateUtil";
 import NameInput from "../../common/NameInput";

package/es/core/editor/components/settings/propertyViews/layer/SettingTab/Setting.js

@@ -5,7 +5,7 @@ import _Input from "@alifd/next/es/input";
 import _Field from "@alifd/next/es/field";
 import _Collapse from "@alifd/next/es/collapse";
 import React, { useState, useEffect } from 'react';
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import AlignSetting from "../../../common/AlignSetting"; // import BatchSetNodeSize from '../../view/BatchSetNodeSize';
 
 import { SPECIAL_CHARACTER_FORM_ITEM_VALIDATE_PROPS, validateSpecialCharacter } from "../../../../../../../utils/SpecialCharacterValidateUtil"; // import LineType from '../../../common/LineType';

package/es/core/editor/components/settings/propertyViews/view/hooks/useBackgroundSizeConfig.js

@@ -1,4 +1,4 @@
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 import { useEffect, useState } from 'react';
 import useDataModelDataPropertyChange from "../../../../../../common/hooks/ht/useDataModelDataPropertyChange";
 export default (function (props) {

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

@@ -1,6 +1,6 @@
 import hotkeys from 'hotkeys-js';
 import { useEffect } from 'react';
-import { handleCopyHotkey, handlePasteHotkey } from "../utils/copyElementUtil";
+import { destroyPasteEventListener, handleCopyHotkey, handlePasteHotkey, initPasteEventListener } from "../utils/copyElementUtil";
 
 function initKeyboardShortcuts(props) {
   var topo = props.topo,
@@ -35,8 +35,10 @@ function unbindKeyboardShortcuts(props) {
 
 export default function useKeyboardShortcut(props) {
   useEffect(function () {
+    initPasteEventListener();
     initKeyboardShortcuts(props);
     return function () {
+      destroyPasteEventListener();
       unbindKeyboardShortcuts(props);
     };
   }, []);

package/es/core/editor/store/background.js

@@ -5,7 +5,7 @@ import _regeneratorRuntime from "@babel/runtime/regenerator";
 /**
  * 背景图
  */
-import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { rlog } from '@riil-frontend/component-topology-utils';
 export default {
   // 定义 model 的初始 state
   state: {