@fonixtree/magic-design 0.0.62 → 0.0.64

package/es/common/Collapse/index.js

@@ -94,19 +94,7 @@ function (_super) {
         return;
       }
 
-      var activeItem = source.find(function (src) {
-        return src.active;
-      });
-
-      if (activeItem) {
-        actives.push(activeItem.key);
-
-        _this.setState({
-          activeKey: actives
-        });
-
-        return;
-      } else if (type === 'switch') {
+      if (type === 'switch') {
         var first = source.find(function (src) {
           var _a;
 
@@ -120,6 +108,13 @@ function (_super) {
 
           actives.push(((_b = first.metaOption) === null || _b === void 0 ? void 0 : _b.id) || first.key);
         }
+      } else if (type === 'triangle' && _mobx.store.clickedMeta && !_mobx.store.clickedGroup) {
+        var activeItem = source.find(function (src) {
+          var _a, _b;
+
+          return JSON.stringify(((_b = (_a = src.value) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.panelProps) || '').includes(_mobx.store.clickedMeta);
+        });
+        actives.push(activeItem === null || activeItem === void 0 ? void 0 : activeItem.key);
       } else {
         var first = source.find(function (src) {
           var _a;

package/es/composite-comp/bol/components/ImageText/mobile/index.js

@@ -102,8 +102,7 @@ function (_super) {
   ImageTextMobile.prototype.render = function () {
     var _this = this;
 
-    var data = this.props.data; // const { ready } = this.state;
-    // console.log('----imagetext mobile', data);
+    var data = this.props.data; // console.log('----imagetext mobile', data);
 
     var wrapStyle = {};
     wrapStyle.textAlign = data.customize.align; // if (data.background.bgType === 'color') {

package/es/composite-comp/bol/components/ImageText/mobile/index.less

@@ -59,8 +59,8 @@
         }
         .card-btn-wrap {
           display: flex;
-          .card-first-btn {
-            margin-right: 12px;
+          .card-second-btn {
+            margin-left: 12px;
           }
         }
       }
@@ -94,8 +94,8 @@
         }
         .card-btn-wrap {
           display: flex;
-          .card-first-btn {
-            margin-right: 12px;
+          .card-second-btn {
+            margin-left: 12px;
           }
         }
       }
@@ -135,8 +135,8 @@
         flex-direction: column;
       }
 
-      .card-second-btn {
-        margin-top: 8px;
+      .card-first-btn, .card-second-btn {
+        margin-bottom: 8px;
       }
     }
     .card-margin-bottom {
@@ -170,8 +170,8 @@
         }
         .card-btn-wrap {
           display: flex;
-          .card-first-btn {
-            margin-right: 12px;
+          .card-second-btn {
+            margin-left: 12px;
           }
         }
       }

package/es/composite-comp/bol/components/ImageText/pc/index.js

@@ -11,6 +11,8 @@ require("./index.less");
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
+var _lodash = require("lodash");
+
 var _AlignSelector = require("../../../../../common/AlignSelector");
 
 var _components = require("../../../../../meta-comp/components");
@@ -63,7 +65,7 @@ var __assign = void 0 && (void 0).__assign || function () {
 
 var maxWidthAndHeight = {
   normal: 410,
-  outside: 100,
+  outside: 86,
   center: 410
 };
 
@@ -76,17 +78,26 @@ function (_super) {
     var _this = _super !== null && _super.apply(this, arguments) || this;
 
     _this.state = {
-      hoverIndex: -1
-    }; // componentDidMount() {
-    //   this.distroy = autorun(() => {
-    //     this.setState({
-    //       clickedGroup: store.clickedGroup,
-    //     });
-    //   });
-    // }
-    // componentWillUnmount() {
-    //   this.distroy();
-    // }
+      hoverIndex: -1,
+      currentMaxWidth: 410
+    };
+
+    _this.listenCardWidth = function () {
+      var _a;
+
+      var data = _this.props.data;
+
+      try {
+        var cardWidth = ((_a = document.querySelector('.group-wrap .one-card')) === null || _a === void 0 ? void 0 : _a.offsetWidth) - 40;
+        var maxLayoutWidth = maxWidthAndHeight[data.customize.layout.pcLayout];
+
+        _this.setState({
+          currentMaxWidth: Math.min(cardWidth, maxLayoutWidth)
+        });
+      } catch (error) {
+        console.log(error);
+      }
+    };
 
     _this.calcWidth = function (num) {
       return (100 - (num - 1) * 2) / num + "%";
@@ -114,14 +125,31 @@ function (_super) {
     return _this;
   }
 
+  ImageTextPc.prototype.componentDidMount = function () {
+    var data = this.props.data;
+    this.layout = data.customize.layout.pcLayout;
+    this.listenCardWidth();
+    window.addEventListener('resize', (0, _lodash.debounce)(this.listenCardWidth));
+  };
+
+  ImageTextPc.prototype.componentWillUnmount = function () {
+    window.removeEventListener('resize', this.listenCardWidth);
+  };
+
+  ImageTextPc.prototype.componentWillReceiveProps = function (nextProps) {
+    if (nextProps.data.customize.layout.pcLayout !== this.layout) {
+      this.layout = nextProps.data.customize.layout.pcLayout;
+      this.listenCardWidth();
+    }
+  };
+
   ImageTextPc.prototype.render = function () {
     var _this = this;
 
     var data = this.props.data;
-    var hoverIndex = this.state.hoverIndex; // console.log('====================================');
-    // console.log(data);
-    // console.log('====================================');
-
+    var _a = this.state,
+        hoverIndex = _a.hoverIndex,
+        currentMaxWidth = _a.currentMaxWidth;
     var wrapStyle = {};
     wrapStyle.alignItems = _AlignSelector.alignItemMap[data.customize.align];
     return /*#__PURE__*/_react["default"].createElement("div", {
@@ -156,7 +184,7 @@ function (_super) {
         data: hoverIndex == i ? source.hover.image : source.image,
         limitWidthHeight: true,
         maxHeight: maxWidthAndHeight[data.customize.layout.pcLayout],
-        maxWidth: maxWidthAndHeight[data.customize.layout.pcLayout],
+        maxWidth: currentMaxWidth,
         scale: 0.5
       })), (source.title.open && data.customize.layout.pcLayout !== 'center' && hoverIndex != i || hoverIndex == i && source.hover.title.open && data.customize.layout.pcLayout !== 'center') && /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
         className: "card-title",

package/es/composite-comp/bol/config-panels/ImageTextConfig/index.js

@@ -164,7 +164,7 @@ function (_super) {
         }),
         metaOption: data.groupSource
       }, {
-        key: '2',
+        key: 'imageText3',
         name: (0, _locale.i18n)('SPACING'),
         value: /*#__PURE__*/_react["default"].createElement(_SpacingConfig["default"], {
           data: data.spacing
@@ -173,6 +173,7 @@ function (_super) {
         key: 'imageText4',
         name: (0, _locale.i18n)('CUSTOMIZE'),
         value: /*#__PURE__*/_react["default"].createElement(_CustomizeConfig["default"], {
+          component: "imageText",
           data: data.customize,
           layoutSource: (0, _coreUtil.isPc)() ? _layout.imageTextLayoutPc : _layout.imageTextLayoutMobile,
           selectedLayoutFun: function selectedLayoutFun(v) {

package/es/composite-comp/bol/second-config-panels/CarouselSecondConfig/index.js

@@ -85,40 +85,35 @@ function (_super) {
       value: /*#__PURE__*/_react["default"].createElement(_TextConfig["default"], {
         data: panelProps.title
       }),
-      metaOption: panelProps.title,
-      toggleType: 'switch'
+      metaOption: panelProps.title
     }, {
       key: '3',
       name: (0, _locale.i18n)('TEXT'),
       value: /*#__PURE__*/_react["default"].createElement(_TextConfig["default"], {
         data: panelProps.text
       }),
-      metaOption: panelProps.text,
-      toggleType: 'switch'
+      metaOption: panelProps.text
     }, {
       key: '4',
       name: (0, _locale.i18n)('IMAGE_TAG'),
       value: /*#__PURE__*/_react["default"].createElement(_ImageConfig["default"], {
         data: panelProps.imageTag
       }),
-      metaOption: panelProps.imageTag,
-      toggleType: 'switch'
+      metaOption: panelProps.imageTag
     }, {
       key: '5',
       name: (0, _locale.i18n)('BUTTON_TAG'),
       value: /*#__PURE__*/_react["default"].createElement(_ButtonConfig["default"], {
         data: panelProps.buttonTag
       }),
-      metaOption: panelProps.buttonTag,
-      toggleType: 'switch'
+      metaOption: panelProps.buttonTag
     }, {
       key: '6',
       name: (0, _locale.i18n)('SECONDARY_BUTTON_TAG'),
       value: /*#__PURE__*/_react["default"].createElement(_ButtonConfig["default"], {
         data: panelProps.secondButtonTag
       }),
-      metaOption: panelProps.secondButtonTag,
-      toggleType: 'switch'
+      metaOption: panelProps.secondButtonTag
     }];
 
     var _textSource = _mobx.store.CarouselStore[panelProps.compId] === 'layout2' ? textSource : [];
@@ -136,7 +131,8 @@ function (_super) {
           }),
           metaOption: panelProps.image,
           toggleType: 'switch'
-        }], _textSource)
+        }], _textSource),
+        type: "switch"
       });
     };
 
@@ -149,8 +145,7 @@ function (_super) {
         key: '1',
         name: (0, _locale.i18n)('CONTENT'),
         value: getConfig()
-      }],
-      type: "triangle"
+      }]
     }));
   };
 

