@fonixtree/magic-design 0.0.43 → 0.0.44

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 (13) hide show
  1. package/es/composite-comp/common/components/ImageLabel/index.js +2 -2
  2. package/es/composite-comp/common/components/ImageLabel/index.less +3 -3
  3. package/es/composite-comp/common/components/ProductItem/index.less +6 -7
  4. package/es/composite-comp/dito/components/Recommend/defaultJSON.js +8 -2
  5. package/es/composite-comp/dito/components/Recommend/mobile/index.js +24 -30
  6. package/es/meta-comp/components/Image/index.js +6 -3
  7. package/lib/composite-comp/common/components/ImageLabel/index.js +2 -2
  8. package/lib/composite-comp/common/components/ImageLabel/index.less +3 -3
  9. package/lib/composite-comp/common/components/ProductItem/index.less +6 -7
  10. package/lib/composite-comp/dito/components/Recommend/defaultJSON.js +8 -2
  11. package/lib/composite-comp/dito/components/Recommend/mobile/index.js +24 -30
  12. package/lib/meta-comp/components/Image/index.js +6 -3
  13. package/package.json +1 -1
package/es/composite-comp/common/components/ImageLabel/index.js CHANGED
@@ -71,14 +71,14 @@ function (_super) {
71
71
  return /*#__PURE__*/_react["default"].createElement("img", {
72
72
  key: label.imgUrl || label.labelPictureUrl,
73
73
  alt: "img",
74
- className: (0, _classnames["default"])('image-label-wrap', 'img', (_a = {}, _a["position-" + (label.position || 'default')] = true, _a.small = small, _a)),
74
+ className: (0, _classnames["default"])('image-label-wrap', 'img', (_a = {}, _a["position-" + label.position] = true, _a.small = small, _a)),
75
75
  src: label.imgUrl || label.labelPictureUrl
76
76
  });
77
77
  }
78
78
 
79
79
  return /*#__PURE__*/_react["default"].createElement("div", {
80
80
  key: label.labelName,
81
- className: (0, _classnames["default"])('image-label-wrap', (_b = {}, _b["position-" + (label.position || 'default')] = true, _b))
81
+ className: (0, _classnames["default"])('image-label-wrap', (_b = {}, _b["position-" + label.position] = true, _b))
82
82
  }, label.labelName);
83
83
  });
84
84
  };
package/es/composite-comp/common/components/ImageLabel/index.less CHANGED
@@ -1,3 +1,4 @@
1
+
1
2
  .image-label-wrap {
2
3
  position: absolute;
3
4
  z-index: 1;
@@ -12,8 +13,7 @@
12
13
  }
13
14
  }
14
15
 
15
- &.position-1,
16
- &.position-default {
16
+ &.position-1 {
17
17
  top: 0;
18
18
  left: 0;
19
19
  }
@@ -32,4 +32,4 @@
32
32
  bottom: 0;
33
33
  right: 0;
34
34
  }
35
- }
35
+ }
package/es/composite-comp/common/components/ProductItem/index.less CHANGED
@@ -4,14 +4,11 @@
4
4
  background: #FFFFFF;
5
5
  border: 1px solid #D2D9E5;
6
6
  width: 142px;
7
- border-radius: 8px;
8
7
 
