@fonixtree/magic-design 1.0.217 → 1.0.219

package/lib/composite-comp/dito/config-panels/GroupedImageConfig/index.js

@@ -0,0 +1,127 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ConfigGroup = _interopRequireDefault(require("./ConfigGroup"));
+
+var _SpacingConfig = _interopRequireDefault(require("../../../common/config-panels/SpacingConfig"));
+
+var _CustomizeConfig = _interopRequireDefault(require("../../../common/config-panels/CustomizeConfig"));
+
+var _BackgroundConfig = _interopRequireDefault(require("../../../common/config-panels/BackgroundConfig"));
+
+var _Collapse = _interopRequireDefault(require("../../../../common/Collapse"));
+
+var _locale = require("../../../../locale");
+
+var _layout = require("../../../../constants/layout");
+
+var _coreUtil = require("../../../../utils/coreUtil");
+
+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 GroupedImageConfig =
+/** @class */
+function (_super) {
+  __extends(GroupedImageConfig, _super);
+
+  function GroupedImageConfig() {
+    var _this = _super !== null && _super.apply(this, arguments) || this;
+
+    _this.getLayout = function (v) {
+      var data = _this.props.data;
+
+      if ((0, _coreUtil.isPc)()) {
+        data.customize.layout.pcLayout = v;
+      } else {
+        data.customize.layout.h5Layout = v;
+      }
+
+      _this.setState({});
+    };
+
+    return _this;
+  }
+
+  GroupedImageConfig.prototype.render = function () {
+    var _this = this;
+
+    var data = this.props.data;
+    return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {
+      divider: "bold",
+      headerSize: "large",
+      source: [{
+        key: '1',
+        name: (0, _locale.i18n)('GROUP'),
+        value: /*#__PURE__*/_react["default"].createElement(_ConfigGroup["default"], {
+          id: data.id,
+          source: data.groupSource
+        })
+      }, {
+        key: '2',
+        name: (0, _locale.i18n)('SPACING'),
+        value: /*#__PURE__*/_react["default"].createElement(_SpacingConfig["default"], {
+          configCompSpace: true,
+          data: data.spacing
+        })
+      }, {
+        key: '3',
+        name: (0, _locale.i18n)('CUSTOMIZE'),
+        value: /*#__PURE__*/_react["default"].createElement(_CustomizeConfig["default"], {
+          data: data.customize,
+          isHideAlign: true,
+          layoutSource: _layout.groupedImageLayoutPc,
+          selectedLayoutFun: function selectedLayoutFun(v) {
+            _this.getLayout(v);
+          }
+        })
+      }, {
+        key: '4',
+        name: (0, _locale.i18n)('BACKGROUND'),
+        value: /*#__PURE__*/_react["default"].createElement(_BackgroundConfig["default"], {
+          data: data.background
+        })
+      }],
+      type: "triangle"
+    }));
+  };
+
+  GroupedImageConfig.defaultProps = {
+    data: {}
+  };
+  return GroupedImageConfig;
+}(_react["default"].Component);
+
+var _default = GroupedImageConfig;
+exports["default"] = _default;

package/lib/composite-comp/dito/second-config-panels/GroupedImageSecondConfig/index.js

