pb-sxp-ui 1.16.13 → 1.16.14
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 +201 -183
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +201 -183
- 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 +201 -183
- 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 +8 -10
- package/es/core/components/SxpPageRender/LikeButton/index.js +15 -17
- package/es/core/components/SxpPageRender/PictureGroup/index.d.ts +0 -5
- package/es/core/components/SxpPageRender/PictureGroup/index.js +13 -39
- package/es/core/components/SxpPageRender/VideoWidget/index.js +45 -32
- package/es/core/components/SxpPageRender/WaterFall/index.js +3 -4
- package/es/core/components/SxpPageRender/index.js +37 -53
- package/es/core/context/SxpDataSourceProvider.d.ts +0 -1
- package/es/core/context/SxpDataSourceProvider.js +71 -22
- package/es/core/hooks/useEventReport.js +5 -6
- package/lib/core/components/DiyPortalPreview/VideoWidget.js +8 -10
- package/lib/core/components/SxpPageRender/LikeButton/index.js +15 -17
- package/lib/core/components/SxpPageRender/PictureGroup/index.d.ts +0 -5
- package/lib/core/components/SxpPageRender/PictureGroup/index.js +12 -38
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +45 -32
- package/lib/core/components/SxpPageRender/WaterFall/index.js +3 -4
- package/lib/core/components/SxpPageRender/index.js +37 -53
- package/lib/core/context/SxpDataSourceProvider.d.ts +0 -1
- package/lib/core/context/SxpDataSourceProvider.js +71 -22
- package/lib/core/hooks/useEventReport.js +5 -6
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
@@ -644,7 +644,6 @@ const DEFAULT_TAG = 'FOR U';
|
|
644
644
|
const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, consentHeight, consentWidth, isOpenConsent = false, isEditor = false, utmParameter, channelQueryList, data, dataList, isDiyH5, onUpdateSchema, onUpdateChannel }) => {
|
645
645
|
var _a, _b, _c, _d, _e;
|
646
646
|
const [rtcList, setRtcList] = React.useState([]);
|
647
|
-
const [firstRtcList, setFirstRtcList] = React.useState([]);
|
648
647
|
const [tagList, setTagList] = React.useState([]);
|
649
648
|
const [loading, setLoading] = React.useState(true);
|
650
649
|
const [curReqInfo, setCurReqInfo] = React.useState({ rtc: '', requestId: '' });
|
@@ -737,7 +736,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
737
736
|
return ((_a = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _a === void 0 ? void 0 : _a['x-app-id']) + storeAndLoadFeUserId();
|
738
737
|
}, [bffDataSource]);
|
739
738
|
// bff API 请求方法
|
740
|
-
const bffFetch = React.useCallback((path, options) => {
|
739
|
+
const bffFetch = React.useCallback((path, options, isBota = true) => {
|
741
740
|
var _a;
|
742
741
|
if (!bffDataSource)
|
743
742
|
return;
|
@@ -752,7 +751,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
752
751
|
val.split('=')[1];
|
753
752
|
});
|
754
753
|
return window
|
755
|
-
.fetch(`${url}/api/${path}`, Object.assign({ headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId }, bffDataSource.headers), method: options.method, body: options.type === 'beacon'
|
754
|
+
.fetch(`${url}/api/${path}`, Object.assign({ headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId }, bffDataSource.headers), method: options.method, body: options.type === 'beacon' && isBota
|
756
755
|
? JSON.stringify({
|
757
756
|
body: btoa(encodeURIComponent(JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))))
|
758
757
|
})
|
@@ -760,6 +759,57 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
760
759
|
.then((res) => res.json())
|
761
760
|
.catch((err) => Promise.reject(err));
|
762
761
|
}, [bffDataSource, fakeUserId]);
|
762
|
+
const bffCollectEvent = React.useCallback((params) => {
|
763
|
+
var _a;
|
764
|
+
const body = {
|
765
|
+
eventName: params === null || params === void 0 ? void 0 : params.eventName,
|
766
|
+
eventSource: params === null || params === void 0 ? void 0 : params.eventSource,
|
767
|
+
eventInfo: (params === null || params === void 0 ? void 0 : params.eventInfo) ? JSON.stringify(params === null || params === void 0 ? void 0 : params.eventInfo) : ''
|
768
|
+
};
|
769
|
+
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(`v1/data/collect/${(_a = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _a === void 0 ? void 0 : _a['x-app-id']}/${params === null || params === void 0 ? void 0 : params.eventName}`, {
|
770
|
+
method: 'POST',
|
771
|
+
body,
|
772
|
+
type: 'beacon'
|
773
|
+
}, false);
|
774
|
+
}, [bffFetch, bffDataSource]);
|
775
|
+
React.useEffect(() => {
|
776
|
+
if (typeof (window === null || window === void 0 ? void 0 : window.fbq) === 'function') {
|
777
|
+
const OriginalImage = window.Image;
|
778
|
+
window.Image = function () {
|
779
|
+
const img = new OriginalImage();
|
780
|
+
// 劫持 src 的 setter
|
781
|
+
const originalSrcDescriptor = Object.getOwnPropertyDescriptor(HTMLImageElement.prototype, 'src');
|
782
|
+
Object.defineProperty(img, 'src', {
|
783
|
+
set(value) {
|
784
|
+
// 继续正常设置 src
|
785
|
+
originalSrcDescriptor.set.call(this, value);
|
786
|
+
img.onload = function () {
|
787
|
+
// 检查是否是目标 URL
|
788
|
+
if (value.includes('https://www.facebook.com/privacy_sandbox/pixel/register/trigger/')) {
|
789
|
+
// 解析 URL 参数
|
790
|
+
const url = new URL(value);
|
791
|
+
const params = Object.fromEntries(url.searchParams.entries());
|
792
|
+
bffCollectEvent({
|
793
|
+
eventName: params === null || params === void 0 ? void 0 : params.ev,
|
794
|
+
eventSource: 'Meta Pixel',
|
795
|
+
eventInfo: params
|
796
|
+
});
|
797
|
+
}
|
798
|
+
};
|
799
|
+
},
|
800
|
+
get() {
|
801
|
+
return originalSrcDescriptor.get.call(this);
|
802
|
+
}
|
803
|
+
});
|
804
|
+
return img;
|
805
|
+
};
|
806
|
+
}
|
807
|
+
}, [bffCollectEvent]);
|
808
|
+
React.useEffect(() => {
|
809
|
+
if (typeof (window === null || window === void 0 ? void 0 : window.fbq) === 'function') {
|
810
|
+
window === null || window === void 0 ? void 0 : window.fbq('track', 'PageView');
|
811
|
+
}
|
812
|
+
}, []);
|
763
813
|
// bff API admin 请求方法
|
764
814
|
const bffFetchAdmin = React.useCallback((path, options) => {
|
765
815
|
if (!bffDataSource)
|
@@ -815,9 +865,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
815
865
|
if ((rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) === 0) {
|
816
866
|
setRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
817
867
|
setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
818
|
-
if (isDiyH5) {
|
819
|
-
setFirstRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
820
|
-
}
|
821
868
|
}
|
822
869
|
const isNotNullList = (_0 = (_z = result === null || result === void 0 ? void 0 : result.data) === null || _z === void 0 ? void 0 : _z.recList) === null || _0 === void 0 ? void 0 : _0.some((item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video));
|
823
870
|
if (isNotNullList) {
|
@@ -857,17 +904,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
857
904
|
if (rtcList.length <= 0) {
|
858
905
|
return;
|
859
906
|
}
|
860
|
-
if (isDiyH5 && (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) > 0) {
|
861
|
-
setRtcList(rtcList.concat(firstRtcList));
|
862
|
-
setCacheRtcList(cacheRtcList.concat(firstRtcList));
|
863
|
-
return;
|
864
|
-
}
|
865
907
|
const lastItem = rtcList === null || rtcList === void 0 ? void 0 : rtcList[(rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) - 1];
|
866
908
|
const data = yield getRecommendVideos(Object.assign(Object.assign(Object.assign(Object.assign({ hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag }, (((_1 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.product) === null || _1 === void 0 ? void 0 : _1.itemId) && { productFilter: [(_2 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.product) === null || _2 === void 0 ? void 0 : _2.itemId] })), (((_3 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.video) === null || _3 === void 0 ? void 0 : _3.itemId) && { contentFilter: [(_4 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.video) === null || _4 === void 0 ? void 0 : _4.itemId] })), { themeTag: themeTag.current }), ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) && !isEditor && { pageNum })));
|
867
909
|
setRtcList(rtcList.concat(getFilterRecList(data)));
|
868
910
|
setCacheRtcList(cacheRtcList.concat(getFilterRecList(data)));
|
869
911
|
return data;
|
870
|
-
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList
|
912
|
+
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
|
871
913
|
const refreshFeSession = React.useCallback((enableReSid, event) => {
|
872
914
|
var _a, _b, _c, _d, _e;
|
873
915
|
let expire = false;
|
@@ -1023,6 +1065,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1023
1065
|
const newUrl = updateQueryStringParameter(currentUrl, 'timestamp', Date.now());
|
1024
1066
|
history.pushState({ path: newUrl }, '', newUrl);
|
1025
1067
|
isPushState = true;
|
1068
|
+
bffCollectEvent({
|
1069
|
+
eventName: 'page_view',
|
1070
|
+
eventSource: 'Google Analytics'
|
1071
|
+
});
|
1026
1072
|
}
|
1027
1073
|
}
|
1028
1074
|
else {
|
@@ -1032,17 +1078,31 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1032
1078
|
if (!isPushState) {
|
1033
1079
|
if (eventName === 'PageView' && typeof (window === null || window === void 0 ? void 0 : window.gtag) === 'function') {
|
1034
1080
|
window === null || window === void 0 ? void 0 : window.gtag('event', 'page_view');
|
1081
|
+
bffCollectEvent({
|
1082
|
+
eventName: 'page_view',
|
1083
|
+
eventSource: 'Google Analytics'
|
1084
|
+
});
|
1035
1085
|
}
|
1036
1086
|
const tiktokPixelEventParamsJson = (_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.tiktokPixel) === null || _b === void 0 ? void 0 : _b[eventName];
|
1037
1087
|
if ((tiktokPixelEventParamsJson === null || tiktokPixelEventParamsJson === void 0 ? void 0 : tiktokPixelEventParamsJson.event_name) &&
|
1038
1088
|
typeof (window === null || window === void 0 ? void 0 : window.ttq) === 'object' &&
|
1039
1089
|
typeof ((_c = window === null || window === void 0 ? void 0 : window.ttq) === null || _c === void 0 ? void 0 : _c.track) === 'function') {
|
1040
1090
|
(_d = window === null || window === void 0 ? void 0 : window.ttq) === null || _d === void 0 ? void 0 : _d.track(tiktokPixelEventParamsJson === null || tiktokPixelEventParamsJson === void 0 ? void 0 : tiktokPixelEventParamsJson.event_name, getEventParamsByJson(tiktokPixelEventParamsJson, product));
|
1091
|
+
bffCollectEvent({
|
1092
|
+
eventName: tiktokPixelEventParamsJson === null || tiktokPixelEventParamsJson === void 0 ? void 0 : tiktokPixelEventParamsJson.event_name,
|
1093
|
+
eventSource: 'TikTok Pixel',
|
1094
|
+
eventInfo: getEventParamsByJson(tiktokPixelEventParamsJson, product)
|
1095
|
+
});
|
1041
1096
|
}
|
1042
1097
|
}
|
1043
1098
|
const snapchatPixelEventParamsJson = (_e = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.snapchatPixel) === null || _e === void 0 ? void 0 : _e[eventName];
|
1044
1099
|
if ((snapchatPixelEventParamsJson === null || snapchatPixelEventParamsJson === void 0 ? void 0 : snapchatPixelEventParamsJson.event_name) && typeof (window === null || window === void 0 ? void 0 : window.snaptr) === 'function') {
|
1045
1100
|
window === null || window === void 0 ? void 0 : window.snaptr('track', snapchatPixelEventParamsJson === null || snapchatPixelEventParamsJson === void 0 ? void 0 : snapchatPixelEventParamsJson.event_name, getEventParamsByJson(snapchatPixelEventParamsJson, product));
|
1101
|
+
bffCollectEvent({
|
1102
|
+
eventName: snapchatPixelEventParamsJson === null || snapchatPixelEventParamsJson === void 0 ? void 0 : snapchatPixelEventParamsJson.event_name,
|
1103
|
+
eventSource: 'Snapchat Pixel',
|
1104
|
+
eventInfo: getEventParamsByJson(snapchatPixelEventParamsJson, product)
|
1105
|
+
});
|
1046
1106
|
}
|
1047
1107
|
const converApiEventParamsJson = (_f = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _f === void 0 ? void 0 : _f[eventName];
|
1048
1108
|
if (enabledMetaConversionApi && converApiEventParamsJson) {
|
@@ -1094,7 +1154,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1094
1154
|
}
|
1095
1155
|
}), [bffFetch, utmVal]);
|
1096
1156
|
const ctaEvent = React.useCallback((eventInfo, rec, product, position) => {
|
1097
|
-
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
|
1157
|
+
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;
|
1098
1158
|
const cta = product === null || product === void 0 ? void 0 : product.bindCta;
|
1099
1159
|
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);
|
1100
1160
|
let fromKName = '';
|
@@ -1112,7 +1172,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1112
1172
|
}
|
1113
1173
|
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;
|
1114
1174
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
1115
|
-
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 : '',
|
1175
|
+
eventInfo: Object.assign(Object.assign({}, eventInfo), { ctaId: (_r = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _r !== void 0 ? _r : '', ctaName: (_s = cta === null || cta === void 0 ? void 0 : cta.title) !== null && _s !== void 0 ? _s : '', contentTags: contentTags ? JSON.stringify(contentTags) : '', position: position + '', contentId: (_u = (_t = rec === null || rec === void 0 ? void 0 : rec.video) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '', productId: isProd ? product === null || product === void 0 ? void 0 : product.itemId : '', traceInfo: (_10 = (_7 = (_2 = (_y = (_v = cta === null || cta === void 0 ? void 0 : cta.traceInfo) !== null && _v !== void 0 ? _v : (_x = (_w = rec === null || rec === void 0 ? void 0 : rec.video) === null || _w === void 0 ? void 0 : _w.bindCta) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : (_1 = (_0 = (_z = rec === null || rec === void 0 ? void 0 : rec.video) === null || _z === void 0 ? void 0 : _z.bindProduct) === null || _0 === void 0 ? void 0 : _0.bindCta) === null || _1 === void 0 ? void 0 : _1.traceInfo) !== null && _2 !== void 0 ? _2 : (_6 = (_5 = (_4 = (_3 = rec === null || rec === void 0 ? void 0 : rec.video) === null || _3 === void 0 ? void 0 : _3.bindProducts) === null || _4 === void 0 ? void 0 : _4[0]) === null || _5 === void 0 ? void 0 : _5.bindCta) === null || _6 === void 0 ? void 0 : _6.traceInfo) !== null && _7 !== void 0 ? _7 : (_9 = (_8 = rec === null || rec === void 0 ? void 0 : rec.product) === null || _8 === void 0 ? void 0 : _8.bindCta) === null || _9 === void 0 ? void 0 : _9.traceInfo) !== null && _10 !== void 0 ? _10 : '', fromKName, fromKPage: (_11 = location === null || location === void 0 ? void 0 : location.href) !== null && _11 !== void 0 ? _11 : '', contentFormat })
|
1116
1176
|
});
|
1117
1177
|
}, [bffEventReport, isFromHashtag]);
|
1118
1178
|
const h5EnterLink = React.useCallback(() => {
|
@@ -1214,9 +1274,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1214
1274
|
}
|
1215
1275
|
setRtcList(list);
|
1216
1276
|
setCacheRtcList(list);
|
1217
|
-
if (isDiyH5) {
|
1218
|
-
setFirstRtcList(list);
|
1219
|
-
}
|
1220
1277
|
bffGetTagList(curData !== null && curData !== void 0 ? curData : finalPageData);
|
1221
1278
|
if (channel) {
|
1222
1279
|
const item = list === null || list === void 0 ? void 0 : list[0];
|
@@ -1252,9 +1309,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1252
1309
|
}
|
1253
1310
|
setRtcList(list);
|
1254
1311
|
setCacheRtcList(list);
|
1255
|
-
if (isDiyH5) {
|
1256
|
-
setFirstRtcList(list);
|
1257
|
-
}
|
1258
1312
|
}
|
1259
1313
|
})
|
1260
1314
|
.finally(() => {
|
@@ -1318,8 +1372,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1318
1372
|
refreshFeSession,
|
1319
1373
|
getAccount,
|
1320
1374
|
accountSonsent,
|
1321
|
-
isDiyH5
|
1322
|
-
firstRtcList
|
1375
|
+
isDiyH5
|
1323
1376
|
} }, isShowConsent ? (React.createElement(Consent$4, Object.assign({}, (_e = (_d = (_c = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consent) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.item) === null || _e === void 0 ? void 0 : _e.props))) : (render({
|
1324
1377
|
rtcList,
|
1325
1378
|
mutateLike: bffMutateLike,
|
@@ -1780,14 +1833,14 @@ var settingRender$f = [
|
|
1780
1833
|
* @Author: binruan@chatlabs.com
|
1781
1834
|
* @Date: 2024-03-12 10:59:06
|
1782
1835
|
* @LastEditors: binruan@chatlabs.com
|
1783
|
-
* @LastEditTime:
|
1836
|
+
* @LastEditTime: 2024-11-28 11:17:16
|
1784
1837
|
* @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
|
1785
1838
|
*
|
1786
1839
|
*/
|
1787
1840
|
function useEventReport() {
|
1788
1841
|
const { bffEventReport, popupDetailData, isFromHashtag, eventTimeList, setEventTimeList } = useSxpDataSource();
|
1789
1842
|
const jumpToWeb = React.useCallback((e, data, product, cta, position, traceInfo) => {
|
1790
|
-
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
|
1843
|
+
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;
|
1791
1844
|
const i = eventTimeList === null || eventTimeList === void 0 ? void 0 : eventTimeList.findIndex((item) => item.target === (e === null || e === void 0 ? void 0 : e.target));
|
1792
1845
|
if (i !== -1) {
|
1793
1846
|
return;
|
@@ -1820,11 +1873,11 @@ function useEventReport() {
|
|
1820
1873
|
contentFormat = 'image';
|
1821
1874
|
}
|
1822
1875
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
1823
|
-
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 : '',
|
1876
|
+
eventInfo: Object.assign({ eventSubject: 'jumpToWeb', eventDescription: 'User jumped to website', productId: (_v = product === null || product === void 0 ? void 0 : product.itemId) !== null && _v !== void 0 ? _v : '', productName: (_w = product === null || product === void 0 ? void 0 : product.title) !== null && _w !== void 0 ? _w : '', price: (product === null || product === void 0 ? void 0 : product.price) ? (product === null || product === void 0 ? void 0 : product.price) + '' : '0', productCollection: (_x = product === null || product === void 0 ? void 0 : product.collection) !== null && _x !== void 0 ? _x : '', fromKName, fromKPage: location === null || location === void 0 ? void 0 : location.href, contentTags: contentTags ? JSON.stringify(contentTags) : '', position: position + '', contentId: (_z = (_y = data === null || data === void 0 ? void 0 : data.video) === null || _y === void 0 ? void 0 : _y.itemId) !== null && _z !== void 0 ? _z : '', ctatId: (_0 = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _0 !== void 0 ? _0 : '', traceInfo: (_13 = (_10 = (_8 = (_4 = (_1 = traceInfo !== null && traceInfo !== void 0 ? traceInfo : product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _1 !== void 0 ? _1 : (_3 = (_2 = data === null || data === void 0 ? void 0 : data.video) === null || _2 === void 0 ? void 0 : _2.bindProduct) === null || _3 === void 0 ? void 0 : _3.traceInfo) !== null && _4 !== void 0 ? _4 : (_7 = (_6 = (_5 = data === null || data === void 0 ? void 0 : data.video) === null || _5 === void 0 ? void 0 : _5.bindProducts) === null || _6 === void 0 ? void 0 : _6[0]) === null || _7 === void 0 ? void 0 : _7.traceInfo) !== null && _8 !== void 0 ? _8 : (_9 = data === null || data === void 0 ? void 0 : data.product) === null || _9 === void 0 ? void 0 : _9.traceInfo) !== null && _10 !== void 0 ? _10 : (_12 = (_11 = data === null || data === void 0 ? void 0 : data.video) === null || _11 === void 0 ? void 0 : _11.bindCta) === null || _12 === void 0 ? void 0 : _12.traceInfo) !== null && _13 !== void 0 ? _13 : '' }, (contentFormat && { contentFormat }))
|
1824
1877
|
});
|
1825
1878
|
}, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
|
1826
1879
|
const productView = React.useCallback((data, product, cta, viewTime, position) => {
|
1827
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p
|
1880
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
1828
1881
|
let fromKName = '';
|
1829
1882
|
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))) {
|
1830
1883
|
fromKName = 'pdpPage';
|
@@ -1843,9 +1896,8 @@ function useEventReport() {
|
|
1843
1896
|
contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags),
|
1844
1897
|
position: position + '',
|
1845
1898
|
contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
1846
|
-
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 : '',
|
1847
1899
|
ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
|
1848
|
-
traceInfo: (
|
1900
|
+
traceInfo: (_p = (_m = (_h = (_e = product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _e !== void 0 ? _e : (_g = (_f = data === null || data === void 0 ? void 0 : data.video) === null || _f === void 0 ? void 0 : _f.bindProduct) === null || _g === void 0 ? void 0 : _g.traceInfo) !== null && _h !== void 0 ? _h : (_l = (_k = (_j = data === null || data === void 0 ? void 0 : data.video) === null || _j === void 0 ? void 0 : _j.bindProducts) === null || _k === void 0 ? void 0 : _k[0]) === null || _l === void 0 ? void 0 : _l.traceInfo) !== null && _m !== void 0 ? _m : (_o = data === null || data === void 0 ? void 0 : data.product) === null || _o === void 0 ? void 0 : _o.traceInfo) !== null && _p !== void 0 ? _p : '',
|
1849
1901
|
timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
|
1850
1902
|
eventSubject: 'productView',
|
1851
1903
|
eventDescription: 'User browsed the product'
|
@@ -15660,7 +15712,7 @@ function WaterfallList(_a) {
|
|
15660
15712
|
* @Author: binruan@chatlabs.com
|
15661
15713
|
* @Date: 2024-01-10 10:58:24
|
15662
15714
|
* @LastEditors: binruan@chatlabs.com
|
15663
|
-
* @LastEditTime: 2025-
|
15715
|
+
* @LastEditTime: 2025-02-28 10:00:31
|
15664
15716
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\WaterFall\index.tsx
|
15665
15717
|
*
|
15666
15718
|
*/
|
@@ -15698,7 +15750,7 @@ const WaterFall = (props) => {
|
|
15698
15750
|
}
|
15699
15751
|
}, [waterFallData]);
|
15700
15752
|
const reportTagsView = React.useCallback(() => {
|
15701
|
-
var _a, _b, _c, _d, _e, _f
|
15753
|
+
var _a, _b, _c, _d, _e, _f;
|
15702
15754
|
const rec = recData === null || recData === void 0 ? void 0 : recData.rec;
|
15703
15755
|
if (!rec)
|
15704
15756
|
return;
|
@@ -15718,10 +15770,9 @@ const WaterFall = (props) => {
|
|
15718
15770
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
15719
15771
|
eventInfo: {
|
15720
15772
|
contentId: (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
15721
|
-
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 : '',
|
15722
15773
|
position: cacheActiveIndex + '',
|
15723
|
-
contentTags: JSON.stringify((
|
15724
|
-
traceInfo: (
|
15774
|
+
contentTags: JSON.stringify((_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.tags),
|
15775
|
+
traceInfo: (_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.traceInfo,
|
15725
15776
|
hashTags: JSON.stringify([recData === null || recData === void 0 ? void 0 : recData.hashTag]),
|
15726
15777
|
fromKName,
|
15727
15778
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
@@ -17803,7 +17854,7 @@ const LikeButton = (_a) => {
|
|
17803
17854
|
const likeIcon = useIconLink(defaultLikeIconPath$2);
|
17804
17855
|
const unlikeIcon = useIconLink(defaultUnLikeIconPath$2);
|
17805
17856
|
const handleClick = lodash.debounce(() => __awaiter(void 0, void 0, void 0, function* () {
|
17806
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z
|
17857
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
|
17807
17858
|
if (state) {
|
17808
17859
|
// 先设置状态
|
17809
17860
|
setState(false);
|
@@ -17813,12 +17864,11 @@ const LikeButton = (_a) => {
|
|
17813
17864
|
eventSubject: 'favoriteContentCanceled',
|
17814
17865
|
eventDescription: 'This content was unfavorite by the user',
|
17815
17866
|
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 : '',
|
17816
|
-
|
17817
|
-
|
17818
|
-
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 : []),
|
17867
|
+
contentName: (_j = (_h = recData === null || recData === void 0 ? void 0 : recData.video) === null || _h === void 0 ? void 0 : _h.title) !== null && _j !== void 0 ? _j : '',
|
17868
|
+
contentTags: JSON.stringify((_l = (_k = recData === null || recData === void 0 ? void 0 : recData.video) === null || _k === void 0 ? void 0 : _k.tags) !== null && _l !== void 0 ? _l : []),
|
17819
17869
|
position: position + '',
|
17820
|
-
contentFormat: ((
|
17821
|
-
traceInfo: (
|
17870
|
+
contentFormat: ((_m = recData === null || recData === void 0 ? void 0 : recData.video) === null || _m === void 0 ? void 0 : _m.url) ? 'video' : 'image',
|
17871
|
+
traceInfo: (_o = recData === null || recData === void 0 ? void 0 : recData.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
17822
17872
|
}
|
17823
17873
|
});
|
17824
17874
|
// 如果接口调用失败,则回滚状态
|
@@ -17826,41 +17876,40 @@ const LikeButton = (_a) => {
|
|
17826
17876
|
setState(true);
|
17827
17877
|
}
|
17828
17878
|
else {
|
17829
|
-
const nRtcList = (
|
17879
|
+
const nRtcList = (_p = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
17830
17880
|
if (index === position) {
|
17831
17881
|
item.isCollected = false;
|
17832
17882
|
}
|
17833
17883
|
return item;
|
17834
|
-
})) !== null &&
|
17884
|
+
})) !== null && _p !== void 0 ? _p : [];
|
17835
17885
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
17836
17886
|
}
|
17837
17887
|
}
|
17838
17888
|
else {
|
17839
17889
|
setState(true);
|
17840
|
-
const result = (
|
17890
|
+
const result = (_q = (yield (mutateLike === null || mutateLike === void 0 ? void 0 : mutateLike({ content: JSON.stringify(recData) })))) !== null && _q !== void 0 ? _q : false;
|
17841
17891
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
17842
17892
|
eventInfo: {
|
17843
17893
|
eventSubject: 'favoriteContent',
|
17844
17894
|
eventDescription: 'This content was favorite by the user',
|
17845
|
-
contentId: (
|
17846
|
-
|
17847
|
-
|
17848
|
-
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 : []),
|
17895
|
+
contentId: (_s = (_r = recData === null || recData === void 0 ? void 0 : recData.video) === null || _r === void 0 ? void 0 : _r.itemId) !== null && _s !== void 0 ? _s : '',
|
17896
|
+
contentName: (_u = (_t = recData === null || recData === void 0 ? void 0 : recData.video) === null || _t === void 0 ? void 0 : _t.title) !== null && _u !== void 0 ? _u : '',
|
17897
|
+
contentTags: JSON.stringify((_w = (_v = recData === null || recData === void 0 ? void 0 : recData.video) === null || _v === void 0 ? void 0 : _v.tags) !== null && _w !== void 0 ? _w : []),
|
17849
17898
|
position: position + '',
|
17850
|
-
contentFormat: ((
|
17851
|
-
traceInfo: (
|
17899
|
+
contentFormat: ((_x = recData === null || recData === void 0 ? void 0 : recData.video) === null || _x === void 0 ? void 0 : _x.url) ? 'video' : 'image',
|
17900
|
+
traceInfo: (_y = recData === null || recData === void 0 ? void 0 : recData.video) === null || _y === void 0 ? void 0 : _y.traceInfo
|
17852
17901
|
}
|
17853
17902
|
});
|
17854
17903
|
if (!result) {
|
17855
17904
|
setState(false);
|
17856
17905
|
}
|
17857
17906
|
else {
|
17858
|
-
const nRtcList = (
|
17907
|
+
const nRtcList = (_z = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
17859
17908
|
if (index === position) {
|
17860
17909
|
item.isCollected = true;
|
17861
17910
|
}
|
17862
17911
|
return item;
|
17863
|
-
})) !== null &&
|
17912
|
+
})) !== null && _z !== void 0 ? _z : [];
|
17864
17913
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
17865
17914
|
}
|
17866
17915
|
}
|
@@ -17897,7 +17946,7 @@ const mountVideoPlayerAtNode = (() => {
|
|
17897
17946
|
const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activeIndex, videoPostConfig, videoPlayIcon, loopPlay, swiperRef }, ref) => {
|
17898
17947
|
var _a, _b;
|
17899
17948
|
const [isPauseVideo, setIsPauseVideo] = React.useState(false);
|
17900
|
-
const { bffEventReport, sxpParameter,
|
17949
|
+
const { bffEventReport, sxpParameter, waterFallData, openHashtag, bffFbReport, isDiyH5 } = useSxpDataSource();
|
17901
17950
|
const videoStartTime = React.useRef(0);
|
17902
17951
|
const [isLoadFinish, setIsLoadFinish] = React.useState(false);
|
17903
17952
|
const { isActive } = useSwiperSlide();
|
@@ -17963,23 +18012,6 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
17963
18012
|
return;
|
17964
18013
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
17965
18014
|
}, [videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
17966
|
-
const handleEnd = () => {
|
17967
|
-
var _a, _b, _c, _d, _e, _f;
|
17968
|
-
if (!videoRef.current)
|
17969
|
-
return;
|
17970
|
-
if (isDiyH5) {
|
17971
|
-
(_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
|
17972
|
-
if (!loopPlayRef.current)
|
17973
|
-
return;
|
17974
|
-
if (firstRtcList && index < (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) - 1) {
|
17975
|
-
const i = (_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.activeIndex;
|
17976
|
-
(_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(i + 1);
|
17977
|
-
}
|
17978
|
-
}
|
17979
|
-
else {
|
17980
|
-
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.play();
|
17981
|
-
}
|
17982
|
-
};
|
17983
18015
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
17984
18016
|
const handlePlaying = React.useCallback(() => {
|
17985
18017
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
@@ -17988,7 +18020,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
17988
18020
|
setIsLoadFinish(true);
|
17989
18021
|
}, []);
|
17990
18022
|
const handleStartPlay = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
17991
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q
|
18023
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
17992
18024
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
17993
18025
|
return;
|
17994
18026
|
setIsPauseVideo(false);
|
@@ -17999,11 +18031,16 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
17999
18031
|
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);
|
18000
18032
|
const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
|
18001
18033
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
18002
|
-
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 : '',
|
18034
|
+
eventInfo: Object.assign({ eventSubject: 'playVideo', eventDescription: 'User played the video', contentId: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.itemId) !== null && _k !== void 0 ? _k : '', contentName: (_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.title) !== null && _m !== void 0 ? _m : '', playType, startTime: videoCurrentTime, videoDuration, contentTags: JSON.stringify((_p = (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.tags) !== null && _p !== void 0 ? _p : []), position: index + '', contentFormat: 'video', traceInfo: (_q = item === null || item === void 0 ? void 0 : item.video) === null || _q === void 0 ? void 0 : _q.traceInfo }, ((isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) && { loadTime: (loadedTimeRef === null || loadedTimeRef === void 0 ? void 0 : loadedTimeRef.current) - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current) + '' }))
|
18003
18035
|
});
|
18004
18036
|
isFirstPlayRef.current = false;
|
18005
18037
|
}
|
18006
18038
|
}), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
18039
|
+
const setCurrentTimeByStartTime = React.useCallback(() => {
|
18040
|
+
if (isDiyH5) {
|
18041
|
+
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
18042
|
+
}
|
18043
|
+
}, []);
|
18007
18044
|
const handLoadeddata = React.useCallback(() => {
|
18008
18045
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
|
18009
18046
|
return;
|
@@ -18028,12 +18065,13 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18028
18065
|
const handleLoadedmetadata = React.useCallback(() => {
|
18029
18066
|
if (!videoRef.current)
|
18030
18067
|
return;
|
18068
|
+
setCurrentTimeByStartTime();
|
18031
18069
|
loadedTimeRef.current = new Date();
|
18032
18070
|
handleStartPlay();
|
18033
18071
|
handLoadeddata();
|
18034
18072
|
}, [videoRef.current, handLoadeddata, handleStartPlay]);
|
18035
18073
|
const handleClickVideo = React.useCallback((type) => () => {
|
18036
|
-
var _a, _b, _c, _d, _e;
|
18074
|
+
var _a, _b, _c, _d, _e, _f;
|
18037
18075
|
if (!videoRef.current)
|
18038
18076
|
return;
|
18039
18077
|
if (!isLoadFinish)
|
@@ -18054,17 +18092,20 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18054
18092
|
break;
|
18055
18093
|
default:
|
18056
18094
|
if (isPause) {
|
18057
|
-
(_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.
|
18095
|
+
if (isDiyH5 && Math.round((_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.currentTime) >= (scene === null || scene === void 0 ? void 0 : scene.endTime)) {
|
18096
|
+
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
18097
|
+
}
|
18098
|
+
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
|
18058
18099
|
}
|
18059
18100
|
else {
|
18060
|
-
(
|
18101
|
+
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.pause();
|
18061
18102
|
}
|
18062
18103
|
setIsPauseVideo(!isPause);
|
18063
18104
|
break;
|
18064
18105
|
}
|
18065
18106
|
}, [isLoadFinish, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
18066
18107
|
const handlePause = React.useCallback(() => {
|
18067
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o
|
18108
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
18068
18109
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
18069
18110
|
return;
|
18070
18111
|
if (activeIndex !== index)
|
@@ -18080,15 +18121,14 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18080
18121
|
eventSubject: 'playOverVideo',
|
18081
18122
|
eventDescription: 'User finished playing the video',
|
18082
18123
|
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 : '',
|
18083
|
-
|
18084
|
-
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 : '',
|
18124
|
+
contentName: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.title) !== null && _k !== void 0 ? _k : '',
|
18085
18125
|
endTime: videoCurrentTime,
|
18086
18126
|
videoDuration,
|
18087
18127
|
playDuration,
|
18088
|
-
contentTags: JSON.stringify((
|
18128
|
+
contentTags: JSON.stringify((_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.tags) !== null && _m !== void 0 ? _m : []),
|
18089
18129
|
position: index + '',
|
18090
18130
|
contentFormat: 'video',
|
18091
|
-
traceInfo: (
|
18131
|
+
traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
18092
18132
|
}
|
18093
18133
|
});
|
18094
18134
|
}
|
@@ -18096,8 +18136,27 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18096
18136
|
const handleWaiting = React.useCallback(() => {
|
18097
18137
|
setWaiting(true);
|
18098
18138
|
}, []);
|
18139
|
+
const handleTimeUpload = () => {
|
18140
|
+
if (!videoRef.current || !isDiyH5)
|
18141
|
+
return;
|
18142
|
+
setTimeout(() => {
|
18143
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
18144
|
+
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)) {
|
18145
|
+
(_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
|
18146
|
+
if (!loopPlayRef.current)
|
18147
|
+
return;
|
18148
|
+
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
18149
|
+
(_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);
|
18150
|
+
}
|
18151
|
+
else {
|
18152
|
+
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;
|
18153
|
+
(_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);
|
18154
|
+
}
|
18155
|
+
}
|
18156
|
+
});
|
18157
|
+
};
|
18099
18158
|
React.useEffect(() => {
|
18100
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
18159
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
18101
18160
|
if (!isActive)
|
18102
18161
|
return;
|
18103
18162
|
const videoSrc = videoUrl;
|
@@ -18118,6 +18177,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18118
18177
|
hls === null || hls === void 0 ? void 0 : hls.attachMedia(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current);
|
18119
18178
|
hls === null || hls === void 0 ? void 0 : hls.on(Hls.Events.MANIFEST_PARSED, function () {
|
18120
18179
|
var _a;
|
18180
|
+
setCurrentTimeByStartTime();
|
18121
18181
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
18122
18182
|
});
|
18123
18183
|
}
|
@@ -18131,11 +18191,12 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18131
18191
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.addEventListener('play', handleStartPlay);
|
18132
18192
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.addEventListener('playing', handlePlaying);
|
18133
18193
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.addEventListener('pause', handlePause);
|
18134
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended',
|
18194
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handlePlay);
|
18135
18195
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.addEventListener('canplay', handlePlay);
|
18136
18196
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
|
18197
|
+
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.addEventListener('timeupdate', handleTimeUpload);
|
18137
18198
|
return () => {
|
18138
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
18199
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
18139
18200
|
const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
|
18140
18201
|
if (!isPause)
|
18141
18202
|
handlePause();
|
@@ -18147,9 +18208,10 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18147
18208
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.removeEventListener('play', handleStartPlay);
|
18148
18209
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.removeEventListener('playing', handlePlaying);
|
18149
18210
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.removeEventListener('pause', handlePause);
|
18150
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended',
|
18211
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handlePlay);
|
18151
18212
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('canplay', handlePlay);
|
18152
18213
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.removeEventListener('waiting', handleWaiting);
|
18214
|
+
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.removeEventListener('timeupdate', handleTimeUpload);
|
18153
18215
|
};
|
18154
18216
|
}, [isActive]);
|
18155
18217
|
React.useEffect(() => {
|
@@ -18360,45 +18422,19 @@ const Picture = (props) => {
|
|
18360
18422
|
}, onLoad: onShowFirstImage }))));
|
18361
18423
|
};
|
18362
18424
|
|
18363
|
-
const PictureGroup$4 =
|
18425
|
+
const PictureGroup$4 = ({ imgUrls, width, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig }) => {
|
18364
18426
|
var _a, _b;
|
18365
18427
|
const { isActive } = useSwiperSlide();
|
18366
|
-
const {
|
18428
|
+
const { sxpParameter, openHashtag } = useSxpDataSource();
|
18367
18429
|
const [isLoad, setIsLoad] = React.useState(false);
|
18368
18430
|
const [imgInfo, setImgInfo] = React.useState();
|
18369
18431
|
const [swiperActiveIndex, setSwiperActiveIndex] = React.useState(0);
|
18370
|
-
const
|
18432
|
+
const swiperRef = React.useRef();
|
18371
18433
|
const isFirstPlayRef = React.useRef(true);
|
18372
|
-
const loopPlayRef = React.useRef(true);
|
18373
18434
|
const initTime = new Date();
|
18374
|
-
React.useImperativeHandle(ref, () => {
|
18375
|
-
return {
|
18376
|
-
setLoopPlay(v) {
|
18377
|
-
loopPlayRef.current = v;
|
18378
|
-
}
|
18379
|
-
};
|
18380
|
-
});
|
18381
|
-
React.useEffect(() => {
|
18382
|
-
let timerId;
|
18383
|
-
if (isLoad && isActive && isDiyH5) {
|
18384
|
-
timerId = setTimeout(() => {
|
18385
|
-
var _a, _b, _c, _d;
|
18386
|
-
if (!loopPlayRef.current)
|
18387
|
-
return;
|
18388
|
-
if (firstRtcList && index < (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) - 1) {
|
18389
|
-
const i = (_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.activeIndex;
|
18390
|
-
(_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.slideTo(i + 1);
|
18391
|
-
}
|
18392
|
-
}, 3000);
|
18393
|
-
}
|
18394
|
-
return () => {
|
18395
|
-
if (timerId)
|
18396
|
-
clearTimeout(timerId);
|
18397
|
-
};
|
18398
|
-
}, [isLoad, isActive, isDiyH5, index, swiperRef, firstRtcList]);
|
18399
18435
|
React.useEffect(() => {
|
18400
18436
|
if (isLoad && isActive) {
|
18401
|
-
(
|
18437
|
+
(swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) && swiperRef.current.swiper.autoplay.start();
|
18402
18438
|
if (openHashtag) {
|
18403
18439
|
onViewImageEndEvent(rec);
|
18404
18440
|
}
|
@@ -18408,7 +18444,7 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
18408
18444
|
}
|
18409
18445
|
}
|
18410
18446
|
else {
|
18411
|
-
(
|
18447
|
+
(swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) && swiperRef.current.swiper.autoplay.stop();
|
18412
18448
|
}
|
18413
18449
|
}, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
|
18414
18450
|
const showFirstImageFn = React.useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
|
@@ -18435,13 +18471,13 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
18435
18471
|
};
|
18436
18472
|
}, [isActive, imgInfo]);
|
18437
18473
|
const handleMouseEnter = React.useCallback(() => {
|
18438
|
-
if (
|
18439
|
-
|
18474
|
+
if (swiperRef.current && swiperRef.current.swiper && isAlly) {
|
18475
|
+
swiperRef.current.swiper.autoplay.stop();
|
18440
18476
|
}
|
18441
18477
|
}, []);
|
18442
18478
|
const handleMouseLeave = React.useCallback(() => {
|
18443
|
-
if (
|
18444
|
-
|
18479
|
+
if (swiperRef.current && swiperRef.current.swiper && isAlly) {
|
18480
|
+
swiperRef.current.swiper.autoplay.start();
|
18445
18481
|
}
|
18446
18482
|
}, []);
|
18447
18483
|
const handleSlideChange = React.useCallback((swiper) => {
|
@@ -18462,7 +18498,7 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
18462
18498
|
enabled: true
|
18463
18499
|
}
|
18464
18500
|
}
|
18465
|
-
: {}), { loop: true, ref:
|
18501
|
+
: {}), { loop: true, ref: swiperRef, onSlideChange: handleSlideChange, className: css.css(Object.assign(Object.assign({ '.swiper-pagination': {
|
18466
18502
|
bottom: (_a = imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.marginBottom) !== null && _a !== void 0 ? _a : 0,
|
18467
18503
|
fontSize: '14px'
|
18468
18504
|
} }, ((imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.dotsBgColor) && {
|
@@ -18479,7 +18515,7 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
18479
18515
|
return (React.createElement(SwiperSlide, { key: srcKey, "aria-hidden": srcKey !== swiperActiveIndex },
|
18480
18516
|
React.createElement(Picture, { src: !isLoad && srcKey > 0 ? '' : url, height: height, imgUrlsPostConfig: imgUrlsPostConfig, onShowFirstImage: showFirstImageFn })));
|
18481
18517
|
}))));
|
18482
|
-
}
|
18518
|
+
};
|
18483
18519
|
var PictureGroup$5 = React.memo(PictureGroup$4);
|
18484
18520
|
|
18485
18521
|
/*
|
@@ -18759,7 +18795,7 @@ var NavBack$1 = React.memo(NavBack);
|
|
18759
18795
|
* @Author: binruan@chatlabs.com
|
18760
18796
|
* @Date: 2024-03-20 10:27:31
|
18761
18797
|
* @LastEditors: binruan@chatlabs.com
|
18762
|
-
* @LastEditTime: 2025-05-
|
18798
|
+
* @LastEditTime: 2025-05-09 15:51:40
|
18763
18799
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
18764
18800
|
*
|
18765
18801
|
*/
|
@@ -18779,7 +18815,6 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18779
18815
|
const skipLinkRef = React.useRef(false);
|
18780
18816
|
const [pageNum, setPageNum] = React.useState(2);
|
18781
18817
|
const videoWidgetRef = React.useRef(null);
|
18782
|
-
const pictureGroupRef = React.useRef(null);
|
18783
18818
|
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();
|
18784
18819
|
const { backMainFeed, productView, jumpToWeb } = useEventReport();
|
18785
18820
|
const isShowFingerTip = React.useMemo(() => {
|
@@ -18827,7 +18862,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18827
18862
|
(_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
|
18828
18863
|
}, [data, ctaType, swiperRef]);
|
18829
18864
|
const handleSessionCompleted = React.useCallback((fk) => {
|
18830
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v
|
18865
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
18831
18866
|
const item = data === null || data === void 0 ? void 0 : data[activeIndex];
|
18832
18867
|
let fromKName = '';
|
18833
18868
|
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))) {
|
@@ -18854,13 +18889,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18854
18889
|
eventSubject: 'sessionCompleted',
|
18855
18890
|
eventDescription: 'Session completed',
|
18856
18891
|
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
18857
|
-
|
18858
|
-
productId: (_r = item === null || item === void 0 ? void 0 : item.product) === null || _r === void 0 ? void 0 : _r.itemId,
|
18892
|
+
productId: (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.itemId,
|
18859
18893
|
position: activeIndex + '',
|
18860
18894
|
fromKName: fk || fromKName,
|
18861
18895
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
18862
|
-
ctatId: (
|
18863
|
-
traceInfo: (
|
18896
|
+
ctatId: (_r = (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.bindCta) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
|
18897
|
+
traceInfo: (_v = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_u = item === null || item === void 0 ? void 0 : item.product) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : ''
|
18864
18898
|
}
|
18865
18899
|
});
|
18866
18900
|
}, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime]);
|
@@ -18919,9 +18953,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18919
18953
|
refreshFeSession
|
18920
18954
|
]);
|
18921
18955
|
const handleSessionExpire = React.useCallback(lodash.debounce(() => {
|
18922
|
-
var _a
|
18956
|
+
var _a;
|
18923
18957
|
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
18924
|
-
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
18925
18958
|
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
|
18926
18959
|
}, 1000), [handleSessionCompleted, refreshFeSession]);
|
18927
18960
|
React.useEffect(() => {
|
@@ -18991,18 +19024,18 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18991
19024
|
return null;
|
18992
19025
|
}, [globalConfig, activeIndex, visList]);
|
18993
19026
|
const renderContent = React.useCallback((rec, index) => {
|
18994
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
19027
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
18995
19028
|
if (rec === 'organic menu') {
|
18996
19029
|
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)));
|
18997
19030
|
}
|
18998
|
-
if ((
|
19031
|
+
if ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.url) {
|
18999
19032
|
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 })));
|
19000
19033
|
}
|
19001
|
-
if ((
|
19002
|
-
return (React.createElement(PictureGroup$5,
|
19034
|
+
if ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.imgUrls) {
|
19035
|
+
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 }));
|
19003
19036
|
}
|
19004
|
-
if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((
|
19005
|
-
return (
|
19037
|
+
if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _j === void 0 ? void 0 : _j.length) > 0) {
|
19038
|
+
return (_k = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _k === void 0 ? void 0 : _k.map((value, idx) => {
|
19006
19039
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
19007
19040
|
const t = resolver[(_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type];
|
19008
19041
|
const Component = withBindDataSource(t);
|
@@ -19040,7 +19073,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19040
19073
|
};
|
19041
19074
|
}, [isShowMore]);
|
19042
19075
|
const renderBottom = React.useCallback((rec, index) => {
|
19043
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q
|
19076
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
19044
19077
|
if (rec === null || rec === void 0 ? void 0 : rec.video) {
|
19045
19078
|
let cta = null;
|
19046
19079
|
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) {
|
@@ -19049,27 +19082,24 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19049
19082
|
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
|
19050
19083
|
cta = '商品CTA';
|
19051
19084
|
}
|
19052
|
-
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)) {
|
19053
|
-
cta = '服务CTA';
|
19054
|
-
}
|
19055
19085
|
else {
|
19056
|
-
cta = (
|
19086
|
+
cta = (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
|
19057
19087
|
}
|
19058
19088
|
const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
|
19059
19089
|
const isNineProduct = (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nineProductEnable) &&
|
19060
19090
|
index === ((rtcList === null || rtcList === void 0 ? void 0 : rtcList[0]) === 'organic menu' ? 2 : 1) &&
|
19061
|
-
((
|
19091
|
+
((_f = ['MultiCommodity', 'MultiCommodityDiro', 'MultiCommodityDiroNew']) === null || _f === void 0 ? void 0 : _f.includes((_g = value === null || value === void 0 ? void 0 : value.item) === null || _g === void 0 ? void 0 : _g.type));
|
19062
19092
|
return (React.createElement(React.Fragment, null,
|
19063
19093
|
isNineProduct && (React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value, isNineProduct: isNineProduct })),
|
19064
|
-
((
|
19065
|
-
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(
|
19094
|
+
((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.title) && !isShowMore && React.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
|
19095
|
+
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.bottomInfoDist) !== null && _j !== void 0 ? _j : 40}px` } },
|
19066
19096
|
React.createElement(Nudge, { nudge: nudge }),
|
19067
19097
|
((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' },
|
19068
19098
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
|
19069
19099
|
React.createElement("div", null,
|
19070
|
-
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: (
|
19100
|
+
React.createElement(ExpandableText$1, { className: 'clc-sxp-bottom-text', isPost: true, foldText: tipText === null || tipText === void 0 ? void 0 : tipText.foldText, unfoldText: tipText === null || tipText === void 0 ? void 0 : tipText.unfoldText, text: (_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.title) !== null && _l !== void 0 ? _l : '', style: Object.assign(Object.assign({}, descStyle), { textShadow: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isOpenTextShadow) ? '2px 2px 4px rgba(0, 0, 0, 0.5)' : 'none' }), onChange: onExpandableChange }),
|
19071
19101
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
|
19072
|
-
React.createElement(Hashtag$1, { index: activeIndex, tags: (
|
19102
|
+
React.createElement(Hashtag$1, { index: activeIndex, tags: (_o = (_m = rec === null || rec === void 0 ? void 0 : rec.video) === null || _m === void 0 ? void 0 : _m.hashTags) !== null && _o !== void 0 ? _o : [], itemId: (_p = rec === null || rec === void 0 ? void 0 : rec.video) === null || _p === void 0 ? void 0 : _p.itemId, itemType: ((_q = rec === null || rec === void 0 ? void 0 : rec.video) === null || _q === void 0 ? void 0 : _q.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle, hashTagRightMargin: containerWidth - (hashTagRightMargin !== null && hashTagRightMargin !== void 0 ? hashTagRightMargin : 0) }))),
|
19073
19103
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
|
19074
19104
|
}
|
19075
19105
|
return null;
|
@@ -19108,7 +19138,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19108
19138
|
return null;
|
19109
19139
|
}, [globalConfig, waterFallData]);
|
19110
19140
|
const handleViewImageStartEnd = (item) => {
|
19111
|
-
var _a, _b, _c, _d, _e, _f
|
19141
|
+
var _a, _b, _c, _d, _e, _f;
|
19112
19142
|
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)) {
|
19113
19143
|
const endTime = Date.now();
|
19114
19144
|
const duration = viewImageStartTime.current === 0 ? 0 : (endTime - viewImageStartTime.current) / 1000;
|
@@ -19117,11 +19147,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19117
19147
|
eventSubject: 'viewImageCarouselEnd',
|
19118
19148
|
eventDescription: 'User end view the image carousel',
|
19119
19149
|
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 : '',
|
19120
|
-
|
19121
|
-
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
19150
|
+
contentName: (_e = item === null || item === void 0 ? void 0 : item.video.title) !== null && _e !== void 0 ? _e : '',
|
19122
19151
|
imageEndTime: `${endTime}`,
|
19123
19152
|
playDuration: `${duration}`,
|
19124
|
-
contentTags: JSON.stringify((
|
19153
|
+
contentTags: JSON.stringify((_f = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _f !== void 0 ? _f : []),
|
19125
19154
|
position: activeIndex + '',
|
19126
19155
|
contentFormat: 'image',
|
19127
19156
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo
|
@@ -19130,7 +19159,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19130
19159
|
}
|
19131
19160
|
};
|
19132
19161
|
const handleSlideSkip = (item, position) => {
|
19133
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x
|
19162
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
19134
19163
|
if (isPreview || waterFallData)
|
19135
19164
|
return;
|
19136
19165
|
const t = new Date() - curTime.current;
|
@@ -19156,8 +19185,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19156
19185
|
contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
|
19157
19186
|
position: position + '',
|
19158
19187
|
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 : '',
|
19159
|
-
|
19160
|
-
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 : '',
|
19188
|
+
traceInfo: (_x = (_v = (_u = item === null || item === void 0 ? void 0 : item.video) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : (_w = item === null || item === void 0 ? void 0 : item.product) === null || _w === void 0 ? void 0 : _w.traceInfo) !== null && _x !== void 0 ? _x : '',
|
19161
19189
|
contentFormat
|
19162
19190
|
}
|
19163
19191
|
});
|
@@ -19167,7 +19195,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19167
19195
|
}
|
19168
19196
|
};
|
19169
19197
|
const handleScrollEvent = (swiper) => {
|
19170
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w
|
19198
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
|
19171
19199
|
const item = data[swiper.previousIndex];
|
19172
19200
|
if (!item)
|
19173
19201
|
return;
|
@@ -19184,12 +19212,11 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19184
19212
|
eventSubject: 'scrollDown',
|
19185
19213
|
eventDescription: 'User scroll down',
|
19186
19214
|
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 : '',
|
19187
|
-
|
19188
|
-
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 : '',
|
19215
|
+
productId: (_g = (_f = item === null || item === void 0 ? void 0 : item.product) === null || _f === void 0 ? void 0 : _f.itemId) !== null && _g !== void 0 ? _g : '',
|
19189
19216
|
requestId: null,
|
19190
|
-
traceInfo: (
|
19217
|
+
traceInfo: (_l = (_j = (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.traceInfo) !== null && _j !== void 0 ? _j : (_k = item === null || item === void 0 ? void 0 : item.product) === null || _k === void 0 ? void 0 : _k.traceInfo) !== null && _l !== void 0 ? _l : '',
|
19191
19218
|
contentFormat,
|
19192
|
-
position: ((
|
19219
|
+
position: ((_m = swiper.previousIndex) !== null && _m !== void 0 ? _m : 0) + ''
|
19193
19220
|
}
|
19194
19221
|
});
|
19195
19222
|
// 如果上一个商品是图片集,需上报 浏览图片集结结束 事件
|
@@ -19201,13 +19228,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19201
19228
|
eventInfo: {
|
19202
19229
|
eventSubject: 'scrollUp',
|
19203
19230
|
eventDescription: 'User scroll up',
|
19204
|
-
contentId: (
|
19205
|
-
|
19206
|
-
productId: (_x = (_w = item.product) === null || _w === void 0 ? void 0 : _w.itemId) !== null && _x !== void 0 ? _x : '',
|
19231
|
+
contentId: (_p = (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.itemId) !== null && _p !== void 0 ? _p : '',
|
19232
|
+
productId: (_r = (_q = item.product) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
|
19207
19233
|
requestId: null,
|
19208
|
-
traceInfo: (
|
19234
|
+
traceInfo: (_v = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_u = item === null || item === void 0 ? void 0 : item.product) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : '',
|
19209
19235
|
contentFormat,
|
19210
|
-
position: ((
|
19236
|
+
position: ((_w = swiper.previousIndex) !== null && _w !== void 0 ? _w : 0) + ''
|
19211
19237
|
}
|
19212
19238
|
});
|
19213
19239
|
// 如果上一个商品是图片集,需上报 浏览图片集结结束 事件
|
@@ -19233,7 +19259,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19233
19259
|
}
|
19234
19260
|
}, [openHashtag, data, activeIndex]);
|
19235
19261
|
const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
|
19236
|
-
var _a, _b, _c, _d, _e, _f, _g, _h
|
19262
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
19237
19263
|
const item = data[activeIndex];
|
19238
19264
|
// 如果是图片集则上报事件
|
19239
19265
|
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)) {
|
@@ -19244,10 +19270,9 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19244
19270
|
eventSubject: 'viewImageCarouselStart',
|
19245
19271
|
eventDescription: 'User start view the image carousel',
|
19246
19272
|
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 : '',
|
19247
|
-
|
19248
|
-
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
19273
|
+
contentName: (_e = item === null || item === void 0 ? void 0 : item.video.title) !== null && _e !== void 0 ? _e : '',
|
19249
19274
|
imageStartTime: `${startTime}`,
|
19250
|
-
contentTags: JSON.stringify((
|
19275
|
+
contentTags: JSON.stringify((_f = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _f !== void 0 ? _f : []),
|
19251
19276
|
position: activeIndex + '',
|
19252
19277
|
contentFormat: 'image',
|
19253
19278
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
|
@@ -19257,11 +19282,11 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19257
19282
|
if (enableCapi) {
|
19258
19283
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
19259
19284
|
eventName: 'ViewContent',
|
19260
|
-
product: (
|
19285
|
+
product: (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.bindProduct
|
19261
19286
|
});
|
19262
19287
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
19263
19288
|
eventName: 'PageView',
|
19264
|
-
product: (
|
19289
|
+
product: (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.bindProduct
|
19265
19290
|
});
|
19266
19291
|
}
|
19267
19292
|
}
|
@@ -19353,20 +19378,15 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19353
19378
|
swiperRef.current.swiper.allowTouchMove = true;
|
19354
19379
|
}, 500);
|
19355
19380
|
}, onActiveIndexChange: (swiper) => {
|
19356
|
-
var _a, _b;
|
19357
19381
|
setActiveIndex(swiper.activeIndex);
|
19358
19382
|
if (openHashtag)
|
19359
19383
|
return;
|
19360
19384
|
// 处理上滑下滑事件
|
19361
19385
|
handleScrollEvent(swiper);
|
19362
|
-
if (waterFallData || isEditor)
|
19386
|
+
if (waterFallData || isEditor || isDiyH5)
|
19363
19387
|
return;
|
19364
19388
|
if ((swiper === null || swiper === void 0 ? void 0 : swiper.activeIndex) + 1 >= (data === null || data === void 0 ? void 0 : data.length)) {
|
19365
19389
|
if (!isLoadMore) {
|
19366
|
-
if (isDiyH5) {
|
19367
|
-
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
19368
|
-
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
19369
|
-
}
|
19370
19390
|
setIsLoadMore(true);
|
19371
19391
|
loadVideos === null || loadVideos === void 0 ? void 0 : loadVideos(pageNum).then((res) => {
|
19372
19392
|
var _a;
|
@@ -19419,7 +19439,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19419
19439
|
}, []);
|
19420
19440
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
19421
19441
|
const handlePlaying = React.useCallback(() => {
|
19422
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o
|
19442
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
19423
19443
|
setIsPauseVideo(false);
|
19424
19444
|
const item = data[index];
|
19425
19445
|
if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
|
@@ -19432,15 +19452,14 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19432
19452
|
eventSubject: 'playVideo',
|
19433
19453
|
eventDescription: 'User played the video',
|
19434
19454
|
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 : '',
|
19435
|
-
|
19436
|
-
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 : '',
|
19455
|
+
contentName: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.title) !== null && _k !== void 0 ? _k : '',
|
19437
19456
|
playType,
|
19438
19457
|
startTime: videoCurrentTime,
|
19439
19458
|
videoDuration,
|
19440
|
-
contentTags: JSON.stringify((
|
19459
|
+
contentTags: JSON.stringify((_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.tags) !== null && _m !== void 0 ? _m : []),
|
19441
19460
|
position: index + '',
|
19442
19461
|
contentFormat: 'video',
|
19443
|
-
traceInfo: (
|
19462
|
+
traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
19444
19463
|
}
|
19445
19464
|
});
|
19446
19465
|
setIsFirstPlay(false);
|
@@ -19479,7 +19498,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19479
19498
|
}
|
19480
19499
|
}, [isLoadFinish]);
|
19481
19500
|
const onPause = React.useCallback(() => {
|
19482
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o
|
19501
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
19483
19502
|
const item = data[index];
|
19484
19503
|
const videoDuration = ((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
|
19485
19504
|
const videoCurrentTime = ((_d = (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
|
@@ -19490,15 +19509,14 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19490
19509
|
eventSubject: 'playOverVideo',
|
19491
19510
|
eventDescription: 'User finished playing the video',
|
19492
19511
|
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 : '',
|
19493
|
-
|
19494
|
-
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 : '',
|
19512
|
+
contentName: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.title) !== null && _k !== void 0 ? _k : '',
|
19495
19513
|
endTime: videoCurrentTime,
|
19496
19514
|
videoDuration,
|
19497
19515
|
playDuration,
|
19498
|
-
contentTags: JSON.stringify((
|
19516
|
+
contentTags: JSON.stringify((_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.tags) !== null && _m !== void 0 ? _m : []),
|
19499
19517
|
position: index + '',
|
19500
19518
|
contentFormat: 'video',
|
19501
|
-
traceInfo: (
|
19519
|
+
traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
19502
19520
|
}
|
19503
19521
|
});
|
19504
19522
|
}
|