9
8
  .img-wrap {
10
9
  position: relative;
11
- border-radius: 8px;
12
10
 
13
11
  .product-img {
14
- border-radius: 8px;
15
12
  width: 140px;
16
13
  height: 140px;
17
14
  object-fit: cover;
@@ -36,7 +33,7 @@
36
33
  }
37
34
 
38
35
  .product-name {
39
- margin-bottom: 5px;
36
+ margin-bottom: 3px;
40
37
  // font-family: 'Montserrat';
41
38
  // font-style: normal;
42
39
  // font-weight: 500;
@@ -60,7 +57,7 @@
60
57
 
61
58
  .old-price-wrap {
62
59
  display: flex;
63
- margin-top: 3px;
60
+ margin-top: 0px;
64
61
  align-items: baseline;
65
62
  white-space: nowrap;
66
63
  overflow: hidden;
@@ -71,9 +68,11 @@
71
68
  font-family: 'Montserrat';
72
69
  font-style: normal;
73
70
  font-weight: 700;
74
- font-size: 12px;
71
+ font-size: 8px;
75
72
  line-height: 15px;
76
- color: #2F3043;
73
+ color: #fff;
74
+ padding: 0 4px;
75
+ background-color: #CE1126;
77
76
  }
78
77
 
79
78
  .old-price {
package/es/composite-comp/dito/components/Recommend/defaultJSON.js CHANGED
@@ -279,8 +279,14 @@ var getDefaultJSON = function getDefaultJSON() {
279
279
  }
280
280
  },
281
281
  customize: {
282
- layout: 'left',
283
- align: 'left'
282
+ layout: {
283
+ pcLayout: 'layout1',
284
+ h5Layout: 'layout1'
285
+ },
286
+ align: 'left',
287
+ pcRowNum: 6,
288
+ pcMaxRowNum: 6,
289
+ pcMinRowNum: 5
284
290
  },
285
291
  background: {
286
292
  opacity: 100,
package/es/composite-comp/dito/components/Recommend/mobile/index.js CHANGED
@@ -227,10 +227,6 @@ var __spreadArrays = void 0 && (void 0).__spreadArrays || function () {
227
227
  };
228
228
 
229
229
  var LAYOUT_IMAGE_SIZE = {
230
- left: {
231
- w: '100%',
232
- h: 165
233
- },
234
230
  layout1: {
235
231
  w: '100%',
236
232
  h: 164
@@ -416,10 +412,8 @@ function (_super) {
416
412
  };
417
413
 
418
414
  _this.resetLayout = function () {
419
- var layout = _this.props.panelProps.customize.layout.h5Layout || _this.props.panelProps.customize.layout; // 后面删除
420
-
415
+ var layout = _this.props.panelProps.customize.layout.h5Layout;
421
416
  var LAYOUT_COLUMN = {
422
- left: 2,
423
417
  layout1: 2,
424
418
  layout2: 1,
425
419
  layout3: 3
@@ -543,7 +537,7 @@ function (_super) {
543
537
  hideTabs: hideTabs
544
538
  });
545
539
  });
546
- var curLayout = panelProps.customize.layout.h5Layout || panelProps.customize.layout; // 后面删除
540
+ var curLayout = panelProps.customize.layout.h5Layout;
547
541
 
548
542
  if (curLayout !== this.preLayout) {
549
543
  this.resetLayout();
@@ -565,7 +559,7 @@ function (_super) {
565
559
  var bgStyle = this.getBackgroundStyle();
566
560
  var products = this.state["products" + tabIndex] || [];
567
561
  var isDivide = groupSource.length <= 3;
568
- var layout = panelProps.customize.layout.h5Layout || panelProps.customize.layout; // 后面删除
562
+ var layout = panelProps.customize.layout.h5Layout;
569
563
 
570
564
  var _seeAll = (0, _commonUtil.ensure)(function () {
571
565
  return groupSource[tabIndex].seeAll;
@@ -617,47 +611,47 @@ function (_super) {
617
611
  transform: "translateX(" + tabLeft + "px)",
618
612
  background: this.getTabBarActiveColor(panelProps)
619
613
  }
620
- })), ['layout4', 'layout5'].includes(layout) ? /*#__PURE__*/_react["default"].createElement("div", {
621
- key: "scrollContainer",
622
- className: (0, _classnames["default"])('scrollContainer', {
623
- pl_100: layout === 'layout5'
624
- })
614
+ })), ['layout1', 'layout2', 'layout3'].includes(layout) ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
615
+ key: "macyContainer",
616
+ className: "macyContainer"
625
617
  }, products.map(function (item) {
626
- return /*#__PURE__*/_react["default"].createElement("div", {
627
- className: "productCard"
628
- }, /*#__PURE__*/_react["default"].createElement(_ProductItem["default"], {
629
- key: "scroll_" + item.productId,
618
+ return /*#__PURE__*/_react["default"].createElement(_ProductItem["default"], {
619
+ key: item.productId,
630
620
  data: item,
631
- fixHeight: true,
621
+ fixHeight: layout === 'layout3',
632
622
  imgHeight: imgHeight,
633
623
  imgWidth: imgWidth,
624
+ layout: layout === 'layout2' ? 'horizontal' : 'vertical',
634
625
  onItemClick: function onItemClick() {
635
626
  return (0, _coreUtil.clickUrl)("/product/detail/" + item.offerId + "?productId=" + (item.sppProductId || item.productId || ''));
636
627
  },
637
628
  panelProps: panelProps.content,
638
629
  showProgress: false
639
- }));
640
- }), _seeAll.open && products.length > 0 && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
630
+ });
631
+ })), _seeAll.open && products.length > 0 && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
641
632
  className: "btnSeeAll",
642
633
  data: _seeAll
