@riil-frontend/component-topology 6.0.0-alpha.5 → 6.0.0-alpha.50

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

@@ -124,14 +124,14 @@ function NodeSizeInput(props) {
     return val ? Math.round(val) : val;
   }
 
-  return /*#__PURE__*/_react["default"].createElement(_SizeInput["default"], {
+  return /*#__PURE__*/_react["default"].createElement(_SizeInput["default"], (0, _extends3["default"])({}, props, {
     value: value,
     lock: lock,
     max: max,
     step: step,
     onChange: handleChange,
     onLockChange: switchLock
-  });
+  }));
 }
 
 NodeSizeInput.propTypes = {

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

@@ -9,27 +9,23 @@ var _box = _interopRequireDefault(require("@alifd/next/lib/box"));
 
 var _extends3 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
-var _grid = _interopRequireDefault(require("@alifd/next/lib/grid"));
-
 var _form = _interopRequireDefault(require("@alifd/next/lib/form"));
 
 var _react = _interopRequireWildcard(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
+var _rlog = _interopRequireDefault(require("@riil-frontend/component-topology-utils/es/rlog"));
+
 var _NodeSizeNumberPicker = _interopRequireDefault(require("./NodeSizeNumberPicker"));
 
 var _NodeSizeInputModule = _interopRequireDefault(require("./NodeSizeInput.module.scss"));
 
-var _rlog = _interopRequireDefault(require("@riil-frontend/component-topology-utils/es/rlog"));
-
 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 FormItem = _form["default"].Item;
-var Row = _grid["default"].Row,
-    Col = _grid["default"].Col;
 /**
  * 节点大小组件
  *
@@ -42,11 +38,13 @@ function SizeInput(props) {
       max = props.max,
       step = props.step,
       onChange = props.onChange,
-      lock = props.lock,
-      onLockChange = props.onLockChange,
       _props$showLabel = props.showLabel,
       showLabel = _props$showLabel === void 0 ? true : _props$showLabel,
-      size = props.size;
+      numberPickerProps = props.numberPickerProps,
+      size = props.size,
+      lock = props.lock,
+      disabled = props.disabled,
+      onLockChange = props.onLockChange;
 
   var handleChange = function handleChange(name, attrValue) {
     var _extends2;
@@ -64,6 +62,18 @@ function SizeInput(props) {
     return val ? Math.round(val) : val;
   }
 
+  var renderLock = function renderLock() {
+    var imgSrc = "/img/topo/editor/toolbar/" + (lock ? 'lock' : 'unlock') + "/" + (disabled ? 'Disable' : 'Normal') + ".svg";
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: _NodeSizeInputModule["default"].lockBtn,
+      onClick: switchLock
+    }, /*#__PURE__*/_react["default"].createElement("img", {
+      src: imgSrc,
+      alt: "",
+      width: 12
+    }));
+  };
+
   return /*#__PURE__*/_react["default"].createElement(_form["default"], {
     labelAlign: "top",
     component: "div",
@@ -84,27 +94,24 @@ function SizeInput(props) {
     style: {
       marginBottom: 0
     }
-  }, /*#__PURE__*/_react["default"].createElement(_NodeSizeNumberPicker["default"], {
+  }, /*#__PURE__*/_react["default"].createElement(_NodeSizeNumberPicker["default"], (0, _extends3["default"])({
     value: parseValue(value.width),
     label: showLabel ? '宽:' : '',
+    innerAfter: showLabel ? undefined : 'W',
     min: 1,
     max: max,
     step: step,
+    disabled: disabled,
     placeholder: "\u8BF7\u8F93\u5165",
-    size: size,
+    size: size
+  }, numberPickerProps, {
     style: {
       width: '100%'
     },
     onChange: function onChange(val) {
       return handleChange('width', val);
     }
-  }))), /*#__PURE__*/_react["default"].createElement("div", {
-    className: _NodeSizeInputModule["default"].lockBtn,
-    onClick: switchLock
-  }, /*#__PURE__*/_react["default"].createElement("img", {
-    src: require(lock ? './img/icon_锁.svg' : './img/icon_解锁.svg'),
-    alt: ""
-  })), /*#__PURE__*/_react["default"].createElement("div", {
+  })))), renderLock(), /*#__PURE__*/_react["default"].createElement("div", {
     style: {
       flex: 1
     }
@@ -114,22 +121,24 @@ function SizeInput(props) {
     style: {
       marginBottom: 0
     }
-  }, /*#__PURE__*/_react["default"].createElement(_NodeSizeNumberPicker["default"], {
+  }, /*#__PURE__*/_react["default"].createElement(_NodeSizeNumberPicker["default"], (0, _extends3["default"])({
     value: parseValue(value.height),
-    label: showLabel ? '高:' : '' // addonTextAfter="H"
-    ,
+    label: showLabel ? '高:' : '',
+    innerAfter: showLabel ? undefined : 'H',
     min: 1,
     max: max,
     step: step,
+    disabled: disabled,
     placeholder: "\u8BF7\u8F93\u5165",
-    size: size,
+    size: size
+  }, numberPickerProps, {
     style: {
       width: '100%'
     },
     onChange: function onChange(val) {
       return handleChange('height', val);
     }
-  }))))));
+  })))))));
 }
 
 SizeInput.propTypes = {

package/lib/core/editor/components/settings/common/SizeInput/NodeSizeNumberPicker.js

@@ -13,7 +13,7 @@ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runt
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _excluded = ["value", "onChange", "min", "onBlur", "onKeyDown"];
+var _excluded = ["value", "onChange", "min", "onBlur", "onKeyDown", "disabled"];
 
 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); }
 