@@ -0,0 +1,192 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _common = require("../../../../common");
+
+var _ImageConfig = _interopRequireDefault(require("../../../../meta-comp/config-panels/ImageConfig"));
+
+var _TextConfig = _interopRequireDefault(require("../../../../meta-comp/config-panels/TextConfig"));
+
+var _BaseConfig = _interopRequireDefault(require("../../../../meta-comp/config-panels/BaseConfig"));
+
+var _locale = require("../../../../locale");
+
+var _coreUtil = require("../../../../utils/coreUtil");
+
+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 __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 GroupedImageSecondConfig =
+/** @class */
+function (_super) {
+  __extends(GroupedImageSecondConfig, _super);
+
+  function GroupedImageSecondConfig() {
+    var _this = _super !== null && _super.apply(this, arguments) || this;
+
+    _this.getContentPanel = function () {
+      var panelProps = _this.props.panelProps;
+      var defaultSource = [{
+        key: 'defaultSource_1',
+        name: (0, _locale.i18n)('GROUP_IMAGE'),
+        value: /*#__PURE__*/_react["default"].createElement(_ImageConfig["default"], {
+          data: panelProps.image
+        }),
+        metaOption: panelProps.image
+      }, {
+        key: 'defaultSource_2',
+        name: (0, _locale.i18n)('TEXT'),
+        value: /*#__PURE__*/_react["default"].createElement(_TextConfig["default"], {
+          data: panelProps.title
+        }),
+        metaOption: panelProps.title
+      }, {
+        key: 'defaultSource_3',
+        name: (0, _locale.i18n)('IMAGE') + " 1",
+        value: /*#__PURE__*/_react["default"].createElement(_ImageConfig["default"], {
+          data: panelProps.image1
+        }),
+        metaOption: panelProps.image1
+      }, {
+        key: 'defaultSource_4',
+        name: (0, _locale.i18n)('IMAGE') + " 2",
+        value: /*#__PURE__*/_react["default"].createElement(_ImageConfig["default"], {
+          data: panelProps.image2
+        }),
+        metaOption: panelProps.image2
+      }, {
+        key: 'defaultSource_5',
+        name: (0, _locale.i18n)('IMAGE') + " 3",
+        value: /*#__PURE__*/_react["default"].createElement(_ImageConfig["default"], {
+          data: panelProps.image3
+        }),
+        metaOption: panelProps.image3
+      }, {
+        key: 'defaultSource_6',
+        name: (0, _locale.i18n)('IMAGE') + " 4",
+        value: /*#__PURE__*/_react["default"].createElement(_ImageConfig["default"], {
+          data: panelProps.image4
+        }),
+        metaOption: panelProps.image4
+      }];
+      return /*#__PURE__*/_react["default"].createElement(_common.Collapse, {
+        headerSize: "middle",
+        onRefresh: function onRefresh() {
+          return (0, _coreUtil.renderPreview)();
+        },
+        showActiveColor: true,
+        source: defaultSource,
+        type: "switch"
+      });
+    };
+
+    _this.resetHover = function () {
+      var panelProps = _this.props.panelProps;
+
+      if (panelProps.hover && panelProps.hover.open) {
+        panelProps.hover.image = __assign(__assign({}, panelProps.hover.image), JSON.parse(JSON.stringify(panelProps.image)));
+      }
+    };
+
+    return _this;
+  }
+
+  GroupedImageSecondConfig.prototype.render = function () {
+    var _this = this;
+
+    var panelProps = this.props.panelProps;
+
+    var hoverPanel = /*#__PURE__*/_react["default"].createElement(_common.Collapse, {
+      divider: "dashed",
+      noChange: true,
+      onRefresh: function onRefresh() {
+        return (0, _coreUtil.renderPreview)();
+      },
+      source: [{
+        key: 'hoverSetting_1',
+        name: (0, _locale.i18n)('GROUP_IMAGE'),
+        value: /*#__PURE__*/_react["default"].createElement(_ImageConfig["default"], {
+          data: panelProps.hover.image
+        }),
+        metaOption: panelProps.hover.image
+      }],
+      type: "switch"
+    });
+
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: "grouped_image_second_conf_wrap"
+    }, /*#__PURE__*/_react["default"].createElement(_common.Collapse, {
+      divider: "bold",
+      headerSize: "large",
+      onRefresh: function onRefresh() {
+        return _this.resetHover();
+      },
+      source: [{
+        key: '1',
+        name: (0, _locale.i18n)('CONTENT'),
+        value: this.getContentPanel()
+      }, {
+        key: '2',
+        name: (0, _locale.i18n)('HOVER'),
+        value: hoverPanel,
+        metaOption: panelProps.hover,
+        toggleType: 'checkbox'
+      }]
+    }));
+  };
+
+  GroupedImageSecondConfig.defaultProps = {
+    panelProps: {}
+  };
+  return GroupedImageSecondConfig;
+}(_BaseConfig["default"]);
+
+var _default = GroupedImageSecondConfig;
+exports["default"] = _default;

package/lib/constants/component-types.js

