@fonixtree/magic-design 2.0.98 → 2.0.99

package/lib/common/PopUpModal/index.less

@@ -0,0 +1,79 @@
+.popUpModal {
+  display: flex;
+  position: fixed;
+  left: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  flex-direction: column;
+  width: 100%;
+  z-index: 1000;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transform: translateZ(1000px);
+
+  .modal-shadow {
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0, 0, 0, .5);
+    position: absolute;
+    left: 0;
+    right: 0;
+    top: 0;
+    bottom: 0;
+    z-index: -1;
+  }
+
+  .modal-content {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    width: 100%;
+    padding: 20px;
+    display: flex;
+    flex-direction: column;
+    background-color: #fff;
+    box-shadow: 0px 4px 8px rgba(96, 97, 112, 0.16);
+    animation: bounceIn .5s linear;
+    margin-top: -80px;
+    max-height: 60%;
+    border-radius: 10px 10px 0 0;
+
+    .modal-title {
+      color: #000;
+      font-size: 16px;
+      font-weight: 600;
+      text-align: center;
+    }
+
+    .modal-icon-close {
+      position: absolute;
+      right: 20px;
+      top: 20px;
+    }
+
+    .modal-message {
+      margin: 20px 10px;
+      overflow-y: scroll;
+      height: calc(100% - 64px);
+      color: rgb(0, 0, 0);
+      text-align: center;
+    }
+
+    .message-max-height {
+      height: calc(100% - 114px);
+    }
+
+    .modal-btn-wrap {
+      display: flex;
+      flex-direction: column;
+
+
+      .confirm {
+        margin: 10px 0;
+      }
+    }
+  }
+}

package/lib/common/PopUpModal1/style.less

@@ -0,0 +1,56 @@
+.container {
+  :global {
+    .topLineWrap {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      height: 24px;
+
+      .topLine {
+        width: 42px;
+        height: 4px;
+        background: rgba(233, 233, 233, 1);
+        border-radius: 2px;
+      }
+    }
+
+    .btn-wrap {
+      padding: 12px 24px;
+
+      &>div+div {
+        margin-top: 12px;
+      }
+    }
+
+
+    .adm-popup-body {
+      border-radius: 10px 10px 0px 0px;
+      background: #FFF;
+      box-shadow: 0px -10px 5px 0px rgba(0, 0, 0, 0.05);
+    }
+
+    .am-modal-content {
+      text-align: left;
+    }
+
+    .am-modal-content {
+      border-radius: 0;
+    }
+
+    .modal-content-wrap {
+      padding: 0;
+      position: relative;
+
+      .modal-title {
+        font-size: 16px;
+        font-weight: 600;
+        color: #000;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        height: 48px;
+        padding: 12px 16px 0 16px;
+      }
+    }
+  }
+}

package/lib/common/ProductFilterModal/components/FilterSearchModal/index.less

