@fonixtree/magic-design 0.0.84 → 0.0.85

package/es/assets/less/button.less

@@ -6,4 +6,27 @@
   &.ant-btn-sm  {
     height: @small !important;
   }
+  &.ant-btn-primary {
+    background-color: #2F54EB !important;
+    border-color:#2F54EB !important;
+    &:hover {
+      background-color: #1D39C4 !important;
+      border-color:#1D39C4 !important;
+    }
+  }
+  &.ant-btn-default {
+    &:hover {
+      border-color:#1D39C4 !important;
+      color:#1D39C4 !important;
+    }
+  }
+  &.ant-btn-light {
+    border: none;
+    background-color: #E9F0FF;
+    color: #2F54EB;
+    &:hover {
+      background-color: #D6E4FF;
+      color: #2F54EB;
+    }
+  }
 }

package/es/assets/less/datepicker.less

@@ -0,0 +1,11 @@
+.ant-picker {
+  &:hover {
+    border-color: #2F54EB !important;
+  }
+  &.ant-picker-focused {
+    border-color: #2F54EB !important;
+  }
+}
+.ant-picker-time-panel-column > li.ant-picker-time-panel-cell-selected .ant-picker-time-panel-cell-inner {
+  background-color: #E9F0FF !important;
+}

package/es/assets/less/index.less

@@ -9,4 +9,5 @@
 @import './modal.less';
 @import './input.less';
 @import './button.less';
-@import './form.less';
+@import './form.less';
+@import './datepicker.less';

package/es/composite-comp/bol/components/Carousel/pc/index.js

@@ -29,14 +29,10 @@ require("slick-carousel/slick/slick.css");
 
 require("slick-carousel/slick/slick-theme.css");
 
