@riil-frontend/component-topology 6.0.0-alpha.8 → 6.0.1

package/lib/core/editor/components/settings/propertyViews/box/BoxPropertyViewV1.js

@@ -0,0 +1,76 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = BoxPropertyView;
+
+var _form = _interopRequireDefault(require("@alifd/next/lib/form"));
+
+var _field = _interopRequireDefault(require("@alifd/next/lib/field"));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _collapse = _interopRequireDefault(require("@alifd/next/lib/collapse"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _useHtElement = _interopRequireDefault(require("../../../../../common/hooks/useHtElement"));
+
+var _NameInput = _interopRequireDefault(require("./NameInput"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var CollapsePanel = _collapse["default"].Panel;
+
+function parseValues(values) {
+  return (0, _extends2["default"])({}, values);
+}
+
+function BoxPropertyView(props) {
+  var topo = props.topo,
+      values = props.values,
+      _onChange = props.onChange;
+  var boxNode = (0, _useHtElement["default"])({
+    topo: topo,
+    id: values.id
+  });
+
+  var field = _field["default"].useField({
+    autoUnmount: false,
+    values: parseValues(values),
+    onChange: function onChange(name, value) {
+      var newValues = field.getValues();
+
+      _onChange(name, value, newValues);
+
+      if (name === 'attrObject.topLeftText') {
+        // 修改框名称改变名称背景块大小
+        topo.getHtTopo().setRectangleText(boxNode);
+      }
+    }
+  });
+
+  (0, _react.useEffect)(function () {
+    field.setValues(parseValues(values));
+  }, [values]);
+  return /*#__PURE__*/_react["default"].createElement(_form["default"], {
+    field: field,
+    labelAlign: "top"
+  }, /*#__PURE__*/_react["default"].createElement(_form["default"].Item, null, /*#__PURE__*/_react["default"].createElement(_collapse["default"], {
+    defaultExpandedKeys: ['标题区'],
+    style: {
+      border: 'none'
+    }
+  }, /*#__PURE__*/_react["default"].createElement(CollapsePanel, {
+    key: "\u6807\u9898\u533A",
+    title: "\u6807\u9898\u533A"
+  }, /*#__PURE__*/_react["default"].createElement(_form["default"].Item, {
+    label: "\u6807\u9898\u540D\u79F0"
+  }, /*#__PURE__*/_react["default"].createElement(_NameInput["default"], {
+    name: "attrObject.topLeftText",
+    topo: topo
+  }))))));
+}

package/lib/core/editor/components/settings/propertyViews/box/NameInput.js

@@ -5,17 +5,17 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 exports.__esModule = true;
 exports["default"] = void 0;
 
-var _input = _interopRequireDefault(require("@alifd/next/lib/input"));
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _NameInput = _interopRequireDefault(require("../../common/NameInput"));
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-var NameInput = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
+var BoxNameInput = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
   var onChange = props.onChange,
       topo = props.topo;
 
@@ -47,14 +47,15 @@ var NameInput = /*#__PURE__*/_react["default"].forwardRef(function (props, ref)
     topo.historyManager.endTransaction();
   };
 
-  return /*#__PURE__*/_react["default"].createElement(_input["default"], (0, _extends2["default"])({}, props, {
+  return /*#__PURE__*/_react["default"].createElement(_NameInput["default"], (0, _extends2["default"])({}, props, {
     ref: ref,
     value: value,
+    multipleLine: true,
     onChange: handleChange,
     onFocus: handleFocus,
     onBlur: handleBlur
   }));
 });
 
-var _default = NameInput;
+var _default = BoxNameInput;
 exports["default"] = _default;

package/lib/core/editor/components/settings/propertyViews/edge/CommonEdgePropertyView.js

@@ -3,7 +3,7 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
 exports.__esModule = true;
-exports["default"] = CommonEdgePropertyView;
+exports["default"] = void 0;
 
 var _numberPicker = _interopRequireDefault(require("@alifd/next/lib/number-picker"));
 
@@ -23,6 +23,8 @@ var _ColorPicker = _interopRequireDefault(require("../../../../../../common/comp
 
 var _LineType = _interopRequireDefault(require("../../common/LineType"));
 
+var _addEdgeProps = _interopRequireDefault(require("./addEdgeProps"));
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -62,8 +64,10 @@ function CommonEdgePropertyView(props) {
   }, [values]);
 
   var setLineColor = function setLineColor(color) {
-    var style = edge.a("styles") || {};
+    // 同时修改实线、虚线
     edge.s("edge.color", color);
+    edge.s("edge.dash.color", color);
+    var style = edge.a("styles") || {};
     edge.a("styles", (0, _extends2["default"])({}, style, {
       color: color
     }));
@@ -114,6 +118,10 @@ function CommonEdgePropertyView(props) {
     style: {
       width: "100%"
     },
+    onChange: function onChange(val) {
+      // 同时修改实线、虚线的线宽
+      edge.s('edge.dash.width', val);
+    },
     onFocus: function onFocus() {
       topo.historyManager.beginTransaction();
     },
@@ -142,4 +150,8 @@ function CommonEdgePropertyView(props) {
       }
     }
   })))), extraDisplaySetting))));