@@ -0,0 +1,129 @@
+.classificationDetailModal {
+  height: 100vh;
+  width: 100%;
+  position: absolute;
+  z-index: 5;
+  padding: 16px;
+  background-color: #fff;
+  box-sizing: border-box;
+
+  .headerWrap {
+    height: 56px;
+    display: flex;
+    align-items: center;
+
+    font-style: normal;
+    font-weight: 500;
+    font-size: 14px;
+    text-transform: uppercase;
+    color: #333333;
+
+    .iconBack {
+      margin-right: 10px;
+    }
+
+    .headerTitle {
+      font-weight: 600;
+      font-size: 16px;
+      color: #1B1B1B;
+      width: 100%;
+      text-align: center;
+      padding-right: 20px;
+    }
+  }
+
+  .searchWrap {
+    margin-top: 20px;
+    background: #F6F6F6;
+    border-radius: 4px;
+    padding: 8px 12px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+
+    input {
+      height: 20px;
+      flex: 1;
+      border: none;
+      outline: none;
+
+      font-style: normal;
+      font-weight: 400;
+      font-size: 16px;
+      background-color: #F6F6F6;
+    }
+  }
+
+  .contentWrap {
+    background: #ffffff;
+    height: calc(100vh - 210px);
+    margin-top: 16px;
+    overflow-y: scroll;
+    overflow-x: hidden;
+
+    .listWrap {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+
+      .notFoundWrap {
+        display: flex;
+        align-items: center;
+        flex-direction: column;
+
+        font-style: normal;
+        font-weight: 400;
+        font-size: 14px;
+        text-align: center;
+        color: #333333;
+        margin: 25% auto;
+      }
+
+      :global {
+        .fxm-tag {
+          min-height: 32px;
+          height: auto;
+          display: flex;
+          align-items: center;
+          font-size: 14px;
+          border-radius: 0px;
+          font-weight: 400;
+          text-align: left;
+          margin-top: 0.16rem;
+          margin-right: 0.16rem;
+          border-radius: 4px;
+          background: #ffffff;
+          border: 1px solid #c4c4c4;
+          color: #7b7b7b;
+        }
+
+        .fxm-tag-normal::before {
+          border: none;
+        }
+
+        .fxm-tag-active {
+          color: var(--theme-color);
+          border: 1px solid var(--theme-color);
+        }
+
+        .fxm-tag-active::before {
+          border: none;
+          width: 0;
+          height: 0;
+        }
+      }
+    }
+  }
+
+  .bottomWrap {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    z-index: 5;
+    background: #fff;
+    height: 78px;
+    padding: 12px;
+  }
+
+}

package/lib/common/ProductFilterModal/index.less

@@ -0,0 +1,72 @@
+.productFilterWrap {
+  background: #ffffff;
+  height: calc(80vh - 40px);
+  overflow-y: scroll;
+  overflow-x: hidden;
+  padding: 0 20px 78px 20px;
+  box-sizing: border-box;
+
+  .item {
+    margin-top: 20px;
+
+    .inputWrap {
+      margin-top: 10px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+
+      .divider {
+        padding: 0 10px;
+        flex-shrink: 0;
+        height: 2px;
+        width: 11px;
+        background-color: #000;
+      }
+
+      input {
+        width: 45%;
+        height: 48px;
+        border: 1px solid #E4E4E4;
+        box-shadow: none;
+        padding: 12px;
+        border-radius: 4px;
+        outline: none;
+      }
+    }
+
+    .title {
+      line-height: 24px;
+      font-size: 16px;
+      font-weight: 600;
+      color: #000;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+    }
+
+    .accordionContentWrap {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      padding-bottom: 1px;
+
+      .btnMore {
+        font-weight: 600;
+        font-size: 14px;
+        color: var(--theme-color);
+        margin-top: 6px;
+        margin-left: 10px;
+      }
+    }
+  }
+}
+
+.bottomWrap {
+  position: fixed;
+  bottom: 0;
+  background: #fff;
+  width: 100%;
+  height: 78px;
+  padding: 12px 24px;
+  display: flex;
+}

package/lib/common/Tag/index.less

@@ -0,0 +1,16 @@
+.tagWrap {
+  padding: 6px 12px;
+  border: 1px solid #E4E4E4;
+  color: #545454;
+  border-radius: 4px;
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 24px;
+  margin-right: 15px;
+  margin-top: 8px;
+}
+
+.active {
+  color: var(--theme-color);
+  border-color: var(--theme-color);
+}

package/lib/common/index.js

@@ -105,6 +105,18 @@ Object.defineProperty(exports, "NewImg", {
     return _NewImg["default"];
   }
 });
