@fonixtree/magic-design 1.0.144 → 1.0.147

package/es/common/VideoPC/index.less

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

package/es/common/index.js

@@ -159,6 +159,12 @@ Object.defineProperty(exports, "Video", {
     return _Video["default"];
   }
 });
+Object.defineProperty(exports, "VideoPC", {
+  enumerable: true,
+  get: function get() {
+    return _VideoPC["default"];
+  }
+});
 Object.defineProperty(exports, "VideoUpload", {
   enumerable: true,
   get: function get() {
@@ -202,6 +208,8 @@ var _SystemNotification = _interopRequireDefault(require("./SystemNotification")
 
 var _Video = _interopRequireDefault(require("./Video"));
 
+var _VideoPC = _interopRequireDefault(require("./VideoPC"));
+
 var _SwiperBan = _interopRequireDefault(require("./SwiperBan"));
 
 var _InputNumber = _interopRequireDefault(require("./InputNumber"));

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

@@ -62,7 +62,6 @@ function (_super) {
       var nextIndex = groupSource.findIndex(function (item) {
         return item.id === _mobx.store.clickedGroup;
       });
-      console.log('nextIndex', nextIndex);
 
       if (nextIndex != -1 && nextIndex != _this.state.tabIndex) {
         _this.carouselImgRef.current.goTo(nextIndex);

package/es/composite-comp/dito/components/SearchDITO/defaultJSON.js

@@ -71,7 +71,8 @@ var groupSourceJSON = function groupSourceJSON(parentId, type) {
         pcSize: 60,
         iconType: 'light-playicon-01',
         iconColor: 'Light'
-      }
+      },
+      clickUrl: ''
     };
   }
 };

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

@@ -104,8 +104,11 @@ function (_super) {
 
     var data = this.props.data;
     return /*#__PURE__*/_react["default"].createElement("div", {
-      className: "video-item-wrap"
-    }, /*#__PURE__*/_react["default"].createElement(_common.Video, {
+      className: "video-item-wrap",
+      style: {
+        cursor: data.clickUrl ? 'pointer' : 'auto'
+      }
+    }, /*#__PURE__*/_react["default"].createElement(_common.VideoPC, {
       ref: function ref(el) {
         if (!_this.videoRefMap[data.id]) {
           _this.videoRefMap[data.id] = {
@@ -116,6 +119,9 @@ function (_super) {
           _this.setState({});
         }
       },
+      onClick: function onClick() {
+        (0, _coreUtil.clickUrl)(data.clickUrl);
+      },
       onEnd: function onEnd() {
         _this.videoRefMap[data.id].playing = false;
 

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

@@ -1,5 +1,5 @@
 .video-item-wrap {
-  height: 700px;
+  // height: 700px;
   position: relative;
   margin-bottom: 10px;
 

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

@@ -589,7 +589,7 @@ function (_super) {
     }, /*#__PURE__*/_react["default"].createElement(_common.Iconfont, {
       color: (_h = (_g = data.content.icon) === null || _g === void 0 ? void 0 : _g.color) === null || _h === void 0 ? void 0 : _h.pc,
       onClick: function onClick() {
-        return (0, _coreUtil.clickUrl)('/search-page');
+        return (0, _coreUtil.clickUrl)('/search-page?from=home');
       },
       size: 24,
       type: "icon-search-short"
@@ -656,7 +656,6 @@ function (_super) {
       }, m.image && m.image.open && /*#__PURE__*/_react["default"].createElement(_components.MetaImage, {
         className: "bgImg",
         data: m.image,
-        imgCover: true,
         isBackground: true
       }), m.video && i === carouseIndex && /*#__PURE__*/_react["default"].createElement(_VideoItem["default"], {
         data: m

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

@@ -174,8 +174,10 @@
   }
 
   .carousel-img {
+    min-height: 400px;
+
     .bgImg {
-      height: 700px;
+      // height: 700px;
     }
   }
 

package/es/composite-comp/dito/components/SlideImage/defaultJSON.js

@@ -58,7 +58,7 @@ var groupSourceJSON = function groupSourceJSON(parentId) {
         fontWeight: 600,
         pcFontSize: 22,
         color: '#232F46',
-        textAlign: 'center'
+        textAlign: 'left'
       },
       underline: {
         open: false,
@@ -66,7 +66,8 @@ var groupSourceJSON = function groupSourceJSON(parentId) {
         textDecorationStyle: 'solid'
       },
       vertical: {}
-    }
+    },
+    clickUrl: ''
   };
 };
 

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

@@ -79,7 +79,7 @@ function (_super) {
     return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", _extends({
       className: (0, _classnames["default"])('slide-image-card-item-wrap'),
       onClick: function onClick() {
-        return (0, _coreUtil.clickUrl)(data.groupName.content.clickUrl || {});
+        return (0, _coreUtil.clickUrl)(data.clickUrl || '');
       }
     }, rest), /*#__PURE__*/_react["default"].createElement(_VideoItem["default"], {
       data: data
@@ -87,7 +87,7 @@ function (_super) {
       className: "img-text",
       data: data.groupName,
       style: {
-        pointerEvents: 'none'
+        pointerEvents: (0, _coreUtil.isDesignMode)() ? 'unset' : 'none'
       }
     })));
   };

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

@@ -59,10 +59,12 @@ function ParallaxScroll(_a) {
   var translateThird = (0, _framerMotion.useTransform)(scrollYProgress, [0, 1], [0, colThreeScrollY]);
   (0, _react.useEffect)(function () {
     setTimeout(function () {
+      var _a, _b, _c;
+
       if (!(0, _coreUtil.isDesignMode)()) {
-        var colOneHeight = colOneRef.current.offsetHeight;
-        var colTwoHeight = colTwoRef.current.offsetHeight;
-        var colThreeHeight = colThreeRef.current.offsetHeight;
+        var colOneHeight = (_a = colOneRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight;
+        var colTwoHeight = (_b = colTwoRef.current) === null || _b === void 0 ? void 0 : _b.offsetHeight;
+        var colThreeHeight = (_c = colThreeRef.current) === null || _c === void 0 ? void 0 : _c.offsetHeight;
         var colHeights = [colOneHeight, colTwoHeight, colThreeHeight];
         var space = Math.max.apply(Math, colHeights) - Math.min.apply(Math, colHeights) - 20;
         var minHeightIndex = colHeights.indexOf(Math.min.apply(Math, colHeights));
@@ -81,7 +83,7 @@ function ParallaxScroll(_a) {
           setColThreeScrollY(space);
         }
       }
-    }, 1000);
+    }, 1500);
   }, [scrollYProgress]);
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: "m-parallax-scroll"

package/es/composite-comp/dito/second-config-panels/SearchDITOSecondConfig/index.js

@@ -202,6 +202,15 @@ function (_super) {
         },
         showNow: false,
         value: (0, _moment["default"])(panelProps.video.startAt / 60 + ":" + panelProps.video.startAt % 60, 'mm:ss')
+      })), /*#__PURE__*/_react["default"].createElement(_common.Field, {
+        title: "URL"
+      }, /*#__PURE__*/_react["default"].createElement(_common.UrlPicker, {
+        onChange: function onChange(v) {
+          panelProps.clickUrl = v;
+
+          _this.reRender();
+        },
+        value: panelProps.clickUrl
       })), /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {
         headerSize: "middle",
         onRefresh: function onRefresh() {

package/es/composite-comp/dito/second-config-panels/SlideImageSecondConfig/index.js

@@ -182,7 +182,16 @@ function (_super) {
           _this.reRender();
         },
         value: panelProps.video.sourceUrl
-      }), /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {
+      }), /*#__PURE__*/_react["default"].createElement(_common.Field, {
+        title: "URL"
+      }, /*#__PURE__*/_react["default"].createElement(_common.UrlPicker, {
+        onChange: function onChange(v) {
+          panelProps.clickUrl = v;
+
+          _this.reRender();
+        },
+        value: panelProps.clickUrl
+      })), /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {
         headerSize: "middle",
         onRefresh: function onRefresh() {
           return (0, _coreUtil.renderPreview)();

package/es/core/Renderer/index.js

@@ -46,7 +46,6 @@ var setDesignConfig = function setDesignConfig(props) {
       device = props.device,
       isPreview = props.isPreview,
       projectCode = props.projectCode;
-  console.log('window.magicDesign', props);
   window.magicDesign = __assign(__assign({
     pageBackground: '#f2f2f2',
     mode: 'renderer',

package/es/utils/coreUtil.js

@@ -313,6 +313,7 @@ var createProdCardModal = function createProdCardModal(ids) {
     return __generator(this, function (_b) {
       switch (_b.label) {
         case 0:
+          console.log('ids', ids);
           if (ids.length === 0) return [2
           /*return*/
           ];
@@ -371,14 +372,13 @@ var clickUrl = function clickUrl(url, state) {
       params = _c === void 0 ? {} : _c;
   console.log('params...', params); // PC商品卡片弹窗
 
-  if (params.type === _constants.urlTypeMap.CARD_PRODUCT_LIST) {
+  if (params.type === 'CARD_PRODUCT_LIST') {
     createProdCardModal(params.offerIds);
     return;
   }
-
-  return;
   /** 锚点跳转 */
 
+
   if (params.type === 'ANCHOR') {
     ensure(function () {
       var nodeId = isPc() ? params.data.pcNodeId : params.data.mobileNodeId;

package/lib/common/ProductCardModal/index.js

@@ -139,7 +139,7 @@ function ProductCardModal(_a) {
       }
     }, /*#__PURE__*/_react["default"].createElement("div", {
       dangerouslySetInnerHTML: {
-        __html: (0, _commonUtil.xssDecode)(item.goodsIntroduce)
+        __html: (0, _commonUtil.xssDecode)(item.goodsIntroduce || '')
       }
     })), index === active && /*#__PURE__*/_react["default"].createElement(_Iconfont["default"], {
       className: "closIcon",

package/lib/common/ProductCardModal/index.less

@@ -14,7 +14,7 @@
 
   .content {
     position: relative;
-    width: 60%;
+    width: 50%;
 
     .card {
       transform-origin: bottom;

package/lib/common/Video/index.js

@@ -728,9 +728,11 @@ function (_super) {
     var _a = this.props,
         videoId = _a.videoId,
         opts = _a.opts,
-        play = _a.play;
+        play = _a.play,
+        onClick = _a.onClick;
     return /*#__PURE__*/_react["default"].createElement("div", {
-      className: "video-container"
+      className: "video-container",
+      onClick: onClick
     }, opts.source ? /*#__PURE__*/_react["default"].createElement("div", {
       className: "video-wrap",
       id: 'video' + videoId

package/lib/common/VideoPC/components/index.js

@@ -0,0 +1,100 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+require("./index.less");
+
+function parseDom(html) {
+  var ele = document.createElement('div');
+  ele.innerHTML = html;
+  return ele.childNodes[0];
+}
+
+var rateHtml = "<div class=\"rate-components\">\n  <div class=\"current-rate\">1.0x</div>\n  <ul class=\"rate-list\">\n    <li data-rate=\"2.0\">2.0x</li>\n    <li data-rate=\"1.5\">1.5x</li>\n    <li data-rate=\"1.0\" class=\"current\">1.0x</li>\n    <li data-rate=\"0.5\">0.5x</li>\n  </ul>\n</div>";
+/**
+ * 倍速播放组件
+ */
+
+var RateComponent =
+/** @class */
+function () {
+  /**
+   * @constructor 倍速播放组件构造函数
+   */
+  function RateComponent() {
+    this.html = parseDom(rateHtml);
+  }
+
+  RateComponent.prototype.createEl = function (el) {
+    var eleControlbar = el.querySelector('.prism-controlbar');
+    eleControlbar.appendChild(this.html);
+  };
+
+  RateComponent.prototype.ready = function (player) {
+    var currentRateEle = this.html.querySelector('.current-rate');
+    var rateListEle = this.html.querySelector('.rate-list');
+    var timeId = null;
+    var currentEle = rateListEle.querySelector('.current');
+
+    if (currentEle) {
+      currentEle.className = '';
+    }
+
+    rateListEle.querySelector("[data-rate=\"" + player._speed + "\"]").className = 'current';
+    currentRateEle.innerText = player._speed + 'x'; // 隐藏设置里面的倍速播放
+
+    var settingRate = document.querySelector('.prism-setting-item.prism-setting-speed');
+
+    if (settingRate) {
+      settingRate.classList.add('player-hidden');
+    }
+
+    currentRateEle.onclick = function () {
+      rateListEle.style.display = 'block';
+    };
+
+    currentRateEle.onmouseleave = function () {
+      timeId = setTimeout(function () {
+        rateListEle.style.display = 'none';
+      }, 100);
+    };
+
+    rateListEle.onmouseenter = function () {
+      clearTimeout(timeId);
+    };
+
+    rateListEle.onmouseleave = function () {
+      rateListEle.style.display = 'none';
+    };
+
+    rateListEle.onclick = function (_a) {
+      var target = _a.target;
+      var rate = target.dataset.rate;
+
+      if (rate) {
+        player.setSpeed(rate);
+
+        if (target.className !== 'current') {
+          var currentEle_1 = rateListEle.querySelector('.current');
+
+          if (currentEle_1) {
+            currentEle_1.className = '';
+          }
+
+          target.className = 'current';
+        }
+
+        rateListEle.style.display = 'none';
+        currentRateEle.innerText = rate + 'x';
+      }
+    };
+  };
+
+  return RateComponent;
+}();
+
+var _default = RateComponent;
+exports["default"] = _default;

package/lib/common/VideoPC/components/index.less

@@ -0,0 +1,62 @@
+.player-hidden {
+  display: none !important;
+}
+
+.rate-components {
+  float: right;
+  color: #fff;
+  height: 35px;
+  position: relative;
+  box-sizing: border-box;
+  margin-top: 5px;
+}
+
+.current-rate {
+  display: flex;
+  height: 100%;
+  align-items: center;
+  justify-content: center;
+  width: 70px;
+  cursor: pointer;
+}
+
+.rate-list {
+  position: absolute;
+  bottom: 46px;
+  display: none;
+  padding: 0;
+  margin: 0;
+  list-style: none;
+
+  li {
+    text-align: center;
+    width: 70px;
+    line-height: 30px;
+    background-color: rgba(0, 0, 0, .6);
+    cursor: pointer;
+
+    &.current {
+      color: #00c1de;
+    }
+
+    &+li {
+      border-top: 1px solid rgba(78, 78, 78, 0.3);
+    }
+
+    &:hover {
+      background-color: rgba(0, 0, 0, .5);
+    }
+
+    ;
+  }
+}
+
+@media(max-width: 768px) {
+  .current-rate {
+    width: 40px;
+  }
+
+  .rate-list li {
+    width: 43px;
+  }
+}