-}
+}
+
+var _default = (0, _addEdgeProps["default"])(CommonEdgePropertyView);
+
+exports["default"] = _default;

package/lib/core/editor/components/settings/propertyViews/edge/EdgeGroupPropertyView.js

@@ -3,21 +3,18 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
 exports.__esModule = true;
-exports["default"] = EdgeGroupPropertyView;
+exports["default"] = void 0;
 
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 
-var _EdgeGroupSetting = _interopRequireDefault(require("./edgeGroup/EdgeGroupSetting"));
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+var _addEdgeProps = _interopRequireDefault(require("./addEdgeProps"));
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var _EdgeGroupSetting = _interopRequireDefault(require("./edgeGroup/EdgeGroupSetting"));
 
 function EdgeGroupPropertyView(props) {
-  var topo = props.topo,
-      edge = props.edge,
-      values = props.values,
-      onChange = props.onChange,
-      editorProps = props.editorProps;
   return /*#__PURE__*/_react["default"].createElement(_EdgeGroupSetting["default"], props);
-}
+}
+
+var _default = (0, _addEdgeProps["default"])(EdgeGroupPropertyView);
+
+exports["default"] = _default;

package/lib/core/editor/components/settings/propertyViews/edge/EdgePropertyView.js

@@ -11,8 +11,6 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _useHtElement = _interopRequireDefault(require("../../../../../common/hooks/useHtElement"));
 
-var _CommonEdgePropertyView = _interopRequireDefault(require("./CommonEdgePropertyView"));
-
 var _EdgeGroupPropertyView = _interopRequireDefault(require("./EdgeGroupPropertyView"));
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -20,7 +18,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 var commonViews = {
-  edge: _CommonEdgePropertyView["default"],
   edgeGroup: _EdgeGroupPropertyView["default"]
 };
 /**
@@ -30,31 +27,18 @@ var commonViews = {
 function EdgePropertyViewRoute(props) {
   var topo = props.topo,
       values = props.values,
+      selectionElement = props.selectionElement,
       editorProps = props.editorProps;
-  var edge = (0, _useHtElement["default"])({
-    topo: topo,
-    id: values.id
-  });
+  var edge = selectionElement;
   var type;
 
-  if (edge.isEdgeGroupAgent()) {
-    if (editorProps.getEdgeGroupPropertyViewType) {
-      type = editorProps.getEdgeGroupPropertyViewType((0, _extends2["default"])({}, props, {
-        edge: edge
-      }));
-    }
-
-    type = type || "edgeGroup";
-  } else {
-    if (editorProps.getEdgePropertyViewType) {
-      type = editorProps.getEdgePropertyViewType((0, _extends2["default"])({}, props, {
-        edge: edge
-      }));
-    }
-
-    type = type || "edge";
+  if (editorProps.getEdgePropertyViewType) {
+    type = editorProps.getEdgePropertyViewType((0, _extends2["default"])({}, props, {
+      edge: edge
+    }));
   }
 
+  type = type || 'edge';
   var views = (0, _extends2["default"])({}, commonViews, editorProps.edgePropertyViews || {});
   var View = views[type];
 

package/lib/core/editor/components/settings/propertyViews/edge/addEdgeProps.js

@@ -0,0 +1,19 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = addEdgeProps;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+function addEdgeProps(Component) {
+  return function AdapterEdgeProps(props) {
+    var selectionElement = props.selectionElement;
+    return /*#__PURE__*/_react["default"].createElement(Component, (0, _extends2["default"])({}, props, {
+      edge: selectionElement
+    }));
+  };
+}

