pb-sxp-ui 1.16.10 → 1.16.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (35) hide show
  1. package/dist/index.cjs +140 -164
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.js +140 -164
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.min.cjs +6 -6
  6. package/dist/index.min.cjs.map +1 -1
  7. package/dist/index.min.js +6 -6
  8. package/dist/index.min.js.map +1 -1
  9. package/dist/pb-ui.js +140 -164
  10. package/dist/pb-ui.js.map +1 -1
  11. package/dist/pb-ui.min.js +6 -6
  12. package/dist/pb-ui.min.js.map +1 -1
  13. package/es/core/components/DiyPortalPreview/VideoWidget.js +8 -10
  14. package/es/core/components/SxpPageRender/LikeButton/index.js +15 -17
  15. package/es/core/components/SxpPageRender/PictureGroup/index.d.ts +0 -5
  16. package/es/core/components/SxpPageRender/PictureGroup/index.js +13 -42
  17. package/es/core/components/SxpPageRender/VideoWidget/index.js +44 -34
  18. package/es/core/components/SxpPageRender/WaterFall/index.js +3 -4
  19. package/es/core/components/SxpPageRender/index.js +36 -47
  20. package/es/core/context/SxpDataSourceProvider.js +2 -2
  21. package/es/core/hooks/useEventReport.js +5 -6
  22. package/es/materials/sxp/popup/CommodityDetail/index.js +7 -1
  23. package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +7 -1
  24. package/lib/core/components/DiyPortalPreview/VideoWidget.js +8 -10
  25. package/lib/core/components/SxpPageRender/LikeButton/index.js +15 -17
  26. package/lib/core/components/SxpPageRender/PictureGroup/index.d.ts +0 -5
  27. package/lib/core/components/SxpPageRender/PictureGroup/index.js +12 -41
  28. package/lib/core/components/SxpPageRender/VideoWidget/index.js +44 -34
  29. package/lib/core/components/SxpPageRender/WaterFall/index.js +3 -4
  30. package/lib/core/components/SxpPageRender/index.js +36 -47
  31. package/lib/core/context/SxpDataSourceProvider.js +2 -2
  32. package/lib/core/hooks/useEventReport.js +5 -6
  33. package/lib/materials/sxp/popup/CommodityDetail/index.js +7 -1
  34. package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +7 -1
  35. package/package.json +1 -1
package/dist/pb-ui.js CHANGED
@@ -1078,7 +1078,7 @@
1078
1078
  }
1079
1079
  }), [bffFetch, utmVal]);
