@fonixtree/magic-design 2.0.156 → 2.0.158

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

@@ -90,14 +90,18 @@ var renderDiscount = function renderDiscount(data) {
   var text = '';
 
   if (AMT) {
-    text = (0, _currencyUtil.formatCurrency)(data.discountAmount);
+    text = (0, _currencyUtil.formatCurrencyWithSymbol)(data.discountAmount);
   } else if (DISC) {
     var temp = (0, _currencyUtil.formatCurrency)(data.discountAmount, 2); // 折扣券处理：100 => 1%
 
     text = parseInt(temp, 10) + "%";
   }
 
-  return text;
+  return {
+    text: text,
+    isBig: text.length > 6 && text.length <= 9,
+    isHide: text.length > 9
+  };
 };
 
 exports.renderDiscount = renderDiscount;
@@ -181,14 +185,14 @@ function (_super) {
       className: "discount-tag"
     }, isWill ? (0, _locale.i18n)('COMING_SOON') : data.discountPercent + "% " + (0, _locale.i18n)('OFF'))), /*#__PURE__*/_react["default"].createElement("div", {
       className: "content-wrap"
-    }, /*#__PURE__*/_react["default"].createElement("div", {
+    }, showProName && panelProps.productName.open && /*#__PURE__*/_react["default"].createElement("div", {
       className: "product-name-wrap"
     }, /*#__PURE__*/_react["default"].createElement("div", {
       className: "box"
     }, prodLabels.length > 0 && /*#__PURE__*/_react["default"].createElement(_ImageLabel["default"], {
       labels: prodLabels,
       small: true
-    }), showProName && panelProps.productName.open && /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
+    }), /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
       data: __assign(__assign({}, panelProps.productName), {
         text: data.offerName
       }),
@@ -242,15 +246,18 @@ function (_super) {
       readonly: true
     }))), intelligentType === 'Coupon' && data.coupons && data.coupons.length > 0 && /*#__PURE__*/_react["default"].createElement("div", {
       className: "coupons-list"
-    }, data.coupons.slice(0, 4).map(function (m) {
+    }, data.coupons.map(function (m) {
       return /*#__PURE__*/_react["default"].createElement("div", {
         key: m.couponId,
-        className: (0, _classnames["default"])('item', m.discountMethod)
+        className: (0, _classnames["default"])('item', m.discountMethod, {
+          big: renderDiscount(m).isBig,
+          hide: renderDiscount(m).isHide
+        })
       }, /*#__PURE__*/_react["default"].createElement("div", {
         className: "name"
       }, (0, _locale.i18n)('DISCOUNT')), /*#__PURE__*/_react["default"].createElement("div", {
         className: "num"
-      }, renderDiscount(m)));
+      }, renderDiscount(m).text));
     })), showProgress && /*#__PURE__*/_react["default"].createElement("div", {
       className: "progress-wrap"
     }, ((_j = panelProps.salesProgress) === null || _j === void 0 ? void 0 : _j.open) && /*#__PURE__*/_react["default"].createElement("div", {

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

@@ -10,7 +10,7 @@
   .img-wrap {
     position: relative;
     border-radius: 8px;
-    overflow: hidden;
+    // overflow: hidden;
 
     .product-img {
       width: 140px;
@@ -156,6 +156,8 @@
       display: flex;
       flex-wrap: wrap;
       margin-top: 8px;
+      max-height: 48px;
+      overflow: hidden;
 
       .item {
         display: block;
@@ -164,7 +166,7 @@
         color: #F47A46;
         background: url('./imgs/coupon-orange.png') no-repeat center;
         background-size: 100% !important;
-        margin-right: 6px;
+        margin-right: 5px;
         margin-bottom: 4px;
         line-height: 1;
         text-align: center;
@@ -175,6 +177,24 @@
           background: url('./imgs/coupon-red.png') no-repeat center;
         }
 
+        &.DISC.big {
+          background: url('./imgs/coupon-red-big.png') no-repeat center;
+        }
+
+        &.big {
+          width: 75px;
+          background: url('./imgs/coupon-orange-big.png') no-repeat center;
+
+          .num,
+          .name {
+            width: 62px;
+          }
+        }
+
+        &.hide {
+          display: none;
+        }
+
         .name {
           font-size: 5px;
           width: 40px;
@@ -239,6 +259,7 @@
 
     .img-wrap {
       border-radius: 8px 0 0 8px;
+      margin-right: 8px;
 
       .product-img {
         width: 100px;

package/es/composite-comp/dito/components/FlashDeal/mobile/index.less

@@ -76,12 +76,12 @@
   justify-content: flex-start;
 }
 .m-flash-deal-mobile .flash-deal-list-vertical .m-product-item-wrap {
-  width: 2.84rem;
+  width: 2.44rem;
   margin-right: 0.16rem;
 }
 .m-flash-deal-mobile .flash-deal-list-vertical .m-product-item-wrap .product-img {
-  height: 2.8rem;
-  width: 2.8rem;
+  height: 2.4rem;
+  width: 2.4rem;
 }
 .m-flash-deal-mobile .flash-deal-list-horizontal {
   display: flex;

package/es/composite-comp/monpay/components/MonpayRecommend/mobile/index.js

@@ -236,9 +236,9 @@ var defaultData = [{
   imgUrlContent: {
     url: _card["default"]
   },
-  offerName: 'Product Name',
+  offerName: 'Product Name Long Long Long Long Long',
   salesPrice: 10000,
-  specialPrice: 8000,
+  specialPrice: null,
   marketPrice: 20000,
   salePercent: 500,
   discountPercent: 90,
@@ -249,19 +249,19 @@ var defaultData = [{
   }, {
     couponId: '2',
     discountMethod: 'AMT',
-    discountAmount: 10000
+    discountAmount: 100
   }, {
     couponId: '3',
-    discountMethod: 'DISC',
-    discountAmount: 30
+    discountMethod: 'AMT',
+    discountAmount: 1000
   }, {
     couponId: '4',
     discountMethod: 'AMT',
     discountAmount: 10000
   }, {
     couponId: '5',
-    discountMethod: 'DISC',
-    discountAmount: 30
+    discountMethod: 'AMT',
+    discountAmount: 100000
   }]
 }, {
   imgUrlContent: {
@@ -276,7 +276,7 @@ var defaultData = [{
   imgUrlContent: {
     url: _card["default"]
   },
-  offerName: 'Product Name',
+  offerName: 'Product Name Long Long Long Long Long',
   salesPrice: 18000000,
   specialPrice: 18000000,
   marketPrice: 19000000,
@@ -857,6 +857,7 @@ function (_super) {
       return /*#__PURE__*/_react["default"].createElement(_MonpayProductItem["default"], {
         key: "scroll_" + item.productId,
         data: item,
+        fixHeight: true,
         imgHeight: imgHeight,
         imgWidth: imgWidth,
         intelligentType: (_a = groupSource[tabIndex]) === null || _a === void 0 ? void 0 : _a.intelligentType,

package/lib/composite-comp/common/components/MonpayProductItem/index.js

@@ -90,14 +90,18 @@ var renderDiscount = function renderDiscount(data) {
   var text = '';
 
   if (AMT) {
-    text = (0, _currencyUtil.formatCurrency)(data.discountAmount);
+    text = (0, _currencyUtil.formatCurrencyWithSymbol)(data.discountAmount);
   } else if (DISC) {
     var temp = (0, _currencyUtil.formatCurrency)(data.discountAmount, 2); // 折扣券处理：100 => 1%
 
     text = parseInt(temp, 10) + "%";
   }
 
-  return text;
+  return {
+    text: text,
+    isBig: text.length > 6 && text.length <= 9,
+    isHide: text.length > 9
+  };
 };
 
 exports.renderDiscount = renderDiscount;
@@ -181,14 +185,14 @@ function (_super) {
       className: "discount-tag"
     }, isWill ? (0, _locale.i18n)('COMING_SOON') : data.discountPercent + "% " + (0, _locale.i18n)('OFF'))), /*#__PURE__*/_react["default"].createElement("div", {
       className: "content-wrap"
-    }, /*#__PURE__*/_react["default"].createElement("div", {
+    }, showProName && panelProps.productName.open && /*#__PURE__*/_react["default"].createElement("div", {
       className: "product-name-wrap"
     }, /*#__PURE__*/_react["default"].createElement("div", {
       className: "box"
     }, prodLabels.length > 0 && /*#__PURE__*/_react["default"].createElement(_ImageLabel["default"], {
       labels: prodLabels,
       small: true
-    }), showProName && panelProps.productName.open && /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
+    }), /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
       data: __assign(__assign({}, panelProps.productName), {
         text: data.offerName
       }),
@@ -242,15 +246,18 @@ function (_super) {
       readonly: true
     }))), intelligentType === 'Coupon' && data.coupons && data.coupons.length > 0 && /*#__PURE__*/_react["default"].createElement("div", {
       className: "coupons-list"
-    }, data.coupons.slice(0, 4).map(function (m) {
+    }, data.coupons.map(function (m) {
       return /*#__PURE__*/_react["default"].createElement("div", {
         key: m.couponId,
-        className: (0, _classnames["default"])('item', m.discountMethod)
+        className: (0, _classnames["default"])('item', m.discountMethod, {
+          big: renderDiscount(m).isBig,
+          hide: renderDiscount(m).isHide
+        })
       }, /*#__PURE__*/_react["default"].createElement("div", {
         className: "name"
       }, (0, _locale.i18n)('DISCOUNT')), /*#__PURE__*/_react["default"].createElement("div", {
         className: "num"
-      }, renderDiscount(m)));
+      }, renderDiscount(m).text));
     })), showProgress && /*#__PURE__*/_react["default"].createElement("div", {
       className: "progress-wrap"
     }, ((_j = panelProps.salesProgress) === null || _j === void 0 ? void 0 : _j.open) && /*#__PURE__*/_react["default"].createElement("div", {

package/lib/composite-comp/common/components/MonpayProductItem/index.less

@@ -10,7 +10,7 @@
   .img-wrap {
     position: relative;
     border-radius: 8px;
-    overflow: hidden;
+    // overflow: hidden;
 
     .product-img {
       width: 140px;
@@ -156,6 +156,8 @@
       display: flex;
       flex-wrap: wrap;
       margin-top: 8px;
+      max-height: 48px;
+      overflow: hidden;
 
       .item {
         display: block;
@@ -164,7 +166,7 @@
         color: #F47A46;
         background: url('./imgs/coupon-orange.png') no-repeat center;
         background-size: 100% !important;
-        margin-right: 6px;
+        margin-right: 5px;
         margin-bottom: 4px;
         line-height: 1;
         text-align: center;
@@ -175,6 +177,24 @@
           background: url('./imgs/coupon-red.png') no-repeat center;
         }
 
+        &.DISC.big {
+          background: url('./imgs/coupon-red-big.png') no-repeat center;
+        }
+
+        &.big {
+          width: 75px;
+          background: url('./imgs/coupon-orange-big.png') no-repeat center;
+
+          .num,
+          .name {
+            width: 62px;
+          }
+        }
+
+        &.hide {
+          display: none;
+        }
+
         .name {
           font-size: 5px;
           width: 40px;
@@ -239,6 +259,7 @@
 
     .img-wrap {
       border-radius: 8px 0 0 8px;
+      margin-right: 8px;
 
       .product-img {
         width: 100px;

package/lib/composite-comp/dito/components/FlashDeal/mobile/index.less

@@ -76,12 +76,12 @@
   justify-content: flex-start;
 }
 .m-flash-deal-mobile .flash-deal-list-vertical .m-product-item-wrap {
-  width: 2.84rem;
+  width: 2.44rem;
   margin-right: 0.16rem;
 }
 .m-flash-deal-mobile .flash-deal-list-vertical .m-product-item-wrap .product-img {
-  height: 2.8rem;
-  width: 2.8rem;
+  height: 2.4rem;
+  width: 2.4rem;
 }
 .m-flash-deal-mobile .flash-deal-list-horizontal {
   display: flex;

package/lib/composite-comp/monpay/components/MonpayRecommend/mobile/index.js

@@ -236,9 +236,9 @@ var defaultData = [{
   imgUrlContent: {
     url: _card["default"]
   },
-  offerName: 'Product Name',
+  offerName: 'Product Name Long Long Long Long Long',
   salesPrice: 10000,
-  specialPrice: 8000,
+  specialPrice: null,
   marketPrice: 20000,
   salePercent: 500,
   discountPercent: 90,
@@ -249,19 +249,19 @@ var defaultData = [{
   }, {
     couponId: '2',
     discountMethod: 'AMT',
-    discountAmount: 10000
+    discountAmount: 100
   }, {
     couponId: '3',
-    discountMethod: 'DISC',
-    discountAmount: 30
+    discountMethod: 'AMT',
+    discountAmount: 1000
   }, {
     couponId: '4',
     discountMethod: 'AMT',
     discountAmount: 10000
   }, {
     couponId: '5',
-    discountMethod: 'DISC',
-    discountAmount: 30
+    discountMethod: 'AMT',
+    discountAmount: 100000
   }]
 }, {
   imgUrlContent: {
@@ -276,7 +276,7 @@ var defaultData = [{
   imgUrlContent: {
     url: _card["default"]
   },
-  offerName: 'Product Name',
+  offerName: 'Product Name Long Long Long Long Long',
   salesPrice: 18000000,
   specialPrice: 18000000,
   marketPrice: 19000000,
@@ -857,6 +857,7 @@ function (_super) {
       return /*#__PURE__*/_react["default"].createElement(_MonpayProductItem["default"], {
         key: "scroll_" + item.productId,
         data: item,
+        fixHeight: true,
         imgHeight: imgHeight,
         imgWidth: imgWidth,
         intelligentType: (_a = groupSource[tabIndex]) === null || _a === void 0 ? void 0 : _a.intelligentType,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fonixtree/magic-design",
   "author": "Cylon Team",
-  "version": "2.0.156",
+  "version": "2.0.158",
   "description": "Magic Design",
   "license": "MIT",
   "module": "es/index.js",