pb-sxp-ui 1.17.1 → 1.18.0
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/index.js
CHANGED
@@ -622,6 +622,7 @@ const DEFAULT_TAG = 'FOR U';
|
|
622
622
|
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 }) => {
|
623
623
|
var _a, _b, _c, _d, _e;
|
624
624
|
const [rtcList, setRtcList] = useState([]);
|
625
|
+
const [firstRtcList, setFirstRtcList] = useState([]);
|
625
626
|
const [tagList, setTagList] = useState([]);
|
626
627
|
const [loading, setLoading] = useState(true);
|
627
628
|
const [curReqInfo, setCurReqInfo] = useState({ rtc: '', requestId: '' });
|
@@ -653,6 +654,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
653
654
|
const [chatlabsId, setChatlabsId] = useState();
|
654
655
|
const finalPageData = useMemo(() => pageData !== null && pageData !== void 0 ? pageData : data, [pageData, data]);
|
655
656
|
const pixelPvStatusRef = useRef(false);
|
657
|
+
const isDiyPage = useMemo(() => {
|
658
|
+
var _a, _b, _c;
|
659
|
+
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);
|
660
|
+
}, [isDiyH5, finalPageData]);
|
656
661
|
const isShowConsent = useMemo(() => {
|
657
662
|
var _a, _b, _c, _d;
|
658
663
|
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) &&
|
@@ -715,7 +720,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
715
720
|
}, [bffDataSource]);
|
716
721
|
// bff API 请求方法
|
717
722
|
const bffFetch = useCallback((path, options, isBota = true) => {
|
718
|
-
var _a;
|
723
|
+
var _a, _b;
|
719
724
|
if (!bffDataSource)
|
720
725
|
return;
|
721
726
|
const url = bffDataSource.url;
|
@@ -728,8 +733,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
728
733
|
val.split('=')[0];
|
729
734
|
val.split('=')[1];
|
730
735
|
});
|
736
|
+
options.body = Object.assign(Object.assign({}, options.body), { productUserId: fakeUserId });
|
731
737
|
return window
|
732
|
-
.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
|
738
|
+
.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
|
733
739
|
? JSON.stringify({
|
734
740
|
body: btoa(encodeURIComponent(JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))))
|
735
741
|
})
|
@@ -969,8 +975,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
969
975
|
}, [bffDataSource]);
|
970
976
|
// 获取推荐视频数据
|
971
977
|
const getRecommendVideos = useCallback((query) => __awaiter(void 0, void 0, void 0, function* () {
|
972
|
-
var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
|
973
|
-
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 })), (
|
978
|
+
var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
979
|
+
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' }));
|
974
980
|
if (channel) {
|
975
981
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(channel) });
|
976
982
|
}
|
@@ -983,9 +989,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
983
989
|
if (val)
|
984
990
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
|
985
991
|
}
|
992
|
+
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);
|
986
993
|
if (isEditor) {
|
987
994
|
let pageNum = 1;
|
988
|
-
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] }));
|
995
|
+
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 }));
|
989
996
|
if (!(query === null || query === void 0 ? void 0 : query.channel) || isInit.current) {
|
990
997
|
return undefined;
|
991
998
|
}
|
@@ -993,19 +1000,22 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
993
1000
|
let list = [];
|
994
1001
|
let result = null;
|
995
1002
|
const recurveRecList = (query) => __awaiter(void 0, void 0, void 0, function* () {
|
996
|
-
var
|
1003
|
+
var _y, _z, _0, _1, _2, _3;
|
997
1004
|
query.pageNum = pageNum;
|
998
|
-
result = yield (
|
1005
|
+
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('recommend/direct_page', { method: 'POST', body: query }));
|
999
1006
|
if (!(result === null || result === void 0 ? void 0 : result.success)) {
|
1000
1007
|
return undefined;
|
1001
1008
|
}
|
1002
1009
|
setLoading(false);
|
1003
|
-
list = list.concat((
|
1010
|
+
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 : []);
|
1004
1011
|
if ((rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) === 0) {
|
1005
1012
|
setRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
1006
1013
|
setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
1014
|
+
if (isDiyPage) {
|
1015
|
+
setFirstRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
1016
|
+
}
|
1007
1017
|
}
|
1008
|
-
const isNotNullList = (
|
1018
|
+
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));
|
1009
1019
|
if (isNotNullList) {
|
1010
1020
|
pageNum = pageNum + 1;
|
1011
1021
|
yield recurveRecList(query);
|
@@ -1013,13 +1023,13 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1013
1023
|
});
|
1014
1024
|
yield recurveRecList(query);
|
1015
1025
|
if (!(query === null || query === void 0 ? void 0 : query.hashTag) && result)
|
1016
|
-
setCurReqInfo({ rtc: (
|
1026
|
+
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 });
|
1017
1027
|
return Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list });
|
1018
1028
|
}
|
1019
1029
|
if (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) {
|
1020
|
-
query = Object.assign(Object.assign({}, query), { directPage: true, level: 1, pageNum: (
|
1030
|
+
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 }));
|
1021
1031
|
}
|
1022
|
-
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/list', {
|
1032
|
+
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', {
|
1023
1033
|
method: 'POST',
|
1024
1034
|
body: query
|
1025
1035
|
}));
|
@@ -1029,26 +1039,31 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1029
1039
|
if (!(query === null || query === void 0 ? void 0 : query.hashTag))
|
1030
1040
|
setCurReqInfo({ rtc: result.data.rtc, requestId: result.data.requestId });
|
1031
1041
|
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) && !isEditor) {
|
1032
|
-
const isNotNullList = (
|
1042
|
+
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));
|
1033
1043
|
if (!isNotNullList) {
|
1034
1044
|
setIsNoMoreData(true);
|
1035
1045
|
}
|
1036
1046
|
}
|
1037
1047
|
let list = [];
|
1038
|
-
list = list.concat((
|
1048
|
+
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 : []);
|
1039
1049
|
return Object.assign(Object.assign({}, result.data), { recList: list });
|
1040
|
-
}), [bffFetch, utmVal, maxSize, defaultSize, channelQueryList, channel, chatlabsId, bffFetchAdmin]);
|
1050
|
+
}), [bffFetch, utmVal, maxSize, defaultSize, channelQueryList, channel, chatlabsId, bffFetchAdmin, isDiyPage, finalPageData, isDiyH5]);
|
1041
1051
|
const loadVideos = useCallback((pageNum) => __awaiter(void 0, void 0, void 0, function* () {
|
1042
|
-
var
|
1052
|
+
var _4, _5, _6, _7;
|
1043
1053
|
if (rtcList.length <= 0) {
|
1044
1054
|
return;
|
1045
1055
|
}
|
1056
|
+
if (isDiyPage && (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) > 0) {
|
1057
|
+
setRtcList(rtcList.concat(firstRtcList));
|
1058
|
+
setCacheRtcList(cacheRtcList.concat(firstRtcList));
|
1059
|
+
return;
|
1060
|
+
}
|
1046
1061
|
const lastItem = rtcList === null || rtcList === void 0 ? void 0 : rtcList[(rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) - 1];
|
1047
|
-
const data = yield getRecommendVideos(Object.assign(Object.assign(Object.assign(Object.assign({ hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag }, (((
|
1062
|
+
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 })));
|
1048
1063
|
setRtcList(rtcList.concat(getFilterRecList(data)));
|
1049
1064
|
setCacheRtcList(cacheRtcList.concat(getFilterRecList(data)));
|
1050
1065
|
return data;
|
1051
|
-
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
|
1066
|
+
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList, isDiyPage, firstRtcList]);
|
1052
1067
|
const refreshFeSession = useCallback((enableReSid, event) => {
|
1053
1068
|
var _a, _b, _c, _d, _e;
|
1054
1069
|
let expire = false;
|
@@ -1079,8 +1094,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1079
1094
|
// 用户信息都是公共的
|
1080
1095
|
if (!userInfo) {
|
1081
1096
|
userInfo = {
|
1082
|
-
|
1083
|
-
|
1097
|
+
productUserId: fakeUserId // 后端逻辑会从请求头获取,所以不需要传
|
1098
|
+
// tpChannelId: 'H5' // 后端处理
|
1084
1099
|
};
|
1085
1100
|
}
|
1086
1101
|
const sessionID = storeAndLoadFeSessionId();
|
@@ -1114,7 +1129,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1114
1129
|
layoutVariantId,
|
1115
1130
|
globalConfig,
|
1116
1131
|
playbookType,
|
1117
|
-
bffDataSource
|
1132
|
+
bffDataSource,
|
1133
|
+
fakeUserId
|
1118
1134
|
]);
|
1119
1135
|
const getEventParamsByJson = useCallback((json, product) => {
|
1120
1136
|
var _a, _b, _c;
|
@@ -1247,38 +1263,40 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1247
1263
|
}
|
1248
1264
|
}, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig, bffDataSource, getEventParamsByJson]);
|
1249
1265
|
const bffMutateLike = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
1266
|
+
body = Object.assign(Object.assign({}, body), { productUserId: fakeUserId });
|
1250
1267
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/like', { method: 'POST', body }));
|
1251
1268
|
return res === null || res === void 0 ? void 0 : res.success;
|
1252
|
-
}), [bffFetch]);
|
1269
|
+
}), [bffFetch, fakeUserId]);
|
1253
1270
|
const bffMutateUnlike = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
1271
|
+
body = Object.assign(Object.assign({}, body), { productUserId: fakeUserId });
|
1254
1272
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/unlike', { method: 'POST', body }));
|
1255
1273
|
return res === null || res === void 0 ? void 0 : res.success;
|
1256
|
-
}), [bffFetch]);
|
1274
|
+
}), [bffFetch, fakeUserId]);
|
1257
1275
|
const bffSubmitForm = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
1258
1276
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/customform', { method: 'POST', body }));
|
1259
1277
|
return res === null || res === void 0 ? void 0 : res.success;
|
1260
1278
|
}), [bffFetch]);
|
1261
1279
|
// 获取 Tag
|
1262
1280
|
const bffGetTagList = useCallback((data) => __awaiter(void 0, void 0, void 0, function* () {
|
1263
|
-
var
|
1264
|
-
const isShowTag = !!((
|
1281
|
+
var _8, _9, _10, _11, _12, _13, _14, _15;
|
1282
|
+
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);
|
1265
1283
|
if (!utmVal || !isShowTag)
|
1266
1284
|
return;
|
1267
1285
|
try {
|
1268
|
-
const val = (
|
1286
|
+
const val = (_13 = (_12 = (_11 = splitUrlParams(utmVal)) === null || _11 === void 0 ? void 0 : _11.filter((val) => {
|
1269
1287
|
var _a, _b;
|
1270
1288
|
const key = val.split('=')[0];
|
1271
1289
|
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);
|
1272
|
-
})) === null ||
|
1290
|
+
})) === null || _12 === void 0 ? void 0 : _12.join('&')) !== null && _13 !== void 0 ? _13 : '';
|
1273
1291
|
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
|
1274
|
-
setTagList((
|
1292
|
+
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 : []);
|
1275
1293
|
}
|
1276
1294
|
catch (e) {
|
1277
1295
|
console.log('e', e);
|
1278
1296
|
}
|
1279
1297
|
}), [bffFetch, utmVal]);
|
1280
1298
|
const ctaEvent = useCallback((eventInfo, rec, product, position) => {
|
1281
|
-
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;
|
1299
|
+
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;
|
1282
1300
|
const cta = product === null || product === void 0 ? void 0 : product.bindCta;
|
1283
1301
|
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);
|
1284
1302
|
let fromKName = '';
|
@@ -1296,7 +1314,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1296
1314
|
}
|
1297
1315
|
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;
|
1298
1316
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
1299
|
-
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: (
|
1317
|
+
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 })
|
1300
1318
|
});
|
1301
1319
|
}, [bffEventReport, isFromHashtag]);
|
1302
1320
|
const h5EnterLink = useCallback(() => {
|
@@ -1331,10 +1349,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1331
1349
|
});
|
1332
1350
|
}, [bffEventReport]);
|
1333
1351
|
const getAccount = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
1334
|
-
var
|
1352
|
+
var _16, _17;
|
1335
1353
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/account', { method: 'GET' }));
|
1336
|
-
setChatlabsId((
|
1337
|
-
return ((
|
1354
|
+
setChatlabsId((_16 = res === null || res === void 0 ? void 0 : res.data) === null || _16 === void 0 ? void 0 : _16.chatLabsId);
|
1355
|
+
return ((_17 = res === null || res === void 0 ? void 0 : res.data) === null || _17 === void 0 ? void 0 : _17.consentResult) === 'true';
|
1338
1356
|
}), [bffFetch]);
|
1339
1357
|
const accountSonsent = useCallback((consentResult) => __awaiter(void 0, void 0, void 0, function* () {
|
1340
1358
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/account/consent', {
|
@@ -1398,6 +1416,9 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1398
1416
|
}
|
1399
1417
|
setRtcList(list);
|
1400
1418
|
setCacheRtcList(list);
|
1419
|
+
if (isDiyPage) {
|
1420
|
+
setFirstRtcList(list);
|
1421
|
+
}
|
1401
1422
|
bffGetTagList(curData !== null && curData !== void 0 ? curData : finalPageData);
|
1402
1423
|
if (channel) {
|
1403
1424
|
const item = list === null || list === void 0 ? void 0 : list[0];
|
@@ -1417,7 +1438,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1417
1438
|
});
|
1418
1439
|
setLoading(false);
|
1419
1440
|
});
|
1420
|
-
}, [isShowConsent, channel]);
|
1441
|
+
}, [isShowConsent, channel, isDiyPage]);
|
1421
1442
|
// cms预览
|
1422
1443
|
useEffect(() => {
|
1423
1444
|
if (!isPreview)
|
@@ -1433,12 +1454,15 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1433
1454
|
}
|
1434
1455
|
setRtcList(list);
|
1435
1456
|
setCacheRtcList(list);
|
1457
|
+
if (isDiyPage) {
|
1458
|
+
setFirstRtcList(list);
|
1459
|
+
}
|
1436
1460
|
}
|
1437
1461
|
})
|
1438
1462
|
.finally(() => {
|
1439
1463
|
setLoading(false);
|
1440
1464
|
});
|
1441
|
-
}, [getRecommendVideos, bffGetTagList, channel]);
|
1465
|
+
}, [getRecommendVideos, bffGetTagList, channel, isDiyPage]);
|
1442
1466
|
const defaultLoadingImage = useIconLink('/pb_static/a65d23c5893c49d7aaaa81681d3179e2.gif', appDomain);
|
1443
1467
|
return (React.createElement(SxpDataSourceContext.Provider, { value: {
|
1444
1468
|
rtcList,
|
@@ -1496,7 +1520,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1496
1520
|
refreshFeSession,
|
1497
1521
|
getAccount,
|
1498
1522
|
accountSonsent,
|
1499
|
-
isDiyH5
|
1523
|
+
isDiyH5: isDiyPage,
|
1524
|
+
firstRtcList
|
1500
1525
|
} }, 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({
|
1501
1526
|
rtcList,
|
1502
1527
|
mutateLike: bffMutateLike,
|
@@ -1957,14 +1982,14 @@ var settingRender$f = [
|
|
1957
1982
|
* @Author: binruan@chatlabs.com
|
1958
1983
|
* @Date: 2024-03-12 10:59:06
|
1959
1984
|
* @LastEditors: binruan@chatlabs.com
|
1960
|
-
* @LastEditTime:
|
1985
|
+
* @LastEditTime: 2025-05-09 15:30:59
|
1961
1986
|
* @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
|
1962
1987
|
*
|
1963
1988
|
*/
|
1964
1989
|
function useEventReport() {
|
1965
1990
|
const { bffEventReport, popupDetailData, isFromHashtag, eventTimeList, setEventTimeList } = useSxpDataSource();
|
1966
1991
|
const jumpToWeb = useCallback((e, data, product, cta, position, traceInfo) => {
|
1967
|
-
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;
|
1992
|
+
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;
|
1968
1993
|
const i = eventTimeList === null || eventTimeList === void 0 ? void 0 : eventTimeList.findIndex((item) => item.target === (e === null || e === void 0 ? void 0 : e.target));
|
1969
1994
|
if (i !== -1) {
|
1970
1995
|
return;
|
@@ -1997,11 +2022,11 @@ function useEventReport() {
|
|
1997
2022
|
contentFormat = 'image';
|
1998
2023
|
}
|
1999
2024
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
2000
|
-
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 : '',
|
2025
|
+
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 }))
|
2001
2026
|
});
|
2002
2027
|
}, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
|
2003
2028
|
const productView = useCallback((data, product, cta, viewTime, position) => {
|
2004
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
2029
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
2005
2030
|
let fromKName = '';
|
2006
2031
|
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))) {
|
2007
2032
|
fromKName = 'pdpPage';
|
@@ -2020,8 +2045,9 @@ function useEventReport() {
|
|
2020
2045
|
contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags),
|
2021
2046
|
position: position + '',
|
2022
2047
|
contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
2048
|
+
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 : '',
|
2023
2049
|
ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
|
2024
|
-
traceInfo: (
|
2050
|
+
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 : '',
|
2025
2051
|
timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
|
2026
2052
|
eventSubject: 'productView',
|
2027
2053
|
eventDescription: 'User browsed the product'
|
@@ -15836,7 +15862,7 @@ function WaterfallList(_a) {
|
|
15836
15862
|
* @Author: binruan@chatlabs.com
|
15837
15863
|
* @Date: 2024-01-10 10:58:24
|
15838
15864
|
* @LastEditors: binruan@chatlabs.com
|
15839
|
-
* @LastEditTime: 2025-
|
15865
|
+
* @LastEditTime: 2025-05-09 15:30:41
|
15840
15866
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\WaterFall\index.tsx
|
15841
15867
|
*
|
15842
15868
|
*/
|
@@ -15874,7 +15900,7 @@ const WaterFall = (props) => {
|
|
15874
15900
|
}
|
15875
15901
|
}, [waterFallData]);
|
15876
15902
|
const reportTagsView = useCallback(() => {
|
15877
|
-
var _a, _b, _c, _d, _e, _f;
|
15903
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
15878
15904
|
const rec = recData === null || recData === void 0 ? void 0 : recData.rec;
|
15879
15905
|
if (!rec)
|
15880
15906
|
return;
|
@@ -15894,9 +15920,10 @@ const WaterFall = (props) => {
|
|
15894
15920
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
15895
15921
|
eventInfo: {
|
15896
15922
|
contentId: (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
15923
|
+
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 : '',
|
15897
15924
|
position: cacheActiveIndex + '',
|
15898
|
-
contentTags: JSON.stringify((
|
15899
|
-
traceInfo: (
|
15925
|
+
contentTags: JSON.stringify((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.tags),
|
15926
|
+
traceInfo: (_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.traceInfo,
|
15900
15927
|
hashTags: JSON.stringify([recData === null || recData === void 0 ? void 0 : recData.hashTag]),
|
15901
15928
|
fromKName,
|
15902
15929
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
@@ -17978,21 +18005,22 @@ const LikeButton = (_a) => {
|
|
17978
18005
|
const likeIcon = useIconLink(defaultLikeIconPath$2);
|
17979
18006
|
const unlikeIcon = useIconLink(defaultUnLikeIconPath$2);
|
17980
18007
|
const handleClick = debounce(() => __awaiter(void 0, void 0, void 0, function* () {
|
17981
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
|
18008
|
+
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;
|
17982
18009
|
if (state) {
|
17983
18010
|
// 先设置状态
|
17984
18011
|
setState(false);
|
17985
|
-
const result = (_e = (yield (mutateUnlike === null || mutateUnlike === void 0 ? void 0 : mutateUnlike({
|
18012
|
+
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;
|
17986
18013
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
17987
18014
|
eventInfo: {
|
17988
18015
|
eventSubject: 'favoriteContentCanceled',
|
17989
18016
|
eventDescription: 'This content was unfavorite by the user',
|
17990
18017
|
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 : '',
|
17991
|
-
|
17992
|
-
|
18018
|
+
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 : '',
|
18019
|
+
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 : '',
|
18020
|
+
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 : []),
|
17993
18021
|
position: position + '',
|
17994
|
-
contentFormat: ((
|
17995
|
-
traceInfo: (
|
18022
|
+
contentFormat: ((_q = recData === null || recData === void 0 ? void 0 : recData.video) === null || _q === void 0 ? void 0 : _q.url) ? 'video' : 'image',
|
18023
|
+
traceInfo: (_r = recData === null || recData === void 0 ? void 0 : recData.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
17996
18024
|
}
|
17997
18025
|
});
|
17998
18026
|
// 如果接口调用失败,则回滚状态
|
@@ -18000,40 +18028,41 @@ const LikeButton = (_a) => {
|
|
18000
18028
|
setState(true);
|
18001
18029
|
}
|
18002
18030
|
else {
|
18003
|
-
const nRtcList = (
|
18031
|
+
const nRtcList = (_s = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
18004
18032
|
if (index === position) {
|
18005
18033
|
item.isCollected = false;
|
18006
18034
|
}
|
18007
18035
|
return item;
|
18008
|
-
})) !== null &&
|
18036
|
+
})) !== null && _s !== void 0 ? _s : [];
|
18009
18037
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
18010
18038
|
}
|
18011
18039
|
}
|
18012
18040
|
else {
|
18013
18041
|
setState(true);
|
18014
|
-
const result = (
|
18042
|
+
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;
|
18015
18043
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
18016
18044
|
eventInfo: {
|
18017
18045
|
eventSubject: 'favoriteContent',
|
18018
18046
|
eventDescription: 'This content was favorite by the user',
|
18019
|
-
contentId: (
|
18020
|
-
|
18021
|
-
|
18047
|
+
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 : '',
|
18048
|
+
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 : '',
|
18049
|
+
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 : '',
|
18050
|
+
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 : []),
|
18022
18051
|
position: position + '',
|
18023
|
-
contentFormat: ((
|
18024
|
-
traceInfo: (
|
18052
|
+
contentFormat: ((_5 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _5 === void 0 ? void 0 : _5.url) ? 'video' : 'image',
|
18053
|
+
traceInfo: (_6 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _6 === void 0 ? void 0 : _6.traceInfo
|
18025
18054
|
}
|
18026
18055
|
});
|
18027
18056
|
if (!result) {
|
18028
18057
|
setState(false);
|
18029
18058
|
}
|
18030
18059
|
else {
|
18031
|
-
const nRtcList = (
|
18060
|
+
const nRtcList = (_7 = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
18032
18061
|
if (index === position) {
|
18033
18062
|
item.isCollected = true;
|
18034
18063
|
}
|
18035
18064
|
return item;
|
18036
|
-
})) !== null &&
|
18065
|
+
})) !== null && _7 !== void 0 ? _7 : [];
|
18037
18066
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
18038
18067
|
}
|
18039
18068
|
}
|
@@ -18070,7 +18099,7 @@ const mountVideoPlayerAtNode = (() => {
|
|
18070
18099
|
const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex, videoPostConfig, videoPlayIcon, loopPlay, swiperRef }, ref) => {
|
18071
18100
|
var _a, _b;
|
18072
18101
|
const [isPauseVideo, setIsPauseVideo] = useState(false);
|
18073
|
-
const { bffEventReport, sxpParameter,
|
18102
|
+
const { bffEventReport, sxpParameter, firstRtcList, openHashtag, bffFbReport, isDiyH5 } = useSxpDataSource();
|
18074
18103
|
const videoStartTime = useRef(0);
|
18075
18104
|
const [isLoadFinish, setIsLoadFinish] = useState(false);
|
18076
18105
|
const { isActive } = useSwiperSlide();
|
@@ -18136,6 +18165,23 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
18136
18165
|
return;
|
18137
18166
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
18138
18167
|
}, [videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
18168
|
+
const handleEnd = () => {
|
18169
|
+
var _a, _b, _c, _d, _e, _f;
|
18170
|
+
if (!videoRef.current)
|
18171
|
+
return;
|
18172
|
+
if (isDiyH5) {
|
18173
|
+
(_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
|
18174
|
+
if (!loopPlayRef.current)
|
18175
|
+
return;
|
18176
|
+
if (firstRtcList && index < (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) - 1) {
|
18177
|
+
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;
|
18178
|
+
(_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);
|
18179
|
+
}
|
18180
|
+
}
|
18181
|
+
else {
|
18182
|
+
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.play();
|
18183
|
+
}
|
18184
|
+
};
|
18139
18185
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
18140
18186
|
const handlePlaying = useCallback(() => {
|
18141
18187
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
@@ -18144,7 +18190,7 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
18144
18190
|
setIsLoadFinish(true);
|
18145
18191
|
}, []);
|
18146
18192
|
const handleStartPlay = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
18147
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
18193
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
18148
18194
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
18149
18195
|
return;
|
18150
18196
|
setIsPauseVideo(false);
|
@@ -18155,16 +18201,11 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
18155
18201
|
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);
|
18156
18202
|
const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
|
18157
18203
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
18158
|
-
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 : '',
|
18204
|
+
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) + '' }))
|
18159
18205
|
});
|
18160
18206
|
isFirstPlayRef.current = false;
|
18161
18207
|
}
|
18162
18208
|
}), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
18163
|
-
const setCurrentTimeByStartTime = useCallback(() => {
|
18164
|
-
if (isDiyH5) {
|
18165
|
-
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
18166
|
-
}
|
18167
|
-
}, []);
|
18168
18209
|
const handLoadeddata = useCallback(() => {
|
18169
18210
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
|
18170
18211
|
return;
|
@@ -18189,13 +18230,12 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
18189
18230
|
const handleLoadedmetadata = useCallback(() => {
|
18190
18231
|
if (!videoRef.current)
|
18191
18232
|
return;
|
18192
|
-
setCurrentTimeByStartTime();
|
18193
18233
|
loadedTimeRef.current = new Date();
|
18194
18234
|
handleStartPlay();
|
18195
18235
|
handLoadeddata();
|
18196
18236
|
}, [videoRef.current, handLoadeddata, handleStartPlay]);
|
18197
18237
|
const handleClickVideo = useCallback((type) => () => {
|
18198
|
-
var _a, _b, _c, _d, _e
|
18238
|
+
var _a, _b, _c, _d, _e;
|
18199
18239
|
if (!videoRef.current)
|
18200
18240
|
return;
|
18201
18241
|
if (!isLoadFinish)
|
@@ -18216,20 +18256,17 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
18216
18256
|
break;
|
18217
18257
|
default:
|
18218
18258
|
if (isPause) {
|
18219
|
-
|
18220
|
-
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
18221
|
-
}
|
18222
|
-
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
|
18259
|
+
(_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.play();
|
18223
18260
|
}
|
18224
18261
|
else {
|
18225
|
-
(
|
18262
|
+
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.pause();
|
18226
18263
|
}
|
18227
18264
|
setIsPauseVideo(!isPause);
|
18228
18265
|
break;
|
18229
18266
|
}
|
18230
18267
|
}, [isLoadFinish, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
18231
18268
|
const handlePause = useCallback(() => {
|
18232
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
18269
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
18233
18270
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
18234
18271
|
return;
|
18235
18272
|
if (activeIndex !== index)
|
@@ -18245,14 +18282,15 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
18245
18282
|
eventSubject: 'playOverVideo',
|
18246
18283
|
eventDescription: 'User finished playing the video',
|
18247
18284
|
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 : '',
|
18248
|
-
|
18285
|
+
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 : '',
|
18286
|
+
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 : '',
|
18249
18287
|
endTime: videoCurrentTime,
|
18250
18288
|
videoDuration,
|
18251
18289
|
playDuration,
|
18252
|
-
contentTags: JSON.stringify((
|
18290
|
+
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 : []),
|
18253
18291
|
position: index + '',
|
18254
18292
|
contentFormat: 'video',
|
18255
|
-
traceInfo: (
|
18293
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
18256
18294
|
}
|
18257
18295
|
});
|
18258
18296
|
}
|
@@ -18260,27 +18298,8 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
18260
18298
|
const handleWaiting = useCallback(() => {
|
18261
18299
|
setWaiting(true);
|
18262
18300
|
}, []);
|
18263
|
-
const handleTimeUpload = () => {
|
18264
|
-
if (!videoRef.current || !isDiyH5)
|
18265
|
-
return;
|
18266
|
-
setTimeout(() => {
|
18267
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
18268
|
-
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)) {
|
18269
|
-
(_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
|
18270
|
-
if (!loopPlayRef.current)
|
18271
|
-
return;
|
18272
|
-
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
18273
|
-
(_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);
|
18274
|
-
}
|
18275
|
-
else {
|
18276
|
-
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;
|
18277
|
-
(_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);
|
18278
|
-
}
|
18279
|
-
}
|
18280
|
-
});
|
18281
|
-
};
|
18282
18301
|
useEffect(() => {
|
18283
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
18302
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
18284
18303
|
if (!isActive)
|
18285
18304
|
return;
|
18286
18305
|
const videoSrc = videoUrl;
|
@@ -18301,7 +18320,6 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
18301
18320
|
hls === null || hls === void 0 ? void 0 : hls.attachMedia(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current);
|
18302
18321
|
hls === null || hls === void 0 ? void 0 : hls.on(Hls.Events.MANIFEST_PARSED, function () {
|
18303
18322
|
var _a;
|
18304
|
-
setCurrentTimeByStartTime();
|
18305
18323
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
18306
18324
|
});
|
18307
18325
|
}
|
@@ -18315,12 +18333,11 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
18315
18333
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.addEventListener('play', handleStartPlay);
|
18316
18334
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.addEventListener('playing', handlePlaying);
|
18317
18335
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.addEventListener('pause', handlePause);
|
18318
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended',
|
18336
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handleEnd);
|
18319
18337
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.addEventListener('canplay', handlePlay);
|
18320
18338
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
|
18321
|
-
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.addEventListener('timeupdate', handleTimeUpload);
|
18322
18339
|
return () => {
|
18323
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
18340
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
18324
18341
|
const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
|
18325
18342
|
if (!isPause)
|
18326
18343
|
handlePause();
|
@@ -18332,10 +18349,9 @@ const VideoWidget$4 = forwardRef(({ rec, index, height, data, muted, activeIndex
|
|
18332
18349
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.removeEventListener('play', handleStartPlay);
|
18333
18350
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.removeEventListener('playing', handlePlaying);
|
18334
18351
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.removeEventListener('pause', handlePause);
|
18335
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended',
|
18352
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handleEnd);
|
18336
18353
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('canplay', handlePlay);
|
18337
18354
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.removeEventListener('waiting', handleWaiting);
|
18338
|
-
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.removeEventListener('timeupdate', handleTimeUpload);
|
18339
18355
|
};
|
18340
18356
|
}, [isActive]);
|
18341
18357
|
useEffect(() => {
|
@@ -18546,19 +18562,45 @@ const Picture = (props) => {
|
|
18546
18562
|
}, onLoad: onShowFirstImage }))));
|
18547
18563
|
};
|
18548
18564
|
|
18549
|
-
const PictureGroup$4 = ({ imgUrls,
|
18565
|
+
const PictureGroup$4 = forwardRef(({ imgUrls, data, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig, swiperRef }, ref) => {
|
18550
18566
|
var _a, _b;
|
18551
18567
|
const { isActive } = useSwiperSlide();
|
18552
|
-
const {
|
18568
|
+
const { firstRtcList, openHashtag, isDiyH5 } = useSxpDataSource();
|
18553
18569
|
const [isLoad, setIsLoad] = useState(false);
|
18554
18570
|
const [imgInfo, setImgInfo] = useState();
|
18555
18571
|
const [swiperActiveIndex, setSwiperActiveIndex] = useState(0);
|
18556
|
-
const
|
18572
|
+
const imgsSwiperRef = useRef();
|
18557
18573
|
const isFirstPlayRef = useRef(true);
|
18574
|
+
const loopPlayRef = useRef(true);
|
18558
18575
|
const initTime = new Date();
|
18576
|
+
useImperativeHandle(ref, () => {
|
18577
|
+
return {
|
18578
|
+
setLoopPlay(v) {
|
18579
|
+
loopPlayRef.current = v;
|
18580
|
+
}
|
18581
|
+
};
|
18582
|
+
});
|
18583
|
+
useEffect(() => {
|
18584
|
+
let timerId;
|
18585
|
+
if (isLoad && isActive && isDiyH5) {
|
18586
|
+
timerId = setTimeout(() => {
|
18587
|
+
var _a, _b, _c, _d;
|
18588
|
+
if (!loopPlayRef.current)
|
18589
|
+
return;
|
18590
|
+
if (firstRtcList && index < (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) - 1) {
|
18591
|
+
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;
|
18592
|
+
(_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);
|
18593
|
+
}
|
18594
|
+
}, 3000);
|
18595
|
+
}
|
18596
|
+
return () => {
|
18597
|
+
if (timerId)
|
18598
|
+
clearTimeout(timerId);
|
18599
|
+
};
|
18600
|
+
}, [isLoad, isActive, isDiyH5, index, swiperRef, firstRtcList]);
|
18559
18601
|
useEffect(() => {
|
18560
18602
|
if (isLoad && isActive) {
|
18561
|
-
(
|
18603
|
+
(imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.start();
|
18562
18604
|
if (openHashtag) {
|
18563
18605
|
onViewImageEndEvent(rec);
|
18564
18606
|
}
|
@@ -18568,7 +18610,7 @@ const PictureGroup$4 = ({ imgUrls, width, height, rec, index, onViewImageEndEven
|
|
18568
18610
|
}
|
18569
18611
|
}
|
18570
18612
|
else {
|
18571
|
-
(
|
18613
|
+
(imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.stop();
|
18572
18614
|
}
|
18573
18615
|
}, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
|
18574
18616
|
const showFirstImageFn = useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
|
@@ -18595,13 +18637,13 @@ const PictureGroup$4 = ({ imgUrls, width, height, rec, index, onViewImageEndEven
|
|
18595
18637
|
};
|
18596
18638
|
}, [isActive, imgInfo]);
|
18597
18639
|
const handleMouseEnter = useCallback(() => {
|
18598
|
-
if (
|
18599
|
-
|
18640
|
+
if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
|
18641
|
+
imgsSwiperRef.current.swiper.autoplay.stop();
|
18600
18642
|
}
|
18601
18643
|
}, []);
|
18602
18644
|
const handleMouseLeave = useCallback(() => {
|
18603
|
-
if (
|
18604
|
-
|
18645
|
+
if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
|
18646
|
+
imgsSwiperRef.current.swiper.autoplay.start();
|
18605
18647
|
}
|
18606
18648
|
}, []);
|
18607
18649
|
const handleSlideChange = useCallback((swiper) => {
|
@@ -18622,7 +18664,7 @@ const PictureGroup$4 = ({ imgUrls, width, height, rec, index, onViewImageEndEven
|
|
18622
18664
|
enabled: true
|
18623
18665
|
}
|
18624
18666
|
}
|
18625
|
-
: {}), { loop: true, ref:
|
18667
|
+
: {}), { loop: true, ref: imgsSwiperRef, onSlideChange: handleSlideChange, className: css(Object.assign(Object.assign({ '.swiper-pagination': {
|
18626
18668
|
bottom: (_a = imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.marginBottom) !== null && _a !== void 0 ? _a : 0,
|
18627
18669
|
fontSize: '14px'
|
18628
18670
|
} }, ((imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.dotsBgColor) && {
|
@@ -18639,7 +18681,7 @@ const PictureGroup$4 = ({ imgUrls, width, height, rec, index, onViewImageEndEven
|
|
18639
18681
|
return (React.createElement(SwiperSlide, { key: srcKey, "aria-hidden": srcKey !== swiperActiveIndex },
|
18640
18682
|
React.createElement(Picture, { src: !isLoad && srcKey > 0 ? '' : url, height: height, imgUrlsPostConfig: imgUrlsPostConfig, onShowFirstImage: showFirstImageFn })));
|
18641
18683
|
}))));
|
18642
|
-
};
|
18684
|
+
});
|
18643
18685
|
var PictureGroup$5 = memo(PictureGroup$4);
|
18644
18686
|
|
18645
18687
|
/*
|
@@ -18919,7 +18961,7 @@ var NavBack$1 = memo(NavBack);
|
|
18919
18961
|
* @Author: binruan@chatlabs.com
|
18920
18962
|
* @Date: 2024-03-20 10:27:31
|
18921
18963
|
* @LastEditors: binruan@chatlabs.com
|
18922
|
-
* @LastEditTime: 2025-05-
|
18964
|
+
* @LastEditTime: 2025-05-12 14:26:15
|
18923
18965
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
18924
18966
|
*
|
18925
18967
|
*/
|
@@ -18939,6 +18981,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18939
18981
|
const skipLinkRef = useRef(false);
|
18940
18982
|
const [pageNum, setPageNum] = useState(2);
|
18941
18983
|
const videoWidgetRef = useRef(null);
|
18984
|
+
const pictureGroupRef = useRef(null);
|
18942
18985
|
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();
|
18943
18986
|
const { backMainFeed, productView, jumpToWeb } = useEventReport();
|
18944
18987
|
const isShowFingerTip = useMemo(() => {
|
@@ -18986,7 +19029,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18986
19029
|
(_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
|
18987
19030
|
}, [data, ctaType, swiperRef]);
|
18988
19031
|
const handleSessionCompleted = useCallback((fk) => {
|
18989
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
19032
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
|
18990
19033
|
const item = data === null || data === void 0 ? void 0 : data[activeIndex];
|
18991
19034
|
let fromKName = '';
|
18992
19035
|
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))) {
|
@@ -19013,12 +19056,13 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19013
19056
|
eventSubject: 'sessionCompleted',
|
19014
19057
|
eventDescription: 'Session completed',
|
19015
19058
|
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
19016
|
-
|
19059
|
+
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 : '',
|
19060
|
+
productId: (_r = item === null || item === void 0 ? void 0 : item.product) === null || _r === void 0 ? void 0 : _r.itemId,
|
19017
19061
|
position: activeIndex + '',
|
19018
19062
|
fromKName: fk || fromKName,
|
19019
19063
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
19020
|
-
ctatId: (
|
19021
|
-
traceInfo: (
|
19064
|
+
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 : '',
|
19065
|
+
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 : ''
|
19022
19066
|
}
|
19023
19067
|
});
|
19024
19068
|
}, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime]);
|
@@ -19077,8 +19121,9 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19077
19121
|
refreshFeSession
|
19078
19122
|
]);
|
19079
19123
|
const handleSessionExpire = useCallback(debounce(() => {
|
19080
|
-
var _a;
|
19124
|
+
var _a, _b;
|
19081
19125
|
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
19126
|
+
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
19082
19127
|
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
|
19083
19128
|
}, 1000), [handleSessionCompleted, refreshFeSession]);
|
19084
19129
|
useEffect(() => {
|
@@ -19148,18 +19193,18 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19148
19193
|
return null;
|
19149
19194
|
}, [globalConfig, activeIndex, visList]);
|
19150
19195
|
const renderContent = useCallback((rec, index) => {
|
19151
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
19196
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
19152
19197
|
if (rec === 'organic menu') {
|
19153
19198
|
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)));
|
19154
19199
|
}
|
19155
|
-
if ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null ||
|
19200
|
+
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)) {
|
19156
19201
|
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 })));
|
19157
19202
|
}
|
19158
|
-
if ((
|
19159
|
-
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 }));
|
19203
|
+
if ((_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.imgUrls) {
|
19204
|
+
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 })));
|
19160
19205
|
}
|
19161
|
-
if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((
|
19162
|
-
return (
|
19206
|
+
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) {
|
19207
|
+
return (_m = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _m === void 0 ? void 0 : _m.map((value, idx) => {
|
19163
19208
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
19164
19209
|
const t = resolver[(_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type];
|
19165
19210
|
const Component = withBindDataSource(t);
|
@@ -19197,7 +19242,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19197
19242
|
};
|
19198
19243
|
}, [isShowMore]);
|
19199
19244
|
const renderBottom = useCallback((rec, index) => {
|
19200
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
19245
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
19201
19246
|
if (rec === null || rec === void 0 ? void 0 : rec.video) {
|
19202
19247
|
let cta = null;
|
19203
19248
|
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) {
|
@@ -19206,24 +19251,27 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19206
19251
|
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
|
19207
19252
|
cta = '商品CTA';
|
19208
19253
|
}
|
19254
|
+
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)) {
|
19255
|
+
cta = '服务CTA';
|
19256
|
+
}
|
19209
19257
|
else {
|
19210
|
-
cta = (
|
19258
|
+
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;
|
19211
19259
|
}
|
19212
19260
|
const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
|
19213
19261
|
const isNineProduct = (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nineProductEnable) &&
|
19214
19262
|
index === ((rtcList === null || rtcList === void 0 ? void 0 : rtcList[0]) === 'organic menu' ? 2 : 1) &&
|
19215
|
-
((
|
19263
|
+
((_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));
|
19216
19264
|
return (React.createElement(React.Fragment, null,
|
19217
19265
|
isNineProduct && (React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value, isNineProduct: isNineProduct })),
|
19218
|
-
((
|
19219
|
-
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(
|
19266
|
+
((_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' }),
|
19267
|
+
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` } },
|
19220
19268
|
React.createElement(Nudge, { nudge: nudge }),
|
19221
19269
|
((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' },
|
19222
19270
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
|
19223
19271
|
React.createElement("div", null,
|
19224
|
-
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: (
|
19272
|
+
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 }),
|
19225
19273
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
|
19226
|
-
React.createElement(Hashtag$1, { index: activeIndex, tags: (
|
19274
|
+
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) }))),
|
19227
19275
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
|
19228
19276
|
}
|
19229
19277
|
return null;
|
@@ -19262,7 +19310,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19262
19310
|
return null;
|
19263
19311
|
}, [globalConfig, waterFallData]);
|
19264
19312
|
const handleViewImageStartEnd = (item) => {
|
19265
|
-
var _a, _b, _c, _d, _e, _f;
|
19313
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
19266
19314
|
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)) {
|
19267
19315
|
const endTime = Date.now();
|
19268
19316
|
const duration = viewImageStartTime.current === 0 ? 0 : (endTime - viewImageStartTime.current) / 1000;
|
@@ -19271,10 +19319,11 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19271
19319
|
eventSubject: 'viewImageCarouselEnd',
|
19272
19320
|
eventDescription: 'User end view the image carousel',
|
19273
19321
|
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 : '',
|
19274
|
-
|
19322
|
+
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 : '',
|
19323
|
+
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
19275
19324
|
imageEndTime: `${endTime}`,
|
19276
19325
|
playDuration: `${duration}`,
|
19277
|
-
contentTags: JSON.stringify((
|
19326
|
+
contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
|
19278
19327
|
position: activeIndex + '',
|
19279
19328
|
contentFormat: 'image',
|
19280
19329
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo
|
@@ -19283,7 +19332,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19283
19332
|
}
|
19284
19333
|
};
|
19285
19334
|
const handleSlideSkip = (item, position) => {
|
19286
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
19335
|
+
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;
|
19287
19336
|
if (isPreview || waterFallData)
|
19288
19337
|
return;
|
19289
19338
|
const t = new Date() - curTime.current;
|
@@ -19309,7 +19358,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19309
19358
|
contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
|
19310
19359
|
position: position + '',
|
19311
19360
|
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 : '',
|
19312
|
-
|
19361
|
+
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 : '',
|
19362
|
+
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 : '',
|
19313
19363
|
contentFormat
|
19314
19364
|
}
|
19315
19365
|
});
|
@@ -19319,7 +19369,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19319
19369
|
}
|
19320
19370
|
};
|
19321
19371
|
const handleScrollEvent = (swiper) => {
|
19322
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
|
19372
|
+
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;
|
19323
19373
|
const item = data[swiper.previousIndex];
|
19324
19374
|
if (!item)
|
19325
19375
|
return;
|
@@ -19336,11 +19386,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19336
19386
|
eventSubject: 'scrollDown',
|
19337
19387
|
eventDescription: 'User scroll down',
|
19338
19388
|
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 : '',
|
19339
|
-
|
19389
|
+
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 : '',
|
19390
|
+
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 : '',
|
19340
19391
|
requestId: null,
|
19341
|
-
traceInfo: (
|
19392
|
+
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 : '',
|
19342
19393
|
contentFormat,
|
19343
|
-
position: ((
|
19394
|
+
position: ((_q = swiper.previousIndex) !== null && _q !== void 0 ? _q : 0) + ''
|
19344
19395
|
}
|
19345
19396
|
});
|
19346
19397
|
// 如果上一个商品是图片集,需上报 浏览图片集结结束 事件
|
@@ -19352,12 +19403,13 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19352
19403
|
eventInfo: {
|
19353
19404
|
eventSubject: 'scrollUp',
|
19354
19405
|
eventDescription: 'User scroll up',
|
19355
|
-
contentId: (
|
19356
|
-
|
19406
|
+
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 : '',
|
19407
|
+
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 : '',
|
19408
|
+
productId: (_x = (_w = item.product) === null || _w === void 0 ? void 0 : _w.itemId) !== null && _x !== void 0 ? _x : '',
|
19357
19409
|
requestId: null,
|
19358
|
-
traceInfo: (
|
19410
|
+
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 : '',
|
19359
19411
|
contentFormat,
|
19360
|
-
position: ((
|
19412
|
+
position: ((_2 = swiper.previousIndex) !== null && _2 !== void 0 ? _2 : 0) + ''
|
19361
19413
|
}
|
19362
19414
|
});
|
19363
19415
|
// 如果上一个商品是图片集,需上报 浏览图片集结结束 事件
|
@@ -19383,7 +19435,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19383
19435
|
}
|
19384
19436
|
}, [openHashtag, data, activeIndex]);
|
19385
19437
|
const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
|
19386
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
19438
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
19387
19439
|
const item = data[activeIndex];
|
19388
19440
|
// 如果是图片集则上报事件
|
19389
19441
|
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)) {
|
@@ -19394,9 +19446,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19394
19446
|
eventSubject: 'viewImageCarouselStart',
|
19395
19447
|
eventDescription: 'User start view the image carousel',
|
19396
19448
|
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 : '',
|
19397
|
-
|
19449
|
+
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 : '',
|
19450
|
+
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
19398
19451
|
imageStartTime: `${startTime}`,
|
19399
|
-
contentTags: JSON.stringify((
|
19452
|
+
contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
|
19400
19453
|
position: activeIndex + '',
|
19401
19454
|
contentFormat: 'image',
|
19402
19455
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
|
@@ -19406,11 +19459,11 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19406
19459
|
if (enableCapi) {
|
19407
19460
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
19408
19461
|
eventName: 'ViewContent',
|
19409
|
-
product: (
|
19462
|
+
product: (_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.bindProduct
|
19410
19463
|
});
|
19411
19464
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
19412
19465
|
eventName: 'PageView',
|
19413
|
-
product: (
|
19466
|
+
product: (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.bindProduct
|
19414
19467
|
});
|
19415
19468
|
}
|
19416
19469
|
}
|
@@ -19502,15 +19555,20 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19502
19555
|
swiperRef.current.swiper.allowTouchMove = true;
|
19503
19556
|
}, 500);
|
19504
19557
|
}, onActiveIndexChange: (swiper) => {
|
19558
|
+
var _a, _b;
|
19505
19559
|
setActiveIndex(swiper.activeIndex);
|
19506
19560
|
if (openHashtag)
|
19507
19561
|
return;
|
19508
19562
|
// 处理上滑下滑事件
|
19509
19563
|
handleScrollEvent(swiper);
|
19510
|
-
if (waterFallData || isEditor
|
19564
|
+
if (waterFallData || isEditor)
|
19511
19565
|
return;
|
19512
19566
|
if ((swiper === null || swiper === void 0 ? void 0 : swiper.activeIndex) + 1 >= (data === null || data === void 0 ? void 0 : data.length)) {
|
19513
19567
|
if (!isLoadMore) {
|
19568
|
+
if (isDiyH5) {
|
19569
|
+
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
19570
|
+
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
19571
|
+
}
|
19514
19572
|
setIsLoadMore(true);
|
19515
19573
|
loadVideos === null || loadVideos === void 0 ? void 0 : loadVideos(pageNum).then((res) => {
|
19516
19574
|
var _a;
|
@@ -19563,7 +19621,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19563
19621
|
}, []);
|
19564
19622
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
19565
19623
|
const handlePlaying = useCallback(() => {
|
19566
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
19624
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
19567
19625
|
setIsPauseVideo(false);
|
19568
19626
|
const item = data[index];
|
19569
19627
|
if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
|
@@ -19576,14 +19634,15 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19576
19634
|
eventSubject: 'playVideo',
|
19577
19635
|
eventDescription: 'User played the video',
|
19578
19636
|
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 : '',
|
19579
|
-
|
19637
|
+
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 : '',
|
19638
|
+
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 : '',
|
19580
19639
|
playType,
|
19581
19640
|
startTime: videoCurrentTime,
|
19582
19641
|
videoDuration,
|
19583
|
-
contentTags: JSON.stringify((
|
19642
|
+
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 : []),
|
19584
19643
|
position: index + '',
|
19585
19644
|
contentFormat: 'video',
|
19586
|
-
traceInfo: (
|
19645
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
19587
19646
|
}
|
19588
19647
|
});
|
19589
19648
|
setIsFirstPlay(false);
|
@@ -19622,7 +19681,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19622
19681
|
}
|
19623
19682
|
}, [isLoadFinish]);
|
19624
19683
|
const onPause = useCallback(() => {
|
19625
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
19684
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
19626
19685
|
const item = data[index];
|
19627
19686
|
const videoDuration = ((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
|
19628
19687
|
const videoCurrentTime = ((_d = (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
|
@@ -19633,14 +19692,15 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19633
19692
|
eventSubject: 'playOverVideo',
|
19634
19693
|
eventDescription: 'User finished playing the video',
|
19635
19694
|
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 : '',
|
19636
|
-
|
19695
|
+
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 : '',
|
19696
|
+
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 : '',
|
19637
19697
|
endTime: videoCurrentTime,
|
19638
19698
|
videoDuration,
|
19639
19699
|
playDuration,
|
19640
|
-
contentTags: JSON.stringify((
|
19700
|
+
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 : []),
|
19641
19701
|
position: index + '',
|
19642
19702
|
contentFormat: 'video',
|
19643
|
-
traceInfo: (
|
19703
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
19644
19704
|
}
|
19645
19705
|
});
|
19646
19706
|
}
|