1080
1080
  const ctaEvent = React.useCallback((eventInfo, rec, product, position) => {
1081
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14;
1081
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11;
1082
1082
  const cta = product === null || product === void 0 ? void 0 : product.bindCta;
1083
1083
  const isProd = ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProduct) || (((_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.bindProducts) && ((_d = (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProducts) === null || _d === void 0 ? void 0 : _d.length) > 0);
1084
1084
  let fromKName = '';
@@ -1096,7 +1096,7 @@
1096
1096
  }
1097
1097
  const contentTags = (_p = (_m = (_h = product === null || product === void 0 ? void 0 : product.tags) !== null && _h !== void 0 ? _h : (_l = (_k = (_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.bindProducts) === null || _k === void 0 ? void 0 : _k[0]) === null || _l === void 0 ? void 0 : _l.tags) !== null && _m !== void 0 ? _m : (_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.tags) !== null && _p !== void 0 ? _p : (_q = rec === null || rec === void 0 ? void 0 : rec.product) === null || _q === void 0 ? void 0 : _q.tags;
1098
1098
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
1099
- eventInfo: Object.assign(Object.assign({}, eventInfo), { ctaId: (_r = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _r !== void 0 ? _r : '', ctaName: (_s = cta === null || cta === void 0 ? void 0 : cta.title) !== null && _s !== void 0 ? _s : '', contentTags: contentTags ? JSON.stringify(contentTags) : '', position: position + '', contentId: (_u = (_t = rec === null || rec === void 0 ? void 0 : rec.video) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '', sceneId: (_x = (_w = (_v = rec === null || rec === void 0 ? void 0 : rec.video) === null || _v === void 0 ? void 0 : _v.scene) === null || _w === void 0 ? void 0 : _w.sceneId) !== null && _x !== void 0 ? _x : '', productId: isProd ? product === null || product === void 0 ? void 0 : product.itemId : '', traceInfo: (_13 = (_10 = (_5 = (_1 = (_y = cta === null || cta === void 0 ? void 0 : cta.traceInfo) !== null && _y !== void 0 ? _y : (_0 = (_z = rec === null || rec === void 0 ? void 0 : rec.video) === null || _z === void 0 ? void 0 : _z.bindCta) === null || _0 === void 0 ? void 0 : _0.traceInfo) !== null && _1 !== void 0 ? _1 : (_4 = (_3 = (_2 = rec === null || rec === void 0 ? void 0 : rec.video) === null || _2 === void 0 ? void 0 : _2.bindProduct) === null || _3 === void 0 ? void 0 : _3.bindCta) === null || _4 === void 0 ? void 0 : _4.traceInfo) !== null && _5 !== void 0 ? _5 : (_9 = (_8 = (_7 = (_6 = rec === null || rec === void 0 ? void 0 : rec.video) === null || _6 === void 0 ? void 0 : _6.bindProducts) === null || _7 === void 0 ? void 0 : _7[0]) === null || _8 === void 0 ? void 0 : _8.bindCta) === null || _9 === void 0 ? void 0 : _9.traceInfo) !== null && _10 !== void 0 ? _10 : (_12 = (_11 = rec === null || rec === void 0 ? void 0 : rec.product) === null || _11 === void 0 ? void 0 : _11.bindCta) === null || _12 === void 0 ? void 0 : _12.traceInfo) !== null && _13 !== void 0 ? _13 : '', fromKName, fromKPage: (_14 = location === null || location === void 0 ? void 0 : location.href) !== null && _14 !== void 0 ? _14 : '', contentFormat })
1099
+ eventInfo: Object.assign(Object.assign({}, eventInfo), { ctaId: (_r = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _r !== void 0 ? _r : '', ctaName: (_s = cta === null || cta === void 0 ? void 0 : cta.title) !== null && _s !== void 0 ? _s : '', contentTags: contentTags ? JSON.stringify(contentTags) : '', position: position + '', contentId: (_u = (_t = rec === null || rec === void 0 ? void 0 : rec.video) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '', productId: isProd ? product === null || product === void 0 ? void 0 : product.itemId : '', traceInfo: (_10 = (_7 = (_2 = (_y = (_v = cta === null || cta === void 0 ? void 0 : cta.traceInfo) !== null && _v !== void 0 ? _v : (_x = (_w = rec === null || rec === void 0 ? void 0 : rec.video) === null || _w === void 0 ? void 0 : _w.bindCta) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : (_1 = (_0 = (_z = rec === null || rec === void 0 ? void 0 : rec.video) === null || _z === void 0 ? void 0 : _z.bindProduct) === null || _0 === void 0 ? void 0 : _0.bindCta) === null || _1 === void 0 ? void 0 : _1.traceInfo) !== null && _2 !== void 0 ? _2 : (_6 = (_5 = (_4 = (_3 = rec === null || rec === void 0 ? void 0 : rec.video) === null || _3 === void 0 ? void 0 : _3.bindProducts) === null || _4 === void 0 ? void 0 : _4[0]) === null || _5 === void 0 ? void 0 : _5.bindCta) === null || _6 === void 0 ? void 0 : _6.traceInfo) !== null && _7 !== void 0 ? _7 : (_9 = (_8 = rec === null || rec === void 0 ? void 0 : rec.product) === null || _8 === void 0 ? void 0 : _8.bindCta) === null || _9 === void 0 ? void 0 : _9.traceInfo) !== null && _10 !== void 0 ? _10 : '', fromKName, fromKPage: (_11 = location === null || location === void 0 ? void 0 : location.href) !== null && _11 !== void 0 ? _11 : '', contentFormat })
1100
1100
  });
1101
1101
  }, [bffEventReport, isFromHashtag]);
1102
1102
  const h5EnterLink = React.useCallback(() => {
@@ -1757,14 +1757,14 @@
1757
1757
  * @Author: binruan@chatlabs.com
1758
1758
  * @Date: 2024-03-12 10:59:06
1759
1759
  * @LastEditors: binruan@chatlabs.com
1760
- * @LastEditTime: 2025-05-09 15:30:59
1760
+ * @LastEditTime: 2024-11-28 11:17:16
1761
1761
  * @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
1762
1762
  *
1763
1763
  */
1764
1764
  function useEventReport() {
1765
1765
  const { bffEventReport, popupDetailData, isFromHashtag, eventTimeList, setEventTimeList } = useSxpDataSource();
1766
1766
  const jumpToWeb = React.useCallback((e, data, product, cta, position, traceInfo) => {
1767
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16;
1767
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13;
1768
1768
  const i = eventTimeList === null || eventTimeList === void 0 ? void 0 : eventTimeList.findIndex((item) => item.target === (e === null || e === void 0 ? void 0 : e.target));
1769
1769
  if (i !== -1) {
1770
1770
  return;
@@ -1797,11 +1797,11 @@
1797
1797
  contentFormat = 'image';
1798
1798
  }
1799
1799
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
1800
- eventInfo: Object.assign({ eventSubject: 'jumpToWeb', eventDescription: 'User jumped to website', productId: (_v = product === null || product === void 0 ? void 0 : product.itemId) !== null && _v !== void 0 ? _v : '', productName: (_w = product === null || product === void 0 ? void 0 : product.title) !== null && _w !== void 0 ? _w : '', price: (product === null || product === void 0 ? void 0 : product.price) ? (product === null || product === void 0 ? void 0 : product.price) + '' : '0', productCollection: (_x = product === null || product === void 0 ? void 0 : product.collection) !== null && _x !== void 0 ? _x : '', fromKName, fromKPage: location === null || location === void 0 ? void 0 : location.href, contentTags: contentTags ? JSON.stringify(contentTags) : '', position: position + '', contentId: (_z = (_y = data === null || data === void 0 ? void 0 : data.video) === null || _y === void 0 ? void 0 : _y.itemId) !== null && _z !== void 0 ? _z : '', sceneId: (_2 = (_1 = (_0 = data === null || data === void 0 ? void 0 : data.video) === null || _0 === void 0 ? void 0 : _0.scene) === null || _1 === void 0 ? void 0 : _1.sceneId) !== null && _2 !== void 0 ? _2 : '', ctatId: (_3 = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _3 !== void 0 ? _3 : '', traceInfo: (_16 = (_13 = (_11 = (_7 = (_4 = traceInfo !== null && traceInfo !== void 0 ? traceInfo : product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _4 !== void 0 ? _4 : (_6 = (_5 = data === null || data === void 0 ? void 0 : data.video) === null || _5 === void 0 ? void 0 : _5.bindProduct) === null || _6 === void 0 ? void 0 : _6.traceInfo) !== null && _7 !== void 0 ? _7 : (_10 = (_9 = (_8 = data === null || data === void 0 ? void 0 : data.video) === null || _8 === void 0 ? void 0 : _8.bindProducts) === null || _9 === void 0 ? void 0 : _9[0]) === null || _10 === void 0 ? void 0 : _10.traceInfo) !== null && _11 !== void 0 ? _11 : (_12 = data === null || data === void 0 ? void 0 : data.product) === null || _12 === void 0 ? void 0 : _12.traceInfo) !== null && _13 !== void 0 ? _13 : (_15 = (_14 = data === null || data === void 0 ? void 0 : data.video) === null || _14 === void 0 ? void 0 : _14.bindCta) === null || _15 === void 0 ? void 0 : _15.traceInfo) !== null && _16 !== void 0 ? _16 : '' }, (contentFormat && { contentFormat }))
1800
+ eventInfo: Object.assign({ eventSubject: 'jumpToWeb', eventDescription: 'User jumped to website', productId: (_v = product === null || product === void 0 ? void 0 : product.itemId) !== null && _v !== void 0 ? _v : '', productName: (_w = product === null || product === void 0 ? void 0 : product.title) !== null && _w !== void 0 ? _w : '', price: (product === null || product === void 0 ? void 0 : product.price) ? (product === null || product === void 0 ? void 0 : product.price) + '' : '0', productCollection: (_x = product === null || product === void 0 ? void 0 : product.collection) !== null && _x !== void 0 ? _x : '', fromKName, fromKPage: location === null || location === void 0 ? void 0 : location.href, contentTags: contentTags ? JSON.stringify(contentTags) : '', position: position + '', contentId: (_z = (_y = data === null || data === void 0 ? void 0 : data.video) === null || _y === void 0 ? void 0 : _y.itemId) !== null && _z !== void 0 ? _z : '', ctatId: (_0 = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _0 !== void 0 ? _0 : '', traceInfo: (_13 = (_10 = (_8 = (_4 = (_1 = traceInfo !== null && traceInfo !== void 0 ? traceInfo : product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _1 !== void 0 ? _1 : (_3 = (_2 = data === null || data === void 0 ? void 0 : data.video) === null || _2 === void 0 ? void 0 : _2.bindProduct) === null || _3 === void 0 ? void 0 : _3.traceInfo) !== null && _4 !== void 0 ? _4 : (_7 = (_6 = (_5 = data === null || data === void 0 ? void 0 : data.video) === null || _5 === void 0 ? void 0 : _5.bindProducts) === null || _6 === void 0 ? void 0 : _6[0]) === null || _7 === void 0 ? void 0 : _7.traceInfo) !== null && _8 !== void 0 ? _8 : (_9 = data === null || data === void 0 ? void 0 : data.product) === null || _9 === void 0 ? void 0 : _9.traceInfo) !== null && _10 !== void 0 ? _10 : (_12 = (_11 = data === null || data === void 0 ? void 0 : data.video) === null || _11 === void 0 ? void 0 : _11.bindCta) === null || _12 === void 0 ? void 0 : _12.traceInfo) !== null && _13 !== void 0 ? _13 : '' }, (contentFormat && { contentFormat }))
1801
1801
  });
1802
1802
  }, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
1803
1803
  const productView = React.useCallback((data, product, cta, viewTime, position) => {
1804
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
1804
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
1805
1805
  let fromKName = '';
1806
1806
  if (popupDetailData && (((_b = (_a = data === null || data === void 0 ? void 0 : data.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) || ((_c = data === null || data === void 0 ? void 0 : data.video) === null || _c === void 0 ? void 0 : _c.bindProduct))) {
1807
1807
  fromKName = 'pdpPage';
@@ -1820,9 +1820,8 @@
1820
1820
  contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags),
1821
1821
  position: position + '',
1822
1822
  contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId,
1823
- sceneId: (_g = (_f = (_e = data === null || data === void 0 ? void 0 : data.video) === null || _e === void 0 ? void 0 : _e.scene) === null || _f === void 0 ? void 0 : _f.sceneId) !== null && _g !== void 0 ? _g : '',
1824
1823
  ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
1825
- traceInfo: (_s = (_q = (_l = (_h = product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _h !== void 0 ? _h : (_k = (_j = data === null || data === void 0 ? void 0 : data.video) === null || _j === void 0 ? void 0 : _j.bindProduct) === null || _k === void 0 ? void 0 : _k.traceInfo) !== null && _l !== void 0 ? _l : (_p = (_o = (_m = data === null || data === void 0 ? void 0 : data.video) === null || _m === void 0 ? void 0 : _m.bindProducts) === null || _o === void 0 ? void 0 : _o[0]) === null || _p === void 0 ? void 0 : _p.traceInfo) !== null && _q !== void 0 ? _q : (_r = data === null || data === void 0 ? void 0 : data.product) === null || _r === void 0 ? void 0 : _r.traceInfo) !== null && _s !== void 0 ? _s : '',
1824
+ traceInfo: (_p = (_m = (_h = (_e = product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _e !== void 0 ? _e : (_g = (_f = data === null || data === void 0 ? void 0 : data.video) === null || _f === void 0 ? void 0 : _f.bindProduct) === null || _g === void 0 ? void 0 : _g.traceInfo) !== null && _h !== void 0 ? _h : (_l = (_k = (_j = data === null || data === void 0 ? void 0 : data.video) === null || _j === void 0 ? void 0 : _j.bindProducts) === null || _k === void 0 ? void 0 : _k[0]) === null || _l === void 0 ? void 0 : _l.traceInfo) !== null && _m !== void 0 ? _m : (_o = data === null || data === void 0 ? void 0 : data.product) === null || _o === void 0 ? void 0 : _o.traceInfo) !== null && _p !== void 0 ? _p : '',
1826
1825
  timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
1827
1826
  eventSubject: 'productView',
1828
1827
  eventDescription: 'User browsed the product'
@@ -10374,7 +10373,7 @@
10374
10373
  const CommodityDetail$1 = (_a) => {
10375
10374
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
10376
10375
  var { content, style, bgImg, onClick, schema, isDefault, bottom_image, tipText, isPost, viewTime, rec, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, isTel, iframeBgColor, isActive = true } = _a, props = __rest(_a, ["content", "style", "bgImg", "onClick", "schema", "isDefault", "bottom_image", "tipText", "isPost", "viewTime", "rec", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "isTel", "iframeBgColor", "isActive"]);
10377
- const { sxpParameter, popupDetailData, isPreview, bffFbReport, popupCurTimeRef, checkCommodityIndexRef, globalConfig } = useSxpDataSource();
10376
+ const { sxpParameter, popupDetailData, isPreview, bffFbReport, popupCurTimeRef, checkCommodityIndexRef, globalConfig, ctaEvent } = useSxpDataSource();
10378
10377
  const { jumpToWeb, productView } = useEventReport();
10379
10378
  const curTimeRef = React.useRef(null);
10380
10379
  const [showModal, setShowModal] = React.useState(false);
@@ -10400,6 +10399,12 @@
10400
10399
  if (!isPost) {
10401
10400
  productView(data, product, cta, viewTime || curTimeRef.current, position);
10402
10401
  }
10402
+ else {
10403
+ ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
10404
+ eventSubject: 'clickCta',
10405
+ eventDescription: 'User clicked the CTA'
10406
+ }, data, product, position);
10407
+ }
10403
10408
  window.location.href = window.getJointUtmLink(product.link);
10404
10409
  }
10405
10410
  };
@@ -11302,7 +11307,7 @@
11302
11307
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4;
11303
11308
  var { style, isDefault, rec, viewTime, isPost, bottom_image, tipText, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, isTel, iframeBgColor, isActive = true } = _a, props = __rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "tipText", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "isTel", "iframeBgColor", "isActive"]);
11304
11309
  React.useState(true);
11305
- const { sxpParameter, popupCurTimeRef, popupDetailData, isPreview, bffFbReport, checkCommodityIndexRef, globalConfig } = useSxpDataSource();
11310
+ const { sxpParameter, popupCurTimeRef, popupDetailData, isPreview, bffFbReport, checkCommodityIndexRef, globalConfig, ctaEvent } = useSxpDataSource();
11306
11311
  const { jumpToWeb, productView } = useEventReport();
11307
11312
  React.useState(false);
11308
11313
  React.useState(false);
@@ -11331,6 +11336,12 @@
11331
11336
  if (!isPost) {
11332
11337
  productView(data, product, cta, viewTime || curTimeRef.current, position);
11333
11338
  }
11339
+ else {
11340
+ ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
11341
+ eventSubject: 'clickCta',
11342
+ eventDescription: 'User clicked the CTA'
11343
+ }, data, product, position);
11344
+ }
11334
11345
  window.location.href = window.getJointUtmLink(product.link);
11335
11346
  }
11336
11347
  };
@@ -15625,7 +15636,7 @@ Made in Italy` })));
15625
15636
  * @Author: binruan@chatlabs.com
15626
15637
  * @Date: 2024-01-10 10:58:24
15627
15638
  * @LastEditors: binruan@chatlabs.com
15628
- * @LastEditTime: 2025-05-09 15:30:41
15639
+ * @LastEditTime: 2025-02-28 10:00:31
15629
15640
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\WaterFall\index.tsx
15630
15641
  *
15631
15642
  */
@@ -15663,7 +15674,7 @@ Made in Italy` })));
15663
15674
  }
15664
15675
  }, [waterFallData]);
15665
15676
  const reportTagsView = React.useCallback(() => {
15666
- var _a, _b, _c, _d, _e, _f, _g, _h, _j;
15677
+ var _a, _b, _c, _d, _e, _f;
15667
15678
  const rec = recData === null || recData === void 0 ? void 0 : recData.rec;
15668
15679
  if (!rec)
15669
15680
  return;
@@ -15683,10 +15694,9 @@ Made in Italy` })));
15683
15694
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
15684
15695
  eventInfo: {
15685
15696
  contentId: (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.itemId,
15686
- sceneId: (_g = (_f = (_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.scene) === null || _f === void 0 ? void 0 : _f.sceneId) !== null && _g !== void 0 ? _g : '',
15687
15697
  position: cacheActiveIndex + '',
15688
- contentTags: JSON.stringify((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.tags),
15689
- traceInfo: (_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.traceInfo,
15698
+ contentTags: JSON.stringify((_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.tags),
15699
+ traceInfo: (_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.traceInfo,
15690
15700
  hashTags: JSON.stringify([recData === null || recData === void 0 ? void 0 : recData.hashTag]),
15691
15701
  fromKName,
15692
15702
  fromKPage: location === null || location === void 0 ? void 0 : location.href,
@@ -17768,7 +17778,7 @@ Made in Italy` })));
17768
17778
  const likeIcon = useIconLink(defaultLikeIconPath$2);
