@fonixtree/magic-design 2.0.202 → 2.0.204

package/lib/common/VideoPC/index.less

@@ -0,0 +1,79 @@
+.video-container {
+  position: relative;
+  height: 100%;
+  background-image: linear-gradient(0, rgba(0, 0, 0, .2), rgba(0, 0, 0, .1), rgba(0, 0, 0, .2));
+  &:empty {
+    height: 400px;
+  }
+
+  .video-cover-img {
+    position: absolute;
+    top: 0;
+    right: 0;
+    left: 0;
+    bottom: 0;
+    object-fit: cover;
+    width: 100%;
+    height: 100%;
+    z-index: 0;
+  }
+
+  .prism-player .prism-cover {
+    z-index: 0;
+  }
+  .prism-player video{
+    position:relative !important;
+    left: 0 !important;
+    top: 0 !important;
+    transform: none !important;
+    display: block !important;
+  }
+
+  .video-wrap {
+    width: 100%;
+    height: 100%;
+  }
+}
+
+.pc-video-modal-wrap {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 999;
+
+  .video-shadow-wrap {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 1000;
+    opacity: .4;
+    background-color: #000;
+  }
+
+  .content-wrap {
+    width: 1100px;
+    max-width: 90%;
+    height: 600px;
+    // padding: 10px;
+    background: rgb(255 255 255);
+    border-radius: 5px;
+    z-index: 1001;
+    position: relative;
+
+    .close-img-wrap {
+      position: absolute;
+      right: 14px;
+      top: 14px;
+      width: 20px;
+      height: 20px;
+      cursor: pointer;
+    }
+  }
+}

package/lib/common/index.js

@@ -117,6 +117,12 @@ Object.defineProperty(exports, "PopUpModal", {
     return _PopUpModal["default"];
   }
 });
