@fonixtree/magic-design 0.0.82 → 0.0.83

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (55) hide show
  1. package/es/composite-comp/bol/components/Button/index.less +8 -9
  2. package/es/composite-comp/bol/components/Carousel/mobile/index.js +69 -18
  3. package/es/composite-comp/bol/components/Carousel/mobile/index.less +9 -4
  4. package/es/composite-comp/bol/components/Carousel/pc/index.js +79 -31
  5. package/es/composite-comp/bol/components/Carousel/pc/index.less +10 -9
  6. package/es/composite-comp/bol/components/ImageText/defaultJSON.js +28 -8
  7. package/es/composite-comp/bol/components/ImageText/mobile/index.js +1 -0
  8. package/es/composite-comp/bol/components/Newsletter/index.less +1 -1
  9. package/es/composite-comp/bol/config-panels/ButtonCompConfig/ButtonConfigGroup/index.js +4 -2
  10. package/es/composite-comp/bol/config-panels/ButtonCompConfig/imgs/layout1.png +0 -0
  11. package/es/composite-comp/bol/config-panels/ButtonCompConfig/imgs/layout2.png +0 -0
  12. package/es/composite-comp/bol/config-panels/CarouselConfig/index.js +0 -1
  13. package/es/composite-comp/bol/config-panels/TagCompConfig/TagConfigGroup/index.js +4 -2
  14. package/es/composite-comp/common/components/ProductItem/index.less +1 -0
  15. package/es/composite-comp/common/config-panels/SpacingConfig/index.js +2 -4
  16. package/es/composite-comp/dito/components/FlashDeal/defaultJSON.js +9 -10
  17. package/es/composite-comp/dito/components/PcNavigation/pc/index.less +8 -0
  18. package/es/composite-comp/dito/components/Recommend/mobile/index.js +8 -5
  19. package/es/composite-comp/dito/components/Recommend/pc/index.js +6 -4
  20. package/es/composite-comp/dito/components/Recommend/pc/index.less +1 -0
  21. package/es/composite-comp/dito/components/SearchBar/defaultJSON.js +2 -2
  22. package/es/composite-comp/dito/config-panels/FlashDealConfig/index.js +0 -1
  23. package/es/composite-comp/dito/config-panels/RecommendConfig/RecommendConfigGroup/index.js +1 -1
  24. package/es/composite-comp/dito/config-panels/RecommendConfig/index.js +2 -0
  25. package/es/meta-comp/components/Image/index.js +5 -0
  26. package/es/meta-comp/components/Image/index.less +2 -2
  27. package/es/meta-comp/components/Text/index.less +1 -0
  28. package/lib/composite-comp/bol/components/Button/index.less +8 -9
  29. package/lib/composite-comp/bol/components/Carousel/mobile/index.js +69 -18
  30. package/lib/composite-comp/bol/components/Carousel/mobile/index.less +9 -4
  31. package/lib/composite-comp/bol/components/Carousel/pc/index.js +79 -31
  32. package/lib/composite-comp/bol/components/Carousel/pc/index.less +10 -9
  33. package/lib/composite-comp/bol/components/ImageText/defaultJSON.js +28 -8
  34. package/lib/composite-comp/bol/components/ImageText/mobile/index.js +1 -0
  35. package/lib/composite-comp/bol/components/Newsletter/index.less +1 -1
  36. package/lib/composite-comp/bol/config-panels/ButtonCompConfig/ButtonConfigGroup/index.js +4 -2
  37. package/lib/composite-comp/bol/config-panels/ButtonCompConfig/imgs/layout1.png +0 -0
  38. package/lib/composite-comp/bol/config-panels/ButtonCompConfig/imgs/layout2.png +0 -0
  39. package/lib/composite-comp/bol/config-panels/CarouselConfig/index.js +0 -1
  40. package/lib/composite-comp/bol/config-panels/TagCompConfig/TagConfigGroup/index.js +4 -2
  41. package/lib/composite-comp/common/components/ProductItem/index.less +1 -0
  42. package/lib/composite-comp/common/config-panels/SpacingConfig/index.js +2 -4
  43. package/lib/composite-comp/dito/components/FlashDeal/defaultJSON.js +9 -10
  44. package/lib/composite-comp/dito/components/PcNavigation/pc/index.less +8 -0
  45. package/lib/composite-comp/dito/components/Recommend/mobile/index.js +8 -5
  46. package/lib/composite-comp/dito/components/Recommend/pc/index.js +6 -4
  47. package/lib/composite-comp/dito/components/Recommend/pc/index.less +1 -0
  48. package/lib/composite-comp/dito/components/SearchBar/defaultJSON.js +2 -2
  49. package/lib/composite-comp/dito/config-panels/FlashDealConfig/index.js +0 -1
  50. package/lib/composite-comp/dito/config-panels/RecommendConfig/RecommendConfigGroup/index.js +1 -1
  51. package/lib/composite-comp/dito/config-panels/RecommendConfig/index.js +2 -0
  52. package/lib/meta-comp/components/Image/index.js +5 -0
  53. package/lib/meta-comp/components/Image/index.less +2 -2
  54. package/lib/meta-comp/components/Text/index.less +1 -0
  55. package/package.json +1 -1