17769
17779
  const unlikeIcon = useIconLink(defaultUnLikeIconPath$2);
17770
17780
  const handleClick = lodash.debounce(() => __awaiter(void 0, void 0, void 0, function* () {
17771
- var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5;
17781
+ var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
17772
17782
  if (state) {
17773
17783
  // 先设置状态
17774
17784
  setState(false);
@@ -17778,12 +17788,11 @@ Made in Italy` })));
17778
17788
  eventSubject: 'favoriteContentCanceled',
17779
17789
  eventDescription: 'This content was unfavorite by the user',
17780
17790
  contentId: (_g = (_f = recData === null || recData === void 0 ? void 0 : recData.video) === null || _f === void 0 ? void 0 : _f.itemId) !== null && _g !== void 0 ? _g : '',
17781
- sceneId: (_k = (_j = (_h = recData === null || recData === void 0 ? void 0 : recData.video) === null || _h === void 0 ? void 0 : _h.scene) === null || _j === void 0 ? void 0 : _j.sceneId) !== null && _k !== void 0 ? _k : '',
17782
- contentName: (_m = (_l = recData === null || recData === void 0 ? void 0 : recData.video) === null || _l === void 0 ? void 0 : _l.title) !== null && _m !== void 0 ? _m : '',
17783
- contentTags: JSON.stringify((_p = (_o = recData === null || recData === void 0 ? void 0 : recData.video) === null || _o === void 0 ? void 0 : _o.tags) !== null && _p !== void 0 ? _p : []),
17791
+ contentName: (_j = (_h = recData === null || recData === void 0 ? void 0 : recData.video) === null || _h === void 0 ? void 0 : _h.title) !== null && _j !== void 0 ? _j : '',
17792
+ contentTags: JSON.stringify((_l = (_k = recData === null || recData === void 0 ? void 0 : recData.video) === null || _k === void 0 ? void 0 : _k.tags) !== null && _l !== void 0 ? _l : []),
17784
17793
  position: position + '',
17785
- contentFormat: ((_q = recData === null || recData === void 0 ? void 0 : recData.video) === null || _q === void 0 ? void 0 : _q.url) ? 'video' : 'image',
17786
- traceInfo: (_r = recData === null || recData === void 0 ? void 0 : recData.video) === null || _r === void 0 ? void 0 : _r.traceInfo
17794
+ contentFormat: ((_m = recData === null || recData === void 0 ? void 0 : recData.video) === null || _m === void 0 ? void 0 : _m.url) ? 'video' : 'image',
17795
+ traceInfo: (_o = recData === null || recData === void 0 ? void 0 : recData.video) === null || _o === void 0 ? void 0 : _o.traceInfo
17787
17796
  }
17788
17797
  });
17789
17798
  // 如果接口调用失败，则回滚状态
@@ -17791,41 +17800,40 @@ Made in Italy` })));
17791
17800
  setState(true);
17792
17801
  }
17793
17802
  else {
17794
- const nRtcList = (_s = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
17803
+ const nRtcList = (_p = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
17795
17804
  if (index === position) {
17796
17805
  item.isCollected = false;
17797
17806
  }
17798
17807
  return item;
17799
- })) !== null && _s !== void 0 ? _s : [];
17808
+ })) !== null && _p !== void 0 ? _p : [];
17800
17809
  setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
17801
17810
  }
17802
17811
  }
