pb-sxp-ui 1.16.8 → 1.16.10
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 +166 -131
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +1 -0
- package/dist/index.js +166 -131
- 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 +166 -131
- 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 +42 -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 +47 -36
- package/es/core/context/SxpDataSourceProvider.js +6 -7
- 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 +41 -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 +47 -36
- package/lib/core/context/SxpDataSourceProvider.js +6 -7
- package/lib/core/hooks/useEventReport.js +6 -5
- package/package.json +1 -1
package/dist/pb-ui.js
CHANGED
|
@@ -832,15 +832,14 @@
|
|
|
832
832
|
if (!(query === null || query === void 0 ? void 0 : query.hashTag))
|
|
833
833
|
setCurReqInfo({ rtc: result.data.rtc, requestId: result.data.requestId });
|
|
834
834
|
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) && !isEditor) {
|
|
835
|
-
|
|
836
|
-
list = list.concat((_s = (_r = (_q = (_p = result === null || result === void 0 ? void 0 : result.data) === null || _p === void 0 ? void 0 : _p.recList) === null || _q === void 0 ? void 0 : _q.filter) === null || _r === void 0 ? void 0 : _r.call(_q, (item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video))) !== null && _s !== void 0 ? _s : []);
|
|
837
|
-
const isNotNullList = (_u = (_t = result === null || result === void 0 ? void 0 : result.data) === null || _t === void 0 ? void 0 : _t.recList) === null || _u === void 0 ? void 0 : _u.some((item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video));
|
|
835
|
+
const isNotNullList = (_q = (_p = result === null || result === void 0 ? void 0 : result.data) === null || _p === void 0 ? void 0 : _p.recList) === null || _q === void 0 ? void 0 : _q.some((item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video));
|
|
838
836
|
if (!isNotNullList) {
|
|
839
837
|
setIsNoMoreData(true);
|
|
840
838
|
}
|
|
841
|
-
return Object.assign(Object.assign({}, result.data), { recList: list });
|
|
842
839
|
}
|
|
843
|
-
|
|
840
|
+
let list = [];
|
|
841
|
+
list = list.concat((_u = (_t = (_s = (_r = result === null || result === void 0 ? void 0 : result.data) === null || _r === void 0 ? void 0 : _r.recList) === null || _s === void 0 ? void 0 : _s.filter) === null || _t === void 0 ? void 0 : _t.call(_s, (item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video))) !== null && _u !== void 0 ? _u : []);
|
|
842
|
+
return Object.assign(Object.assign({}, result.data), { recList: list });
|
|
844
843
|
}), [bffFetch, utmVal, maxSize, defaultSize, channelQueryList, channel, chatlabsId, bffFetchAdmin]);
|
|
845
844
|
const loadVideos = React.useCallback((pageNum) => __awaiter(void 0, void 0, void 0, function* () {
|
|
846
845
|
var _1, _2, _3, _4;
|
|
@@ -1079,7 +1078,7 @@
|
|
|
1079
1078
|
}
|
|
1080
1079
|
}), [bffFetch, utmVal]);
|
|
1081
1080
|
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;
|
|
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;
|
|
1083
1082
|
const cta = product === null || product === void 0 ? void 0 : product.bindCta;
|
|
1084
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);
|
|
1085
1084
|
let fromKName = '';
|
|
@@ -1097,7 +1096,7 @@
|
|
|
1097
1096
|
}
|
|
1098
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;
|
|
1099
1098
|
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: (
|
|
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 })
|
|
1101
1100
|
});
|
|
1102
1101
|
}, [bffEventReport, isFromHashtag]);
|
|
1103
1102
|
const h5EnterLink = React.useCallback(() => {
|
|
@@ -1758,14 +1757,14 @@
|
|
|
1758
1757
|
* @Author: binruan@chatlabs.com
|
|
1759
1758
|
* @Date: 2024-03-12 10:59:06
|
|
1760
1759
|
* @LastEditors: binruan@chatlabs.com
|
|
1761
|
-
* @LastEditTime:
|
|
1760
|
+
* @LastEditTime: 2025-05-09 15:30:59
|
|
1762
1761
|
* @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
|
|
1763
1762
|
*
|
|
1764
1763
|
*/
|
|
1765
1764
|
function useEventReport() {
|
|
1766
1765
|
const { bffEventReport, popupDetailData, isFromHashtag, eventTimeList, setEventTimeList } = useSxpDataSource();
|
|
1767
1766
|
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;
|
|
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;
|
|
1769
1768
|
const i = eventTimeList === null || eventTimeList === void 0 ? void 0 : eventTimeList.findIndex((item) => item.target === (e === null || e === void 0 ? void 0 : e.target));
|
|
1770
1769
|
if (i !== -1) {
|
|
1771
1770
|
return;
|
|
@@ -1798,11 +1797,11 @@
|
|
|
1798
1797
|
contentFormat = 'image';
|
|
1799
1798
|
}
|
|
1800
1799
|
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 : '',
|
|
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 }))
|
|
1802
1801
|
});
|
|
1803
1802
|
}, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
|
|
1804
1803
|
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;
|
|
1804
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
|
1806
1805
|
let fromKName = '';
|
|
1807
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))) {
|
|
1808
1807
|
fromKName = 'pdpPage';
|
|
@@ -1821,8 +1820,9 @@
|
|
|
1821
1820
|
contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags),
|
|
1822
1821
|
position: position + '',
|
|
1823
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
1824
|
ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
|
|
1825
|
-
traceInfo: (
|
|
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 : '',
|
|
1826
1826
|
timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
|
|
1827
1827
|
eventSubject: 'productView',
|
|
1828
1828
|
eventDescription: 'User browsed the product'
|
|
@@ -15625,7 +15625,7 @@ Made in Italy` })));
|
|
|
15625
15625
|
* @Author: binruan@chatlabs.com
|
|
15626
15626
|
* @Date: 2024-01-10 10:58:24
|
|
15627
15627
|
* @LastEditors: binruan@chatlabs.com
|
|
15628
|
-
* @LastEditTime: 2025-
|
|
15628
|
+
* @LastEditTime: 2025-05-09 15:30:41
|
|
15629
15629
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\WaterFall\index.tsx
|
|
15630
15630
|
*
|
|
15631
15631
|
*/
|
|
@@ -15663,7 +15663,7 @@ Made in Italy` })));
|
|
|
15663
15663
|
}
|
|
15664
15664
|
}, [waterFallData]);
|
|
15665
15665
|
const reportTagsView = React.useCallback(() => {
|
|
15666
|
-
var _a, _b, _c, _d, _e, _f;
|
|
15666
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
15667
15667
|
const rec = recData === null || recData === void 0 ? void 0 : recData.rec;
|
|
15668
15668
|
if (!rec)
|
|
15669
15669
|
return;
|
|
@@ -15683,9 +15683,10 @@ Made in Italy` })));
|
|
|
15683
15683
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
15684
15684
|
eventInfo: {
|
|
15685
15685
|
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 : '',
|
|
15686
15687
|
position: cacheActiveIndex + '',
|
|
15687
|
-
contentTags: JSON.stringify((
|
|
15688
|
-
traceInfo: (
|
|
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,
|
|
15689
15690
|
hashTags: JSON.stringify([recData === null || recData === void 0 ? void 0 : recData.hashTag]),
|
|
15690
15691
|
fromKName,
|
|
15691
15692
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
|
@@ -17767,7 +17768,7 @@ Made in Italy` })));
|
|
|
17767
17768
|
const likeIcon = useIconLink(defaultLikeIconPath$2);
|
|
17768
17769
|
const unlikeIcon = useIconLink(defaultUnLikeIconPath$2);
|
|
17769
17770
|
const handleClick = lodash.debounce(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
17770
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
|
|
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;
|
|
17771
17772
|
if (state) {
|
|
17772
17773
|
// 先设置状态
|
|
17773
17774
|
setState(false);
|
|
@@ -17777,11 +17778,12 @@ Made in Italy` })));
|
|
|
17777
17778
|
eventSubject: 'favoriteContentCanceled',
|
|
17778
17779
|
eventDescription: 'This content was unfavorite by the user',
|
|
17779
17780
|
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 : '',
|
|
17780
|
-
|
|
17781
|
-
|
|
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 : []),
|
|
17782
17784
|
position: position + '',
|
|
17783
|
-
contentFormat: ((
|
|
17784
|
-
traceInfo: (
|
|
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
|
|
17785
17787
|
}
|
|
17786
17788
|
});
|
|
17787
17789
|
// 如果接口调用失败，则回滚状态
|
|
@@ -17789,40 +17791,41 @@ Made in Italy` })));
|
|
|
17789
17791
|
setState(true);
|
|
17790
17792
|
}
|
|
17791
17793
|
else {
|
|
17792
|
-
const nRtcList = (
|
|
17794
|
+
const nRtcList = (_s = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
|
17793
17795
|
if (index === position) {
|
|
17794
17796
|
item.isCollected = false;
|
|
17795
17797
|
}
|
|
17796
17798
|
return item;
|
|
17797
|
-
})) !== null &&
|
|
17799
|
+
})) !== null && _s !== void 0 ? _s : [];
|
|
17798
17800
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
|
17799
17801
|
}
|
|
17800
17802
|
}
|
|
17801
17803
|
else {
|
|
17802
17804
|
setState(true);
|
|
17803
|
-
const result = (
|
|
17805
|
+
const result = (_t = (yield (mutateLike === null || mutateLike === void 0 ? void 0 : mutateLike({ content: JSON.stringify(recData) })))) !== null && _t !== void 0 ? _t : false;
|
|
17804
17806
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
17805
17807
|
eventInfo: {
|
|
17806
17808
|
eventSubject: 'favoriteContent',
|
|
17807
17809
|
eventDescription: 'This content was favorite by the user',
|
|
17808
|
-
contentId: (
|
|
17809
|
-
|
|
17810
|
-
|
|
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 : []),
|
|
17811
17814
|
position: position + '',
|
|
17812
|
-
contentFormat: ((
|
|
17813
|
-
traceInfo: (
|
|
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
|
|
17814
17817
|
}
|
|
17815
17818
|
});
|
|
17816
17819
|
if (!result) {
|
|
17817
17820
|
setState(false);
|
|
17818
17821
|
}
|
|
17819
17822
|
else {
|
|
17820
|
-
const nRtcList = (
|
|
17823
|
+
const nRtcList = (_5 = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
|
17821
17824
|
if (index === position) {
|
|
17822
17825
|
item.isCollected = true;
|
|
17823
17826
|
}
|
|
17824
17827
|
return item;
|
|
17825
|
-
})) !== null &&
|
|
17828
|
+
})) !== null && _5 !== void 0 ? _5 : [];
|
|
17826
17829
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
|
17827
17830
|
}
|
|
17828
17831
|
}
|
|
@@ -17925,6 +17928,26 @@ Made in Italy` })));
|
|
|
17925
17928
|
return;
|
|
17926
17929
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
|
17927
17930
|
}, [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
|
+
};
|
|
17928
17951
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
|
17929
17952
|
const handlePlaying = React.useCallback(() => {
|
|
17930
17953
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
@@ -17933,7 +17956,7 @@ Made in Italy` })));
|
|
|
17933
17956
|
setIsLoadFinish(true);
|
|
17934
17957
|
}, []);
|
|
17935
17958
|
const handleStartPlay = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
17936
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
|
17959
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
|
17937
17960
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
17938
17961
|
return;
|
|
17939
17962
|
setIsPauseVideo(false);
|
|
@@ -17944,16 +17967,11 @@ Made in Italy` })));
|
|
|
17944
17967
|
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);
|
|
17945
17968
|
const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
|
|
17946
17969
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
17947
|
-
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 : '',
|
|
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) + '' }))
|
|
17948
17971
|
});
|
|
17949
17972
|
isFirstPlayRef.current = false;
|
|
17950
17973
|
}
|
|
17951
17974
|
}), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
17952
|
-
const setCurrentTimeByStartTime = React.useCallback(() => {
|
|
17953
|
-
if (isDiyH5) {
|
|
17954
|
-
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
|
17955
|
-
}
|
|
17956
|
-
}, []);
|
|
17957
17975
|
const handLoadeddata = React.useCallback(() => {
|
|
17958
17976
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
|
|
17959
17977
|
return;
|
|
@@ -17978,13 +17996,12 @@ Made in Italy` })));
|
|
|
17978
17996
|
const handleLoadedmetadata = React.useCallback(() => {
|
|
17979
17997
|
if (!videoRef.current)
|
|
17980
17998
|
return;
|
|
17981
|
-
setCurrentTimeByStartTime();
|
|
17982
17999
|
loadedTimeRef.current = new Date();
|
|
17983
18000
|
handleStartPlay();
|
|
17984
18001
|
handLoadeddata();
|
|
17985
18002
|
}, [videoRef.current, handLoadeddata, handleStartPlay]);
|
|
17986
18003
|
const handleClickVideo = React.useCallback((type) => () => {
|
|
17987
|
-
var _a, _b, _c, _d, _e
|
|
18004
|
+
var _a, _b, _c, _d, _e;
|
|
17988
18005
|
if (!videoRef.current)
|
|
17989
18006
|
return;
|
|
17990
18007
|
if (!isLoadFinish)
|
|
@@ -18005,20 +18022,17 @@ Made in Italy` })));
|
|
|
18005
18022
|
break;
|
|
18006
18023
|
default:
|
|
18007
18024
|
if (isPause) {
|
|
18008
|
-
|
|
18009
|
-
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
|
18010
|
-
}
|
|
18011
|
-
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
|
|
18025
|
+
(_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.play();
|
|
18012
18026
|
}
|
|
18013
18027
|
else {
|
|
18014
|
-
(
|
|
18028
|
+
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.pause();
|
|
18015
18029
|
}
|
|
18016
18030
|
setIsPauseVideo(!isPause);
|
|
18017
18031
|
break;
|
|
18018
18032
|
}
|
|
18019
18033
|
}, [isLoadFinish, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
18020
18034
|
const handlePause = React.useCallback(() => {
|
|
18021
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
18035
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
18022
18036
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
18023
18037
|
return;
|
|
18024
18038
|
if (activeIndex !== index)
|
|
@@ -18034,14 +18048,15 @@ Made in Italy` })));
|
|
|
18034
18048
|
eventSubject: 'playOverVideo',
|
|
18035
18049
|
eventDescription: 'User finished playing the video',
|
|
18036
18050
|
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 : '',
|
|
18037
|
-
|
|
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 : '',
|
|
18038
18053
|
endTime: videoCurrentTime,
|
|
18039
18054
|
videoDuration,
|
|
18040
18055
|
playDuration,
|
|
18041
|
-
contentTags: JSON.stringify((
|
|
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 : []),
|
|
18042
18057
|
position: index + '',
|
|
18043
18058
|
contentFormat: 'video',
|
|
18044
|
-
traceInfo: (
|
|
18059
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
18045
18060
|
}
|
|
18046
18061
|
});
|
|
18047
18062
|
}
|
|
@@ -18049,27 +18064,8 @@ Made in Italy` })));
|
|
|
18049
18064
|
const handleWaiting = React.useCallback(() => {
|
|
18050
18065
|
setWaiting(true);
|
|
18051
18066
|
}, []);
|
|
18052
|
-
const handleTimeUpload = () => {
|
|
18053
|
-
if (!videoRef.current || !isDiyH5)
|
|
18054
|
-
return;
|
|
18055
|
-
setTimeout(() => {
|
|
18056
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
18057
|
-
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)) {
|
|
18058
|
-
(_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
|
|
18059
|
-
if (!loopPlayRef.current)
|
|
18060
|
-
return;
|
|
18061
|
-
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
|
18062
|
-
(_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);
|
|
18063
|
-
}
|
|
18064
|
-
else {
|
|
18065
|
-
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;
|
|
18066
|
-
(_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);
|
|
18067
|
-
}
|
|
18068
|
-
}
|
|
18069
|
-
});
|
|
18070
|
-
};
|
|
18071
18067
|
React.useEffect(() => {
|
|
18072
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
|
18068
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18073
18069
|
if (!isActive)
|
|
18074
18070
|
return;
|
|
18075
18071
|
const videoSrc = videoUrl;
|
|
@@ -18090,7 +18086,6 @@ Made in Italy` })));
|
|
|
18090
18086
|
hls === null || hls === void 0 ? void 0 : hls.attachMedia(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current);
|
|
18091
18087
|
hls === null || hls === void 0 ? void 0 : hls.on(Hls.Events.MANIFEST_PARSED, function () {
|
|
18092
18088
|
var _a;
|
|
18093
|
-
setCurrentTimeByStartTime();
|
|
18094
18089
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
|
18095
18090
|
});
|
|
18096
18091
|
}
|
|
@@ -18104,12 +18099,11 @@ Made in Italy` })));
|
|
|
18104
18099
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.addEventListener('play', handleStartPlay);
|
|
18105
18100
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.addEventListener('playing', handlePlaying);
|
|
18106
18101
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.addEventListener('pause', handlePause);
|
|
18107
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended',
|
|
18102
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handleEnd);
|
|
18108
18103
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.addEventListener('canplay', handlePlay);
|
|
18109
18104
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
|
|
18110
|
-
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.addEventListener('timeupdate', handleTimeUpload);
|
|
18111
18105
|
return () => {
|
|
18112
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
|
18106
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18113
18107
|
const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
|
|
18114
18108
|
if (!isPause)
|
|
18115
18109
|
handlePause();
|
|
@@ -18121,10 +18115,9 @@ Made in Italy` })));
|
|
|
18121
18115
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.removeEventListener('play', handleStartPlay);
|
|
18122
18116
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.removeEventListener('playing', handlePlaying);
|
|
18123
18117
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.removeEventListener('pause', handlePause);
|
|
18124
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended',
|
|
18118
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handleEnd);
|
|
18125
18119
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('canplay', handlePlay);
|
|
18126
18120
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.removeEventListener('waiting', handleWaiting);
|
|
18127
|
-
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.removeEventListener('timeupdate', handleTimeUpload);
|
|
18128
18121
|
};
|
|
18129
18122
|
}, [isActive]);
|
|
18130
18123
|
React.useEffect(() => {
|
|
@@ -18335,19 +18328,48 @@ Made in Italy` })));
|
|
|
18335
18328
|
}, onLoad: onShowFirstImage }))));
|
|
18336
18329
|
};
|
|
18337
18330
|
|
|
18338
|
-
const PictureGroup$4 = ({ imgUrls,
|
|
18331
|
+
const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig, swiperRef }, ref) => {
|
|
18339
18332
|
var _a, _b;
|
|
18340
18333
|
const { isActive } = useSwiperSlide();
|
|
18341
|
-
const { sxpParameter, openHashtag } = useSxpDataSource();
|
|
18334
|
+
const { sxpParameter, openHashtag, isDiyH5 } = useSxpDataSource();
|
|
18342
18335
|
const [isLoad, setIsLoad] = React.useState(false);
|
|
18343
18336
|
const [imgInfo, setImgInfo] = React.useState();
|
|
18344
18337
|
const [swiperActiveIndex, setSwiperActiveIndex] = React.useState(0);
|
|
18345
|
-
const
|
|
18338
|
+
const imgsSwiperRef = React.useRef();
|
|
18346
18339
|
const isFirstPlayRef = React.useRef(true);
|
|
18340
|
+
const loopPlayRef = React.useRef(true);
|
|
18347
18341
|
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]);
|
|
18348
18370
|
React.useEffect(() => {
|
|
18349
18371
|
if (isLoad && isActive) {
|
|
18350
|
-
(
|
|
18372
|
+
(imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.start();
|
|
18351
18373
|
if (openHashtag) {
|
|
18352
18374
|
onViewImageEndEvent(rec);
|
|
18353
18375
|
}
|
|
@@ -18357,7 +18379,7 @@ Made in Italy` })));
|
|
|
18357
18379
|
}
|
|
18358
18380
|
}
|
|
18359
18381
|
else {
|
|
18360
|
-
(
|
|
18382
|
+
(imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.stop();
|
|
18361
18383
|
}
|
|
18362
18384
|
}, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
|
|
18363
18385
|
const showFirstImageFn = React.useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
|
|
@@ -18384,13 +18406,13 @@ Made in Italy` })));
|
|
|
18384
18406
|
};
|
|
18385
18407
|
}, [isActive, imgInfo]);
|
|
18386
18408
|
const handleMouseEnter = React.useCallback(() => {
|
|
18387
|
-
if (
|
|
18388
|
-
|
|
18409
|
+
if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
|
|
18410
|
+
imgsSwiperRef.current.swiper.autoplay.stop();
|
|
18389
18411
|
}
|
|
18390
18412
|
}, []);
|
|
18391
18413
|
const handleMouseLeave = React.useCallback(() => {
|
|
18392
|
-
if (
|
|
18393
|
-
|
|
18414
|
+
if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
|
|
18415
|
+
imgsSwiperRef.current.swiper.autoplay.start();
|
|
18394
18416
|
}
|
|
18395
18417
|
}, []);
|
|
18396
18418
|
const handleSlideChange = React.useCallback((swiper) => {
|
|
@@ -18411,7 +18433,7 @@ Made in Italy` })));
|
|
|
18411
18433
|
enabled: true
|
|
18412
18434
|
}
|
|
18413
18435
|
}
|
|
18414
|
-
: {}), { loop: true, ref:
|
|
18436
|
+
: {}), { loop: true, ref: imgsSwiperRef, onSlideChange: handleSlideChange, className: css.css(Object.assign(Object.assign({ '.swiper-pagination': {
|
|
18415
18437
|
bottom: (_a = imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.marginBottom) !== null && _a !== void 0 ? _a : 0,
|
|
18416
18438
|
fontSize: '14px'
|
|
18417
18439
|
} }, ((imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.dotsBgColor) && {
|
|
@@ -18428,7 +18450,7 @@ Made in Italy` })));
|
|
|
18428
18450
|
return (React.createElement(SwiperSlide, { key: srcKey, "aria-hidden": srcKey !== swiperActiveIndex },
|
|
18429
18451
|
React.createElement(Picture, { src: !isLoad && srcKey > 0 ? '' : url, height: height, imgUrlsPostConfig: imgUrlsPostConfig, onShowFirstImage: showFirstImageFn })));
|
|
18430
18452
|
}))));
|
|
18431
|
-
};
|
|
18453
|
+
});
|
|
18432
18454
|
var PictureGroup$5 = React.memo(PictureGroup$4);
|
|
18433
18455
|
|
|
18434
18456
|
/*
|
|
@@ -18708,7 +18730,7 @@ Made in Italy` })));
|
|
|
18708
18730
|
* @Author: binruan@chatlabs.com
|
|
18709
18731
|
* @Date: 2024-03-20 10:27:31
|
|
18710
18732
|
* @LastEditors: binruan@chatlabs.com
|
|
18711
|
-
* @LastEditTime: 2025-05-
|
|
18733
|
+
* @LastEditTime: 2025-05-12 14:26:15
|
|
18712
18734
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
|
18713
18735
|
*
|
|
18714
18736
|
*/
|
|
@@ -18728,6 +18750,7 @@ Made in Italy` })));
|
|
|
18728
18750
|
const skipLinkRef = React.useRef(false);
|
|
18729
18751
|
const [pageNum, setPageNum] = React.useState(2);
|
|
18730
18752
|
const videoWidgetRef = React.useRef(null);
|
|
18753
|
+
const pictureGroupRef = React.useRef(null);
|
|
18731
18754
|
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();
|
|
18732
18755
|
const { backMainFeed, productView, jumpToWeb } = useEventReport();
|
|
18733
18756
|
const isShowFingerTip = React.useMemo(() => {
|
|
@@ -18775,7 +18798,7 @@ Made in Italy` })));
|
|
|
18775
18798
|
(_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
|
|
18776
18799
|
}, [data, ctaType, swiperRef]);
|
|
18777
18800
|
const handleSessionCompleted = React.useCallback((fk) => {
|
|
18778
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
|
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;
|
|
18779
18802
|
const item = data === null || data === void 0 ? void 0 : data[activeIndex];
|
|
18780
18803
|
let fromKName = '';
|
|
18781
18804
|
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))) {
|
|
@@ -18802,12 +18825,13 @@ Made in Italy` })));
|
|
|
18802
18825
|
eventSubject: 'sessionCompleted',
|
|
18803
18826
|
eventDescription: 'Session completed',
|
|
18804
18827
|
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
|
18805
|
-
|
|
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,
|
|
18806
18830
|
position: activeIndex + '',
|
|
18807
18831
|
fromKName: fk || fromKName,
|
|
18808
18832
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
|
18809
|
-
ctatId: (
|
|
18810
|
-
traceInfo: (
|
|
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 : ''
|
|
18811
18835
|
}
|
|
18812
18836
|
});
|
|
18813
18837
|
}, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime]);
|
|
@@ -18866,8 +18890,9 @@ Made in Italy` })));
|
|
|
18866
18890
|
refreshFeSession
|
|
18867
18891
|
]);
|
|
18868
18892
|
const handleSessionExpire = React.useCallback(lodash.debounce(() => {
|
|
18869
|
-
var _a;
|
|
18893
|
+
var _a, _b;
|
|
18870
18894
|
(_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);
|
|
18871
18896
|
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
|
|
18872
18897
|
}, 1000), [handleSessionCompleted, refreshFeSession]);
|
|
18873
18898
|
React.useEffect(() => {
|
|
@@ -18937,18 +18962,18 @@ Made in Italy` })));
|
|
|
18937
18962
|
return null;
|
|
18938
18963
|
}, [globalConfig, activeIndex, visList]);
|
|
18939
18964
|
const renderContent = React.useCallback((rec, index) => {
|
|
18940
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18965
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
18941
18966
|
if (rec === 'organic menu') {
|
|
18942
18967
|
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)));
|
|
18943
18968
|
}
|
|
18944
|
-
if ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null ||
|
|
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)) {
|
|
18945
18970
|
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 })));
|
|
18946
18971
|
}
|
|
18947
|
-
if ((
|
|
18948
|
-
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 }));
|
|
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 })));
|
|
18949
18974
|
}
|
|
18950
|
-
if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((
|
|
18951
|
-
return (
|
|
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) => {
|
|
18952
18977
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
18953
18978
|
const t = resolver[(_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type];
|
|
18954
18979
|
const Component = withBindDataSource(t);
|
|
@@ -18986,7 +19011,7 @@ Made in Italy` })));
|
|
|
18986
19011
|
};
|
|
18987
19012
|
}, [isShowMore]);
|
|
18988
19013
|
const renderBottom = React.useCallback((rec, index) => {
|
|
18989
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
|
19014
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
|
18990
19015
|
if (rec === null || rec === void 0 ? void 0 : rec.video) {
|
|
18991
19016
|
let cta = null;
|
|
18992
19017
|
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) {
|
|
@@ -18995,24 +19020,27 @@ Made in Italy` })));
|
|
|
18995
19020
|
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
|
|
18996
19021
|
cta = '商品CTA';
|
|
18997
19022
|
}
|
|
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
|
+
}
|
|
18998
19026
|
else {
|
|
18999
|
-
cta = (
|
|
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;
|
|
19000
19028
|
}
|
|
19001
19029
|
const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
|
|
19002
19030
|
const isNineProduct = (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nineProductEnable) &&
|
|
19003
19031
|
index === ((rtcList === null || rtcList === void 0 ? void 0 : rtcList[0]) === 'organic menu' ? 2 : 1) &&
|
|
19004
|
-
((
|
|
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));
|
|
19005
19033
|
return (React.createElement(React.Fragment, null,
|
|
19006
19034
|
isNineProduct && (React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value, isNineProduct: isNineProduct })),
|
|
19007
|
-
((
|
|
19008
|
-
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(
|
|
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` } },
|
|
19009
19037
|
React.createElement(Nudge, { nudge: nudge }),
|
|
19010
19038
|
((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' },
|
|
19011
19039
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
|
|
19012
19040
|
React.createElement("div", null,
|
|
19013
|
-
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: (
|
|
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 }),
|
|
19014
19042
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
|
|
19015
|
-
React.createElement(Hashtag$1, { index: activeIndex, tags: (
|
|
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) }))),
|
|
19016
19044
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
|
|
19017
19045
|
}
|
|
19018
19046
|
return null;
|
|
@@ -19051,7 +19079,7 @@ Made in Italy` })));
|
|
|
19051
19079
|
return null;
|
|
19052
19080
|
}, [globalConfig, waterFallData]);
|
|
19053
19081
|
const handleViewImageStartEnd = (item) => {
|
|
19054
|
-
var _a, _b, _c, _d, _e, _f;
|
|
19082
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
19055
19083
|
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)) {
|
|
19056
19084
|
const endTime = Date.now();
|
|
19057
19085
|
const duration = viewImageStartTime.current === 0 ? 0 : (endTime - viewImageStartTime.current) / 1000;
|
|
@@ -19060,10 +19088,11 @@ Made in Italy` })));
|
|
|
19060
19088
|
eventSubject: 'viewImageCarouselEnd',
|
|
19061
19089
|
eventDescription: 'User end view the image carousel',
|
|
19062
19090
|
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 : '',
|
|
19063
|
-
|
|
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 : '',
|
|
19064
19093
|
imageEndTime: `${endTime}`,
|
|
19065
19094
|
playDuration: `${duration}`,
|
|
19066
|
-
contentTags: JSON.stringify((
|
|
19095
|
+
contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
|
|
19067
19096
|
position: activeIndex + '',
|
|
19068
19097
|
contentFormat: 'image',
|
|
19069
19098
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo
|
|
@@ -19072,7 +19101,7 @@ Made in Italy` })));
|
|
|
19072
19101
|
}
|
|
19073
19102
|
};
|
|
19074
19103
|
const handleSlideSkip = (item, position) => {
|
|
19075
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
|
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;
|
|
19076
19105
|
if (isPreview || waterFallData)
|
|
19077
19106
|
return;
|
|
19078
19107
|
const t = new Date() - curTime.current;
|
|
@@ -19098,7 +19127,8 @@ Made in Italy` })));
|
|
|
19098
19127
|
contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
|
|
19099
19128
|
position: position + '',
|
|
19100
19129
|
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 : '',
|
|
19101
|
-
|
|
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 : '',
|
|
19102
19132
|
contentFormat
|
|
19103
19133
|
}
|
|
19104
19134
|
});
|
|
@@ -19108,7 +19138,7 @@ Made in Italy` })));
|
|
|
19108
19138
|
}
|
|
19109
19139
|
};
|
|
19110
19140
|
const handleScrollEvent = (swiper) => {
|
|
19111
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
|
|
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;
|
|
19112
19142
|
const item = data[swiper.previousIndex];
|
|
19113
19143
|
if (!item)
|
|
19114
19144
|
return;
|
|
@@ -19125,11 +19155,12 @@ Made in Italy` })));
|
|
|
19125
19155
|
eventSubject: 'scrollDown',
|
|
19126
19156
|
eventDescription: 'User scroll down',
|
|
19127
19157
|
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 : '',
|
|
19128
|
-
|
|
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 : '',
|
|
19129
19160
|
requestId: null,
|
|
19130
|
-
traceInfo: (
|
|
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 : '',
|
|
19131
19162
|
contentFormat,
|
|
19132
|
-
position: ((
|
|
19163
|
+
position: ((_q = swiper.previousIndex) !== null && _q !== void 0 ? _q : 0) + ''
|
|
19133
19164
|
}
|
|
19134
19165
|
});
|
|
19135
19166
|
// 如果上一个商品是图片集，需上报 浏览图片集结结束 事件
|
|
@@ -19141,12 +19172,13 @@ Made in Italy` })));
|
|
|
19141
19172
|
eventInfo: {
|
|
19142
19173
|
eventSubject: 'scrollUp',
|
|
19143
19174
|
eventDescription: 'User scroll up',
|
|
19144
|
-
contentId: (
|
|
19145
|
-
|
|
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 : '',
|
|
19146
19178
|
requestId: null,
|
|
19147
|
-
traceInfo: (
|
|
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 : '',
|
|
19148
19180
|
contentFormat,
|
|
19149
|
-
position: ((
|
|
19181
|
+
position: ((_2 = swiper.previousIndex) !== null && _2 !== void 0 ? _2 : 0) + ''
|
|
19150
19182
|
}
|
|
19151
19183
|
});
|
|
19152
19184
|
// 如果上一个商品是图片集，需上报 浏览图片集结结束 事件
|
|
@@ -19172,7 +19204,7 @@ Made in Italy` })));
|
|
|
19172
19204
|
}
|
|
19173
19205
|
}, [openHashtag, data, activeIndex]);
|
|
19174
19206
|
const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
|
|
19175
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
19207
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
19176
19208
|
const item = data[activeIndex];
|
|
19177
19209
|
// 如果是图片集则上报事件
|
|
19178
19210
|
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)) {
|
|
@@ -19183,9 +19215,10 @@ Made in Italy` })));
|
|
|
19183
19215
|
eventSubject: 'viewImageCarouselStart',
|
|
19184
19216
|
eventDescription: 'User start view the image carousel',
|
|
19185
19217
|
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 : '',
|
|
19186
|
-
|
|
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 : '',
|
|
19187
19220
|
imageStartTime: `${startTime}`,
|
|
19188
|
-
contentTags: JSON.stringify((
|
|
19221
|
+
contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
|
|
19189
19222
|
position: activeIndex + '',
|
|
19190
19223
|
contentFormat: 'image',
|
|
19191
19224
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
|
|
@@ -19195,11 +19228,11 @@ Made in Italy` })));
|
|
|
19195
19228
|
if (enableCapi) {
|
|
19196
19229
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
19197
19230
|
eventName: 'ViewContent',
|
|
19198
|
-
product: (
|
|
19231
|
+
product: (_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.bindProduct
|
|
19199
19232
|
});
|
|
19200
19233
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
19201
19234
|
eventName: 'PageView',
|
|
19202
|
-
product: (
|
|
19235
|
+
product: (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.bindProduct
|
|
19203
19236
|
});
|
|
19204
19237
|
}
|
|
19205
19238
|
}
|
|
@@ -19352,7 +19385,7 @@ Made in Italy` })));
|
|
|
19352
19385
|
}, []);
|
|
19353
19386
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
|
19354
19387
|
const handlePlaying = React.useCallback(() => {
|
|
19355
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
19388
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
19356
19389
|
setIsPauseVideo(false);
|
|
19357
19390
|
const item = data[index];
|
|
19358
19391
|
if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
|
|
@@ -19365,14 +19398,15 @@ Made in Italy` })));
|
|
|
19365
19398
|
eventSubject: 'playVideo',
|
|
19366
19399
|
eventDescription: 'User played the video',
|
|
19367
19400
|
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 : '',
|
|
19368
|
-
|
|
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 : '',
|
|
19369
19403
|
playType,
|
|
19370
19404
|
startTime: videoCurrentTime,
|
|
19371
19405
|
videoDuration,
|
|
19372
|
-
contentTags: JSON.stringify((
|
|
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 : []),
|
|
19373
19407
|
position: index + '',
|
|
19374
19408
|
contentFormat: 'video',
|
|
19375
|
-
traceInfo: (
|
|
19409
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
19376
19410
|
}
|
|
19377
19411
|
});
|
|
19378
19412
|
setIsFirstPlay(false);
|
|
@@ -19411,7 +19445,7 @@ Made in Italy` })));
|
|
|
19411
19445
|
}
|
|
19412
19446
|
}, [isLoadFinish]);
|
|
19413
19447
|
const onPause = React.useCallback(() => {
|
|
19414
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
19448
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
19415
19449
|
const item = data[index];
|
|
19416
19450
|
const videoDuration = ((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
|
|
19417
19451
|
const videoCurrentTime = ((_d = (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
|
|
@@ -19422,14 +19456,15 @@ Made in Italy` })));
|
|
|
19422
19456
|
eventSubject: 'playOverVideo',
|
|
19423
19457
|
eventDescription: 'User finished playing the video',
|
|
19424
19458
|
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 : '',
|
|
19425
|
-
|
|
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 : '',
|
|
19426
19461
|
endTime: videoCurrentTime,
|
|
19427
19462
|
videoDuration,
|
|
19428
19463
|
playDuration,
|
|
19429
|
-
contentTags: JSON.stringify((
|
|
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 : []),
|
|
19430
19465
|
position: index + '',
|
|
19431
19466
|
contentFormat: 'video',
|
|
19432
|
-
traceInfo: (
|
|
19467
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
19433
19468
|
}
|
|
19434
19469
|
});
|
|
19435
19470
|
}
|