-var _ref, _ref2, _ref3, _ref4;
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 var __extends = void 0 && (void 0).__extends || function () {
   var _extendStatics = function extendStatics(d, b) {
     _extendStatics = Object.setPrototypeOf || {
@@ -73,19 +69,27 @@ var PC_IMG_SIZE = [{
   maxW: 524,
   minH: 150,
   maxH: 524
-}, (_ref = {
+}, {
   minW: 100,
-  maxW: 341
-}, _defineProperty(_ref, "minW", 100), _defineProperty(_ref, "maxW", 341), _ref), (_ref2 = {
+  maxW: 341,
+  minH: 100,
+  maxH: 341
+}, {
   minW: 100,
-  maxW: 251
-}, _defineProperty(_ref2, "minW", 100), _defineProperty(_ref2, "maxW", 251), _ref2), (_ref3 = {
+  maxW: 251,
+  minH: 100,
+  maxH: 251
+}, {
   minW: 100,
-  maxW: 195
-}, _defineProperty(_ref3, "minW", 100), _defineProperty(_ref3, "maxW", 195), _ref3), (_ref4 = {
+  maxW: 195,
+  minH: 100,
+  maxH: 195
+}, {
   minW: 100,
-  maxW: 168
-}, _defineProperty(_ref4, "minW", 100), _defineProperty(_ref4, "maxW", 168), _ref4)];
+  maxW: 168,
+  minH: 100,
+  maxH: 168
+}];
 
 var CarouselPc =
 /** @class */

package/es/composite-comp/bol/components/ImageGallery/defaultJSON.js

@@ -59,7 +59,10 @@ var getDefaultJSON = function getDefaultJSON() {
       }
     },
     customize: {
-      layout: 'layout1',
+      layout: {
+        h5Layout: 'layout1',
+        pcLayout: 'layout1'
+      },
       align: 'left',
       pcRowNum: 2,
       rowNum: 2,

package/es/composite-comp/bol/components/ImageGallery/index.js

@@ -7,6 +7,8 @@ exports["default"] = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _pc = _interopRequireDefault(require("./pc"));
+
 var _mobile = _interopRequireDefault(require("./mobile"));
 
 var _defaultJSON = require("./defaultJSON");
@@ -68,7 +70,9 @@ function (_super) {
 
   ImageGallery.prototype.render = function () {
     var nodeData = this.props.nodeData;
-    return /*#__PURE__*/_react["default"].createElement("div", null, window.magicDesign.device === 'pc' ? null : /*#__PURE__*/_react["default"].createElement(_mobile["default"], {
+    return /*#__PURE__*/_react["default"].createElement("div", null, window.magicDesign.device === 'pc' ? /*#__PURE__*/_react["default"].createElement(_pc["default"], {
+      data: nodeData
+    }) : /*#__PURE__*/_react["default"].createElement(_mobile["default"], {
       data: nodeData
     }));
   };

package/es/composite-comp/bol/components/ImageGallery/mobile/index.js

@@ -83,7 +83,7 @@ function (_super) {
 
   ImageGalleryMobile.prototype.render = function () {
     var data = this.props.data;
-    var isHorizontal = data.customize.layout === 'layout2';
+    var isHorizontal = data.customize.layout.h5Layout === 'layout2';
     var colNum = isHorizontal ? data.customize.rowNum : 1;
     return /*#__PURE__*/_react["default"].createElement("div", {
       className: "m-image-gallery-mobile"

package/es/composite-comp/bol/components/ImageGallery/pc/index.js

@@ -0,0 +1,138 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+require("./index.less");
+
+var _components = require("../../../../../meta-comp/components");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": 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 PC_IMG_SIZE = {
+  1: {
+    minW: 150,
+    maxW: '100%',
+    minH: 150,
+    maxH: 960,
+    gap: 20
+  },
+  2: {
+    minW: 150,
+    maxW: 628,
+    minH: 150,
+    maxH: 471,
+    gap: 24
+  },
+  3: {
+    minW: 100,
+    maxW: 410,
+    minH: 100,
+    maxH: 308,
+    gap: 24
+  },
+  4: {
+    minW: 100,
+    maxW: 302,
+    minH: 100,
+    maxH: 227,
+    gap: 24
+  },
+  5: {
+    minW: 100,
+    maxW: 236,
+    minH: 100,
+    maxH: 177,
+    gap: 24
+  },
+  6: {
+    minW: 100,
+    maxW: 193,
+    minH: 100,
+    maxH: 145,
+    gap: 24
+  }
+};
+
+var ImageGalleryPc =
+/** @class */
+function (_super) {
+  __extends(ImageGalleryPc, _super);
+
+  function ImageGalleryPc() {
+    var _this = _super !== null && _super.apply(this, arguments) || this;
+
+    _this.state = {};
+    return _this;
+  }
+
+  ImageGalleryPc.prototype.render = function () {
+    var data = this.props.data;
+    var isHorizontal = data.customize.layout.pcLayout === 'layout2';
+    var colNum = isHorizontal ? data.customize.pcRowNum : 1;
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: "m-image-gallery-pc"
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      className: (0, _classnames["default"])('content', {
+        horizontal: isHorizontal
+      }),
+      style: {
+        gap: PC_IMG_SIZE[colNum].gap
+      }
+    }, data.groupSource.map(function (m) {
+      return /*#__PURE__*/_react["default"].createElement("div", {
+        key: m.id,
+        className: "img-wrap",
+        style: {
+          width: PC_IMG_SIZE[colNum].maxW
+        }
+      }, /*#__PURE__*/_react["default"].createElement(_components.MetaImage, {
+        data: m.image,
+        maxHeight: PC_IMG_SIZE[colNum].maxH,
+        maxWidth: PC_IMG_SIZE[colNum].maxW
+      }));
+    })));
+  };
+
+  ImageGalleryPc.defaultProps = {
+    data: {
+      groupSource: []
+    }
+  };
+  return ImageGalleryPc;
+}(_react["default"].Component);
+
+var _default = ImageGalleryPc;
+exports["default"] = _default;

package/es/composite-comp/bol/components/ImageGallery/pc/index.less

@@ -0,0 +1,21 @@
+.m-image-gallery-pc {
+  overflow-x: auto;
+
+  .content {
+    display: flex;
+    flex-direction: column;
+    flex-wrap: wrap;
+    width: 1280px;
+    margin: 0 auto;
+
+    &.horizontal {
+      flex-direction: row;
+    }
+
+    .img-wrap {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+  }
+}

package/es/composite-comp/bol/config-panels/ImageGalleryConfig/index.js

@@ -17,6 +17,8 @@ var _CustomizeConfig = _interopRequireDefault(require("../../../common/config-pa
 
 var _layout = require("../../../../constants/layout");
 
+var _coreUtil = require("../../../../utils/coreUtil");
+
 var _SpacingConfig = _interopRequireDefault(require("../../../common/config-panels/SpacingConfig"));
 
 var _locale = require("../../../../locale");
@@ -25,6 +27,15 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
 
 function ImageGalleryConfig(props) {
   var data = props.data;
+
+  var getLayout = function getLayout(v) {
+    if ((0, _coreUtil.isPc)()) {
+      data.customize.layout.pcLayout = v;
+    } else {
+      data.customize.layout.h5Layout = v;
+    }
+  };
+
   return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {
     divider: "bold",
     headerSize: "large",
@@ -46,7 +57,11 @@ function ImageGalleryConfig(props) {
       value: /*#__PURE__*/_react["default"].createElement(_CustomizeConfig["default"], {
         component: "imageGallery",
         data: data.customize,
-        layoutSource: _layout.imageGalleryLayout
+        isHideAlign: true,
+        layoutSource: _layout.imageGalleryLayout,
+        selectedLayoutFun: function selectedLayoutFun(v) {
+          return getLayout(v);
+        }
       })
     }, {
       key: '4',

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

@@ -4,7 +4,6 @@
   background: #FFFFFF;
   border: 1px solid #D2D9E5;
   width: 142px;
-  margin: 0 auto;
   cursor: pointer;
 
   .img-wrap {

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

@@ -13,8 +13,6 @@ var _defImg = _interopRequireDefault(require("./imgs/defImg1.png"));
 
 var _defImg2 = _interopRequireDefault(require("./imgs/defImg2.png"));
 
-var _defImg3 = _interopRequireDefault(require("./imgs/defImg3.png"));
-
 var _ProductItem = _interopRequireDefault(require("../../../../common/components/ProductItem"));
 
 var _coreUtil = require("../../../../../utils/coreUtil");
@@ -238,16 +236,6 @@ var defaultData = [{
   discountPercent: 50,
   salePercent: 5000,
   sppType: '2'
-}, {
-  imgUrlContent: {
-    url: _defImg3["default"]
-  },
-  offerName: 'DITO Level-Up Pack 99 7GB',
-  salesPrice: 99,
-  marketPrice: 138,
-  discountPercent: 28,
-  salePercent: 5000,
-  sppType: '2'
 }];
 
 var FlashDealMobile =

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

@@ -66,6 +66,7 @@
     white-space: nowrap;
     display: flex;
     align-items: flex-start;
+    justify-content: flex-start;
     position: relative;
 
     .loading-wrap {

package/es/composite-comp/dito/components/FlashDeal/pc/index.js

@@ -15,8 +15,6 @@ var _defImg = _interopRequireDefault(require("./imgs/defImg1.png"));
 
 var _defImg2 = _interopRequireDefault(require("./imgs/defImg2.png"));
 
-var _defImg3 = _interopRequireDefault(require("./imgs/defImg3.png"));
-
 var _ProductItem = _interopRequireDefault(require("../../../../common/components/ProductItem"));
 
 var _coreUtil = require("../../../../../utils/coreUtil");
@@ -242,46 +240,6 @@ var defaultData = [{
   discountPercent: 50,
   salePercent: 5000,
   sppType: '2'
-}, {
-  imgUrlContent: {
-    url: _defImg3["default"]
-  },
-  offerName: 'DITO Level-Up Pack 99 7GB',
-  salesPrice: 99,
-  marketPrice: 138,
-  discountPercent: 28,
-  salePercent: 5000,
-  sppType: '2'
-}, {
-  imgUrlContent: {
-    url: _defImg3["default"]
-  },
-  offerName: 'DITO Level-Up Pack 99 7GB',
-  salesPrice: 99,
-  marketPrice: 138,
-  discountPercent: 28,
-  salePercent: 5000,
-  sppType: '2'
-}, {
-  imgUrlContent: {
-    url: _defImg3["default"]
-  },
-  offerName: 'DITO Level-Up Pack 99 7GB',
-  salesPrice: 99,
-  marketPrice: 138,
-  discountPercent: 28,
-  salePercent: 5000,
-  sppType: '2'
-}, {
-  imgUrlContent: {
-    url: _defImg3["default"]
-  },
-  offerName: 'DITO Level-Up Pack 99 7GB',
-  salesPrice: 99,
-  marketPrice: 138,
-  discountPercent: 28,
-  salePercent: 5000,
-  sppType: '2'
 }];
 
 var FlashDealPc =

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

@@ -92,6 +92,7 @@
     white-space: nowrap;
     display: flex;
     align-items: flex-start;
+    justify-content: flex-start;
     position: relative;
     flex: 1;
 

package/es/constants/index.js

@@ -43,6 +43,7 @@ var quickMenuCode = {
   PREVIEW: 'PREVIEW',
   SAVE: 'SAVE',
   PUBLISH: 'PUBLISH',
+  PUBLISH_LATER: 'PUBLISH_LATER',
   MODE_PC: 'MODE_PC',
   MODE_PHONE: 'MODE_PHONE'
 };

package/es/core/Designer/AppointmentModal/index.js

@@ -0,0 +1,83 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = AppointmentModal;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _antd = require("antd");
+
+var _moment = _interopRequireDefault(require("moment"));
+
+var _locale = require("../../../locale");
+
+require("./index.less");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+// import { Button } from '../../../common';
+function AppointmentModal(props) {
+  var visible = props.visible,
+      onClose = props.onClose,
+      onConfirm = props.onConfirm;
+
+  var form = _antd.Form.useForm()[0];
+
+  var onConfirmPublish = function onConfirmPublish() {
+    form.submit();
+  };
+
+  var onFinish = function onFinish(values) {
+    console.log(values);
+    var dateString = values.date.format('YYYY-MM-DD HH:mm:ss');
+    onConfirm(dateString);
+  };
+
+  var disabledDate = function disabledDate(current) {
+    return current && current < (0, _moment["default"])().add(30, 'minutes');
+  };
+
+  return /*#__PURE__*/_react["default"].createElement(_antd.Modal, {
+    footer: /*#__PURE__*/_react["default"].createElement("div", {
+      className: "footer"
+    }, /*#__PURE__*/_react["default"].createElement(_antd.Button, {
+      onClick: function onClick() {
+        return onClose && onClose();
+      },
+      size: "small",
+      type: "light"
+    }, (0, _locale.i18n)('CANCEL')), /*#__PURE__*/_react["default"].createElement(_antd.Button, {
+      onClick: onConfirmPublish,
+      size: "small",
+      type: "primary"
+    }, (0, _locale.i18n)('CONFIRM'))),
+    maskClosable: false,
+    onCancel: onClose,
+    title: (0, _locale.i18n)('PUBLISH_LATER'),
+    visible: visible,
+    width: 500
+  }, /*#__PURE__*/_react["default"].createElement(_antd.Form, {
+    autoComplete: "off",
+    form: form,
+    layout: "vertical",
+    onFinish: onFinish
+  }, /*#__PURE__*/_react["default"].createElement(_antd.Form.Item, {
+    label: (0, _locale.i18n)('PUBLISH_TIME'),
+    name: "date",
+    rules: [{
+      required: true
+    }]
+  }, /*#__PURE__*/_react["default"].createElement(_antd.DatePicker, {
+    disabledDate: disabledDate,
+    placeholder: "Select Time",
+    showNow: false,
+    showTime: true,
+    style: {
+      width: '100%'
+    }
+  })), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "tips"
+  }, "Please select a time after 30 minutes and within 30 days")));
+}

package/es/core/Designer/AppointmentModal/index.less

@@ -0,0 +1,10 @@
+.footer {
+  display: flex;
+  justify-content: flex-end;
+}
+.tips {
+  font-size: 13px;
+  line-height: 18px;
+  color: #A3AEC3;
+  margin-bottom:40px;
+}

package/es/core/Designer/QuickMenuBar/index.js

@@ -23,6 +23,8 @@ require("./index.less");
 
 var _locale = require("../../../locale");
 
+var _antd = require("antd");
+
 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; }
@@ -95,6 +97,12 @@ function (_super) {
       _this.props.onBtnClick(code);
     };
 
+    _this.onPublishLater = function (e) {
+      _this.onBtnClick(e);
+
+      e.stopPropagation();
+    };
+
     return _this;
   }
 
@@ -170,13 +178,37 @@ function (_super) {
       onClick: this.onBtnClick,
       tip: "The page is in use. Please copy or create a new page",
       type: "light"
-    }, (0, _locale.i18n)('SAVE')), /*#__PURE__*/_react["default"].createElement(_Button["default"], {
+    }, (0, _locale.i18n)('SAVE')), /*#__PURE__*/_react["default"].createElement("div", {
+      className: "publish_wrap"
+    }, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
       "data-code": _constants.quickMenuCode.PUBLISH,
       disabled: window.magicDesign.readOnly,
       onClick: this.onBtnClick,
       tip: "The page is in use. Please copy or create a new page",
       type: "primary"
-    }, (0, _locale.i18n)('PUBLISH'))));
+    }, (0, _locale.i18n)('PUBLISH_NOW'), /*#__PURE__*/_react["default"].createElement(_antd.Dropdown, {
+      getPopupContainer: function getPopupContainer() {
+        return document.querySelector('.publish_wrap');
+      },
+      overlay: /*#__PURE__*/_react["default"].createElement("div", {
+        className: "publish_later_wrap"
+      }, /*#__PURE__*/_react["default"].createElement("div", {
+        className: "publish_btn",
+        "data-code": _constants.quickMenuCode.PUBLISH_LATER,
+        onClick: this.onPublishLater
+      }, (0, _locale.i18n)('PUBLISH_LATER'))),
+      overlayClassName: "publish_later_drop",
+      trigger: "click"
+    }, /*#__PURE__*/_react["default"].createElement(_Iconfont["default"], {
+      onClick: function onClick(e) {
+        return e.stopPropagation();
+      },
+      size: "14px",
+      style: {
+        padding: '8px 3px 8px 6px'
+      },
+      type: "icon-outlined-down"
+    }))))));
   };
 
   return QuickMenuBar;

package/es/core/Designer/QuickMenuBar/index.less

@@ -72,5 +72,39 @@
 
   .menu_right {
     display: flex;
+    .publish_wrap {
+      position: relative;
+      margin-left: 12px;
+    }
+    .publish_later_drop {
+      width: 100%;
+      top: 56px !important;
+      left: 0 !important;
+      .publish_later_wrap {
+        box-shadow: 4px 4px 25px 4px rgba(35, 47, 70, 0.1);
+        border-radius: 10px;
+        padding: 4px 0;
+        background-color: #FFF;
+        position: absolute;
+        left: 0;
+        right: 0;
+        .publish_btn {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          font-family: 'Open Sans';
+          font-style: normal;
+          font-weight: 600;
+          font-size: 16px;
+          height: 48px;
+          background-color: #E9F0FF;
+          color: #2F54EB;
+          cursor: pointer;
+          &:hover {
+            background-color: #D6E4FF;
+          }
+        }
+      }
+    }
   }
 }