17803
17812
  else {
17804
17813
  setState(true);
17805
- const result = (_t = (yield (mutateLike === null || mutateLike === void 0 ? void 0 : mutateLike({ content: JSON.stringify(recData) })))) !== null && _t !== void 0 ? _t : false;
17814
+ const result = (_q = (yield (mutateLike === null || mutateLike === void 0 ? void 0 : mutateLike({ content: JSON.stringify(recData) })))) !== null && _q !== void 0 ? _q : false;
17806
17815
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
17807
17816
  eventInfo: {
17808
17817
  eventSubject: 'favoriteContent',
17809
17818
  eventDescription: 'This content was favorite by the user',
17810
- contentId: (_v = (_u = recData === null || recData === void 0 ? void 0 : recData.video) === null || _u === void 0 ? void 0 : _u.itemId) !== null && _v !== void 0 ? _v : '',
17811
- sceneId: (_y = (_x = (_w = recData === null || recData === void 0 ? void 0 : recData.video) === null || _w === void 0 ? void 0 : _w.scene) === null || _x === void 0 ? void 0 : _x.sceneId) !== null && _y !== void 0 ? _y : '',
17812
- contentName: (_0 = (_z = recData === null || recData === void 0 ? void 0 : recData.video) === null || _z === void 0 ? void 0 : _z.title) !== null && _0 !== void 0 ? _0 : '',
17813
- contentTags: JSON.stringify((_2 = (_1 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _1 === void 0 ? void 0 : _1.tags) !== null && _2 !== void 0 ? _2 : []),
17819
+ contentId: (_s = (_r = recData === null || recData === void 0 ? void 0 : recData.video) === null || _r === void 0 ? void 0 : _r.itemId) !== null && _s !== void 0 ? _s : '',
17820
+ contentName: (_u = (_t = recData === null || recData === void 0 ? void 0 : recData.video) === null || _t === void 0 ? void 0 : _t.title) !== null && _u !== void 0 ? _u : '',
17821
+ contentTags: JSON.stringify((_w = (_v = recData === null || recData === void 0 ? void 0 : recData.video) === null || _v === void 0 ? void 0 : _v.tags) !== null && _w !== void 0 ? _w : []),
17814
17822
  position: position + '',
17815
- contentFormat: ((_3 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _3 === void 0 ? void 0 : _3.url) ? 'video' : 'image',
17816
- traceInfo: (_4 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _4 === void 0 ? void 0 : _4.traceInfo
17823
+ contentFormat: ((_x = recData === null || recData === void 0 ? void 0 : recData.video) === null || _x === void 0 ? void 0 : _x.url) ? 'video' : 'image',
17824
+ traceInfo: (_y = recData === null || recData === void 0 ? void 0 : recData.video) === null || _y === void 0 ? void 0 : _y.traceInfo
17817
17825
  }
17818
17826
  });
17819
17827
  if (!result) {
17820
17828
  setState(false);
17821
17829
  }
17822
17830
  else {
17823
- const nRtcList = (_5 = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
17831
+ const nRtcList = (_z = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
17824
17832
  if (index === position) {
17825
17833
  item.isCollected = true;
17826
17834
  }
17827
17835
  return item;
17828
- })) !== null && _5 !== void 0 ? _5 : [];
17836
+ })) !== null && _z !== void 0 ? _z : [];
17829
17837
  setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
17830
17838
  }
17831
17839
  }
@@ -17928,26 +17936,6 @@ Made in Italy` })));
17928
17936
  return;
17929
17937
  (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
17930
17938
  }, [videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
17931
- const handleEnd = () => {
17932
- var _a, _b, _c, _d, _e, _f, _g, _h;
17933
- if (!videoRef.current)
17934
- return;
17935
- if (isDiyH5) {
17936
- (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
17937
- if (!loopPlayRef.current)
17938
- return;
17939
- if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
17940
- (_c = (_b = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _b === void 0 ? void 0 : _b.swiper) === null || _c === void 0 ? void 0 : _c.slideTo(0);
17941
- }
17942
- else {
17943
- const i = (_e = (_d = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _d === void 0 ? void 0 : _d.swiper) === null || _e === void 0 ? void 0 : _e.activeIndex;
17944
- (_g = (_f = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _f === void 0 ? void 0 : _f.swiper) === null || _g === void 0 ? void 0 : _g.slideTo(i + 1);
17945
- }
17946
- }
17947
- else {
17948
- (_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.play();
17949
- }
17950
- };
17951
17939
  const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
17952
17940
  const handlePlaying = React.useCallback(() => {
17953
17941
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
@@ -17956,7 +17944,7 @@ Made in Italy` })));
17956
17944
  setIsLoadFinish(true);
17957
17945
  }, []);
17958
17946
  const handleStartPlay = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
17959
- var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
17947
+ var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
17960
17948
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
17961
17949
  return;
17962
17950
  setIsPauseVideo(false);
@@ -17967,11 +17955,16 @@ Made in Italy` })));
17967
17955
  const videoCurrentTime = ((_h = (_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.currentTime) !== null && _h !== void 0 ? _h : 0).toFixed(2);
17968
17956
  const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
17969
17957
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
17970
- eventInfo: Object.assign({ eventSubject: 'playVideo', eventDescription: 'User played the video', contentId: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.itemId) !== null && _k !== void 0 ? _k : '', sceneId: (_o = (_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.scene) === null || _m === void 0 ? void 0 : _m.sceneId) !== null && _o !== void 0 ? _o : '', contentName: (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.title) !== null && _q !== void 0 ? _q : '', playType, startTime: videoCurrentTime, videoDuration, contentTags: JSON.stringify((_s = (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.tags) !== null && _s !== void 0 ? _s : []), position: index + '', contentFormat: 'video', traceInfo: (_t = item === null || item === void 0 ? void 0 : item.video) === null || _t === void 0 ? void 0 : _t.traceInfo }, ((isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) && { loadTime: (loadedTimeRef === null || loadedTimeRef === void 0 ? void 0 : loadedTimeRef.current) - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current) + '' }))
17958
+ eventInfo: Object.assign({ eventSubject: 'playVideo', eventDescription: 'User played the video', contentId: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.itemId) !== null && _k !== void 0 ? _k : '', contentName: (_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.title) !== null && _m !== void 0 ? _m : '', playType, startTime: videoCurrentTime, videoDuration, contentTags: JSON.stringify((_p = (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.tags) !== null && _p !== void 0 ? _p : []), position: index + '', contentFormat: 'video', traceInfo: (_q = item === null || item === void 0 ? void 0 : item.video) === null || _q === void 0 ? void 0 : _q.traceInfo }, ((isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) && { loadTime: (loadedTimeRef === null || loadedTimeRef === void 0 ? void 0 : loadedTimeRef.current) - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current) + '' }))
17971
17959
  });
17972
17960
  isFirstPlayRef.current = false;
17973
17961
  }
17974
17962
  }), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
17963
+ const setCurrentTimeByStartTime = React.useCallback(() => {
17964
+ if (isDiyH5) {
17965
+ videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
17966
+ }
17967
+ }, []);
17975
17968
  const handLoadeddata = React.useCallback(() => {
17976
17969
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
17977
17970
  return;
@@ -17996,12 +17989,13 @@ Made in Italy` })));
17996
17989
  const handleLoadedmetadata = React.useCallback(() => {
17997
17990
  if (!videoRef.current)
17998
17991
  return;
17992
+ setCurrentTimeByStartTime();
17999
17993
  loadedTimeRef.current = new Date();
18000
17994
  handleStartPlay();
18001
17995
  handLoadeddata();
18002
17996
  }, [videoRef.current, handLoadeddata, handleStartPlay]);
18003
17997
  const handleClickVideo = React.useCallback((type) => () => {
18004
- var _a, _b, _c, _d, _e;
17998
+ var _a, _b, _c, _d, _e, _f;
18005
17999
  if (!videoRef.current)
18006
18000
  return;
18007
18001
  if (!isLoadFinish)
@@ -18022,17 +18016,20 @@ Made in Italy` })));
18022
18016
  break;
18023
18017
  default:
18024
18018
  if (isPause) {
18025
- (_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.play();
18019
+ if (isDiyH5 && Math.round((_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.currentTime) >= (scene === null || scene === void 0 ? void 0 : scene.endTime)) {
18020
+ videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
18021
+ }
18022
+ (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
18026
18023
  }
18027
18024
  else {
18028
- (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.pause();
18025
+ (_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.pause();
18029
18026
  }
18030
18027
  setIsPauseVideo(!isPause);
18031
18028
  break;
18032
18029
  }
18033
18030
  }, [isLoadFinish, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
18034
18031
  const handlePause = React.useCallback(() => {
18035
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
18032
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
18036
18033
  if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
18037
18034
  return;
18038
18035
  if (activeIndex !== index)
@@ -18048,15 +18045,14 @@ Made in Italy` })));
18048
18045
  eventSubject: 'playOverVideo',
18049
18046
  eventDescription: 'User finished playing the video',
