@fonixtree/magic-design 1.0.145 → 1.0.149

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.
@@ -115,7 +115,7 @@ function ProductCardModal(_a) {
115
115
  onLoad: function onLoad() {
116
116
  return setLoading(false);
117
117
  },
118
- src: item.imgUrl
118
+ src: item.cardImgUrl
119
119
  }), !loading && /*#__PURE__*/_react["default"].createElement("div", {
120
120
  className: "absoluteWrap"
121
121
  }, /*#__PURE__*/_react["default"].createElement(_framerMotion.motion.div, {
@@ -139,7 +139,7 @@ function ProductCardModal(_a) {
139
139
  }
140
140
  }, /*#__PURE__*/_react["default"].createElement("div", {
141
141
  dangerouslySetInnerHTML: {
142
- __html: (0, _commonUtil.xssDecode)(item.goodsIntroduce)
142
+ __html: (0, _commonUtil.xssDecode)(item.goodsIntroduce || '')
143
143
  }
144
144
  })), index === active && /*#__PURE__*/_react["default"].createElement(_Iconfont["default"], {
145
145
  className: "closIcon",
@@ -14,7 +14,7 @@
14
14
 
15
15
  .content {
16
16
  position: relative;
17
- width: 60%;
17
+ width: 50%;
18
18
 
19
19
  .card {
20
20
  transform-origin: bottom;
@@ -728,9 +728,11 @@ function (_super) {
728
728
  var _a = this.props,
729
729
  videoId = _a.videoId,
730
730
  opts = _a.opts,
731
- play = _a.play;
731
+ play = _a.play,
732
+ onClick = _a.onClick;
732
733
  return /*#__PURE__*/_react["default"].createElement("div", {
733
- className: "video-container"
734
+ className: "video-container",
735
+ onClick: onClick
734
736
  }, opts.source ? /*#__PURE__*/_react["default"].createElement("div", {
735
737
  className: "video-wrap",
736
738
  id: 'video' + videoId
@@ -129,7 +129,8 @@ function (_super) {
129
129
  data: tab.hover.groupName,
130
130
  iconHeight: 46
131
131
  }) : /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
132
- data: tab.groupName
132
+ data: tab.groupName,
133
+ iconHeight: 46
133
134
  })));
134
135
  })), /*#__PURE__*/_react["default"].createElement("div", {
135
136
  className: "tab-content"
@@ -174,6 +174,8 @@
174
174
  }
175
175
 
176
176
  .carousel-img {
177
+ min-height: 400px;
178
+
177
179
  .bgImg {
178
180
  // height: 700px;
179
181
  }
@@ -11,6 +11,8 @@ var _react = _interopRequireWildcard(require("react"));
11
11
 
12
12
  var _framerMotion = require("framer-motion");
13
13
 
14
+ var _debounce = _interopRequireDefault(require("lodash/debounce"));
15
+
14
16
  var _CardItem = _interopRequireDefault(require("../CardItem"));
15
17
 
16
18
  require("./index.less");
@@ -57,33 +59,43 @@ function ParallaxScroll(_a) {
57
59
  var translateFirst = (0, _framerMotion.useTransform)(scrollYProgress, [0, 1], [0, colOneScrollY]);
58
60
  var translateSecond = (0, _framerMotion.useTransform)(scrollYProgress, [0, 1], [0, colTwoScrollY]);
59
61
  var translateThird = (0, _framerMotion.useTransform)(scrollYProgress, [0, 1], [0, colThreeScrollY]);
62
+
63
+ var initLayout = function initLayout() {
64
+ var _a, _b, _c;
65
+
66
+ console.log('init...');
67
+ var colOneHeight = (_a = colOneRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight;
68
+ var colTwoHeight = (_b = colTwoRef.current) === null || _b === void 0 ? void 0 : _b.offsetHeight;
69
+ var colThreeHeight = (_c = colThreeRef.current) === null || _c === void 0 ? void 0 : _c.offsetHeight;
70
+ var colHeights = [colOneHeight, colTwoHeight, colThreeHeight];
71
+ var space = Math.max.apply(Math, colHeights) - Math.min.apply(Math, colHeights) - 20;
72
+ var minHeightIndex = colHeights.indexOf(Math.min.apply(Math, colHeights));
73
+
74
+ if (minHeightIndex === 0) {
75
+ setColOneScrollY(space);
76
+ setColTwoScrollY(colOneHeight - colTwoHeight + space);
77
+ setColThreeScrollY(colOneHeight - colThreeHeight + space);
78
+ } else if (minHeightIndex === 1) {
79
+ setColOneScrollY(colTwoHeight - colOneHeight + space);
80
+ setColTwoScrollY(space);
81
+ setColThreeScrollY(colTwoHeight - colThreeHeight + space);
82
+ } else {
83
+ setColOneScrollY(colThreeHeight - colOneHeight + space);
84
+ setColTwoScrollY(colThreeHeight - colTwoHeight + space);
85
+ setColThreeScrollY(space);
86
+ }
87
+ };
88
+
60
89
  (0, _react.useEffect)(function () {
61
- setTimeout(function () {
62
- var _a, _b, _c;
63
-
64
- if (!(0, _coreUtil.isDesignMode)()) {
65
- var colOneHeight = (_a = colOneRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight;
66
- var colTwoHeight = (_b = colTwoRef.current) === null || _b === void 0 ? void 0 : _b.offsetHeight;
67
- var colThreeHeight = (_c = colThreeRef.current) === null || _c === void 0 ? void 0 : _c.offsetHeight;
68
- var colHeights = [colOneHeight, colTwoHeight, colThreeHeight];
69
- var space = Math.max.apply(Math, colHeights) - Math.min.apply(Math, colHeights) - 20;
70
- var minHeightIndex = colHeights.indexOf(Math.min.apply(Math, colHeights));
71
-
72
- if (minHeightIndex === 0) {
73
- setColOneScrollY(space);
74
- setColTwoScrollY(colOneHeight - colTwoHeight + space);
75
- setColThreeScrollY(colOneHeight - colThreeHeight + space);
76
- } else if (minHeightIndex === 1) {
77
- setColOneScrollY(colTwoHeight - colOneHeight + space);
78
- setColTwoScrollY(space);
79
- setColThreeScrollY(colTwoHeight - colThreeHeight + space);
80
- } else {
81
- setColOneScrollY(colThreeHeight - colOneHeight + space);
82
- setColTwoScrollY(colThreeHeight - colTwoHeight + space);
83
- setColThreeScrollY(space);
84
- }
85
- }
86
- }, 1000);
90
+ if (!(0, _coreUtil.isDesignMode)()) {
91
+ setTimeout(function () {
92
+ initLayout();
93
+ }, 1500);
94
+ window.addEventListener('resize', (0, _debounce["default"])(initLayout, 200));
95
+ return function () {
96
+ window.removeEventListener('resize', initLayout);
97
+ };
98
+ }
87
99
  }, [scrollYProgress]);
88
100
  return /*#__PURE__*/_react["default"].createElement("div", {
89
101
  className: "m-parallax-scroll"
@@ -372,7 +372,7 @@ var clickUrl = function clickUrl(url, state) {
372
372
  params = _c === void 0 ? {} : _c;
373
373
  console.log('params...', params); // PC商品卡片弹窗
374
374
 
375
- if (params.type === _constants.urlTypeMap.CARD_PRODUCT_LIST) {
375
+ if (params.type === 'CARD_PRODUCT_LIST') {
376
376
  createProdCardModal(params.offerIds);
377
377
  return;
378
378
  }
@@ -115,7 +115,7 @@ function ProductCardModal(_a) {
115
115
  onLoad: function onLoad() {
116
116
  return setLoading(false);
117
117
  },
118
- src: item.imgUrl
118
+ src: item.cardImgUrl
119
119
  }), !loading && /*#__PURE__*/_react["default"].createElement("div", {
120
120
  className: "absoluteWrap"
121
121
  }, /*#__PURE__*/_react["default"].createElement(_framerMotion.motion.div, {
@@ -139,7 +139,7 @@ function ProductCardModal(_a) {
139
139
  }
140
140
  }, /*#__PURE__*/_react["default"].createElement("div", {
141
141
  dangerouslySetInnerHTML: {
142
- __html: (0, _commonUtil.xssDecode)(item.goodsIntroduce)
142
+ __html: (0, _commonUtil.xssDecode)(item.goodsIntroduce || '')
143
143
  }
144
144
  })), index === active && /*#__PURE__*/_react["default"].createElement(_Iconfont["default"], {
145
145
  className: "closIcon",
@@ -14,7 +14,7 @@
14
14
 
15
15
  .content {
16
16
  position: relative;
17
- width: 60%;
17
+ width: 50%;
18
18
 
19
19
  .card {
20
20
  transform-origin: bottom;
@@ -728,9 +728,11 @@ function (_super) {
728
728
  var _a = this.props,
729
729
  videoId = _a.videoId,
730
730
  opts = _a.opts,
731
- play = _a.play;
731
+ play = _a.play,
732
+ onClick = _a.onClick;
732
733
  return /*#__PURE__*/_react["default"].createElement("div", {
733
- className: "video-container"
734
+ className: "video-container",
735
+ onClick: onClick
734
736
  }, opts.source ? /*#__PURE__*/_react["default"].createElement("div", {
735
737
  className: "video-wrap",
736
738
  id: 'video' + videoId
@@ -129,7 +129,8 @@ function (_super) {
129
129
  data: tab.hover.groupName,
130
130
  iconHeight: 46
131
131
  }) : /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
132
- data: tab.groupName
132
+ data: tab.groupName,
133
+ iconHeight: 46
133
134
  })));
134
135
  })), /*#__PURE__*/_react["default"].createElement("div", {
135
136
  className: "tab-content"
@@ -174,6 +174,8 @@
174
174
  }
175
175
 
176
176
  .carousel-img {
177
+ min-height: 400px;
178
+
177
179
  .bgImg {
178
180
  // height: 700px;
179
181
  }
@@ -11,6 +11,8 @@ var _react = _interopRequireWildcard(require("react"));
11
11
 
12
12
  var _framerMotion = require("framer-motion");
13
13
 
14
+ var _debounce = _interopRequireDefault(require("lodash/debounce"));
15
+
14
16
  var _CardItem = _interopRequireDefault(require("../CardItem"));
15
17
 
16
18
  require("./index.less");
@@ -57,33 +59,43 @@ function ParallaxScroll(_a) {
57
59
  var translateFirst = (0, _framerMotion.useTransform)(scrollYProgress, [0, 1], [0, colOneScrollY]);
58
60
  var translateSecond = (0, _framerMotion.useTransform)(scrollYProgress, [0, 1], [0, colTwoScrollY]);
59
61
  var translateThird = (0, _framerMotion.useTransform)(scrollYProgress, [0, 1], [0, colThreeScrollY]);
62
+
63
+ var initLayout = function initLayout() {
64
+ var _a, _b, _c;
65
+
66
+ console.log('init...');
67
+ var colOneHeight = (_a = colOneRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight;
68
+ var colTwoHeight = (_b = colTwoRef.current) === null || _b === void 0 ? void 0 : _b.offsetHeight;
69
+ var colThreeHeight = (_c = colThreeRef.current) === null || _c === void 0 ? void 0 : _c.offsetHeight;
70
+ var colHeights = [colOneHeight, colTwoHeight, colThreeHeight];
71
+ var space = Math.max.apply(Math, colHeights) - Math.min.apply(Math, colHeights) - 20;
72
+ var minHeightIndex = colHeights.indexOf(Math.min.apply(Math, colHeights));
73
+
74
+ if (minHeightIndex === 0) {
75
+ setColOneScrollY(space);
76
+ setColTwoScrollY(colOneHeight - colTwoHeight + space);
77
+ setColThreeScrollY(colOneHeight - colThreeHeight + space);
78
+ } else if (minHeightIndex === 1) {
79
+ setColOneScrollY(colTwoHeight - colOneHeight + space);
80
+ setColTwoScrollY(space);
81
+ setColThreeScrollY(colTwoHeight - colThreeHeight + space);
82
+ } else {
83
+ setColOneScrollY(colThreeHeight - colOneHeight + space);
84
+ setColTwoScrollY(colThreeHeight - colTwoHeight + space);
85
+ setColThreeScrollY(space);
86
+ }
87
+ };
88
+
60
89
  (0, _react.useEffect)(function () {
61
- setTimeout(function () {
62
- var _a, _b, _c;
63
-
64
- if (!(0, _coreUtil.isDesignMode)()) {
65
- var colOneHeight = (_a = colOneRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight;
66
- var colTwoHeight = (_b = colTwoRef.current) === null || _b === void 0 ? void 0 : _b.offsetHeight;
67
- var colThreeHeight = (_c = colThreeRef.current) === null || _c === void 0 ? void 0 : _c.offsetHeight;
68
- var colHeights = [colOneHeight, colTwoHeight, colThreeHeight];
69
- var space = Math.max.apply(Math, colHeights) - Math.min.apply(Math, colHeights) - 20;
70
- var minHeightIndex = colHeights.indexOf(Math.min.apply(Math, colHeights));
71
-
72
- if (minHeightIndex === 0) {
73
- setColOneScrollY(space);
74
- setColTwoScrollY(colOneHeight - colTwoHeight + space);
75
- setColThreeScrollY(colOneHeight - colThreeHeight + space);
76
- } else if (minHeightIndex === 1) {
77
- setColOneScrollY(colTwoHeight - colOneHeight + space);
78
- setColTwoScrollY(space);
79
- setColThreeScrollY(colTwoHeight - colThreeHeight + space);
80
- } else {
81
- setColOneScrollY(colThreeHeight - colOneHeight + space);
82
- setColTwoScrollY(colThreeHeight - colTwoHeight + space);
83
- setColThreeScrollY(space);
84
- }
85
- }
86
- }, 1000);
90
+ if (!(0, _coreUtil.isDesignMode)()) {
91
+ setTimeout(function () {
92
+ initLayout();
93
+ }, 1500);
94
+ window.addEventListener('resize', (0, _debounce["default"])(initLayout, 200));
95
+ return function () {
96
+ window.removeEventListener('resize', initLayout);
97
+ };
98
+ }
87
99
  }, [scrollYProgress]);
88
100
  return /*#__PURE__*/_react["default"].createElement("div", {
89
101
  className: "m-parallax-scroll"
@@ -372,7 +372,7 @@ var clickUrl = function clickUrl(url, state) {
372
372
  params = _c === void 0 ? {} : _c;
373
373
  console.log('params...', params); // PC商品卡片弹窗
374
374
 
375
- if (params.type === _constants.urlTypeMap.CARD_PRODUCT_LIST) {
375
+ if (params.type === 'CARD_PRODUCT_LIST') {
376
376
  createProdCardModal(params.offerIds);
377
377
  return;
378
378
  }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@fonixtree/magic-design",
3
3
  "author": "Cylon Team",
4
- "version": "1.0.145",
4
+ "version": "1.0.149",
5
5
  "description": "Magic Design",
6
6
  "license": "MIT",
7
7
  "module": "es/index.js",