643
- })) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
644
- key: "macyContainer",
645
- className: "macyContainer"
634
+ })) : /*#__PURE__*/_react["default"].createElement("div", {
635
+ key: "scrollContainer",
636
+ className: (0, _classnames["default"])('scrollContainer', {
637
+ pl_100: layout === 'layout5'
638
+ })
646
639
  }, products.map(function (item) {
647
- return /*#__PURE__*/_react["default"].createElement(_ProductItem["default"], {
648
- key: item.productId,
640
+ return /*#__PURE__*/_react["default"].createElement("div", {
641
+ className: "productCard"
642
+ }, /*#__PURE__*/_react["default"].createElement(_ProductItem["default"], {
643
+ key: "scroll_" + item.productId,
649
644
  data: item,
650
- fixHeight: layout === 'layout3',
645
+ fixHeight: true,
651
646
  imgHeight: imgHeight,
652
647
  imgWidth: imgWidth,
653
- layout: layout === 'layout2' ? 'horizontal' : 'vertical',
654
648
  onItemClick: function onItemClick() {
655
649
  return (0, _coreUtil.clickUrl)("/product/detail/" + item.offerId + "?productId=" + (item.sppProductId || item.productId || ''));
656
650
  },
657
651
  panelProps: panelProps.content,
658
652
  showProgress: false
659
- });
660
- })), _seeAll.open && products.length > 0 && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
653
+ }));
654
+ }), _seeAll.open && products.length > 0 && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
661
655
  className: "btnSeeAll",
662
656
  data: _seeAll
663
657
  })));
package/es/meta-comp/components/Image/index.js CHANGED
@@ -11,6 +11,8 @@ var _classnames = _interopRequireDefault(require("classnames"));
11
11
 
12
12
  require("./index.less");
13
13
 
14
+ var _defaultImg = _interopRequireDefault(require("./image/default-img.png"));
15
+
14
16
  var _coreUtil = require("../../../utils/coreUtil");
15
17
 
16
18
  var _decorator = require("../../../decorator");
@@ -161,10 +163,11 @@ function (_super) {
161
163
 
162
164
  if (window.magicDesign.isShop && (srcImg === null || srcImg === void 0 ? void 0 : srcImg.includes('ecommerce/static'))) {
163
165
  srcImg = srcImg.replace('ecommerce/static', 'static');
164
- } // if (!srcImg) {
165
- // srcImg = defaultImg;
166
- // }
166
+ }
167
167
 
168
+ if (!srcImg) {
169
+ srcImg = _defaultImg["default"];
170
+ }
168
171
 
169
172
  return /*#__PURE__*/_react["default"].createElement("div", {
170
173
  className: (0, _classnames["default"])('m-meta-image', {
package/lib/composite-comp/common/components/ImageLabel/index.js CHANGED
@@ -71,14 +71,14 @@ function (_super) {
71
71
  return /*#__PURE__*/_react["default"].createElement("img", {
72
72
  key: label.imgUrl || label.labelPictureUrl,
73
73
  alt: "img",
74
- className: (0, _classnames["default"])('image-label-wrap', 'img', (_a = {}, _a["position-" + (label.position || 'default')] = true, _a.small = small, _a)),
74
+ className: (0, _classnames["default"])('image-label-wrap', 'img', (_a = {}, _a["position-" + label.position] = true, _a.small = small, _a)),
75
75
  src: label.imgUrl || label.labelPictureUrl
76
76
  });
77
77
  }
78
78
 
79
79
  return /*#__PURE__*/_react["default"].createElement("div", {
80
80
  key: label.labelName,
81
- className: (0, _classnames["default"])('image-label-wrap', (_b = {}, _b["position-" + (label.position || 'default')] = true, _b))
81
+ className: (0, _classnames["default"])('image-label-wrap', (_b = {}, _b["position-" + label.position] = true, _b))
82
82
  }, label.labelName);
83
83
  });
84
84
  };
package/lib/composite-comp/common/components/ImageLabel/index.less CHANGED
@@ -1,3 +1,4 @@
1
+
1
2
  .image-label-wrap {
2
3
  position: absolute;
3
4
  z-index: 1;
@@ -12,8 +13,7 @@
12
13
  }
13
14
  }
14
15
 
15
- &.position-1,
16
- &.position-default {
16
+ &.position-1 {
17
17
  top: 0;
18
18
  left: 0;
19
19
  }
@@ -32,4 +32,4 @@
32
32
  bottom: 0;
33
33
  right: 0;
34
34
  }
