@fonixtree/magic-design 0.0.85 → 0.0.89

package/lib/common/SystemNotification/Confirm/index.less

@@ -0,0 +1,33 @@
+
+.confirm_wrap {
+  padding: 16px 16px 12px 16px;
+  .confirm_title {
+    display: flex;
+    align-items: center;
+    font-family: 'Open Sans';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 16px;
+    line-height: 24px;
+    color: #232F46;
+    .confirm_title_text {
+      margin-left: 16px;
+    }
+  }
+  .confirm_content {
+    font-family: 'Open Sans';
+    font-style: normal;
+    font-weight: 400;
+    font-size: 13px;
+    line-height: 18px;
+    color: #232F46;
+    margin-left: 40px;
+    margin-top: 10px;
+  }
+  .confirm_footer {
+    margin-top: 24px;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+  }
+}

package/lib/common/SystemNotification/index.js

@@ -0,0 +1,115 @@
+"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"] = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _Confirm = _interopRequireDefault(require("./Confirm"));
+
+var _mobx = require("../../mobx");
+
+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 _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); }
+
+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 __assign = void 0 && (void 0).__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+
+      for (var p in s) {
+        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+      }
+    }
+
+    return t;
+  };
+
+  return __assign.apply(this, arguments);
+};
+
+var SystemNotification =
+/** @class */
+function (_super) {
+  __extends(SystemNotification, _super);
+
+  function SystemNotification() {
+    var _this = _super !== null && _super.apply(this, arguments) || this;
+
+    _this.state = {
+      confirmState: _mobx.frameStore.confirmState
+    };
+    /** 弹窗关闭 */
+
+    _this.onCloseConfirm = function () {
+      _mobx.frameStore.setState({
+        confirmState: __assign(__assign({}, _this.state.confirmState), {
+          visible: false
+        })
+      });
+    };
+
+    return _this;
+  }
+
+  SystemNotification.prototype.componentDidMount = function () {
+    var _this = this;
+
+    this.destroy = (0, _mobx.autorun)(function () {
+      _this.setState({
+        confirmState: _mobx.frameStore.confirmState
+      });
+    });
+  };
+
+  SystemNotification.prototype.componentWillUnmount = function () {
+    this.destroy();
+  };
+
+  SystemNotification.prototype.render = function () {
+    var confirmState = this.state.confirmState;
+    return /*#__PURE__*/_react["default"].createElement("div", null, confirmState.visible && /*#__PURE__*/_react["default"].createElement(_Confirm["default"], _extends({}, confirmState, {
+      onClose: this.onCloseConfirm
+    })));
+  };
+
+  return SystemNotification;
+}(_react.Component);
+
+var _default = SystemNotification;
+exports["default"] = _default;

package/lib/common/index.js

@@ -93,6 +93,12 @@ Object.defineProperty(exports, "SwitchCollapse", {
     return _SwitchCollapse["default"];
   }
 });