18050
18047
  contentId: (_h = (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.itemId) !== null && _h !== void 0 ? _h : '',
18051
- sceneId: (_l = (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.scene) === null || _k === void 0 ? void 0 : _k.sceneId) !== null && _l !== void 0 ? _l : '',
18052
- contentName: (_o = (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.title) !== null && _o !== void 0 ? _o : '',
18048
+ contentName: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.title) !== null && _k !== void 0 ? _k : '',
18053
18049
  endTime: videoCurrentTime,
18054
18050
  videoDuration,
18055
18051
  playDuration,
18056
- contentTags: JSON.stringify((_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []),
18052
+ contentTags: JSON.stringify((_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.tags) !== null && _m !== void 0 ? _m : []),
18057
18053
  position: index + '',
18058
18054
  contentFormat: 'video',
18059
- traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
18055
+ traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
18060
18056
  }
18061
18057
  });
18062
18058
  }
@@ -18064,8 +18060,27 @@ Made in Italy` })));
18064
18060
  const handleWaiting = React.useCallback(() => {
18065
18061
  setWaiting(true);
18066
18062
  }, []);
18063
+ const handleTimeUpload = () => {
18064
+ if (!videoRef.current || !isDiyH5)
18065
+ return;
18066
+ setTimeout(() => {
18067
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j;
18068
+ if (Math.round((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.currentTime) >= ((_b = scene === null || scene === void 0 ? void 0 : scene.endTime) !== null && _b !== void 0 ? _b : 0)) {
18069
+ (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
18070
+ if (!loopPlayRef.current)
18071
+ return;
18072
+ if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
18073
+ (_e = (_d = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _d === void 0 ? void 0 : _d.swiper) === null || _e === void 0 ? void 0 : _e.slideTo(0);
18074
+ }
18075
+ else {
18076
+ const i = (_g = (_f = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _f === void 0 ? void 0 : _f.swiper) === null || _g === void 0 ? void 0 : _g.activeIndex;
18077
+ (_j = (_h = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _h === void 0 ? void 0 : _h.swiper) === null || _j === void 0 ? void 0 : _j.slideTo(i + 1);
18078
+ }
18079
+ }
18080
+ });
18081
+ };
18067
18082
  React.useEffect(() => {
18068
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
18083
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
18069
18084
  if (!isActive)
18070
18085
  return;
18071
18086
  const videoSrc = videoUrl;
@@ -18086,6 +18101,7 @@ Made in Italy` })));
18086
18101
  hls === null || hls === void 0 ? void 0 : hls.attachMedia(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current);
18087
18102
  hls === null || hls === void 0 ? void 0 : hls.on(Hls.Events.MANIFEST_PARSED, function () {
18088
18103
  var _a;
18104
+ setCurrentTimeByStartTime();
18089
18105
  (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
18090
18106
  });
18091
18107
  }
@@ -18099,11 +18115,12 @@ Made in Italy` })));
18099
18115
  (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.addEventListener('play', handleStartPlay);
18100
18116
  (_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.addEventListener('playing', handlePlaying);
18101
18117
  (_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.addEventListener('pause', handlePause);
18102
- (_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handleEnd);
18118
+ (_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handlePlay);
18103
18119
  (_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.addEventListener('canplay', handlePlay);
18104
18120
  (_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
18121
+ (_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.addEventListener('timeupdate', handleTimeUpload);
18105
18122
  return () => {
18106
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
18123
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
18107
18124
  const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
18108
18125
  if (!isPause)
18109
18126
  handlePause();
@@ -18115,9 +18132,10 @@ Made in Italy` })));
18115
18132
  (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.removeEventListener('play', handleStartPlay);
18116
18133
  (_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.removeEventListener('playing', handlePlaying);
18117
18134
  (_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.removeEventListener('pause', handlePause);
18118
- (_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handleEnd);
18135
+ (_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handlePlay);
18119
18136
  (_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('canplay', handlePlay);
18120
18137
  (_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.removeEventListener('waiting', handleWaiting);
18138
+ (_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.removeEventListener('timeupdate', handleTimeUpload);
18121
18139
  };
18122
18140
  }, [isActive]);
18123
18141
  React.useEffect(() => {
@@ -18328,48 +18346,19 @@ Made in Italy` })));
18328
18346
  }, onLoad: onShowFirstImage }))));
18329
18347
  };
18330
18348
 
18331
- const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig, swiperRef }, ref) => {
18349
+ const PictureGroup$4 = ({ imgUrls, width, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig }) => {
18332
18350
  var _a, _b;
18333
18351
  const { isActive } = useSwiperSlide();
18334
- const { sxpParameter, openHashtag, isDiyH5 } = useSxpDataSource();
18352
+ const { sxpParameter, openHashtag } = useSxpDataSource();
18335
18353
  const [isLoad, setIsLoad] = React.useState(false);
18336
18354
  const [imgInfo, setImgInfo] = React.useState();
18337
18355
  const [swiperActiveIndex, setSwiperActiveIndex] = React.useState(0);
18338
- const imgsSwiperRef = React.useRef();
18356
+ const swiperRef = React.useRef();
18339
18357
  const isFirstPlayRef = React.useRef(true);
18340
- const loopPlayRef = React.useRef(true);
18341
18358
  const initTime = new Date();
18342
- React.useImperativeHandle(ref, () => {
18343
- return {
18344
- setLoopPlay(v) {
18345
- loopPlayRef.current = v;
18346
- }
18347
- };
18348
- });
18349
- React.useEffect(() => {
18350
- let timerId;
18351
- if (isLoad && isActive && isDiyH5) {
18352
- timerId = setTimeout(() => {
18353
- var _a, _b, _c, _d, _e, _f;
18354
- if (!loopPlayRef.current)
18355
- return;
18356
- if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
18357
- (_b = (_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper) === null || _b === void 0 ? void 0 : _b.slideTo(0);
18358
- }
18359
- else {
18360
- const i = (_d = (_c = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _c === void 0 ? void 0 : _c.swiper) === null || _d === void 0 ? void 0 : _d.activeIndex;
18361
- (_f = (_e = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _e === void 0 ? void 0 : _e.swiper) === null || _f === void 0 ? void 0 : _f.slideTo(i + 1);
18362
- }
18363
- }, 3000);
18364
- }
18365
- return () => {
18366
- if (timerId)
18367
- clearTimeout(timerId);
18368
- };
18369
- }, [isLoad, isActive, isDiyH5, data, index, swiperRef]);
18370
18359
  React.useEffect(() => {
18371
18360
  if (isLoad && isActive) {
18372
- (imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.start();
18361
+ (swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) && swiperRef.current.swiper.autoplay.start();
18373
18362
  if (openHashtag) {
18374
18363
  onViewImageEndEvent(rec);
18375
18364
  }
@@ -18379,7 +18368,7 @@ Made in Italy` })));
18379
18368
  }
18380
18369
  }
18381
18370
  else {
18382
- (imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.stop();
18371
+ (swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) && swiperRef.current.swiper.autoplay.stop();
18383
18372
  }
18384
18373
  }, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
18385
18374
  const showFirstImageFn = React.useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
@@ -18406,13 +18395,13 @@ Made in Italy` })));
18406
18395
  };
18407
18396
  }, [isActive, imgInfo]);
18408
18397
  const handleMouseEnter = React.useCallback(() => {
18409
- if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
18410
- imgsSwiperRef.current.swiper.autoplay.stop();
18398
+ if (swiperRef.current && swiperRef.current.swiper && isAlly) {
18399
+ swiperRef.current.swiper.autoplay.stop();
18411
18400
  }
18412
18401
  }, []);
18413
18402
  const handleMouseLeave = React.useCallback(() => {
18414
- if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
18415
- imgsSwiperRef.current.swiper.autoplay.start();
18403
+ if (swiperRef.current && swiperRef.current.swiper && isAlly) {
18404
+ swiperRef.current.swiper.autoplay.start();
18416
18405
  }
18417
18406
  }, []);
18418
18407
  const handleSlideChange = React.useCallback((swiper) => {
@@ -18433,7 +18422,7 @@ Made in Italy` })));
18433
18422
  enabled: true
18434
18423
  }
18435
18424
  }