@@ -31,6 +31,7 @@ function NodeSizeNumberPicker(props) {
       min = props.min,
       onBlur = props.onBlur,
       onKeyDown = props.onKeyDown,
+      disabled = props.disabled,
       otherProps = (0, _objectWithoutPropertiesLoose2["default"])(props, _excluded);
 
   var _useState = (0, _react.useState)(value),
@@ -63,13 +64,13 @@ function NodeSizeNumberPicker(props) {
 
   var handleChange = function handleChange(value, e) {
     // 失去焦点最大最小值
-    if (e.type === 'blur') {
+    if (e.type === "blur") {
       onChange(!value ? min : value);
       return;
     } // 加减号立即变更
 
 
-    if (e.triggerType === 'up' || e.triggerType === 'down') {
+    if (e.triggerType === "up" || e.triggerType === "down") {
       onChange(value);
       return;
     }
@@ -80,10 +81,9 @@ function NodeSizeNumberPicker(props) {
   return /*#__PURE__*/_react["default"].createElement(_numberPicker["default"], (0, _extends2["default"])({}, otherProps, {
     value: inputValue,
     min: min,
+    disabled: disabled,
     onChange: handleChange,
     onBlur: handleBlur,
     onKeyDown: handleKeyDown
   }));
-}
-
-;
+}

package/lib/core/editor/components/settings/common/text/fontStyleUtil.js

@@ -9,17 +9,17 @@ var fontStyleUtil = {
       font = '';
     }
 
-    var arr = font.trim().split(' ');
+    var str = font.trim();
     var bold = font.indexOf('bold') > -1;
     var italic = font.indexOf('italic') > -1;
-    var fontFamily, fontSize;
-
-    if (arr.length) {
-      fontFamily = arr[arr.length - 1];
-    }
-
-    if (arr.length >= 2) {
-      fontSize = parseInt(arr[arr.length - 2].replace('px', ''), 10);
+    str = str.trim().replace('bold ', '').trim().replace('italic ', '').trim();
+    var arr = str.split(' ');
+    var fontSizeStr = arr[0];
+    var fontFamily = str.replace(fontSizeStr, '').trim() || null;
+    var fontSize = null;
+
+    if (fontSizeStr) {
+      fontSize = parseInt(fontSizeStr.replace('px', ''), 10);
     }
 
     return {
@@ -31,17 +31,9 @@ var fontStyleUtil = {
   },
   // 字体样式格式: bold italic 12px 黑体 或 12px 黑体
   build: function build(style) {
-    var font = '';
-
-    if (style.font.bold) {
-      font += 'bold ';
-    }
-
-    if (style.font.italic) {
-      font += 'italic ';
-    }
-
-    return "" + font + style.font.fontSize + "px " + style.font.fontFamily;
+    return [style.bold ? 'bold' : null, style.italic ? 'italic' : null, style.fontSize ? style.fontSize + "px" : null, style.fontFamily].filter(function (item) {
+      return item !== null;
+    }).join(' ');
   },
   getFontStyleMap: function getFontStyleMap(obj, prefix) {
     var map = {};

package/lib/core/editor/components/settings/core/PropertyViewManager.js

@@ -0,0 +1,77 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _propertyViews = _interopRequireDefault(require("../propertyViews"));
+
+var _getPropertyViewType = _interopRequireDefault(require("./getPropertyViewType"));
+
+var PropertyViewManager = /*#__PURE__*/function () {
+  function PropertyViewManager(topo) {
+    this.viewMap = _propertyViews["default"];
+    this.topo = void 0;
+    this.getPropertyViewType = _getPropertyViewType["default"];
+    this.topo = topo;
+    this.open = this.open.bind(this);
+  }
+
+  var _proto = PropertyViewManager.prototype;
+
+  _proto.updateViews = function updateViews(viewMap) {
+    Object.assign(this.viewMap, viewMap);
+  };
+
+  _proto.init = function init() {
+    var notifier = this.topo.getHtTopo().getNotifier();
+    notifier.on('topo_element_double_click', this.open);
+  };
+
+  _proto.destroy = function destroy() {
+    var _this$topo$getHtTopo;
+
+    var notifier = (_this$topo$getHtTopo = this.topo.getHtTopo()) === null || _this$topo$getHtTopo === void 0 ? void 0 : _this$topo$getHtTopo.getNotifier();
+
+    if (!notifier) {
+      return;
+    }
+
+    notifier.off('topo_element_double_click', this.open);
+  };
+
+  _proto.open = function open() {
+    var view = this.getPropertyView();
+
+    if (!view) {
+      return;
+    }
+
+    var topoEditDispatchers = this.topo.store.getModelDispatchers('topoEdit');
+    topoEditDispatchers.update({
+      propertyPanelVisible: true
+    });
+  };
+
+  _proto.close = function close() {
+    var topoEditDispatchers = this.topo.store.getModelDispatchers('topoEdit');
+    topoEditDispatchers.update({
+      propertyPanelVisible: false
+    });
+  };
+
+  _proto.getPropertyView = function
+    /* selection */
+  getPropertyView() {
+    var selection = this.topo.selectionModel.getSelection();
+    var elementType = (0, _getPropertyViewType["default"])(selection);
+    var PropertyView = this.viewMap[elementType];
+    return PropertyView;
+  };
+
+  return PropertyViewManager;
+}();
+
+var _default = PropertyViewManager;
+exports["default"] = _default;

package/lib/core/editor/components/settings/core/getPropertyViewType.js

@@ -0,0 +1,40 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _htElementUtils = require("../../../../../utils/htElementUtils");
+
+function getPropertyViewType(selection) {
+  var selectionElement = selection[0];
+  var selectionSize = selection.length;
+  var viewType;
+
+  if (!selectionSize) {
+    // 未选
+    viewType = 'view';
+  } else if (selectionSize >= 2) {
+    // 多选
+    viewType = 'multiple';
+  } else if ((0, _htElementUtils.isText)(selectionElement)) {
+    viewType = 'text';
+  } else if ((0, _htElementUtils.isGroup)(selectionElement)) {
+    viewType = 'group';
+  } else if (selectionElement.a('type') === 'box') {
+    viewType = 'box';
+  } else if ((0, _htElementUtils.isNode)(selectionElement)) {
+    viewType = 'node';
+  } else if ((0, _htElementUtils.isEdgeGroupAgent)(selectionElement)) {
+    viewType = 'edgeGroup';
+  } else if ((0, _htElementUtils.isEdge)(selectionElement)) {
+    viewType = 'edge';
+  } else if ((0, _htElementUtils.isLayer)(selectionElement)) {
+    // 分层
+    viewType = 'layer';
+  }
+
+  return viewType;
+}
+
+var _default = getPropertyViewType;
+exports["default"] = _default;

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

@@ -0,0 +1,27 @@
+"use strict";
+
+exports.__esModule = true;
+exports["default"] = updateElementProperty;
+
+function updateElementProperty(topo, name, value) {
+  // const element = topo.getDataModel().getDataById(selection[0].id);
+  var element = topo.getSelectionModel().getFirstData(); // console.info("updateElementProperty",topo.getSelectionModel().getSelection(), { selection, element, name, value });
+
+  if (name.startsWith('attrObject.')) {
+    element.setAttr(name.replace('attrObject.', ''), value);
+  } else if (name.startsWith('position.')) {
+    element.setPosition(name.replace('position.', ''), value);
+  } else if (name.startsWith('styleMap.')) {
+    element.setStyle(name.replace('styleMap.', ''), value);
+  } else if (name === 'name') {
+    element.setName(value);
+  } else if (name === 'width') {
+    element.setWidth(value);
+  } else if (name === 'height') {
+    element.setHeight(value);
+  } else if (name === 'image') {
+    element.setImage(value);
+  }
+}
+
+;

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

@@ -32,11 +32,9 @@ function parseValues(values) {
 function BoxPropertyView(props) {
   var topo = props.topo,
       values = props.values,
-      _onChange = props.onChange;
-  var boxNode = (0, _useHtElement["default"])({
-    topo: topo,
-    id: values.id
-  });
+      _onChange = props.onChange,
+      selectionElement = props.selectionElement;
+  var boxNode = selectionElement;
 
   var field = _field["default"].useField({
     autoUnmount: false,
@@ -58,19 +56,14 @@ function BoxPropertyView(props) {
   }, [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: ['标题区'],
+    labelAlign: "top",
     style: {
-      border: 'none'
+      margin: '12px 16px 0 32px'
     }
-  }, /*#__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/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;