pb-sxp-ui 1.17.1 → 1.18.1
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 +223 -163
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +223 -163
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +6 -6
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +6 -6
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +223 -163
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +6 -6
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/DiyPortalPreview/VideoWidget.js +10 -8
- package/es/core/components/SxpPageRender/LikeButton/index.js +18 -16
- 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 +32 -45
- package/es/core/components/SxpPageRender/WaterFall/index.js +4 -3
- package/es/core/components/SxpPageRender/index.js +53 -37
- package/es/core/context/SxpDataSourceProvider.d.ts +5 -12
- package/es/core/context/SxpDataSourceProvider.js +62 -35
- 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 +18 -16
- 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 +32 -45
- package/lib/core/components/SxpPageRender/WaterFall/index.js +4 -3
- package/lib/core/components/SxpPageRender/index.js +53 -37
- package/lib/core/context/SxpDataSourceProvider.d.ts +5 -12
- package/lib/core/context/SxpDataSourceProvider.js +62 -35
- package/lib/core/hooks/useEventReport.js +6 -5
- package/package.json +1 -1
package/dist/pb-ui.js
CHANGED
@@ -637,6 +637,7 @@
|
|
637
637
|
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 }) => {
|
638
638
|
var _a, _b, _c, _d, _e;
|
639
639
|
const [rtcList, setRtcList] = React.useState([]);
|
640
|
+
const [firstRtcList, setFirstRtcList] = React.useState([]);
|
640
641
|
const [tagList, setTagList] = React.useState([]);
|
641
642
|
const [loading, setLoading] = React.useState(true);
|
642
643
|
const [curReqInfo, setCurReqInfo] = React.useState({ rtc: '', requestId: '' });
|
@@ -668,6 +669,10 @@
|
|
668
669
|
const [chatlabsId, setChatlabsId] = React.useState();
|
669
670
|
const finalPageData = React.useMemo(() => pageData !== null && pageData !== void 0 ? pageData : data, [pageData, data]);
|
670
671
|
const pixelPvStatusRef = React.useRef(false);
|
672
|
+
const isDiyPage = React.useMemo(() => {
|
673
|
+
var _a, _b, _c;
|
674
|
+
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);
|
675
|
+
}, [isDiyH5, finalPageData]);
|
671
676
|
const isShowConsent = React.useMemo(() => {
|
672
677
|
var _a, _b, _c, _d;
|
673
678
|
return (((((_d = (_c = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consent) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item) === null || _c === void 0 ? void 0 : _c.props) === null || _d === void 0 ? void 0 : _d.privacy_necessity) && !isAgreePolicy && !isEditor) || isOpenConsent) &&
|
@@ -730,7 +735,7 @@
|
|
730
735
|
}, [bffDataSource]);
|
731
736
|
// bff API 请求方法
|
732
737
|
const bffFetch = React.useCallback((path, options, isBota = true) => {
|
733
|
-
var _a;
|
738
|
+
var _a, _b;
|
734
739
|
if (!bffDataSource)
|
735
740
|
return;
|
736
741
|
const url = bffDataSource.url;
|
@@ -743,8 +748,9 @@
|
|
743
748
|
val.split('=')[0];
|
744
749
|
val.split('=')[1];
|
745
750
|
});
|
751
|
+
options.body = Object.assign(Object.assign({}, options.body), { productUserId: fakeUserId });
|
746
752
|
return window
|
747
|
-
.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
|
753
|
+
.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
|
748
754
|
? JSON.stringify({
|
749
755
|
body: btoa(encodeURIComponent(JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))))
|
750
756
|
})
|
@@ -984,8 +990,8 @@
|
|
984
990
|
}, [bffDataSource]);
|
985
991
|
// 获取推荐视频数据
|
986
992
|
const getRecommendVideos = React.useCallback((query) => __awaiter(void 0, void 0, void 0, function* () {
|
987
|
-
var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
|
988
|
-
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 })), (
|
993
|
+
var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
994
|
+
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' }));
|
989
995
|
if (channel) {
|
990
996
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(channel) });
|
991
997
|
}
|
@@ -998,9 +1004,10 @@
|
|
998
1004
|
if (val)
|
999
1005
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
|
1000
1006
|
}
|
1007
|
+
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);
|
1001
1008
|
if (isEditor) {
|
1002
1009
|
let pageNum = 1;
|
1003
|
-
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] }));
|
1010
|
+
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 }));
|
1004
1011
|
if (!(query === null || query === void 0 ? void 0 : query.channel) || isInit.current) {
|
1005
1012
|
return undefined;
|
1006
1013
|
}
|
@@ -1008,19 +1015,22 @@
|
|
1008
1015
|
let list = [];
|
1009
1016
|
let result = null;
|
1010
1017
|
const recurveRecList = (query) => __awaiter(void 0, void 0, void 0, function* () {
|
1011
|
-
var
|
1018
|
+
var _y, _z, _0, _1, _2, _3;
|
1012
1019
|
query.pageNum = pageNum;
|
1013
|
-
result = yield (
|
1020
|
+
result = isDiyH5 ? yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v3/recommend/direct/page/view', { method: 'POST', body: query })) : yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('recommend/direct_page', { method: 'POST', body: query }));
|
1014
1021
|
if (!(result === null || result === void 0 ? void 0 : result.success)) {
|
1015
1022
|
return undefined;
|
1016
1023
|
}
|
1017
1024
|
setLoading(false);
|
1018
|
-
list = list.concat((
|
1025
|
+
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 : []);
|
1019
1026
|
if ((rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) === 0) {
|
1020
1027
|
setRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
1021
1028
|
setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
1029
|
+
if (isDiyPage) {
|
1030
|
+
setFirstRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
1031
|
+
}
|
1022
1032
|
}
|
1023
|
-
const isNotNullList = (
|
1033
|
+
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));
|
1024
1034
|
if (isNotNullList) {
|
1025
1035
|
pageNum = pageNum + 1;
|
1026
1036
|
yield recurveRecList(query);
|
@@ -1028,13 +1038,13 @@
|
|
1028
1038
|
});
|
1029
1039
|
yield recurveRecList(query);
|
1030
1040
|
if (!(query === null || query === void 0 ? void 0 : query.hashTag) && result)
|
1031
|
-
setCurReqInfo({ rtc: (
|
1041
|
+
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 });
|
1032
1042
|
return Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list });
|
1033
1043
|
}
|
1034
1044
|
if (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) {
|
1035
|
-
query = Object.assign(Object.assign({}, query), { directPage: true, level: 1, pageNum: (
|
1045
|
+
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 }));
|
1036
1046
|
}
|
1037
|
-
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/list', {
|
1047
|
+
const result = isDiy ? yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v3/recommend/direct/page/view', { method: 'POST', body: query })) : yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/list', {
|
1038
1048
|
method: 'POST',
|
1039
1049
|
body: query
|
1040
1050
|
}));
|
@@ -1044,26 +1054,31 @@
|
|
1044
1054
|
if (!(query === null || query === void 0 ? void 0 : query.hashTag))
|
1045
1055
|
setCurReqInfo({ rtc: result.data.rtc, requestId: result.data.requestId });
|
1046
1056
|
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) && !isEditor) {
|
1047
|
-
const isNotNullList = (
|
1057
|
+
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));
|
1048
1058
|
if (!isNotNullList) {
|
1049
1059
|
setIsNoMoreData(true);
|
1050
1060
|
}
|
1051
1061
|
}
|
1052
1062
|
let list = [];
|
1053
|
-
list = list.concat((
|
1063
|
+
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 : []);
|
1054
1064
|
return Object.assign(Object.assign({}, result.data), { recList: list });
|
1055
|
-
}), [bffFetch, utmVal, maxSize, defaultSize, channelQueryList, channel, chatlabsId, bffFetchAdmin]);
|
1065
|
+
}), [bffFetch, utmVal, maxSize, defaultSize, channelQueryList, channel, chatlabsId, bffFetchAdmin, isDiyPage, finalPageData, isDiyH5]);
|
1056
1066
|
const loadVideos = React.useCallback((pageNum) => __awaiter(void 0, void 0, void 0, function* () {
|
1057
|
-
var
|
1067
|
+
var _4, _5, _6, _7;
|
1058
1068
|
if (rtcList.length <= 0) {
|
1059
1069
|
return;
|
1060
1070
|
}
|
1071
|
+
if (isDiyPage && (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) > 0) {
|
1072
|
+
setRtcList(rtcList.concat(firstRtcList));
|
1073
|
+
setCacheRtcList(cacheRtcList.concat(firstRtcList));
|
1074
|
+
return;
|
1075
|
+
}
|
1061
1076
|
const lastItem = rtcList === null || rtcList === void 0 ? void 0 : rtcList[(rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) - 1];
|
1062
|
-
const data = yield getRecommendVideos(Object.assign(Object.assign(Object.assign(Object.assign({ hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag }, (((
|
1077
|
+
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 })));
|
1063
1078
|
setRtcList(rtcList.concat(getFilterRecList(data)));
|
1064
1079
|
setCacheRtcList(cacheRtcList.concat(getFilterRecList(data)));
|
1065
1080
|
return data;
|
1066
|
-
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
|
1081
|
+
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList, isDiyPage, firstRtcList]);
|
1067
1082
|
const refreshFeSession = React.useCallback((enableReSid, event) => {
|
1068
1083
|
var _a, _b, _c, _d, _e;
|
1069
1084
|
let expire = false;
|
@@ -1094,8 +1109,8 @@
|
|
1094
1109
|
// 用户信息都是公共的
|
1095
1110
|
if (!userInfo) {
|
1096
1111
|
userInfo = {
|
1097
|
-
|
1098
|
-
|
1112
|
+
productUserId: fakeUserId // 后端逻辑会从请求头获取,所以不需要传
|
1113
|
+
// tpChannelId: 'H5' // 后端处理
|
1099
1114
|
};
|
1100
1115
|
}
|
1101
1116
|
const sessionID = storeAndLoadFeSessionId();
|
@@ -1129,7 +1144,8 @@
|
|
1129
1144
|
layoutVariantId,
|
1130
1145
|
globalConfig,
|
1131
1146
|
playbookType,
|
1132
|
-
bffDataSource
|
1147
|
+
bffDataSource,
|
1148
|
+
fakeUserId
|
1133
1149
|
]);
|
1134
1150
|
const getEventParamsByJson = React.useCallback((json, product) => {
|
1135
1151
|
var _a, _b, _c;
|
@@ -1262,38 +1278,40 @@
|
|
1262
1278
|
}
|
1263
1279
|
}, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig, bffDataSource, getEventParamsByJson]);
|
1264
1280
|
const bffMutateLike = React.useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
1281
|
+
body = Object.assign(Object.assign({}, body), { productUserId: fakeUserId });
|
1265
1282
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/like', { method: 'POST', body }));
|
1266
1283
|
return res === null || res === void 0 ? void 0 : res.success;
|
1267
|
-
}), [bffFetch]);
|
1284
|
+
}), [bffFetch, fakeUserId]);
|
1268
1285
|
const bffMutateUnlike = React.useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
1286
|
+
body = Object.assign(Object.assign({}, body), { productUserId: fakeUserId });
|
1269
1287
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/unlike', { method: 'POST', body }));
|
1270
1288
|
return res === null || res === void 0 ? void 0 : res.success;
|
1271
|
-
}), [bffFetch]);
|
1289
|
+
}), [bffFetch, fakeUserId]);
|
1272
1290
|
const bffSubmitForm = React.useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
1273
1291
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/customform', { method: 'POST', body }));
|
1274
1292
|
return res === null || res === void 0 ? void 0 : res.success;
|
1275
1293
|
}), [bffFetch]);
|
1276
1294
|
// 获取 Tag
|
1277
1295
|
const bffGetTagList = React.useCallback((data) => __awaiter(void 0, void 0, void 0, function* () {
|
1278
|
-
var
|
1279
|
-
const isShowTag = !!((
|
1296
|
+
var _8, _9, _10, _11, _12, _13, _14, _15;
|
1297
|
+
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);
|
1280
1298
|
if (!utmVal || !isShowTag)
|
1281
1299
|
return;
|
1282
1300
|
try {
|
1283
|
-
const val = (
|
1301
|
+
const val = (_13 = (_12 = (_11 = splitUrlParams(utmVal)) === null || _11 === void 0 ? void 0 : _11.filter((val) => {
|
1284
1302
|
var _a, _b;
|
1285
1303
|
const key = val.split('=')[0];
|
1286
1304
|
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);
|
1287
|
-
})) === null ||
|
1305
|
+
})) === null || _12 === void 0 ? void 0 : _12.join('&')) !== null && _13 !== void 0 ? _13 : '';
|
1288
1306
|
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
|
1289
|
-
setTagList((
|
1307
|
+
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 : []);
|
1290
1308
|
}
|
1291
1309
|
catch (e) {
|
1292
1310
|
console.log('e', e);
|
1293
1311
|
}
|
1294
1312
|
}), [bffFetch, utmVal]);
|
1295
1313
|
const ctaEvent = React.useCallback((eventInfo, rec, product, position) => {
|
1296
|
-
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;
|
1314
|
+
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;
|
1297
1315
|
const cta = product === null || product === void 0 ? void 0 : product.bindCta;
|
1298
1316
|
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);
|
1299
1317
|
let fromKName = '';
|
@@ -1311,7 +1329,7 @@
|
|
1311
1329
|
}
|
1312
1330
|
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;
|
1313
1331
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
1314
|
-
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: (
|
1332
|
+
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 })
|
1315
1333
|
});
|
1316
1334
|
}, [bffEventReport, isFromHashtag]);
|
1317
1335
|
const h5EnterLink = React.useCallback(() => {
|
@@ -1346,10 +1364,10 @@
|
|
1346
1364
|
});
|
1347
1365
|
}, [bffEventReport]);
|
1348
1366
|
const getAccount = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
1349
|
-
var
|
1367
|
+
var _16, _17;
|
1350
1368
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/account', { method: 'GET' }));
|
1351
|
-
setChatlabsId((
|
1352
|
-
return ((
|
1369
|
+
setChatlabsId((_16 = res === null || res === void 0 ? void 0 : res.data) === null || _16 === void 0 ? void 0 : _16.chatLabsId);
|
1370
|
+
return ((_17 = res === null || res === void 0 ? void 0 : res.data) === null || _17 === void 0 ? void 0 : _17.consentResult) === 'true';
|
1353
1371
|
}), [bffFetch]);
|
1354
1372
|
const accountSonsent = React.useCallback((consentResult) => __awaiter(void 0, void 0, void 0, function* () {
|
1355
1373
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/account/consent', {
|
@@ -1413,6 +1431,9 @@
|
|
1413
1431
|
}
|
1414
1432
|
setRtcList(list);
|
1415
1433
|
setCacheRtcList(list);
|
1434
|
+
if (isDiyPage) {
|
1435
|
+
setFirstRtcList(list);
|
1436
|
+
}
|
1416
1437
|
bffGetTagList(curData !== null && curData !== void 0 ? curData : finalPageData);
|
1417
1438
|
if (channel) {
|
1418
1439
|
const item = list === null || list === void 0 ? void 0 : list[0];
|
@@ -1432,7 +1453,7 @@
|
|
1432
1453
|
});
|
1433
1454
|
setLoading(false);
|
1434
1455
|
});
|
1435
|
-
}, [isShowConsent, channel]);
|
1456
|
+
}, [isShowConsent, channel, isDiyPage]);
|
1436
1457
|
// cms预览
|
1437
1458
|
React.useEffect(() => {
|
1438
1459
|
if (!isPreview)
|
@@ -1448,12 +1469,15 @@
|
|
1448
1469
|
}
|
1449
1470
|
setRtcList(list);
|
1450
1471
|
setCacheRtcList(list);
|
1472
|
+
if (isDiyPage) {
|
1473
|
+
setFirstRtcList(list);
|
1474
|
+
}
|
1451
1475
|
}
|
1452
1476
|
})
|
1453
1477
|
.finally(() => {
|
1454
1478
|
setLoading(false);
|
1455
1479
|
});
|
1456
|
-
}, [getRecommendVideos, bffGetTagList, channel]);
|
1480
|
+
}, [getRecommendVideos, bffGetTagList, channel, isDiyPage]);
|
1457
1481
|
const defaultLoadingImage = useIconLink('/pb_static/a65d23c5893c49d7aaaa81681d3179e2.gif', appDomain);
|
1458
1482
|
return (React.createElement(SxpDataSourceContext.Provider, { value: {
|
1459
1483
|
rtcList,
|
@@ -1511,7 +1535,8 @@
|
|
1511
1535
|
refreshFeSession,
|
1512
1536
|
getAccount,
|
1513
1537
|
accountSonsent,
|
1514
|
-
isDiyH5
|
1538
|
+
isDiyH5: isDiyPage,
|
1539
|
+
firstRtcList
|
1515
1540
|
} }, 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({
|
1516
1541
|
rtcList,
|
1517
1542
|
mutateLike: bffMutateLike,
|
@@ -1972,14 +1997,14 @@
|
|
1972
1997
|
* @Author: binruan@chatlabs.com
|
1973
1998
|
* @Date: 2024-03-12 10:59:06
|
1974
1999
|
* @LastEditors: binruan@chatlabs.com
|
1975
|
-
* @LastEditTime:
|
2000
|
+
* @LastEditTime: 2025-05-09 15:30:59
|
1976
2001
|
* @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
|
1977
2002
|
*
|
1978
2003
|
*/
|
1979
2004
|
function useEventReport() {
|
1980
2005
|
const { bffEventReport, popupDetailData, isFromHashtag, eventTimeList, setEventTimeList } = useSxpDataSource();
|
1981
2006
|
const jumpToWeb = React.useCallback((e, data, product, cta, position, traceInfo) => {
|
1982
|
-
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;
|
2007
|
+
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;
|
1983
2008
|
const i = eventTimeList === null || eventTimeList === void 0 ? void 0 : eventTimeList.findIndex((item) => item.target === (e === null || e === void 0 ? void 0 : e.target));
|
1984
2009
|
if (i !== -1) {
|
1985
2010
|
return;
|
@@ -2012,11 +2037,11 @@
|
|
2012
2037
|
contentFormat = 'image';
|
2013
2038
|
}
|
2014
2039
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
2015
|
-
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 : '',
|
2040
|
+
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 }))
|
2016
2041
|
});
|
2017
2042
|
}, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
|
2018
2043
|
const productView = React.useCallback((data, product, cta, viewTime, position) => {
|
2019
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
2044
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
2020
2045
|
let fromKName = '';
|
2021
2046
|
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))) {
|
2022
2047
|
fromKName = 'pdpPage';
|
@@ -2035,8 +2060,9 @@
|
|
2035
2060
|
contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags),
|
2036
2061
|
position: position + '',
|
2037
2062
|
contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
2063
|
+
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 : '',
|
2038
2064
|
ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
|
2039
|
-
traceInfo: (
|
2065
|
+
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 : '',
|
2040
2066
|
timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
|
2041
2067
|
eventSubject: 'productView',
|
2042
2068
|
eventDescription: 'User browsed the product'
|
@@ -15851,7 +15877,7 @@ Made in Italy` })));
|
|
15851
15877
|
* @Author: binruan@chatlabs.com
|
15852
15878
|
* @Date: 2024-01-10 10:58:24
|
15853
15879
|
* @LastEditors: binruan@chatlabs.com
|
15854
|
-
* @LastEditTime: 2025-
|
15880
|
+
* @LastEditTime: 2025-05-09 15:30:41
|
15855
15881
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\WaterFall\index.tsx
|
15856
15882
|
*
|
15857
15883
|
*/
|
@@ -15889,7 +15915,7 @@ Made in Italy` })));
|
|
15889
15915
|
}
|
15890
15916
|
}, [waterFallData]);
|
15891
15917
|
const reportTagsView = React.useCallback(() => {
|
15892
|
-
var _a, _b, _c, _d, _e, _f;
|
15918
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
15893
15919
|
const rec = recData === null || recData === void 0 ? void 0 : recData.rec;
|
15894
15920
|
if (!rec)
|
15895
15921
|
return;
|
@@ -15909,9 +15935,10 @@ Made in Italy` })));
|
|
15909
15935
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
15910
15936
|
eventInfo: {
|
15911
15937
|
contentId: (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
15938
|
+
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 : '',
|
15912
15939
|
position: cacheActiveIndex + '',
|
15913
|
-
contentTags: JSON.stringify((
|
15914
|
-
traceInfo: (
|
15940
|
+
contentTags: JSON.stringify((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.tags),
|
15941
|
+
traceInfo: (_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.traceInfo,
|
15915
15942
|
hashTags: JSON.stringify([recData === null || recData === void 0 ? void 0 : recData.hashTag]),
|
15916
15943
|
fromKName,
|
15917
15944
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
@@ -17993,21 +18020,22 @@ Made in Italy` })));
|
|
17993
18020
|
const likeIcon = useIconLink(defaultLikeIconPath$2);
|
17994
18021
|
const unlikeIcon = useIconLink(defaultUnLikeIconPath$2);
|
17995
18022
|
const handleClick = lodash.debounce(() => __awaiter(void 0, void 0, void 0, function* () {
|
17996
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
|
18023
|
+
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;
|
17997
18024
|
if (state) {
|
17998
18025
|
// 先设置状态
|
17999
18026
|
setState(false);
|
18000
|
-
const result = (_e = (yield (mutateUnlike === null || mutateUnlike === void 0 ? void 0 : mutateUnlike({
|
18027
|
+
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;
|
18001
18028
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
18002
18029
|
eventInfo: {
|
18003
18030
|
eventSubject: 'favoriteContentCanceled',
|
18004
18031
|
eventDescription: 'This content was unfavorite by the user',
|
18005
18032
|
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 : '',
|
18006
|
-
|
18007
|
-
|
18033
|
+
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 : '',
|
18034
|
+
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 : '',
|
18035
|
+
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 : []),
|
18008
18036
|
position: position + '',
|
18009
|
-
contentFormat: ((
|
18010
|
-
traceInfo: (
|
18037
|
+
contentFormat: ((_q = recData === null || recData === void 0 ? void 0 : recData.video) === null || _q === void 0 ? void 0 : _q.url) ? 'video' : 'image',
|
18038
|
+
traceInfo: (_r = recData === null || recData === void 0 ? void 0 : recData.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
18011
18039
|
}
|
18012
18040
|
});
|
18013
18041
|
// 如果接口调用失败,则回滚状态
|
@@ -18015,40 +18043,41 @@ Made in Italy` })));
|
|
18015
18043
|
setState(true);
|
18016
18044
|
}
|
18017
18045
|
else {
|
18018
|
-
const nRtcList = (
|
18046
|
+
const nRtcList = (_s = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
18019
18047
|
if (index === position) {
|
18020
18048
|
item.isCollected = false;
|
18021
18049
|
}
|
18022
18050
|
return item;
|
18023
|
-
})) !== null &&
|
18051
|
+
})) !== null && _s !== void 0 ? _s : [];
|
18024
18052
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
18025
18053
|
}
|
18026
18054
|
}
|
18027
18055
|
else {
|
18028
18056
|
setState(true);
|
18029
|
-
const result = (
|
18057
|
+
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;
|
18030
18058
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
18031
18059
|
eventInfo: {
|
18032
18060
|
eventSubject: 'favoriteContent',
|
18033
18061
|
eventDescription: 'This content was favorite by the user',
|
18034
|
-
contentId: (
|
18035
|
-
|
18036
|
-
|
18062
|
+
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 : '',
|
18063
|
+
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 : '',
|
18064
|
+
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 : '',
|
18065
|
+
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 : []),
|
18037
18066
|
position: position + '',
|
18038
|
-
contentFormat: ((
|
18039
|
-
traceInfo: (
|
18067
|
+
contentFormat: ((_5 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _5 === void 0 ? void 0 : _5.url) ? 'video' : 'image',
|
18068
|
+
traceInfo: (_6 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _6 === void 0 ? void 0 : _6.traceInfo
|
18040
18069
|
}
|
18041
18070
|
});
|
18042
18071
|
if (!result) {
|
18043
18072
|
setState(false);
|
18044
18073
|
}
|
18045
18074
|
else {
|
18046
|
-
const nRtcList = (
|
18075
|
+
const nRtcList = (_7 = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
18047
18076
|
if (index === position) {
|
18048
18077
|
item.isCollected = true;
|
18049
18078
|
}
|
18050
18079
|
return item;
|
18051
|
-
})) !== null &&
|
18080
|
+
})) !== null && _7 !== void 0 ? _7 : [];
|
18052
18081
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
18053
18082
|
}
|
18054
18083
|
}
|
@@ -18085,7 +18114,7 @@ Made in Italy` })));
|
|
18085
18114
|
const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activeIndex, videoPostConfig, videoPlayIcon, loopPlay, swiperRef }, ref) => {
|
18086
18115
|
var _a, _b;
|
18087
18116
|
const [isPauseVideo, setIsPauseVideo] = React.useState(false);
|
18088
|
-
const { bffEventReport, sxpParameter,
|
18117
|
+
const { bffEventReport, sxpParameter, firstRtcList, openHashtag, bffFbReport, isDiyH5 } = useSxpDataSource();
|
18089
18118
|
const videoStartTime = React.useRef(0);
|
18090
18119
|
const [isLoadFinish, setIsLoadFinish] = React.useState(false);
|
18091
18120
|
const { isActive } = useSwiperSlide();
|
@@ -18151,6 +18180,23 @@ Made in Italy` })));
|
|
18151
18180
|
return;
|
18152
18181
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
18153
18182
|
}, [videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
18183
|
+
const handleEnd = () => {
|
18184
|
+
var _a, _b, _c, _d, _e, _f;
|
18185
|
+
if (!videoRef.current)
|
18186
|
+
return;
|
18187
|
+
if (isDiyH5) {
|
18188
|
+
(_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
|
18189
|
+
if (!loopPlayRef.current)
|
18190
|
+
return;
|
18191
|
+
if (firstRtcList && index < (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) - 1) {
|
18192
|
+
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;
|
18193
|
+
(_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);
|
18194
|
+
}
|
18195
|
+
}
|
18196
|
+
else {
|
18197
|
+
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.play();
|
18198
|
+
}
|
18199
|
+
};
|
18154
18200
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
18155
18201
|
const handlePlaying = React.useCallback(() => {
|
18156
18202
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
@@ -18159,7 +18205,7 @@ Made in Italy` })));
|
|
18159
18205
|
setIsLoadFinish(true);
|
18160
18206
|
}, []);
|
18161
18207
|
const handleStartPlay = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
18162
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
18208
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
18163
18209
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
18164
18210
|
return;
|
18165
18211
|
setIsPauseVideo(false);
|
@@ -18170,16 +18216,11 @@ Made in Italy` })));
|
|
18170
18216
|
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);
|
18171
18217
|
const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
|
18172
18218
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
18173
|
-
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 : '',
|
18219
|
+
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) + '' }))
|
18174
18220
|
});
|
18175
18221
|
isFirstPlayRef.current = false;
|
18176
18222
|
}
|
18177
18223
|
}), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
18178
|
-
const setCurrentTimeByStartTime = React.useCallback(() => {
|
18179
|
-
if (isDiyH5) {
|
18180
|
-
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
18181
|
-
}
|
18182
|
-
}, []);
|
18183
18224
|
const handLoadeddata = React.useCallback(() => {
|
18184
18225
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
|
18185
18226
|
return;
|
@@ -18204,13 +18245,12 @@ Made in Italy` })));
|
|
18204
18245
|
const handleLoadedmetadata = React.useCallback(() => {
|
18205
18246
|
if (!videoRef.current)
|
18206
18247
|
return;
|
18207
|
-
setCurrentTimeByStartTime();
|
18208
18248
|
loadedTimeRef.current = new Date();
|
18209
18249
|
handleStartPlay();
|
18210
18250
|
handLoadeddata();
|
18211
18251
|
}, [videoRef.current, handLoadeddata, handleStartPlay]);
|
18212
18252
|
const handleClickVideo = React.useCallback((type) => () => {
|
18213
|
-
var _a, _b, _c, _d, _e
|
18253
|
+
var _a, _b, _c, _d, _e;
|
18214
18254
|
if (!videoRef.current)
|
18215
18255
|
return;
|
18216
18256
|
if (!isLoadFinish)
|
@@ -18231,20 +18271,17 @@ Made in Italy` })));
|
|
18231
18271
|
break;
|
18232
18272
|
default:
|
18233
18273
|
if (isPause) {
|
18234
|
-
|
18235
|
-
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
18236
|
-
}
|
18237
|
-
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
|
18274
|
+
(_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.play();
|
18238
18275
|
}
|
18239
18276
|
else {
|
18240
|
-
(
|
18277
|
+
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.pause();
|
18241
18278
|
}
|
18242
18279
|
setIsPauseVideo(!isPause);
|
18243
18280
|
break;
|
18244
18281
|
}
|
18245
18282
|
}, [isLoadFinish, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
18246
18283
|
const handlePause = React.useCallback(() => {
|
18247
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
18284
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
18248
18285
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
18249
18286
|
return;
|
18250
18287
|
if (activeIndex !== index)
|
@@ -18260,14 +18297,15 @@ Made in Italy` })));
|
|
18260
18297
|
eventSubject: 'playOverVideo',
|
18261
18298
|
eventDescription: 'User finished playing the video',
|
18262
18299
|
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 : '',
|
18263
|
-
|
18300
|
+
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 : '',
|
18301
|
+
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 : '',
|
18264
18302
|
endTime: videoCurrentTime,
|
18265
18303
|
videoDuration,
|
18266
18304
|
playDuration,
|
18267
|
-
contentTags: JSON.stringify((
|
18305
|
+
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 : []),
|
18268
18306
|
position: index + '',
|
18269
18307
|
contentFormat: 'video',
|
18270
|
-
traceInfo: (
|
18308
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
18271
18309
|
}
|
18272
18310
|
});
|
18273
18311
|
}
|
@@ -18275,27 +18313,8 @@ Made in Italy` })));
|
|
18275
18313
|
const handleWaiting = React.useCallback(() => {
|
18276
18314
|
setWaiting(true);
|
18277
18315
|
}, []);
|
18278
|
-
const handleTimeUpload = () => {
|
18279
|
-
if (!videoRef.current || !isDiyH5)
|
18280
|
-
return;
|
18281
|
-
setTimeout(() => {
|
18282
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
18283
|
-
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)) {
|
18284
|
-
(_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
|
18285
|
-
if (!loopPlayRef.current)
|
18286
|
-
return;
|
18287
|
-
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
18288
|
-
(_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);
|
18289
|
-
}
|
18290
|
-
else {
|
18291
|
-
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;
|
18292
|
-
(_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);
|
18293
|
-
}
|
18294
|
-
}
|
18295
|
-
});
|
18296
|
-
};
|
18297
18316
|
React.useEffect(() => {
|
18298
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
18317
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
18299
18318
|
if (!isActive)
|
18300
18319
|
return;
|
18301
18320
|
const videoSrc = videoUrl;
|
@@ -18316,7 +18335,6 @@ Made in Italy` })));
|
|
18316
18335
|
hls === null || hls === void 0 ? void 0 : hls.attachMedia(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current);
|
18317
18336
|
hls === null || hls === void 0 ? void 0 : hls.on(Hls.Events.MANIFEST_PARSED, function () {
|
18318
18337
|
var _a;
|
18319
|
-
setCurrentTimeByStartTime();
|
18320
18338
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
18321
18339
|
});
|
18322
18340
|
}
|
@@ -18330,12 +18348,11 @@ Made in Italy` })));
|
|
18330
18348
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.addEventListener('play', handleStartPlay);
|
18331
18349
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.addEventListener('playing', handlePlaying);
|
18332
18350
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.addEventListener('pause', handlePause);
|
18333
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended',
|
18351
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handleEnd);
|
18334
18352
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.addEventListener('canplay', handlePlay);
|
18335
18353
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
|
18336
|
-
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.addEventListener('timeupdate', handleTimeUpload);
|
18337
18354
|
return () => {
|
18338
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
18355
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
18339
18356
|
const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
|
18340
18357
|
if (!isPause)
|
18341
18358
|
handlePause();
|
@@ -18347,10 +18364,9 @@ Made in Italy` })));
|
|
18347
18364
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.removeEventListener('play', handleStartPlay);
|
18348
18365
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.removeEventListener('playing', handlePlaying);
|
18349
18366
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.removeEventListener('pause', handlePause);
|
18350
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended',
|
18367
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handleEnd);
|
18351
18368
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('canplay', handlePlay);
|
18352
18369
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.removeEventListener('waiting', handleWaiting);
|
18353
|
-
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.removeEventListener('timeupdate', handleTimeUpload);
|
18354
18370
|
};
|
18355
18371
|
}, [isActive]);
|
18356
18372
|
React.useEffect(() => {
|
@@ -18561,19 +18577,45 @@ Made in Italy` })));
|
|
18561
18577
|
}, onLoad: onShowFirstImage }))));
|
18562
18578
|
};
|
18563
18579
|
|
18564
|
-
const PictureGroup$4 = ({ imgUrls,
|
18580
|
+
const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig, swiperRef }, ref) => {
|
18565
18581
|
var _a, _b;
|
18566
18582
|
const { isActive } = useSwiperSlide();
|
18567
|
-
const {
|
18583
|
+
const { firstRtcList, openHashtag, isDiyH5 } = useSxpDataSource();
|
18568
18584
|
const [isLoad, setIsLoad] = React.useState(false);
|
18569
18585
|
const [imgInfo, setImgInfo] = React.useState();
|
18570
18586
|
const [swiperActiveIndex, setSwiperActiveIndex] = React.useState(0);
|
18571
|
-
const
|
18587
|
+
const imgsSwiperRef = React.useRef();
|
18572
18588
|
const isFirstPlayRef = React.useRef(true);
|
18589
|
+
const loopPlayRef = React.useRef(true);
|
18573
18590
|
const initTime = new Date();
|
18591
|
+
React.useImperativeHandle(ref, () => {
|
18592
|
+
return {
|
18593
|
+
setLoopPlay(v) {
|
18594
|
+
loopPlayRef.current = v;
|
18595
|
+
}
|
18596
|
+
};
|
18597
|
+
});
|
18598
|
+
React.useEffect(() => {
|
18599
|
+
let timerId;
|
18600
|
+
if (isLoad && isActive && isDiyH5) {
|
18601
|
+
timerId = setTimeout(() => {
|
18602
|
+
var _a, _b, _c, _d;
|
18603
|
+
if (!loopPlayRef.current)
|
18604
|
+
return;
|
18605
|
+
if (firstRtcList && index < (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) - 1) {
|
18606
|
+
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;
|
18607
|
+
(_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);
|
18608
|
+
}
|
18609
|
+
}, 3000);
|
18610
|
+
}
|
18611
|
+
return () => {
|
18612
|
+
if (timerId)
|
18613
|
+
clearTimeout(timerId);
|
18614
|
+
};
|
18615
|
+
}, [isLoad, isActive, isDiyH5, index, swiperRef, firstRtcList]);
|
18574
18616
|
React.useEffect(() => {
|
18575
18617
|
if (isLoad && isActive) {
|
18576
|
-
(
|
18618
|
+
(imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.start();
|
18577
18619
|
if (openHashtag) {
|
18578
18620
|
onViewImageEndEvent(rec);
|
18579
18621
|
}
|
@@ -18583,7 +18625,7 @@ Made in Italy` })));
|
|
18583
18625
|
}
|
18584
18626
|
}
|
18585
18627
|
else {
|
18586
|
-
(
|
18628
|
+
(imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.stop();
|
18587
18629
|
}
|
18588
18630
|
}, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
|
18589
18631
|
const showFirstImageFn = React.useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
|
@@ -18610,13 +18652,13 @@ Made in Italy` })));
|
|
18610
18652
|
};
|
18611
18653
|
}, [isActive, imgInfo]);
|
18612
18654
|
const handleMouseEnter = React.useCallback(() => {
|
18613
|
-
if (
|
18614
|
-
|
18655
|
+
if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
|
18656
|
+
imgsSwiperRef.current.swiper.autoplay.stop();
|
18615
18657
|
}
|
18616
18658
|
}, []);
|
18617
18659
|
const handleMouseLeave = React.useCallback(() => {
|
18618
|
-
if (
|
18619
|
-
|
18660
|
+
if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
|
18661
|
+
imgsSwiperRef.current.swiper.autoplay.start();
|
18620
18662
|
}
|
18621
18663
|
}, []);
|
18622
18664
|
const handleSlideChange = React.useCallback((swiper) => {
|
@@ -18637,7 +18679,7 @@ Made in Italy` })));
|
|
18637
18679
|
enabled: true
|
18638
18680
|
}
|
18639
18681
|
}
|
18640
|
-
: {}), { loop: true, ref:
|
18682
|
+
: {}), { loop: true, ref: imgsSwiperRef, onSlideChange: handleSlideChange, className: css.css(Object.assign(Object.assign({ '.swiper-pagination': {
|
18641
18683
|
bottom: (_a = imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.marginBottom) !== null && _a !== void 0 ? _a : 0,
|
18642
18684
|
fontSize: '14px'
|
18643
18685
|
} }, ((imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.dotsBgColor) && {
|
@@ -18654,7 +18696,7 @@ Made in Italy` })));
|
|
18654
18696
|
return (React.createElement(SwiperSlide, { key: srcKey, "aria-hidden": srcKey !== swiperActiveIndex },
|
18655
18697
|
React.createElement(Picture, { src: !isLoad && srcKey > 0 ? '' : url, height: height, imgUrlsPostConfig: imgUrlsPostConfig, onShowFirstImage: showFirstImageFn })));
|
18656
18698
|
}))));
|
18657
|
-
};
|
18699
|
+
});
|
18658
18700
|
var PictureGroup$5 = React.memo(PictureGroup$4);
|
18659
18701
|
|
18660
18702
|
/*
|
@@ -18934,7 +18976,7 @@ Made in Italy` })));
|
|
18934
18976
|
* @Author: binruan@chatlabs.com
|
18935
18977
|
* @Date: 2024-03-20 10:27:31
|
18936
18978
|
* @LastEditors: binruan@chatlabs.com
|
18937
|
-
* @LastEditTime: 2025-05-
|
18979
|
+
* @LastEditTime: 2025-05-12 14:26:15
|
18938
18980
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
18939
18981
|
*
|
18940
18982
|
*/
|
@@ -18954,6 +18996,7 @@ Made in Italy` })));
|
|
18954
18996
|
const skipLinkRef = React.useRef(false);
|
18955
18997
|
const [pageNum, setPageNum] = React.useState(2);
|
18956
18998
|
const videoWidgetRef = React.useRef(null);
|
18999
|
+
const pictureGroupRef = React.useRef(null);
|
18957
19000
|
const { loadVideos, bffEventReport, loading, setPopupDetailData, ctaEvent, swiperRef, waterFallData, setOpenHashtag, appDomain, openHashtag, loadingImage, isFromHashtag, popupDetailData, bffFbReport, curTime, h5EnterLink, isShowConsent, selectTag, isPreview, isEditor, cacheRtcList, setRtcList, cacheActiveIndex, rtcList, isNoMoreData, channel, refreshFeSession, isDiyH5 } = useSxpDataSource();
|
18958
19001
|
const { backMainFeed, productView, jumpToWeb } = useEventReport();
|
18959
19002
|
const isShowFingerTip = React.useMemo(() => {
|
@@ -19001,7 +19044,7 @@ Made in Italy` })));
|
|
19001
19044
|
(_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
|
19002
19045
|
}, [data, ctaType, swiperRef]);
|
19003
19046
|
const handleSessionCompleted = React.useCallback((fk) => {
|
19004
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
19047
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
|
19005
19048
|
const item = data === null || data === void 0 ? void 0 : data[activeIndex];
|
19006
19049
|
let fromKName = '';
|
19007
19050
|
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))) {
|
@@ -19028,12 +19071,13 @@ Made in Italy` })));
|
|
19028
19071
|
eventSubject: 'sessionCompleted',
|
19029
19072
|
eventDescription: 'Session completed',
|
19030
19073
|
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
19031
|
-
|
19074
|
+
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 : '',
|
19075
|
+
productId: (_r = item === null || item === void 0 ? void 0 : item.product) === null || _r === void 0 ? void 0 : _r.itemId,
|
19032
19076
|
position: activeIndex + '',
|
19033
19077
|
fromKName: fk || fromKName,
|
19034
19078
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
19035
|
-
ctatId: (
|
19036
|
-
traceInfo: (
|
19079
|
+
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 : '',
|
19080
|
+
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 : ''
|
19037
19081
|
}
|
19038
19082
|
});
|
19039
19083
|
}, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime]);
|
@@ -19092,8 +19136,9 @@ Made in Italy` })));
|
|
19092
19136
|
refreshFeSession
|
19093
19137
|
]);
|
19094
19138
|
const handleSessionExpire = React.useCallback(lodash.debounce(() => {
|
19095
|
-
var _a;
|
19139
|
+
var _a, _b;
|
19096
19140
|
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
19141
|
+
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
19097
19142
|
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
|
19098
19143
|
}, 1000), [handleSessionCompleted, refreshFeSession]);
|
19099
19144
|
React.useEffect(() => {
|
@@ -19163,18 +19208,18 @@ Made in Italy` })));
|
|
19163
19208
|
return null;
|
19164
19209
|
}, [globalConfig, activeIndex, visList]);
|
19165
19210
|
const renderContent = React.useCallback((rec, index) => {
|
19166
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
19211
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
19167
19212
|
if (rec === 'organic menu') {
|
19168
19213
|
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)));
|
19169
19214
|
}
|
19170
|
-
if ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null ||
|
19215
|
+
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)) {
|
19171
19216
|
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 })));
|
19172
19217
|
}
|
19173
|
-
if ((
|
19174
|
-
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 }));
|
19218
|
+
if ((_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.imgUrls) {
|
19219
|
+
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 })));
|
19175
19220
|
}
|
19176
|
-
if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((
|
19177
|
-
return (
|
19221
|
+
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) {
|
19222
|
+
return (_m = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _m === void 0 ? void 0 : _m.map((value, idx) => {
|
19178
19223
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
19179
19224
|
const t = resolver[(_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type];
|
19180
19225
|
const Component = withBindDataSource(t);
|
@@ -19212,7 +19257,7 @@ Made in Italy` })));
|
|
19212
19257
|
};
|
19213
19258
|
}, [isShowMore]);
|
19214
19259
|
const renderBottom = React.useCallback((rec, index) => {
|
19215
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
19260
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
19216
19261
|
if (rec === null || rec === void 0 ? void 0 : rec.video) {
|
19217
19262
|
let cta = null;
|
19218
19263
|
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) {
|
@@ -19221,24 +19266,27 @@ Made in Italy` })));
|
|
19221
19266
|
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
|
19222
19267
|
cta = '商品CTA';
|
19223
19268
|
}
|
19269
|
+
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)) {
|
19270
|
+
cta = '服务CTA';
|
19271
|
+
}
|
19224
19272
|
else {
|
19225
|
-
cta = (
|
19273
|
+
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;
|
19226
19274
|
}
|
19227
19275
|
const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
|
19228
19276
|
const isNineProduct = (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nineProductEnable) &&
|
19229
19277
|
index === ((rtcList === null || rtcList === void 0 ? void 0 : rtcList[0]) === 'organic menu' ? 2 : 1) &&
|
19230
|
-
((
|
19278
|
+
((_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));
|
19231
19279
|
return (React.createElement(React.Fragment, null,
|
19232
19280
|
isNineProduct && (React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value, isNineProduct: isNineProduct })),
|
19233
|
-
((
|
19234
|
-
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(
|
19281
|
+
((_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' }),
|
19282
|
+
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` } },
|
19235
19283
|
React.createElement(Nudge, { nudge: nudge }),
|
19236
19284
|
((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' },
|
19237
19285
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
|
19238
19286
|
React.createElement("div", null,
|
19239
|
-
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: (
|
19287
|
+
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 }),
|
19240
19288
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
|
19241
|
-
React.createElement(Hashtag$1, { index: activeIndex, tags: (
|
19289
|
+
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) }))),
|
19242
19290
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
|
19243
19291
|
}
|
19244
19292
|
return null;
|
@@ -19277,7 +19325,7 @@ Made in Italy` })));
|
|
19277
19325
|
return null;
|
19278
19326
|
}, [globalConfig, waterFallData]);
|
19279
19327
|
const handleViewImageStartEnd = (item) => {
|
19280
|
-
var _a, _b, _c, _d, _e, _f;
|
19328
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
19281
19329
|
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)) {
|
19282
19330
|
const endTime = Date.now();
|
19283
19331
|
const duration = viewImageStartTime.current === 0 ? 0 : (endTime - viewImageStartTime.current) / 1000;
|
@@ -19286,10 +19334,11 @@ Made in Italy` })));
|
|
19286
19334
|
eventSubject: 'viewImageCarouselEnd',
|
19287
19335
|
eventDescription: 'User end view the image carousel',
|
19288
19336
|
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 : '',
|
19289
|
-
|
19337
|
+
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 : '',
|
19338
|
+
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
19290
19339
|
imageEndTime: `${endTime}`,
|
19291
19340
|
playDuration: `${duration}`,
|
19292
|
-
contentTags: JSON.stringify((
|
19341
|
+
contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
|
19293
19342
|
position: activeIndex + '',
|
19294
19343
|
contentFormat: 'image',
|
19295
19344
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo
|
@@ -19298,7 +19347,7 @@ Made in Italy` })));
|
|
19298
19347
|
}
|
19299
19348
|
};
|
19300
19349
|
const handleSlideSkip = (item, position) => {
|
19301
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
19350
|
+
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;
|
19302
19351
|
if (isPreview || waterFallData)
|
19303
19352
|
return;
|
19304
19353
|
const t = new Date() - curTime.current;
|
@@ -19324,7 +19373,8 @@ Made in Italy` })));
|
|
19324
19373
|
contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
|
19325
19374
|
position: position + '',
|
19326
19375
|
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 : '',
|
19327
|
-
|
19376
|
+
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 : '',
|
19377
|
+
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 : '',
|
19328
19378
|
contentFormat
|
19329
19379
|
}
|
19330
19380
|
});
|
@@ -19334,7 +19384,7 @@ Made in Italy` })));
|
|
19334
19384
|
}
|
19335
19385
|
};
|
19336
19386
|
const handleScrollEvent = (swiper) => {
|
19337
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
|
19387
|
+
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;
|
19338
19388
|
const item = data[swiper.previousIndex];
|
19339
19389
|
if (!item)
|
19340
19390
|
return;
|
@@ -19351,11 +19401,12 @@ Made in Italy` })));
|
|
19351
19401
|
eventSubject: 'scrollDown',
|
19352
19402
|
eventDescription: 'User scroll down',
|
19353
19403
|
contentId: (_e = (_d = item === null || item === void 0 ? void 0 : item.video) === null || _d === void 0 ? void 0 : _d.itemId) !== null && _e !== void 0 ? _e : '',
|
19354
|
-
|
19404
|
+
sceneId: (_h = (_g = (_f = item === null || item === void 0 ? void 0 : item.video) === null || _f === void 0 ? void 0 : _f.scene) === null || _g === void 0 ? void 0 : _g.sceneId) !== null && _h !== void 0 ? _h : '',
|
19405
|
+
productId: (_k = (_j = item === null || item === void 0 ? void 0 : item.product) === null || _j === void 0 ? void 0 : _j.itemId) !== null && _k !== void 0 ? _k : '',
|
19355
19406
|
requestId: null,
|
19356
|
-
traceInfo: (
|
19407
|
+
traceInfo: (_p = (_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.traceInfo) !== null && _m !== void 0 ? _m : (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.traceInfo) !== null && _p !== void 0 ? _p : '',
|
19357
19408
|
contentFormat,
|
19358
|
-
position: ((
|
19409
|
+
position: ((_q = swiper.previousIndex) !== null && _q !== void 0 ? _q : 0) + ''
|
19359
19410
|
}
|
19360
19411
|
});
|
19361
19412
|
// 如果上一个商品是图片集,需上报 浏览图片集结结束 事件
|
@@ -19367,12 +19418,13 @@ Made in Italy` })));
|
|
19367
19418
|
eventInfo: {
|
19368
19419
|
eventSubject: 'scrollUp',
|
19369
19420
|
eventDescription: 'User scroll up',
|
19370
|
-
contentId: (
|
19371
|
-
|
19421
|
+
contentId: (_s = (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.itemId) !== null && _s !== void 0 ? _s : '',
|
19422
|
+
sceneId: (_v = (_u = (_t = item === null || item === void 0 ? void 0 : item.video) === null || _t === void 0 ? void 0 : _t.scene) === null || _u === void 0 ? void 0 : _u.sceneId) !== null && _v !== void 0 ? _v : '',
|
19423
|
+
productId: (_x = (_w = item.product) === null || _w === void 0 ? void 0 : _w.itemId) !== null && _x !== void 0 ? _x : '',
|
19372
19424
|
requestId: null,
|
19373
|
-
traceInfo: (
|
19425
|
+
traceInfo: (_1 = (_z = (_y = item === null || item === void 0 ? void 0 : item.video) === null || _y === void 0 ? void 0 : _y.traceInfo) !== null && _z !== void 0 ? _z : (_0 = item === null || item === void 0 ? void 0 : item.product) === null || _0 === void 0 ? void 0 : _0.traceInfo) !== null && _1 !== void 0 ? _1 : '',
|
19374
19426
|
contentFormat,
|
19375
|
-
position: ((
|
19427
|
+
position: ((_2 = swiper.previousIndex) !== null && _2 !== void 0 ? _2 : 0) + ''
|
19376
19428
|
}
|
19377
19429
|
});
|
19378
19430
|
// 如果上一个商品是图片集,需上报 浏览图片集结结束 事件
|
@@ -19398,7 +19450,7 @@ Made in Italy` })));
|
|
19398
19450
|
}
|
19399
19451
|
}, [openHashtag, data, activeIndex]);
|
19400
19452
|
const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
|
19401
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
19453
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
19402
19454
|
const item = data[activeIndex];
|
19403
19455
|
// 如果是图片集则上报事件
|
19404
19456
|
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)) {
|
@@ -19409,9 +19461,10 @@ Made in Italy` })));
|
|
19409
19461
|
eventSubject: 'viewImageCarouselStart',
|
19410
19462
|
eventDescription: 'User start view the image carousel',
|
19411
19463
|
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 : '',
|
19412
|
-
|
19464
|
+
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 : '',
|
19465
|
+
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
19413
19466
|
imageStartTime: `${startTime}`,
|
19414
|
-
contentTags: JSON.stringify((
|
19467
|
+
contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
|
19415
19468
|
position: activeIndex + '',
|
19416
19469
|
contentFormat: 'image',
|
19417
19470
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
|
@@ -19421,11 +19474,11 @@ Made in Italy` })));
|
|
19421
19474
|
if (enableCapi) {
|
19422
19475
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
19423
19476
|
eventName: 'ViewContent',
|
19424
|
-
product: (
|
19477
|
+
product: (_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.bindProduct
|
19425
19478
|
});
|
19426
19479
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
19427
19480
|
eventName: 'PageView',
|
19428
|
-
product: (
|
19481
|
+
product: (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.bindProduct
|
19429
19482
|
});
|
19430
19483
|
}
|
19431
19484
|
}
|
@@ -19517,15 +19570,20 @@ Made in Italy` })));
|
|
19517
19570
|
swiperRef.current.swiper.allowTouchMove = true;
|
19518
19571
|
}, 500);
|
19519
19572
|
}, onActiveIndexChange: (swiper) => {
|
19573
|
+
var _a, _b;
|
19520
19574
|
setActiveIndex(swiper.activeIndex);
|
19521
19575
|
if (openHashtag)
|
19522
19576
|
return;
|
19523
19577
|
// 处理上滑下滑事件
|
19524
19578
|
handleScrollEvent(swiper);
|
19525
|
-
if (waterFallData || isEditor
|
19579
|
+
if (waterFallData || isEditor)
|
19526
19580
|
return;
|
19527
19581
|
if ((swiper === null || swiper === void 0 ? void 0 : swiper.activeIndex) + 1 >= (data === null || data === void 0 ? void 0 : data.length)) {
|
19528
19582
|
if (!isLoadMore) {
|
19583
|
+
if (isDiyH5) {
|
19584
|
+
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
19585
|
+
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
19586
|
+
}
|
19529
19587
|
setIsLoadMore(true);
|
19530
19588
|
loadVideos === null || loadVideos === void 0 ? void 0 : loadVideos(pageNum).then((res) => {
|
19531
19589
|
var _a;
|
@@ -19578,7 +19636,7 @@ Made in Italy` })));
|
|
19578
19636
|
}, []);
|
19579
19637
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
19580
19638
|
const handlePlaying = React.useCallback(() => {
|
19581
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
19639
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
19582
19640
|
setIsPauseVideo(false);
|
19583
19641
|
const item = data[index];
|
19584
19642
|
if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
|
@@ -19591,14 +19649,15 @@ Made in Italy` })));
|
|
19591
19649
|
eventSubject: 'playVideo',
|
19592
19650
|
eventDescription: 'User played the video',
|
19593
19651
|
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 : '',
|
19594
|
-
|
19652
|
+
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 : '',
|
19653
|
+
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 : '',
|
19595
19654
|
playType,
|
19596
19655
|
startTime: videoCurrentTime,
|
19597
19656
|
videoDuration,
|
19598
|
-
contentTags: JSON.stringify((
|
19657
|
+
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 : []),
|
19599
19658
|
position: index + '',
|
19600
19659
|
contentFormat: 'video',
|
19601
|
-
traceInfo: (
|
19660
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
19602
19661
|
}
|
19603
19662
|
});
|
19604
19663
|
setIsFirstPlay(false);
|
@@ -19637,7 +19696,7 @@ Made in Italy` })));
|
|
19637
19696
|
}
|
19638
19697
|
}, [isLoadFinish]);
|
19639
19698
|
const onPause = React.useCallback(() => {
|
19640
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
19699
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
19641
19700
|
const item = data[index];
|
19642
19701
|
const videoDuration = ((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
|
19643
19702
|
const videoCurrentTime = ((_d = (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
|
@@ -19648,14 +19707,15 @@ Made in Italy` })));
|
|
19648
19707
|
eventSubject: 'playOverVideo',
|
19649
19708
|
eventDescription: 'User finished playing the video',
|
19650
19709
|
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 : '',
|
19651
|
-
|
19710
|
+
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 : '',
|
19711
|
+
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 : '',
|
19652
19712
|
endTime: videoCurrentTime,
|
19653
19713
|
videoDuration,
|
19654
19714
|
playDuration,
|
19655
|
-
contentTags: JSON.stringify((
|
19715
|
+
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 : []),
|
19656
19716
|
position: index + '',
|
19657
19717
|
contentFormat: 'video',
|
19658
|
-
traceInfo: (
|
19718
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
19659
19719
|
}
|
19660
19720
|
});
|
19661
19721
|
}
|