pb-sxp-ui 1.11.1 → 1.12.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +90 -83
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +90 -83
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +5 -5
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +5 -5
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +90 -83
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +5 -5
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/SxpPageCore/index.js +1 -1
- package/es/core/components/SxpPageRender/PictureGroup/index.js +5 -3
- package/es/core/components/SxpPageRender/VideoWidget/index.js +5 -18
- package/es/core/components/SxpPageRender/index.d.ts +1 -0
- package/es/core/components/SxpPageRender/index.js +66 -38
- package/es/core/context/SxpDataSourceProvider.d.ts +1 -1
- package/es/core/context/SxpDataSourceProvider.js +14 -23
- package/lib/core/components/SxpPageCore/index.js +1 -1
- package/lib/core/components/SxpPageRender/PictureGroup/index.js +5 -3
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +5 -18
- package/lib/core/components/SxpPageRender/index.d.ts +1 -0
- package/lib/core/components/SxpPageRender/index.js +65 -37
- package/lib/core/context/SxpDataSourceProvider.d.ts +1 -1
- package/lib/core/context/SxpDataSourceProvider.js +14 -23
- package/package.json +1 -1
package/dist/index.js
CHANGED
@@ -832,22 +832,26 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
832
832
|
setCacheRtcList(cacheRtcList.concat(getFilterRecList(data)));
|
833
833
|
return data;
|
834
834
|
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
|
835
|
-
const refreshFeSession = useCallback((enableReSid) => {
|
835
|
+
const refreshFeSession = useCallback((enableReSid, event) => {
|
836
836
|
var _a, _b, _c, _d, _e;
|
837
|
+
let expire = false;
|
837
838
|
const defaultGlobalConfig = (_b = (_a = data === null || data === void 0 ? void 0 : data.data) === null || _a === void 0 ? void 0 : _a.sxpPageConf) === null || _b === void 0 ? void 0 : _b.globalConfig;
|
838
839
|
if ((_c = defaultGlobalConfig === null || defaultGlobalConfig === void 0 ? void 0 : defaultGlobalConfig.session) === null || _c === void 0 ? void 0 : _c.enable) {
|
839
840
|
const sessionStartTime = localStorage.getItem('sessionStartTime');
|
840
|
-
const sst = sessionStartTime ?
|
841
|
-
if (Math.floor((new Date() - sst) /
|
841
|
+
const sst = sessionStartTime ? JSON.parse(sessionStartTime) : new Date().getTime();
|
842
|
+
if (Math.floor((new Date().getTime() - sst) / 1000 / 60) >=
|
842
843
|
((_e = (_d = defaultGlobalConfig === null || defaultGlobalConfig === void 0 ? void 0 : defaultGlobalConfig.session) === null || _d === void 0 ? void 0 : _d.expires) !== null && _e !== void 0 ? _e : 30)) {
|
844
|
+
event === null || event === void 0 ? void 0 : event('sessionTimeOut');
|
843
845
|
refreshFeSessionId();
|
844
846
|
curTime.current = new Date();
|
847
|
+
expire = true;
|
845
848
|
}
|
846
|
-
localStorage.setItem('sessionStartTime', new Date().
|
849
|
+
localStorage.setItem('sessionStartTime', JSON.stringify(new Date().getTime()));
|
847
850
|
}
|
848
851
|
else if (enableReSid) {
|
849
852
|
refreshFeSessionId();
|
850
853
|
}
|
854
|
+
return expire;
|
851
855
|
}, [data]);
|
852
856
|
const bffEventReport = useCallback(({ userInfo, eventInfo, reportLayId = true }) => {
|
853
857
|
// 关闭 BFF 事件上报
|
@@ -861,7 +865,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
861
865
|
// tpChannelId: 'H5' // 后端处理
|
862
866
|
};
|
863
867
|
}
|
864
|
-
refreshFeSession();
|
865
868
|
const sessionID = storeAndLoadFeSessionId();
|
866
869
|
const ef = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ sessionID, rtc: curReqInfo.rtc, requestId: curReqInfo.requestId }, { playbookType }), (layoutVariantId && reportLayId && { layoutVariantId })), eventInfo), (getDevice$1() && { sxpDevice: getDevice$1() })), (getSystem() && { sxpSystem: getSystem() })), (getBrowserInfo() && { sxpBrowser: getBrowserInfo() })), ((eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) && channel && { position: Number(eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) + 1 + '' }));
|
867
870
|
const realUserInfo = Object.entries(userInfo).map(([k, v]) => ({ name: k, value: v }));
|
@@ -877,16 +880,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
877
880
|
body: { userInfo: realUserInfo, eventInfo: realEventInfo },
|
878
881
|
type: 'beacon'
|
879
882
|
});
|
880
|
-
}, [
|
881
|
-
bffFetch,
|
882
|
-
curReqInfo,
|
883
|
-
enableReportEvent,
|
884
|
-
globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
|
885
|
-
layoutVariantId,
|
886
|
-
globalConfig,
|
887
|
-
playbookType,
|
888
|
-
refreshFeSession
|
889
|
-
]);
|
883
|
+
}, [bffFetch, curReqInfo, enableReportEvent, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview, layoutVariantId, globalConfig, playbookType]);
|
890
884
|
const bffFbReport = useCallback(({ eventName, product }) => {
|
891
885
|
var _a, _b, _c, _d, _e;
|
892
886
|
if (!enableReportEvent ||
|
@@ -1012,7 +1006,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1012
1006
|
});
|
1013
1007
|
}, [bffEventReport, isFromHashtag]);
|
1014
1008
|
const h5EnterLink = useCallback(() => {
|
1015
|
-
var _a, _b
|
1009
|
+
var _a, _b;
|
1016
1010
|
const queryString = location.search.slice(1);
|
1017
1011
|
const params = qs.parse(queryString.replace(/\+/g, '%2B'));
|
1018
1012
|
for (const key in params) {
|
@@ -1020,10 +1014,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1020
1014
|
}
|
1021
1015
|
const getVal = (key) => { var _a; return (_a = params[key]) !== null && _a !== void 0 ? _a : ''; };
|
1022
1016
|
const time = new Date();
|
1023
|
-
|
1024
|
-
if (!((_c = defaultGlobalConfig === null || defaultGlobalConfig === void 0 ? void 0 : defaultGlobalConfig.session) === null || _c === void 0 ? void 0 : _c.enable) || !(curTime === null || curTime === void 0 ? void 0 : curTime.current)) {
|
1025
|
-
curTime.current = time;
|
1026
|
-
}
|
1017
|
+
curTime.current = time;
|
1027
1018
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
1028
1019
|
eventInfo: {
|
1029
1020
|
eventSubject: 'h5LinkEnterFeed',
|
@@ -1035,16 +1026,16 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1035
1026
|
utmContent: getVal('utm_content'),
|
1036
1027
|
enterTime: Math.floor(time / 1000) + '',
|
1037
1028
|
requestId: null,
|
1038
|
-
enterUrl: (
|
1029
|
+
enterUrl: (_b = (_a = window === null || window === void 0 ? void 0 : window.location) === null || _a === void 0 ? void 0 : _a.href) !== null && _b !== void 0 ? _b : '',
|
1039
1030
|
clSource: getVal('cl_source')
|
1040
1031
|
},
|
1041
1032
|
reportLayId: false
|
1042
1033
|
});
|
1043
|
-
}, [bffEventReport
|
1034
|
+
}, [bffEventReport]);
|
1044
1035
|
useEffect(() => {
|
1045
1036
|
if (!isShowConsent)
|
1046
1037
|
h5EnterLink();
|
1047
|
-
}, [isShowConsent
|
1038
|
+
}, [isShowConsent]);
|
1048
1039
|
useEffect(() => {
|
1049
1040
|
if (isShowConsent || isPreview)
|
1050
1041
|
return;
|
@@ -17171,7 +17162,6 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
17171
17162
|
const { bffEventReport, sxpParameter, waterFallData, openHashtag, bffFbReport } = useSxpDataSource();
|
17172
17163
|
const videoStartTime = useRef(0);
|
17173
17164
|
const [isLoadFinish, setIsLoadFinish] = useState(false);
|
17174
|
-
const [isFirstPlay, setIsFirstPlay] = useState(true);
|
17175
17165
|
const { isActive } = useSwiperSlide();
|
17176
17166
|
const canvasRef = useRef(null);
|
17177
17167
|
const [firstFrameSrc, setFirstFrameSrc] = useState('');
|
@@ -17182,6 +17172,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
17182
17172
|
const hlsRef = useRef(null);
|
17183
17173
|
const initTimeRef = useRef();
|
17184
17174
|
const loadedTimeRef = useRef();
|
17175
|
+
const isFirstPlayRef = useRef(true);
|
17185
17176
|
const blur = useMemo(() => {
|
17186
17177
|
return (videoPostConfig === null || videoPostConfig === void 0 ? void 0 : videoPostConfig.mode) === '2';
|
17187
17178
|
}, [videoPostConfig]);
|
@@ -17237,26 +17228,13 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
17237
17228
|
videoStartTime.current = ((_b = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _b === void 0 ? void 0 : _b.currentTime) || 0;
|
17238
17229
|
const videoDuration = ((_d = (_c = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _c === void 0 ? void 0 : _c.duration) !== null && _d !== void 0 ? _d : 0).toFixed(2);
|
17239
17230
|
const videoCurrentTime = ((_f = (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.currentTime) !== null && _f !== void 0 ? _f : 0).toFixed(2);
|
17240
|
-
const playType =
|
17231
|
+
const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
|
17241
17232
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
17242
|
-
eventInfo: {
|
17243
|
-
eventSubject: 'playVideo',
|
17244
|
-
eventDescription: 'User played the video',
|
17245
|
-
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 : '',
|
17246
|
-
contentName: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.title) !== null && _k !== void 0 ? _k : '',
|
17247
|
-
playType,
|
17248
|
-
startTime: videoCurrentTime,
|
17249
|
-
videoDuration,
|
17250
|
-
contentTags: JSON.stringify((_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.tags) !== null && _m !== void 0 ? _m : []),
|
17251
|
-
position: index + '',
|
17252
|
-
contentFormat: 'video',
|
17253
|
-
traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo,
|
17254
|
-
loadTime: (loadedTimeRef === null || loadedTimeRef === void 0 ? void 0 : loadedTimeRef.current) - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current) + ''
|
17255
|
-
}
|
17233
|
+
eventInfo: Object.assign({ eventSubject: 'playVideo', eventDescription: 'User played the video', 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 : '', contentName: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.title) !== null && _k !== void 0 ? _k : '', playType, startTime: videoCurrentTime, videoDuration, contentTags: JSON.stringify((_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.tags) !== null && _m !== void 0 ? _m : []), position: index + '', contentFormat: 'video', traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.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) + '' }))
|
17256
17234
|
});
|
17257
|
-
|
17235
|
+
isFirstPlayRef.current = false;
|
17258
17236
|
}
|
17259
|
-
}), [bffEventReport, data, index,
|
17237
|
+
}), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
17260
17238
|
const handLoadeddata = useCallback(() => {
|
17261
17239
|
var _a;
|
17262
17240
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
|
@@ -17615,13 +17593,14 @@ const Picture = (props) => {
|
|
17615
17593
|
|
17616
17594
|
const PictureGroup$2 = ({ imgUrls, width, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig }) => {
|
17617
17595
|
var _a, _b;
|
17618
|
-
const swiperRef = useRef();
|
17619
17596
|
const { isActive } = useSwiperSlide();
|
17620
17597
|
const { sxpParameter, openHashtag } = useSxpDataSource();
|
17621
17598
|
const [isLoad, setIsLoad] = useState(false);
|
17622
17599
|
const [imgInfo, setImgInfo] = useState();
|
17623
|
-
const initTime = new Date();
|
17624
17600
|
const [swiperActiveIndex, setSwiperActiveIndex] = useState(0);
|
17601
|
+
const swiperRef = useRef();
|
17602
|
+
const isFirstPlayRef = useRef(true);
|
17603
|
+
const initTime = new Date();
|
17625
17604
|
useEffect(() => {
|
17626
17605
|
if (isLoad && isActive) {
|
17627
17606
|
(swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) && swiperRef.current.swiper.autoplay.start();
|
@@ -17629,7 +17608,8 @@ const PictureGroup$2 = ({ imgUrls, width, height, rec, index, onViewImageEndEven
|
|
17629
17608
|
onViewImageEndEvent(rec);
|
17630
17609
|
}
|
17631
17610
|
else {
|
17632
|
-
onViewImageStartEvent(index, imgInfo, true);
|
17611
|
+
onViewImageStartEvent(index, isFirstPlayRef.current ? imgInfo : undefined, true);
|
17612
|
+
isFirstPlayRef.current = false;
|
17633
17613
|
}
|
17634
17614
|
}
|
17635
17615
|
else {
|
@@ -17984,11 +17964,11 @@ var NavBack$1 = memo(NavBack);
|
|
17984
17964
|
* @Author: binruan@chatlabs.com
|
17985
17965
|
* @Date: 2024-03-20 10:27:31
|
17986
17966
|
* @LastEditors: binruan@chatlabs.com
|
17987
|
-
* @LastEditTime: 2024-12-
|
17967
|
+
* @LastEditTime: 2024-12-17 19:01:02
|
17988
17968
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
17989
17969
|
*
|
17990
17970
|
*/
|
17991
|
-
const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, hashTagRightMargin, tagList = [],
|
17971
|
+
const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, hashTagRightMargin, tagList = [], defaultData }) => {
|
17992
17972
|
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;
|
17993
17973
|
const mutedIcon = useIconLink('/pb_static/5beaaa5ce7f3477b99db3838619cc471.png');
|
17994
17974
|
const unmutedIcon = useIconLink('/pb_static/fea8668a8a894e4aa3a86bcc775e895e.png');
|
@@ -18018,12 +17998,17 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18018
17998
|
}
|
18019
17999
|
}, [data === null || data === void 0 ? void 0 : data.length]);
|
18020
18000
|
const handleH5EnterLink = useCallback(() => {
|
18001
|
+
var _a, _b, _c;
|
18002
|
+
const defaultGlobalConfig = (_b = (_a = defaultData === null || defaultData === void 0 ? void 0 : defaultData.data) === null || _a === void 0 ? void 0 : _a.sxpPageConf) === null || _b === void 0 ? void 0 : _b.globalConfig;
|
18003
|
+
if (!((_c = defaultGlobalConfig === null || defaultGlobalConfig === void 0 ? void 0 : defaultGlobalConfig.session) === null || _c === void 0 ? void 0 : _c.enable)) {
|
18004
|
+
refreshFeSessionId();
|
18005
|
+
}
|
18021
18006
|
h5EnterLink === null || h5EnterLink === void 0 ? void 0 : h5EnterLink();
|
18022
18007
|
if (data.length > 0) {
|
18023
18008
|
const now = new Date();
|
18024
18009
|
viewTime.current = now;
|
18025
18010
|
}
|
18026
|
-
}, [data.length, h5EnterLink]);
|
18011
|
+
}, [data.length, h5EnterLink, defaultData]);
|
18027
18012
|
useEffect(() => {
|
18028
18013
|
var _a;
|
18029
18014
|
if (!ctaType || (ctaType === null || ctaType === void 0 ? void 0 : ctaType.length) < 1)
|
@@ -18044,10 +18029,46 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18044
18029
|
if (index !== -1)
|
18045
18030
|
(_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
|
18046
18031
|
}, [data, ctaType, swiperRef]);
|
18032
|
+
const handleSessionCompleted = useCallback((fk) => {
|
18033
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
18034
|
+
const item = data === null || data === void 0 ? void 0 : data[activeIndex];
|
18035
|
+
let fromKName = '';
|
18036
|
+
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))) {
|
18037
|
+
fromKName = 'pdpPage';
|
18038
|
+
}
|
18039
|
+
else if (popupDetailData && ((_g = tempMap === null || tempMap === void 0 ? void 0 : tempMap[(_f = (_e = (_d = item === null || item === void 0 ? void 0 : item.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId) !== null && _f !== void 0 ? _f : ''].item) === null || _g === void 0 ? void 0 : _g.type) === 'Appoint') {
|
18040
|
+
fromKName = 'formPage';
|
18041
|
+
}
|
18042
|
+
else if (isFromHashtag) {
|
18043
|
+
fromKName = 'hashTagPage';
|
18044
|
+
}
|
18045
|
+
else if ((_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.url) {
|
18046
|
+
fromKName = 'videoPage';
|
18047
|
+
}
|
18048
|
+
else if (((_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.imgUrls) && ((_l = (_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.imgUrls) === null || _l === void 0 ? void 0 : _l.length)) {
|
18049
|
+
fromKName = 'imagePage';
|
18050
|
+
}
|
18051
|
+
else if (item === null || item === void 0 ? void 0 : item.product) {
|
18052
|
+
fromKName = 'productPage';
|
18053
|
+
}
|
18054
|
+
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
18055
|
+
eventInfo: {
|
18056
|
+
sessionDuration: Math.floor((new Date() - curTime.current) / 1000) + '',
|
18057
|
+
eventSubject: 'sessionCompleted',
|
18058
|
+
eventDescription: 'Session completed',
|
18059
|
+
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
18060
|
+
productId: (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.itemId,
|
18061
|
+
position: activeIndex + '',
|
18062
|
+
fromKName: fk ? fk : fromKName,
|
18063
|
+
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
18064
|
+
ctatId: (_r = (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.bindCta) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
|
18065
|
+
traceInfo: (_v = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_u = item === null || item === void 0 ? void 0 : item.product) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : ''
|
18066
|
+
}
|
18067
|
+
});
|
18068
|
+
}, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime]);
|
18047
18069
|
useEffect(() => {
|
18048
18070
|
const item = data === null || data === void 0 ? void 0 : data[activeIndex];
|
18049
18071
|
const visibleChange = () => {
|
18050
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
18051
18072
|
const repCond = !openHashtag && !isShowConsent;
|
18052
18073
|
if (document.visibilityState === 'hidden') {
|
18053
18074
|
// 当用户导航到新页面、切换标签页、关闭标签页、最小化或关闭浏览器、刷新原页面(即离开原页面时),或者在移动设备上从浏览器切换到不同的应用程序时
|
@@ -18056,40 +18077,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18056
18077
|
SXP_EVENT_BUS.emit(SXP_EVENT_TYPE.PAGE_DID_HIDE, item);
|
18057
18078
|
handleReportProductView(item);
|
18058
18079
|
}
|
18059
|
-
let fromKName = '';
|
18060
|
-
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))) {
|
18061
|
-
fromKName = 'pdpPage';
|
18062
|
-
}
|
18063
|
-
else if (popupDetailData && ((_g = tempMap === null || tempMap === void 0 ? void 0 : tempMap[(_f = (_e = (_d = item === null || item === void 0 ? void 0 : item.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId) !== null && _f !== void 0 ? _f : ''].item) === null || _g === void 0 ? void 0 : _g.type) === 'Appoint') {
|
18064
|
-
fromKName = 'formPage';
|
18065
|
-
}
|
18066
|
-
else if (isFromHashtag) {
|
18067
|
-
fromKName = 'hashTagPage';
|
18068
|
-
}
|
18069
|
-
else if ((_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.url) {
|
18070
|
-
fromKName = 'videoPage';
|
18071
|
-
}
|
18072
|
-
else if (((_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.imgUrls) && ((_l = (_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.imgUrls) === null || _l === void 0 ? void 0 : _l.length)) {
|
18073
|
-
fromKName = 'imagePage';
|
18074
|
-
}
|
18075
|
-
else if (item === null || item === void 0 ? void 0 : item.product) {
|
18076
|
-
fromKName = 'productPage';
|
18077
|
-
}
|
18078
18080
|
if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.playbook) !== 'organic menu' || activeIndex !== 0 || channel) {
|
18079
|
-
|
18080
|
-
|
18081
|
-
|
18082
|
-
eventSubject: 'sessionCompleted',
|
18083
|
-
eventDescription: 'Session completed',
|
18084
|
-
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
18085
|
-
productId: (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.itemId,
|
18086
|
-
position: activeIndex + '',
|
18087
|
-
fromKName,
|
18088
|
-
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
18089
|
-
ctatId: (_r = (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.bindCta) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
|
18090
|
-
traceInfo: (_v = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_u = item === null || item === void 0 ? void 0 : item.product) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : ''
|
18091
|
-
}
|
18092
|
-
});
|
18081
|
+
const isExpire = refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(true, handleSessionCompleted);
|
18082
|
+
if (!isExpire)
|
18083
|
+
handleSessionCompleted();
|
18093
18084
|
}
|
18094
18085
|
}
|
18095
18086
|
else if (document.visibilityState === 'visible') {
|
@@ -18122,8 +18113,24 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18122
18113
|
openHashtag,
|
18123
18114
|
isShowConsent,
|
18124
18115
|
selectTag,
|
18125
|
-
channel
|
18116
|
+
channel,
|
18117
|
+
handleSessionCompleted,
|
18118
|
+
refreshFeSession
|
18126
18119
|
]);
|
18120
|
+
const handleSessionExpire = useCallback(debounce(() => {
|
18121
|
+
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
|
18122
|
+
}, 1000), [handleSessionCompleted, refreshFeSession]);
|
18123
|
+
useEffect(() => {
|
18124
|
+
const events = ['touchstart', 'touchcancel'];
|
18125
|
+
events.forEach((event) => {
|
18126
|
+
window.addEventListener(event, handleSessionExpire);
|
18127
|
+
});
|
18128
|
+
return () => {
|
18129
|
+
events.forEach((event) => {
|
18130
|
+
window.removeEventListener(event, handleSessionExpire);
|
18131
|
+
});
|
18132
|
+
};
|
18133
|
+
}, [handleSessionExpire]);
|
18127
18134
|
const tagHeight = useMemo(() => {
|
18128
18135
|
let h = 0;
|
18129
18136
|
if (tagList.length > 0) {
|
@@ -19047,7 +19054,7 @@ const SxpPageCore = ({ data, maxSize = 10, defaultSize = 10, hashTagSize = 20, l
|
|
19047
19054
|
React.createElement(SxpDataSourceProvider$1, { utmVal: utmVal, dataSources: data === null || data === void 0 ? void 0 : data.data_sources, sxpParameter: data === null || data === void 0 ? void 0 : data.sxp_parameter, maxSize: (_b = (_a = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _a === void 0 ? void 0 : _a.personalized_recommend) !== null && _b !== void 0 ? _b : maxSize, defaultSize: (_d = (_c = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _c === void 0 ? void 0 : _c.default_recommend) !== null && _d !== void 0 ? _d : defaultSize, hashTagSize: (_f = (_e = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _e === void 0 ? void 0 : _e.hash_tag_size) !== null && _f !== void 0 ? _f : hashTagSize, loadingImage: loadingImage, appDomain: appDomain, enabledMetaConversionApi: enabledMetaConversionApi, utmParameter: data === null || data === void 0 ? void 0 : data.utm_parameter, data: data, dataList: dataList, onUpdateSchema: (d) => setSchema(d), onUpdateChannel: (d) => setChannel(d), render: ({ rtcList, tagList, pageData }) => {
|
19048
19055
|
var _a;
|
19049
19056
|
return (React.createElement(React.Fragment, null,
|
19050
|
-
React.createElement(SxpPageRender, Object.assign({}, (_a = pageData === null || pageData === void 0 ? void 0 : pageData.data) === null || _a === void 0 ? void 0 : _a.sxpPageConf, { tagList: tagList, data: rtcList, resolver: RESOLVER })),
|
19057
|
+
React.createElement(SxpPageRender, Object.assign({ defaultData: data }, (_a = pageData === null || pageData === void 0 ? void 0 : pageData.data) === null || _a === void 0 ? void 0 : _a.sxpPageConf, { tagList: tagList, data: rtcList, resolver: RESOLVER })),
|
19051
19058
|
React.createElement(Popup, null)));
|
19052
19059
|
} })));
|
19053
19060
|
};
|