+Object.defineProperty(exports, "SystemNotification", {
+  enumerable: true,
+  get: function get() {
+    return _SystemNotification["default"];
+  }
+});
 Object.defineProperty(exports, "UrlPicker", {
   enumerable: true,
   get: function get() {
@@ -132,4 +138,6 @@ var _ProductSource = _interopRequireDefault(require("./ProductSource"));
 
 var _ImgArea = _interopRequireDefault(require("./ImgArea"));
 
+var _SystemNotification = _interopRequireDefault(require("./SystemNotification"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

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

@@ -7,6 +7,11 @@ exports.getDefaultJSON = exports.PcNavGroupSourceJSON = void 0;
 
 var _uuid = require("uuid");
 
+var _menuIcon = _interopRequireDefault(require("./images/menu-icon.svg"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+// import { i18n } from '../../../../locale';
 var PcNavGroupSourceJSON = function PcNavGroupSourceJSON() {
   var groupId = (0, _uuid.v4)();
   return {
@@ -73,7 +78,7 @@ var getDefaultJSON = function getDefaultJSON() {
         type: 'TEXT',
         text: 'All Category',
         specialContent: [],
-        iconUrl: '',
+        iconUrl: _menuIcon["default"],
         content: {
           sizeType: 'Customize font styles',
           fontFamily: 'Open Sans',

package/lib/composite-comp/dito/components/PcNavigation/pc/index.js

@@ -19,8 +19,6 @@ var _commonUtil = require("../../../../../utils/commonUtil");
 
 var _common = require("../../../../../common");
 
-var _menuIcon = _interopRequireDefault(require("../images/menu-icon.svg"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var __extends = void 0 && (void 0).__extends || function () {
@@ -442,15 +440,15 @@ function (_super) {
     var list = this.state.list;
     return /*#__PURE__*/_react["default"].createElement("div", {
       className: (0, _classnames["default"])('pc-navigation')
-    }, /*#__PURE__*/_react["default"].createElement("div", {
+    }, data.home.allCategory.open && /*#__PURE__*/_react["default"].createElement("div", {
       className: "menu-wrap",
       onMouseEnter: this.mouseEnterBtn,
       onMouseLeave: this.mouseLeaveBtn
     }, /*#__PURE__*/_react["default"].createElement("a", {
       className: "menu-drop"
-    }, /*#__PURE__*/_react["default"].createElement("img", {
+    }, data.home.allCategory.iconUrl && /*#__PURE__*/_react["default"].createElement("img", {
       alt: "icon",
-      src: data.home.allCategory.iconUrl || _menuIcon["default"]
+      src: data.home.allCategory.iconUrl
     }), /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
       className: "all-category",
       data: data.home.allCategory

package/lib/composite-comp/dito/components/PcNavigation/pc/index.less

@@ -7,6 +7,7 @@
     display: flex;
     align-items: center;
     min-width: 130px;
+    margin-right: 180px;
 
     &:hover {
       @keyframes show-active{
@@ -88,7 +89,6 @@
   }
 
   .category-group {
-    margin-left: 180px;
     display: flex;
     overflow-x: scroll;
     flex: 1;

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

@@ -260,10 +260,12 @@ function (_super) {
     _this.preData = {};
     _this.preLayout = '';
     _this.preContent = '';
+    _this.preSpacing = '';
     _this._cache = (0, _coreUtil.isDesignMode)() ? {} : (0, _commonUtil.ensure)(function () {
       return (0, _storeUtil.getMagicStore)("recommend_" + _this.props.panelProps.id);
     }, {});
     _this.state = __assign({
+      contentWidth: 0,
       tabIndex: 0,
       tabLeft: 0,
       tabWidth: 0,
@@ -271,6 +273,15 @@ function (_super) {
       hideTabs: false
     }, _this._cache);
 
+    _this.listenWidth = function () {
+      setTimeout(function () {
+        var renderContainer = document.querySelector(".macyContainer_" + _this.props.panelProps.id);
+        if (renderContainer) _this.setState({
+          contentWidth: renderContainer.offsetWidth
+        });
+      });
+    };
+
     _this.initTab = function (index, hideTabs) {
       var selectedTabDom = document.querySelector(".tab-select-wrap .tabTitle:nth-child(" + (index + 1) + ")");
       var tabLeft = 0;
@@ -497,6 +508,7 @@ function (_super) {
 
       _this.getProductList(0);
     });
+    this.listenWidth();
   };
 
   RecommendMobile.prototype.componentWillReceiveProps = function () {
@@ -540,13 +552,19 @@ function (_super) {
     });
     var curLayout = panelProps.customize.layout.h5Layout;
     var curContent = JSON.stringify(panelProps.content);
+    var curSpacing = JSON.stringify(panelProps.spacing);
+
+    if (curSpacing !== this.preSpacing) {
+      this.listenWidth();
+    }
 
-    if (curLayout !== this.preLayout || curContent !== this.preContent) {
+    if (curLayout !== this.preLayout || curContent !== this.preContent || curSpacing !== this.preSpacing) {
       this.resetLayout();
     }
 
     this.preLayout = curLayout;
     this.preContent = curContent;
+    this.preSpacing = curSpacing;
   };
 
   RecommendMobile.prototype.render = function () {
@@ -558,7 +576,8 @@ function (_super) {
         tabLeft = _a.tabLeft,
         tabWidth = _a.tabWidth,
         groupSource = _a.groupSource,
-        hideTabs = _a.hideTabs;
+        hideTabs = _a.hideTabs,
+        contentWidth = _a.contentWidth;
     var bgStyle = this.getBackgroundStyle();
     var products = this.state["products" + tabIndex] || [];
     var isDivide = groupSource.length <= 3;
@@ -574,9 +593,8 @@ function (_super) {
     var imgHeight = (0, _commonUtil.ensure)(function () {
       return LAYOUT_IMAGE_SIZE[layout].h;
     }, 140);
-    var macyContainerDom = document.querySelector('.m-recommend-mobile');
-    if (layout === 'layout1' && macyContainerDom) imgHeight = (macyContainerDom.clientWidth - 32) / 2 - 6;
-    if (layout === 'layout3' && macyContainerDom) imgHeight = (macyContainerDom.clientWidth - 32) / 3 - 8;
+    if (layout === 'layout1' && contentWidth) imgHeight = (contentWidth - 12) / 2;
+    if (layout === 'layout3' && contentWidth) imgHeight = (contentWidth - 12 * 2) / 3;
     return /*#__PURE__*/_react["default"].createElement("div", {
       className: "m-recommend-mobile",
       style: bgStyle

package/lib/composite-comp/dito/components/Recommend/pc/index.js

@@ -264,11 +264,13 @@ function (_super) {
     _this.preData = {};
     _this.preLayout = '';
     _this.preContent = '';
+    _this.preSpacing = '';
     _this._cache = (0, _coreUtil.isDesignMode)() ? {} : (0, _commonUtil.ensure)(function () {
       return (0, _storeUtil.getMagicStore)("recommend_" + _this.props.panelProps.id);
     }, {});
     _this.scrollRef = /*#__PURE__*/_react["default"].createRef();
     _this.state = __assign({
+      contentWidth: 0,
       tabIndex: 0,
       tabLeft: 0,
       tabWidth: 0,
@@ -278,6 +280,15 @@ function (_super) {
       scrollToRightDisabled: true
     }, _this._cache);
 
+    _this.listenWidth = function () {
+      setTimeout(function () {
+        var renderContainer = document.querySelector(".macyContainer_" + _this.props.panelProps.id);
+        if (renderContainer) _this.setState({
+          contentWidth: renderContainer.offsetWidth
+        });
+      });
+    };
+
     _this.setScrollDisabled = function (scrollDom) {
       var scrollToLeftDisabled = scrollDom.scrollLeft === 0;
       var scrollToRightDisabled = scrollDom.clientWidth + scrollDom.scrollLeft >= scrollDom.scrollWidth;
@@ -547,6 +558,7 @@ function (_super) {
         }, 500);
       }
     }, 0);
+    this.listenWidth();
   };
 
   RecommendMobile.prototype.componentWillReceiveProps = function () {
@@ -607,12 +619,18 @@ function (_super) {
 
     this.preLayout = curLayout;
     var curContent = JSON.stringify(panelProps.content);
+    var curSpacing = JSON.stringify(panelProps.spacing);
+
+    if (curSpacing !== this.preSpacing) {
+      this.listenWidth();
+    }
 
-    if (curContent !== this.preContent) {
+    if (curContent !== this.preContent || curSpacing !== this.preSpacing) {
       this.resetLayout();
     }
 
     this.preContent = curContent;
+    this.preSpacing = curSpacing;
   };
 
   RecommendMobile.prototype.render = function () {
@@ -626,7 +644,8 @@ function (_super) {
         groupSource = _a.groupSource,
         hideTabs = _a.hideTabs,
         scrollToLeftDisabled = _a.scrollToLeftDisabled,
-        scrollToRightDisabled = _a.scrollToRightDisabled;
+        scrollToRightDisabled = _a.scrollToRightDisabled,
+        contentWidth = _a.contentWidth;
     var bgStyle = this.getBackgroundStyle();
     var products = this.state["products" + tabIndex] || [];
     var isDivide = groupSource.length <= 10;
@@ -642,8 +661,7 @@ function (_super) {
     var imgHeight = (0, _commonUtil.ensure)(function () {
       return layout === 'layout1' ? LAYOUT_IMAGE_SIZE[layout].h : LAYOUT_IMAGE_SIZE[layout + "_col" + panelProps.customize.pcRowNum].h;
     }, 140);
-    var macyContainerDom = document.querySelector('.tab-list');
-    if (layout === 'layout1' && macyContainerDom) imgHeight = (macyContainerDom.clientWidth - 12 * (panelProps.customize.pcRowNum - 1)) / panelProps.customize.pcRowNum;
+    if (layout === 'layout1' && contentWidth) imgHeight = (contentWidth - 12 * (panelProps.customize.pcRowNum - 1)) / panelProps.customize.pcRowNum;
     return /*#__PURE__*/_react["default"].createElement("div", {
       className: "m-recommend-pc",
       style: bgStyle

package/lib/core/Designer/ViewArea/index.js

@@ -13,8 +13,6 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _isEmpty = _interopRequireDefault(require("lodash/isEmpty"));
 
-var _antd = require("antd");
-
 var _constants = require("../../../constants");
 
 var _componentTypes = require("../../../constants/component-types");
@@ -111,19 +109,16 @@ function (_super) {
     _this.onCancelClick = function () {
       var onCancelPublish = _this.props.onCancelPublish;
 
-      _antd.Modal.confirm({
-        title: 'Cancel Publish Later',
-        content: 'Do you want to cancel publishing later?',
-        okText: 'Yes',
-        cancelText: 'No',
-        onOk: function onOk() {
-          return new Promise(function (resolve) {
+      _mobx.frameStore.setState({
+        confirmState: {
+          title: 'Cancel Publish Later',
+          content: 'Do you want to cancel publishing later?',
+          visible: true,
+          onOk: function onOk() {
             if (onCancelPublish) {
               onCancelPublish();
             }
-
-            resolve();
-          });
+          }
         }
       });
     };

package/lib/core/Designer/index.js

@@ -37,6 +37,8 @@ var _constants = require("../../constants");
 
 require("./index.less");
 
+var _common = require("../../common");
+
 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); }
@@ -384,9 +386,13 @@ function (_super) {
           childNodes: MPageData
         },
         device: device,
-        appointmentDete: date
+        appointmentDate: date
       };
       onPublish(handleParams);
+
+      _this.setState({
+        appointmentVisible: false
+      });
     };
 
     var pageData = props.pageData,
@@ -518,7 +524,7 @@ function (_super) {
       },
       onConfirm: this.onAppointmentConfirm,
       visible: appointmentVisible
-    }))));
+    })), /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_common.SystemNotification, null))));
   };
 
   return Designer;

package/lib/meta-comp/components/Image/index.less

@@ -12,6 +12,7 @@
     transition: all .2s linear;
     vertical-align: initial;
     max-width: 100%;
+    object-fit: contain;
   }
 
   &.backgroundImg {

package/lib/mobx/Frame.js

@@ -0,0 +1,64 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Frame = void 0;
+
+var _mobx = require("mobx");
+
+var _storeUtil = require("../utils/storeUtil");
+
+var __assign = void 0 && (void 0).__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+
+      for (var p in s) {
+        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+      }
+    }
+
+    return t;
+  };
+
+  return __assign.apply(this, arguments);
+};
+
+var CACHE_KEY = 'FRAME';
+var whiteList = [];
+
+var Frame =
+/** @class */
+function () {
+  function Frame() {
+    this.confirmState = {
+      visible: false,
+      title: '',
+      content: '',
+      okText: 'Ok',
+      cancelText: 'Cancel',
+      onOk: function onOk() {},
+      onCancel: function onCancel() {}
+    };
+    (0, _mobx.makeObservable)(this, {
+      confirmState: _mobx.observable
+    });
+  }
+  /** 修改状态 */
+
+
+  Frame.prototype.setState = function (data) {
+    var _this = this;
+
+    var propertyList = Object.getOwnPropertyNames(data);
+    propertyList.forEach(function (field) {
+      _this[field] = __assign(__assign({}, _this[field]), data[field]);
+    });
+    (0, _storeUtil.persistence)(CACHE_KEY, this, whiteList);
+  };
+
+  return Frame;
+}();
+
+exports.Frame = Frame;

package/lib/mobx/index.js

@@ -4,9 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 var _exportNames = {
-  store: true
+  store: true,
+  frameStore: true
 };
-exports.store = exports["default"] = void 0;
+exports.store = exports.frameStore = exports["default"] = void 0;
 
 var _mobx = require("mobx");
 
@@ -24,13 +25,18 @@ Object.keys(_mobx).forEach(function (key) {
 
 var _Store = require("./Store");
 
+var _Frame = require("./Frame");
+
 /* 开启严格模式 */
 (0, _mobx.configure)({
   enforceActions: 'observed'
 });
 var store = new _Store.Store();
 exports.store = store;
+var frameStore = new _Frame.Frame();
+exports.frameStore = frameStore;
 var _default = {
-  store: store
+  store: store,
+  frameStore: frameStore
 };
 exports["default"] = _default;

package/package.json

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