+Object.defineProperty(exports, "ProductCardModal", {
+  enumerable: true,
+  get: function get() {
+    return _ProductCardModal["default"];
+  }
+});
 Object.defineProperty(exports, "ProductFilterModal", {
   enumerable: true,
   get: function get() {
@@ -165,6 +171,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() {
@@ -177,6 +189,12 @@ Object.defineProperty(exports, "Video", {
     return _Video["default"];
   }
 });
+Object.defineProperty(exports, "VideoPC", {
+  enumerable: true,
+  get: function get() {
+    return _VideoPC["default"];
+  }
+});
 Object.defineProperty(exports, "VideoUpload", {
   enumerable: true,
   get: function get() {
@@ -224,6 +242,8 @@ var _SystemNotification = _interopRequireDefault(require("./SystemNotification")
 
 var _Video = _interopRequireDefault(require("./Video"));
 
+var _VideoPC = _interopRequireDefault(require("./VideoPC"));
+
 var _SwiperBan = _interopRequireDefault(require("./SwiperBan"));
 
 var _InputNumber = _interopRequireDefault(require("./InputNumber"));
@@ -244,4 +264,8 @@ var _ProductFilterModal = _interopRequireDefault(require("./ProductFilterModal")
 
 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/lib/composite-comp/common/components/ProductItem/index.js

@@ -146,13 +146,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';
     })) || [];
@@ -161,7 +155,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/lib/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/lib/composite-comp/common/config-panels/BackgroundConfig/index.js

@@ -49,47 +49,34 @@ function (_super) {
   __extends(BackgroundConfig, _super);
 
   function BackgroundConfig() {
-    var _this = _super !== null && _super.apply(this, arguments) || this;
-
-    _this.state = {};
-    return _this;
+    return _super !== null && _super.apply(this, arguments) || this;
   }
 
   BackgroundConfig.prototype.render = function () {
     var _this = this;
 
-    var _a, _b, _c, _d, _e;
-
-    var _f = this.props,
-        data = _f.data,
-        component = _f.component;
-
-    if (!data.tabBackground) {
-      data.tabBackground = {
-        opacity: 100,
-        color: '#232F46',
-        image: '',
-        tabBgType: 'color'
-      };
-    }
-
+    var _a = this.props,
+        data = _a.data,
+        name = _a.name,
+        type = _a.type;
     return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_common.Field, {
-      title: component === 'recommend' ? (0, _locale.i18n)('PRODUCT_BACKGROUND') : (0, _locale.i18n)('BACKGROUND')
-    }, /*#__PURE__*/_react["default"].createElement(_antd.Select, {
+      title: name
+    }, type === 'all' && /*#__PURE__*/_react["default"].createElement(_antd.Select, {
       onChange: function onChange(bgType) {
         data.bgType = bgType;
+        data.tabBgType = bgType;
 
         _this.selfRender();
       },
       style: {
         marginBottom: '15px'
       },
-      value: data.bgType
+      value: data.bgType || data.tabBgType
     }, /*#__PURE__*/_react["default"].createElement(_antd.Select.Option, {
       value: "color"
     }, (0, _locale.i18n)('COLOR')), /*#__PURE__*/_react["default"].createElement(_antd.Select.Option, {
       value: "image"
-    }, (0, _locale.i18n)('IMAGE'))), data.bgType === 'color' ? /*#__PURE__*/_react["default"].createElement(_common.ColorPickerInput, {
+    }, (0, _locale.i18n)('IMAGE'))), (type === 'color' || data.bgType === 'color' || data.tabBgType === 'color') && /*#__PURE__*/_react["default"].createElement(_common.ColorPickerInput, {
       colorType: "rgba",
       onChange: function onChange(v) {
         data.opacity = 1;
@@ -98,7 +85,7 @@ function (_super) {
         _this.selfRender();
       },
       value: data.color
-    }) : /*#__PURE__*/_react["default"].createElement(_common.ImagePicker, {
+    }), (type === 'image' || data.bgType === 'image' || data.tabBgType === 'image') && /*#__PURE__*/_react["default"].createElement(_common.ImagePicker, {
       imageSelectedWay: data.imageSelectedWay || {
         pc: '',
         mobile: ''
@@ -115,48 +102,6 @@ function (_super) {
         _this.selfRender();
       },
       value: data.image
-    })), component === 'recommend' && /*#__PURE__*/_react["default"].createElement(_common.Field, {
-      title: (0, _locale.i18n)('TAB_BACKGROUND')
-    }, /*#__PURE__*/_react["default"].createElement(_antd.Select, {
-      onChange: function onChange(tabBgType) {
-        data.tabBackground.tabBgType = tabBgType;
-
-        _this.selfRender();
-      },
-      style: {
-        marginBottom: '15px'
-      },
-      value: (_a = data.tabBackground) === null || _a === void 0 ? void 0 : _a.tabBgType
-    }, /*#__PURE__*/_react["default"].createElement(_antd.Select.Option, {
-      value: "color"
-    }, (0, _locale.i18n)('COLOR')), /*#__PURE__*/_react["default"].createElement(_antd.Select.Option, {
-      value: "image"
-    }, (0, _locale.i18n)('IMAGE'))), ((_b = data.tabBackground) === null || _b === void 0 ? void 0 : _b.tabBgType) === 'color' ? /*#__PURE__*/_react["default"].createElement(_common.ColorPickerInput, {
-      colorType: "rgba",
-      onChange: function onChange(v) {
-        data.tabBackground.opacity = 1;
-        data.tabBackground.color = v;
-
-        _this.selfRender();
-      },
-      value: (_c = data.tabBackground) === null || _c === void 0 ? void 0 : _c.color
-    }) : /*#__PURE__*/_react["default"].createElement(_common.ImagePicker, {
-      imageSelectedWay: ((_d = data.tabBackground) === null || _d === void 0 ? void 0 : _d.imageSelectedWay) || {
-        pc: '',
-        mobile: ''
-      },
-      onChange: function onChange(v, way) {
-        if (v) {
-          data.tabBackground.image = v.url;
-        }
-
-        if (way) {
-          data.tabBackground.imageSelectedWay = way;
-        }
-
-        _this.selfRender();
-      },
-      value: (_e = data.tabBackground) === null || _e === void 0 ? void 0 : _e.image
     })));
   };
 
@@ -166,13 +111,10 @@ function (_super) {
       color: '#232F46',
       image: '',
       bgType: 'color',
-      tabBackground: {
-        opacity: 100,
-        color: '#232F46',
-        image: '',
-        tabBgType: 'color'
-      }
-    }
+      tabBgType: 'color'
+    },
+    name: (0, _locale.i18n)('BACKGROUND'),
+    type: 'all'
   };
   return BackgroundConfig;
 }(_BaseConfig["default"]);

package/lib/composite-comp/common/config-panels/SpacingConfig/index.js

@@ -63,6 +63,8 @@ function (_super) {
     var _a = this.props,
         data = _a.data,
         configCompSpace = _a.configCompSpace,
+        configLineSpace = _a.configLineSpace,
+        configColumnSpace = _a.configColumnSpace,
         configWidth = _a.configWidth,
         fillUpWidth = _a.fillUpWidth;
     var obj = data[window.magicDesign.device] || {};
@@ -153,11 +155,39 @@ function (_super) {
       value: {
         count: obj.marginBottom
       }
+    })), configLineSpace && /*#__PURE__*/_react["default"].createElement(_common.Field, {
+      title: (0, _locale.i18n)('LINE_SPACING')
+    }, /*#__PURE__*/_react["default"].createElement(_common.Slider, {
+      maxVal: 100,
+      minVal: 0,
+      onChange: function onChange(value) {
+        obj.lineSpace = value.count;
+
+        _this.selfRender();
+      },
+      value: {
+        count: obj.lineSpace
+      }
+    })), configColumnSpace && /*#__PURE__*/_react["default"].createElement(_common.Field, {
+      title: (0, _locale.i18n)('COLUMN_SPACING')
+    }, /*#__PURE__*/_react["default"].createElement(_common.Slider, {
+      maxVal: 100,
+      minVal: 0,
+      onChange: function onChange(value) {
+        obj.columnSpace = value.count;
+
+        _this.selfRender();
+      },
+      value: {
+        count: obj.columnSpace
+      }
     })));
   };
 
   SpacingConfig.defaultProps = {
     configCompSpace: true,
+    configLineSpace: false,
+    configColumnSpace: false,
     configWidth: false,
     fillUpWidth: false,
     data: {

package/lib/composite-comp/dito/components/CommonFunctions/defaultJSON.js

@@ -26,7 +26,7 @@ var CommonFunctionsGroupSourceJSON = function CommonFunctionsGroupSourceJSON(tex
       content: {
         sizeType: 'Customize font styles',
         fontFamily: defaultFontFamily,
-        fontWeight: 600,
+        fontWeight: 500,
         fontSize: 14,
         color: '#2C2C2C',
         width: 0,

package/lib/composite-comp/dito/components/CommonFunctions/mobile/index.js

@@ -9,12 +9,16 @@ var _react = _interopRequireDefault(require("react"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
+var _isEmpty = _interopRequireDefault(require("lodash/isEmpty"));
+
 var _components = require("../../../../../meta-comp/components");
 
 var _common = require("../../../../../common");
 
 var _commonUtil = require("../../../../../utils/commonUtil");
 
+var _storeUtil = require("../../../../../utils/storeUtil");
+
 require("./index.less");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -71,11 +75,15 @@ function (_super) {
     var _this = this;
 
     var data = this.props.data;
+    var LPObj = (0, _storeUtil.getSessionStore)('channelPurchase') || {};
     return /*#__PURE__*/_react["default"].createElement("div", {
       className: (0, _classnames["default"])('common-functions-mobile')
     }, /*#__PURE__*/_react["default"].createElement("ul", null, data.groupSource.map(function (item) {
       return /*#__PURE__*/_react["default"].createElement("li", {
         key: item.id,
+        className: (0, _classnames["default"])({
+          hide: !(0, _isEmpty["default"])(LPObj) && item.title.text === 'Security Center'
+        }),
         onClick: function onClick() {
           return _this.onItemClick(item);
         }

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

@@ -14,6 +14,9 @@
   justify-content: space-between;
   align-items: center;
 }
+.common-functions-mobile ul li.hide {
+  display: none;
+}
 .common-functions-mobile ul li .content-wrap {
   display: flex;
   align-items: center;

package/lib/composite-comp/dito/components/FlashDeal/defaultJSON.js

@@ -7,8 +7,6 @@ exports.getDefaultJSON = void 0;
 
 var _uuid = require("uuid");
 
-var _base = require("../../../../assets/images/base64");
-
 var _constants = require("../../../../constants");
 
 var getDefaultJSON = function getDefaultJSON() {
@@ -20,10 +18,24 @@ var getDefaultJSON = function getDefaultJSON() {
     id: (0, _uuid.v4)(),
     type: 'FLASH_DEAL',
     title: {
-      icon: {
+      image: {
         id: (0, _uuid.v4)(),
         open: true,
-        url: _base.flashIcon
+        type: 'IMAGE',
+        content: {
+          h5Name: 'name2',
+          pcName: 'name2',
+          h5ImgSrc: '',
+          pcImgSrc: '',
+          clickUrl: ''
+        },
+        hover: {
+          open: false,
+          backgroundType: 'enlarge',
+          magnification: 1.5,
+          pcImgHoverUrl: '',
+          h5ImgHoverUrl: ''
+        }
       },
       headline: {
         id: (0, _uuid.v4)(),
@@ -154,7 +166,8 @@ var getDefaultJSON = function getDefaultJSON() {
           fontFamily: defaultFontFamily,
           fontWeight: 500,
           fontSize: 14,
-          color: '#2C2C2C'
+          color: '#2C2C2C',
+          pcFontSize: 19
         },
         underline: {
           open: false,
@@ -178,7 +191,8 @@ var getDefaultJSON = function getDefaultJSON() {
           fontFamily: defaultFontFamily,
           fontWeight: 600,
           fontSize: 14,
-          color: '#CE1126'
+          color: '#CE1126',
+          pcFontSize: 32
         },
         underline: {
           open: false,
@@ -202,6 +216,7 @@ var getDefaultJSON = function getDefaultJSON() {
           fontFamily: defaultFontFamily,
           fontWeight: 500,
           fontSize: 10,
+          pcFontSize: 16,
           color: '#929292'
         },
         underline: {
@@ -222,7 +237,7 @@ var getDefaultJSON = function getDefaultJSON() {
         text: '',
         content: {
           sizeType: 'Customize font styles',
-          fontFamily: 'Montserrat',
+          fontFamily: defaultFontFamily,
           fontWeight: 700,
           fontSize: 12,
           color: '#2C2C2C',
@@ -259,11 +274,10 @@ var getDefaultJSON = function getDefaultJSON() {
       }
     },
     customize: {
-      layout: 'layout1',
-      align: 'left',
-      pcRowNum: 6,
-      pcMaxRowNum: 6,
-      pcMinRowNum: 5
+      layout: {
+        h5Layout: 'layout1',
+        pcLayout: 'layout1'
+      }
     },
     background: {
       opacity: 100,

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

@@ -377,15 +377,15 @@ function (_super) {
   };
 
   FlashDealMobile.prototype.render = function () {
-    var _a, _b;
+    var _a, _b, _c, _d, _e;
 
     var panelProps = this.props.panelProps;
-    var _c = this.state,
-        list = _c.list,
-        effDate = _c.effDate,
-        expDate = _c.expDate,
-        now = _c.now,
-        isWill = _c.isWill;
+    var _f = this.state,
+        list = _f.list,
+        effDate = _f.effDate,
+        expDate = _f.expDate,
+        now = _f.now,
+        isWill = _f.isWill;
 
     var _list = list.length === 0 && (0, _coreUtil.isDesignMode)() ? defaultData : list;
 
@@ -395,16 +395,15 @@ function (_super) {
       className: "flash-deal-title"
     }, /*#__PURE__*/_react["default"].createElement("div", {
       className: "left"
-    }, panelProps.title.icon.open && panelProps.title.icon.url && /*#__PURE__*/_react["default"].createElement("img", {
-      alt: "",
+    }, ((_a = panelProps.title.image) === null || _a === void 0 ? void 0 : _a.open) && /*#__PURE__*/_react["default"].createElement(_components.MetaImage, {
       className: "icon",
-      src: panelProps.title.icon.url
+      data: panelProps.title.image
     }), panelProps.title.headline.open && /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
       className: "title",
       data: panelProps.title.headline
     }), isWill && /*#__PURE__*/_react["default"].createElement("span", {
       className: "sub-title"
-    }, (0, _locale.i18n)('NEXT')), ((_a = panelProps.title) === null || _a === void 0 ? void 0 : _a.countDown) && ((_b = panelProps.title.countDown) === null || _b === void 0 ? void 0 : _b.open) && /*#__PURE__*/_react["default"].createElement(_CountDown["default"], {
+    }, (0, _locale.i18n)('NEXT')), ((_b = panelProps.title) === null || _b === void 0 ? void 0 : _b.countDown) && ((_c = panelProps.title.countDown) === null || _c === void 0 ? void 0 : _c.open) && /*#__PURE__*/_react["default"].createElement(_CountDown["default"], {
       effDate: effDate,
       expDate: expDate,
       now: now,
@@ -419,17 +418,19 @@ function (_super) {
       data: panelProps.title.button
     }))), /*#__PURE__*/_react["default"].createElement("div", {
       className: (0, _classnames["default"])('flash-deal-list', {
-        'flash-deal-list-vertical': panelProps.customize.layout === 'layout1',
-        'flash-deal-list-horizontal': panelProps.customize.layout === 'layout2'
+        'flash-deal-list-vertical': ((_d = panelProps.customize.layout) === null || _d === void 0 ? void 0 : _d.h5Layout) !== 'layout2',
+        'flash-deal-list-horizontal': ((_e = panelProps.customize.layout) === null || _e === void 0 ? void 0 : _e.h5Layout) === 'layout2'
       })
     }, _list.map(function (item) {
+      var _a;
+
       return /*#__PURE__*/_react["default"].createElement(_ProductItem["default"], {
         key: item.id,
         data: __assign(__assign({}, item), {
           salePercent: isWill ? 0 : item.salePercent
         }) // onItemClick={() => clickUrl(`/product/detail/${item.offerId}?productId=${item.sppProductId ?? ''}`)}
         ,
-        layout: panelProps.customize.layout === 'layout2' ? 'horizontal' : 'vertical',
+        layout: ((_a = panelProps.customize.layout) === null || _a === void 0 ? void 0 : _a.h5Layout) === 'layout2' ? 'horizontal' : 'vertical',
         onItemClick: function onItemClick() {
           if (window.magicDesign.pushGA) {
             window.magicDesign.pushGA({}, 'select_promotion', {