@@ -13,8 +13,12 @@ var _reactSlick = _interopRequireDefault(require("react-slick"));
13
13
 
14
14
  var _classnames = _interopRequireDefault(require("classnames"));
15
15
 
16
+ var _lodash = require("lodash");
17
+
16
18
  var _coreUtil = require("../../../../../utils/coreUtil");
17
19
 
20
+ var _mobx = require("../../../../../mobx");
21
+
18
22
  var _components = require("../../../../../meta-comp/components");
19
23
 
20
24
  var _commonUtil = require("../../../../../utils/commonUtil");
@@ -25,10 +29,14 @@ require("slick-carousel/slick/slick.css");
25
29
 
26
30
  require("slick-carousel/slick/slick-theme.css");
27
31
 
32
+ var _ref, _ref2, _ref3, _ref4;
33
+
28
34
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
29
35
 
30
36
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
31
37
 
38
+ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
39
+
32
40
  var __extends = void 0 && (void 0).__extends || function () {
33
41
  var _extendStatics = function extendStatics(d, b) {
34
42
  _extendStatics = Object.setPrototypeOf || {
@@ -56,30 +64,28 @@ var __extends = void 0 && (void 0).__extends || function () {
56
64
  }();
57
65
 
58
66
  var PC_IMG_SIZE = [{
59
- minW: 806,
67
+ minW: 150,
60
68
  maxW: 1072,
61
- maxH: 662
69
+ minH: 150,
70
+ maxH: 400
62
71
  }, {
63
- minW: 390,
72
+ minW: 150,
64
73
  maxW: 524,
65
- maxH: 393
66
- }, {
67
- minW: 258,
68
- maxW: 341,
69
- maxH: 256
70
- }, {
71
- minW: 184,
72
- maxW: 251,
73
- maxH: 188
74
- }, {
75
- minW: 142,
76
- maxW: 195,
77
- maxH: 147
78
- }, {
79
- minW: 124,
80
- maxW: 168,
81
- maxH: 126
82
- }];
74
+ minH: 150,
75
+ maxH: 524
76
+ }, (_ref = {
77
+ minW: 100,
78
+ maxW: 341
79
+ }, _defineProperty(_ref, "minW", 100), _defineProperty(_ref, "maxW", 341), _ref), (_ref2 = {
80
+ minW: 100,
81
+ maxW: 251
82
+ }, _defineProperty(_ref2, "minW", 100), _defineProperty(_ref2, "maxW", 251), _ref2), (_ref3 = {
83
+ minW: 100,
84
+ maxW: 195
85
+ }, _defineProperty(_ref3, "minW", 100), _defineProperty(_ref3, "maxW", 195), _ref3), (_ref4 = {
86
+ minW: 100,
87
+ maxW: 168
88
+ }, _defineProperty(_ref4, "minW", 100), _defineProperty(_ref4, "maxW", 168), _ref4)];
83
89
 
84
90
  var CarouselPc =
85
91
  /** @class */
@@ -90,9 +96,28 @@ function (_super) {
90
96
  var _this = _super !== null && _super.apply(this, arguments) || this;
91
97
 
92
98
  _this.state = {
93
- sliderIndex: 0
99
+ sliderIndex: 0,
100
+ contentWidth: 0
94
101
  };
95
102
  _this.sliderRef = /*#__PURE__*/_react["default"].createRef();
103
+ _this.destroy = null;
104
+
105
+ _this.listenWidth = function () {
106
+ var renderContainer = document.querySelector('.composite_wrap');
107
+ if (renderContainer) _this.setState({
108
+ contentWidth: renderContainer.offsetWidth
109
+ });
110
+ };
111
+
112
+ _this.sliderGoTo = function (groupSource) {
113
+ var nextIndex = groupSource.findIndex(function (item) {
114
+ return item.id === _mobx.store.clickedGroup;
115
+ });
116
+
117
+ if (nextIndex != -1 && nextIndex != _this.state.sliderIndex) {
118
+ _this.sliderRef.slickGoTo(nextIndex);
119
+ }
120
+ };
96
121
 
97
122
  _this.mouseEnterBtn = function (e) {
98
123
  var _a, _b;
@@ -125,7 +150,19 @@ function (_super) {
125
150
  return _this;
126
151
  }
127
152
 
153
+ CarouselPc.prototype.componentDidMount = function () {
154
+ var _this = this;
155
+
156
+ this.destroy = (0, _mobx.autorun)(function () {
157
+ _this.sliderGoTo(_this.props.data.groupSource);
158
+ });
159
+ this.listenWidth();
160
+ window.addEventListener('resize', (0, _lodash.debounce)(this.listenWidth));
161
+ };
162
+
128
163
  CarouselPc.prototype.componentWillReceiveProps = function (nextProps) {
164
+ this.sliderGoTo(nextProps.data.groupSource);
165
+
129
166
  if (nextProps.data.setting.autoplay.open) {
130
167
  this.sliderRef.slickPlay();
131
168
  } else {
@@ -133,11 +170,17 @@ function (_super) {
133
170
  }
134
171
  };
135
172
 
173
+ CarouselPc.prototype.componentWillUnmount = function () {
174
+ this.destroy();
175
+ };
176
+
136
177
  CarouselPc.prototype.render = function () {
137
178
  var _this = this;
138
179
 
139
180
  var data = this.props.data;
140
- var sliderIndex = this.state.sliderIndex;
181
+ var _a = this.state,
182
+ sliderIndex = _a.sliderIndex,
183
+ contentWidth = _a.contentWidth;
141
184
  var showText = data.customize.layout === 'layout2';
142
185
  var colNum = showText ? 1 : Math.min(data.customize.pcRowNum, data.groupSource.length);
143
186
  var bgStyle = {};
@@ -153,11 +196,18 @@ function (_super) {
153
196
  };
154
197
  }
155
198
 
199
+ var autoplay = data.setting.autoplay.open;
200
+ /** 设计器模式下 如果选中特定group 自动播放关闭 */
201
+
202
+ if ((0, _coreUtil.isDesignMode)() && _mobx.store.clickedGroup) {
203
+ autoplay = false;
204
+ }
205
+
156
206
  var settings = {
157
207
  className: 'slider-wrap',
158
208
  arrows: false,
159
209
  dots: false,
160
- autoplay: data.setting.autoplay.open,
210
+ autoplay: autoplay,
161
211
  autoplaySpeed: data.setting.autoplay.interval * 1000,
162
212
  speed: 500,
163
213
  draggable: window.magicDesign.mode === 'renderer',
@@ -180,7 +230,8 @@ function (_super) {
180
230
  }, /*#__PURE__*/_react["default"].createElement("div", {
181
231
  className: "content",
182
232
  style: {
183
- width: spacing.contentWidth ? 'fit-content' : '100%'
233
+ width: contentWidth - spacing.paddingLeft - spacing.paddingRight,
234
+ paddingBottom: data.setting.dots.open ? '30px' : '0'
184
235
  }
185
236
  }, data.setting.navigation.open && /*#__PURE__*/_react["default"].createElement(_Iconfont["default"], {
186
237
  className: "carousel-icon-left",
@@ -191,11 +242,7 @@ function (_super) {
191
242
  onMouseLeave: this.mouseLeaveBtn,
192
243
  style: navStyle,
193
244
  type: "icon-left"
194
- }), /*#__PURE__*/_react["default"].createElement("div", {
195
- style: {
196
- width: spacing.contentWidth || 'calc(100% - 52px)'
197
- }
198
- }, /*#__PURE__*/_react["default"].createElement(_reactSlick["default"], _extends({
245
+ }), /*#__PURE__*/_react["default"].createElement(_reactSlick["default"], _extends({
199
246
  ref: function ref(slider) {
200
247
  return _this.sliderRef = slider;
201
248
  }
@@ -209,6 +256,7 @@ function (_super) {
209
256
  data: item.image,
210
257
  maxHeight: PC_IMG_SIZE[colNum - 1].maxH,
211
258
  maxWidth: PC_IMG_SIZE[colNum - 1].maxW,
259
+ minHeight: PC_IMG_SIZE[colNum - 1].minH,
212
260
  minWidth: PC_IMG_SIZE[colNum - 1].minW
213
261
  })), showText && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, item.title.open && !((0, _coreUtil.isPc)() && item.title.pcText === '') && /*#__PURE__*/_react["default"].createElement("div", {
214
262
  className: "title"
@@ -228,7 +276,7 @@ function (_super) {
228
276
  }), item.secondButtonTag.open && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
229
277
  data: item.secondButtonTag
230
278
  }))));
231
- }))), data.setting.dots.open && Math.ceil(data.groupSource.length / colNum) > 1 && /*#__PURE__*/_react["default"].createElement("div", {
279
+ })), data.setting.dots.open && Math.ceil(data.groupSource.length / colNum) > 1 && /*#__PURE__*/_react["default"].createElement("div", {
232
280
  className: "swiper-ban"
233
281
  }, data.groupSource.length > 1 && data.groupSource.map(function (item, i) {
234
282
  return /*#__PURE__*/_react["default"].createElement("div", {
@@ -1,30 +1,30 @@
1
1
  .m-carousel-pc {
2
2
  position: relative;
3
- overflow-x: auto;
4
3
  width: 100%;
5
4
 
6
5
  .content {
7
6
  display: flex;
8
- width: fit-content;
9
7
  margin: 0 auto;
10
8
  }
11
9
 
12
10
  .carousel-icon-left {
13
- float: left;
14
- margin-left: 10px;
11
+ margin-right: 20px;
12
+ cursor: pointer;
15
13
  }
16
14
 
17
15
  .carousel-icon-right {
18
- float: right;
19
- margin-right: 10px;
16
+ margin-left: 20px;
17
+ cursor: pointer;
20
18
  }
21
19
 
22
20
  .slider-wrap {
23
- width: 100%;
24
- padding: 30px 0;
21
+ width: calc(100% - 72px);
25
22
  margin: 0 auto;
23
+ line-height: 1;
26
24
 
27
25
  .img-wrap {
26
+ overflow-x: auto;
27
+
28
28
  .img {
29
29
  width: fit-content;
30
30
  height: fit-content;
@@ -46,6 +46,7 @@
46
46
 
47
47
  .tags {
48
48
  margin-top: 8px;
49
+ margin-bottom: 12px;
49
50
  display: flex;
50
51
  flex-direction: row;
51
52
  align-items: center;
@@ -70,7 +71,7 @@
70
71
  .swiper-ban {
71
72
  position: absolute;
72
73
  width: 100%;
73
- bottom: 0;
74
+ bottom: 10px;
74
75
  left: 0;
75
76
  right: 0;
76
77
  display: flex;
@@ -103,6 +103,20 @@ var ImageTextGroupSourceJSON = function ImageTextGroupSourceJSON() {
103
103
  iconUrl: '',
104
104
  layout: 'right'
105
105
  },
106
+ spacing: {
107
+ pc: {
108
+ paddingTop: 6,
109
+ paddingBottom: 6,
110
+ paddingLeft: 10,
111
+ paddingRight: 10
112
+ },
113
+ mobile: {
114
+ paddingTop: 6,
115
+ paddingBottom: 6,
116
+ paddingLeft: 10,
117
+ paddingRight: 10
118
+ }
119
+ },
106
120
  hover: {
107
121
  open: false,
108
122
  content: {
@@ -125,10 +139,6 @@ var ImageTextGroupSourceJSON = function ImageTextGroupSourceJSON() {
125
139
  iconUrl: '',
126
140
  layout: 'right'
127
141
  }
128
- },
129
- spacing: {
130
- pc: {},
131
- mobile: {}
132
142
  }
133
143
  },
134
144
  secondButton: {
@@ -158,6 +168,20 @@ var ImageTextGroupSourceJSON = function ImageTextGroupSourceJSON() {
158
168
  iconUrl: '',
159
169
  layout: 'right'
160
170
  },
171
+ spacing: {
172
+ pc: {
173
+ paddingTop: 6,
174
+ paddingBottom: 6,
175
+ paddingLeft: 10,
176
+ paddingRight: 10
177
+ },
178
+ mobile: {
179
+ paddingTop: 6,
180
+ paddingBottom: 6,
181
+ paddingLeft: 10,
182
+ paddingRight: 10
183
+ }
184
+ },
161
185
  hover: {
162
186
  open: false,
163
187
  content: {
@@ -180,10 +204,6 @@ var ImageTextGroupSourceJSON = function ImageTextGroupSourceJSON() {
180
204
  iconUrl: '',
181
205
  layout: 'right'
182
206
  }
183
- },
184
- spacing: {
185
- pc: {},
186
- mobile: {}
187
207
  }
188
208
  },
189
209
  background: {
@@ -123,6 +123,7 @@ function (_super) {
123
123
  cardBtnStyle.justifyContent = _AlignSelector.alignItemMap[data.customize.align];
124
124
  }
125
125
 
126
+ console.log('source', data);
126
127
  return /*#__PURE__*/_react["default"].createElement("div", {
127
128
  className: (0, _classnames["default"])('image-text-mobile', data.customize.layout.h5Layout),
128
129
  style: wrapStyle
@@ -16,7 +16,7 @@
16
16
  input {
17
17
  border: 1px solid #D2D9E5;
18
18
  width: 600px;
19
- height: 56px;
19
+ height: 50px;
20
20
  padding: 0 20px;
21
21
  border-radius: 8px;
22
22
  background-color: #fff;
@@ -21,6 +21,8 @@ require("./index.less");
21
21
 
22
22
  var _locale = require("../../../../../locale");
23
23
 
24
+ var _decorator = require("../../../../../decorator");
25
+
24
26
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
25
27
 
26
28
  function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
@@ -98,7 +100,7 @@ function (_super) {
98
100
  className: "card_wrap"
99
101
  }, /*#__PURE__*/_react["default"].createElement("div", {
100
102
  className: "name"
101
- }, "Button Name"));
103
+ }, src.button.text));
102
104
  };
103
105
 
104
106
  return _this;
@@ -133,7 +135,7 @@ function (_super) {
133
135
  AComponent.defaultProps = {
134
136
  source: []
135
137
  };
136
- AComponent = __decorate([(0, _mobxReact.inject)('store'), _mobxReact.observer], AComponent);
138
+ AComponent = __decorate([(0, _mobxReact.inject)('store'), _mobxReact.observer, _decorator.updateConfigDecorator], AComponent);
137
139
  return AComponent;
138
140
  }(_react["default"].Component);
139
141
 
@@ -47,7 +47,6 @@ function CarouselConfig(props) {
47
47
  key: '3',
48
48
  name: (0, _locale.i18n)('SPACING'),
49
49
  value: /*#__PURE__*/_react["default"].createElement(_SpacingConfig["default"], {
50
- configWidth: true,
51
50
  data: data.spacing
52
51
  })
53
52
  }, {
@@ -21,6 +21,8 @@ require("./index.less");
21
21
 
22
22
  var _locale = require("../../../../../locale");
23
23
 
24
+ var _decorator = require("../../../../../decorator");
25
+
24
26
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
25
27
 
26
28
  function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
@@ -98,7 +100,7 @@ function (_super) {
98
100
  className: "card_wrap"
99
101
  }, /*#__PURE__*/_react["default"].createElement("div", {
100
102
  className: "name"
101
- }, "Button Tag"));
103
+ }, src.button.text));
102
104
  };
103
105
 
104
106
  return _this;
@@ -133,7 +135,7 @@ function (_super) {
133
135
  AComponent.defaultProps = {
134
136
  source: []
135
137
  };
136
- AComponent = __decorate([(0, _mobxReact.inject)('store'), _mobxReact.observer], AComponent);
138
+ AComponent = __decorate([(0, _mobxReact.inject)('store'), _mobxReact.observer, _decorator.updateConfigDecorator], AComponent);
137
139
  return AComponent;
138
140
  }(_react["default"].Component);
139
141
 
@@ -4,6 +4,7 @@
4
4
  background: #FFFFFF;
5
5
  border: 1px solid #D2D9E5;
6
6
  width: 142px;
7
+ margin: 0 auto;
7
8
  cursor: pointer;
8
9
 
9
10
  .img-wrap {
@@ -62,7 +62,6 @@ function (_super) {
62
62
 
63
63
  var _a = this.props,
64
64
  data = _a.data,
65
- configPaddingLR = _a.configPaddingLR,
66
65
  configCompSpace = _a.configCompSpace,
67
66
  configWidth = _a.configWidth;
68
67
  var obj = data[window.magicDesign.device] || {};
@@ -107,7 +106,7 @@ function (_super) {
107
106
  _this.selfRender();
108
107
  },
109
108
  value: obj.paddingBottom || 0
110
- })), configPaddingLR && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
109
+ })), /*#__PURE__*/_react["default"].createElement("div", {
111
110
  className: "padding-item"
112
111
  }, /*#__PURE__*/_react["default"].createElement(_common.Iconfont, {
113
112
  type: "icon-padding-left"
@@ -129,7 +128,7 @@ function (_super) {
129
128
  _this.selfRender();
130
129
  },
131
130
  value: obj.paddingRight || 0
132
- }))))), configCompSpace && /*#__PURE__*/_react["default"].createElement(_common.Field, {
131
+ })))), configCompSpace && /*#__PURE__*/_react["default"].createElement(_common.Field, {
133
132
  title: (0, _locale.i18n)('COMPONENT_SPACING')
134
133
  }, /*#__PURE__*/_react["default"].createElement(_common.Slider, {
135
134
  maxVal: 100,
@@ -146,7 +145,6 @@ function (_super) {
146
145
  };
147
146
 
148
147
  SpacingConfig.defaultProps = {
149
- configPaddingLR: true,
150
148
  configCompSpace: true,
151
149
  configWidth: false,
152
150
  data: {
@@ -104,8 +104,7 @@ var getDefaultJSON = function getDefaultJSON() {
104
104
  fontWeight: 600,
105
105
  fontSize: 8,
106
106
  fontStyle: 'normal',
107
- color: '#fff',
108
- padding: '0 5px'
107
+ color: '#fff'
109
108
  },
110
109
  buttonBorder: {
111
110
  open: true,
@@ -114,16 +113,16 @@ var getDefaultJSON = function getDefaultJSON() {
114
113
  },
115
114
  spacing: {
116
115
  pc: {
117
- paddingTop: 2,
118
- paddingBottom: 2,
119
- paddingLeft: 3,
120
- paddingRight: 3
116
+ paddingTop: 0,
117
+ paddingBottom: 0,
118
+ paddingLeft: 4,
119
+ paddingRight: 4
121
120
  },
122
121
  mobile: {
123
- paddingTop: 2,
124
- paddingBottom: 2,
125
- paddingLeft: 3,
126
- paddingRight: 3
122
+ paddingTop: 0,
123
+ paddingBottom: 0,
124
+ paddingLeft: 4,
125
+ paddingRight: 4
127
126
  }
128
127
  },
129
128
  buttonIcon: {
@@ -6,6 +6,7 @@
6
6
  width: fit-content;
7
7
  display: flex;
8
8
  align-items: center;
9
+ min-width: 130px;
9
10
 
10
11
  &:hover {
11
12
  @keyframes show-active{
@@ -89,8 +90,15 @@
89
90
  .category-group {
90
91
  margin-left: 180px;
91
92
  display: flex;
93
+ overflow-x: scroll;
94
+ flex: 1;
95
+ scroll-snap-type: x;
92
96
  .one-category {
93
97
  margin-right: 44px;
98
+ scroll-snap-align: end;
99
+ &:last-of-type {
100
+ margin-right: 0;
101
+ }
94
102
  }
95
103
  }
96
104
 
@@ -229,7 +229,7 @@ var __spreadArrays = void 0 && (void 0).__spreadArrays || function () {
229
229
  var LAYOUT_IMAGE_SIZE = {
230
230
  layout1: {
231
231
  w: '100%',
232
- h: 164
232
+ h: ''
233
233
  },
234
234
  layout2: {
235
235
  w: 100,
@@ -237,7 +237,7 @@ var LAYOUT_IMAGE_SIZE = {
237
237
  },
238
238
  layout3: {
239
239
  w: '100%',
240
- h: 104
240
+ h: ''
241
241
  },
242
242
  layout4: {
243
243
  w: 96,
@@ -568,12 +568,15 @@ function (_super) {
568
568
  return groupSource[tabIndex].seeAll;
569
569
  }, '');
570
570
 
571
- var imgHeight = (0, _commonUtil.ensure)(function () {
572
- return LAYOUT_IMAGE_SIZE[layout].h;
573
- }, 140);
574
571
  var imgWidth = (0, _commonUtil.ensure)(function () {
575
572
  return LAYOUT_IMAGE_SIZE[layout].w;
576
573
  }, 140);
574
+ var imgHeight = (0, _commonUtil.ensure)(function () {
575
+ return LAYOUT_IMAGE_SIZE[layout].h;
576
+ }, 140);
577
+ var macyContainerDom = document.querySelector('.m-recommend-mobile');
578
+ if (layout === 'layout1' && macyContainerDom) imgHeight = (macyContainerDom.clientWidth - 32) / 2 - 6;
579
+ if (layout === 'layout3' && macyContainerDom) imgHeight = (macyContainerDom.clientWidth - 32) / 3 - 8;
577
580
  return /*#__PURE__*/_react["default"].createElement("div", {
578
581
  className: "m-recommend-mobile",
579
582
  style: bgStyle
@@ -233,7 +233,7 @@ var __spreadArrays = void 0 && (void 0).__spreadArrays || function () {
233
233
  var LAYOUT_IMAGE_SIZE = {
234
234
  layout1: {
235
235
  w: '100%',
236
- h: 180
236
+ h: ''
237
237
  },
238
238
  layout2_col6: {
239
239
  w: 160,
@@ -636,12 +636,14 @@ function (_super) {
636
636
  return groupSource[tabIndex].seeAll;
637
637
  }, '');
638
638
 
639
- var imgHeight = (0, _commonUtil.ensure)(function () {
640
- return layout === 'layout1' ? LAYOUT_IMAGE_SIZE[layout].h : LAYOUT_IMAGE_SIZE[layout + "_col" + panelProps.customize.pcRowNum].h;
641
- }, 140);
642
639
  var imgWidth = (0, _commonUtil.ensure)(function () {
643
640
  return layout === 'layout1' ? LAYOUT_IMAGE_SIZE[layout].w : LAYOUT_IMAGE_SIZE[layout + "_col" + panelProps.customize.pcRowNum].w;
644
641
  }, 140);
642
+ var imgHeight = (0, _commonUtil.ensure)(function () {
643
+ return layout === 'layout1' ? LAYOUT_IMAGE_SIZE[layout].h : LAYOUT_IMAGE_SIZE[layout + "_col" + panelProps.customize.pcRowNum].h;
644
+ }, 140);
645
+ var macyContainerDom = document.querySelector('.tab-list');
646
+ if (layout === 'layout1' && macyContainerDom) imgHeight = (macyContainerDom.clientWidth - 12 * (panelProps.customize.pcRowNum - 1)) / panelProps.customize.pcRowNum;
645
647
  return /*#__PURE__*/_react["default"].createElement("div", {
646
648
  className: "m-recommend-pc",
647
649
  style: bgStyle
@@ -31,6 +31,7 @@
31
31
  justify-content: center;
32
32
  white-space: nowrap;
33
33
  flex-direction: column;
34
+ cursor: pointer;
34
35
 
35
36
  img {
36
37
  height: 16px;
@@ -42,7 +42,7 @@ var getDefaultJSON = function getDefaultJSON() {
42
42
  open: true,
43
43
  color: {
44
44
  pc: '#D92929',
45
- mobile: '#232F46'
45
+ mobile: '#8493AF'
46
46
  }
47
47
  },
48
48
  icon: {
@@ -50,7 +50,7 @@ var getDefaultJSON = function getDefaultJSON() {
50
50
  open: true,
51
51
  color: {
52
52
  pc: '#D92929',
53
- mobile: '#8493AF'
53
+ mobile: '#232F46'
54
54
  }
55
55
  }
56
56
  },
@@ -47,7 +47,6 @@ function FlashDealConfig(props) {
47
47
  name: (0, _locale.i18n)('SPACING'),
48
48
  value: /*#__PURE__*/_react["default"].createElement(_SpacingConfig["default"], {
49
49
  configCompSpace: true,
50
- configPaddingLR: false,
51
50
  data: data.spacing
52
51
  })
53
52
  }, {
@@ -82,7 +82,7 @@ function (_super) {
82
82
  };
83
83
 
84
84
  _this.onAddClick = function () {
85
- var json = (0, _defaultJSON.recommendGroupSourceJSON)('', 'Tab');
85
+ var json = (0, _defaultJSON.recommendGroupSourceJSON)(_this.props.id, '', 'Tab');
86
86
 
87
87
  _this.props.source.push(json);
88
88
 
@@ -86,6 +86,7 @@ function (_super) {
86
86
  var _this = this;
87
87
 
88
88
  var data = this.props.data;
89
+ console.log('data', data);
89
90
  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {
90
91
  divider: "bold",
91
92
  headerSize: "large",
@@ -93,6 +94,7 @@ function (_super) {
93
94
  key: '1',
94
95
  name: (0, _locale.i18n)('GROUP'),
95
96
  value: /*#__PURE__*/_react["default"].createElement(_RecommendConfigGroup["default"], {
97
+ id: data.id,
96
98
  source: data.groupSource
97
99
  })
98
100
  }, {
@@ -78,6 +78,7 @@ function (_super) {
78
78
  hoverState = _a.hoverState,
79
79
  maxHeight = _a.maxHeight,
80
80
  maxWidth = _a.maxWidth,
81
+ minHeight = _a.minHeight,
81
82
  minWidth = _a.minWidth,
82
83
  limitWidthHeight = _a.limitWidthHeight,
83
84
  scale = _a.scale;
@@ -97,6 +98,10 @@ function (_super) {
97
98
  obj.maxWidth = maxWidth;
98
99
  }
99
100
 
101
+ if (minHeight) {
102
+ obj.minHeight = minHeight;
103
+ }
104
+
100
105
  if (minWidth) {
101
106
  obj.minWidth = minWidth;
102
107
  }
@@ -16,8 +16,8 @@
16
16
 
17
17
  &.backgroundImg {
18
18
  &>img {
19
- // object-fit: cover;
20
- width: auto;
19
+ object-fit: cover;
20
+ // width: auto;
21
21
  max-width: none;
22
22
  }
23
23
  }