package/lib/core/editor/components/settings/propertyViews/edge/edgeGroup/EdgeGroupSetting.js

@@ -30,13 +30,12 @@ function parseValues(values) {
 function EdgeGroupSetting(props) {
   var topo = props.topo,
       edge = props.edge,
-      values = props.values,
       _onChange = props.onChange,
       editorProps = props.editorProps;
 
   var field = _field["default"].useField({
     autoUnmount: false,
-    values: parseValues(values),
+    values: {},
     onChange: function onChange(name, value) {
       var newValues = field.getValues();
 
@@ -44,10 +43,6 @@ function EdgeGroupSetting(props) {
     }
   });
 
-  (0, _react.useEffect)(function () {
-    field.setValues(parseValues(values));
-  }, [values]);
-
   var setLineColor = function setLineColor(color) {
     var style = edge.a('styles') || {};
     edge.s('edge.color', color);

package/lib/core/editor/components/settings/propertyViews/group/GroupPropertyView.js

@@ -5,46 +5,35 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 exports.__esModule = true;
 exports["default"] = GroupPropertyView;
 
-var _tab = _interopRequireDefault(require("@alifd/next/lib/tab"));
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
 var _react = _interopRequireDefault(require("react"));
 
-var _TabView = _interopRequireDefault(require("../../common/tab/TabView"));
-
-var _GroupPropertyViewModule = _interopRequireDefault(require("./GroupPropertyView.module.scss"));
-
-var _useGroup = _interopRequireDefault(require("./hooks/useGroup"));
-
-var _Setting = _interopRequireDefault(require("./SettingTab/Setting"));
+var _ClusterGroupRelateData = _interopRequireDefault(require("./cluster/ClusterGroupRelateData"));
 
 var _RelateData = _interopRequireDefault(require("./DataTab/RelateData"));
 
-var _ClusterGroupRelateData = _interopRequireDefault(require("./cluster/ClusterGroupRelateData"));
+var _GroupBasicSetting = _interopRequireDefault(require("./SettingTab/GroupBasicSetting"));
+
+var _GroupPropertyViewModule = _interopRequireDefault(require("./GroupPropertyView.module.scss"));
 
 function GroupPropertyView(props) {
   var topo = props.topo,
       topoEdit = props.topoEdit,
       values = props.values,
-      onChange = props.onChange,
-      settingRuntimeState = props.settingRuntimeState,
-      editorProps = props.editorProps;
-  var group = (0, _useGroup["default"])({
-    topo: topo,
-    id: values.id
-  });
+      selectionElement = props.selectionElement;
+  var group = selectionElement;
   var isCluster = group.a('cluster');
   var DataTabContent = isCluster ? _ClusterGroupRelateData["default"] : _RelateData["default"];
-  return /*#__PURE__*/_react["default"].createElement(_TabView["default"], null, /*#__PURE__*/_react["default"].createElement(_tab["default"].Item, {
-    title: "\u6570\u636E",
-    key: "1"
-  }, /*#__PURE__*/_react["default"].createElement(DataTabContent, (0, _extends2["default"])({
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: _GroupPropertyViewModule["default"].GroupPropertyView
+  }, /*#__PURE__*/_react["default"].createElement(_GroupBasicSetting["default"], (0, _extends2["default"])({
     group: group
-  }, props))), /*#__PURE__*/_react["default"].createElement(_tab["default"].Item, {
-    title: "\u8BBE\u7F6E",
-    key: "2"
-  }, /*#__PURE__*/_react["default"].createElement(_Setting["default"], (0, _extends2["default"])({
+  }, props, {
+    isCluster: isCluster
+  })), /*#__PURE__*/_react["default"].createElement("div", {
+    className: _GroupPropertyViewModule["default"].data
+  }, /*#__PURE__*/_react["default"].createElement(DataTabContent, (0, _extends2["default"])({
     group: group
   }, props))));
 }

package/lib/core/editor/components/settings/propertyViews/group/GroupPropertyView.module.scss

@@ -1,3 +1,10 @@
 .GroupPropertyView {
-  
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+
+  .data {
+    flex: 1;
+    overflow: auto;
+  }
 }

package/lib/core/editor/components/settings/propertyViews/group/GroupPropertyViewV1.js

@@ -0,0 +1,43 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = GroupPropertyView;
+
+var _tab = _interopRequireDefault(require("@alifd/next/lib/tab"));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _TabView = _interopRequireDefault(require("../../common/tab/TabView"));
+
+var _GroupPropertyViewModule = _interopRequireDefault(require("./GroupPropertyView.module.scss"));
+
+var _Setting = _interopRequireDefault(require("./SettingTab/Setting"));
+
+var _RelateData = _interopRequireDefault(require("./DataTab/RelateData"));
+
+var _ClusterGroupRelateData = _interopRequireDefault(require("./cluster/ClusterGroupRelateData"));
+
+function GroupPropertyView(props) {
+  var topo = props.topo,
+      topoEdit = props.topoEdit,
+      values = props.values,
+      selectionElement = props.selectionElement;
+  var group = selectionElement;
+  var isCluster = group.a('cluster');
+  var DataTabContent = isCluster ? _ClusterGroupRelateData["default"] : _RelateData["default"];
+  return /*#__PURE__*/_react["default"].createElement(_TabView["default"], null, /*#__PURE__*/_react["default"].createElement(_tab["default"].Item, {
+    title: "\u6570\u636E",
+    key: "1"
+  }, /*#__PURE__*/_react["default"].createElement(DataTabContent, (0, _extends2["default"])({
+    group: group
+  }, props))), /*#__PURE__*/_react["default"].createElement(_tab["default"].Item, {
+    title: "\u8BBE\u7F6E",
+    key: "2"
+  }, /*#__PURE__*/_react["default"].createElement(_Setting["default"], (0, _extends2["default"])({
+    group: group
+  }, props))));
+}

package/lib/core/editor/components/settings/propertyViews/group/SettingTab/GroupBasicSetting.js

@@ -0,0 +1,98 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = GroupBasicSetting;
+
+var _form = _interopRequireDefault(require("@alifd/next/lib/form"));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _field = _interopRequireDefault(require("@alifd/next/lib/field"));
+
+var _collapse = _interopRequireDefault(require("@alifd/next/lib/collapse"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _NodeSizeInput = _interopRequireDefault(require("../../../common/NodeSizeInput/NodeSizeInput"));
+
+var _GroupIconSelect = _interopRequireDefault(require("./GroupIconSelect"));
+
+var _GroupExpandStatus = _interopRequireDefault(require("./GroupExpandStatus"));
+
+var _GroupExpandSetting = _interopRequireDefault(require("./GroupExpandSetting"));
+
+var _SpecialCharacterValidateUtil = require("../../../../../../../utils/SpecialCharacterValidateUtil");
+
+var _NameInput = _interopRequireDefault(require("../../../common/NameInput"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var CollapsePanel = _collapse["default"].Panel;
+
+function GroupBasicSetting(props) {
+  var topo = props.topo,
+      topoEdit = props.topoEdit,
+      values = props.values,
+      _onChange = props.onChange,
+      settingRuntimeState = props.settingRuntimeState,
+      editorProps = props.editorProps,
+      group = props.group,
+      isCluster = props.isCluster;
+  var expanded = values.expanded;
+  var id = values.id;
+
+  var field = _field["default"].useField({
+    autoUnmount: false,
+    values: values,
+    onChange: function onChange(name, value) {
+      if (name === 'attrObject.name' && !(0, _SpecialCharacterValidateUtil.validateSpecialCharacter)(value)) {
+        return;
+      }
+
+      var newValues = field.getValues();
+
+      _onChange(name, value, newValues);
+    }
+  });
+
+  (0, _react.useEffect)(function () {
+    field.setValues(values);
+  }, [values]);
+  return /*#__PURE__*/_react["default"].createElement(_form["default"], {
+    field: field,
+    labelAlign: "top",
+    style: {
+      paddingLeft: 32,
+      paddingRight: 16,
+      marginTop: 12
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_form["default"].Item, null, /*#__PURE__*/_react["default"].createElement(_form["default"].Item, (0, _extends2["default"])({
+    label: isCluster ? '集群名称' : '区域名称'
+  }, _SpecialCharacterValidateUtil.SPECIAL_CHARACTER_FORM_ITEM_VALIDATE_PROPS, {
+    patternTrigger: "onChange"
+  }), /*#__PURE__*/_react["default"].createElement(_NameInput["default"], {
+    name: "attrObject.name",
+    multipleLine: true,
+    maxLength: 30,
+    placeholder: "\u8BF7\u8F93\u5165",
+    onFocus: function onFocus() {
+      topo.historyManager.beginTransaction();
+    },
+    onBlur: function onBlur() {
+      topo.historyManager.endTransaction();
+    }
+  })), /*#__PURE__*/_react["default"].createElement(_form["default"].Item, {
+    label: "\u9ED8\u8BA4\u663E\u793A\u65B9\u5F0F"
+  }, /*#__PURE__*/_react["default"].createElement(_GroupExpandStatus["default"], {
+    topo: topo,
+    group: group,
+    expanded: expanded,
+    setExpanded: function setExpanded(val) {
+      return group.setExpanded(val);
+    }
+  }))));
+}

package/lib/core/editor/components/settings/propertyViews/group/SettingTab/GroupExpandSetting.js

@@ -41,15 +41,17 @@ function GroupExpandSetting(props) {
     topo.historyManager.beginTransaction(); // console.log("setAlignmentBySelectionNodes", v);
     // topo.view.topoClient.htTopoClient.setAlignmentBySelectionNodes(v);
 
-    onChange("groupAlign", v); // topoEditApi.setAlignmentBySelectionNodes(v);
+    onChange('groupAlign', v); // topoEditApi.setAlignmentBySelectionNodes(v);
 
     topo.historyManager.endTransaction();
   };
 
-  var layoutOnChange = function layoutOnChange(v) {
+  var layoutOnChange = function layoutOnChange(value) {
     topo.historyManager.beginTransaction();
-    setLayout(v);
-    onChange("layout", v);
+    setLayout(value); // onChange("layout", v);
+
+    var layouType = value.id === 'toward' ? "" + value.id + value.options.subId : value.id;
+    topo.getHtTopo().layoutInContainer(layouType);
     topo.historyManager.endTransaction();
   };
 
@@ -58,9 +60,9 @@ function GroupExpandSetting(props) {
     setLayout({}); // onChange("layout", {});
   }, [id]);
   return /*#__PURE__*/_react["default"].createElement(_collapse["default"], {
-    defaultExpandedKeys: ["布局", "显示设置", "对齐方式"],
+    defaultExpandedKeys: ['布局', '显示设置', '对齐方式'],
     style: {
-      border: "none"
+      border: 'none'
     }
   }, /*#__PURE__*/_react["default"].createElement(CollapsePanel, {
     key: "\u5E03\u5C40",
@@ -89,13 +91,5 @@ function GroupExpandSetting(props) {
     setExpanded: function setExpanded(val) {
       return group.setExpanded(val);
     }
-  }))), /*#__PURE__*/_react["default"].createElement(CollapsePanel, {
-    key: "\u5BF9\u9F50\u65B9\u5F0F",
-    title: "\u5BF9\u9F50\u65B9\u5F0F"
-  }, /*#__PURE__*/_react["default"].createElement(_form["default"].Item, {
-    label: ""
-  }, /*#__PURE__*/_react["default"].createElement(_AlignSetting["default"], {
-    onChange: alignOnChange,
-    selected: "left"
   }))));
 }

package/lib/core/editor/components/settings/propertyViews/group/cluster/ClusterGroupRelateData.js

@@ -11,14 +11,14 @@ var _form = _interopRequireDefault(require("@alifd/next/lib/form"));
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _componentNoDataPage = _interopRequireDefault(require("@riil-frontend/component-no-data-page"));
+
 var _GroupNodeList = _interopRequireDefault(require("../DataTab/GroupNodeList"));
 
 var _Panel = _interopRequireDefault(require("../../../../../../../components/collapse/Panel"));
 
 var _NodeRelateResourceButton = _interopRequireDefault(require("../../node/data/NodeRelateResourceButton"));
 
-var _componentNoDataPage = _interopRequireDefault(require("@riil-frontend/component-no-data-page"));
-
 var _CollapseFullheightModule = _interopRequireDefault(require("../../../common/GroupNodeList/CollapseFullheight.module.scss"));
 
 var _textModule = _interopRequireDefault(require("../../../../../../common/text.module.scss"));
@@ -64,12 +64,13 @@ function ClusterGroupRelateData(props) {
     key: "\u76F8\u5173\u8D44\u6E90",
     title: "\u76F8\u5173\u8D44\u6E90"
   }, /*#__PURE__*/_react["default"].createElement(_form["default"], {
-    labelAlign: "top"
-  }, /*#__PURE__*/_react["default"].createElement(_form["default"].Item, {
-    label: "\u5173\u8054\u8D44\u6E90",
+    labelAlign: "top",
     style: {
-      marginBottom: 4
+      marginTop: -4,
+      marginBottom: -12
     }
+  }, /*#__PURE__*/_react["default"].createElement(_form["default"].Item, {
+    label: "\u5173\u8054\u8D44\u6E90"
   }, /*#__PURE__*/_react["default"].createElement("div", {
     style: {
       display: 'flex'
@@ -79,7 +80,8 @@ function ClusterGroupRelateData(props) {
     style: {
       flex: 1,
       paddingRight: 16,
-      color: '#4D6277'
+      color: '#4D6277',
+      lineHeight: '20px'
     },
     title: values.tag ? values.name : null
   }, values.tag ? values.name : '—'), /*#__PURE__*/_react["default"].createElement(_NodeRelateResourceButton["default"], {

package/lib/core/editor/components/settings/propertyViews/index.js

@@ -11,24 +11,19 @@ var _LayerPropertyView = _interopRequireDefault(require("./layer/LayerPropertyVi
 
 var _TextPropertyView = _interopRequireDefault(require("./text/TextPropertyView"));
 
-var _ViewPropertyView = _interopRequireDefault(require("./view/ViewPropertyView"));
-
 var _GroupPropertyView = _interopRequireDefault(require("./group/GroupPropertyView"));
 
-var _MultipleElementPropertyView = _interopRequireDefault(require("./multipleElements/MultipleElementPropertyView"));
-
-var _EdgePropertyView = _interopRequireDefault(require("./edge/EdgePropertyView"));
-
 var _BoxPropertyView = _interopRequireDefault(require("./box/BoxPropertyView"));
 
 var propertyPanelMap = {
-  view: _ViewPropertyView["default"],
+  // view: ViewPropertyView,
   group: _GroupPropertyView["default"],
   node: _NodePropertyView["default"],
-  edge: _EdgePropertyView["default"],
+  // edge: EdgePropertyView,
+  // edgeGroup: EdgeGroupPropertyView,
   layer: _LayerPropertyView["default"],
   text: _TextPropertyView["default"],
-  multiple: _MultipleElementPropertyView["default"],
+  // multiple: MultipleElementPropertyView,
   box: _BoxPropertyView["default"]
 };