18436
- : {}), { loop: true, ref: imgsSwiperRef, onSlideChange: handleSlideChange, className: css.css(Object.assign(Object.assign({ '.swiper-pagination': {
18425
+ : {}), { loop: true, ref: swiperRef, onSlideChange: handleSlideChange, className: css.css(Object.assign(Object.assign({ '.swiper-pagination': {
18437
18426
  bottom: (_a = imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.marginBottom) !== null && _a !== void 0 ? _a : 0,
18438
18427
  fontSize: '14px'
18439
18428
  } }, ((imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.dotsBgColor) && {
@@ -18450,7 +18439,7 @@ Made in Italy` })));
18450
18439
  return (React.createElement(SwiperSlide, { key: srcKey, "aria-hidden": srcKey !== swiperActiveIndex },
18451
18440
  React.createElement(Picture, { src: !isLoad && srcKey > 0 ? '' : url, height: height, imgUrlsPostConfig: imgUrlsPostConfig, onShowFirstImage: showFirstImageFn })));
18452
18441
  }))));
18453
- });
18442
+ };
18454
18443
  var PictureGroup$5 = React.memo(PictureGroup$4);
18455
18444
 
18456
18445
  /*
@@ -18730,7 +18719,7 @@ Made in Italy` })));
18730
18719
  * @Author: binruan@chatlabs.com
18731
18720
  * @Date: 2024-03-20 10:27:31
18732
18721
  * @LastEditors: binruan@chatlabs.com
18733
- * @LastEditTime: 2025-05-12 14:26:15
18722
+ * @LastEditTime: 2025-05-09 15:51:40
18734
18723
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
18735
18724
  *
18736
18725
  */
@@ -18750,7 +18739,6 @@ Made in Italy` })));
18750
18739
  const skipLinkRef = React.useRef(false);
18751
18740
  const [pageNum, setPageNum] = React.useState(2);
18752
18741
  const videoWidgetRef = React.useRef(null);
18753
- const pictureGroupRef = React.useRef(null);
18754
18742
  const { loadVideos, bffEventReport, loading, setPopupDetailData, ctaEvent, swiperRef, waterFallData, setOpenHashtag, appDomain, openHashtag, loadingImage, isFromHashtag, popupDetailData, bffFbReport, curTime, h5EnterLink, isShowConsent, selectTag, isPreview, isEditor, cacheRtcList, setRtcList, cacheActiveIndex, rtcList, isNoMoreData, channel, refreshFeSession, isDiyH5 } = useSxpDataSource();
18755
18743
  const { backMainFeed, productView, jumpToWeb } = useEventReport();
18756
18744
  const isShowFingerTip = React.useMemo(() => {
@@ -18798,7 +18786,7 @@ Made in Italy` })));
18798
18786
  (_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
18799
18787
  }, [data, ctaType, swiperRef]);
18800
18788
  const handleSessionCompleted = React.useCallback((fk) => {
18801
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
18789
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
18802
18790
  const item = data === null || data === void 0 ? void 0 : data[activeIndex];
18803
18791
  let fromKName = '';
18804
18792
  if (popupDetailData && (((_b = (_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) || ((_c = item === null || item === void 0 ? void 0 : item.video) === null || _c === void 0 ? void 0 : _c.bindProduct))) {
@@ -18825,13 +18813,12 @@ Made in Italy` })));
18825
18813
  eventSubject: 'sessionCompleted',
18826
18814
  eventDescription: 'Session completed',
18827
18815
  contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
18828
- sceneId: (_q = (_p = (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.scene) === null || _p === void 0 ? void 0 : _p.sceneId) !== null && _q !== void 0 ? _q : '',
18829
- productId: (_r = item === null || item === void 0 ? void 0 : item.product) === null || _r === void 0 ? void 0 : _r.itemId,
18816
+ productId: (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.itemId,
18830
18817
  position: activeIndex + '',
18831
18818
  fromKName: fk || fromKName,
18832
18819
  fromKPage: location === null || location === void 0 ? void 0 : location.href,
18833
- ctatId: (_u = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.bindCta) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '',
18834
- traceInfo: (_y = (_w = (_v = item === null || item === void 0 ? void 0 : item.video) === null || _v === void 0 ? void 0 : _v.traceInfo) !== null && _w !== void 0 ? _w : (_x = item === null || item === void 0 ? void 0 : item.product) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : ''
18820
+ ctatId: (_r = (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.bindCta) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
18821
+ traceInfo: (_v = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_u = item === null || item === void 0 ? void 0 : item.product) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : ''
18835
18822
  }
18836
18823
  });
18837
18824
  }, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime]);
@@ -18890,9 +18877,8 @@ Made in Italy` })));
18890
18877
  refreshFeSession
18891
18878
  ]);
18892
18879
  const handleSessionExpire = React.useCallback(lodash.debounce(() => {
18893
- var _a, _b;
18880
+ var _a;
18894
18881
  (_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
18895
- (_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
18896
18882
  refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
18897
18883
  }, 1000), [handleSessionCompleted, refreshFeSession]);
18898
18884
  React.useEffect(() => {
@@ -18962,18 +18948,18 @@ Made in Italy` })));
18962
18948
  return null;
18963
18949
  }, [globalConfig, activeIndex, visList]);
18964
18950
  const renderContent = React.useCallback((rec, index) => {
18965
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
18951
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
18966
18952
  if (rec === 'organic menu') {
18967
18953
  return (React.createElement(MultiPosts$2, Object.assign({ recData: data === null || data === void 0 ? void 0 : data[1] }, (_c = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item) === null || _c === void 0 ? void 0 : _c.props, (_f = (_e = (_d = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.multiPosts) === null || _d === void 0 ? void 0 : _d[0]) === null || _e === void 0 ? void 0 : _e.item) === null || _f === void 0 ? void 0 : _f.event)));
18968
18954
  }
18969
- if (((_h = (_g = rec.video) === null || _g === void 0 ? void 0 : _g.scene) === null || _h === void 0 ? void 0 : _h.mediaUrl) || ((_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.url)) {
18955
+ if ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.url) {
18970
18956
  return (React.createElement(VideoWidget$5, Object.assign({ key: isReload }, (activeIndex === index && { ref: videoWidgetRef }), { rec: rec, index: index, muted: isMuted, data: data, height: height, activeIndex: activeIndex, videoPostConfig: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.videoPost, videoPlayIcon: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.videoPlayIcon, loopPlay: true, swiperRef: swiperRef })));
18971
18957
  }
18972
- if ((_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.imgUrls) {
18973
- return (React.createElement(PictureGroup$5, Object.assign({ data: data }, (activeIndex === index && { ref: pictureGroupRef }), { key: rec === null || rec === void 0 ? void 0 : rec.video.itemId, imgUrls: rec === null || rec === void 0 ? void 0 : rec.video.imgUrls, width: containerWidth, height: height, rec: rec, index: index, onViewImageEndEvent: handleViewImageStartEnd, onViewImageStartEvent: handleViewImageStartEvent, imgUrlsPostConfig: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.imgUrlsPost, swiperRef: swiperRef })));
18958
+ if ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.imgUrls) {
18959
+ return (React.createElement(PictureGroup$5, { key: rec === null || rec === void 0 ? void 0 : rec.video.itemId, imgUrls: rec === null || rec === void 0 ? void 0 : rec.video.imgUrls, width: containerWidth, height: height, rec: rec, index: index, onViewImageEndEvent: handleViewImageStartEnd, onViewImageStartEvent: handleViewImageStartEvent, imgUrlsPostConfig: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.imgUrlsPost }));
18974
18960
  }
18975
- if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((_l = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _l === void 0 ? void 0 : _l.length) > 0) {
18976
- return (_m = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _m === void 0 ? void 0 : _m.map((value, idx) => {
18961
+ if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _j === void 0 ? void 0 : _j.length) > 0) {
18962
+ return (_k = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _k === void 0 ? void 0 : _k.map((value, idx) => {
18977
18963
  var _a, _b, _c, _d, _e, _f, _g, _h;
18978
18964
  const t = resolver[(_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type];
18979
18965
  const Component = withBindDataSource(t);
@@ -19011,7 +18997,7 @@ Made in Italy` })));
19011
18997
  };
19012
18998
  }, [isShowMore]);