+Object.defineProperty(exports, "PopUpModal", {
+  enumerable: true,
+  get: function get() {
+    return _PopUpModal["default"];
+  }
+});
+Object.defineProperty(exports, "ProductFilterModal", {
+  enumerable: true,
+  get: function get() {
+    return _ProductFilterModal["default"];
+  }
+});
 Object.defineProperty(exports, "ProductSource", {
   enumerable: true,
   get: function get() {
@@ -208,8 +220,12 @@ var _CardCarousel = _interopRequireDefault(require("./CardCarousel"));
 
 var _MyModal = _interopRequireDefault(require("./MyModal"));
 
+var _PopUpModal = _interopRequireDefault(require("./PopUpModal"));
+
 var _CropperModal = _interopRequireDefault(require("./CropperModal"));
 
 var _NewImg = _interopRequireDefault(require("./NewImg"));
 
+var _ProductFilterModal = _interopRequireDefault(require("./ProductFilterModal"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

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

@@ -250,7 +250,7 @@ function (_super) {
       className: "sold"
     }, /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
       data: __assign(__assign({}, panelProps.sold), {
-        text: "Sold " + soldNumber + "+"
+        text: "Sold " + (soldNumber || 0) + "+"
       }),
       readonly: true
     }))), showProgress && /*#__PURE__*/_react["default"].createElement("div", {

package/lib/composite-comp/monpay/components/Bundle/defaultJSON.js

@@ -0,0 +1,77 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getDefaultJSON = void 0;
+
+var _uuid = require("uuid");
+
+var _headerImage = _interopRequireDefault(require("./mobile/img/headerImage.jpg"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var getDefaultJSON = function getDefaultJSON() {
+  var contentId = (0, _uuid.v4)();
+  return {
+    id: (0, _uuid.v4)(),
+    type: 'BUNDLE',
+    title: {
+      headerImage: {
+        id: contentId,
+        open: true,
+        type: 'IMAGE',
+        content: {
+          h5Name: '',
+          pcName: '',
+          h5ImgSrc: _headerImage["default"],
+          pcImgSrc: '',
+          clickUrl: ''
+        },
+        hover: {
+          open: false,
+          backgroundType: 'enlarge',
+          magnification: 1.5,
+          pcImgHoverUrl: '',
+          h5ImgHoverUrl: ''
+        }
+      }
+    },
+    content: {
+      id: contentId,
+      sourceType: '1',
+      maxProdNum: 1
+    },
+    spacing: {
+      pc: {
+        paddingTop: 0,
+        paddingBottom: 0,
+        paddingLeft: 0,
+        paddingRight: 0,
+        marginBottom: window.magicDesign.compSpacing * 1.5
+      },
+      mobile: {
+        paddingTop: 0,
+        paddingBottom: 0,
+        paddingLeft: 0,
+        paddingRight: 0,
+        marginBottom: window.magicDesign.compSpacing
+      }
+    },
+    customize: {
+      layout: 'layout1',
+      align: 'left',
+      pcRowNum: 6,
+      pcMaxRowNum: 6,
+      pcMinRowNum: 5
+    },
+    background: {
+      opacity: 100,
+      color: '#fff',
+      image: '',
+      bgType: 'color'
+    }
+  };
+};
+
+exports.getDefaultJSON = getDefaultJSON;

package/lib/composite-comp/monpay/components/Bundle/index.js

@@ -0,0 +1,86 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _mobile = _interopRequireDefault(require("./mobile"));
+
+var _defaultJSON = require("./defaultJSON");
+
+var _coreUtil = require("../../../../utils/coreUtil");
+
+var _compositeDecorator = _interopRequireDefault(require("../../../../decorator/compositeDecorator"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+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 _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); }
+
+var __extends = void 0 && (void 0).__extends || function () {
+  var _extendStatics = function extendStatics(d, b) {
+    _extendStatics = Object.setPrototypeOf || {
+      __proto__: []
+    } instanceof Array && function (d, b) {
+      d.__proto__ = b;
+    } || function (d, b) {
+      for (var p in b) {
+        if (b.hasOwnProperty(p)) d[p] = b[p];
+      }
+    };
+
+    return _extendStatics(d, b);
+  };
+
+  return function (d, b) {
+    _extendStatics(d, b);
+
+    function __() {
+      this.constructor = d;
+    }
+
+    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+  };
+}();
+
+var __decorate = void 0 && (void 0).__decorate || function (decorators, target, key, desc) {
+  var c = arguments.length,
+      r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+      d;
+  if ((typeof Reflect === "undefined" ? "undefined" : _typeof(Reflect)) === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) {
+    if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  }
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+
+var FlashDeal =
+/** @class */
+function (_super) {
+  __extends(FlashDeal, _super);
+
+  function FlashDeal() {
+    return _super !== null && _super.apply(this, arguments) || this;
+  }
+
+  FlashDeal.prototype.render = function () {
+    var nodeData = this.props.nodeData;
+    return /*#__PURE__*/_react["default"].createElement("div", null, (0, _coreUtil.isPc)() ? null : /*#__PURE__*/_react["default"].createElement(_mobile["default"], {
+      panelProps: nodeData
+    }));
+  };
+
+  FlashDeal.defaultProps = {};
+  FlashDeal.type = 'BUNDLE';
+  FlashDeal.getDefaultJSON = _defaultJSON.getDefaultJSON;
+  FlashDeal = __decorate([_compositeDecorator["default"]], FlashDeal);
+  return FlashDeal;
+}(_react.Component);
+
+var _default = FlashDeal;
+exports["default"] = _default;

package/lib/composite-comp/monpay/components/Bundle/mobile/BundleItem/index.less

@@ -0,0 +1,107 @@
+.BundleItemWrap {
+  background-color: #FFF;
+  border-radius: 0.16rem;
+  border: 0.02rem solid #E4E4E4;
+  margin-bottom: 0.48rem;
+  transition: 0.2s all linear;
+}
+.BundleItemWrap .header {
+  height: 0.92rem;
+  padding: 0.16rem 0.24rem;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 0.3rem;
+  font-weight: 600;
+  line-height: 0.6rem;
+  border-bottom: 0.02rem solid #E4E4E4;
+}
+.BundleItemWrap .header .openIcon {
+  transition: 0.2s all linear;
+}
+.BundleItemWrap .prodList {
+  display: flex;
+  align-items: center;
+  overflow: scroll;
+}
+.BundleItemWrap .prodList img {
+  height: 2.08rem;
+  width: 1.9rem;
+}
+.BundleItemWrap .bottomWrap {
+  border-top: 0.02rem solid #E4E4E4;
+  background-color: #F6F6F6;
+  height: 1.16rem;
+  padding: 0.16rem 0.3rem;
+  border-radius: 0 0 0.16rem 0.16rem;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.BundleItemWrap .bottomWrap .totalWrap {
+  display: flex;
+}
+.BundleItemWrap .bottomWrap .totalWrap .total {
+  line-height: 0.48rem;
+}
+.BundleItemWrap .bottomWrap .totalWrap .priceWrap {
+  margin-left: 0.08rem;
+}
+.BundleItemWrap .bottomWrap .totalWrap .priceWrap .salesPrice {
+  font-size: 0.32rem;
+  font-weight: 600;
+  line-height: 0.48rem;
+  color: #000;
+}
+.BundleItemWrap .bottomWrap .totalWrap .priceWrap .marketPrice {
+  font-size: 0.28rem;
+  font-weight: 400;
+  line-height: 0.34rem;
+  color: #545454;
+  text-decoration: line-through;
+}
+.BundleItemWrap .bottomWrap .btnWrap .btnBuy {
+  height: 0.78rem;
+  background-color: #FF8650;
+  padding: 0.16rem 0.4rem;
+  border-radius: 0.16rem;
+  color: #fff;
+  font-weight: 600;
+  font-size: 0.28rem;
+}
+.BundleItemWrap.itemOpen .header .openIcon {
+  transform: rotate(180deg);
+}
+.BundleItemWrap.itemOpen .prodList {
+  height: auto;
+  flex-direction: column;
+}
+.BundleItemWrap.itemOpen .bottomWrap {
+  height: 2.22rem;
+  flex-direction: column;
+  display: flex;
+  align-items: unset;
+  justify-content: center;
+}
+.BundleItemWrap.itemOpen .bottomWrap .totalWrap {
+  justify-content: space-between;
+}
+.BundleItemWrap.itemOpen .bottomWrap .totalWrap .priceWrap {
+  margin-left: 0;
+  text-align: right;
+}
+.BundleItemWrap.itemOpen .bottomWrap .btnWrap {
+  margin-top: 0.24rem;
+}
+.BundleItemWrap.itemOpen .bottomWrap .btnWrap .btnBuy {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 0.78rem;
+  width: 100%;
+  background-color: #FF8650;
+  border-radius: 0.16rem;
+  color: #fff;
+  font-weight: 600;
+  font-size: 0.28rem;
+}