35
- }
35
+ }
package/lib/composite-comp/common/components/ProductItem/index.less CHANGED
@@ -4,14 +4,11 @@
4
4
  background: #FFFFFF;
5
5
  border: 1px solid #D2D9E5;
6
6
  width: 142px;
7
- border-radius: 8px;
8
7
 
9
8
  .img-wrap {
10
9
  position: relative;
11
- border-radius: 8px;
12
10
 
13
11
  .product-img {
14
- border-radius: 8px;
15
12
  width: 140px;
16
13
  height: 140px;
17
14
  object-fit: cover;
@@ -36,7 +33,7 @@
36
33
  }
37
34
 
38
35
  .product-name {
39
- margin-bottom: 5px;
36
+ margin-bottom: 3px;
40
37
  // font-family: 'Montserrat';
41
38
  // font-style: normal;
42
39
  // font-weight: 500;
@@ -60,7 +57,7 @@
60
57
 
61
58
  .old-price-wrap {
62
59
  display: flex;
63
- margin-top: 3px;
60
+ margin-top: 0px;
64
61
  align-items: baseline;
65
62
  white-space: nowrap;
66
63
  overflow: hidden;
@@ -71,9 +68,11 @@
71
68
  font-family: 'Montserrat';
72
69
  font-style: normal;
73
70
  font-weight: 700;
74
- font-size: 12px;
71
+ font-size: 8px;
75
72
  line-height: 15px;
76
- color: #2F3043;
73
+ color: #fff;
74
+ padding: 0 4px;
75
+ background-color: #CE1126;
77
76
  }
78
77
 
79
78
  .old-price {
package/lib/composite-comp/dito/components/Recommend/defaultJSON.js CHANGED
@@ -279,8 +279,14 @@ var getDefaultJSON = function getDefaultJSON() {
279
279
  }
280
280
  },
281
281
  customize: {
282
- layout: 'left',
283
- align: 'left'
282
+ layout: {
283
+ pcLayout: 'layout1',
284
+ h5Layout: 'layout1'
285
+ },
286
+ align: 'left',
287
+ pcRowNum: 6,
288
+ pcMaxRowNum: 6,
289
+ pcMinRowNum: 5
284
290
  },
285
291
  background: {
286
292
  opacity: 100,
package/lib/composite-comp/dito/components/Recommend/mobile/index.js CHANGED
@@ -227,10 +227,6 @@ var __spreadArrays = void 0 && (void 0).__spreadArrays || function () {
227
227
  };
228
228
 
229
229
  var LAYOUT_IMAGE_SIZE = {
230
- left: {
231
- w: '100%',
232
- h: 165
233
- },
234
230
  layout1: {
235
231
  w: '100%',
236
232
  h: 164
@@ -416,10 +412,8 @@ function (_super) {
416
412
  };
417
413
 
418
414
  _this.resetLayout = function () {
419
- var layout = _this.props.panelProps.customize.layout.h5Layout || _this.props.panelProps.customize.layout; // 后面删除
420
-
415
+ var layout = _this.props.panelProps.customize.layout.h5Layout;
421
416
  var LAYOUT_COLUMN = {
422
- left: 2,
423
417
  layout1: 2,
424
418
  layout2: 1,
425
419
  layout3: 3
@@ -543,7 +537,7 @@ function (_super) {
543
537
  hideTabs: hideTabs
544
538
  });
545
539
  });
546
- var curLayout = panelProps.customize.layout.h5Layout || panelProps.customize.layout; // 后面删除
540
+ var curLayout = panelProps.customize.layout.h5Layout;
547
541
 
548
542
  if (curLayout !== this.preLayout) {
549
543
  this.resetLayout();
@@ -565,7 +559,7 @@ function (_super) {
565
559
  var bgStyle = this.getBackgroundStyle();
566
560
  var products = this.state["products" + tabIndex] || [];
567
561
  var isDivide = groupSource.length <= 3;
568
- var layout = panelProps.customize.layout.h5Layout || panelProps.customize.layout; // 后面删除
562
+ var layout = panelProps.customize.layout.h5Layout;
569
563
 
570
564
  var _seeAll = (0, _commonUtil.ensure)(function () {
571
565
  return groupSource[tabIndex].seeAll;
@@ -617,47 +611,47 @@ function (_super) {
617
611
  transform: "translateX(" + tabLeft + "px)",
618
612
  background: this.getTabBarActiveColor(panelProps)
619
613
  }
620
- })), ['layout4', 'layout5'].includes(layout) ? /*#__PURE__*/_react["default"].createElement("div", {
621
- key: "scrollContainer",
622
- className: (0, _classnames["default"])('scrollContainer', {
623
- pl_100: layout === 'layout5'
624
- })
614
+ })), ['layout1', 'layout2', 'layout3'].includes(layout) ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
615
+ key: "macyContainer",
616
+ className: "macyContainer"
625
617
  }, products.map(function (item) {
626
- return /*#__PURE__*/_react["default"].createElement("div", {
627
- className: "productCard"
628
- }, /*#__PURE__*/_react["default"].createElement(_ProductItem["default"], {
629
- key: "scroll_" + item.productId,
618
+ return /*#__PURE__*/_react["default"].createElement(_ProductItem["default"], {
619
+ key: item.productId,
630
620
  data: item,
631
- fixHeight: true,
621
+ fixHeight: layout === 'layout3',
632
622
  imgHeight: imgHeight,
633
623
  imgWidth: imgWidth,
624
+ layout: layout === 'layout2' ? 'horizontal' : 'vertical',
634
625
  onItemClick: function onItemClick() {
635
626
  return (0, _coreUtil.clickUrl)("/product/detail/" + item.offerId + "?productId=" + (item.sppProductId || item.productId || ''));
636
627
  },
637
628
  panelProps: panelProps.content,
638
629
  showProgress: false
639
- }));
640
- }), _seeAll.open && products.length > 0 && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
630
+ });
631
+ })), _seeAll.open && products.length > 0 && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
641
632
  className: "btnSeeAll",
