pb-sxp-ui 1.20.7 → 1.20.9
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 +290 -188
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +290 -188
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +7 -7
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +7 -7
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +290 -188
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +7 -7
- 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 +20 -18
- package/es/core/components/SxpPageRender/PictureGroup/index.d.ts +5 -0
- package/es/core/components/SxpPageRender/PictureGroup/index.js +39 -13
- package/es/core/components/SxpPageRender/VideoWidget/index.js +33 -46
- package/es/core/components/SxpPageRender/WaterFall/index.js +4 -3
- package/es/core/components/SxpPageRender/index.js +56 -40
- package/es/core/context/SxpDataSourceProvider.d.ts +5 -12
- package/es/core/context/SxpDataSourceProvider.js +123 -55
- 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 +20 -18
- package/lib/core/components/SxpPageRender/PictureGroup/index.d.ts +5 -0
- package/lib/core/components/SxpPageRender/PictureGroup/index.js +38 -12
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +33 -46
- package/lib/core/components/SxpPageRender/WaterFall/index.js +4 -3
- package/lib/core/components/SxpPageRender/index.js +56 -40
- package/lib/core/context/SxpDataSourceProvider.d.ts +5 -12
- package/lib/core/context/SxpDataSourceProvider.js +123 -55
- package/lib/core/hooks/useEventReport.js +6 -5
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -667,6 +667,7 @@ const DEFAULT_TAG = 'FOR U';
|
|
|
667
667
|
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 }) => {
|
|
668
668
|
var _a, _b, _c, _d, _e;
|
|
669
669
|
const [rtcList, setRtcList] = React.useState([]);
|
|
670
|
+
const [firstRtcList, setFirstRtcList] = React.useState([]);
|
|
670
671
|
const [tagList, setTagList] = React.useState([]);
|
|
671
672
|
const [loading, setLoading] = React.useState(true);
|
|
672
673
|
const [curReqInfo, setCurReqInfo] = React.useState({ rtc: '', requestId: '' });
|
|
@@ -698,6 +699,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
698
699
|
const [chatlabsId, setChatlabsId] = React.useState();
|
|
699
700
|
const finalPageData = React.useMemo(() => pageData !== null && pageData !== void 0 ? pageData : data, [pageData, data]);
|
|
700
701
|
const pixelPvStatusRef = React.useRef(false);
|
|
702
|
+
const isDiyPage = React.useMemo(() => {
|
|
703
|
+
var _a, _b, _c;
|
|
704
|
+
return isDiyH5 && !((_c = (_b = (_a = finalPageData === null || finalPageData === void 0 ? void 0 : finalPageData.data) === null || _a === void 0 ? void 0 : _a.sxpPageConf) === null || _b === void 0 ? void 0 : _b.globalConfig) === null || _c === void 0 ? void 0 : _c.enablePreview);
|
|
705
|
+
}, [isDiyH5, finalPageData]);
|
|
701
706
|
React.useEffect(() => {
|
|
702
707
|
var _a, _b;
|
|
703
708
|
setGlobalConfig((_b = (_a = data === null || data === void 0 ? void 0 : data.data) === null || _a === void 0 ? void 0 : _a.sxpPageConf) === null || _b === void 0 ? void 0 : _b.globalConfig);
|
|
@@ -793,14 +798,17 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
793
798
|
return '';
|
|
794
799
|
}
|
|
795
800
|
const OptanonConsent = decodeURIComponent((_a = getCookie('OptanonConsent')) !== null && _a !== void 0 ? _a : '');
|
|
796
|
-
if ((
|
|
801
|
+
if ((window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups) &&
|
|
802
|
+
((_b = window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups) === null || _b === void 0 ? void 0 : _b.length) > 2 &&
|
|
803
|
+
!(window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups.includes('4')) &&
|
|
804
|
+
isTargetingRejected(OptanonConsent)) {
|
|
797
805
|
return true;
|
|
798
806
|
}
|
|
799
807
|
return false;
|
|
800
808
|
};
|
|
801
809
|
// bff API 请求方法
|
|
802
810
|
const bffFetch = React.useCallback((path, options, isBota = true) => {
|
|
803
|
-
var _a;
|
|
811
|
+
var _a, _b;
|
|
804
812
|
if (!bffDataSource)
|
|
805
813
|
return;
|
|
806
814
|
const url = bffDataSource.url;
|
|
@@ -813,8 +821,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
813
821
|
val.split('=')[0];
|
|
814
822
|
val.split('=')[1];
|
|
815
823
|
});
|
|
824
|
+
options.body = Object.assign(Object.assign({}, options.body), { productUserId: fakeUserId });
|
|
816
825
|
return window
|
|
817
|
-
.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
|
|
826
|
+
.fetch(`${url}/api/${path}`, Object.assign({ headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId, 'tenant-id': (_b = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _b === void 0 ? void 0 : _b['x-app-id'] }, bffDataSource.headers), method: options.method, body: options.type === 'beacon' && isBota
|
|
818
827
|
? JSON.stringify({
|
|
819
828
|
body: btoa(encodeURIComponent(JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))))
|
|
820
829
|
})
|
|
@@ -846,7 +855,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
846
855
|
const originalSrcDescriptor = Object.getOwnPropertyDescriptor(HTMLImageElement.prototype, 'src');
|
|
847
856
|
Object.defineProperty(img, 'src', {
|
|
848
857
|
set(value) {
|
|
849
|
-
if (getTargetingCookie() &&
|
|
858
|
+
if (getTargetingCookie() &&
|
|
859
|
+
(value.includes('https://www.facebook.com/privacy_sandbox/pixel/register/trigger/') ||
|
|
860
|
+
value.includes('https://www.facebook.com/tr'))) {
|
|
850
861
|
return;
|
|
851
862
|
}
|
|
852
863
|
// 继续正常设置 src
|
|
@@ -884,7 +895,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
884
895
|
// 覆盖方法
|
|
885
896
|
navigatorWithBeacon.sendBeacon = function (url, data) {
|
|
886
897
|
const urlString = url instanceof URL ? url.href : url.toString();
|
|
887
|
-
if (getTargetingCookie() &&
|
|
898
|
+
if (getTargetingCookie() &&
|
|
899
|
+
(urlString.includes('https://tr.snapchat.com/p') ||
|
|
900
|
+
urlString.includes('https://analytics.tiktok.com/api/v2/pixel'))) {
|
|
888
901
|
return true;
|
|
889
902
|
}
|
|
890
903
|
const success = originalSendBeacon(url, data);
|
|
@@ -971,18 +984,16 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
971
984
|
// 安全获取 URL 字符串
|
|
972
985
|
let url;
|
|
973
986
|
try {
|
|
974
|
-
url = typeof input === 'string'
|
|
975
|
-
? input
|
|
976
|
-
: input instanceof URL
|
|
977
|
-
? input.href
|
|
978
|
-
: input.url;
|
|
987
|
+
url = typeof input === 'string' ? input : input instanceof URL ? input.href : input.url;
|
|
979
988
|
}
|
|
980
989
|
catch (error) {
|
|
981
990
|
console.error('解析请求URL失败:', error);
|
|
982
991
|
return _originalFetch.apply(this, arguments_1);
|
|
983
992
|
}
|
|
984
993
|
try {
|
|
985
|
-
if (getTargetingCookie() &&
|
|
994
|
+
if (getTargetingCookie() &&
|
|
995
|
+
(url.includes('https://www.google-analytics.com/g/collect') ||
|
|
996
|
+
url.includes('https://arms-retcode.aliyuncs.com/r.png'))) {
|
|
986
997
|
return Promise.resolve(new Response(''));
|
|
987
998
|
}
|
|
988
999
|
// 1. 先执行原始请求
|
|
@@ -1038,7 +1049,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1038
1049
|
};
|
|
1039
1050
|
XMLHttpRequest.prototype.send = function (body) {
|
|
1040
1051
|
var _a;
|
|
1041
|
-
if (getTargetingCookie() &&
|
|
1052
|
+
if (getTargetingCookie() &&
|
|
1053
|
+
this._url &&
|
|
1054
|
+
typeof this._url === 'string' &&
|
|
1055
|
+
(this._url.includes('https://rumcollector.uptime.com') ||
|
|
1056
|
+
this._url.includes('https://arms-retcode.aliyuncs.com/r.png') ||
|
|
1057
|
+
this._url.includes('https://i.giesswein.com/nb-collector'))) {
|
|
1042
1058
|
return;
|
|
1043
1059
|
}
|
|
1044
1060
|
if (this._url && typeof this._url === 'string' && this._url.includes('https://i.giesswein.com/nb-collector')) {
|
|
@@ -1092,8 +1108,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1092
1108
|
}, [bffDataSource]);
|
|
1093
1109
|
// 获取推荐视频数据
|
|
1094
1110
|
const getRecommendVideos = React.useCallback((query) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1095
|
-
var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
|
|
1096
|
-
query = Object.assign(Object.assign({ maxSize: (_f = query === null || query === void 0 ? void 0 : query.maxSize) !== null && _f !== void 0 ? _f : maxSize, defaultSize: (_g = query === null || query === void 0 ? void 0 : query.defaultSize) !== null && _g !== void 0 ? _g : defaultSize, hashTag: query === null || query === void 0 ? void 0 : query.hashTag, traceInfo: query === null || query === void 0 ? void 0 : query.traceInfo, themeTag: query === null || query === void 0 ? void 0 : query.themeTag, pageNum: query === null || query === void 0 ? void 0 : query.pageNum, contentFilter: query === null || query === void 0 ? void 0 : query.contentFilter, productFilter: query === null || query === void 0 ? void 0 : query.productFilter }, (chatlabsId && { chatlabsId })), (
|
|
1111
|
+
var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
|
1112
|
+
query = Object.assign(Object.assign({ maxSize: (_f = query === null || query === void 0 ? void 0 : query.maxSize) !== null && _f !== void 0 ? _f : maxSize, defaultSize: (_g = query === null || query === void 0 ? void 0 : query.defaultSize) !== null && _g !== void 0 ? _g : defaultSize, hashTag: query === null || query === void 0 ? void 0 : query.hashTag, traceInfo: query === null || query === void 0 ? void 0 : query.traceInfo, themeTag: query === null || query === void 0 ? void 0 : query.themeTag, pageNum: query === null || query === void 0 ? void 0 : query.pageNum, contentFilter: query === null || query === void 0 ? void 0 : query.contentFilter, productFilter: query === null || query === void 0 ? void 0 : query.productFilter }, (chatlabsId && { chatlabsId })), (isDiyPage && { type: 'story' }));
|
|
1097
1113
|
if (channel) {
|
|
1098
1114
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(channel) });
|
|
1099
1115
|
}
|
|
@@ -1106,9 +1122,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1106
1122
|
if (val)
|
|
1107
1123
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
|
|
1108
1124
|
}
|
|
1125
|
+
const isDiy = isDiyH5 && ((_o = (_m = (_l = finalPageData === null || finalPageData === void 0 ? void 0 : finalPageData.data) === null || _l === void 0 ? void 0 : _l.sxpPageConf) === null || _m === void 0 ? void 0 : _m.globalConfig) === null || _o === void 0 ? void 0 : _o.enablePreview);
|
|
1109
1126
|
if (isEditor) {
|
|
1110
1127
|
let pageNum = 1;
|
|
1111
|
-
query = Object.assign(Object.assign(Object.assign({}, query), { directPage: true, level: 1 }), (!utmVal && channelQueryList && (channelQueryList === null || channelQueryList === void 0 ? void 0 : channelQueryList.length) > 0 && { channel: channelQueryList === null || channelQueryList === void 0 ? void 0 : channelQueryList[0] }));
|
|
1128
|
+
query = Object.assign(Object.assign(Object.assign(Object.assign({}, query), { directPage: true, level: 1 }), (!utmVal && channelQueryList && (channelQueryList === null || channelQueryList === void 0 ? void 0 : channelQueryList.length) > 0 && { channel: channelQueryList === null || channelQueryList === void 0 ? void 0 : channelQueryList[0] })), (isDiy && { maxRecs: query === null || query === void 0 ? void 0 : query.maxSize }));
|
|
1112
1129
|
if (!(query === null || query === void 0 ? void 0 : query.channel) || isInit.current) {
|
|
1113
1130
|
return undefined;
|
|
1114
1131
|
}
|
|
@@ -1116,19 +1133,24 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1116
1133
|
let list = [];
|
|
1117
1134
|
let result = null;
|
|
1118
1135
|
const recurveRecList = (query) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1119
|
-
var
|
|
1136
|
+
var _y, _z, _0, _1, _2, _3;
|
|
1120
1137
|
query.pageNum = pageNum;
|
|
1121
|
-
result =
|
|
1138
|
+
result = isDiyH5
|
|
1139
|
+
? yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v3/recommend/direct/page/view', { method: 'POST', body: query }))
|
|
1140
|
+
: yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('recommend/direct_page', { method: 'POST', body: query }));
|
|
1122
1141
|
if (!(result === null || result === void 0 ? void 0 : result.success)) {
|
|
1123
1142
|
return undefined;
|
|
1124
1143
|
}
|
|
1125
1144
|
setLoading(false);
|
|
1126
|
-
list = list.concat((
|
|
1145
|
+
list = list.concat((_1 = (_0 = (_z = (_y = result === null || result === void 0 ? void 0 : result.data) === null || _y === void 0 ? void 0 : _y.recList) === null || _z === void 0 ? void 0 : _z.filter) === null || _0 === void 0 ? void 0 : _0.call(_z, (item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video))) !== null && _1 !== void 0 ? _1 : []);
|
|
1127
1146
|
if ((rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) === 0) {
|
|
1128
1147
|
setRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
|
1129
1148
|
setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
|
1149
|
+
if (isDiyPage) {
|
|
1150
|
+
setFirstRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
|
1151
|
+
}
|
|
1130
1152
|
}
|
|
1131
|
-
const isNotNullList = (
|
|
1153
|
+
const isNotNullList = (_3 = (_2 = result === null || result === void 0 ? void 0 : result.data) === null || _2 === void 0 ? void 0 : _2.recList) === null || _3 === void 0 ? void 0 : _3.some((item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video));
|
|
1132
1154
|
if (isNotNullList) {
|
|
1133
1155
|
pageNum = pageNum + 1;
|
|
1134
1156
|
yield recurveRecList(query);
|
|
@@ -1136,42 +1158,61 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1136
1158
|
});
|
|
1137
1159
|
yield recurveRecList(query);
|
|
1138
1160
|
if (!(query === null || query === void 0 ? void 0 : query.hashTag) && result)
|
|
1139
|
-
setCurReqInfo({ rtc: (
|
|
1161
|
+
setCurReqInfo({ rtc: (_p = result === null || result === void 0 ? void 0 : result.data) === null || _p === void 0 ? void 0 : _p.rtc, requestId: (_q = result === null || result === void 0 ? void 0 : result.data) === null || _q === void 0 ? void 0 : _q.requestId });
|
|
1140
1162
|
return Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list });
|
|
1141
1163
|
}
|
|
1142
1164
|
if (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) {
|
|
1143
|
-
query = Object.assign(Object.assign({}, query), { directPage: true, level: 1, pageNum: (
|
|
1165
|
+
query = Object.assign(Object.assign(Object.assign({}, query), { directPage: true, level: 1, pageNum: (_r = query === null || query === void 0 ? void 0 : query.pageNum) !== null && _r !== void 0 ? _r : 1 }), (isDiy && { maxRecs: query === null || query === void 0 ? void 0 : query.maxSize }));
|
|
1144
1166
|
}
|
|
1145
|
-
const result =
|
|
1146
|
-
method: 'POST',
|
|
1147
|
-
|
|
1148
|
-
|
|
1167
|
+
const result = isDiy
|
|
1168
|
+
? yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v3/recommend/direct/page/view', { method: 'POST', body: query }))
|
|
1169
|
+
: yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/list', {
|
|
1170
|
+
method: 'POST',
|
|
1171
|
+
body: query
|
|
1172
|
+
}));
|
|
1149
1173
|
if (!(result === null || result === void 0 ? void 0 : result.success)) {
|
|
1150
1174
|
return undefined;
|
|
1151
1175
|
}
|
|
1152
1176
|
if (!(query === null || query === void 0 ? void 0 : query.hashTag))
|
|
1153
1177
|
setCurReqInfo({ rtc: result.data.rtc, requestId: result.data.requestId });
|
|
1154
1178
|
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) && !isEditor) {
|
|
1155
|
-
const isNotNullList = (
|
|
1179
|
+
const isNotNullList = (_t = (_s = result === null || result === void 0 ? void 0 : result.data) === null || _s === void 0 ? void 0 : _s.recList) === null || _t === void 0 ? void 0 : _t.some((item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video));
|
|
1156
1180
|
if (!isNotNullList) {
|
|
1157
1181
|
setIsNoMoreData(true);
|
|
1158
1182
|
}
|
|
1159
1183
|
}
|
|
1160
1184
|
let list = [];
|
|
1161
|
-
list = list.concat((
|
|
1185
|
+
list = list.concat((_x = (_w = (_v = (_u = result === null || result === void 0 ? void 0 : result.data) === null || _u === void 0 ? void 0 : _u.recList) === null || _v === void 0 ? void 0 : _v.filter) === null || _w === void 0 ? void 0 : _w.call(_v, (item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video))) !== null && _x !== void 0 ? _x : []);
|
|
1162
1186
|
return Object.assign(Object.assign({}, result.data), { recList: list });
|
|
1163
|
-
}), [
|
|
1187
|
+
}), [
|
|
1188
|
+
bffFetch,
|
|
1189
|
+
utmVal,
|
|
1190
|
+
maxSize,
|
|
1191
|
+
defaultSize,
|
|
1192
|
+
channelQueryList,
|
|
1193
|
+
channel,
|
|
1194
|
+
chatlabsId,
|
|
1195
|
+
bffFetchAdmin,
|
|
1196
|
+
isDiyPage,
|
|
1197
|
+
finalPageData,
|
|
1198
|
+
isDiyH5
|
|
1199
|
+
]);
|
|
1164
1200
|
const loadVideos = React.useCallback((pageNum) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1165
|
-
var
|
|
1201
|
+
var _4, _5, _6, _7;
|
|
1166
1202
|
if (rtcList.length <= 0) {
|
|
1167
1203
|
return;
|
|
1168
1204
|
}
|
|
1205
|
+
if (isDiyPage && (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) > 0) {
|
|
1206
|
+
setRtcList(rtcList.concat(firstRtcList));
|
|
1207
|
+
setCacheRtcList(cacheRtcList.concat(firstRtcList));
|
|
1208
|
+
return;
|
|
1209
|
+
}
|
|
1169
1210
|
const lastItem = rtcList === null || rtcList === void 0 ? void 0 : rtcList[(rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) - 1];
|
|
1170
|
-
const data = yield getRecommendVideos(Object.assign(Object.assign(Object.assign(Object.assign({ hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag }, (((
|
|
1211
|
+
const data = yield getRecommendVideos(Object.assign(Object.assign(Object.assign(Object.assign({ hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag }, (((_4 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.product) === null || _4 === void 0 ? void 0 : _4.itemId) && { productFilter: [(_5 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.product) === null || _5 === void 0 ? void 0 : _5.itemId] })), (((_6 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.video) === null || _6 === void 0 ? void 0 : _6.itemId) && { contentFilter: [(_7 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.video) === null || _7 === void 0 ? void 0 : _7.itemId] })), { themeTag: themeTag.current }), ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) && !isEditor && { pageNum })));
|
|
1171
1212
|
setRtcList(rtcList.concat(getFilterRecList(data)));
|
|
1172
1213
|
setCacheRtcList(cacheRtcList.concat(getFilterRecList(data)));
|
|
1173
1214
|
return data;
|
|
1174
|
-
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
|
|
1215
|
+
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList, isDiyPage, firstRtcList]);
|
|
1175
1216
|
const refreshFeSession = React.useCallback((enableReSid, event) => {
|
|
1176
1217
|
var _a, _b, _c, _d, _e;
|
|
1177
1218
|
let expire = false;
|
|
@@ -1202,8 +1243,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1202
1243
|
// 用户信息都是公共的
|
|
1203
1244
|
if (!userInfo) {
|
|
1204
1245
|
userInfo = {
|
|
1205
|
-
|
|
1206
|
-
|
|
1246
|
+
productUserId: fakeUserId // 后端逻辑会从请求头获取,所以不需要传
|
|
1247
|
+
// tpChannelId: 'H5' // 后端处理
|
|
1207
1248
|
};
|
|
1208
1249
|
}
|
|
1209
1250
|
const sessionID = storeAndLoadFeSessionId();
|
|
@@ -1237,7 +1278,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1237
1278
|
layoutVariantId,
|
|
1238
1279
|
globalConfig,
|
|
1239
1280
|
playbookType,
|
|
1240
|
-
bffDataSource
|
|
1281
|
+
bffDataSource,
|
|
1282
|
+
fakeUserId
|
|
1241
1283
|
]);
|
|
1242
1284
|
const getEventParamsByJson = React.useCallback((_a) => {
|
|
1243
1285
|
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
|
@@ -1263,23 +1305,37 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1263
1305
|
}))) !== null && _j !== void 0 ? _j : [], image_urls: (_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.imgUrls) !== null && _l !== void 0 ? _l : [], video_urls: (_m = rec === null || rec === void 0 ? void 0 : rec.video) === null || _m === void 0 ? void 0 : _m.url,
|
|
1264
1306
|
// prompt
|
|
1265
1307
|
headline: getUrlParamByKey('headline'), scene: getUrlParamByKey('scene'), campaign_id: getUrlParamByKey('campaign_id'), ad_id: getUrlParamByKey('ad_id'), utm_source: getUrlParamByKey('utm_source'), utm_medium: getUrlParamByKey('utm_medium'), utm_campaign: getUrlParamByKey('utm_campaign'), utm_content: getUrlParamByKey('utm_content') }, props);
|
|
1266
|
-
if (!((_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.url) &&
|
|
1308
|
+
if (!((_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.url) &&
|
|
1309
|
+
!((_q = (_p = rec === null || rec === void 0 ? void 0 : rec.video) === null || _p === void 0 ? void 0 : _p.imgUrls) === null || _q === void 0 ? void 0 : _q.length) &&
|
|
1310
|
+
(rec === null || rec === void 0 ? void 0 : rec.product) &&
|
|
1311
|
+
Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) &&
|
|
1312
|
+
((_r = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _r === void 0 ? void 0 : _r.length) > 0) {
|
|
1267
1313
|
const product = rec === null || rec === void 0 ? void 0 : rec.product;
|
|
1268
1314
|
const productCustomData = {
|
|
1269
1315
|
content_ids: [product === null || product === void 0 ? void 0 : product.itemId],
|
|
1270
1316
|
content_type: 'product',
|
|
1271
1317
|
content_name: '',
|
|
1272
|
-
contents: [
|
|
1318
|
+
contents: [
|
|
1319
|
+
{
|
|
1273
1320
|
id: product === null || product === void 0 ? void 0 : product.itemId,
|
|
1274
1321
|
item_price: product === null || product === void 0 ? void 0 : product.price
|
|
1275
|
-
}
|
|
1322
|
+
}
|
|
1323
|
+
],
|
|
1276
1324
|
image_urls: (_s = product.homePage) !== null && _s !== void 0 ? _s : []
|
|
1277
1325
|
};
|
|
1278
1326
|
customData = Object.assign(Object.assign({}, customData), productCustomData);
|
|
1279
1327
|
}
|
|
1280
1328
|
if (eventName === 'ContentSwipe' || eventName === 'Engagement' || eventName === 'ExitFeed') {
|
|
1281
|
-
const deleteKeys = [
|
|
1282
|
-
|
|
1329
|
+
const deleteKeys = [
|
|
1330
|
+
'content_ids',
|
|
1331
|
+
'content_category',
|
|
1332
|
+
'currency',
|
|
1333
|
+
'contents',
|
|
1334
|
+
'image_urls',
|
|
1335
|
+
'video_urls',
|
|
1336
|
+
'prompt'
|
|
1337
|
+
];
|
|
1338
|
+
deleteKeys.forEach((key) => {
|
|
1283
1339
|
if (customData === null || customData === void 0 ? void 0 : customData[key])
|
|
1284
1340
|
delete customData[key];
|
|
1285
1341
|
});
|
|
@@ -1385,7 +1441,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1385
1441
|
if ((snapchatPixelEventParamsJson === null || snapchatPixelEventParamsJson === void 0 ? void 0 : snapchatPixelEventParamsJson.event_name) && typeof (window === null || window === void 0 ? void 0 : window.snaptr) === 'function') {
|
|
1386
1442
|
window === null || window === void 0 ? void 0 : window.snaptr('track', snapchatPixelEventParamsJson === null || snapchatPixelEventParamsJson === void 0 ? void 0 : snapchatPixelEventParamsJson.event_name, getEventParamsByJson(Object.assign({ json: snapchatPixelEventParamsJson, eventName }, props)));
|
|
1387
1443
|
}
|
|
1388
|
-
if (eventName === 'PageView' &&
|
|
1444
|
+
if (eventName === 'PageView' &&
|
|
1445
|
+
typeof (window === null || window === void 0 ? void 0 : window.Northbeam) === 'object' &&
|
|
1446
|
+
typeof ((_g = window === null || window === void 0 ? void 0 : window.Northbeam) === null || _g === void 0 ? void 0 : _g.trackPageView) === 'function') {
|
|
1389
1447
|
(_h = window === null || window === void 0 ? void 0 : window.Northbeam) === null || _h === void 0 ? void 0 : _h.trackPageView();
|
|
1390
1448
|
}
|
|
1391
1449
|
const converApiEventParamsJson = (_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _j === void 0 ? void 0 : _j[eventName];
|
|
@@ -1407,38 +1465,40 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1407
1465
|
}
|
|
1408
1466
|
}, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig, bffDataSource, getEventParamsByJson]);
|
|
1409
1467
|
const bffMutateLike = React.useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1468
|
+
body = Object.assign(Object.assign({}, body), { productUserId: fakeUserId });
|
|
1410
1469
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/like', { method: 'POST', body }));
|
|
1411
1470
|
return res === null || res === void 0 ? void 0 : res.success;
|
|
1412
|
-
}), [bffFetch]);
|
|
1471
|
+
}), [bffFetch, fakeUserId]);
|
|
1413
1472
|
const bffMutateUnlike = React.useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1473
|
+
body = Object.assign(Object.assign({}, body), { productUserId: fakeUserId });
|
|
1414
1474
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/unlike', { method: 'POST', body }));
|
|
1415
1475
|
return res === null || res === void 0 ? void 0 : res.success;
|
|
1416
|
-
}), [bffFetch]);
|
|
1476
|
+
}), [bffFetch, fakeUserId]);
|
|
1417
1477
|
const bffSubmitForm = React.useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1418
1478
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/customform', { method: 'POST', body }));
|
|
1419
1479
|
return res === null || res === void 0 ? void 0 : res.success;
|
|
1420
1480
|
}), [bffFetch]);
|
|
1421
1481
|
// 获取 Tag
|
|
1422
1482
|
const bffGetTagList = React.useCallback((data) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1423
|
-
var
|
|
1424
|
-
const isShowTag = !!((
|
|
1483
|
+
var _8, _9, _10, _11, _12, _13, _14, _15;
|
|
1484
|
+
const isShowTag = !!((_10 = (_9 = (_8 = data === null || data === void 0 ? void 0 : data.data) === null || _8 === void 0 ? void 0 : _8.sxpPageConf) === null || _9 === void 0 ? void 0 : _9.globalConfig) === null || _10 === void 0 ? void 0 : _10.isShowTag);
|
|
1425
1485
|
if (!utmVal || !isShowTag)
|
|
1426
1486
|
return;
|
|
1427
1487
|
try {
|
|
1428
|
-
const val = (
|
|
1488
|
+
const val = (_13 = (_12 = (_11 = splitUrlParams(utmVal)) === null || _11 === void 0 ? void 0 : _11.filter((val) => {
|
|
1429
1489
|
var _a, _b;
|
|
1430
1490
|
const key = val.split('=')[0];
|
|
1431
1491
|
return (_b = ((_a = utmParameter === null || utmParameter === void 0 ? void 0 : utmParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
|
|
1432
|
-
})) === null ||
|
|
1492
|
+
})) === null || _12 === void 0 ? void 0 : _12.join('&')) !== null && _13 !== void 0 ? _13 : '';
|
|
1433
1493
|
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
|
|
1434
|
-
setTagList((
|
|
1494
|
+
setTagList((_15 = (_14 = result === null || result === void 0 ? void 0 : result.data) === null || _14 === void 0 ? void 0 : _14.tags) !== null && _15 !== void 0 ? _15 : []);
|
|
1435
1495
|
}
|
|
1436
1496
|
catch (e) {
|
|
1437
1497
|
console.log('e', e);
|
|
1438
1498
|
}
|
|
1439
1499
|
}), [bffFetch, utmVal]);
|
|
1440
1500
|
const ctaEvent = React.useCallback((eventInfo, rec, product, position, ctaActionType, targetUrl, contentType) => {
|
|
1441
|
-
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;
|
|
1501
|
+
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;
|
|
1442
1502
|
const cta = product === null || product === void 0 ? void 0 : product.bindCta;
|
|
1443
1503
|
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);
|
|
1444
1504
|
let fromKName = '';
|
|
@@ -1456,7 +1516,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1456
1516
|
}
|
|
1457
1517
|
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;
|
|
1458
1518
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
1459
|
-
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: (
|
|
1519
|
+
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 })
|
|
1460
1520
|
});
|
|
1461
1521
|
}, [bffEventReport, isFromHashtag]);
|
|
1462
1522
|
const h5EnterLink = React.useCallback(() => {
|
|
@@ -1480,10 +1540,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1480
1540
|
});
|
|
1481
1541
|
}, [bffEventReport]);
|
|
1482
1542
|
const getAccount = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
1483
|
-
var
|
|
1543
|
+
var _16, _17;
|
|
1484
1544
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/account', { method: 'GET' }));
|
|
1485
|
-
setChatlabsId((
|
|
1486
|
-
return ((
|
|
1545
|
+
setChatlabsId((_16 = res === null || res === void 0 ? void 0 : res.data) === null || _16 === void 0 ? void 0 : _16.chatLabsId);
|
|
1546
|
+
return ((_17 = res === null || res === void 0 ? void 0 : res.data) === null || _17 === void 0 ? void 0 : _17.consentResult) === 'true';
|
|
1487
1547
|
}), [bffFetch]);
|
|
1488
1548
|
const accountSonsent = React.useCallback((consentResult) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1489
1549
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/account/consent', {
|
|
@@ -1547,6 +1607,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1547
1607
|
}
|
|
1548
1608
|
setRtcList(list);
|
|
1549
1609
|
setCacheRtcList(list);
|
|
1610
|
+
if (isDiyPage) {
|
|
1611
|
+
setFirstRtcList(list);
|
|
1612
|
+
}
|
|
1550
1613
|
bffGetTagList(curData !== null && curData !== void 0 ? curData : finalPageData);
|
|
1551
1614
|
if (channel) {
|
|
1552
1615
|
const item = list === null || list === void 0 ? void 0 : list[0];
|
|
@@ -1566,7 +1629,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1566
1629
|
});
|
|
1567
1630
|
setLoading(false);
|
|
1568
1631
|
});
|
|
1569
|
-
}, [isShowConsent, channel]);
|
|
1632
|
+
}, [isShowConsent, channel, isDiyPage]);
|
|
1570
1633
|
// cms预览
|
|
1571
1634
|
React.useEffect(() => {
|
|
1572
1635
|
if (!isPreview)
|
|
@@ -1582,12 +1645,15 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1582
1645
|
}
|
|
1583
1646
|
setRtcList(list);
|
|
1584
1647
|
setCacheRtcList(list);
|
|
1648
|
+
if (isDiyPage) {
|
|
1649
|
+
setFirstRtcList(list);
|
|
1650
|
+
}
|
|
1585
1651
|
}
|
|
1586
1652
|
})
|
|
1587
1653
|
.finally(() => {
|
|
1588
1654
|
setLoading(false);
|
|
1589
1655
|
});
|
|
1590
|
-
}, [getRecommendVideos, bffGetTagList, channel]);
|
|
1656
|
+
}, [getRecommendVideos, bffGetTagList, channel, isDiyPage]);
|
|
1591
1657
|
const defaultLoadingImage = useIconLink('/pb_static/a65d23c5893c49d7aaaa81681d3179e2.gif', appDomain);
|
|
1592
1658
|
return (React.createElement(SxpDataSourceContext.Provider, { value: {
|
|
1593
1659
|
rtcList,
|
|
@@ -1645,7 +1711,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1645
1711
|
refreshFeSession,
|
|
1646
1712
|
getAccount,
|
|
1647
1713
|
accountSonsent,
|
|
1648
|
-
isDiyH5,
|
|
1714
|
+
isDiyH5: isDiyPage,
|
|
1715
|
+
firstRtcList,
|
|
1649
1716
|
pixelPvStatusRef
|
|
1650
1717
|
} }, 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({
|
|
1651
1718
|
rtcList,
|
|
@@ -2107,14 +2174,14 @@ var settingRender$f = [
|
|
|
2107
2174
|
* @Author: binruan@chatlabs.com
|
|
2108
2175
|
* @Date: 2024-03-12 10:59:06
|
|
2109
2176
|
* @LastEditors: binruan@chatlabs.com
|
|
2110
|
-
* @LastEditTime:
|
|
2177
|
+
* @LastEditTime: 2025-05-09 15:30:59
|
|
2111
2178
|
* @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
|
|
2112
2179
|
*
|
|
2113
2180
|
*/
|
|
2114
2181
|
function useEventReport() {
|
|
2115
2182
|
const { bffEventReport, popupDetailData, isFromHashtag, eventTimeList, setEventTimeList } = useSxpDataSource();
|
|
2116
2183
|
const jumpToWeb = React.useCallback((e, data, product, cta, position, traceInfo) => {
|
|
2117
|
-
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;
|
|
2184
|
+
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;
|
|
2118
2185
|
const i = eventTimeList === null || eventTimeList === void 0 ? void 0 : eventTimeList.findIndex((item) => item.target === (e === null || e === void 0 ? void 0 : e.target));
|
|
2119
2186
|
if (i !== -1) {
|
|
2120
2187
|
return;
|
|
@@ -2147,11 +2214,11 @@ function useEventReport() {
|
|
|
2147
2214
|
contentFormat = 'image';
|
|
2148
2215
|
}
|
|
2149
2216
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
2150
|
-
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 : '',
|
|
2217
|
+
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 }))
|
|
2151
2218
|
});
|
|
2152
2219
|
}, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
|
|
2153
2220
|
const productView = React.useCallback((data, product, cta, viewTime, position) => {
|
|
2154
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
|
2221
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
|
2155
2222
|
let fromKName = '';
|
|
2156
2223
|
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))) {
|
|
2157
2224
|
fromKName = 'pdpPage';
|
|
@@ -2170,8 +2237,9 @@ function useEventReport() {
|
|
|
2170
2237
|
contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags),
|
|
2171
2238
|
position: position + '',
|
|
2172
2239
|
contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
|
2240
|
+
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 : '',
|
|
2173
2241
|
ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
|
|
2174
|
-
traceInfo: (
|
|
2242
|
+
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 : '',
|
|
2175
2243
|
timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
|
|
2176
2244
|
eventSubject: 'productView',
|
|
2177
2245
|
eventDescription: 'User browsed the product'
|
|
@@ -16215,7 +16283,7 @@ function WaterfallList(_a) {
|
|
|
16215
16283
|
* @Author: binruan@chatlabs.com
|
|
16216
16284
|
* @Date: 2024-01-10 10:58:24
|
|
16217
16285
|
* @LastEditors: binruan@chatlabs.com
|
|
16218
|
-
* @LastEditTime: 2025-
|
|
16286
|
+
* @LastEditTime: 2025-05-09 15:30:41
|
|
16219
16287
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\WaterFall\index.tsx
|
|
16220
16288
|
*
|
|
16221
16289
|
*/
|
|
@@ -16253,7 +16321,7 @@ const WaterFall = (props) => {
|
|
|
16253
16321
|
}
|
|
16254
16322
|
}, [waterFallData]);
|
|
16255
16323
|
const reportTagsView = React.useCallback(() => {
|
|
16256
|
-
var _a, _b, _c, _d, _e, _f;
|
|
16324
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
16257
16325
|
const rec = recData === null || recData === void 0 ? void 0 : recData.rec;
|
|
16258
16326
|
if (!rec)
|
|
16259
16327
|
return;
|
|
@@ -16273,9 +16341,10 @@ const WaterFall = (props) => {
|
|
|
16273
16341
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
16274
16342
|
eventInfo: {
|
|
16275
16343
|
contentId: (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
|
16344
|
+
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 : '',
|
|
16276
16345
|
position: cacheActiveIndex + '',
|
|
16277
|
-
contentTags: JSON.stringify((
|
|
16278
|
-
traceInfo: (
|
|
16346
|
+
contentTags: JSON.stringify((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.tags),
|
|
16347
|
+
traceInfo: (_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.traceInfo,
|
|
16279
16348
|
hashTags: JSON.stringify([recData === null || recData === void 0 ? void 0 : recData.hashTag]),
|
|
16280
16349
|
fromKName,
|
|
16281
16350
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
|
@@ -18382,21 +18451,22 @@ const LikeButton = (_a) => {
|
|
|
18382
18451
|
const likeIcon = useIconLink(defaultLikeIconPath$2);
|
|
18383
18452
|
const unlikeIcon = useIconLink(defaultUnLikeIconPath$2);
|
|
18384
18453
|
const handleClick = lodash.debounce(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
18385
|
-
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;
|
|
18454
|
+
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, _6, _7, _8, _9, _10;
|
|
18386
18455
|
if (state) {
|
|
18387
18456
|
// 先设置状态
|
|
18388
18457
|
setState(false);
|
|
18389
|
-
const result = (_e = (yield (mutateUnlike === null || mutateUnlike === void 0 ? void 0 : mutateUnlike({
|
|
18458
|
+
const result = (_e = (yield (mutateUnlike === null || mutateUnlike === void 0 ? void 0 : mutateUnlike({ itemId: (_d = (_c = recData === null || recData === void 0 ? void 0 : recData.video) === null || _c === void 0 ? void 0 : _c.itemId) !== null && _d !== void 0 ? _d : '' })))) !== null && _e !== void 0 ? _e : false;
|
|
18390
18459
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
18391
18460
|
eventInfo: {
|
|
18392
18461
|
eventSubject: 'favoriteContentCanceled',
|
|
18393
18462
|
eventDescription: 'This content was unfavorite by the user',
|
|
18394
18463
|
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 : '',
|
|
18395
|
-
|
|
18396
|
-
|
|
18464
|
+
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 : '',
|
|
18465
|
+
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 : '',
|
|
18466
|
+
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 : []),
|
|
18397
18467
|
position: position + '',
|
|
18398
|
-
contentFormat: ((
|
|
18399
|
-
traceInfo: (
|
|
18468
|
+
contentFormat: ((_q = recData === null || recData === void 0 ? void 0 : recData.video) === null || _q === void 0 ? void 0 : _q.url) ? 'video' : 'image',
|
|
18469
|
+
traceInfo: (_r = recData === null || recData === void 0 ? void 0 : recData.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
18400
18470
|
}
|
|
18401
18471
|
});
|
|
18402
18472
|
// 如果接口调用失败,则回滚状态
|
|
@@ -18404,48 +18474,49 @@ const LikeButton = (_a) => {
|
|
|
18404
18474
|
setState(true);
|
|
18405
18475
|
}
|
|
18406
18476
|
else {
|
|
18407
|
-
const nRtcList = (
|
|
18477
|
+
const nRtcList = (_s = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
|
18408
18478
|
if (index === position) {
|
|
18409
18479
|
item.isCollected = false;
|
|
18410
18480
|
}
|
|
18411
18481
|
return item;
|
|
18412
|
-
})) !== null &&
|
|
18482
|
+
})) !== null && _s !== void 0 ? _s : [];
|
|
18413
18483
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
|
18414
18484
|
}
|
|
18415
18485
|
}
|
|
18416
18486
|
else {
|
|
18417
18487
|
setState(true);
|
|
18418
|
-
const result = (
|
|
18488
|
+
const result = (_v = (yield (mutateLike === null || mutateLike === void 0 ? void 0 : mutateLike({ content: JSON.stringify(recData), itemId: (_u = (_t = recData === null || recData === void 0 ? void 0 : recData.video) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '' })))) !== null && _v !== void 0 ? _v : false;
|
|
18419
18489
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
18420
18490
|
eventInfo: {
|
|
18421
18491
|
eventSubject: 'favoriteContent',
|
|
18422
18492
|
eventDescription: 'This content was favorite by the user',
|
|
18423
|
-
contentId: (
|
|
18424
|
-
|
|
18425
|
-
|
|
18493
|
+
contentId: (_x = (_w = recData === null || recData === void 0 ? void 0 : recData.video) === null || _w === void 0 ? void 0 : _w.itemId) !== null && _x !== void 0 ? _x : '',
|
|
18494
|
+
sceneId: (_0 = (_z = (_y = recData === null || recData === void 0 ? void 0 : recData.video) === null || _y === void 0 ? void 0 : _y.scene) === null || _z === void 0 ? void 0 : _z.sceneId) !== null && _0 !== void 0 ? _0 : '',
|
|
18495
|
+
contentName: (_2 = (_1 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _1 === void 0 ? void 0 : _1.title) !== null && _2 !== void 0 ? _2 : '',
|
|
18496
|
+
contentTags: JSON.stringify((_4 = (_3 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _3 === void 0 ? void 0 : _3.tags) !== null && _4 !== void 0 ? _4 : []),
|
|
18426
18497
|
position: position + '',
|
|
18427
|
-
contentFormat: ((
|
|
18428
|
-
traceInfo: (
|
|
18498
|
+
contentFormat: ((_5 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _5 === void 0 ? void 0 : _5.url) ? 'video' : 'image',
|
|
18499
|
+
traceInfo: (_6 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _6 === void 0 ? void 0 : _6.traceInfo
|
|
18429
18500
|
}
|
|
18430
18501
|
});
|
|
18431
18502
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
18432
18503
|
eventName: 'Engagement',
|
|
18433
|
-
product: (
|
|
18504
|
+
product: (_7 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _7 === void 0 ? void 0 : _7.bindProducts,
|
|
18434
18505
|
rec: recData,
|
|
18435
18506
|
position,
|
|
18436
|
-
content_id: (
|
|
18507
|
+
content_id: (_9 = (_8 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _8 === void 0 ? void 0 : _8.itemId) !== null && _9 !== void 0 ? _9 : '',
|
|
18437
18508
|
engagement_type: 'like'
|
|
18438
18509
|
});
|
|
18439
18510
|
if (!result) {
|
|
18440
18511
|
setState(false);
|
|
18441
18512
|
}
|
|
18442
18513
|
else {
|
|
18443
|
-
const nRtcList = (
|
|
18514
|
+
const nRtcList = (_10 = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
|
18444
18515
|
if (index === position) {
|
|
18445
18516
|
item.isCollected = true;
|
|
18446
18517
|
}
|
|
18447
18518
|
return item;
|
|
18448
|
-
})) !== null &&
|
|
18519
|
+
})) !== null && _10 !== void 0 ? _10 : [];
|
|
18449
18520
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
|
18450
18521
|
}
|
|
18451
18522
|
}
|
|
@@ -18482,7 +18553,7 @@ const mountVideoPlayerAtNode = (() => {
|
|
|
18482
18553
|
const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activeIndex, videoPostConfig, videoPlayIcon, loopPlay, swiperRef, visibleHeight }, ref) => {
|
|
18483
18554
|
var _a, _b;
|
|
18484
18555
|
const [isPauseVideo, setIsPauseVideo] = React.useState(false);
|
|
18485
|
-
const { bffEventReport, sxpParameter,
|
|
18556
|
+
const { bffEventReport, sxpParameter, firstRtcList, openHashtag, bffFbReport, isDiyH5 } = useSxpDataSource();
|
|
18486
18557
|
const videoStartTime = React.useRef(0);
|
|
18487
18558
|
const [isLoadFinish, setIsLoadFinish] = React.useState(false);
|
|
18488
18559
|
const { isActive } = useSwiperSlide();
|
|
@@ -18499,7 +18570,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18499
18570
|
const loopPlayRef = React.useRef(loopPlay);
|
|
18500
18571
|
const scene = rec.video.scene;
|
|
18501
18572
|
const videoUrl = (scene === null || scene === void 0 ? void 0 : scene.mediaUrl) || ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.url);
|
|
18502
|
-
const videoCover = (
|
|
18573
|
+
const videoCover = (_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.cover;
|
|
18503
18574
|
const videoPoster = videoCover || (sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image);
|
|
18504
18575
|
React.useImperativeHandle(ref, () => {
|
|
18505
18576
|
return {
|
|
@@ -18548,6 +18619,23 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18548
18619
|
return;
|
|
18549
18620
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
|
18550
18621
|
}, [videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
18622
|
+
const handleEnd = () => {
|
|
18623
|
+
var _a, _b, _c, _d, _e, _f;
|
|
18624
|
+
if (!videoRef.current)
|
|
18625
|
+
return;
|
|
18626
|
+
if (isDiyH5) {
|
|
18627
|
+
(_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
|
|
18628
|
+
if (!loopPlayRef.current)
|
|
18629
|
+
return;
|
|
18630
|
+
if (firstRtcList && index < (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) - 1) {
|
|
18631
|
+
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;
|
|
18632
|
+
(_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);
|
|
18633
|
+
}
|
|
18634
|
+
}
|
|
18635
|
+
else {
|
|
18636
|
+
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.play();
|
|
18637
|
+
}
|
|
18638
|
+
};
|
|
18551
18639
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
|
18552
18640
|
const handlePlaying = React.useCallback(() => {
|
|
18553
18641
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
@@ -18556,7 +18644,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18556
18644
|
setIsLoadFinish(true);
|
|
18557
18645
|
}, []);
|
|
18558
18646
|
const handleStartPlay = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
18559
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
|
18647
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
|
18560
18648
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
18561
18649
|
return;
|
|
18562
18650
|
setIsPauseVideo(false);
|
|
@@ -18567,16 +18655,11 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18567
18655
|
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);
|
|
18568
18656
|
const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
|
|
18569
18657
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
18570
|
-
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 : '',
|
|
18658
|
+
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) + '' }))
|
|
18571
18659
|
});
|
|
18572
18660
|
isFirstPlayRef.current = false;
|
|
18573
18661
|
}
|
|
18574
18662
|
}), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
18575
|
-
const setCurrentTimeByStartTime = React.useCallback(() => {
|
|
18576
|
-
if (isDiyH5) {
|
|
18577
|
-
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
|
18578
|
-
}
|
|
18579
|
-
}, []);
|
|
18580
18663
|
const handLoadeddata = React.useCallback(() => {
|
|
18581
18664
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
|
|
18582
18665
|
return;
|
|
@@ -18601,13 +18684,12 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18601
18684
|
const handleLoadedmetadata = React.useCallback(() => {
|
|
18602
18685
|
if (!videoRef.current)
|
|
18603
18686
|
return;
|
|
18604
|
-
setCurrentTimeByStartTime();
|
|
18605
18687
|
loadedTimeRef.current = new Date();
|
|
18606
18688
|
handleStartPlay();
|
|
18607
18689
|
handLoadeddata();
|
|
18608
18690
|
}, [videoRef.current, handLoadeddata, handleStartPlay]);
|
|
18609
18691
|
const handleClickVideo = React.useCallback((type) => () => {
|
|
18610
|
-
var _a, _b, _c, _d, _e
|
|
18692
|
+
var _a, _b, _c, _d, _e;
|
|
18611
18693
|
if (!videoRef.current)
|
|
18612
18694
|
return;
|
|
18613
18695
|
if (!isLoadFinish)
|
|
@@ -18628,20 +18710,17 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18628
18710
|
break;
|
|
18629
18711
|
default:
|
|
18630
18712
|
if (isPause) {
|
|
18631
|
-
|
|
18632
|
-
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
|
18633
|
-
}
|
|
18634
|
-
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
|
|
18713
|
+
(_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.play();
|
|
18635
18714
|
}
|
|
18636
18715
|
else {
|
|
18637
|
-
(
|
|
18716
|
+
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.pause();
|
|
18638
18717
|
}
|
|
18639
18718
|
setIsPauseVideo(!isPause);
|
|
18640
18719
|
break;
|
|
18641
18720
|
}
|
|
18642
18721
|
}, [isLoadFinish, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
18643
18722
|
const handlePause = React.useCallback(() => {
|
|
18644
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
18723
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
18645
18724
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
18646
18725
|
return;
|
|
18647
18726
|
if (activeIndex !== index)
|
|
@@ -18657,14 +18736,15 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18657
18736
|
eventSubject: 'playOverVideo',
|
|
18658
18737
|
eventDescription: 'User finished playing the video',
|
|
18659
18738
|
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 : '',
|
|
18660
|
-
|
|
18739
|
+
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 : '',
|
|
18740
|
+
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 : '',
|
|
18661
18741
|
endTime: videoCurrentTime,
|
|
18662
18742
|
videoDuration,
|
|
18663
18743
|
playDuration,
|
|
18664
|
-
contentTags: JSON.stringify((
|
|
18744
|
+
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 : []),
|
|
18665
18745
|
position: index + '',
|
|
18666
18746
|
contentFormat: 'video',
|
|
18667
|
-
traceInfo: (
|
|
18747
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
18668
18748
|
}
|
|
18669
18749
|
});
|
|
18670
18750
|
}
|
|
@@ -18672,27 +18752,8 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18672
18752
|
const handleWaiting = React.useCallback(() => {
|
|
18673
18753
|
setWaiting(true);
|
|
18674
18754
|
}, []);
|
|
18675
|
-
const handleTimeUpload = () => {
|
|
18676
|
-
if (!videoRef.current || !isDiyH5)
|
|
18677
|
-
return;
|
|
18678
|
-
setTimeout(() => {
|
|
18679
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
18680
|
-
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)) {
|
|
18681
|
-
(_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
|
|
18682
|
-
if (!loopPlayRef.current)
|
|
18683
|
-
return;
|
|
18684
|
-
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
|
18685
|
-
(_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);
|
|
18686
|
-
}
|
|
18687
|
-
else {
|
|
18688
|
-
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;
|
|
18689
|
-
(_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);
|
|
18690
|
-
}
|
|
18691
|
-
}
|
|
18692
|
-
});
|
|
18693
|
-
};
|
|
18694
18755
|
React.useEffect(() => {
|
|
18695
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
|
18756
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18696
18757
|
if (!isActive)
|
|
18697
18758
|
return;
|
|
18698
18759
|
const videoSrc = videoUrl;
|
|
@@ -18713,7 +18774,6 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18713
18774
|
hls === null || hls === void 0 ? void 0 : hls.attachMedia(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current);
|
|
18714
18775
|
hls === null || hls === void 0 ? void 0 : hls.on(Hls.Events.MANIFEST_PARSED, function () {
|
|
18715
18776
|
var _a;
|
|
18716
|
-
setCurrentTimeByStartTime();
|
|
18717
18777
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
|
18718
18778
|
});
|
|
18719
18779
|
}
|
|
@@ -18727,12 +18787,11 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18727
18787
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.addEventListener('play', handleStartPlay);
|
|
18728
18788
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.addEventListener('playing', handlePlaying);
|
|
18729
18789
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.addEventListener('pause', handlePause);
|
|
18730
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended',
|
|
18790
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handleEnd);
|
|
18731
18791
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.addEventListener('canplay', handlePlay);
|
|
18732
18792
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
|
|
18733
|
-
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.addEventListener('timeupdate', handleTimeUpload);
|
|
18734
18793
|
return () => {
|
|
18735
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
|
18794
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18736
18795
|
const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
|
|
18737
18796
|
if (!isPause)
|
|
18738
18797
|
handlePause();
|
|
@@ -18744,10 +18803,9 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18744
18803
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.removeEventListener('play', handleStartPlay);
|
|
18745
18804
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.removeEventListener('playing', handlePlaying);
|
|
18746
18805
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.removeEventListener('pause', handlePause);
|
|
18747
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended',
|
|
18806
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handleEnd);
|
|
18748
18807
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('canplay', handlePlay);
|
|
18749
18808
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.removeEventListener('waiting', handleWaiting);
|
|
18750
|
-
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.removeEventListener('timeupdate', handleTimeUpload);
|
|
18751
18809
|
};
|
|
18752
18810
|
}, [isActive]);
|
|
18753
18811
|
React.useEffect(() => {
|
|
@@ -18962,19 +19020,45 @@ const Picture = (props) => {
|
|
|
18962
19020
|
}, onLoad: onShowFirstImage }))));
|
|
18963
19021
|
};
|
|
18964
19022
|
|
|
18965
|
-
const PictureGroup$4 = ({ imgUrls,
|
|
19023
|
+
const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig, swiperRef }, ref) => {
|
|
18966
19024
|
var _a, _b;
|
|
18967
19025
|
const { isActive } = useSwiperSlide();
|
|
18968
|
-
const {
|
|
19026
|
+
const { firstRtcList, openHashtag, isDiyH5 } = useSxpDataSource();
|
|
18969
19027
|
const [isLoad, setIsLoad] = React.useState(false);
|
|
18970
19028
|
const [imgInfo, setImgInfo] = React.useState();
|
|
18971
19029
|
const [swiperActiveIndex, setSwiperActiveIndex] = React.useState(0);
|
|
18972
|
-
const
|
|
19030
|
+
const imgsSwiperRef = React.useRef();
|
|
18973
19031
|
const isFirstPlayRef = React.useRef(true);
|
|
19032
|
+
const loopPlayRef = React.useRef(true);
|
|
18974
19033
|
const initTime = new Date();
|
|
19034
|
+
React.useImperativeHandle(ref, () => {
|
|
19035
|
+
return {
|
|
19036
|
+
setLoopPlay(v) {
|
|
19037
|
+
loopPlayRef.current = v;
|
|
19038
|
+
}
|
|
19039
|
+
};
|
|
19040
|
+
});
|
|
19041
|
+
React.useEffect(() => {
|
|
19042
|
+
let timerId;
|
|
19043
|
+
if (isLoad && isActive && isDiyH5) {
|
|
19044
|
+
timerId = setTimeout(() => {
|
|
19045
|
+
var _a, _b, _c, _d;
|
|
19046
|
+
if (!loopPlayRef.current)
|
|
19047
|
+
return;
|
|
19048
|
+
if (firstRtcList && index < (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) - 1) {
|
|
19049
|
+
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;
|
|
19050
|
+
(_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);
|
|
19051
|
+
}
|
|
19052
|
+
}, 3000);
|
|
19053
|
+
}
|
|
19054
|
+
return () => {
|
|
19055
|
+
if (timerId)
|
|
19056
|
+
clearTimeout(timerId);
|
|
19057
|
+
};
|
|
19058
|
+
}, [isLoad, isActive, isDiyH5, index, swiperRef, firstRtcList]);
|
|
18975
19059
|
React.useEffect(() => {
|
|
18976
19060
|
if (isLoad && isActive) {
|
|
18977
|
-
(
|
|
19061
|
+
(imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.start();
|
|
18978
19062
|
if (openHashtag) {
|
|
18979
19063
|
onViewImageEndEvent(rec);
|
|
18980
19064
|
}
|
|
@@ -18984,7 +19068,7 @@ const PictureGroup$4 = ({ imgUrls, width, height, rec, index, onViewImageEndEven
|
|
|
18984
19068
|
}
|
|
18985
19069
|
}
|
|
18986
19070
|
else {
|
|
18987
|
-
(
|
|
19071
|
+
(imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.stop();
|
|
18988
19072
|
}
|
|
18989
19073
|
}, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
|
|
18990
19074
|
const showFirstImageFn = React.useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
|
|
@@ -19011,13 +19095,13 @@ const PictureGroup$4 = ({ imgUrls, width, height, rec, index, onViewImageEndEven
|
|
|
19011
19095
|
};
|
|
19012
19096
|
}, [isActive, imgInfo]);
|
|
19013
19097
|
const handleMouseEnter = React.useCallback(() => {
|
|
19014
|
-
if (
|
|
19015
|
-
|
|
19098
|
+
if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
|
|
19099
|
+
imgsSwiperRef.current.swiper.autoplay.stop();
|
|
19016
19100
|
}
|
|
19017
19101
|
}, []);
|
|
19018
19102
|
const handleMouseLeave = React.useCallback(() => {
|
|
19019
|
-
if (
|
|
19020
|
-
|
|
19103
|
+
if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
|
|
19104
|
+
imgsSwiperRef.current.swiper.autoplay.start();
|
|
19021
19105
|
}
|
|
19022
19106
|
}, []);
|
|
19023
19107
|
const handleSlideChange = React.useCallback((swiper) => {
|
|
@@ -19038,7 +19122,7 @@ const PictureGroup$4 = ({ imgUrls, width, height, rec, index, onViewImageEndEven
|
|
|
19038
19122
|
enabled: true
|
|
19039
19123
|
}
|
|
19040
19124
|
}
|
|
19041
|
-
: {}), { loop: true, ref:
|
|
19125
|
+
: {}), { loop: true, ref: imgsSwiperRef, onSlideChange: handleSlideChange, className: css.css(Object.assign(Object.assign({ '.swiper-pagination': {
|
|
19042
19126
|
bottom: (_a = imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.marginBottom) !== null && _a !== void 0 ? _a : 0,
|
|
19043
19127
|
fontSize: '14px'
|
|
19044
19128
|
} }, ((imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.dotsBgColor) && {
|
|
@@ -19055,7 +19139,7 @@ const PictureGroup$4 = ({ imgUrls, width, height, rec, index, onViewImageEndEven
|
|
|
19055
19139
|
return (React.createElement(SwiperSlide, { key: srcKey, "aria-hidden": srcKey !== swiperActiveIndex },
|
|
19056
19140
|
React.createElement(Picture, { src: !isLoad && srcKey > 0 ? '' : url, height: height, imgUrlsPostConfig: imgUrlsPostConfig, onShowFirstImage: showFirstImageFn })));
|
|
19057
19141
|
}))));
|
|
19058
|
-
};
|
|
19142
|
+
});
|
|
19059
19143
|
var PictureGroup$5 = React.memo(PictureGroup$4);
|
|
19060
19144
|
|
|
19061
19145
|
/*
|
|
@@ -19347,7 +19431,7 @@ var NavBack$1 = React.memo(NavBack);
|
|
|
19347
19431
|
* @Author: binruan@chatlabs.com
|
|
19348
19432
|
* @Date: 2024-03-20 10:27:31
|
|
19349
19433
|
* @LastEditors: binruan@chatlabs.com
|
|
19350
|
-
* @LastEditTime: 2025-05-
|
|
19434
|
+
* @LastEditTime: 2025-05-12 14:26:15
|
|
19351
19435
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
|
19352
19436
|
*
|
|
19353
19437
|
*/
|
|
@@ -19368,6 +19452,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19368
19452
|
const [pageNum, setPageNum] = React.useState(2);
|
|
19369
19453
|
React.useState(false);
|
|
19370
19454
|
const videoWidgetRef = React.useRef(null);
|
|
19455
|
+
const pictureGroupRef = React.useRef(null);
|
|
19371
19456
|
const fbcRef = React.useRef('');
|
|
19372
19457
|
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, pixelPvStatusRef } = useSxpDataSource();
|
|
19373
19458
|
const { backMainFeed, productView, jumpToWeb } = useEventReport();
|
|
@@ -19417,7 +19502,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19417
19502
|
(_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
|
|
19418
19503
|
}, [data, ctaType, swiperRef]);
|
|
19419
19504
|
const handleSessionCompleted = React.useCallback((fk) => {
|
|
19420
|
-
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;
|
|
19505
|
+
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;
|
|
19421
19506
|
const item = data === null || data === void 0 ? void 0 : data[activeIndex];
|
|
19422
19507
|
let fromKName = '';
|
|
19423
19508
|
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))) {
|
|
@@ -19444,22 +19529,23 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19444
19529
|
eventSubject: 'sessionCompleted',
|
|
19445
19530
|
eventDescription: 'Session completed',
|
|
19446
19531
|
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
|
19447
|
-
|
|
19532
|
+
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 : '',
|
|
19533
|
+
productId: (_r = item === null || item === void 0 ? void 0 : item.product) === null || _r === void 0 ? void 0 : _r.itemId,
|
|
19448
19534
|
position: activeIndex + '',
|
|
19449
19535
|
fromKName: fk || fromKName,
|
|
19450
19536
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
|
19451
|
-
ctatId: (
|
|
19452
|
-
traceInfo: (
|
|
19537
|
+
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 : '',
|
|
19538
|
+
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 : ''
|
|
19453
19539
|
}
|
|
19454
19540
|
});
|
|
19455
|
-
const isPostType = ((
|
|
19541
|
+
const isPostType = ((_z = item === null || item === void 0 ? void 0 : item.video) === null || _z === void 0 ? void 0 : _z.url) || ((_1 = (_0 = item === null || item === void 0 ? void 0 : item.video) === null || _0 === void 0 ? void 0 : _0.imgUrls) === null || _1 === void 0 ? void 0 : _1.length);
|
|
19456
19542
|
if (!popupDetailData) {
|
|
19457
19543
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
19458
19544
|
eventName: 'ExitFeed',
|
|
19459
|
-
product: isPostType ? (
|
|
19545
|
+
product: isPostType ? (_2 = item === null || item === void 0 ? void 0 : item.video) === null || _2 === void 0 ? void 0 : _2.bindProducts : (item === null || item === void 0 ? void 0 : item.product) ? [item === null || item === void 0 ? void 0 : item.product] : [],
|
|
19460
19546
|
rec: item,
|
|
19461
19547
|
position: activeIndex,
|
|
19462
|
-
content_id: isPostType ? (
|
|
19548
|
+
content_id: isPostType ? (_4 = (_3 = item === null || item === void 0 ? void 0 : item.video) === null || _3 === void 0 ? void 0 : _3.itemId) !== null && _4 !== void 0 ? _4 : '' : (_6 = (_5 = item === null || item === void 0 ? void 0 : item.product) === null || _5 === void 0 ? void 0 : _5.itemId) !== null && _6 !== void 0 ? _6 : '',
|
|
19463
19549
|
view_time: new Date() - viewTime.current
|
|
19464
19550
|
});
|
|
19465
19551
|
}
|
|
@@ -19519,8 +19605,9 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19519
19605
|
refreshFeSession
|
|
19520
19606
|
]);
|
|
19521
19607
|
const handleSessionExpire = React.useCallback(lodash.debounce(() => {
|
|
19522
|
-
var _a;
|
|
19608
|
+
var _a, _b;
|
|
19523
19609
|
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
|
19610
|
+
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
|
19524
19611
|
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
|
|
19525
19612
|
}, 1000), [handleSessionCompleted, refreshFeSession]);
|
|
19526
19613
|
React.useEffect(() => {
|
|
@@ -19591,18 +19678,18 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19591
19678
|
return null;
|
|
19592
19679
|
}, [globalConfig, activeIndex, visList]);
|
|
19593
19680
|
const renderContent = React.useCallback((rec, index) => {
|
|
19594
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
19681
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
19595
19682
|
if (rec === 'organic menu') {
|
|
19596
19683
|
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)));
|
|
19597
19684
|
}
|
|
19598
|
-
if ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null ||
|
|
19685
|
+
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)) {
|
|
19599
19686
|
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, visibleHeight: visibleHeight })));
|
|
19600
19687
|
}
|
|
19601
|
-
if ((
|
|
19602
|
-
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 }));
|
|
19688
|
+
if ((_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.imgUrls) {
|
|
19689
|
+
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 })));
|
|
19603
19690
|
}
|
|
19604
|
-
if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((
|
|
19605
|
-
return (
|
|
19691
|
+
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) {
|
|
19692
|
+
return (_m = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _m === void 0 ? void 0 : _m.map((value, idx) => {
|
|
19606
19693
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
19607
19694
|
const t = resolver[(_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type];
|
|
19608
19695
|
const Component = withBindDataSource(t);
|
|
@@ -19641,7 +19728,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19641
19728
|
};
|
|
19642
19729
|
}, [isShowMore]);
|
|
19643
19730
|
const renderBottom = React.useCallback((rec, index) => {
|
|
19644
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
|
19731
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
|
19645
19732
|
if (rec === null || rec === void 0 ? void 0 : rec.video) {
|
|
19646
19733
|
let cta = null;
|
|
19647
19734
|
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) {
|
|
@@ -19650,24 +19737,27 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19650
19737
|
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
|
|
19651
19738
|
cta = '商品CTA';
|
|
19652
19739
|
}
|
|
19740
|
+
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)) {
|
|
19741
|
+
cta = '服务CTA';
|
|
19742
|
+
}
|
|
19653
19743
|
else {
|
|
19654
|
-
cta = (
|
|
19744
|
+
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;
|
|
19655
19745
|
}
|
|
19656
19746
|
const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
|
|
19657
19747
|
const isNineProduct = (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nineProductEnable) &&
|
|
19658
19748
|
index === ((rtcList === null || rtcList === void 0 ? void 0 : rtcList[0]) === 'organic menu' ? 1 : 0) &&
|
|
19659
|
-
((
|
|
19749
|
+
((_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));
|
|
19660
19750
|
return (React.createElement(React.Fragment, null,
|
|
19661
19751
|
isNineProduct && (React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, isNineProduct: isNineProduct })),
|
|
19662
|
-
((
|
|
19663
|
-
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(
|
|
19752
|
+
((_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' }),
|
|
19753
|
+
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` } },
|
|
19664
19754
|
React.createElement(Nudge, { nudge: nudge }),
|
|
19665
19755
|
((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' },
|
|
19666
19756
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, includesCtaType: [] }))) : null,
|
|
19667
19757
|
React.createElement("div", { style: { display: 'flex', flexDirection: 'column' } },
|
|
19668
|
-
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: (
|
|
19758
|
+
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 }),
|
|
19669
19759
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex }),
|
|
19670
|
-
React.createElement(Hashtag$1, { index: activeIndex, tags: (
|
|
19760
|
+
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) }))),
|
|
19671
19761
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex })));
|
|
19672
19762
|
}
|
|
19673
19763
|
return null;
|
|
@@ -19709,7 +19799,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19709
19799
|
return null;
|
|
19710
19800
|
}, [globalConfig, waterFallData, bottomHeight]);
|
|
19711
19801
|
const handleViewImageStartEnd = (item) => {
|
|
19712
|
-
var _a, _b, _c, _d, _e, _f;
|
|
19802
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
19713
19803
|
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)) {
|
|
19714
19804
|
const endTime = Date.now();
|
|
19715
19805
|
const duration = viewImageStartTime.current === 0 ? 0 : (endTime - viewImageStartTime.current) / 1000;
|
|
@@ -19718,10 +19808,11 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19718
19808
|
eventSubject: 'viewImageCarouselEnd',
|
|
19719
19809
|
eventDescription: 'User end view the image carousel',
|
|
19720
19810
|
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 : '',
|
|
19721
|
-
|
|
19811
|
+
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 : '',
|
|
19812
|
+
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
|
19722
19813
|
imageEndTime: `${endTime}`,
|
|
19723
19814
|
playDuration: `${duration}`,
|
|
19724
|
-
contentTags: JSON.stringify((
|
|
19815
|
+
contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
|
|
19725
19816
|
position: activeIndex + '',
|
|
19726
19817
|
contentFormat: 'image',
|
|
19727
19818
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo
|
|
@@ -19730,7 +19821,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19730
19821
|
}
|
|
19731
19822
|
};
|
|
19732
19823
|
const handleSlideSkip = (item, position) => {
|
|
19733
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
|
19824
|
+
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;
|
|
19734
19825
|
if (isPreview || waterFallData)
|
|
19735
19826
|
return;
|
|
19736
19827
|
const t = new Date() - curTime.current;
|
|
@@ -19756,7 +19847,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19756
19847
|
contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
|
|
19757
19848
|
position: position + '',
|
|
19758
19849
|
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 : '',
|
|
19759
|
-
|
|
19850
|
+
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 : '',
|
|
19851
|
+
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 : '',
|
|
19760
19852
|
contentFormat
|
|
19761
19853
|
}
|
|
19762
19854
|
});
|
|
@@ -19766,7 +19858,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19766
19858
|
}
|
|
19767
19859
|
};
|
|
19768
19860
|
const handleScrollEvent = (swiper) => {
|
|
19769
|
-
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;
|
|
19861
|
+
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;
|
|
19770
19862
|
const item = data[swiper.previousIndex];
|
|
19771
19863
|
const activeItem = data[swiper.activeIndex];
|
|
19772
19864
|
if (!item)
|
|
@@ -19799,11 +19891,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19799
19891
|
eventSubject: 'scrollDown',
|
|
19800
19892
|
eventDescription: 'User scroll down',
|
|
19801
19893
|
contentId: (_u = (_t = item === null || item === void 0 ? void 0 : item.video) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '',
|
|
19802
|
-
|
|
19894
|
+
sceneId: (_x = (_w = (_v = item === null || item === void 0 ? void 0 : item.video) === null || _v === void 0 ? void 0 : _v.scene) === null || _w === void 0 ? void 0 : _w.sceneId) !== null && _x !== void 0 ? _x : '',
|
|
19895
|
+
productId: (_z = (_y = item === null || item === void 0 ? void 0 : item.product) === null || _y === void 0 ? void 0 : _y.itemId) !== null && _z !== void 0 ? _z : '',
|
|
19803
19896
|
requestId: null,
|
|
19804
|
-
traceInfo: (
|
|
19897
|
+
traceInfo: (_3 = (_1 = (_0 = item === null || item === void 0 ? void 0 : item.video) === null || _0 === void 0 ? void 0 : _0.traceInfo) !== null && _1 !== void 0 ? _1 : (_2 = item === null || item === void 0 ? void 0 : item.product) === null || _2 === void 0 ? void 0 : _2.traceInfo) !== null && _3 !== void 0 ? _3 : '',
|
|
19805
19898
|
contentFormat,
|
|
19806
|
-
position: ((
|
|
19899
|
+
position: ((_4 = swiper.previousIndex) !== null && _4 !== void 0 ? _4 : 0) + ''
|
|
19807
19900
|
}
|
|
19808
19901
|
});
|
|
19809
19902
|
// 如果上一个商品是图片集,需上报 浏览图片集结结束 事件
|
|
@@ -19816,12 +19909,13 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19816
19909
|
eventInfo: {
|
|
19817
19910
|
eventSubject: 'scrollUp',
|
|
19818
19911
|
eventDescription: 'User scroll up',
|
|
19819
|
-
contentId: (
|
|
19820
|
-
|
|
19912
|
+
contentId: (_6 = (_5 = item === null || item === void 0 ? void 0 : item.video) === null || _5 === void 0 ? void 0 : _5.itemId) !== null && _6 !== void 0 ? _6 : '',
|
|
19913
|
+
sceneId: (_9 = (_8 = (_7 = item === null || item === void 0 ? void 0 : item.video) === null || _7 === void 0 ? void 0 : _7.scene) === null || _8 === void 0 ? void 0 : _8.sceneId) !== null && _9 !== void 0 ? _9 : '',
|
|
19914
|
+
productId: (_11 = (_10 = item.product) === null || _10 === void 0 ? void 0 : _10.itemId) !== null && _11 !== void 0 ? _11 : '',
|
|
19821
19915
|
requestId: null,
|
|
19822
|
-
traceInfo: (
|
|
19916
|
+
traceInfo: (_15 = (_13 = (_12 = item === null || item === void 0 ? void 0 : item.video) === null || _12 === void 0 ? void 0 : _12.traceInfo) !== null && _13 !== void 0 ? _13 : (_14 = item === null || item === void 0 ? void 0 : item.product) === null || _14 === void 0 ? void 0 : _14.traceInfo) !== null && _15 !== void 0 ? _15 : '',
|
|
19823
19917
|
contentFormat,
|
|
19824
|
-
position: ((
|
|
19918
|
+
position: ((_16 = swiper.previousIndex) !== null && _16 !== void 0 ? _16 : 0) + ''
|
|
19825
19919
|
}
|
|
19826
19920
|
});
|
|
19827
19921
|
// 如果上一个商品是图片集,需上报 浏览图片集结结束 事件
|
|
@@ -19921,7 +20015,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19921
20015
|
};
|
|
19922
20016
|
}, [globalConfig, bffEventReport, data, activeIndex]);
|
|
19923
20017
|
const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
|
|
19924
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
20018
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
19925
20019
|
const item = data[activeIndex];
|
|
19926
20020
|
// 如果是图片集则上报事件
|
|
19927
20021
|
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)) {
|
|
@@ -19932,9 +20026,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19932
20026
|
eventSubject: 'viewImageCarouselStart',
|
|
19933
20027
|
eventDescription: 'User start view the image carousel',
|
|
19934
20028
|
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 : '',
|
|
19935
|
-
|
|
20029
|
+
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 : '',
|
|
20030
|
+
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
|
19936
20031
|
imageStartTime: `${startTime}`,
|
|
19937
|
-
contentTags: JSON.stringify((
|
|
20032
|
+
contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
|
|
19938
20033
|
position: activeIndex + '',
|
|
19939
20034
|
contentFormat: 'image',
|
|
19940
20035
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
|
|
@@ -19944,13 +20039,13 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
19944
20039
|
if (enableCapi) {
|
|
19945
20040
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
19946
20041
|
eventName: 'ViewContent',
|
|
19947
|
-
product: (
|
|
20042
|
+
product: (_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.bindProducts,
|
|
19948
20043
|
rec: item,
|
|
19949
20044
|
position: activeIndex
|
|
19950
20045
|
});
|
|
19951
20046
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
19952
20047
|
eventName: 'PageView',
|
|
19953
|
-
product: (
|
|
20048
|
+
product: (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.bindProducts,
|
|
19954
20049
|
rec: item,
|
|
19955
20050
|
position: activeIndex
|
|
19956
20051
|
});
|
|
@@ -20048,15 +20143,20 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
|
|
|
20048
20143
|
swiperRef.current.swiper.allowTouchMove = true;
|
|
20049
20144
|
}, 500);
|
|
20050
20145
|
}, onActiveIndexChange: (swiper) => {
|
|
20146
|
+
var _a, _b;
|
|
20051
20147
|
setActiveIndex(swiper.activeIndex);
|
|
20052
20148
|
if (openHashtag)
|
|
20053
20149
|
return;
|
|
20054
20150
|
// 处理上滑下滑事件
|
|
20055
20151
|
handleScrollEvent(swiper);
|
|
20056
|
-
if (waterFallData || isEditor
|
|
20152
|
+
if (waterFallData || isEditor)
|
|
20057
20153
|
return;
|
|
20058
20154
|
if ((swiper === null || swiper === void 0 ? void 0 : swiper.activeIndex) + 1 >= (data === null || data === void 0 ? void 0 : data.length)) {
|
|
20059
20155
|
if (!isLoadMore) {
|
|
20156
|
+
if (isDiyH5) {
|
|
20157
|
+
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
|
20158
|
+
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
|
20159
|
+
}
|
|
20060
20160
|
setIsLoadMore(true);
|
|
20061
20161
|
loadVideos === null || loadVideos === void 0 ? void 0 : loadVideos(pageNum).then((res) => {
|
|
20062
20162
|
var _a;
|
|
@@ -20129,7 +20229,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
|
20129
20229
|
}, []);
|
|
20130
20230
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
|
20131
20231
|
const handlePlaying = React.useCallback(() => {
|
|
20132
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
20232
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
20133
20233
|
setIsPauseVideo(false);
|
|
20134
20234
|
const item = data[index];
|
|
20135
20235
|
if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
|
|
@@ -20142,14 +20242,15 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
|
20142
20242
|
eventSubject: 'playVideo',
|
|
20143
20243
|
eventDescription: 'User played the video',
|
|
20144
20244
|
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 : '',
|
|
20145
|
-
|
|
20245
|
+
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 : '',
|
|
20246
|
+
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 : '',
|
|
20146
20247
|
playType,
|
|
20147
20248
|
startTime: videoCurrentTime,
|
|
20148
20249
|
videoDuration,
|
|
20149
|
-
contentTags: JSON.stringify((
|
|
20250
|
+
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 : []),
|
|
20150
20251
|
position: index + '',
|
|
20151
20252
|
contentFormat: 'video',
|
|
20152
|
-
traceInfo: (
|
|
20253
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
20153
20254
|
}
|
|
20154
20255
|
});
|
|
20155
20256
|
setIsFirstPlay(false);
|
|
@@ -20188,7 +20289,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
|
20188
20289
|
}
|
|
20189
20290
|
}, [isLoadFinish]);
|
|
20190
20291
|
const onPause = React.useCallback(() => {
|
|
20191
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
20292
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
20192
20293
|
const item = data[index];
|
|
20193
20294
|
const videoDuration = ((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
|
|
20194
20295
|
const videoCurrentTime = ((_d = (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
|
|
@@ -20199,14 +20300,15 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
|
20199
20300
|
eventSubject: 'playOverVideo',
|
|
20200
20301
|
eventDescription: 'User finished playing the video',
|
|
20201
20302
|
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 : '',
|
|
20202
|
-
|
|
20303
|
+
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 : '',
|
|
20304
|
+
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 : '',
|
|
20203
20305
|
endTime: videoCurrentTime,
|
|
20204
20306
|
videoDuration,
|
|
20205
20307
|
playDuration,
|
|
20206
|
-
contentTags: JSON.stringify((
|
|
20308
|
+
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 : []),
|
|
20207
20309
|
position: index + '',
|
|
20208
20310
|
contentFormat: 'video',
|
|
20209
|
-
traceInfo: (
|
|
20311
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
20210
20312
|
}
|
|
20211
20313
|
});
|
|
20212
20314
|
}
|