@@ -65,6 +65,8 @@ var _SearchBanner = _interopRequireDefault(require("../composite-comp/dito/compo
 
 var _GroupedCarousel = _interopRequireDefault(require("../composite-comp/dito/components/GroupedCarousel"));
 
+var _GroupedImage = _interopRequireDefault(require("../composite-comp/dito/components/GroupedImage"));
+
 var _SlideImage = _interopRequireDefault(require("../composite-comp/dito/components/SlideImage"));
 
 var _SearchDITO = _interopRequireDefault(require("../composite-comp/dito/components/SearchDITO"));
@@ -133,6 +135,8 @@ var _SearchBannerConfig = _interopRequireDefault(require("../composite-comp/dito
 
 var _GroupedCarouselConfig = _interopRequireDefault(require("../composite-comp/dito/config-panels/GroupedCarouselConfig"));
 
+var _GroupedImageConfig = _interopRequireDefault(require("../composite-comp/dito/config-panels/GroupedImageConfig"));
+
 var _SlideImageConfig = _interopRequireDefault(require("../composite-comp/dito/config-panels/SlideImageConfig"));
 
 var _SearchDITOConfig = _interopRequireDefault(require("../composite-comp/dito/config-panels/SearchDITOConfig"));
@@ -183,6 +187,8 @@ var _SearchBannerSecondConfig = _interopRequireDefault(require("../composite-com
 
 var _GroupedCarouselSecondConfig = _interopRequireDefault(require("../composite-comp/dito/second-config-panels/GroupedCarouselSecondConfig"));
 
+var _GroupedImageSecondConfig = _interopRequireDefault(require("../composite-comp/dito/second-config-panels/GroupedImageSecondConfig"));
+
 var _SlideImageSecondConfig = _interopRequireDefault(require("../composite-comp/dito/second-config-panels/SlideImageSecondConfig"));
 
 var _SearchDITOSecondConfig = _interopRequireDefault(require("../composite-comp/dito/second-config-panels/SearchDITOSecondConfig"));
@@ -199,17 +205,17 @@ var _a, _b, _c; // 组件
 /**
  * 渲染组件索引
  */
-var componentMap = (_a = {}, _a[_Banner["default"].type] = _Banner["default"], _a[_Video["default"].type] = _Video["default"], _a[_Text["default"].type] = _Text["default"], _a[_FlashDeal["default"].type] = _FlashDeal["default"], _a[_GroupBuy["default"].type] = _GroupBuy["default"], _a[_SearchBar["default"].type] = _SearchBar["default"], _a[_SignBoard["default"].type] = _SignBoard["default"], _a[_MenuNavigation["default"].type] = _MenuNavigation["default"], _a[_HeadNavigation["default"].type] = _HeadNavigation["default"], _a[_PersonalInformation["default"].type] = _PersonalInformation["default"], _a[_PersonalInformationSecond["default"].type] = _PersonalInformationSecond["default"], _a[_CommonFunctions["default"].type] = _CommonFunctions["default"], _a[_ImageText["default"].type] = _ImageText["default"], _a[_Recommend["default"].type] = _Recommend["default"], _a[_AffiliateRecommend["default"].type] = _AffiliateRecommend["default"], _a[_MobileNavigation["default"].type] = _MobileNavigation["default"], _a[_PcNavigation["default"].type] = _PcNavigation["default"], _a[_Divider["default"].type] = _Divider["default"], _a[_ImageGallery["default"].type] = _ImageGallery["default"], _a[_Newsletter["default"].type] = _Newsletter["default"], _a[_Carousel["default"].type] = _Carousel["default"], _a[_Button["default"].type] = _Button["default"], _a[_Tag["default"].type] = _Tag["default"], _a[_Wallet["default"].type] = _Wallet["default"], _a[_WalletNuri["default"].type] = _WalletNuri["default"], _a[_CustomCode["default"].type] = _CustomCode["default"], _a[_Location["default"].type] = _Location["default"], _a[_Bargain["default"].type] = _Bargain["default"], _a[_SearchBanner["default"].type] = _SearchBanner["default"], _a[_GroupedCarousel["default"].type] = _GroupedCarousel["default"], _a[_SlideImage["default"].type] = _SlideImage["default"], _a[_SearchDITO["default"].type] = _SearchDITO["default"], _a[_News["default"].type] = _News["default"], _a[_Campaign["default"].type] = _Campaign["default"], _a);
+var componentMap = (_a = {}, _a[_Banner["default"].type] = _Banner["default"], _a[_Video["default"].type] = _Video["default"], _a[_Text["default"].type] = _Text["default"], _a[_FlashDeal["default"].type] = _FlashDeal["default"], _a[_GroupBuy["default"].type] = _GroupBuy["default"], _a[_SearchBar["default"].type] = _SearchBar["default"], _a[_SignBoard["default"].type] = _SignBoard["default"], _a[_MenuNavigation["default"].type] = _MenuNavigation["default"], _a[_HeadNavigation["default"].type] = _HeadNavigation["default"], _a[_PersonalInformation["default"].type] = _PersonalInformation["default"], _a[_PersonalInformationSecond["default"].type] = _PersonalInformationSecond["default"], _a[_CommonFunctions["default"].type] = _CommonFunctions["default"], _a[_ImageText["default"].type] = _ImageText["default"], _a[_Recommend["default"].type] = _Recommend["default"], _a[_AffiliateRecommend["default"].type] = _AffiliateRecommend["default"], _a[_GroupedImage["default"].type] = _GroupedImage["default"], _a[_MobileNavigation["default"].type] = _MobileNavigation["default"], _a[_PcNavigation["default"].type] = _PcNavigation["default"], _a[_Divider["default"].type] = _Divider["default"], _a[_ImageGallery["default"].type] = _ImageGallery["default"], _a[_Newsletter["default"].type] = _Newsletter["default"], _a[_Carousel["default"].type] = _Carousel["default"], _a[_Button["default"].type] = _Button["default"], _a[_Tag["default"].type] = _Tag["default"], _a[_Wallet["default"].type] = _Wallet["default"], _a[_WalletNuri["default"].type] = _WalletNuri["default"], _a[_CustomCode["default"].type] = _CustomCode["default"], _a[_Location["default"].type] = _Location["default"], _a[_Bargain["default"].type] = _Bargain["default"], _a[_SearchBanner["default"].type] = _SearchBanner["default"], _a[_GroupedCarousel["default"].type] = _GroupedCarousel["default"], _a[_SlideImage["default"].type] = _SlideImage["default"], _a[_SearchDITO["default"].type] = _SearchDITO["default"], _a[_News["default"].type] = _News["default"], _a[_Campaign["default"].type] = _Campaign["default"], _a);
 /**
  * 一级配置面板索引
  */
 
 exports.componentMap = componentMap;
-var configPanelMap = (_b = {}, _b[_Banner["default"].type] = _BannerConfig["default"], _b[_Video["default"].type] = _VideoConfig["default"], _b[_Text["default"].type] = _TextCompConfig["default"], _b[_FlashDeal["default"].type] = _FlashDealConfig["default"], _b[_GroupBuy["default"].type] = _GroupBuyConfig["default"], _b[_SearchBar["default"].type] = _SearchBarConfig["default"], _b[_SignBoard["default"].type] = _SignBoardConfig["default"], _b[_MenuNavigation["default"].type] = _MenuNavigationConfig["default"], _b[_HeadNavigation["default"].type] = _HeadNavigationConfig["default"], _b[_PersonalInformation["default"].type] = _PersonalInformationConfig["default"], _b[_PersonalInformationSecond["default"].type] = _PersonalInformationSecondConfig["default"], _b[_CommonFunctions["default"].type] = _CommonFunctionsConfig["default"], _b[_ImageText["default"].type] = _ImageTextConfig["default"], _b[_Recommend["default"].type] = _RecommendConfig["default"], _b[_AffiliateRecommend["default"].type] = _AffiliateRecommendConfig["default"], _b[_MobileNavigation["default"].type] = _MobileNavigationConfig["default"], _b[_PcNavigation["default"].type] = _PcNavigationConfig["default"], _b[_Divider["default"].type] = _DividerConfig["default"], _b[_ImageGallery["default"].type] = _ImageGalleryConfig["default"], _b[_Newsletter["default"].type] = _NewsletterConfig["default"], _b[_Carousel["default"].type] = _CarouselConfig["default"], _b[_Button["default"].type] = _ButtonCompConfig["default"], _b[_Tag["default"].type] = _TagCompConfig["default"], _b[_Wallet["default"].type] = _WalletConfig["default"], _b[_WalletNuri["default"].type] = _WalletNuriConfig["default"], _b[_CustomCode["default"].type] = _CustomCodeConfig["default"], _b[_Location["default"].type] = _LocationConfig["default"], _b[_Bargain["default"].type] = _BargainConfig["default"], _b[_SearchBanner["default"].type] = _SearchBannerConfig["default"], _b[_GroupedCarousel["default"].type] = _GroupedCarouselConfig["default"], _b[_SlideImage["default"].type] = _SlideImageConfig["default"], _b[_SearchDITO["default"].type] = _SearchDITOConfig["default"], _b[_News["default"].type] = _NewsConfig["default"], _b[_Campaign["default"].type] = _CampaignConfig["default"], _b);
+var configPanelMap = (_b = {}, _b[_Banner["default"].type] = _BannerConfig["default"], _b[_Video["default"].type] = _VideoConfig["default"], _b[_Text["default"].type] = _TextCompConfig["default"], _b[_FlashDeal["default"].type] = _FlashDealConfig["default"], _b[_GroupBuy["default"].type] = _GroupBuyConfig["default"], _b[_SearchBar["default"].type] = _SearchBarConfig["default"], _b[_SignBoard["default"].type] = _SignBoardConfig["default"], _b[_MenuNavigation["default"].type] = _MenuNavigationConfig["default"], _b[_HeadNavigation["default"].type] = _HeadNavigationConfig["default"], _b[_PersonalInformation["default"].type] = _PersonalInformationConfig["default"], _b[_PersonalInformationSecond["default"].type] = _PersonalInformationSecondConfig["default"], _b[_CommonFunctions["default"].type] = _CommonFunctionsConfig["default"], _b[_ImageText["default"].type] = _ImageTextConfig["default"], _b[_Recommend["default"].type] = _RecommendConfig["default"], _b[_AffiliateRecommend["default"].type] = _AffiliateRecommendConfig["default"], _b[_GroupedImage["default"].type] = _GroupedImageConfig["default"], _b[_MobileNavigation["default"].type] = _MobileNavigationConfig["default"], _b[_PcNavigation["default"].type] = _PcNavigationConfig["default"], _b[_Divider["default"].type] = _DividerConfig["default"], _b[_ImageGallery["default"].type] = _ImageGalleryConfig["default"], _b[_Newsletter["default"].type] = _NewsletterConfig["default"], _b[_Carousel["default"].type] = _CarouselConfig["default"], _b[_Button["default"].type] = _ButtonCompConfig["default"], _b[_Tag["default"].type] = _TagCompConfig["default"], _b[_Wallet["default"].type] = _WalletConfig["default"], _b[_WalletNuri["default"].type] = _WalletNuriConfig["default"], _b[_CustomCode["default"].type] = _CustomCodeConfig["default"], _b[_Location["default"].type] = _LocationConfig["default"], _b[_Bargain["default"].type] = _BargainConfig["default"], _b[_SearchBanner["default"].type] = _SearchBannerConfig["default"], _b[_GroupedCarousel["default"].type] = _GroupedCarouselConfig["default"], _b[_SlideImage["default"].type] = _SlideImageConfig["default"], _b[_SearchDITO["default"].type] = _SearchDITOConfig["default"], _b[_News["default"].type] = _NewsConfig["default"], _b[_Campaign["default"].type] = _CampaignConfig["default"], _b);
 /**
  * 二级配置面板索引
  */
 
 exports.configPanelMap = configPanelMap;
-var secondConfigPanelMap = (_c = {}, _c[_Banner["default"].type] = _BannerSecondConfig["default"], _c[_Video["default"].type] = _VideoSecondConfig["default"], _c[_Text["default"].type] = _TextSecondConfig["default"], _c[_ImageText["default"].type] = _ImageTextSecondConfig["default"], _c[_Recommend["default"].type] = _RecommendSecondConfig["default"], _c[_AffiliateRecommend["default"].type] = _AffiliateRecommendSecondConfig["default"], _c[_MobileNavigation["default"].type] = _MobileNavigationSecondConfig["default"], _c[_PcNavigation["default"].type] = _PcNavigationSecondConfig["default"], _c[_MenuNavigation["default"].type] = _MenuNavigationSecondConfig["default"], _c[_HeadNavigation["default"].type] = _HeadNavigationSecondConfig["default"], _c[_PersonalInformation["default"].type] = _PersonalInformationSecondConfig2["default"], _c[_PersonalInformationSecond["default"].type] = _PersonalInformationSecondSecondConfig["default"], _c[_CommonFunctions["default"].type] = _CommonFunctionsSecondConfig["default"], _c[_Carousel["default"].type] = _CarouselSecondConfig["default"], _c[_ImageGallery["default"].type] = _ImageGallerySecondConfig["default"], _c[_Tag["default"].type] = _TagSecondConfig["default"], _c[_Button["default"].type] = _ButtonSecondConfig["default"], _c[_Wallet["default"].type] = _WalletSecondConfig["default"], _c[_WalletNuri["default"].type] = _WalletNuriSecondConfig["default"], _c[_SearchBanner["default"].type] = _SearchBannerSecondConfig["default"], _c[_GroupedCarousel["default"].type] = _GroupedCarouselSecondConfig["default"], _c[_SlideImage["default"].type] = _SlideImageSecondConfig["default"], _c[_SearchDITO["default"].type] = _SearchDITOSecondConfig["default"], _c[_News["default"].type] = _NewsSecondConfig["default"], _c[_Campaign["default"].type] = _CampaignSecondConfig["default"], _c);
+var secondConfigPanelMap = (_c = {}, _c[_Banner["default"].type] = _BannerSecondConfig["default"], _c[_Video["default"].type] = _VideoSecondConfig["default"], _c[_Text["default"].type] = _TextSecondConfig["default"], _c[_ImageText["default"].type] = _ImageTextSecondConfig["default"], _c[_Recommend["default"].type] = _RecommendSecondConfig["default"], _c[_AffiliateRecommend["default"].type] = _AffiliateRecommendSecondConfig["default"], _c[_MobileNavigation["default"].type] = _MobileNavigationSecondConfig["default"], _c[_PcNavigation["default"].type] = _PcNavigationSecondConfig["default"], _c[_MenuNavigation["default"].type] = _MenuNavigationSecondConfig["default"], _c[_HeadNavigation["default"].type] = _HeadNavigationSecondConfig["default"], _c[_PersonalInformation["default"].type] = _PersonalInformationSecondConfig2["default"], _c[_PersonalInformationSecond["default"].type] = _PersonalInformationSecondSecondConfig["default"], _c[_CommonFunctions["default"].type] = _CommonFunctionsSecondConfig["default"], _c[_Carousel["default"].type] = _CarouselSecondConfig["default"], _c[_ImageGallery["default"].type] = _ImageGallerySecondConfig["default"], _c[_Tag["default"].type] = _TagSecondConfig["default"], _c[_Button["default"].type] = _ButtonSecondConfig["default"], _c[_Wallet["default"].type] = _WalletSecondConfig["default"], _c[_WalletNuri["default"].type] = _WalletNuriSecondConfig["default"], _c[_SearchBanner["default"].type] = _SearchBannerSecondConfig["default"], _c[_GroupedCarousel["default"].type] = _GroupedCarouselSecondConfig["default"], _c[_GroupedImage["default"].type] = _GroupedImageSecondConfig["default"], _c[_SlideImage["default"].type] = _SlideImageSecondConfig["default"], _c[_SearchDITO["default"].type] = _SearchDITOSecondConfig["default"], _c[_News["default"].type] = _NewsSecondConfig["default"], _c[_Campaign["default"].type] = _CampaignSecondConfig["default"], _c);
 exports.secondConfigPanelMap = secondConfigPanelMap;

package/lib/constants/index.js

@@ -118,7 +118,8 @@ var urlTypeMap = {
   STORE: 'Store',
   AFFILIATE_PRODUCT: 'AffiliateProduct',
   ANCHOR: 'Anchor',
-  CARD_PRODUCT_LIST: 'ProductList'
+  CARD_PRODUCT_LIST: 'ProductList',
+  PICTURE: 'Picture'
 };
 exports.urlTypeMap = urlTypeMap;
 var respCodeMap = {
@@ -289,6 +290,10 @@ var compInfoMap = {
   CAMPAIGN: {
     name: 'Campaign',
     icon: 'icon-carousel'
+  },
+  GROUPED_IMAGE: {
+    name: 'Grouped Image',
+    icon: 'icon-forms'
   }
 };
 /**

package/lib/constants/layout.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.videoPCLayout = exports.videoH5Layout = exports.slideImageLayout = exports.searchLayout = exports.searchDitoLayout = exports.recommendLayoutPc = exports.recommendLayoutMobile = exports.pcNavigationLayout = exports.pcFlashDealLayout = exports.newsletterLayout = exports.newsLayout = exports.mobileNavigationLayout = exports.locationLayout = exports.imageTextLayoutPc = exports.imageTextLayoutMobile = exports.imageGalleryPcLayout = exports.imageGalleryLayout = exports.groupedCarouselLayout = exports.flashDealLayout = exports.dividerLayout = exports.carouselLayout = exports.campaignLayout = exports.bannerSlideLayout = exports.affiliateLayoutPc = exports.affiliateLayoutMobile = exports.WalletNuriLayout = exports.WalletLayout = void 0;
+exports.videoPCLayout = exports.videoH5Layout = exports.slideImageLayout = exports.searchLayout = exports.searchDitoLayout = exports.recommendLayoutPc = exports.recommendLayoutMobile = exports.pcNavigationLayout = exports.pcFlashDealLayout = exports.newsletterLayout = exports.newsLayout = exports.mobileNavigationLayout = exports.locationLayout = exports.imageTextLayoutPc = exports.imageTextLayoutMobile = exports.imageGalleryPcLayout = exports.imageGalleryLayout = exports.groupedImageLayoutPc = exports.groupedCarouselLayout = exports.flashDealLayout = exports.dividerLayout = exports.carouselLayout = exports.campaignLayout = exports.bannerSlideLayout = exports.bannerPcLayout = exports.bannerH5Layout = exports.affiliateLayoutPc = exports.affiliateLayoutMobile = exports.WalletNuriLayout = exports.WalletLayout = void 0;
 
 var _dividerLayout = _interopRequireDefault(require("../assets/images/layout-icon/dividerLayout.svg"));
 
@@ -63,6 +63,8 @@ var _layoutRecommend4 = _interopRequireDefault(require("../assets/images/layout-
 
 var _layoutRecommend5 = _interopRequireDefault(require("../assets/images/layout-icon/layout-recommend-5.png"));
 
+var _groupedImageLayout = _interopRequireDefault(require("../assets/images/layout-icon/grouped-image-layout1.png"));
+
 var _layoutVideoH = _interopRequireDefault(require("../assets/images/layout-icon/layout-video-h5-1.png"));
 
 var _layoutVideoH2 = _interopRequireDefault(require("../assets/images/layout-icon/layout-video-h5-2.png"));
@@ -103,6 +105,10 @@ var _newsLayout = _interopRequireDefault(require("../assets/images/layout-icon/n
 
 var _campaignLayout = _interopRequireDefault(require("../assets/images/layout-icon/campaignLayout1.png"));
 
+var _bannerLayout = _interopRequireDefault(require("../assets/images/layout-icon/banner-layout1.png"));
+
+var _bannerLayout2 = _interopRequireDefault(require("../assets/images/layout-icon/banner-layout2.svg"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 // import p3 from '../assets/images/layout-icon/layout-imagetext-p3.png';
@@ -268,6 +274,12 @@ var recommendLayoutPc = [{
   image: _layoutRecommend5["default"]
 }];
 exports.recommendLayoutPc = recommendLayoutPc;
+var groupedImageLayoutPc = [{
+  id: 'layout1',
+  name: 'layout1',
+  image: _groupedImageLayout["default"]
+}];
+exports.groupedImageLayoutPc = groupedImageLayoutPc;
 var affiliateLayoutMobile = [{
   id: 'layout1',
   name: 'layout1',
@@ -412,4 +424,20 @@ var campaignLayout = [{
   name: 'layout1',
   image: _campaignLayout["default"]
 }];
-exports.campaignLayout = campaignLayout;
+exports.campaignLayout = campaignLayout;
+var bannerPcLayout = [{
+  id: 'layout1',
+  name: 'layout1',
+  image: _bannerLayout["default"]
+}, {
+  id: 'layout2',
+  name: 'layout2',
+  image: _bannerLayout2["default"]
+}];
+exports.bannerPcLayout = bannerPcLayout;
+var bannerH5Layout = [{
+  id: 'layout1',
+  name: 'layout1',
+  image: _bannerLayout["default"]
+}];
+exports.bannerH5Layout = bannerH5Layout;

package/lib/core/Renderer/index.js

@@ -19,6 +19,8 @@ var _mobx = require("../../mobx");
 
 var _common = require("../../common");
 
+var _PictureModal = _interopRequireDefault(require("../../common/PictureModal"));
+
 var _Iconfont = _interopRequireDefault(require("../../common/Iconfont"));
 
 require("./index.less");
@@ -92,9 +94,13 @@ var Renderer = function Renderer(props) {
       pcProdCardModalState = _c[0],
       setPcProdCardModalState = _c[1];
 
-  var _d = (0, _react.useState)(_mobx.frameStore.toastState),
-      toastState = _d[0],
-      setToastState = _d[1];
+  var _d = (0, _react.useState)(_mobx.frameStore.pictureModalState),
+      pictureModalState = _d[0],
+      setPictureModalState = _d[1];
+
+  var _e = (0, _react.useState)(_mobx.frameStore.toastState),
+      toastState = _e[0],
+      setToastState = _e[1];
 
   if (!noSetWindow) {
     setDesignConfig(props);
@@ -152,6 +158,7 @@ var Renderer = function Renderer(props) {
     var disposer = (0, _mobx.autorun)(function () {
       setModalState(_mobx.frameStore.modalState);
       setPcProdCardModalState(_mobx.frameStore.pcProdCardModalState);
+      setPictureModalState(_mobx.frameStore.pictureModalState);
       setToastState(_mobx.frameStore.toastState);
     });
     return function () {
@@ -180,6 +187,17 @@ var Renderer = function Renderer(props) {
     });
   };
 
+  var onClosePictureModal = function onClosePictureModal() {
+    document.body.classList.remove('no-scroll');
+
+    _mobx.frameStore.setState({
+      pictureModalState: {
+        visible: false,
+        url: ''
+      }
+    });
+  };
+
   var onCloseToast = function onCloseToast() {
     _mobx.frameStore.setState({
       toastState: {
@@ -242,7 +260,10 @@ var Renderer = function Renderer(props) {
     onClose: onCloseModal
   })), pcProdCardModalState.visible && /*#__PURE__*/_react["default"].createElement(_common.ProductCardModal, _extends({}, pcProdCardModalState, {
     onClose: onCloseProdCardModal
-  })), toastState.visible && /*#__PURE__*/_react["default"].createElement(_common.Toast, _extends({}, toastState, {
+  })), pictureModalState.visible && /*#__PURE__*/_react["default"].createElement(_PictureModal["default"], {
+    url: pictureModalState.url,
+    onClose: onClosePictureModal
+  }), toastState.visible && /*#__PURE__*/_react["default"].createElement(_common.Toast, _extends({}, toastState, {
     onClose: onCloseToast
   })));
 };

package/lib/locale/en/en.json

@@ -1,4 +1,5 @@
 {
+  "GROUP_IMAGE": "Group Image",
   "ENDS_IN": "Ends in",
   "STARTS_IN": "Starts in",
   "ICON_COLOR": "Icon Color",

package/lib/locale/es/es.json

@@ -1,4 +1,5 @@
 {
+  "GROUP_IMAGE": "Group Image",
   "ENDS_IN": "Ends in",
   "STARTS_IN": "Starts in",
   "ICON_COLOR": "Icon Color",

package/lib/locale/id/id.json

@@ -1,4 +1,5 @@
 {
+  "GROUP_IMAGE": "Group Image",
   "ENDS_IN": "Ends in",
   "STARTS_IN": "Starts in",
   "ICON_COLOR": "Icon Color",

package/lib/mobx/Frame.js

@@ -64,6 +64,10 @@ function () {
       visible: false,
       data: []
     };
+    this.pictureModalState = {
+      visible: false,
+      url: ''
+    };
     this.toastState = {
       visible: false,
       message: '',
@@ -74,6 +78,7 @@ function () {
       textModalState: _mobx.observable,
       modalState: _mobx.observable,
       pcProdCardModalState: _mobx.observable,
+      pictureModalState: _mobx.observable,
       toastState: _mobx.observable
     });
   }

package/lib/utils/businessUtil.js

@@ -343,6 +343,17 @@ var newParseUrl = function newParseUrl(urlObj) {
       };
       break;
 
+    case _constants.urlTypeMap.PICTURE:
+      // 图片弹窗
+      params = {
+        action: 'operation',
+        params: {
+          type: 'PICTURE',
+          url: urlObj.url
+        }
+      };
+      break;
+
     default:
       var map = {
         '/main/cart': 'CART',

package/lib/utils/coreUtil.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.setMagicDesign = exports.renderPreview = exports.isPc = exports.isDesignMode = exports.isActiveFloor = exports.getVideoCover = exports.createProdCardModal = exports.copyNode = exports.clickUrl = void 0;
+exports.setMagicDesign = exports.renderPreview = exports.isPc = exports.isDesignMode = exports.isActiveFloor = exports.getVideoCover = exports.createProdCardModal = exports.createPictureModal = exports.copyNode = exports.clickUrl = void 0;
 
 var _uuid = require("uuid");
 
@@ -349,14 +349,27 @@ var createProdCardModal = function createProdCardModal(ids) {
 
 exports.createProdCardModal = createProdCardModal;
 
+var createPictureModal = function createPictureModal(url) {
+  if (!url) return;
+  document.body.classList.add('no-scroll');
+
+  _mobx.frameStore.setState({
+    pictureModalState: {
+      visible: true,
+      url: url
+    }
+  });
+};
+
+exports.createPictureModal = createPictureModal;
+
 var clickUrl = function clickUrl(url, state) {
   var _a;
 
   if (url === void 0) {
     url = '';
-  }
+  } // 只读模式，设计模式，url为空，邮箱模版
 
-  console.log('clickUrl...', url, state); // 只读模式，设计模式，url为空，邮箱模版
 
   if (window.magicDesign.readOnly || window.magicDesign.mode !== 'renderer' || !url || window.magicDesign.outputType == 'html') {
     return;
@@ -367,7 +380,13 @@ var clickUrl = function clickUrl(url, state) {
       data = _b.data;
 
   var _c = data.params,
-      params = _c === void 0 ? {} : _c; // PC商品卡片弹窗
+      params = _c === void 0 ? {} : _c; // 图片链接弹窗
+
+  if (params.type === 'PICTURE') {
+    createPictureModal(params.url);
+    return;
+  } // PC商品卡片弹窗
+
 
   if (params.type === 'CARD_PRODUCT_LIST') {
     createProdCardModal(params.offerIds);

package/lib/utils/dataUtil.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.addDefaultMetaData = void 0;
+
+var _data = require("../../data.jsx");
+
+var addDefaultMetaData = function addDefaultMetaData(type, parentId) {
+  return (0, _data.defMetaData)(parentId)[type];
+};
+
+exports.addDefaultMetaData = addDefaultMetaData;