19013
18999
  const renderBottom = React.useCallback((rec, index) => {
19014
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
19000
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
19015
19001
  if (rec === null || rec === void 0 ? void 0 : rec.video) {
19016
19002
  let cta = null;
19017
19003
  if ((_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) {
@@ -19020,27 +19006,24 @@ Made in Italy` })));
19020
19006
  else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
19021
19007
  cta = '商品CTA';
19022
19008
  }
19023
- else if (tempMap && ((_d = Object.keys(tempMap)) === null || _d === void 0 ? void 0 : _d.includes('服务CTA')) && ((_f = (_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.bindCta) === null || _f === void 0 ? void 0 : _f.itemId)) {
19024
- cta = '服务CTA';
19025
- }
19026
19009
  else {
19027
- cta = (_h = (_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.bindCta) === null || _h === void 0 ? void 0 : _h.itemId;
19010
+ cta = (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
19028
19011
  }
19029
19012
  const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
19030
19013
  const isNineProduct = (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nineProductEnable) &&
19031
19014
  index === ((rtcList === null || rtcList === void 0 ? void 0 : rtcList[0]) === 'organic menu' ? 2 : 1) &&
19032
- ((_j = ['MultiCommodity', 'MultiCommodityDiro', 'MultiCommodityDiroNew']) === null || _j === void 0 ? void 0 : _j.includes((_k = value === null || value === void 0 ? void 0 : value.item) === null || _k === void 0 ? void 0 : _k.type));
19015
+ ((_f = ['MultiCommodity', 'MultiCommodityDiro', 'MultiCommodityDiroNew']) === null || _f === void 0 ? void 0 : _f.includes((_g = value === null || value === void 0 ? void 0 : value.item) === null || _g === void 0 ? void 0 : _g.type));
19033
19016
  return (React.createElement(React.Fragment, null,
19034
19017
  isNineProduct && (React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value, isNineProduct: isNineProduct })),
19035
- ((_l = rec === null || rec === void 0 ? void 0 : rec.video) === null || _l === void 0 ? void 0 : _l.title) && !isShowMore && React.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
19036
- React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(_m = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.bottomInfoDist) !== null && _m !== void 0 ? _m : 40}px` } },
19018
+ ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.title) && !isShowMore && React.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
19019
+ React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.bottomInfoDist) !== null && _j !== void 0 ? _j : 40}px` } },
19037
19020
  React.createElement(Nudge, { nudge: nudge }),
19038
19021
  ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) === undefined || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA)) && !isNineProduct ? (React.createElement("div", { className: 'clc-sxp-bottom-card' },
19039
19022
  React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
19040
19023
  React.createElement("div", null,
19041
- React.createElement(ExpandableText$1, { className: 'clc-sxp-bottom-text', isPost: true, foldText: tipText === null || tipText === void 0 ? void 0 : tipText.foldText, unfoldText: tipText === null || tipText === void 0 ? void 0 : tipText.unfoldText, text: (_p = (_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.title) !== null && _p !== void 0 ? _p : '', style: Object.assign(Object.assign({}, descStyle), { textShadow: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isOpenTextShadow) ? '2px 2px 4px rgba(0, 0, 0, 0.5)' : 'none' }), onChange: onExpandableChange }),
19024
+ React.createElement(ExpandableText$1, { className: 'clc-sxp-bottom-text', isPost: true, foldText: tipText === null || tipText === void 0 ? void 0 : tipText.foldText, unfoldText: tipText === null || tipText === void 0 ? void 0 : tipText.unfoldText, text: (_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.title) !== null && _l !== void 0 ? _l : '', style: Object.assign(Object.assign({}, descStyle), { textShadow: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isOpenTextShadow) ? '2px 2px 4px rgba(0, 0, 0, 0.5)' : 'none' }), onChange: onExpandableChange }),
19042
19025
  React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
19043
- React.createElement(Hashtag$1, { index: activeIndex, tags: (_r = (_q = rec === null || rec === void 0 ? void 0 : rec.video) === null || _q === void 0 ? void 0 : _q.hashTags) !== null && _r !== void 0 ? _r : [], itemId: (_s = rec === null || rec === void 0 ? void 0 : rec.video) === null || _s === void 0 ? void 0 : _s.itemId, itemType: ((_t = rec === null || rec === void 0 ? void 0 : rec.video) === null || _t === void 0 ? void 0 : _t.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle, hashTagRightMargin: containerWidth - (hashTagRightMargin !== null && hashTagRightMargin !== void 0 ? hashTagRightMargin : 0) }))),
19026
+ React.createElement(Hashtag$1, { index: activeIndex, tags: (_o = (_m = rec === null || rec === void 0 ? void 0 : rec.video) === null || _m === void 0 ? void 0 : _m.hashTags) !== null && _o !== void 0 ? _o : [], itemId: (_p = rec === null || rec === void 0 ? void 0 : rec.video) === null || _p === void 0 ? void 0 : _p.itemId, itemType: ((_q = rec === null || rec === void 0 ? void 0 : rec.video) === null || _q === void 0 ? void 0 : _q.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle, hashTagRightMargin: containerWidth - (hashTagRightMargin !== null && hashTagRightMargin !== void 0 ? hashTagRightMargin : 0) }))),
19044
19027
  React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
19045
19028
  }
19046
19029
  return null;
@@ -19079,7 +19062,7 @@ Made in Italy` })));
19079
19062
  return null;
19080
19063
  }, [globalConfig, waterFallData]);
19081
19064
  const handleViewImageStartEnd = (item) => {
19082
- var _a, _b, _c, _d, _e, _f, _g, _h, _j;
19065
+ var _a, _b, _c, _d, _e, _f;
19083
19066
  if (!((_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.url) && ((_b = item === null || item === void 0 ? void 0 : item.video) === null || _b === void 0 ? void 0 : _b.imgUrls)) {
19084
19067
  const endTime = Date.now();
19085
19068
  const duration = viewImageStartTime.current === 0 ? 0 : (endTime - viewImageStartTime.current) / 1000;
@@ -19088,11 +19071,10 @@ Made in Italy` })));
19088
19071
  eventSubject: 'viewImageCarouselEnd',
19089
19072
  eventDescription: 'User end view the image carousel',
19090
19073
  contentId: (_d = (_c = item === null || item === void 0 ? void 0 : item.video) === null || _c === void 0 ? void 0 : _c.itemId) !== null && _d !== void 0 ? _d : '',
19091
- sceneId: (_g = (_f = (_e = item === null || item === void 0 ? void 0 : item.video) === null || _e === void 0 ? void 0 : _e.scene) === null || _f === void 0 ? void 0 : _f.sceneId) !== null && _g !== void 0 ? _g : '',
19092
- contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
19074
+ contentName: (_e = item === null || item === void 0 ? void 0 : item.video.title) !== null && _e !== void 0 ? _e : '',
19093
19075
  imageEndTime: `${endTime}`,
19094
19076
  playDuration: `${duration}`,
19095
- contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
19077
+ contentTags: JSON.stringify((_f = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _f !== void 0 ? _f : []),
19096
19078
  position: activeIndex + '',
19097
19079
  contentFormat: 'image',
19098
19080
  traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo
@@ -19101,7 +19083,7 @@ Made in Italy` })));
19101
19083
  }
19102
19084
  };
19103
19085
  const handleSlideSkip = (item, position) => {
19104
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
19086
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
19105
19087
  if (isPreview || waterFallData)
19106
19088
  return;
19107
19089
  const t = new Date() - curTime.current;
@@ -19127,8 +19109,7 @@ Made in Italy` })));
19127
19109
  contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
19128
19110
  position: position + '',
19129
19111
  contentId: (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.itemId) !== null && _t !== void 0 ? _t : '',
19130
- sceneId: (_w = (_v = (_u = item === null || item === void 0 ? void 0 : item.video) === null || _u === void 0 ? void 0 : _u.scene) === null || _v === void 0 ? void 0 : _v.sceneId) !== null && _w !== void 0 ? _w : '',
19131
- traceInfo: (_0 = (_y = (_x = item === null || item === void 0 ? void 0 : item.video) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : (_z = item === null || item === void 0 ? void 0 : item.product) === null || _z === void 0 ? void 0 : _z.traceInfo) !== null && _0 !== void 0 ? _0 : '',
19112
+ traceInfo: (_x = (_v = (_u = item === null || item === void 0 ? void 0 : item.video) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : (_w = item === null || item === void 0 ? void 0 : item.product) === null || _w === void 0 ? void 0 : _w.traceInfo) !== null && _x !== void 0 ? _x : '',
19132
19113
  contentFormat
19133
19114
  }
19134
19115
  });
@@ -19138,7 +19119,7 @@ Made in Italy` })));
19138
19119
  }
19139
19120
  };
