@fonixtree/magic-design 1.0.162 → 1.0.164

package/es/common/ProductCardModal/index.js

@@ -44,19 +44,17 @@ function ProductCardModal(_a) {
 
   var flag = true;
 
-  var _data = data.slice(0, 2);
-
   var handleNext = function handleNext(e) {
     e.stopPropagation();
     setActive(function (prev) {
-      return (prev + 1) % _data.length;
+      return (prev + 1) % data.length;
     });
   };
 
   var handlePrev = function handlePrev(e) {
     e.stopPropagation();
     setActive(function (prev) {
-      return (prev - 1 + _data.length) % _data.length;
+      return (prev - 1 + data.length) % data.length;
     });
   };
 
@@ -64,9 +62,32 @@ function ProductCardModal(_a) {
     return index === active;
   };
 
+  var isShow = function isShow(index) {
+    if (data.length > 3) {
+      var oneShow = 0;
+      var twoShow = 0;
+
+      if (active === 0) {
+        oneShow = data.length - 1;
+        twoShow = active + 1;
+      } else if (active === data.length - 1) {
+        oneShow = active - 1;
+        twoShow = 0;
+      } else {
+        oneShow = active - 1;
+        twoShow = active + 1;
+      }
+
+      return index === oneShow || index === twoShow;
+    } else {
+      return true;
+    }
+  };
+
   var randomRotateY = function randomRotateY(index) {
     // return Math.floor(Math.random() * 21) - 10;
-    return Math.floor((index % 2 === 0 ? -index : index) * 0.1 * 21) - 10;
+    // return Math.floor((index % 2 === 0 ? -index : index) * 0.1 * 21) - 10;
+    return index === 0 || index === 1 ? -10 : 10;
   };
 
   var handleScroll = function handleScroll(e) {
@@ -123,15 +144,15 @@ function ProductCardModal(_a) {
     onClick: function onClick(e) {
       return e.stopPropagation();
     }
-  }, /*#__PURE__*/_react["default"].createElement(_framerMotion.AnimatePresence, null, _data.map(function (item, index) {
+  }, /*#__PURE__*/_react["default"].createElement(_framerMotion.AnimatePresence, null, data.map(function (item, index) {
     return /*#__PURE__*/_react["default"].createElement(_framerMotion.motion.div, {
       key: item.offerId,
       animate: {
-        opacity: isActive(index) ? 1 : 0.7,
+        opacity: isActive(index) ? 1 : isShow(index) ? 0.7 : 0,
         scale: isActive(index) ? 1 : 0.95,
         z: isActive(index) ? 0 : -100,
         rotate: isActive(index) ? 0 : randomRotateY(index),
-        zIndex: isActive(index) ? 999 : _data.length + 2 - index,
+        zIndex: isActive(index) ? 999 : data.length + 2 - index,
         y: isActive(index) ? [0, -80, 0] : 0
       },
       className: "card",

package/es/common/Toast/index.js

@@ -0,0 +1,30 @@
+"use strict";
+
+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); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = Toast;
+
+var _react = _interopRequireWildcard(require("react"));
+
+require("./index.less");
+
+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; }
+
+function Toast(_a) {
+  var message = _a.message,
+      onClose = _a.onClose,
+      duration = _a.duration;
+  (0, _react.useEffect)(function () {
+    setTimeout(function () {
+      onClose();
+    }, duration);
+  }, []);
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "toastWrap"
+  }, /*#__PURE__*/_react["default"].createElement("span", null, message));
+}

package/es/common/Toast/index.less

@@ -0,0 +1,29 @@
+.toastWrap {
+  position: fixed;
+  display: flex;
+  top: 40%;
+  left: 20px;
+  right: 20px;
+  z-index: 99999;
+  transform: translateZ(1000px);
+  background-color: #e5f6ea;
+  min-height: 32px;
+  align-items: center;
+  margin-bottom: 15px;
+  background: rgba(0, 0, 0, 0.8);
+  border-radius: 16px;
+  animation: fadeIn .2s linear;
+
+  span {
+    text-overflow: ellipsis;
+    color: #fff;
+    font-weight: 500;
+    font-size: 14px;
+    text-align: center;
+    color: #FFFFFF;
+    line-height: 24px;
+    padding: 15px;
+    letter-spacing: .5px;
+    width: 100%;
+  }
+}

package/es/common/index.js

@@ -147,6 +147,12 @@ Object.defineProperty(exports, "SystemNotification", {
     return _SystemNotification["default"];
   }
 });
+Object.defineProperty(exports, "Toast", {
+  enumerable: true,
+  get: function get() {
+    return _Toast["default"];
+  }
+});
 Object.defineProperty(exports, "UrlPicker", {
   enumerable: true,
   get: function get() {
@@ -228,4 +234,6 @@ var _ErrorBoundary = _interopRequireDefault(require("./ErrorBoundary"));
 
 var _ProductCardModal = _interopRequireDefault(require("./ProductCardModal"));
 
+var _Toast = _interopRequireDefault(require("./Toast"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

package/es/composite-comp/common/components/ProductItem/index.js

@@ -144,13 +144,7 @@ function (_super) {
     var salePercent = Number(data.salePercent) / 100 || 0;
     var imgStyle = {};
     if (imgWidth) imgStyle.width = imgWidth;
-    if (imgHeight) imgStyle.height = imgHeight; // data.labels = [
-    //   {
-    //     position: 1,
-    //     imgUrl: '/get/resource/platform/20241129/picture/Group1162591862390719062056960.png',
-    //   },
-    // ];
-
+    if (imgHeight) imgStyle.height = imgHeight;
     var imgLabels = ((_a = data.labels) === null || _a === void 0 ? void 0 : _a.filter(function (f) {
       return f.position !== '6' && f.position !== '7';
     })) || [];
@@ -159,7 +153,20 @@ function (_super) {
     })) || [];
     var priceLabels = ((_c = data.labels) === null || _c === void 0 ? void 0 : _c.filter(function (f) {
       return f.position === '7';
-    })) || [];
+    })) || []; // ad 卡片
+
+    if (data.type === 'ad') {
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        className: "m-product-item-advertise"
+      }, data.url && /*#__PURE__*/_react["default"].createElement("img", {
+        alt: "welcome advertise",
+        onClick: function onClick() {
+          (0, _commonUtil.jumpUrlConfig)(data.adObj);
+        },
+        src: data.url
+      }));
+    }
+
     return /*#__PURE__*/_react["default"].createElement("div", _extends({
       className: (0, _classnames["default"])('m-product-item-wrap', {
         fixHeight: fixHeight,

package/es/composite-comp/common/components/ProductItem/index.less

@@ -1,3 +1,10 @@
+.m-product-item-advertise {
+  img {
+    width: 100%;
+    border-radius: 8px;
+  }
+}
+
 .m-product-item-wrap {
   display: flex;
   flex-direction: column;

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

@@ -270,6 +270,54 @@ var LAYOUT_IMAGE_SIZE = {
     h: 110
   }
 };
+/**
+ * 将第二个数组随机插入到第一个数组中
+ * @param {Array} array1 - 第一个数组
+ * @param {Array} array2 - 第二个数组
+ * @returns {Array} - 返回合并后的新数组
+ */
+
+var insertArrayRandomly = function insertArrayRandomly(arr1, arr2) {
+  // 创建一个复制的第一个数组，以免修改原数组
+  var result = __spreadArrays(arr1); // 记录已插入元素的位置
+
+
+  var insertedIndices = [];
+
+  var _loop_1 = function _loop_1(i) {
+    var randomIndex; // 确保生成的随机索引与已插入的索引相隔至少两个位置
+
+    do {
+      randomIndex = Math.floor(Math.random() * (result.length + 1)); // eslint-disable-next-line no-loop-func
+    } while (insertedIndices.some(function (index) {
+      return Math.abs(index - randomIndex) < 2;
+    })); // 在随机位置插入第二个数组的元素
+
+
+    result.splice(randomIndex, 0, arr2[i]); // 记录已插入的位置
+
+    insertedIndices.push(randomIndex);
+  }; // 随机插入第二个数组的元素
+  // eslint-disable-next-line no-plusplus
+
+
+  for (var i = 0; i < arr2.length; i++) {
+    _loop_1(i);
+  }
+
+  return result;
+};
+
+var getRandomItemsAndRemove = function getRandomItemsAndRemove(arr, count) {
+  var result = []; // eslint-disable-next-line no-plusplus
+
+  for (var i = 0; i < count && arr.length > 0; i++) {
+    var randomIndex = Math.floor(Math.random() * arr.length);
+    result.push(arr.splice(randomIndex, 1)[0]);
+  }
+
+  return result;
+};
 
 var RecommendMobile =
 /** @class */
@@ -279,6 +327,7 @@ function (_super) {
   function RecommendMobile() {
     var _this = _super !== null && _super.apply(this, arguments) || this;
 
+    _this.ads = [];
     _this.preData = {};
     _this.preLayout = '';
     _this.preContent = '';
@@ -328,16 +377,51 @@ function (_super) {
       }, '#CE1126') : '#CE1126';
     };
 
+    _this.getAdvertise = function () {
+      return __awaiter(_this, void 0, void 0, function () {
+        var res;
+        return __generator(this, function (_a) {
+          switch (_a.label) {
+            case 0:
+              return [4
+              /*yield*/
+              , (0, _commonUtil.commonFetch)('/designer/v1/h5/ad/today/valid/MagicDesignRecommendation/list', {}, 'GET')];
+
+            case 1:
+              res = _a.sent();
+
+              if (res === null || res === void 0 ? void 0 : res.length) {
+                return [2
+                /*return*/
+                , res.map(function (it) {
+                  var _a, _b, _c;
+
+                  return {
+                    type: 'ad',
+                    url: (_b = (_a = it === null || it === void 0 ? void 0 : it.advertiseContents) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.url,
+                    adObj: (_c = it === null || it === void 0 ? void 0 : it.advertiseContents) === null || _c === void 0 ? void 0 : _c[0]
+                  };
+                })];
+              }
+
+              return [2
+              /*return*/
+              , []];
+          }
+        });
+      });
+    };
+
     _this.getProductList = function (index) {
       return __awaiter(_this, void 0, void 0, function () {
-        var panelProps, groupSource, recommendId, pageId, cache, _a, _b, sourceType, _c, prodIds, _d, prodType, _e, intelligentType, _f, intelligentValue, _g, maxProdNum, newData, params, res, res, e_1, _cache;
+        var panelProps, groupSource, recommendId, pageId, cache, _a, _b, sourceType, _c, prodIds, _d, prodType, _e, intelligentType, _f, intelligentValue, _g, maxProdNum, newData, params, res, res, e_1, _h, insertAds, _cache;
 
-        var _h, _j, _k;
+        var _j, _k, _l;
 
         var _this = this;
 
-        return __generator(this, function (_l) {
-          switch (_l.label) {
+        return __generator(this, function (_m) {
+          switch (_m.label) {
             case 0:
               panelProps = this.props.panelProps;
               groupSource = this.state.groupSource;
@@ -349,7 +433,7 @@ function (_super) {
 
                 if (cache) {
                   if ("products" + index in cache) {
-                    this.setState((_h = {}, _h["products" + index] = cache["products" + index], _h), function () {
+                    this.setState((_j = {}, _j["products" + index] = cache["products" + index], _j), function () {
                       _this.resetLayout();
                     });
                     /** 如果数据未过期 */
@@ -363,10 +447,10 @@ function (_super) {
 
               _a = groupSource[index] || {}, _b = _a.sourceType, sourceType = _b === void 0 ? '' : _b, _c = _a.prodIds, prodIds = _c === void 0 ? '' : _c, _d = _a.prodType, prodType = _d === void 0 ? '' : _d, _e = _a.intelligentType, intelligentType = _e === void 0 ? '' : _e, _f = _a.intelligentValue, intelligentValue = _f === void 0 ? [] : _f, _g = _a.maxProdNum, maxProdNum = _g === void 0 ? 10 : _g;
               newData = [];
-              _l.label = 1;
+              _m.label = 1;
 
             case 1:
-              _l.trys.push([1, 9,, 10]);
+              _m.trys.push([1, 9,, 10]);
 
               if (!(groupSource.length > 0)) return [3
               /*break*/
@@ -392,7 +476,7 @@ function (_super) {
               , (0, _commonUtil.commonFetch)('/designer/v1/h5/products', params, 'GET')];
 
             case 2:
-              res = _l.sent();
+              res = _m.sent();
               newData = __spreadArrays(res.list);
               return [3
               /*break*/
@@ -415,7 +499,7 @@ function (_super) {
               }, 'POST')];
 
             case 4:
-              res = _l.sent();
+              res = _m.sent();
               newData = __spreadArrays(res.pageInfo.list);
               return [3
               /*break*/
@@ -423,7 +507,7 @@ function (_super) {
 
             case 5:
               newData = [];
-              _l.label = 6;
+              _m.label = 6;
 
             case 6:
               return [3
@@ -432,7 +516,7 @@ function (_super) {
 
             case 7:
               newData = [];
-              _l.label = 8;
+              _m.label = 8;
 
             case 8:
               return [3
@@ -440,19 +524,29 @@ function (_super) {
               , 10];
 
             case 9:
-              e_1 = _l.sent();
+              e_1 = _m.sent();
               newData = [];
               return [3
               /*break*/
               , 10];
 
             case 10:
+              _h = this;
+              return [4
+              /*yield*/
+              , this.getAdvertise()];
+
+            case 11:
+              _h.ads = _m.sent();
+              insertAds = getRandomItemsAndRemove(this.ads, 2);
+              newData = insertArrayRandomly(newData, insertAds);
+
               if (!(0, _coreUtil.isDesignMode)()) {
                 _cache = (0, _storeUtil.getMagicStore)("recommend_" + pageId + "_" + recommendId);
-                (0, _storeUtil.setMagicStore)("recommend_" + pageId + "_" + recommendId, __assign(__assign({}, _cache), (_j = {}, _j["products" + index] = newData, _j.endTime = Date.now() + 3 * 60 * 1000, _j)));
+                (0, _storeUtil.setMagicStore)("recommend_" + pageId + "_" + recommendId, __assign(__assign({}, _cache), (_k = {}, _k["products" + index] = newData, _k.endTime = Date.now() + 3 * 60 * 1000, _k)));
               }
 
-              this.setState((_k = {}, _k["products" + index] = newData, _k), function () {
+              this.setState((_l = {}, _l["products" + index] = newData, _l), function () {
                 _this.resetLayout();
               });
               return [2

package/es/core/Renderer/index.js

@@ -81,6 +81,10 @@ var Renderer = function Renderer(props) {
       pcProdCardModalState = _c[0],
       setPcProdCardModalState = _c[1];
 
+  var _d = (0, _react.useState)(_mobx.frameStore.toastState),
+      toastState = _d[0],
+      setToastState = _d[1];
+
   if (!noSetWindow) {
     setDesignConfig(props);
   }
@@ -137,6 +141,7 @@ var Renderer = function Renderer(props) {
     var disposer = (0, _mobx.autorun)(function () {
       setModalState(_mobx.frameStore.modalState);
       setPcProdCardModalState(_mobx.frameStore.pcProdCardModalState);
+      setToastState(_mobx.frameStore.toastState);
     });
     return function () {
       disposer();
@@ -164,6 +169,14 @@ var Renderer = function Renderer(props) {
     });
   };
 
+  var onCloseToast = function onCloseToast() {
+    _mobx.frameStore.setState({
+      toastState: {
+        visible: false
+      }
+    });
+  };
+
   var getRestStyle = function getRestStyle() {
     if (modalState.visible) {
       return {
@@ -211,6 +224,8 @@ var Renderer = function Renderer(props) {
     onClose: onCloseModal
   })), pcProdCardModalState.visible && /*#__PURE__*/_react["default"].createElement(_common.ProductCardModal, _extends({}, pcProdCardModalState, {
     onClose: onCloseProdCardModal
+  })), toastState.visible && /*#__PURE__*/_react["default"].createElement(_common.Toast, _extends({}, toastState, {
+    onClose: onCloseToast
   })));
 };
 

package/es/locale/en/en.json

@@ -1,4 +1,5 @@
 {
+  "COLLECT_VOUCHER_SUCCESS": "Collect voucher success!",
   "LOGIN_BUTTON": "Login Button",
   "SEARCH_ICON": "Search Icon",
   "NAVIGATION": "Navigation",

package/es/locale/es/es.json

@@ -1,4 +1,5 @@
 {
+  "COLLECT_VOUCHER_SUCCESS": "Collect voucher success!",
   "LOGIN_BUTTON": "Login Button",
   "SEARCH_ICON": "Search Icon",
   "NAVIGATION": "Navigation",

package/es/locale/id/id.json

@@ -1,4 +1,5 @@
 {
+  "COLLECT_VOUCHER_SUCCESS": "Collect voucher success!",
   "LOGIN_BUTTON": "Login Button",
   "SEARCH_ICON": "Search Icon",
   "NAVIGATION": "Navigation",

package/es/mobx/Frame.js

@@ -64,11 +64,17 @@ function () {
       visible: false,
       data: []
     };
+    this.toastState = {
+      visible: false,
+      message: '',
+      onClose: function onClose() {}
+    };
     (0, _mobx.makeObservable)(this, {
       confirmState: _mobx.observable,
       textModalState: _mobx.observable,
       modalState: _mobx.observable,
-      pcProdCardModalState: _mobx.observable
+      pcProdCardModalState: _mobx.observable,
+      toastState: _mobx.observable
     });
   }
   /** 修改状态 */