pb-sxp-ui 1.20.7 → 1.20.8
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/pb-ui.js
CHANGED
|
@@ -660,6 +660,7 @@
|
|
|
660
660
|
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 }) => {
|
|
661
661
|
var _a, _b, _c, _d, _e;
|
|
662
662
|
const [rtcList, setRtcList] = React.useState([]);
|
|
663
|
+
const [firstRtcList, setFirstRtcList] = React.useState([]);
|
|
663
664
|
const [tagList, setTagList] = React.useState([]);
|
|
664
665
|
const [loading, setLoading] = React.useState(true);
|
|
665
666
|
const [curReqInfo, setCurReqInfo] = React.useState({ rtc: '', requestId: '' });
|
|
@@ -691,6 +692,10 @@
|
|
|
691
692
|
const [chatlabsId, setChatlabsId] = React.useState();
|
|
692
693
|
const finalPageData = React.useMemo(() => pageData !== null && pageData !== void 0 ? pageData : data, [pageData, data]);
|
|
693
694
|
const pixelPvStatusRef = React.useRef(false);
|
|
695
|
+
const isDiyPage = React.useMemo(() => {
|
|
696
|
+
var _a, _b, _c;
|
|
697
|
+
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);
|
|
698
|
+
}, [isDiyH5, finalPageData]);
|
|
694
699
|
React.useEffect(() => {
|
|
695
700
|
var _a, _b;
|
|
696
701
|
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);
|
|
@@ -786,14 +791,17 @@
|
|
|
786
791
|
return '';
|
|
787
792
|
}
|
|
788
793
|
const OptanonConsent = decodeURIComponent((_a = getCookie('OptanonConsent')) !== null && _a !== void 0 ? _a : '');
|
|
789
|
-
if ((
|
|
794
|
+
if ((window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups) &&
|
|
795
|
+
((_b = window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups) === null || _b === void 0 ? void 0 : _b.length) > 2 &&
|
|
796
|
+
!(window === null || window === void 0 ? void 0 : window.OnetrustActiveGroups.includes('4')) &&
|
|
797
|
+
isTargetingRejected(OptanonConsent)) {
|
|
790
798
|
return true;
|
|
791
799
|
}
|
|
792
800
|
return false;
|
|
793
801
|
};
|
|
794
802
|
// bff API 请求方法
|
|
795
803
|
const bffFetch = React.useCallback((path, options, isBota = true) => {
|
|
796
|
-
var _a;
|
|
804
|
+
var _a, _b;
|
|
797
805
|
if (!bffDataSource)
|
|
798
806
|
return;
|
|
799
807
|
const url = bffDataSource.url;
|
|
@@ -806,8 +814,9 @@
|
|
|
806
814
|
val.split('=')[0];
|
|
807
815
|
val.split('=')[1];
|
|
808
816
|
});
|
|
817
|
+
options.body = Object.assign(Object.assign({}, options.body), { productUserId: fakeUserId });
|
|
809
818
|
return window
|
|
810
|
-
.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
|
|
819
|
+
.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
|
|
811
820
|
? JSON.stringify({
|
|
812
821
|
body: btoa(encodeURIComponent(JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))))
|
|
813
822
|
})
|
|
@@ -839,7 +848,9 @@
|
|
|
839
848
|
const originalSrcDescriptor = Object.getOwnPropertyDescriptor(HTMLImageElement.prototype, 'src');
|
|
840
849
|
Object.defineProperty(img, 'src', {
|
|
841
850
|
set(value) {
|
|
842
|
-
if (getTargetingCookie() &&
|
|
851
|
+
if (getTargetingCookie() &&
|
|
852
|
+
(value.includes('https://www.facebook.com/privacy_sandbox/pixel/register/trigger/') ||
|
|
853
|
+
value.includes('https://www.facebook.com/tr'))) {
|
|
843
854
|
return;
|
|
844
855
|
}
|
|
845
856
|
// 继续正常设置 src
|
|
@@ -877,7 +888,9 @@
|
|
|
877
888
|
// 覆盖方法
|
|
878
889
|
navigatorWithBeacon.sendBeacon = function (url, data) {
|
|
879
890
|
const urlString = url instanceof URL ? url.href : url.toString();
|
|
880
|
-
if (getTargetingCookie() &&
|
|
891
|
+
if (getTargetingCookie() &&
|
|
892
|
+
(urlString.includes('https://tr.snapchat.com/p') ||
|
|
893
|
+
urlString.includes('https://analytics.tiktok.com/api/v2/pixel'))) {
|
|
881
894
|
return true;
|
|
882
895
|
}
|
|
883
896
|
const success = originalSendBeacon(url, data);
|
|
@@ -964,18 +977,16 @@
|
|
|
964
977
|
// 安全获取 URL 字符串
|
|
965
978
|
let url;
|
|
966
979
|
try {
|
|
967
|
-
url = typeof input === 'string'
|
|
968
|
-
? input
|
|
969
|
-
: input instanceof URL
|
|
970
|
-
? input.href
|
|
971
|
-
: input.url;
|
|
980
|
+
url = typeof input === 'string' ? input : input instanceof URL ? input.href : input.url;
|
|
972
981
|
}
|
|
973
982
|
catch (error) {
|
|
974
983
|
console.error('解析请求URL失败:', error);
|
|
975
984
|
return _originalFetch.apply(this, arguments_1);
|
|
976
985
|
}
|
|
977
986
|
try {
|
|
978
|
-
if (getTargetingCookie() &&
|
|
987
|
+
if (getTargetingCookie() &&
|
|
988
|
+
(url.includes('https://www.google-analytics.com/g/collect') ||
|
|
989
|
+
url.includes('https://arms-retcode.aliyuncs.com/r.png'))) {
|
|
979
990
|
return Promise.resolve(new Response(''));
|
|
980
991
|
}
|
|
981
992
|
// 1. 先执行原始请求
|
|
@@ -1031,7 +1042,12 @@
|
|
|
1031
1042
|
};
|
|
1032
1043
|
XMLHttpRequest.prototype.send = function (body) {
|
|
1033
1044
|
var _a;
|
|
1034
|
-
if (getTargetingCookie() &&
|
|
1045
|
+
if (getTargetingCookie() &&
|
|
1046
|
+
this._url &&
|
|
1047
|
+
typeof this._url === 'string' &&
|
|
1048
|
+
(this._url.includes('https://rumcollector.uptime.com') ||
|
|
1049
|
+
this._url.includes('https://arms-retcode.aliyuncs.com/r.png') ||
|
|
1050
|
+
this._url.includes('https://i.giesswein.com/nb-collector'))) {
|
|
1035
1051
|
return;
|
|
1036
1052
|
}
|
|
1037
1053
|
if (this._url && typeof this._url === 'string' && this._url.includes('https://i.giesswein.com/nb-collector')) {
|
|
@@ -1085,8 +1101,8 @@
|
|
|
1085
1101
|
}, [bffDataSource]);
|
|
1086
1102
|
// 获取推荐视频数据
|
|
1087
1103
|
const getRecommendVideos = React.useCallback((query) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1088
|
-
var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
|
|
1089
|
-
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 })), (
|
|
1104
|
+
var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
|
1105
|
+
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' }));
|
|
1090
1106
|
if (channel) {
|
|
1091
1107
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(channel) });
|
|
1092
1108
|
}
|
|
@@ -1099,9 +1115,10 @@
|
|
|
1099
1115
|
if (val)
|
|
1100
1116
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
|
|
1101
1117
|
}
|
|
1118
|
+
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);
|
|
1102
1119
|
if (isEditor) {
|
|
1103
1120
|
let pageNum = 1;
|
|
1104
|
-
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] }));
|
|
1121
|
+
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 }));
|
|
1105
1122
|
if (!(query === null || query === void 0 ? void 0 : query.channel) || isInit.current) {
|
|
1106
1123
|
return undefined;
|
|
1107
1124
|
}
|
|
@@ -1109,19 +1126,24 @@
|
|
|
1109
1126
|
let list = [];
|
|
1110
1127
|
let result = null;
|
|
1111
1128
|
const recurveRecList = (query) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1112
|
-
var
|
|
1129
|
+
var _y, _z, _0, _1, _2, _3;
|
|
1113
1130
|
query.pageNum = pageNum;
|
|
1114
|
-
result =
|
|
1131
|
+
result = isDiyH5
|
|
1132
|
+
? yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v3/recommend/direct/page/view', { method: 'POST', body: query }))
|
|
1133
|
+
: yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('recommend/direct_page', { method: 'POST', body: query }));
|
|
1115
1134
|
if (!(result === null || result === void 0 ? void 0 : result.success)) {
|
|
1116
1135
|
return undefined;
|
|
1117
1136
|
}
|
|
1118
1137
|
setLoading(false);
|
|
1119
|
-
list = list.concat((
|
|
1138
|
+
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 : []);
|
|
1120
1139
|
if ((rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) === 0) {
|
|
1121
1140
|
setRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
|
1122
1141
|
setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
|
1142
|
+
if (isDiyPage) {
|
|
1143
|
+
setFirstRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
|
1144
|
+
}
|
|
1123
1145
|
}
|
|
1124
|
-
const isNotNullList = (
|
|
1146
|
+
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));
|
|
1125
1147
|
if (isNotNullList) {
|
|
1126
1148
|
pageNum = pageNum + 1;
|
|
1127
1149
|
yield recurveRecList(query);
|
|
@@ -1129,42 +1151,61 @@
|
|
|
1129
1151
|
});
|
|
1130
1152
|
yield recurveRecList(query);
|
|
1131
1153
|
if (!(query === null || query === void 0 ? void 0 : query.hashTag) && result)
|
|
1132
|
-
setCurReqInfo({ rtc: (
|
|
1154
|
+
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 });
|
|
1133
1155
|
return Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list });
|
|
1134
1156
|
}
|
|
1135
1157
|
if (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) {
|
|
1136
|
-
query = Object.assign(Object.assign({}, query), { directPage: true, level: 1, pageNum: (
|
|
1158
|
+
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 }));
|
|
1137
1159
|
}
|
|
1138
|
-
const result =
|
|
1139
|
-
method: 'POST',
|
|
1140
|
-
|
|
1141
|
-
|
|
1160
|
+
const result = isDiy
|
|
1161
|
+
? yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v3/recommend/direct/page/view', { method: 'POST', body: query }))
|
|
1162
|
+
: yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/list', {
|
|
1163
|
+
method: 'POST',
|
|
1164
|
+
body: query
|
|
1165
|
+
}));
|
|
1142
1166
|
if (!(result === null || result === void 0 ? void 0 : result.success)) {
|
|
1143
1167
|
return undefined;
|
|
1144
1168
|
}
|
|
1145
1169
|
if (!(query === null || query === void 0 ? void 0 : query.hashTag))
|
|
1146
1170
|
setCurReqInfo({ rtc: result.data.rtc, requestId: result.data.requestId });
|
|
1147
1171
|
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) && !isEditor) {
|
|
1148
|
-
const isNotNullList = (
|
|
1172
|
+
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));
|
|
1149
1173
|
if (!isNotNullList) {
|
|
1150
1174
|
setIsNoMoreData(true);
|
|
1151
1175
|
}
|
|
1152
1176
|
}
|
|
1153
1177
|
let list = [];
|
|
1154
|
-
list = list.concat((
|
|
1178
|
+
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 : []);
|
|
1155
1179
|
return Object.assign(Object.assign({}, result.data), { recList: list });
|
|
1156
|
-
}), [
|
|
1180
|
+
}), [
|
|
1181
|
+
bffFetch,
|
|
1182
|
+
utmVal,
|
|
1183
|
+
maxSize,
|
|
1184
|
+
defaultSize,
|
|
1185
|
+
channelQueryList,
|
|
1186
|
+
channel,
|
|
1187
|
+
chatlabsId,
|
|
1188
|
+
bffFetchAdmin,
|
|
1189
|
+
isDiyPage,
|
|
1190
|
+
finalPageData,
|
|
1191
|
+
isDiyH5
|
|
1192
|
+
]);
|
|
1157
1193
|
const loadVideos = React.useCallback((pageNum) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1158
|
-
var
|
|
1194
|
+
var _4, _5, _6, _7;
|
|
1159
1195
|
if (rtcList.length <= 0) {
|
|
1160
1196
|
return;
|
|
1161
1197
|
}
|
|
1198
|
+
if (isDiyPage && (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) > 0) {
|
|
1199
|
+
setRtcList(rtcList.concat(firstRtcList));
|
|
1200
|
+
setCacheRtcList(cacheRtcList.concat(firstRtcList));
|
|
1201
|
+
return;
|
|
1202
|
+
}
|
|
1162
1203
|
const lastItem = rtcList === null || rtcList === void 0 ? void 0 : rtcList[(rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) - 1];
|
|
1163
|
-
const data = yield getRecommendVideos(Object.assign(Object.assign(Object.assign(Object.assign({ hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag }, (((
|
|
1204
|
+
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 })));
|
|
1164
1205
|
setRtcList(rtcList.concat(getFilterRecList(data)));
|
|
1165
1206
|
setCacheRtcList(cacheRtcList.concat(getFilterRecList(data)));
|
|
1166
1207
|
return data;
|
|
1167
|
-
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
|
|
1208
|
+
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList, isDiyPage, firstRtcList]);
|
|
1168
1209
|
const refreshFeSession = React.useCallback((enableReSid, event) => {
|
|
1169
1210
|
var _a, _b, _c, _d, _e;
|
|
1170
1211
|
let expire = false;
|
|
@@ -1195,8 +1236,8 @@
|
|
|
1195
1236
|
// 用户信息都是公共的
|
|
1196
1237
|
if (!userInfo) {
|
|
1197
1238
|
userInfo = {
|
|
1198
|
-
|
|
1199
|
-
|
|
1239
|
+
productUserId: fakeUserId // 后端逻辑会从请求头获取,所以不需要传
|
|
1240
|
+
// tpChannelId: 'H5' // 后端处理
|
|
1200
1241
|
};
|
|
1201
1242
|
}
|
|
1202
1243
|
const sessionID = storeAndLoadFeSessionId();
|
|
@@ -1230,7 +1271,8 @@
|
|
|
1230
1271
|
layoutVariantId,
|
|
1231
1272
|
globalConfig,
|
|
1232
1273
|
playbookType,
|
|
1233
|
-
bffDataSource
|
|
1274
|
+
bffDataSource,
|
|
1275
|
+
fakeUserId
|
|
1234
1276
|
]);
|
|
1235
1277
|
const getEventParamsByJson = React.useCallback((_a) => {
|
|
1236
1278
|
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
|
@@ -1256,23 +1298,37 @@
|
|
|
1256
1298
|
}))) !== 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,
|
|
1257
1299
|
// prompt
|
|
1258
1300
|
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);
|
|
1259
|
-
if (!((_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.url) &&
|
|
1301
|
+
if (!((_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.url) &&
|
|
1302
|
+
!((_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) &&
|
|
1303
|
+
(rec === null || rec === void 0 ? void 0 : rec.product) &&
|
|
1304
|
+
Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) &&
|
|
1305
|
+
((_r = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _r === void 0 ? void 0 : _r.length) > 0) {
|
|
1260
1306
|
const product = rec === null || rec === void 0 ? void 0 : rec.product;
|
|
1261
1307
|
const productCustomData = {
|
|
1262
1308
|
content_ids: [product === null || product === void 0 ? void 0 : product.itemId],
|
|
1263
1309
|
content_type: 'product',
|
|
1264
1310
|
content_name: '',
|
|
1265
|
-
contents: [
|
|
1311
|
+
contents: [
|
|
1312
|
+
{
|
|
1266
1313
|
id: product === null || product === void 0 ? void 0 : product.itemId,
|
|
1267
1314
|
item_price: product === null || product === void 0 ? void 0 : product.price
|
|
1268
|
-
}
|
|
1315
|
+
}
|
|
1316
|
+
],
|
|
1269
1317
|
image_urls: (_s = product.homePage) !== null && _s !== void 0 ? _s : []
|
|
1270
1318
|
};
|
|
1271
1319
|
customData = Object.assign(Object.assign({}, customData), productCustomData);
|
|
1272
1320
|
}
|
|
1273
1321
|
if (eventName === 'ContentSwipe' || eventName === 'Engagement' || eventName === 'ExitFeed') {
|
|
1274
|
-
const deleteKeys = [
|
|
1275
|
-
|
|
1322
|
+
const deleteKeys = [
|
|
1323
|
+
'content_ids',
|
|
1324
|
+
'content_category',
|
|
1325
|
+
'currency',
|
|
1326
|
+
'contents',
|
|
1327
|
+
'image_urls',
|
|
1328
|
+
'video_urls',
|
|
1329
|
+
'prompt'
|
|
1330
|
+
];
|
|
1331
|
+
deleteKeys.forEach((key) => {
|
|
1276
1332
|
if (customData === null || customData === void 0 ? void 0 : customData[key])
|
|
1277
1333
|
delete customData[key];
|
|
1278
1334
|
});
|
|
@@ -1378,7 +1434,9 @@
|
|
|
1378
1434
|
if ((snapchatPixelEventParamsJson === null || snapchatPixelEventParamsJson === void 0 ? void 0 : snapchatPixelEventParamsJson.event_name) && typeof (window === null || window === void 0 ? void 0 : window.snaptr) === 'function') {
|
|
1379
1435
|
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)));
|
|
1380
1436
|
}
|
|
1381
|
-
if (eventName === 'PageView' &&
|
|
1437
|
+
if (eventName === 'PageView' &&
|
|
1438
|
+
typeof (window === null || window === void 0 ? void 0 : window.Northbeam) === 'object' &&
|
|
1439
|
+
typeof ((_g = window === null || window === void 0 ? void 0 : window.Northbeam) === null || _g === void 0 ? void 0 : _g.trackPageView) === 'function') {
|
|
1382
1440
|
(_h = window === null || window === void 0 ? void 0 : window.Northbeam) === null || _h === void 0 ? void 0 : _h.trackPageView();
|
|
1383
1441
|
}
|
|
1384
1442
|
const converApiEventParamsJson = (_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _j === void 0 ? void 0 : _j[eventName];
|
|
@@ -1400,38 +1458,40 @@
|
|
|
1400
1458
|
}
|
|
1401
1459
|
}, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig, bffDataSource, getEventParamsByJson]);
|
|
1402
1460
|
const bffMutateLike = React.useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1461
|
+
body = Object.assign(Object.assign({}, body), { productUserId: fakeUserId });
|
|
1403
1462
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/like', { method: 'POST', body }));
|
|
1404
1463
|
return res === null || res === void 0 ? void 0 : res.success;
|
|
1405
|
-
}), [bffFetch]);
|
|
1464
|
+
}), [bffFetch, fakeUserId]);
|
|
1406
1465
|
const bffMutateUnlike = React.useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1466
|
+
body = Object.assign(Object.assign({}, body), { productUserId: fakeUserId });
|
|
1407
1467
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/unlike', { method: 'POST', body }));
|
|
1408
1468
|
return res === null || res === void 0 ? void 0 : res.success;
|
|
1409
|
-
}), [bffFetch]);
|
|
1469
|
+
}), [bffFetch, fakeUserId]);
|
|
1410
1470
|
const bffSubmitForm = React.useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1411
1471
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/customform', { method: 'POST', body }));
|
|
1412
1472
|
return res === null || res === void 0 ? void 0 : res.success;
|
|
1413
1473
|
}), [bffFetch]);
|
|
1414
1474
|
// 获取 Tag
|
|
1415
1475
|
const bffGetTagList = React.useCallback((data) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1416
|
-
var
|
|
1417
|
-
const isShowTag = !!((
|
|
1476
|
+
var _8, _9, _10, _11, _12, _13, _14, _15;
|
|
1477
|
+
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);
|
|
1418
1478
|
if (!utmVal || !isShowTag)
|
|
1419
1479
|
return;
|
|
1420
1480
|
try {
|
|
1421
|
-
const val = (
|
|
1481
|
+
const val = (_13 = (_12 = (_11 = splitUrlParams(utmVal)) === null || _11 === void 0 ? void 0 : _11.filter((val) => {
|
|
1422
1482
|
var _a, _b;
|
|
1423
1483
|
const key = val.split('=')[0];
|
|
1424
1484
|
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);
|
|
1425
|
-
})) === null ||
|
|
1485
|
+
})) === null || _12 === void 0 ? void 0 : _12.join('&')) !== null && _13 !== void 0 ? _13 : '';
|
|
1426
1486
|
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
|
|
1427
|
-
setTagList((
|
|
1487
|
+
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 : []);
|
|
1428
1488
|
}
|
|
1429
1489
|
catch (e) {
|
|
1430
1490
|
console.log('e', e);
|
|
1431
1491
|
}
|
|
1432
1492
|
}), [bffFetch, utmVal]);
|
|
1433
1493
|
const ctaEvent = React.useCallback((eventInfo, rec, product, position, ctaActionType, targetUrl, contentType) => {
|
|
1434
|
-
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;
|
|
1494
|
+
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;
|
|
1435
1495
|
const cta = product === null || product === void 0 ? void 0 : product.bindCta;
|
|
1436
1496
|
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);
|
|
1437
1497
|
let fromKName = '';
|
|
@@ -1449,7 +1509,7 @@
|
|
|
1449
1509
|
}
|
|
1450
1510
|
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;
|
|
1451
1511
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
1452
|
-
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: (
|
|
1512
|
+
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 })
|
|
1453
1513
|
});
|
|
1454
1514
|
}, [bffEventReport, isFromHashtag]);
|
|
1455
1515
|
const h5EnterLink = React.useCallback(() => {
|
|
@@ -1473,10 +1533,10 @@
|
|
|
1473
1533
|
});
|
|
1474
1534
|
}, [bffEventReport]);
|
|
1475
1535
|
const getAccount = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
1476
|
-
var
|
|
1536
|
+
var _16, _17;
|
|
1477
1537
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/account', { method: 'GET' }));
|
|
1478
|
-
setChatlabsId((
|
|
1479
|
-
return ((
|
|
1538
|
+
setChatlabsId((_16 = res === null || res === void 0 ? void 0 : res.data) === null || _16 === void 0 ? void 0 : _16.chatLabsId);
|
|
1539
|
+
return ((_17 = res === null || res === void 0 ? void 0 : res.data) === null || _17 === void 0 ? void 0 : _17.consentResult) === 'true';
|
|
1480
1540
|
}), [bffFetch]);
|
|
1481
1541
|
const accountSonsent = React.useCallback((consentResult) => __awaiter(void 0, void 0, void 0, function* () {
|
|
1482
1542
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/account/consent', {
|
|
@@ -1540,6 +1600,9 @@
|
|
|
1540
1600
|
}
|
|
1541
1601
|
setRtcList(list);
|
|
1542
1602
|
setCacheRtcList(list);
|
|
1603
|
+
if (isDiyPage) {
|
|
1604
|
+
setFirstRtcList(list);
|
|
1605
|
+
}
|
|
1543
1606
|
bffGetTagList(curData !== null && curData !== void 0 ? curData : finalPageData);
|
|
1544
1607
|
if (channel) {
|
|
1545
1608
|
const item = list === null || list === void 0 ? void 0 : list[0];
|
|
@@ -1559,7 +1622,7 @@
|
|
|
1559
1622
|
});
|
|
1560
1623
|
setLoading(false);
|
|
1561
1624
|
});
|
|
1562
|
-
}, [isShowConsent, channel]);
|
|
1625
|
+
}, [isShowConsent, channel, isDiyPage]);
|
|
1563
1626
|
// cms预览
|
|
1564
1627
|
React.useEffect(() => {
|
|
1565
1628
|
if (!isPreview)
|
|
@@ -1575,12 +1638,15 @@
|
|
|
1575
1638
|
}
|
|
1576
1639
|
setRtcList(list);
|
|
1577
1640
|
setCacheRtcList(list);
|
|
1641
|
+
if (isDiyPage) {
|
|
1642
|
+
setFirstRtcList(list);
|
|
1643
|
+
}
|
|
1578
1644
|
}
|
|
1579
1645
|
})
|
|
1580
1646
|
.finally(() => {
|
|
1581
1647
|
setLoading(false);
|
|
1582
1648
|
});
|
|
1583
|
-
}, [getRecommendVideos, bffGetTagList, channel]);
|
|
1649
|
+
}, [getRecommendVideos, bffGetTagList, channel, isDiyPage]);
|
|
1584
1650
|
const defaultLoadingImage = useIconLink('/pb_static/a65d23c5893c49d7aaaa81681d3179e2.gif', appDomain);
|
|
1585
1651
|
return (React.createElement(SxpDataSourceContext.Provider, { value: {
|
|
1586
1652
|
rtcList,
|
|
@@ -1638,7 +1704,8 @@
|
|
|
1638
1704
|
refreshFeSession,
|
|
1639
1705
|
getAccount,
|
|
1640
1706
|
accountSonsent,
|
|
1641
|
-
isDiyH5,
|
|
1707
|
+
isDiyH5: isDiyPage,
|
|
1708
|
+
firstRtcList,
|
|
1642
1709
|
pixelPvStatusRef
|
|
1643
1710
|
} }, 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({
|
|
1644
1711
|
rtcList,
|
|
@@ -2100,14 +2167,14 @@
|
|
|
2100
2167
|
* @Author: binruan@chatlabs.com
|
|
2101
2168
|
* @Date: 2024-03-12 10:59:06
|
|
2102
2169
|
* @LastEditors: binruan@chatlabs.com
|
|
2103
|
-
* @LastEditTime:
|
|
2170
|
+
* @LastEditTime: 2025-05-09 15:30:59
|
|
2104
2171
|
* @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
|
|
2105
2172
|
*
|
|
2106
2173
|
*/
|
|
2107
2174
|
function useEventReport() {
|
|
2108
2175
|
const { bffEventReport, popupDetailData, isFromHashtag, eventTimeList, setEventTimeList } = useSxpDataSource();
|
|
2109
2176
|
const jumpToWeb = React.useCallback((e, data, product, cta, position, traceInfo) => {
|
|
2110
|
-
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;
|
|
2177
|
+
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;
|
|
2111
2178
|
const i = eventTimeList === null || eventTimeList === void 0 ? void 0 : eventTimeList.findIndex((item) => item.target === (e === null || e === void 0 ? void 0 : e.target));
|
|
2112
2179
|
if (i !== -1) {
|
|
2113
2180
|
return;
|
|
@@ -2140,11 +2207,11 @@
|
|
|
2140
2207
|
contentFormat = 'image';
|
|
2141
2208
|
}
|
|
2142
2209
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
2143
|
-
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 : '',
|
|
2210
|
+
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 }))
|
|
2144
2211
|
});
|
|
2145
2212
|
}, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
|
|
2146
2213
|
const productView = React.useCallback((data, product, cta, viewTime, position) => {
|
|
2147
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
|
2214
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
|
2148
2215
|
let fromKName = '';
|
|
2149
2216
|
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))) {
|
|
2150
2217
|
fromKName = 'pdpPage';
|
|
@@ -2163,8 +2230,9 @@
|
|
|
2163
2230
|
contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags),
|
|
2164
2231
|
position: position + '',
|
|
2165
2232
|
contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
|
2233
|
+
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 : '',
|
|
2166
2234
|
ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
|
|
2167
|
-
traceInfo: (
|
|
2235
|
+
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 : '',
|
|
2168
2236
|
timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
|
|
2169
2237
|
eventSubject: 'productView',
|
|
2170
2238
|
eventDescription: 'User browsed the product'
|
|
@@ -16208,7 +16276,7 @@ Made in Italy` })));
|
|
|
16208
16276
|
* @Author: binruan@chatlabs.com
|
|
16209
16277
|
* @Date: 2024-01-10 10:58:24
|
|
16210
16278
|
* @LastEditors: binruan@chatlabs.com
|
|
16211
|
-
* @LastEditTime: 2025-
|
|
16279
|
+
* @LastEditTime: 2025-05-09 15:30:41
|
|
16212
16280
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\WaterFall\index.tsx
|
|
16213
16281
|
*
|
|
16214
16282
|
*/
|
|
@@ -16246,7 +16314,7 @@ Made in Italy` })));
|
|
|
16246
16314
|
}
|
|
16247
16315
|
}, [waterFallData]);
|
|
16248
16316
|
const reportTagsView = React.useCallback(() => {
|
|
16249
|
-
var _a, _b, _c, _d, _e, _f;
|
|
16317
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
16250
16318
|
const rec = recData === null || recData === void 0 ? void 0 : recData.rec;
|
|
16251
16319
|
if (!rec)
|
|
16252
16320
|
return;
|
|
@@ -16266,9 +16334,10 @@ Made in Italy` })));
|
|
|
16266
16334
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
16267
16335
|
eventInfo: {
|
|
16268
16336
|
contentId: (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
|
16337
|
+
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 : '',
|
|
16269
16338
|
position: cacheActiveIndex + '',
|
|
16270
|
-
contentTags: JSON.stringify((
|
|
16271
|
-
traceInfo: (
|
|
16339
|
+
contentTags: JSON.stringify((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.tags),
|
|
16340
|
+
traceInfo: (_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.traceInfo,
|
|
16272
16341
|
hashTags: JSON.stringify([recData === null || recData === void 0 ? void 0 : recData.hashTag]),
|
|
16273
16342
|
fromKName,
|
|
16274
16343
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
|
@@ -18375,21 +18444,22 @@ Made in Italy` })));
|
|
|
18375
18444
|
const likeIcon = useIconLink(defaultLikeIconPath$2);
|
|
18376
18445
|
const unlikeIcon = useIconLink(defaultUnLikeIconPath$2);
|
|
18377
18446
|
const handleClick = lodash.debounce(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
18378
|
-
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;
|
|
18447
|
+
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;
|
|
18379
18448
|
if (state) {
|
|
18380
18449
|
// 先设置状态
|
|
18381
18450
|
setState(false);
|
|
18382
|
-
const result = (_e = (yield (mutateUnlike === null || mutateUnlike === void 0 ? void 0 : mutateUnlike({
|
|
18451
|
+
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;
|
|
18383
18452
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
18384
18453
|
eventInfo: {
|
|
18385
18454
|
eventSubject: 'favoriteContentCanceled',
|
|
18386
18455
|
eventDescription: 'This content was unfavorite by the user',
|
|
18387
18456
|
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 : '',
|
|
18388
|
-
|
|
18389
|
-
|
|
18457
|
+
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 : '',
|
|
18458
|
+
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 : '',
|
|
18459
|
+
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 : []),
|
|
18390
18460
|
position: position + '',
|
|
18391
|
-
contentFormat: ((
|
|
18392
|
-
traceInfo: (
|
|
18461
|
+
contentFormat: ((_q = recData === null || recData === void 0 ? void 0 : recData.video) === null || _q === void 0 ? void 0 : _q.url) ? 'video' : 'image',
|
|
18462
|
+
traceInfo: (_r = recData === null || recData === void 0 ? void 0 : recData.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
18393
18463
|
}
|
|
18394
18464
|
});
|
|
18395
18465
|
// 如果接口调用失败,则回滚状态
|
|
@@ -18397,48 +18467,49 @@ Made in Italy` })));
|
|
|
18397
18467
|
setState(true);
|
|
18398
18468
|
}
|
|
18399
18469
|
else {
|
|
18400
|
-
const nRtcList = (
|
|
18470
|
+
const nRtcList = (_s = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
|
18401
18471
|
if (index === position) {
|
|
18402
18472
|
item.isCollected = false;
|
|
18403
18473
|
}
|
|
18404
18474
|
return item;
|
|
18405
|
-
})) !== null &&
|
|
18475
|
+
})) !== null && _s !== void 0 ? _s : [];
|
|
18406
18476
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
|
18407
18477
|
}
|
|
18408
18478
|
}
|
|
18409
18479
|
else {
|
|
18410
18480
|
setState(true);
|
|
18411
|
-
const result = (
|
|
18481
|
+
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;
|
|
18412
18482
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
18413
18483
|
eventInfo: {
|
|
18414
18484
|
eventSubject: 'favoriteContent',
|
|
18415
18485
|
eventDescription: 'This content was favorite by the user',
|
|
18416
|
-
contentId: (
|
|
18417
|
-
|
|
18418
|
-
|
|
18486
|
+
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 : '',
|
|
18487
|
+
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 : '',
|
|
18488
|
+
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 : '',
|
|
18489
|
+
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 : []),
|
|
18419
18490
|
position: position + '',
|
|
18420
|
-
contentFormat: ((
|
|
18421
|
-
traceInfo: (
|
|
18491
|
+
contentFormat: ((_5 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _5 === void 0 ? void 0 : _5.url) ? 'video' : 'image',
|
|
18492
|
+
traceInfo: (_6 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _6 === void 0 ? void 0 : _6.traceInfo
|
|
18422
18493
|
}
|
|
18423
18494
|
});
|
|
18424
18495
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
18425
18496
|
eventName: 'Engagement',
|
|
18426
|
-
product: (
|
|
18497
|
+
product: (_7 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _7 === void 0 ? void 0 : _7.bindProducts,
|
|
18427
18498
|
rec: recData,
|
|
18428
18499
|
position,
|
|
18429
|
-
content_id: (
|
|
18500
|
+
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 : '',
|
|
18430
18501
|
engagement_type: 'like'
|
|
18431
18502
|
});
|
|
18432
18503
|
if (!result) {
|
|
18433
18504
|
setState(false);
|
|
18434
18505
|
}
|
|
18435
18506
|
else {
|
|
18436
|
-
const nRtcList = (
|
|
18507
|
+
const nRtcList = (_10 = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
|
18437
18508
|
if (index === position) {
|
|
18438
18509
|
item.isCollected = true;
|
|
18439
18510
|
}
|
|
18440
18511
|
return item;
|
|
18441
|
-
})) !== null &&
|
|
18512
|
+
})) !== null && _10 !== void 0 ? _10 : [];
|
|
18442
18513
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
|
18443
18514
|
}
|
|
18444
18515
|
}
|
|
@@ -18475,7 +18546,7 @@ Made in Italy` })));
|
|
|
18475
18546
|
const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activeIndex, videoPostConfig, videoPlayIcon, loopPlay, swiperRef, visibleHeight }, ref) => {
|
|
18476
18547
|
var _a, _b;
|
|
18477
18548
|
const [isPauseVideo, setIsPauseVideo] = React.useState(false);
|
|
18478
|
-
const { bffEventReport, sxpParameter,
|
|
18549
|
+
const { bffEventReport, sxpParameter, firstRtcList, openHashtag, bffFbReport, isDiyH5 } = useSxpDataSource();
|
|
18479
18550
|
const videoStartTime = React.useRef(0);
|
|
18480
18551
|
const [isLoadFinish, setIsLoadFinish] = React.useState(false);
|
|
18481
18552
|
const { isActive } = useSwiperSlide();
|
|
@@ -18492,7 +18563,7 @@ Made in Italy` })));
|
|
|
18492
18563
|
const loopPlayRef = React.useRef(loopPlay);
|
|
18493
18564
|
const scene = rec.video.scene;
|
|
18494
18565
|
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);
|
|
18495
|
-
const videoCover = (
|
|
18566
|
+
const videoCover = (_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.cover;
|
|
18496
18567
|
const videoPoster = videoCover || (sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.placeholder_image);
|
|
18497
18568
|
React.useImperativeHandle(ref, () => {
|
|
18498
18569
|
return {
|
|
@@ -18541,6 +18612,23 @@ Made in Italy` })));
|
|
|
18541
18612
|
return;
|
|
18542
18613
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
|
18543
18614
|
}, [videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
18615
|
+
const handleEnd = () => {
|
|
18616
|
+
var _a, _b, _c, _d, _e, _f;
|
|
18617
|
+
if (!videoRef.current)
|
|
18618
|
+
return;
|
|
18619
|
+
if (isDiyH5) {
|
|
18620
|
+
(_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
|
|
18621
|
+
if (!loopPlayRef.current)
|
|
18622
|
+
return;
|
|
18623
|
+
if (firstRtcList && index < (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) - 1) {
|
|
18624
|
+
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;
|
|
18625
|
+
(_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);
|
|
18626
|
+
}
|
|
18627
|
+
}
|
|
18628
|
+
else {
|
|
18629
|
+
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.play();
|
|
18630
|
+
}
|
|
18631
|
+
};
|
|
18544
18632
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
|
18545
18633
|
const handlePlaying = React.useCallback(() => {
|
|
18546
18634
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
@@ -18549,7 +18637,7 @@ Made in Italy` })));
|
|
|
18549
18637
|
setIsLoadFinish(true);
|
|
18550
18638
|
}, []);
|
|
18551
18639
|
const handleStartPlay = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
18552
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
|
18640
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
|
18553
18641
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
18554
18642
|
return;
|
|
18555
18643
|
setIsPauseVideo(false);
|
|
@@ -18560,16 +18648,11 @@ Made in Italy` })));
|
|
|
18560
18648
|
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);
|
|
18561
18649
|
const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
|
|
18562
18650
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
18563
|
-
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 : '',
|
|
18651
|
+
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) + '' }))
|
|
18564
18652
|
});
|
|
18565
18653
|
isFirstPlayRef.current = false;
|
|
18566
18654
|
}
|
|
18567
18655
|
}), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
18568
|
-
const setCurrentTimeByStartTime = React.useCallback(() => {
|
|
18569
|
-
if (isDiyH5) {
|
|
18570
|
-
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
|
18571
|
-
}
|
|
18572
|
-
}, []);
|
|
18573
18656
|
const handLoadeddata = React.useCallback(() => {
|
|
18574
18657
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
|
|
18575
18658
|
return;
|
|
@@ -18594,13 +18677,12 @@ Made in Italy` })));
|
|
|
18594
18677
|
const handleLoadedmetadata = React.useCallback(() => {
|
|
18595
18678
|
if (!videoRef.current)
|
|
18596
18679
|
return;
|
|
18597
|
-
setCurrentTimeByStartTime();
|
|
18598
18680
|
loadedTimeRef.current = new Date();
|
|
18599
18681
|
handleStartPlay();
|
|
18600
18682
|
handLoadeddata();
|
|
18601
18683
|
}, [videoRef.current, handLoadeddata, handleStartPlay]);
|
|
18602
18684
|
const handleClickVideo = React.useCallback((type) => () => {
|
|
18603
|
-
var _a, _b, _c, _d, _e
|
|
18685
|
+
var _a, _b, _c, _d, _e;
|
|
18604
18686
|
if (!videoRef.current)
|
|
18605
18687
|
return;
|
|
18606
18688
|
if (!isLoadFinish)
|
|
@@ -18621,20 +18703,17 @@ Made in Italy` })));
|
|
|
18621
18703
|
break;
|
|
18622
18704
|
default:
|
|
18623
18705
|
if (isPause) {
|
|
18624
|
-
|
|
18625
|
-
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
|
18626
|
-
}
|
|
18627
|
-
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
|
|
18706
|
+
(_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.play();
|
|
18628
18707
|
}
|
|
18629
18708
|
else {
|
|
18630
|
-
(
|
|
18709
|
+
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.pause();
|
|
18631
18710
|
}
|
|
18632
18711
|
setIsPauseVideo(!isPause);
|
|
18633
18712
|
break;
|
|
18634
18713
|
}
|
|
18635
18714
|
}, [isLoadFinish, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
18636
18715
|
const handlePause = React.useCallback(() => {
|
|
18637
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
18716
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
18638
18717
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
18639
18718
|
return;
|
|
18640
18719
|
if (activeIndex !== index)
|
|
@@ -18650,14 +18729,15 @@ Made in Italy` })));
|
|
|
18650
18729
|
eventSubject: 'playOverVideo',
|
|
18651
18730
|
eventDescription: 'User finished playing the video',
|
|
18652
18731
|
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 : '',
|
|
18653
|
-
|
|
18732
|
+
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 : '',
|
|
18733
|
+
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 : '',
|
|
18654
18734
|
endTime: videoCurrentTime,
|
|
18655
18735
|
videoDuration,
|
|
18656
18736
|
playDuration,
|
|
18657
|
-
contentTags: JSON.stringify((
|
|
18737
|
+
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 : []),
|
|
18658
18738
|
position: index + '',
|
|
18659
18739
|
contentFormat: 'video',
|
|
18660
|
-
traceInfo: (
|
|
18740
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
18661
18741
|
}
|
|
18662
18742
|
});
|
|
18663
18743
|
}
|
|
@@ -18665,27 +18745,8 @@ Made in Italy` })));
|
|
|
18665
18745
|
const handleWaiting = React.useCallback(() => {
|
|
18666
18746
|
setWaiting(true);
|
|
18667
18747
|
}, []);
|
|
18668
|
-
const handleTimeUpload = () => {
|
|
18669
|
-
if (!videoRef.current || !isDiyH5)
|
|
18670
|
-
return;
|
|
18671
|
-
setTimeout(() => {
|
|
18672
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
18673
|
-
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)) {
|
|
18674
|
-
(_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
|
|
18675
|
-
if (!loopPlayRef.current)
|
|
18676
|
-
return;
|
|
18677
|
-
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
|
18678
|
-
(_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);
|
|
18679
|
-
}
|
|
18680
|
-
else {
|
|
18681
|
-
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;
|
|
18682
|
-
(_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);
|
|
18683
|
-
}
|
|
18684
|
-
}
|
|
18685
|
-
});
|
|
18686
|
-
};
|
|
18687
18748
|
React.useEffect(() => {
|
|
18688
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
|
18749
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18689
18750
|
if (!isActive)
|
|
18690
18751
|
return;
|
|
18691
18752
|
const videoSrc = videoUrl;
|
|
@@ -18706,7 +18767,6 @@ Made in Italy` })));
|
|
|
18706
18767
|
hls === null || hls === void 0 ? void 0 : hls.attachMedia(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current);
|
|
18707
18768
|
hls === null || hls === void 0 ? void 0 : hls.on(Hls.Events.MANIFEST_PARSED, function () {
|
|
18708
18769
|
var _a;
|
|
18709
|
-
setCurrentTimeByStartTime();
|
|
18710
18770
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
|
18711
18771
|
});
|
|
18712
18772
|
}
|
|
@@ -18720,12 +18780,11 @@ Made in Italy` })));
|
|
|
18720
18780
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.addEventListener('play', handleStartPlay);
|
|
18721
18781
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.addEventListener('playing', handlePlaying);
|
|
18722
18782
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.addEventListener('pause', handlePause);
|
|
18723
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended',
|
|
18783
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handleEnd);
|
|
18724
18784
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.addEventListener('canplay', handlePlay);
|
|
18725
18785
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
|
|
18726
|
-
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.addEventListener('timeupdate', handleTimeUpload);
|
|
18727
18786
|
return () => {
|
|
18728
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
|
18787
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18729
18788
|
const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
|
|
18730
18789
|
if (!isPause)
|
|
18731
18790
|
handlePause();
|
|
@@ -18737,10 +18796,9 @@ Made in Italy` })));
|
|
|
18737
18796
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.removeEventListener('play', handleStartPlay);
|
|
18738
18797
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.removeEventListener('playing', handlePlaying);
|
|
18739
18798
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.removeEventListener('pause', handlePause);
|
|
18740
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended',
|
|
18799
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handleEnd);
|
|
18741
18800
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('canplay', handlePlay);
|
|
18742
18801
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.removeEventListener('waiting', handleWaiting);
|
|
18743
|
-
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.removeEventListener('timeupdate', handleTimeUpload);
|
|
18744
18802
|
};
|
|
18745
18803
|
}, [isActive]);
|
|
18746
18804
|
React.useEffect(() => {
|
|
@@ -18955,19 +19013,45 @@ Made in Italy` })));
|
|
|
18955
19013
|
}, onLoad: onShowFirstImage }))));
|
|
18956
19014
|
};
|
|
18957
19015
|
|
|
18958
|
-
const PictureGroup$4 = ({ imgUrls,
|
|
19016
|
+
const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig, swiperRef }, ref) => {
|
|
18959
19017
|
var _a, _b;
|
|
18960
19018
|
const { isActive } = useSwiperSlide();
|
|
18961
|
-
const {
|
|
19019
|
+
const { firstRtcList, openHashtag, isDiyH5 } = useSxpDataSource();
|
|
18962
19020
|
const [isLoad, setIsLoad] = React.useState(false);
|
|
18963
19021
|
const [imgInfo, setImgInfo] = React.useState();
|
|
18964
19022
|
const [swiperActiveIndex, setSwiperActiveIndex] = React.useState(0);
|
|
18965
|
-
const
|
|
19023
|
+
const imgsSwiperRef = React.useRef();
|
|
18966
19024
|
const isFirstPlayRef = React.useRef(true);
|
|
19025
|
+
const loopPlayRef = React.useRef(true);
|
|
18967
19026
|
const initTime = new Date();
|
|
19027
|
+
React.useImperativeHandle(ref, () => {
|
|
19028
|
+
return {
|
|
19029
|
+
setLoopPlay(v) {
|
|
19030
|
+
loopPlayRef.current = v;
|
|
19031
|
+
}
|
|
19032
|
+
};
|
|
19033
|
+
});
|
|
19034
|
+
React.useEffect(() => {
|
|
19035
|
+
let timerId;
|
|
19036
|
+
if (isLoad && isActive && isDiyH5) {
|
|
19037
|
+
timerId = setTimeout(() => {
|
|
19038
|
+
var _a, _b, _c, _d;
|
|
19039
|
+
if (!loopPlayRef.current)
|
|
19040
|
+
return;
|
|
19041
|
+
if (firstRtcList && index < (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) - 1) {
|
|
19042
|
+
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;
|
|
19043
|
+
(_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);
|
|
19044
|
+
}
|
|
19045
|
+
}, 3000);
|
|
19046
|
+
}
|
|
19047
|
+
return () => {
|
|
19048
|
+
if (timerId)
|
|
19049
|
+
clearTimeout(timerId);
|
|
19050
|
+
};
|
|
19051
|
+
}, [isLoad, isActive, isDiyH5, index, swiperRef, firstRtcList]);
|
|
18968
19052
|
React.useEffect(() => {
|
|
18969
19053
|
if (isLoad && isActive) {
|
|
18970
|
-
(
|
|
19054
|
+
(imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.start();
|
|
18971
19055
|
if (openHashtag) {
|
|
18972
19056
|
onViewImageEndEvent(rec);
|
|
18973
19057
|
}
|
|
@@ -18977,7 +19061,7 @@ Made in Italy` })));
|
|
|
18977
19061
|
}
|
|
18978
19062
|
}
|
|
18979
19063
|
else {
|
|
18980
|
-
(
|
|
19064
|
+
(imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.stop();
|
|
18981
19065
|
}
|
|
18982
19066
|
}, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
|
|
18983
19067
|
const showFirstImageFn = React.useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
|
|
@@ -19004,13 +19088,13 @@ Made in Italy` })));
|
|
|
19004
19088
|
};
|
|
19005
19089
|
}, [isActive, imgInfo]);
|
|
19006
19090
|
const handleMouseEnter = React.useCallback(() => {
|
|
19007
|
-
if (
|
|
19008
|
-
|
|
19091
|
+
if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
|
|
19092
|
+
imgsSwiperRef.current.swiper.autoplay.stop();
|
|
19009
19093
|
}
|
|
19010
19094
|
}, []);
|
|
19011
19095
|
const handleMouseLeave = React.useCallback(() => {
|
|
19012
|
-
if (
|
|
19013
|
-
|
|
19096
|
+
if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
|
|
19097
|
+
imgsSwiperRef.current.swiper.autoplay.start();
|
|
19014
19098
|
}
|
|
19015
19099
|
}, []);
|
|
19016
19100
|
const handleSlideChange = React.useCallback((swiper) => {
|
|
@@ -19031,7 +19115,7 @@ Made in Italy` })));
|
|
|
19031
19115
|
enabled: true
|
|
19032
19116
|
}
|
|
19033
19117
|
}
|
|
19034
|
-
: {}), { loop: true, ref:
|
|
19118
|
+
: {}), { loop: true, ref: imgsSwiperRef, onSlideChange: handleSlideChange, className: css.css(Object.assign(Object.assign({ '.swiper-pagination': {
|
|
19035
19119
|
bottom: (_a = imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.marginBottom) !== null && _a !== void 0 ? _a : 0,
|
|
19036
19120
|
fontSize: '14px'
|
|
19037
19121
|
} }, ((imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.dotsBgColor) && {
|
|
@@ -19048,7 +19132,7 @@ Made in Italy` })));
|
|
|
19048
19132
|
return (React.createElement(SwiperSlide, { key: srcKey, "aria-hidden": srcKey !== swiperActiveIndex },
|
|
19049
19133
|
React.createElement(Picture, { src: !isLoad && srcKey > 0 ? '' : url, height: height, imgUrlsPostConfig: imgUrlsPostConfig, onShowFirstImage: showFirstImageFn })));
|
|
19050
19134
|
}))));
|
|
19051
|
-
};
|
|
19135
|
+
});
|
|
19052
19136
|
var PictureGroup$5 = React.memo(PictureGroup$4);
|
|
19053
19137
|
|
|
19054
19138
|
/*
|
|
@@ -19340,7 +19424,7 @@ Made in Italy` })));
|
|
|
19340
19424
|
* @Author: binruan@chatlabs.com
|
|
19341
19425
|
* @Date: 2024-03-20 10:27:31
|
|
19342
19426
|
* @LastEditors: binruan@chatlabs.com
|
|
19343
|
-
* @LastEditTime: 2025-05-
|
|
19427
|
+
* @LastEditTime: 2025-05-12 14:26:15
|
|
19344
19428
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
|
19345
19429
|
*
|
|
19346
19430
|
*/
|
|
@@ -19361,6 +19445,7 @@ Made in Italy` })));
|
|
|
19361
19445
|
const [pageNum, setPageNum] = React.useState(2);
|
|
19362
19446
|
React.useState(false);
|
|
19363
19447
|
const videoWidgetRef = React.useRef(null);
|
|
19448
|
+
const pictureGroupRef = React.useRef(null);
|
|
19364
19449
|
const fbcRef = React.useRef('');
|
|
19365
19450
|
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();
|
|
19366
19451
|
const { backMainFeed, productView, jumpToWeb } = useEventReport();
|
|
@@ -19410,7 +19495,7 @@ Made in Italy` })));
|
|
|
19410
19495
|
(_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
|
|
19411
19496
|
}, [data, ctaType, swiperRef]);
|
|
19412
19497
|
const handleSessionCompleted = React.useCallback((fk) => {
|
|
19413
|
-
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;
|
|
19498
|
+
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;
|
|
19414
19499
|
const item = data === null || data === void 0 ? void 0 : data[activeIndex];
|
|
19415
19500
|
let fromKName = '';
|
|
19416
19501
|
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))) {
|
|
@@ -19437,22 +19522,23 @@ Made in Italy` })));
|
|
|
19437
19522
|
eventSubject: 'sessionCompleted',
|
|
19438
19523
|
eventDescription: 'Session completed',
|
|
19439
19524
|
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
|
19440
|
-
|
|
19525
|
+
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 : '',
|
|
19526
|
+
productId: (_r = item === null || item === void 0 ? void 0 : item.product) === null || _r === void 0 ? void 0 : _r.itemId,
|
|
19441
19527
|
position: activeIndex + '',
|
|
19442
19528
|
fromKName: fk || fromKName,
|
|
19443
19529
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
|
19444
|
-
ctatId: (
|
|
19445
|
-
traceInfo: (
|
|
19530
|
+
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 : '',
|
|
19531
|
+
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 : ''
|
|
19446
19532
|
}
|
|
19447
19533
|
});
|
|
19448
|
-
const isPostType = ((
|
|
19534
|
+
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);
|
|
19449
19535
|
if (!popupDetailData) {
|
|
19450
19536
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
19451
19537
|
eventName: 'ExitFeed',
|
|
19452
|
-
product: isPostType ? (
|
|
19538
|
+
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] : [],
|
|
19453
19539
|
rec: item,
|
|
19454
19540
|
position: activeIndex,
|
|
19455
|
-
content_id: isPostType ? (
|
|
19541
|
+
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 : '',
|
|
19456
19542
|
view_time: new Date() - viewTime.current
|
|
19457
19543
|
});
|
|
19458
19544
|
}
|
|
@@ -19512,8 +19598,9 @@ Made in Italy` })));
|
|
|
19512
19598
|
refreshFeSession
|
|
19513
19599
|
]);
|
|
19514
19600
|
const handleSessionExpire = React.useCallback(lodash.debounce(() => {
|
|
19515
|
-
var _a;
|
|
19601
|
+
var _a, _b;
|
|
19516
19602
|
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
|
19603
|
+
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
|
19517
19604
|
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
|
|
19518
19605
|
}, 1000), [handleSessionCompleted, refreshFeSession]);
|
|
19519
19606
|
React.useEffect(() => {
|
|
@@ -19584,18 +19671,18 @@ Made in Italy` })));
|
|
|
19584
19671
|
return null;
|
|
19585
19672
|
}, [globalConfig, activeIndex, visList]);
|
|
19586
19673
|
const renderContent = React.useCallback((rec, index) => {
|
|
19587
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
19674
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
19588
19675
|
if (rec === 'organic menu') {
|
|
19589
19676
|
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)));
|
|
19590
19677
|
}
|
|
19591
|
-
if ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null ||
|
|
19678
|
+
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)) {
|
|
19592
19679
|
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 })));
|
|
19593
19680
|
}
|
|
19594
|
-
if ((
|
|
19595
|
-
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 }));
|
|
19681
|
+
if ((_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.imgUrls) {
|
|
19682
|
+
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 })));
|
|
19596
19683
|
}
|
|
19597
|
-
if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((
|
|
19598
|
-
return (
|
|
19684
|
+
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) {
|
|
19685
|
+
return (_m = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _m === void 0 ? void 0 : _m.map((value, idx) => {
|
|
19599
19686
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
19600
19687
|
const t = resolver[(_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type];
|
|
19601
19688
|
const Component = withBindDataSource(t);
|
|
@@ -19634,7 +19721,7 @@ Made in Italy` })));
|
|
|
19634
19721
|
};
|
|
19635
19722
|
}, [isShowMore]);
|
|
19636
19723
|
const renderBottom = React.useCallback((rec, index) => {
|
|
19637
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
|
19724
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
|
19638
19725
|
if (rec === null || rec === void 0 ? void 0 : rec.video) {
|
|
19639
19726
|
let cta = null;
|
|
19640
19727
|
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) {
|
|
@@ -19643,24 +19730,27 @@ Made in Italy` })));
|
|
|
19643
19730
|
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
|
|
19644
19731
|
cta = '商品CTA';
|
|
19645
19732
|
}
|
|
19733
|
+
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)) {
|
|
19734
|
+
cta = '服务CTA';
|
|
19735
|
+
}
|
|
19646
19736
|
else {
|
|
19647
|
-
cta = (
|
|
19737
|
+
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;
|
|
19648
19738
|
}
|
|
19649
19739
|
const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
|
|
19650
19740
|
const isNineProduct = (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nineProductEnable) &&
|
|
19651
19741
|
index === ((rtcList === null || rtcList === void 0 ? void 0 : rtcList[0]) === 'organic menu' ? 1 : 0) &&
|
|
19652
|
-
((
|
|
19742
|
+
((_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));
|
|
19653
19743
|
return (React.createElement(React.Fragment, null,
|
|
19654
19744
|
isNineProduct && (React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, isNineProduct: isNineProduct })),
|
|
19655
|
-
((
|
|
19656
|
-
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(
|
|
19745
|
+
((_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' }),
|
|
19746
|
+
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` } },
|
|
19657
19747
|
React.createElement(Nudge, { nudge: nudge }),
|
|
19658
19748
|
((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' },
|
|
19659
19749
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, includesCtaType: [] }))) : null,
|
|
19660
19750
|
React.createElement("div", { style: { display: 'flex', flexDirection: 'column' } },
|
|
19661
|
-
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: (
|
|
19751
|
+
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 }),
|
|
19662
19752
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex }),
|
|
19663
|
-
React.createElement(Hashtag$1, { index: activeIndex, tags: (
|
|
19753
|
+
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) }))),
|
|
19664
19754
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex })));
|
|
19665
19755
|
}
|
|
19666
19756
|
return null;
|
|
@@ -19702,7 +19792,7 @@ Made in Italy` })));
|
|
|
19702
19792
|
return null;
|
|
19703
19793
|
}, [globalConfig, waterFallData, bottomHeight]);
|
|
19704
19794
|
const handleViewImageStartEnd = (item) => {
|
|
19705
|
-
var _a, _b, _c, _d, _e, _f;
|
|
19795
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
19706
19796
|
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)) {
|
|
19707
19797
|
const endTime = Date.now();
|
|
19708
19798
|
const duration = viewImageStartTime.current === 0 ? 0 : (endTime - viewImageStartTime.current) / 1000;
|
|
@@ -19711,10 +19801,11 @@ Made in Italy` })));
|
|
|
19711
19801
|
eventSubject: 'viewImageCarouselEnd',
|
|
19712
19802
|
eventDescription: 'User end view the image carousel',
|
|
19713
19803
|
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 : '',
|
|
19714
|
-
|
|
19804
|
+
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 : '',
|
|
19805
|
+
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
|
19715
19806
|
imageEndTime: `${endTime}`,
|
|
19716
19807
|
playDuration: `${duration}`,
|
|
19717
|
-
contentTags: JSON.stringify((
|
|
19808
|
+
contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
|
|
19718
19809
|
position: activeIndex + '',
|
|
19719
19810
|
contentFormat: 'image',
|
|
19720
19811
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo
|
|
@@ -19723,7 +19814,7 @@ Made in Italy` })));
|
|
|
19723
19814
|
}
|
|
19724
19815
|
};
|
|
19725
19816
|
const handleSlideSkip = (item, position) => {
|
|
19726
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
|
19817
|
+
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;
|
|
19727
19818
|
if (isPreview || waterFallData)
|
|
19728
19819
|
return;
|
|
19729
19820
|
const t = new Date() - curTime.current;
|
|
@@ -19749,7 +19840,8 @@ Made in Italy` })));
|
|
|
19749
19840
|
contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
|
|
19750
19841
|
position: position + '',
|
|
19751
19842
|
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 : '',
|
|
19752
|
-
|
|
19843
|
+
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 : '',
|
|
19844
|
+
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 : '',
|
|
19753
19845
|
contentFormat
|
|
19754
19846
|
}
|
|
19755
19847
|
});
|
|
@@ -19759,7 +19851,7 @@ Made in Italy` })));
|
|
|
19759
19851
|
}
|
|
19760
19852
|
};
|
|
19761
19853
|
const handleScrollEvent = (swiper) => {
|
|
19762
|
-
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;
|
|
19854
|
+
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;
|
|
19763
19855
|
const item = data[swiper.previousIndex];
|
|
19764
19856
|
const activeItem = data[swiper.activeIndex];
|
|
19765
19857
|
if (!item)
|
|
@@ -19792,11 +19884,12 @@ Made in Italy` })));
|
|
|
19792
19884
|
eventSubject: 'scrollDown',
|
|
19793
19885
|
eventDescription: 'User scroll down',
|
|
19794
19886
|
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 : '',
|
|
19795
|
-
|
|
19887
|
+
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 : '',
|
|
19888
|
+
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 : '',
|
|
19796
19889
|
requestId: null,
|
|
19797
|
-
traceInfo: (
|
|
19890
|
+
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 : '',
|
|
19798
19891
|
contentFormat,
|
|
19799
|
-
position: ((
|
|
19892
|
+
position: ((_4 = swiper.previousIndex) !== null && _4 !== void 0 ? _4 : 0) + ''
|
|
19800
19893
|
}
|
|
19801
19894
|
});
|
|
19802
19895
|
// 如果上一个商品是图片集,需上报 浏览图片集结结束 事件
|
|
@@ -19809,12 +19902,13 @@ Made in Italy` })));
|
|
|
19809
19902
|
eventInfo: {
|
|
19810
19903
|
eventSubject: 'scrollUp',
|
|
19811
19904
|
eventDescription: 'User scroll up',
|
|
19812
|
-
contentId: (
|
|
19813
|
-
|
|
19905
|
+
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 : '',
|
|
19906
|
+
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 : '',
|
|
19907
|
+
productId: (_11 = (_10 = item.product) === null || _10 === void 0 ? void 0 : _10.itemId) !== null && _11 !== void 0 ? _11 : '',
|
|
19814
19908
|
requestId: null,
|
|
19815
|
-
traceInfo: (
|
|
19909
|
+
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 : '',
|
|
19816
19910
|
contentFormat,
|
|
19817
|
-
position: ((
|
|
19911
|
+
position: ((_16 = swiper.previousIndex) !== null && _16 !== void 0 ? _16 : 0) + ''
|
|
19818
19912
|
}
|
|
19819
19913
|
});
|
|
19820
19914
|
// 如果上一个商品是图片集,需上报 浏览图片集结结束 事件
|
|
@@ -19914,7 +20008,7 @@ Made in Italy` })));
|
|
|
19914
20008
|
};
|
|
19915
20009
|
}, [globalConfig, bffEventReport, data, activeIndex]);
|
|
19916
20010
|
const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
|
|
19917
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
20011
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
19918
20012
|
const item = data[activeIndex];
|
|
19919
20013
|
// 如果是图片集则上报事件
|
|
19920
20014
|
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)) {
|
|
@@ -19925,9 +20019,10 @@ Made in Italy` })));
|
|
|
19925
20019
|
eventSubject: 'viewImageCarouselStart',
|
|
19926
20020
|
eventDescription: 'User start view the image carousel',
|
|
19927
20021
|
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 : '',
|
|
19928
|
-
|
|
20022
|
+
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 : '',
|
|
20023
|
+
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
|
19929
20024
|
imageStartTime: `${startTime}`,
|
|
19930
|
-
contentTags: JSON.stringify((
|
|
20025
|
+
contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
|
|
19931
20026
|
position: activeIndex + '',
|
|
19932
20027
|
contentFormat: 'image',
|
|
19933
20028
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
|
|
@@ -19937,13 +20032,13 @@ Made in Italy` })));
|
|
|
19937
20032
|
if (enableCapi) {
|
|
19938
20033
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
19939
20034
|
eventName: 'ViewContent',
|
|
19940
|
-
product: (
|
|
20035
|
+
product: (_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.bindProducts,
|
|
19941
20036
|
rec: item,
|
|
19942
20037
|
position: activeIndex
|
|
19943
20038
|
});
|
|
19944
20039
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
19945
20040
|
eventName: 'PageView',
|
|
19946
|
-
product: (
|
|
20041
|
+
product: (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.bindProducts,
|
|
19947
20042
|
rec: item,
|
|
19948
20043
|
position: activeIndex
|
|
19949
20044
|
});
|
|
@@ -20041,15 +20136,20 @@ Made in Italy` })));
|
|
|
20041
20136
|
swiperRef.current.swiper.allowTouchMove = true;
|
|
20042
20137
|
}, 500);
|
|
20043
20138
|
}, onActiveIndexChange: (swiper) => {
|
|
20139
|
+
var _a, _b;
|
|
20044
20140
|
setActiveIndex(swiper.activeIndex);
|
|
20045
20141
|
if (openHashtag)
|
|
20046
20142
|
return;
|
|
20047
20143
|
// 处理上滑下滑事件
|
|
20048
20144
|
handleScrollEvent(swiper);
|
|
20049
|
-
if (waterFallData || isEditor
|
|
20145
|
+
if (waterFallData || isEditor)
|
|
20050
20146
|
return;
|
|
20051
20147
|
if ((swiper === null || swiper === void 0 ? void 0 : swiper.activeIndex) + 1 >= (data === null || data === void 0 ? void 0 : data.length)) {
|
|
20052
20148
|
if (!isLoadMore) {
|
|
20149
|
+
if (isDiyH5) {
|
|
20150
|
+
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
|
20151
|
+
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
|
20152
|
+
}
|
|
20053
20153
|
setIsLoadMore(true);
|
|
20054
20154
|
loadVideos === null || loadVideos === void 0 ? void 0 : loadVideos(pageNum).then((res) => {
|
|
20055
20155
|
var _a;
|
|
@@ -20122,7 +20222,7 @@ Made in Italy` })));
|
|
|
20122
20222
|
}, []);
|
|
20123
20223
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
|
20124
20224
|
const handlePlaying = React.useCallback(() => {
|
|
20125
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
20225
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
20126
20226
|
setIsPauseVideo(false);
|
|
20127
20227
|
const item = data[index];
|
|
20128
20228
|
if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
|
|
@@ -20135,14 +20235,15 @@ Made in Italy` })));
|
|
|
20135
20235
|
eventSubject: 'playVideo',
|
|
20136
20236
|
eventDescription: 'User played the video',
|
|
20137
20237
|
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 : '',
|
|
20138
|
-
|
|
20238
|
+
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 : '',
|
|
20239
|
+
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 : '',
|
|
20139
20240
|
playType,
|
|
20140
20241
|
startTime: videoCurrentTime,
|
|
20141
20242
|
videoDuration,
|
|
20142
|
-
contentTags: JSON.stringify((
|
|
20243
|
+
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 : []),
|
|
20143
20244
|
position: index + '',
|
|
20144
20245
|
contentFormat: 'video',
|
|
20145
|
-
traceInfo: (
|
|
20246
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
20146
20247
|
}
|
|
20147
20248
|
});
|
|
20148
20249
|
setIsFirstPlay(false);
|
|
@@ -20181,7 +20282,7 @@ Made in Italy` })));
|
|
|
20181
20282
|
}
|
|
20182
20283
|
}, [isLoadFinish]);
|
|
20183
20284
|
const onPause = React.useCallback(() => {
|
|
20184
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
20285
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
20185
20286
|
const item = data[index];
|
|
20186
20287
|
const videoDuration = ((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
|
|
20187
20288
|
const videoCurrentTime = ((_d = (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
|
|
@@ -20192,14 +20293,15 @@ Made in Italy` })));
|
|
|
20192
20293
|
eventSubject: 'playOverVideo',
|
|
20193
20294
|
eventDescription: 'User finished playing the video',
|
|
20194
20295
|
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 : '',
|
|
20195
|
-
|
|
20296
|
+
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 : '',
|
|
20297
|
+
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 : '',
|
|
20196
20298
|
endTime: videoCurrentTime,
|
|
20197
20299
|
videoDuration,
|
|
20198
20300
|
playDuration,
|
|
20199
|
-
contentTags: JSON.stringify((
|
|
20301
|
+
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 : []),
|
|
20200
20302
|
position: index + '',
|
|
20201
20303
|
contentFormat: 'video',
|
|
20202
|
-
traceInfo: (
|
|
20304
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
20203
20305
|
}
|
|
20204
20306
|
});
|
|
20205
20307
|
}
|