19140
19121
  const handleScrollEvent = (swiper) => {
19141
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2;
19122
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
19142
19123
  const item = data[swiper.previousIndex];
19143
19124
  if (!item)
19144
19125
  return;
@@ -19155,12 +19136,11 @@ Made in Italy` })));
19155
19136
  eventSubject: 'scrollDown',
19156
19137
  eventDescription: 'User scroll down',
19157
19138
  contentId: (_e = (_d = item === null || item === void 0 ? void 0 : item.video) === null || _d === void 0 ? void 0 : _d.itemId) !== null && _e !== void 0 ? _e : '',
19158
- sceneId: (_h = (_g = (_f = item === null || item === void 0 ? void 0 : item.video) === null || _f === void 0 ? void 0 : _f.scene) === null || _g === void 0 ? void 0 : _g.sceneId) !== null && _h !== void 0 ? _h : '',
19159
- productId: (_k = (_j = item === null || item === void 0 ? void 0 : item.product) === null || _j === void 0 ? void 0 : _j.itemId) !== null && _k !== void 0 ? _k : '',
19139
+ productId: (_g = (_f = item === null || item === void 0 ? void 0 : item.product) === null || _f === void 0 ? void 0 : _f.itemId) !== null && _g !== void 0 ? _g : '',
19160
19140
  requestId: null,
19161
- traceInfo: (_p = (_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.traceInfo) !== null && _m !== void 0 ? _m : (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.traceInfo) !== null && _p !== void 0 ? _p : '',
19141
+ traceInfo: (_l = (_j = (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.traceInfo) !== null && _j !== void 0 ? _j : (_k = item === null || item === void 0 ? void 0 : item.product) === null || _k === void 0 ? void 0 : _k.traceInfo) !== null && _l !== void 0 ? _l : '',
19162
19142
  contentFormat,
19163
- position: ((_q = swiper.previousIndex) !== null && _q !== void 0 ? _q : 0) + ''
19143
+ position: ((_m = swiper.previousIndex) !== null && _m !== void 0 ? _m : 0) + ''
19164
19144
  }
19165
19145
  });
19166
19146
  // 如果上一个商品是图片集，需上报 浏览图片集结结束 事件
@@ -19172,13 +19152,12 @@ Made in Italy` })));
19172
19152
  eventInfo: {
19173
19153
  eventSubject: 'scrollUp',
19174
19154
  eventDescription: 'User scroll up',
19175
- contentId: (_s = (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.itemId) !== null && _s !== void 0 ? _s : '',
19176
- sceneId: (_v = (_u = (_t = item === null || item === void 0 ? void 0 : item.video) === null || _t === void 0 ? void 0 : _t.scene) === null || _u === void 0 ? void 0 : _u.sceneId) !== null && _v !== void 0 ? _v : '',
19177
- productId: (_x = (_w = item.product) === null || _w === void 0 ? void 0 : _w.itemId) !== null && _x !== void 0 ? _x : '',
19155
+ contentId: (_p = (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.itemId) !== null && _p !== void 0 ? _p : '',
19156
+ productId: (_r = (_q = item.product) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
19178
19157
  requestId: null,
19179
- traceInfo: (_1 = (_z = (_y = item === null || item === void 0 ? void 0 : item.video) === null || _y === void 0 ? void 0 : _y.traceInfo) !== null && _z !== void 0 ? _z : (_0 = item === null || item === void 0 ? void 0 : item.product) === null || _0 === void 0 ? void 0 : _0.traceInfo) !== null && _1 !== void 0 ? _1 : '',
19158
+ traceInfo: (_v = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_u = item === null || item === void 0 ? void 0 : item.product) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : '',
19180
19159
  contentFormat,
19181
- position: ((_2 = swiper.previousIndex) !== null && _2 !== void 0 ? _2 : 0) + ''
19160
+ position: ((_w = swiper.previousIndex) !== null && _w !== void 0 ? _w : 0) + ''
19182
19161
  }
19183
19162
  });
19184
19163
  // 如果上一个商品是图片集，需上报 浏览图片集结结束 事件
@@ -19204,7 +19183,7 @@ Made in Italy` })));
19204
19183
  }
19205
19184
  }, [openHashtag, data, activeIndex]);
19206
19185
  const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
19207
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
19186
+ var _a, _b, _c, _d, _e, _f, _g, _h;
19208
19187
  const item = data[activeIndex];
19209
19188
  // 如果是图片集则上报事件
19210
19189
  if (!((_a = item === null || item === void 0 ? void 0 : item.video) === null || _a === void 0 ? void 0 : _a.url) && ((_b = item === null || item === void 0 ? void 0 : item.video) === null || _b === void 0 ? void 0 : _b.imgUrls)) {
@@ -19215,10 +19194,9 @@ Made in Italy` })));
19215
19194
  eventSubject: 'viewImageCarouselStart',
19216
19195
  eventDescription: 'User start view the image carousel',
19217
19196
  contentId: (_d = (_c = item === null || item === void 0 ? void 0 : item.video) === null || _c === void 0 ? void 0 : _c.itemId) !== null && _d !== void 0 ? _d : '',
19218
- sceneId: (_g = (_f = (_e = item === null || item === void 0 ? void 0 : item.video) === null || _e === void 0 ? void 0 : _e.scene) === null || _f === void 0 ? void 0 : _f.sceneId) !== null && _g !== void 0 ? _g : '',
19219
- contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
19197
+ contentName: (_e = item === null || item === void 0 ? void 0 : item.video.title) !== null && _e !== void 0 ? _e : '',
19220
19198
  imageStartTime: `${startTime}`,
19221
- contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
19199
+ contentTags: JSON.stringify((_f = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _f !== void 0 ? _f : []),
19222
19200
  position: activeIndex + '',
19223
19201
  contentFormat: 'image',
19224
19202
  traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
@@ -19228,11 +19206,11 @@ Made in Italy` })));
19228
19206
  if (enableCapi) {
19229
19207
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
19230
19208
  eventName: 'ViewContent',
19231
- product: (_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.bindProduct
19209
+ product: (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.bindProduct
19232
19210
  });
19233
19211
  bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
19234
19212
  eventName: 'PageView',
19235
- product: (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.bindProduct
19213
+ product: (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.bindProduct
19236
19214
  });
19237
19215
  }
19238
19216
  }
@@ -19385,7 +19363,7 @@ Made in Italy` })));
19385
19363
  }, []);
19386
19364
  const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
19387
19365
  const handlePlaying = React.useCallback(() => {
19388
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
19366
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
19389
19367
  setIsPauseVideo(false);
19390
19368
  const item = data[index];
19391
19369
  if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
@@ -19398,15 +19376,14 @@ Made in Italy` })));
19398
19376
  eventSubject: 'playVideo',
19399
19377
  eventDescription: 'User played the video',
19400
19378
  contentId: (_h = (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.itemId) !== null && _h !== void 0 ? _h : '',
19401
- sceneId: (_l = (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.scene) === null || _k === void 0 ? void 0 : _k.sceneId) !== null && _l !== void 0 ? _l : '',
19402
- contentName: (_o = (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.title) !== null && _o !== void 0 ? _o : '',
19379
+ contentName: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.title) !== null && _k !== void 0 ? _k : '',
19403
19380
  playType,
19404
19381
  startTime: videoCurrentTime,
19405
19382
  videoDuration,
19406
- contentTags: JSON.stringify((_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []),
19383
+ contentTags: JSON.stringify((_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.tags) !== null && _m !== void 0 ? _m : []),
19407
19384
  position: index + '',
19408
19385
  contentFormat: 'video',
19409
- traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
19386
+ traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
19410
19387
  }
19411
19388
  });
19412
19389
  setIsFirstPlay(false);
@@ -19445,7 +19422,7 @@ Made in Italy` })));
19445
19422
  }
19446
19423
  }, [isLoadFinish]);
19447
19424
  const onPause = React.useCallback(() => {
19448
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
19425
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
19449
19426
  const item = data[index];
19450
19427
  const videoDuration = ((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
19451
19428
  const videoCurrentTime = ((_d = (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
@@ -19456,15 +19433,14 @@ Made in Italy` })));
19456
19433
  eventSubject: 'playOverVideo',
19457
19434
  eventDescription: 'User finished playing the video',
19458
19435
  contentId: (_h = (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.itemId) !== null && _h !== void 0 ? _h : '',
19459
- sceneId: (_l = (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.scene) === null || _k === void 0 ? void 0 : _k.sceneId) !== null && _l !== void 0 ? _l : '',
19460
- contentName: (_o = (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.title) !== null && _o !== void 0 ? _o : '',
19436
+ contentName: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.title) !== null && _k !== void 0 ? _k : '',
19461
19437
  endTime: videoCurrentTime,
19462
19438
  videoDuration,
19463
19439
  playDuration,
19464
- contentTags: JSON.stringify((_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []),
19440
+ contentTags: JSON.stringify((_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.tags) !== null && _m !== void 0 ? _m : []),
19465
19441
  position: index + '',
19466
19442
  contentFormat: 'video',
19467
- traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
19443
+ traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
19468
19444
  }
19469
19445
  });
19470
19446
  }