pb-sxp-ui 1.15.41 → 1.15.43
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.
- package/dist/index.cjs +156 -125
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +156 -125
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +6 -6
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +6 -6
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +156 -125
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +6 -6
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/DiyPortalPreview/VideoWidget.js +10 -8
- package/es/core/components/SxpPageRender/LikeButton/index.js +17 -15
- package/es/core/components/SxpPageRender/PictureGroup/index.d.ts +5 -0
- package/es/core/components/SxpPageRender/PictureGroup/index.js +37 -13
- package/es/core/components/SxpPageRender/VideoWidget/index.js +34 -44
- package/es/core/components/SxpPageRender/WaterFall/index.js +4 -3
- package/es/core/components/SxpPageRender/index.js +46 -35
- package/es/core/context/SxpDataSourceProvider.js +2 -2
- package/es/core/hooks/useEventReport.js +6 -5
- package/lib/core/components/DiyPortalPreview/VideoWidget.js +10 -8
- package/lib/core/components/SxpPageRender/LikeButton/index.js +17 -15
- package/lib/core/components/SxpPageRender/PictureGroup/index.d.ts +5 -0
- package/lib/core/components/SxpPageRender/PictureGroup/index.js +36 -12
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +34 -44
- package/lib/core/components/SxpPageRender/WaterFall/index.js +4 -3
- package/lib/core/components/SxpPageRender/index.js +46 -35
- package/lib/core/context/SxpDataSourceProvider.js +2 -2
- package/lib/core/hooks/useEventReport.js +6 -5
- package/package.json +1 -1
package/dist/pb-ui.js
CHANGED
|
@@ -1079,7 +1079,7 @@
|
|
|
1079
1079
|
}
|
|
1080
1080
|
}), [bffFetch, utmVal]);
|
|
1081
1081
|
const ctaEvent = React.useCallback((eventInfo, rec, product, position) => {
|
|
1082
|
-
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
|
+
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;
|
|
1083
1083
|
const cta = product === null || product === void 0 ? void 0 : product.bindCta;
|
|
1084
1084
|
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);
|
|
1085
1085
|
let fromKName = '';
|
|
@@ -1097,7 +1097,7 @@
|
|
|
1097
1097
|
}
|
|
1098
1098
|
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;
|
|
1099
1099
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
1100
|
-
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: (
|
|
1100
|
+
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 })
|
|
1101
1101
|
});
|
|
1102
1102
|
}, [bffEventReport, isFromHashtag]);
|
|
1103
1103
|
const h5EnterLink = React.useCallback(() => {
|
|
@@ -1758,14 +1758,14 @@
|
|
|
1758
1758
|
* @Author: binruan@chatlabs.com
|
|
1759
1759
|
* @Date: 2024-03-12 10:59:06
|
|
1760
1760
|
* @LastEditors: binruan@chatlabs.com
|
|
1761
|
-
* @LastEditTime:
|
|
1761
|
+
* @LastEditTime: 2025-05-09 15:30:59
|
|
1762
1762
|
* @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
|
|
1763
1763
|
*
|
|
1764
1764
|
*/
|
|
1765
1765
|
function useEventReport() {
|
|
1766
1766
|
const { bffEventReport, popupDetailData, isFromHashtag, eventTimeList, setEventTimeList } = useSxpDataSource();
|
|
1767
1767
|
const jumpToWeb = React.useCallback((e, data, product, cta, position, traceInfo) => {
|
|
1768
|
-
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
|
+
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;
|
|
1769
1769
|
const i = eventTimeList === null || eventTimeList === void 0 ? void 0 : eventTimeList.findIndex((item) => item.target === (e === null || e === void 0 ? void 0 : e.target));
|
|
1770
1770
|
if (i !== -1) {
|
|
1771
1771
|
return;
|
|
@@ -1798,11 +1798,11 @@
|
|
|
1798
1798
|
contentFormat = 'image';
|
|
1799
1799
|
}
|
|
1800
1800
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
1801
|
-
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 : '',
|
|
1801
|
+
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 }))
|
|
1802
1802
|
});
|
|
1803
1803
|
}, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
|
|
1804
1804
|
const productView = React.useCallback((data, product, cta, viewTime, position) => {
|
|
1805
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
|
1805
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
|
1806
1806
|
let fromKName = '';
|
|
1807
1807
|
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))) {
|
|
1808
1808
|
fromKName = 'pdpPage';
|
|
@@ -1821,8 +1821,9 @@
|
|
|
1821
1821
|
contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags),
|
|
1822
1822
|
position: position + '',
|
|
1823
1823
|
contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
|
1824
|
+
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
1825
|
ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
|
|
1825
|
-
traceInfo: (
|
|
1826
|
+
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 : '',
|
|
1826
1827
|
timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
|
|
1827
1828
|
eventSubject: 'productView',
|
|
1828
1829
|
eventDescription: 'User browsed the product'
|
|
@@ -15519,7 +15520,7 @@ Made in Italy` })));
|
|
|
15519
15520
|
* @Author: binruan@chatlabs.com
|
|
15520
15521
|
* @Date: 2024-01-10 10:58:24
|
|
15521
15522
|
* @LastEditors: binruan@chatlabs.com
|
|
15522
|
-
* @LastEditTime: 2025-
|
|
15523
|
+
* @LastEditTime: 2025-05-09 15:30:41
|
|
15523
15524
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\WaterFall\index.tsx
|
|
15524
15525
|
*
|
|
15525
15526
|
*/
|
|
@@ -15557,7 +15558,7 @@ Made in Italy` })));
|
|
|
15557
15558
|
}
|
|
15558
15559
|
}, [waterFallData]);
|
|
15559
15560
|
const reportTagsView = React.useCallback(() => {
|
|
15560
|
-
var _a, _b, _c, _d, _e, _f;
|
|
15561
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
15561
15562
|
const rec = recData === null || recData === void 0 ? void 0 : recData.rec;
|
|
15562
15563
|
if (!rec)
|
|
15563
15564
|
return;
|
|
@@ -15577,9 +15578,10 @@ Made in Italy` })));
|
|
|
15577
15578
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
15578
15579
|
eventInfo: {
|
|
15579
15580
|
contentId: (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
|
15581
|
+
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 : '',
|
|
15580
15582
|
position: cacheActiveIndex + '',
|
|
15581
|
-
contentTags: JSON.stringify((
|
|
15582
|
-
traceInfo: (
|
|
15583
|
+
contentTags: JSON.stringify((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.tags),
|
|
15584
|
+
traceInfo: (_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.traceInfo,
|
|
15583
15585
|
hashTags: JSON.stringify([recData === null || recData === void 0 ? void 0 : recData.hashTag]),
|
|
15584
15586
|
fromKName,
|
|
15585
15587
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
|
@@ -17660,7 +17662,7 @@ Made in Italy` })));
|
|
|
17660
17662
|
const likeIcon = useIconLink(defaultLikeIconPath$2);
|
|
17661
17663
|
const unlikeIcon = useIconLink(defaultUnLikeIconPath$2);
|
|
17662
17664
|
const handleClick = lodash.debounce(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
17663
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
|
|
17665
|
+
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;
|
|
17664
17666
|
if (state) {
|
|
17665
17667
|
// 先设置状态
|
|
17666
17668
|
setState(false);
|
|
@@ -17670,11 +17672,12 @@ Made in Italy` })));
|
|
|
17670
17672
|
eventSubject: 'favoriteContentCanceled',
|
|
17671
17673
|
eventDescription: 'This content was unfavorite by the user',
|
|
17672
17674
|
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 : '',
|
|
17673
|
-
|
|
17674
|
-
|
|
17675
|
+
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 : '',
|
|
17676
|
+
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 : '',
|
|
17677
|
+
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 : []),
|
|
17675
17678
|
position: position + '',
|
|
17676
|
-
contentFormat: ((
|
|
17677
|
-
traceInfo: (
|
|
17679
|
+
contentFormat: ((_q = recData === null || recData === void 0 ? void 0 : recData.video) === null || _q === void 0 ? void 0 : _q.url) ? 'video' : 'image',
|
|
17680
|
+
traceInfo: (_r = recData === null || recData === void 0 ? void 0 : recData.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
17678
17681
|
}
|
|
17679
17682
|
});
|
|
17680
17683
|
// 如果接口调用失败，则回滚状态
|
|
@@ -17682,40 +17685,41 @@ Made in Italy` })));
|
|
|
17682
17685
|
setState(true);
|
|
17683
17686
|
}
|
|
17684
17687
|
else {
|
|
17685
|
-
const nRtcList = (
|
|
17688
|
+
const nRtcList = (_s = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
|
17686
17689
|
if (index === position) {
|
|
17687
17690
|
item.isCollected = false;
|
|
17688
17691
|
}
|
|
17689
17692
|
return item;
|
|
17690
|
-
})) !== null &&
|
|
17693
|
+
})) !== null && _s !== void 0 ? _s : [];
|
|
17691
17694
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
|
17692
17695
|
}
|
|
17693
17696
|
}
|
|
17694
17697
|
else {
|
|
17695
17698
|
setState(true);
|
|
17696
|
-
const result = (
|
|
17699
|
+
const result = (_t = (yield (mutateLike === null || mutateLike === void 0 ? void 0 : mutateLike({ content: JSON.stringify(recData) })))) !== null && _t !== void 0 ? _t : false;
|
|
17697
17700
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
17698
17701
|
eventInfo: {
|
|
17699
17702
|
eventSubject: 'favoriteContent',
|
|
17700
17703
|
eventDescription: 'This content was favorite by the user',
|
|
17701
|
-
contentId: (
|
|
17702
|
-
|
|
17703
|
-
|
|
17704
|
+
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 : '',
|
|
17705
|
+
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 : '',
|
|
17706
|
+
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 : '',
|
|
17707
|
+
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 : []),
|
|
17704
17708
|
position: position + '',
|
|
17705
|
-
contentFormat: ((
|
|
17706
|
-
traceInfo: (
|
|
17709
|
+
contentFormat: ((_3 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _3 === void 0 ? void 0 : _3.url) ? 'video' : 'image',
|
|
17710
|
+
traceInfo: (_4 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _4 === void 0 ? void 0 : _4.traceInfo
|
|
17707
17711
|
}
|
|
17708
17712
|
});
|
|
17709
17713
|
if (!result) {
|
|
17710
17714
|
setState(false);
|
|
17711
17715
|
}
|
|
17712
17716
|
else {
|
|
17713
|
-
const nRtcList = (
|
|
17717
|
+
const nRtcList = (_5 = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
|
17714
17718
|
if (index === position) {
|
|
17715
17719
|
item.isCollected = true;
|
|
17716
17720
|
}
|
|
17717
17721
|
return item;
|
|
17718
|
-
})) !== null &&
|
|
17722
|
+
})) !== null && _5 !== void 0 ? _5 : [];
|
|
17719
17723
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
|
17720
17724
|
}
|
|
17721
17725
|
}
|
|
@@ -17818,6 +17822,26 @@ Made in Italy` })));
|
|
|
17818
17822
|
return;
|
|
17819
17823
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
|
17820
17824
|
}, [videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
17825
|
+
const handleEnd = () => {
|
|
17826
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
17827
|
+
if (!videoRef.current)
|
|
17828
|
+
return;
|
|
17829
|
+
if (isDiyH5) {
|
|
17830
|
+
(_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
|
|
17831
|
+
if (!loopPlayRef.current)
|
|
17832
|
+
return;
|
|
17833
|
+
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
|
17834
|
+
(_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);
|
|
17835
|
+
}
|
|
17836
|
+
else {
|
|
17837
|
+
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;
|
|
17838
|
+
(_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);
|
|
17839
|
+
}
|
|
17840
|
+
}
|
|
17841
|
+
else {
|
|
17842
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.play();
|
|
17843
|
+
}
|
|
17844
|
+
};
|
|
17821
17845
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
|
17822
17846
|
const handlePlaying = React.useCallback(() => {
|
|
17823
17847
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
@@ -17826,7 +17850,7 @@ Made in Italy` })));
|
|
|
17826
17850
|
setIsLoadFinish(true);
|
|
17827
17851
|
}, []);
|
|
17828
17852
|
const handleStartPlay = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
17829
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
|
17853
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
|
17830
17854
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
17831
17855
|
return;
|
|
17832
17856
|
setIsPauseVideo(false);
|
|
@@ -17837,16 +17861,11 @@ Made in Italy` })));
|
|
|
17837
17861
|
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);
|
|
17838
17862
|
const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
|
|
17839
17863
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
17840
|
-
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 : '',
|
|
17864
|
+
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) + '' }))
|
|
17841
17865
|
});
|
|
17842
17866
|
isFirstPlayRef.current = false;
|
|
17843
17867
|
}
|
|
17844
17868
|
}), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
17845
|
-
const setCurrentTimeByStartTime = React.useCallback(() => {
|
|
17846
|
-
if (isDiyH5) {
|
|
17847
|
-
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
|
17848
|
-
}
|
|
17849
|
-
}, []);
|
|
17850
17869
|
const handLoadeddata = React.useCallback(() => {
|
|
17851
17870
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
|
|
17852
17871
|
return;
|
|
@@ -17871,13 +17890,12 @@ Made in Italy` })));
|
|
|
17871
17890
|
const handleLoadedmetadata = React.useCallback(() => {
|
|
17872
17891
|
if (!videoRef.current)
|
|
17873
17892
|
return;
|
|
17874
|
-
setCurrentTimeByStartTime();
|
|
17875
17893
|
loadedTimeRef.current = new Date();
|
|
17876
17894
|
handleStartPlay();
|
|
17877
17895
|
handLoadeddata();
|
|
17878
17896
|
}, [videoRef.current, handLoadeddata, handleStartPlay]);
|
|
17879
17897
|
const handleClickVideo = React.useCallback((type) => () => {
|
|
17880
|
-
var _a, _b, _c, _d, _e
|
|
17898
|
+
var _a, _b, _c, _d, _e;
|
|
17881
17899
|
if (!videoRef.current)
|
|
17882
17900
|
return;
|
|
17883
17901
|
if (!isLoadFinish)
|
|
@@ -17898,20 +17916,17 @@ Made in Italy` })));
|
|
|
17898
17916
|
break;
|
|
17899
17917
|
default:
|
|
17900
17918
|
if (isPause) {
|
|
17901
|
-
|
|
17902
|
-
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
|
17903
|
-
}
|
|
17904
|
-
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
|
|
17919
|
+
(_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.play();
|
|
17905
17920
|
}
|
|
17906
17921
|
else {
|
|
17907
|
-
(
|
|
17922
|
+
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.pause();
|
|
17908
17923
|
}
|
|
17909
17924
|
setIsPauseVideo(!isPause);
|
|
17910
17925
|
break;
|
|
17911
17926
|
}
|
|
17912
17927
|
}, [isLoadFinish, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
17913
17928
|
const handlePause = React.useCallback(() => {
|
|
17914
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
17929
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
17915
17930
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
17916
17931
|
return;
|
|
17917
17932
|
if (activeIndex !== index)
|
|
@@ -17927,14 +17942,15 @@ Made in Italy` })));
|
|
|
17927
17942
|
eventSubject: 'playOverVideo',
|
|
17928
17943
|
eventDescription: 'User finished playing the video',
|
|
17929
17944
|
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 : '',
|
|
17930
|
-
|
|
17945
|
+
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 : '',
|
|
17946
|
+
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 : '',
|
|
17931
17947
|
endTime: videoCurrentTime,
|
|
17932
17948
|
videoDuration,
|
|
17933
17949
|
playDuration,
|
|
17934
|
-
contentTags: JSON.stringify((
|
|
17950
|
+
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 : []),
|
|
17935
17951
|
position: index + '',
|
|
17936
17952
|
contentFormat: 'video',
|
|
17937
|
-
traceInfo: (
|
|
17953
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
17938
17954
|
}
|
|
17939
17955
|
});
|
|
17940
17956
|
}
|
|
@@ -17942,27 +17958,8 @@ Made in Italy` })));
|
|
|
17942
17958
|
const handleWaiting = React.useCallback(() => {
|
|
17943
17959
|
setWaiting(true);
|
|
17944
17960
|
}, []);
|
|
17945
|
-
const handleTimeUpload = () => {
|
|
17946
|
-
if (!videoRef.current || !isDiyH5)
|
|
17947
|
-
return;
|
|
17948
|
-
setTimeout(() => {
|
|
17949
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
17950
|
-
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)) {
|
|
17951
|
-
(_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
|
|
17952
|
-
if (!loopPlayRef.current)
|
|
17953
|
-
return;
|
|
17954
|
-
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
|
17955
|
-
(_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);
|
|
17956
|
-
}
|
|
17957
|
-
else {
|
|
17958
|
-
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;
|
|
17959
|
-
(_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);
|
|
17960
|
-
}
|
|
17961
|
-
}
|
|
17962
|
-
});
|
|
17963
|
-
};
|
|
17964
17961
|
React.useEffect(() => {
|
|
17965
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
|
17962
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
17966
17963
|
if (!isActive)
|
|
17967
17964
|
return;
|
|
17968
17965
|
const videoSrc = videoUrl;
|
|
@@ -17983,7 +17980,6 @@ Made in Italy` })));
|
|
|
17983
17980
|
hls === null || hls === void 0 ? void 0 : hls.attachMedia(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current);
|
|
17984
17981
|
hls === null || hls === void 0 ? void 0 : hls.on(Hls.Events.MANIFEST_PARSED, function () {
|
|
17985
17982
|
var _a;
|
|
17986
|
-
setCurrentTimeByStartTime();
|
|
17987
17983
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
|
17988
17984
|
});
|
|
17989
17985
|
}
|
|
@@ -17997,12 +17993,11 @@ Made in Italy` })));
|
|
|
17997
17993
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.addEventListener('play', handleStartPlay);
|
|
17998
17994
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.addEventListener('playing', handlePlaying);
|
|
17999
17995
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.addEventListener('pause', handlePause);
|
|
18000
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended',
|
|
17996
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handleEnd);
|
|
18001
17997
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.addEventListener('canplay', handlePlay);
|
|
18002
17998
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
|
|
18003
|
-
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.addEventListener('timeupdate', handleTimeUpload);
|
|
18004
17999
|
return () => {
|
|
18005
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
|
18000
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18006
18001
|
const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
|
|
18007
18002
|
if (!isPause)
|
|
18008
18003
|
handlePause();
|
|
@@ -18014,10 +18009,9 @@ Made in Italy` })));
|
|
|
18014
18009
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.removeEventListener('play', handleStartPlay);
|
|
18015
18010
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.removeEventListener('playing', handlePlaying);
|
|
18016
18011
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.removeEventListener('pause', handlePause);
|
|
18017
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended',
|
|
18012
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handleEnd);
|
|
18018
18013
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('canplay', handlePlay);
|
|
18019
18014
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.removeEventListener('waiting', handleWaiting);
|
|
18020
|
-
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.removeEventListener('timeupdate', handleTimeUpload);
|
|
18021
18015
|
};
|
|
18022
18016
|
}, [isActive]);
|
|
18023
18017
|
React.useEffect(() => {
|
|
@@ -18228,19 +18222,43 @@ Made in Italy` })));
|
|
|
18228
18222
|
}, onLoad: onShowFirstImage }))));
|
|
18229
18223
|
};
|
|
18230
18224
|
|
|
18231
|
-
const PictureGroup$4 = ({ imgUrls,
|
|
18225
|
+
const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig, swiperRef }, ref) => {
|
|
18232
18226
|
var _a, _b;
|
|
18233
18227
|
const { isActive } = useSwiperSlide();
|
|
18234
|
-
const { sxpParameter, openHashtag } = useSxpDataSource();
|
|
18228
|
+
const { sxpParameter, openHashtag, isDiyH5 } = useSxpDataSource();
|
|
18235
18229
|
const [isLoad, setIsLoad] = React.useState(false);
|
|
18236
18230
|
const [imgInfo, setImgInfo] = React.useState();
|
|
18237
18231
|
const [swiperActiveIndex, setSwiperActiveIndex] = React.useState(0);
|
|
18238
|
-
const
|
|
18232
|
+
const imgsSwiperRef = React.useRef();
|
|
18239
18233
|
const isFirstPlayRef = React.useRef(true);
|
|
18234
|
+
const loopPlayRef = React.useRef(true);
|
|
18240
18235
|
const initTime = new Date();
|
|
18236
|
+
React.useImperativeHandle(ref, () => {
|
|
18237
|
+
return {
|
|
18238
|
+
setLoopPlay(v) {
|
|
18239
|
+
loopPlayRef.current = v;
|
|
18240
|
+
}
|
|
18241
|
+
};
|
|
18242
|
+
});
|
|
18243
|
+
React.useEffect(() => {
|
|
18244
|
+
if (isLoad && isActive && isDiyH5) {
|
|
18245
|
+
setTimeout(() => {
|
|
18246
|
+
var _a, _b, _c, _d, _e, _f;
|
|
18247
|
+
if (!loopPlayRef.current)
|
|
18248
|
+
return;
|
|
18249
|
+
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
|
18250
|
+
(_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);
|
|
18251
|
+
}
|
|
18252
|
+
else {
|
|
18253
|
+
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;
|
|
18254
|
+
(_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);
|
|
18255
|
+
}
|
|
18256
|
+
}, 3000);
|
|
18257
|
+
}
|
|
18258
|
+
}, [isLoad, isActive, isDiyH5, data, index, swiperRef]);
|
|
18241
18259
|
React.useEffect(() => {
|
|
18242
18260
|
if (isLoad && isActive) {
|
|
18243
|
-
(
|
|
18261
|
+
(imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.start();
|
|
18244
18262
|
if (openHashtag) {
|
|
18245
18263
|
onViewImageEndEvent(rec);
|
|
18246
18264
|
}
|
|
@@ -18250,7 +18268,7 @@ Made in Italy` })));
|
|
|
18250
18268
|
}
|
|
18251
18269
|
}
|
|
18252
18270
|
else {
|
|
18253
|
-
(
|
|
18271
|
+
(imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.stop();
|
|
18254
18272
|
}
|
|
18255
18273
|
}, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
|
|
18256
18274
|
const showFirstImageFn = React.useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
|
|
@@ -18277,13 +18295,13 @@ Made in Italy` })));
|
|
|
18277
18295
|
};
|
|
18278
18296
|
}, [isActive, imgInfo]);
|
|
18279
18297
|
const handleMouseEnter = React.useCallback(() => {
|
|
18280
|
-
if (
|
|
18281
|
-
|
|
18298
|
+
if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
|
|
18299
|
+
imgsSwiperRef.current.swiper.autoplay.stop();
|
|
18282
18300
|
}
|
|
18283
18301
|
}, []);
|
|
18284
18302
|
const handleMouseLeave = React.useCallback(() => {
|
|
18285
|
-
if (
|
|
18286
|
-
|
|
18303
|
+
if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
|
|
18304
|
+
imgsSwiperRef.current.swiper.autoplay.start();
|
|
18287
18305
|
}
|
|
18288
18306
|
}, []);
|
|
18289
18307
|
const handleSlideChange = React.useCallback((swiper) => {
|
|
@@ -18304,7 +18322,7 @@ Made in Italy` })));
|
|
|
18304
18322
|
enabled: true
|
|
18305
18323
|
}
|
|
18306
18324
|
}
|
|
18307
|
-
: {}), { loop: true, ref:
|
|
18325
|
+
: {}), { loop: true, ref: imgsSwiperRef, onSlideChange: handleSlideChange, className: css.css(Object.assign(Object.assign({ '.swiper-pagination': {
|
|
18308
18326
|
bottom: (_a = imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.marginBottom) !== null && _a !== void 0 ? _a : 0,
|
|
18309
18327
|
fontSize: '14px'
|
|
18310
18328
|
} }, ((imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.dotsBgColor) && {
|
|
@@ -18321,7 +18339,7 @@ Made in Italy` })));
|
|
|
18321
18339
|
return (React.createElement(SwiperSlide, { key: srcKey, "aria-hidden": srcKey !== swiperActiveIndex },
|
|
18322
18340
|
React.createElement(Picture, { src: !isLoad && srcKey > 0 ? '' : url, height: height, imgUrlsPostConfig: imgUrlsPostConfig, onShowFirstImage: showFirstImageFn })));
|
|
18323
18341
|
}))));
|
|
18324
|
-
};
|
|
18342
|
+
});
|
|
18325
18343
|
var PictureGroup$5 = React.memo(PictureGroup$4);
|
|
18326
18344
|
|
|
18327
18345
|
/*
|
|
@@ -18601,7 +18619,7 @@ Made in Italy` })));
|
|
|
18601
18619
|
* @Author: binruan@chatlabs.com
|
|
18602
18620
|
* @Date: 2024-03-20 10:27:31
|
|
18603
18621
|
* @LastEditors: binruan@chatlabs.com
|
|
18604
|
-
* @LastEditTime: 2025-05-
|
|
18622
|
+
* @LastEditTime: 2025-05-12 14:26:15
|
|
18605
18623
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
|
18606
18624
|
*
|
|
18607
18625
|
*/
|
|
@@ -18621,6 +18639,7 @@ Made in Italy` })));
|
|
|
18621
18639
|
const skipLinkRef = React.useRef(false);
|
|
18622
18640
|
const [pageNum, setPageNum] = React.useState(2);
|
|
18623
18641
|
const videoWidgetRef = React.useRef(null);
|
|
18642
|
+
const pictureGroupRef = React.useRef(null);
|
|
18624
18643
|
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();
|
|
18625
18644
|
const { backMainFeed, productView, jumpToWeb } = useEventReport();
|
|
18626
18645
|
const isShowFingerTip = React.useMemo(() => {
|
|
@@ -18668,7 +18687,7 @@ Made in Italy` })));
|
|
|
18668
18687
|
(_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
|
|
18669
18688
|
}, [data, ctaType, swiperRef]);
|
|
18670
18689
|
const handleSessionCompleted = React.useCallback((fk) => {
|
|
18671
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
|
18690
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
|
|
18672
18691
|
const item = data === null || data === void 0 ? void 0 : data[activeIndex];
|
|
18673
18692
|
let fromKName = '';
|
|
18674
18693
|
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))) {
|
|
@@ -18695,12 +18714,13 @@ Made in Italy` })));
|
|
|
18695
18714
|
eventSubject: 'sessionCompleted',
|
|
18696
18715
|
eventDescription: 'Session completed',
|
|
18697
18716
|
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
|
18698
|
-
|
|
18717
|
+
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 : '',
|
|
18718
|
+
productId: (_r = item === null || item === void 0 ? void 0 : item.product) === null || _r === void 0 ? void 0 : _r.itemId,
|
|
18699
18719
|
position: activeIndex + '',
|
|
18700
18720
|
fromKName: fk || fromKName,
|
|
18701
18721
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
|
18702
|
-
ctatId: (
|
|
18703
|
-
traceInfo: (
|
|
18722
|
+
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 : '',
|
|
18723
|
+
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 : ''
|
|
18704
18724
|
}
|
|
18705
18725
|
});
|
|
18706
18726
|
}, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime]);
|
|
@@ -18759,8 +18779,9 @@ Made in Italy` })));
|
|
|
18759
18779
|
refreshFeSession
|
|
18760
18780
|
]);
|
|
18761
18781
|
const handleSessionExpire = React.useCallback(lodash.debounce(() => {
|
|
18762
|
-
var _a;
|
|
18782
|
+
var _a, _b;
|
|
18763
18783
|
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
|
18784
|
+
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
|
18764
18785
|
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
|
|
18765
18786
|
}, 1000), [handleSessionCompleted, refreshFeSession]);
|
|
18766
18787
|
React.useEffect(() => {
|
|
@@ -18830,18 +18851,18 @@ Made in Italy` })));
|
|
|
18830
18851
|
return null;
|
|
18831
18852
|
}, [globalConfig, activeIndex, visList]);
|
|
18832
18853
|
const renderContent = React.useCallback((rec, index) => {
|
|
18833
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18854
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
18834
18855
|
if (rec === 'organic menu') {
|
|
18835
18856
|
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)));
|
|
18836
18857
|
}
|
|
18837
|
-
if ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null ||
|
|
18858
|
+
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)) {
|
|
18838
18859
|
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 })));
|
|
18839
18860
|
}
|
|
18840
|
-
if ((
|
|
18841
|
-
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 }));
|
|
18861
|
+
if ((_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.imgUrls) {
|
|
18862
|
+
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 })));
|
|
18842
18863
|
}
|
|
18843
|
-
if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((
|
|
18844
|
-
return (
|
|
18864
|
+
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) {
|
|
18865
|
+
return (_m = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _m === void 0 ? void 0 : _m.map((value, idx) => {
|
|
18845
18866
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
18846
18867
|
const t = resolver[(_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type];
|
|
18847
18868
|
const Component = withBindDataSource(t);
|
|
@@ -18879,7 +18900,7 @@ Made in Italy` })));
|
|
|
18879
18900
|
};
|
|
18880
18901
|
}, [isShowMore]);
|
|
18881
18902
|
const renderBottom = React.useCallback((rec, index) => {
|
|
18882
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
18903
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
18883
18904
|
if (rec === null || rec === void 0 ? void 0 : rec.video) {
|
|
18884
18905
|
let cta = null;
|
|
18885
18906
|
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) {
|
|
@@ -18888,20 +18909,23 @@ Made in Italy` })));
|
|
|
18888
18909
|
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
|
|
18889
18910
|
cta = '商品CTA';
|
|
18890
18911
|
}
|
|
18912
|
+
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)) {
|
|
18913
|
+
cta = '服务CTA';
|
|
18914
|
+
}
|
|
18891
18915
|
else {
|
|
18892
|
-
cta = (
|
|
18916
|
+
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;
|
|
18893
18917
|
}
|
|
18894
18918
|
const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
|
|
18895
18919
|
return (React.createElement(React.Fragment, null,
|
|
18896
|
-
((
|
|
18897
|
-
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(
|
|
18920
|
+
((_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.title) && !isShowMore && React.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
|
|
18921
|
+
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(_k = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.bottomInfoDist) !== null && _k !== void 0 ? _k : 40}px` } },
|
|
18898
18922
|
React.createElement(Nudge, { nudge: nudge }),
|
|
18899
18923
|
(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) === undefined || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowCTA) ? (React.createElement("div", { className: 'clc-sxp-bottom-card' },
|
|
18900
18924
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
|
|
18901
18925
|
React.createElement("div", null,
|
|
18902
|
-
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: (
|
|
18926
|
+
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: (_m = (_l = rec === null || rec === void 0 ? void 0 : rec.video) === null || _l === void 0 ? void 0 : _l.title) !== null && _m !== void 0 ? _m : '', 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 }),
|
|
18903
18927
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
|
|
18904
|
-
React.createElement(Hashtag$1, { index: activeIndex, tags: (
|
|
18928
|
+
React.createElement(Hashtag$1, { index: activeIndex, tags: (_p = (_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.hashTags) !== null && _p !== void 0 ? _p : [], itemId: (_q = rec === null || rec === void 0 ? void 0 : rec.video) === null || _q === void 0 ? void 0 : _q.itemId, itemType: ((_r = rec === null || rec === void 0 ? void 0 : rec.video) === null || _r === void 0 ? void 0 : _r.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle, hashTagRightMargin: containerWidth - (hashTagRightMargin !== null && hashTagRightMargin !== void 0 ? hashTagRightMargin : 0) }))),
|
|
18905
18929
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
|
|
18906
18930
|
}
|
|
18907
18931
|
return null;
|
|
@@ -18939,7 +18963,7 @@ Made in Italy` })));
|
|
|
18939
18963
|
return null;
|
|
18940
18964
|
}, [globalConfig, waterFallData]);
|
|
18941
18965
|
const handleViewImageStartEnd = (item) => {
|
|
18942
|
-
var _a, _b, _c, _d, _e, _f;
|
|
18966
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
18943
18967
|
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)) {
|
|
18944
18968
|
const endTime = Date.now();
|
|
18945
18969
|
const duration = viewImageStartTime.current === 0 ? 0 : (endTime - viewImageStartTime.current) / 1000;
|
|
@@ -18948,10 +18972,11 @@ Made in Italy` })));
|
|
|
18948
18972
|
eventSubject: 'viewImageCarouselEnd',
|
|
18949
18973
|
eventDescription: 'User end view the image carousel',
|
|
18950
18974
|
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 : '',
|
|
18951
|
-
|
|
18975
|
+
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 : '',
|
|
18976
|
+
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
|
18952
18977
|
imageEndTime: `${endTime}`,
|
|
18953
18978
|
playDuration: `${duration}`,
|
|
18954
|
-
contentTags: JSON.stringify((
|
|
18979
|
+
contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
|
|
18955
18980
|
position: activeIndex + '',
|
|
18956
18981
|
contentFormat: 'image',
|
|
18957
18982
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo
|
|
@@ -18960,7 +18985,7 @@ Made in Italy` })));
|
|
|
18960
18985
|
}
|
|
18961
18986
|
};
|
|
18962
18987
|
const handleSlideSkip = (item, position) => {
|
|
18963
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
|
18988
|
+
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;
|
|
18964
18989
|
if (isPreview || waterFallData)
|
|
18965
18990
|
return;
|
|
18966
18991
|
const t = new Date() - curTime.current;
|
|
@@ -18986,7 +19011,8 @@ Made in Italy` })));
|
|
|
18986
19011
|
contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
|
|
18987
19012
|
position: position + '',
|
|
18988
19013
|
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 : '',
|
|
18989
|
-
|
|
19014
|
+
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 : '',
|
|
19015
|
+
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 : '',
|
|
18990
19016
|
contentFormat
|
|
18991
19017
|
}
|
|
18992
19018
|
});
|
|
@@ -18996,7 +19022,7 @@ Made in Italy` })));
|
|
|
18996
19022
|
}
|
|
18997
19023
|
};
|
|
18998
19024
|
const handleScrollEvent = (swiper) => {
|
|
18999
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
|
|
19025
|
+
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;
|
|
19000
19026
|
const item = data[swiper.previousIndex];
|
|
19001
19027
|
if (!item)
|
|
19002
19028
|
return;
|
|
@@ -19013,11 +19039,12 @@ Made in Italy` })));
|
|
|
19013
19039
|
eventSubject: 'scrollDown',
|
|
19014
19040
|
eventDescription: 'User scroll down',
|
|
19015
19041
|
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 : '',
|
|
19016
|
-
|
|
19042
|
+
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 : '',
|
|
19043
|
+
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 : '',
|
|
19017
19044
|
requestId: null,
|
|
19018
|
-
traceInfo: (
|
|
19045
|
+
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 : '',
|
|
19019
19046
|
contentFormat,
|
|
19020
|
-
position: ((
|
|
19047
|
+
position: ((_q = swiper.previousIndex) !== null && _q !== void 0 ? _q : 0) + ''
|
|
19021
19048
|
}
|
|
19022
19049
|
});
|
|
19023
19050
|
// 如果上一个商品是图片集，需上报 浏览图片集结结束 事件
|
|
@@ -19029,12 +19056,13 @@ Made in Italy` })));
|
|
|
19029
19056
|
eventInfo: {
|
|
19030
19057
|
eventSubject: 'scrollUp',
|
|
19031
19058
|
eventDescription: 'User scroll up',
|
|
19032
|
-
contentId: (
|
|
19033
|
-
|
|
19059
|
+
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 : '',
|
|
19060
|
+
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 : '',
|
|
19061
|
+
productId: (_x = (_w = item.product) === null || _w === void 0 ? void 0 : _w.itemId) !== null && _x !== void 0 ? _x : '',
|
|
19034
19062
|
requestId: null,
|
|
19035
|
-
traceInfo: (
|
|
19063
|
+
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 : '',
|
|
19036
19064
|
contentFormat,
|
|
19037
|
-
position: ((
|
|
19065
|
+
position: ((_2 = swiper.previousIndex) !== null && _2 !== void 0 ? _2 : 0) + ''
|
|
19038
19066
|
}
|
|
19039
19067
|
});
|
|
19040
19068
|
// 如果上一个商品是图片集，需上报 浏览图片集结结束 事件
|
|
@@ -19060,7 +19088,7 @@ Made in Italy` })));
|
|
|
19060
19088
|
}
|
|
19061
19089
|
}, [openHashtag, data, activeIndex]);
|
|
19062
19090
|
const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
|
|
19063
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
19091
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
19064
19092
|
const item = data[activeIndex];
|
|
19065
19093
|
// 如果是图片集则上报事件
|
|
19066
19094
|
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)) {
|
|
@@ -19071,9 +19099,10 @@ Made in Italy` })));
|
|
|
19071
19099
|
eventSubject: 'viewImageCarouselStart',
|
|
19072
19100
|
eventDescription: 'User start view the image carousel',
|
|
19073
19101
|
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 : '',
|
|
19074
|
-
|
|
19102
|
+
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 : '',
|
|
19103
|
+
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
|
19075
19104
|
imageStartTime: `${startTime}`,
|
|
19076
|
-
contentTags: JSON.stringify((
|
|
19105
|
+
contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
|
|
19077
19106
|
position: activeIndex + '',
|
|
19078
19107
|
contentFormat: 'image',
|
|
19079
19108
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
|
|
@@ -19083,11 +19112,11 @@ Made in Italy` })));
|
|
|
19083
19112
|
if (enableCapi) {
|
|
19084
19113
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
19085
19114
|
eventName: 'ViewContent',
|
|
19086
|
-
product: (
|
|
19115
|
+
product: (_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.bindProduct
|
|
19087
19116
|
});
|
|
19088
19117
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
19089
19118
|
eventName: 'PageView',
|
|
19090
|
-
product: (
|
|
19119
|
+
product: (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.bindProduct
|
|
19091
19120
|
});
|
|
19092
19121
|
}
|
|
19093
19122
|
}
|
|
@@ -19240,7 +19269,7 @@ Made in Italy` })));
|
|
|
19240
19269
|
}, []);
|
|
19241
19270
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
|
19242
19271
|
const handlePlaying = React.useCallback(() => {
|
|
19243
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
19272
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
19244
19273
|
setIsPauseVideo(false);
|
|
19245
19274
|
const item = data[index];
|
|
19246
19275
|
if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
|
|
@@ -19253,14 +19282,15 @@ Made in Italy` })));
|
|
|
19253
19282
|
eventSubject: 'playVideo',
|
|
19254
19283
|
eventDescription: 'User played the video',
|
|
19255
19284
|
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 : '',
|
|
19256
|
-
|
|
19285
|
+
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 : '',
|
|
19286
|
+
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 : '',
|
|
19257
19287
|
playType,
|
|
19258
19288
|
startTime: videoCurrentTime,
|
|
19259
19289
|
videoDuration,
|
|
19260
|
-
contentTags: JSON.stringify((
|
|
19290
|
+
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 : []),
|
|
19261
19291
|
position: index + '',
|
|
19262
19292
|
contentFormat: 'video',
|
|
19263
|
-
traceInfo: (
|
|
19293
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
19264
19294
|
}
|
|
19265
19295
|
});
|
|
19266
19296
|
setIsFirstPlay(false);
|
|
@@ -19299,7 +19329,7 @@ Made in Italy` })));
|
|
|
19299
19329
|
}
|
|
19300
19330
|
}, [isLoadFinish]);
|
|
19301
19331
|
const onPause = React.useCallback(() => {
|
|
19302
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
19332
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
19303
19333
|
const item = data[index];
|
|
19304
19334
|
const videoDuration = ((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
|
|
19305
19335
|
const videoCurrentTime = ((_d = (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
|
|
@@ -19310,14 +19340,15 @@ Made in Italy` })));
|
|
|
19310
19340
|
eventSubject: 'playOverVideo',
|
|
19311
19341
|
eventDescription: 'User finished playing the video',
|
|
19312
19342
|
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 : '',
|
|
19313
|
-
|
|
19343
|
+
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 : '',
|
|
19344
|
+
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 : '',
|
|
19314
19345
|
endTime: videoCurrentTime,
|
|
19315
19346
|
videoDuration,
|
|
19316
19347
|
playDuration,
|
|
19317
|
-
contentTags: JSON.stringify((
|
|
19348
|
+
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 : []),
|
|
19318
19349
|
position: index + '',
|
|
19319
19350
|
contentFormat: 'video',
|
|
19320
|
-
traceInfo: (
|
|
19351
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
19321
19352
|
}
|
|
19322
19353
|
});
|
|
19323
19354
|
}
|