package/es/composite-comp/common/config-panels/CustomizeConfig/index.js

@@ -121,6 +121,21 @@ function (_super) {
         _this.props.store.setState({
           CarouselStore: __assign(__assign({}, _mobx.store.CarouselStore), (_a = {}, _a[id] = v, _a))
         });
+      } // 图文组件，移动端，只有第3个组件可选列数
+
+
+      if (component === 'imageText') {
+        if (!(0, _coreUtil.isPc)()) {
+          if (v === 'normal3') {
+            _this.setState({
+              showRowNum: true
+            });
+          } else {
+            _this.setState({
+              showRowNum: false
+            });
+          }
+        }
       } // 移动端导航特殊处理
       // 更改需求，两个布局都需 可选行数
       // if (component == 'mobileNavigation') {

package/es/composite-comp/dito/components/FlashDeal/defaultJSON.js

@@ -8,11 +8,13 @@ exports.getDefaultJSON = void 0;
 var _uuid = require("uuid");
 
 var getDefaultJSON = function getDefaultJSON() {
+  var contentId = (0, _uuid.v4)();
   return {
     id: (0, _uuid.v4)(),
     type: 'FLASH_DEAL',
     title: {
       icon: {
+        id: (0, _uuid.v4)(),
         open: true,
         url: '/get/resource/platform/conf/20220722/picture/组633391550411058986147840.png'
       },
@@ -23,6 +25,7 @@ var getDefaultJSON = function getDefaultJSON() {
         specialContent: [],
         text: 'Flash Deal',
         content: {
+          sizeType: 'Customize font styles',
           fontFamily: 'Open Sans',
           fontWeight: 600,
           fontSize: 14,
@@ -48,6 +51,7 @@ var getDefaultJSON = function getDefaultJSON() {
           backgroundColor: ''
         },
         buttonText: {
+          sizeType: 'Customize font styles',
           fontFamily: 'Open Sans',
           fontWeight: 600,
           fontSize: 12,
@@ -60,6 +64,20 @@ var getDefaultJSON = function getDefaultJSON() {
           borderColor: '',
           borderRadius: 6
         },
+        spacing: {
+          pc: {
+            paddingTop: 2,
+            paddingBottom: 2,
+            paddingLeft: 5,
+            paddingRight: 5
+          },
+          mobile: {
+            paddingTop: 2,
+            paddingBottom: 2,
+            paddingLeft: 5,
+            paddingRight: 5
+          }
+        },
         buttonIcon: {
           iconUrl: '/get/resource/platform/conf/20220719/picture/icon-arrow-right-s1549371733179686912.png',
           layout: 'right'
@@ -68,9 +86,11 @@ var getDefaultJSON = function getDefaultJSON() {
       }
     },
     content: {
+      id: contentId,
       sortType: '1',
       label: {
         id: (0, _uuid.v4)(),
+        contentId: contentId,
         open: true,
         type: 'BUTTON',
         text: 'Button',
@@ -79,6 +99,7 @@ var getDefaultJSON = function getDefaultJSON() {
           backgroundColor: '#CC1D20'
         },
         buttonText: {
+          sizeType: 'Customize font styles',
           fontFamily: 'Open Sans',
           fontWeight: 600,
           fontSize: 8,
@@ -91,6 +112,20 @@ var getDefaultJSON = function getDefaultJSON() {
           borderColor: '',
           borderRadius: 7
         },
+        spacing: {
+          pc: {
+            paddingTop: 2,
+            paddingBottom: 2,
+            paddingLeft: 3,
+            paddingRight: 3
+          },
+          mobile: {
+            paddingTop: 2,
+            paddingBottom: 2,
+            paddingLeft: 3,
+            paddingRight: 3
+          }
+        },
         buttonIcon: {
           iconUrl: '',
           layout: 'right'
@@ -99,11 +134,13 @@ var getDefaultJSON = function getDefaultJSON() {
       },
       productName: {
         id: (0, _uuid.v4)(),
+        contentId: contentId,
         open: true,
         type: 'Text',
         specialContent: [],
         text: 'Flash Deal',
         content: {
+          sizeType: 'Customize font styles',
           fontFamily: 'Open Sans',
           fontWeight: 500,
           fontSize: 14,
@@ -121,11 +158,13 @@ var getDefaultJSON = function getDefaultJSON() {
       },
       activityPrice: {
         id: (0, _uuid.v4)(),
+        contentId: contentId,
         open: true,
         type: 'Text',
         specialContent: [],
         text: 'Flash Deal',
         content: {
+          sizeType: 'Customize font styles',
           fontFamily: 'Open Sans',
           fontWeight: 600,
           fontSize: 14,
@@ -143,11 +182,13 @@ var getDefaultJSON = function getDefaultJSON() {
       },
       salesPrice: {
         id: (0, _uuid.v4)(),
+        contentId: contentId,
         open: true,
         type: 'Text',
         specialContent: [],
         text: 'Flash Deal',
         content: {
+          sizeType: 'Customize font styles',
           fontFamily: 'Open Sans',
           fontWeight: 500,
           fontSize: 10,

package/es/composite-comp/dito/components/Recommend/defaultJSON.js

@@ -152,16 +152,13 @@ exports.recommendGroupSourceJSON = recommendGroupSourceJSON;
 
 var getDefaultJSON = function getDefaultJSON() {
   var groupId = (0, _uuid.v4)();
-  var contentId = (0, _uuid.v4)();
   return {
     id: groupId,
     type: 'RECOMMEND',
     groupSource: [recommendGroupSourceJSON(groupId, '', 'Tab1'), recommendGroupSourceJSON(groupId, '', 'Tab2')],
     content: {
-      id: contentId,
       label: {
         id: (0, _uuid.v4)(),
-        contentId: contentId,
         open: true,
         type: 'BUTTON',
         text: 'Button',
@@ -204,7 +201,6 @@ var getDefaultJSON = function getDefaultJSON() {
       },
       productName: {
         id: (0, _uuid.v4)(),
-        contentId: contentId,
         open: true,
         type: 'Text',
         specialContent: [],
@@ -228,7 +224,6 @@ var getDefaultJSON = function getDefaultJSON() {
       },
       activityPrice: {
         id: (0, _uuid.v4)(),
-        contentId: contentId,
         open: true,
         type: 'Text',
         specialContent: [],
@@ -252,7 +247,6 @@ var getDefaultJSON = function getDefaultJSON() {
       },
       salesPrice: {
         id: (0, _uuid.v4)(),
-        contentId: contentId,
         open: true,
         type: 'Text',
         specialContent: [],

package/es/composite-comp/dito/components/SearchBar/mobile/index.js

@@ -264,7 +264,7 @@ function (_super) {
     })), /*#__PURE__*/_react["default"].createElement("div", {
       className: "message-wrap"
     }, /*#__PURE__*/_react["default"].createElement(_common.Iconfont, {
-      color: "#262626",
+      color: "#fff",
       onClick: function onClick() {
         return (0, _coreUtil.clickUrl)('/message-center');
       },

package/es/composite-comp/dito/config-panels/FlashDealConfig/FlashDealConfigContent/index.js

@@ -19,6 +19,8 @@ var _common = require("../../../../../common");
 
 var _locale = require("../../../../../locale");
 
+require("./index.less");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var __extends = void 0 && (void 0).__extends || function () {
@@ -116,14 +118,22 @@ function (_super) {
           data: panelProps.salesPrice
         }),
         metaOption: panelProps.salesPrice
-      }, {
-        key: '5',
-        name: (0, _locale.i18n)('SALES_PROGRESS'),
-        value: null,
-        metaOption: panelProps.salesProgressVisible
       }],
       type: "switch"
-    }));
+    }), /*#__PURE__*/_react["default"].createElement("div", {
+      className: "sales_progress_wrap"
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: "label"
+    }, (0, _locale.i18n)('SALES_PROGRESS')), /*#__PURE__*/_react["default"].createElement(_antd.Switch, {
+      checked: panelProps.salesProgressVisible.open,
+      onChange: function onChange(v) {
+        panelProps.salesProgressVisible = {
+          open: v
+        };
+
+        _this.reRender();
+      }
+    })));
   };
 
   AComponent.defaultProps = {

package/es/composite-comp/dito/config-panels/FlashDealConfig/FlashDealConfigContent/index.less

@@ -0,0 +1,20 @@
+.flash_sale_content {
+
+  .sales_progress_wrap {
+    border-top: 1px solid #EDF0F4;
+    padding-top: 20px;
+    padding-bottom: 10px;
+    display: flex;
+    justify-content: space-between;
+
+    .label {
+      font-size: 16px !important;
+      line-height: 24px !important;
+      height: 24px !important;
+      font-weight: 600 !important;
+      color: #232F46;
+      font-family: 'Open Sans';
+      font-style: normal;
+    }
+  }
+}

package/es/composite-comp/dito/config-panels/FlashDealConfig/index.js

@@ -21,12 +21,19 @@ var _CustomizeConfig = _interopRequireDefault(require("../../../common/config-pa
 
 var _Collapse = _interopRequireDefault(require("../../../../common/Collapse"));
 
+var _mobx = require("../../../../mobx");
+
 var _locale = require("../../../../locale");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function FlashDealConfig(props) {
   var data = props.data;
+
+  var getIsContentActive = function getIsContentActive(content) {
+    return JSON.stringify(content).includes(_mobx.store.clickedMetaParent);
+  };
+
   return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {
     divider: "bold",
     headerSize: "large",
@@ -41,7 +48,8 @@ function FlashDealConfig(props) {
       name: (0, _locale.i18n)('CONTENT'),
       value: /*#__PURE__*/_react["default"].createElement(_FlashDealConfigContent["default"], {
         panelProps: data.content
-      })
+      }),
+      active: getIsContentActive(data.content)
     }, {
       key: '3',
       name: (0, _locale.i18n)('SPACING'),

package/es/composite-comp/dito/config-panels/RecommendConfig/index.js

@@ -25,8 +25,6 @@ var _Collapse = _interopRequireDefault(require("../../../../common/Collapse"));
 
 var _locale = require("../../../../locale");
 
-var _mobx = require("../../../../mobx");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var __extends = void 0 && (void 0).__extends || function () {
@@ -81,10 +79,6 @@ function (_super) {
       _this.selfRender();
     };
 
-    _this.getIsContentActive = function (content) {
-      return JSON.stringify(content).includes(_mobx.store.clickedMetaParent);
-    };
-
     return _this;
   }
 
@@ -106,8 +100,7 @@ function (_super) {
         name: (0, _locale.i18n)('CONTENT'),
         value: /*#__PURE__*/_react["default"].createElement(_RecommendConfigContent["default"], {
           panelProps: data.content
-        }),
-        active: this.getIsContentActive(data.content)
+        })
       }, {
         key: '3',
         name: (0, _locale.i18n)('SPACING'),

package/es/core/Designer/ConfigPanel/index.js

@@ -83,19 +83,19 @@ function (_super) {
       _this.setState({
         clickedGroup: _mobx.store.clickedGroup,
         selectedNode: selectedNode
-      }); // 展开以及面板
+      }); // 展开一级面板
 
 
       if (selectedNode) {
         _this.openConfig();
       } else {
         _this.closeConfig();
-      } // 展开首期二级面板
+      } // 展开二级面板
 
 
-      if (!_mobx.store.clickedGroup) {
+      if (!_mobx.store.clickedGroup && _this.preClickedGroup) {
         _this.closeSecConfig();
-      } else if (_mobx.store.clickedGroup !== _this.preClickedGroup) {
+      } else if (Boolean(_mobx.store.clickedGroup) != Boolean(_this.preClickedGroup)) {
         _this.openSecConfig();
       }
 
@@ -294,7 +294,9 @@ function (_super) {
   };
 
   ConfigPanel.prototype.componentWillReceiveProps = function (nextProps) {
-    this.resetState(nextProps, _mobx.store.clickedFloor);
+    if (JSON.stringify(this.props) !== JSON.stringify(nextProps)) {
+      this.resetState(nextProps, _mobx.store.clickedFloor);
+    }
   };
 
   ConfigPanel.prototype.componentWillUnmount = function () {

package/es/core/Designer/QuickMenuBar/index.js

@@ -11,6 +11,8 @@ var _classnames = _interopRequireDefault(require("classnames"));
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _mobx = require("../../../mobx");
+
 var _Button = _interopRequireDefault(require("../../../common/Button"));
 
 var _Iconfont = _interopRequireDefault(require("../../../common/Iconfont"));
@@ -80,9 +82,13 @@ function (_super) {
     var _this = _super !== null && _super.apply(this, arguments) || this;
 
     _this.onBtnClick = function (event) {
-      var code = event.currentTarget.dataset.code; // if (code === quickMenuCode.SAVE || code === quickMenuCode.PUBLISH) {
-      //   store.setState({ clickedFloor: '' });
-      // }
+      var code = event.currentTarget.dataset.code; // 保存和发布时需要清空组件和元组件的选中状态，否则截图中会看到选中状态
+
+      if (code === _constants.quickMenuCode.SAVE || code === _constants.quickMenuCode.PUBLISH) {
+        _mobx.store.setState({
+          clickedFloor: ''
+        });
+      }
 
       if (_this.props.device === _constants.deviceTypeMap.PC) {}