642
633
  data: _seeAll
643
- })) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
644
- key: "macyContainer",
645
- className: "macyContainer"
634
+ })) : /*#__PURE__*/_react["default"].createElement("div", {
635
+ key: "scrollContainer",
636
+ className: (0, _classnames["default"])('scrollContainer', {
637
+ pl_100: layout === 'layout5'
638
+ })
646
639
  }, products.map(function (item) {
647
- return /*#__PURE__*/_react["default"].createElement(_ProductItem["default"], {
648
- key: item.productId,
640
+ return /*#__PURE__*/_react["default"].createElement("div", {
641
+ className: "productCard"
642
+ }, /*#__PURE__*/_react["default"].createElement(_ProductItem["default"], {
643
+ key: "scroll_" + item.productId,
649
644
  data: item,
650
- fixHeight: layout === 'layout3',
645
+ fixHeight: true,
651
646
  imgHeight: imgHeight,
652
647
  imgWidth: imgWidth,
653
- layout: layout === 'layout2' ? 'horizontal' : 'vertical',
654
648
  onItemClick: function onItemClick() {
655
649
  return (0, _coreUtil.clickUrl)("/product/detail/" + item.offerId + "?productId=" + (item.sppProductId || item.productId || ''));
656
650
  },
657
651
  panelProps: panelProps.content,
658
652
  showProgress: false
659
- });
660
- })), _seeAll.open && products.length > 0 && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
653
+ }));
654
+ }), _seeAll.open && products.length > 0 && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
661
655
  className: "btnSeeAll",
662
656
  data: _seeAll
663
657
  })));
package/lib/meta-comp/components/Image/index.js CHANGED
@@ -11,6 +11,8 @@ var _classnames = _interopRequireDefault(require("classnames"));
11
11
 
12
12
  require("./index.less");
13
13
 
14
+ var _defaultImg = _interopRequireDefault(require("./image/default-img.png"));
15
+
14
16
  var _coreUtil = require("../../../utils/coreUtil");
15
17
 
16
18
  var _decorator = require("../../../decorator");
@@ -161,10 +163,11 @@ function (_super) {
161
163
 
162
164
  if (window.magicDesign.isShop && (srcImg === null || srcImg === void 0 ? void 0 : srcImg.includes('ecommerce/static'))) {
163
165
  srcImg = srcImg.replace('ecommerce/static', 'static');
164
- } // if (!srcImg) {
165
- // srcImg = defaultImg;
166
- // }
166
+ }
167
167
 
168
+ if (!srcImg) {
169
+ srcImg = _defaultImg["default"];
170
+ }
168
171
 
169
172
  return /*#__PURE__*/_react["default"].createElement("div", {
170
173
  className: (0, _classnames["default"])('m-meta-image', {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@fonixtree/magic-design",
3
3
  "author": "Cylon Team",
4
- "version": "0.0.43",
4
+ "version": "0.0.44",
5
5
  "description": "Magic Design",
6
6
  "license": "MIT",
7
7
  "module": "es/index.js",