pb-sxp-ui 1.16.6 → 1.16.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +128 -162
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +128 -162
- 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 +128 -162
- 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 +8 -10
- package/es/core/components/SxpPageRender/LikeButton/index.js +15 -17
- package/es/core/components/SxpPageRender/PictureGroup/index.d.ts +0 -5
- package/es/core/components/SxpPageRender/PictureGroup/index.js +13 -42
- package/es/core/components/SxpPageRender/VideoWidget/index.js +44 -34
- package/es/core/components/SxpPageRender/WaterFall/index.js +3 -4
- package/es/core/components/SxpPageRender/index.js +38 -47
- package/es/core/context/SxpDataSourceProvider.js +2 -2
- package/es/core/hooks/useEventReport.js +5 -6
- package/lib/core/components/DiyPortalPreview/VideoWidget.js +8 -10
- package/lib/core/components/SxpPageRender/LikeButton/index.js +15 -17
- package/lib/core/components/SxpPageRender/PictureGroup/index.d.ts +0 -5
- package/lib/core/components/SxpPageRender/PictureGroup/index.js +12 -41
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +44 -34
- package/lib/core/components/SxpPageRender/WaterFall/index.js +3 -4
- package/lib/core/components/SxpPageRender/index.js +38 -47
- package/lib/core/context/SxpDataSourceProvider.js +2 -2
- package/lib/core/hooks/useEventReport.js +5 -6
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -1086,7 +1086,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1086
1086
|
}
|
|
1087
1087
|
}), [bffFetch, utmVal]);
|
|
1088
1088
|
const ctaEvent = React.useCallback((eventInfo, rec, product, position) => {
|
|
1089
|
-
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
|
|
1089
|
+
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;
|
|
1090
1090
|
const cta = product === null || product === void 0 ? void 0 : product.bindCta;
|
|
1091
1091
|
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);
|
|
1092
1092
|
let fromKName = '';
|
|
@@ -1104,7 +1104,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
|
1104
1104
|
}
|
|
1105
1105
|
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;
|
|
1106
1106
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
1107
|
-
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 : '',
|
|
1107
|
+
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: (_10 = (_7 = (_2 = (_y = (_v = cta === null || cta === void 0 ? void 0 : cta.traceInfo) !== null && _v !== void 0 ? _v : (_x = (_w = rec === null || rec === void 0 ? void 0 : rec.video) === null || _w === void 0 ? void 0 : _w.bindCta) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : (_1 = (_0 = (_z = rec === null || rec === void 0 ? void 0 : rec.video) === null || _z === void 0 ? void 0 : _z.bindProduct) === null || _0 === void 0 ? void 0 : _0.bindCta) === null || _1 === void 0 ? void 0 : _1.traceInfo) !== null && _2 !== void 0 ? _2 : (_6 = (_5 = (_4 = (_3 = rec === null || rec === void 0 ? void 0 : rec.video) === null || _3 === void 0 ? void 0 : _3.bindProducts) === null || _4 === void 0 ? void 0 : _4[0]) === null || _5 === void 0 ? void 0 : _5.bindCta) === null || _6 === void 0 ? void 0 : _6.traceInfo) !== null && _7 !== void 0 ? _7 : (_9 = (_8 = rec === null || rec === void 0 ? void 0 : rec.product) === null || _8 === void 0 ? void 0 : _8.bindCta) === null || _9 === void 0 ? void 0 : _9.traceInfo) !== null && _10 !== void 0 ? _10 : '', fromKName, fromKPage: (_11 = location === null || location === void 0 ? void 0 : location.href) !== null && _11 !== void 0 ? _11 : '', contentFormat })
|
|
1108
1108
|
});
|
|
1109
1109
|
}, [bffEventReport, isFromHashtag]);
|
|
1110
1110
|
const h5EnterLink = React.useCallback(() => {
|
|
@@ -1765,14 +1765,14 @@ var settingRender$f = [
|
|
|
1765
1765
|
* @Author: binruan@chatlabs.com
|
|
1766
1766
|
* @Date: 2024-03-12 10:59:06
|
|
1767
1767
|
* @LastEditors: binruan@chatlabs.com
|
|
1768
|
-
* @LastEditTime:
|
|
1768
|
+
* @LastEditTime: 2024-11-28 11:17:16
|
|
1769
1769
|
* @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
|
|
1770
1770
|
*
|
|
1771
1771
|
*/
|
|
1772
1772
|
function useEventReport() {
|
|
1773
1773
|
const { bffEventReport, popupDetailData, isFromHashtag, eventTimeList, setEventTimeList } = useSxpDataSource();
|
|
1774
1774
|
const jumpToWeb = React.useCallback((e, data, product, cta, position, traceInfo) => {
|
|
1775
|
-
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
|
|
1775
|
+
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;
|
|
1776
1776
|
const i = eventTimeList === null || eventTimeList === void 0 ? void 0 : eventTimeList.findIndex((item) => item.target === (e === null || e === void 0 ? void 0 : e.target));
|
|
1777
1777
|
if (i !== -1) {
|
|
1778
1778
|
return;
|
|
@@ -1805,11 +1805,11 @@ function useEventReport() {
|
|
|
1805
1805
|
contentFormat = 'image';
|
|
1806
1806
|
}
|
|
1807
1807
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
1808
|
-
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 : '',
|
|
1808
|
+
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 : '', ctatId: (_0 = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _0 !== void 0 ? _0 : '', traceInfo: (_13 = (_10 = (_8 = (_4 = (_1 = traceInfo !== null && traceInfo !== void 0 ? traceInfo : product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _1 !== void 0 ? _1 : (_3 = (_2 = data === null || data === void 0 ? void 0 : data.video) === null || _2 === void 0 ? void 0 : _2.bindProduct) === null || _3 === void 0 ? void 0 : _3.traceInfo) !== null && _4 !== void 0 ? _4 : (_7 = (_6 = (_5 = data === null || data === void 0 ? void 0 : data.video) === null || _5 === void 0 ? void 0 : _5.bindProducts) === null || _6 === void 0 ? void 0 : _6[0]) === null || _7 === void 0 ? void 0 : _7.traceInfo) !== null && _8 !== void 0 ? _8 : (_9 = data === null || data === void 0 ? void 0 : data.product) === null || _9 === void 0 ? void 0 : _9.traceInfo) !== null && _10 !== void 0 ? _10 : (_12 = (_11 = data === null || data === void 0 ? void 0 : data.video) === null || _11 === void 0 ? void 0 : _11.bindCta) === null || _12 === void 0 ? void 0 : _12.traceInfo) !== null && _13 !== void 0 ? _13 : '' }, (contentFormat && { contentFormat }))
|
|
1809
1809
|
});
|
|
1810
1810
|
}, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
|
|
1811
1811
|
const productView = React.useCallback((data, product, cta, viewTime, position) => {
|
|
1812
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p
|
|
1812
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
|
1813
1813
|
let fromKName = '';
|
|
1814
1814
|
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))) {
|
|
1815
1815
|
fromKName = 'pdpPage';
|
|
@@ -1828,9 +1828,8 @@ function useEventReport() {
|
|
|
1828
1828
|
contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags),
|
|
1829
1829
|
position: position + '',
|
|
1830
1830
|
contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
|
1831
|
-
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 : '',
|
|
1832
1831
|
ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
|
|
1833
|
-
traceInfo: (
|
|
1832
|
+
traceInfo: (_p = (_m = (_h = (_e = product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _e !== void 0 ? _e : (_g = (_f = data === null || data === void 0 ? void 0 : data.video) === null || _f === void 0 ? void 0 : _f.bindProduct) === null || _g === void 0 ? void 0 : _g.traceInfo) !== null && _h !== void 0 ? _h : (_l = (_k = (_j = data === null || data === void 0 ? void 0 : data.video) === null || _j === void 0 ? void 0 : _j.bindProducts) === null || _k === void 0 ? void 0 : _k[0]) === null || _l === void 0 ? void 0 : _l.traceInfo) !== null && _m !== void 0 ? _m : (_o = data === null || data === void 0 ? void 0 : data.product) === null || _o === void 0 ? void 0 : _o.traceInfo) !== null && _p !== void 0 ? _p : '',
|
|
1834
1833
|
timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
|
|
1835
1834
|
eventSubject: 'productView',
|
|
1836
1835
|
eventDescription: 'User browsed the product'
|
|
@@ -15633,7 +15632,7 @@ function WaterfallList(_a) {
|
|
|
15633
15632
|
* @Author: binruan@chatlabs.com
|
|
15634
15633
|
* @Date: 2024-01-10 10:58:24
|
|
15635
15634
|
* @LastEditors: binruan@chatlabs.com
|
|
15636
|
-
* @LastEditTime: 2025-
|
|
15635
|
+
* @LastEditTime: 2025-02-28 10:00:31
|
|
15637
15636
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\WaterFall\index.tsx
|
|
15638
15637
|
*
|
|
15639
15638
|
*/
|
|
@@ -15671,7 +15670,7 @@ const WaterFall = (props) => {
|
|
|
15671
15670
|
}
|
|
15672
15671
|
}, [waterFallData]);
|
|
15673
15672
|
const reportTagsView = React.useCallback(() => {
|
|
15674
|
-
var _a, _b, _c, _d, _e, _f
|
|
15673
|
+
var _a, _b, _c, _d, _e, _f;
|
|
15675
15674
|
const rec = recData === null || recData === void 0 ? void 0 : recData.rec;
|
|
15676
15675
|
if (!rec)
|
|
15677
15676
|
return;
|
|
@@ -15691,10 +15690,9 @@ const WaterFall = (props) => {
|
|
|
15691
15690
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
15692
15691
|
eventInfo: {
|
|
15693
15692
|
contentId: (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
|
15694
|
-
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 : '',
|
|
15695
15693
|
position: cacheActiveIndex + '',
|
|
15696
|
-
contentTags: JSON.stringify((
|
|
15697
|
-
traceInfo: (
|
|
15694
|
+
contentTags: JSON.stringify((_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.tags),
|
|
15695
|
+
traceInfo: (_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.traceInfo,
|
|
15698
15696
|
hashTags: JSON.stringify([recData === null || recData === void 0 ? void 0 : recData.hashTag]),
|
|
15699
15697
|
fromKName,
|
|
15700
15698
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
|
@@ -17776,7 +17774,7 @@ const LikeButton = (_a) => {
|
|
|
17776
17774
|
const likeIcon = useIconLink(defaultLikeIconPath$2);
|
|
17777
17775
|
const unlikeIcon = useIconLink(defaultUnLikeIconPath$2);
|
|
17778
17776
|
const handleClick = lodash.debounce(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
17779
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z
|
|
17777
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
|
|
17780
17778
|
if (state) {
|
|
17781
17779
|
// 先设置状态
|
|
17782
17780
|
setState(false);
|
|
@@ -17786,12 +17784,11 @@ const LikeButton = (_a) => {
|
|
|
17786
17784
|
eventSubject: 'favoriteContentCanceled',
|
|
17787
17785
|
eventDescription: 'This content was unfavorite by the user',
|
|
17788
17786
|
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 : '',
|
|
17789
|
-
|
|
17790
|
-
|
|
17791
|
-
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 : []),
|
|
17787
|
+
contentName: (_j = (_h = recData === null || recData === void 0 ? void 0 : recData.video) === null || _h === void 0 ? void 0 : _h.title) !== null && _j !== void 0 ? _j : '',
|
|
17788
|
+
contentTags: JSON.stringify((_l = (_k = recData === null || recData === void 0 ? void 0 : recData.video) === null || _k === void 0 ? void 0 : _k.tags) !== null && _l !== void 0 ? _l : []),
|
|
17792
17789
|
position: position + '',
|
|
17793
|
-
contentFormat: ((
|
|
17794
|
-
traceInfo: (
|
|
17790
|
+
contentFormat: ((_m = recData === null || recData === void 0 ? void 0 : recData.video) === null || _m === void 0 ? void 0 : _m.url) ? 'video' : 'image',
|
|
17791
|
+
traceInfo: (_o = recData === null || recData === void 0 ? void 0 : recData.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
|
17795
17792
|
}
|
|
17796
17793
|
});
|
|
17797
17794
|
// 如果接口调用失败，则回滚状态
|
|
@@ -17799,41 +17796,40 @@ const LikeButton = (_a) => {
|
|
|
17799
17796
|
setState(true);
|
|
17800
17797
|
}
|
|
17801
17798
|
else {
|
|
17802
|
-
const nRtcList = (
|
|
17799
|
+
const nRtcList = (_p = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
|
17803
17800
|
if (index === position) {
|
|
17804
17801
|
item.isCollected = false;
|
|
17805
17802
|
}
|
|
17806
17803
|
return item;
|
|
17807
|
-
})) !== null &&
|
|
17804
|
+
})) !== null && _p !== void 0 ? _p : [];
|
|
17808
17805
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
|
17809
17806
|
}
|
|
17810
17807
|
}
|
|
17811
17808
|
else {
|
|
17812
17809
|
setState(true);
|
|
17813
|
-
const result = (
|
|
17810
|
+
const result = (_q = (yield (mutateLike === null || mutateLike === void 0 ? void 0 : mutateLike({ content: JSON.stringify(recData) })))) !== null && _q !== void 0 ? _q : false;
|
|
17814
17811
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
17815
17812
|
eventInfo: {
|
|
17816
17813
|
eventSubject: 'favoriteContent',
|
|
17817
17814
|
eventDescription: 'This content was favorite by the user',
|
|
17818
|
-
contentId: (
|
|
17819
|
-
|
|
17820
|
-
|
|
17821
|
-
contentTags: JSON.stringify((_2 = (_1 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _1 === void 0 ? void 0 : _1.tags) !== null && _2 !== void 0 ? _2 : []),
|
|
17815
|
+
contentId: (_s = (_r = recData === null || recData === void 0 ? void 0 : recData.video) === null || _r === void 0 ? void 0 : _r.itemId) !== null && _s !== void 0 ? _s : '',
|
|
17816
|
+
contentName: (_u = (_t = recData === null || recData === void 0 ? void 0 : recData.video) === null || _t === void 0 ? void 0 : _t.title) !== null && _u !== void 0 ? _u : '',
|
|
17817
|
+
contentTags: JSON.stringify((_w = (_v = recData === null || recData === void 0 ? void 0 : recData.video) === null || _v === void 0 ? void 0 : _v.tags) !== null && _w !== void 0 ? _w : []),
|
|
17822
17818
|
position: position + '',
|
|
17823
|
-
contentFormat: ((
|
|
17824
|
-
traceInfo: (
|
|
17819
|
+
contentFormat: ((_x = recData === null || recData === void 0 ? void 0 : recData.video) === null || _x === void 0 ? void 0 : _x.url) ? 'video' : 'image',
|
|
17820
|
+
traceInfo: (_y = recData === null || recData === void 0 ? void 0 : recData.video) === null || _y === void 0 ? void 0 : _y.traceInfo
|
|
17825
17821
|
}
|
|
17826
17822
|
});
|
|
17827
17823
|
if (!result) {
|
|
17828
17824
|
setState(false);
|
|
17829
17825
|
}
|
|
17830
17826
|
else {
|
|
17831
|
-
const nRtcList = (
|
|
17827
|
+
const nRtcList = (_z = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
|
17832
17828
|
if (index === position) {
|
|
17833
17829
|
item.isCollected = true;
|
|
17834
17830
|
}
|
|
17835
17831
|
return item;
|
|
17836
|
-
})) !== null &&
|
|
17832
|
+
})) !== null && _z !== void 0 ? _z : [];
|
|
17837
17833
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
|
17838
17834
|
}
|
|
17839
17835
|
}
|
|
@@ -17936,26 +17932,6 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
17936
17932
|
return;
|
|
17937
17933
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
|
17938
17934
|
}, [videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
17939
|
-
const handleEnd = () => {
|
|
17940
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
17941
|
-
if (!videoRef.current)
|
|
17942
|
-
return;
|
|
17943
|
-
if (isDiyH5) {
|
|
17944
|
-
(_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
|
|
17945
|
-
if (!loopPlayRef.current)
|
|
17946
|
-
return;
|
|
17947
|
-
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
|
17948
|
-
(_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.slideTo(0);
|
|
17949
|
-
}
|
|
17950
|
-
else {
|
|
17951
|
-
const i = (_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.activeIndex;
|
|
17952
|
-
(_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.slideTo(i + 1);
|
|
17953
|
-
}
|
|
17954
|
-
}
|
|
17955
|
-
else {
|
|
17956
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.play();
|
|
17957
|
-
}
|
|
17958
|
-
};
|
|
17959
17935
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
|
17960
17936
|
const handlePlaying = React.useCallback(() => {
|
|
17961
17937
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
@@ -17964,7 +17940,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
17964
17940
|
setIsLoadFinish(true);
|
|
17965
17941
|
}, []);
|
|
17966
17942
|
const handleStartPlay = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
17967
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q
|
|
17943
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
|
17968
17944
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
17969
17945
|
return;
|
|
17970
17946
|
setIsPauseVideo(false);
|
|
@@ -17975,11 +17951,16 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
17975
17951
|
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);
|
|
17976
17952
|
const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
|
|
17977
17953
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
17978
|
-
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 : '',
|
|
17954
|
+
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 : '', contentName: (_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.title) !== null && _m !== void 0 ? _m : '', playType, startTime: videoCurrentTime, videoDuration, contentTags: JSON.stringify((_p = (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.tags) !== null && _p !== void 0 ? _p : []), position: index + '', contentFormat: 'video', traceInfo: (_q = item === null || item === void 0 ? void 0 : item.video) === null || _q === void 0 ? void 0 : _q.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) + '' }))
|
|
17979
17955
|
});
|
|
17980
17956
|
isFirstPlayRef.current = false;
|
|
17981
17957
|
}
|
|
17982
17958
|
}), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
17959
|
+
const setCurrentTimeByStartTime = React.useCallback(() => {
|
|
17960
|
+
if (isDiyH5) {
|
|
17961
|
+
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
|
17962
|
+
}
|
|
17963
|
+
}, []);
|
|
17983
17964
|
const handLoadeddata = React.useCallback(() => {
|
|
17984
17965
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
|
|
17985
17966
|
return;
|
|
@@ -18004,12 +17985,13 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18004
17985
|
const handleLoadedmetadata = React.useCallback(() => {
|
|
18005
17986
|
if (!videoRef.current)
|
|
18006
17987
|
return;
|
|
17988
|
+
setCurrentTimeByStartTime();
|
|
18007
17989
|
loadedTimeRef.current = new Date();
|
|
18008
17990
|
handleStartPlay();
|
|
18009
17991
|
handLoadeddata();
|
|
18010
17992
|
}, [videoRef.current, handLoadeddata, handleStartPlay]);
|
|
18011
17993
|
const handleClickVideo = React.useCallback((type) => () => {
|
|
18012
|
-
var _a, _b, _c, _d, _e;
|
|
17994
|
+
var _a, _b, _c, _d, _e, _f;
|
|
18013
17995
|
if (!videoRef.current)
|
|
18014
17996
|
return;
|
|
18015
17997
|
if (!isLoadFinish)
|
|
@@ -18030,17 +18012,20 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18030
18012
|
break;
|
|
18031
18013
|
default:
|
|
18032
18014
|
if (isPause) {
|
|
18033
|
-
(_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.
|
|
18015
|
+
if (isDiyH5 && Math.round((_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.currentTime) >= (scene === null || scene === void 0 ? void 0 : scene.endTime)) {
|
|
18016
|
+
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
|
18017
|
+
}
|
|
18018
|
+
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
|
|
18034
18019
|
}
|
|
18035
18020
|
else {
|
|
18036
|
-
(
|
|
18021
|
+
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.pause();
|
|
18037
18022
|
}
|
|
18038
18023
|
setIsPauseVideo(!isPause);
|
|
18039
18024
|
break;
|
|
18040
18025
|
}
|
|
18041
18026
|
}, [isLoadFinish, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
18042
18027
|
const handlePause = React.useCallback(() => {
|
|
18043
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o
|
|
18028
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
18044
18029
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
18045
18030
|
return;
|
|
18046
18031
|
if (activeIndex !== index)
|
|
@@ -18056,15 +18041,14 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18056
18041
|
eventSubject: 'playOverVideo',
|
|
18057
18042
|
eventDescription: 'User finished playing the video',
|
|
18058
18043
|
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 : '',
|
|
18059
|
-
|
|
18060
|
-
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 : '',
|
|
18044
|
+
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 : '',
|
|
18061
18045
|
endTime: videoCurrentTime,
|
|
18062
18046
|
videoDuration,
|
|
18063
18047
|
playDuration,
|
|
18064
|
-
contentTags: JSON.stringify((
|
|
18048
|
+
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 : []),
|
|
18065
18049
|
position: index + '',
|
|
18066
18050
|
contentFormat: 'video',
|
|
18067
|
-
traceInfo: (
|
|
18051
|
+
traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
|
18068
18052
|
}
|
|
18069
18053
|
});
|
|
18070
18054
|
}
|
|
@@ -18072,8 +18056,27 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18072
18056
|
const handleWaiting = React.useCallback(() => {
|
|
18073
18057
|
setWaiting(true);
|
|
18074
18058
|
}, []);
|
|
18059
|
+
const handleTimeUpload = () => {
|
|
18060
|
+
if (!videoRef.current || !isDiyH5)
|
|
18061
|
+
return;
|
|
18062
|
+
setTimeout(() => {
|
|
18063
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
18064
|
+
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)) {
|
|
18065
|
+
(_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
|
|
18066
|
+
if (!loopPlayRef.current)
|
|
18067
|
+
return;
|
|
18068
|
+
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
|
18069
|
+
(_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);
|
|
18070
|
+
}
|
|
18071
|
+
else {
|
|
18072
|
+
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;
|
|
18073
|
+
(_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);
|
|
18074
|
+
}
|
|
18075
|
+
}
|
|
18076
|
+
});
|
|
18077
|
+
};
|
|
18075
18078
|
React.useEffect(() => {
|
|
18076
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18079
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
18077
18080
|
if (!isActive)
|
|
18078
18081
|
return;
|
|
18079
18082
|
const videoSrc = videoUrl;
|
|
@@ -18094,6 +18097,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18094
18097
|
hls === null || hls === void 0 ? void 0 : hls.attachMedia(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current);
|
|
18095
18098
|
hls === null || hls === void 0 ? void 0 : hls.on(Hls.Events.MANIFEST_PARSED, function () {
|
|
18096
18099
|
var _a;
|
|
18100
|
+
setCurrentTimeByStartTime();
|
|
18097
18101
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
|
18098
18102
|
});
|
|
18099
18103
|
}
|
|
@@ -18107,11 +18111,12 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18107
18111
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.addEventListener('play', handleStartPlay);
|
|
18108
18112
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.addEventListener('playing', handlePlaying);
|
|
18109
18113
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.addEventListener('pause', handlePause);
|
|
18110
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended',
|
|
18114
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handlePlay);
|
|
18111
18115
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.addEventListener('canplay', handlePlay);
|
|
18112
18116
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
|
|
18117
|
+
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.addEventListener('timeupdate', handleTimeUpload);
|
|
18113
18118
|
return () => {
|
|
18114
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18119
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
18115
18120
|
const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
|
|
18116
18121
|
if (!isPause)
|
|
18117
18122
|
handlePause();
|
|
@@ -18123,9 +18128,10 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
|
18123
18128
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.removeEventListener('play', handleStartPlay);
|
|
18124
18129
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.removeEventListener('playing', handlePlaying);
|
|
18125
18130
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.removeEventListener('pause', handlePause);
|
|
18126
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended',
|
|
18131
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handlePlay);
|
|
18127
18132
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('canplay', handlePlay);
|
|
18128
18133
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.removeEventListener('waiting', handleWaiting);
|
|
18134
|
+
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.removeEventListener('timeupdate', handleTimeUpload);
|
|
18129
18135
|
};
|
|
18130
18136
|
}, [isActive]);
|
|
18131
18137
|
React.useEffect(() => {
|
|
@@ -18336,48 +18342,19 @@ const Picture = (props) => {
|
|
|
18336
18342
|
}, onLoad: onShowFirstImage }))));
|
|
18337
18343
|
};
|
|
18338
18344
|
|
|
18339
|
-
const PictureGroup$4 =
|
|
18345
|
+
const PictureGroup$4 = ({ imgUrls, width, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig }) => {
|
|
18340
18346
|
var _a, _b;
|
|
18341
18347
|
const { isActive } = useSwiperSlide();
|
|
18342
|
-
const { sxpParameter, openHashtag
|
|
18348
|
+
const { sxpParameter, openHashtag } = useSxpDataSource();
|
|
18343
18349
|
const [isLoad, setIsLoad] = React.useState(false);
|
|
18344
18350
|
const [imgInfo, setImgInfo] = React.useState();
|
|
18345
18351
|
const [swiperActiveIndex, setSwiperActiveIndex] = React.useState(0);
|
|
18346
|
-
const
|
|
18352
|
+
const swiperRef = React.useRef();
|
|
18347
18353
|
const isFirstPlayRef = React.useRef(true);
|
|
18348
|
-
const loopPlayRef = React.useRef(true);
|
|
18349
18354
|
const initTime = new Date();
|
|
18350
|
-
React.useImperativeHandle(ref, () => {
|
|
18351
|
-
return {
|
|
18352
|
-
setLoopPlay(v) {
|
|
18353
|
-
loopPlayRef.current = v;
|
|
18354
|
-
}
|
|
18355
|
-
};
|
|
18356
|
-
});
|
|
18357
|
-
React.useEffect(() => {
|
|
18358
|
-
let timerId;
|
|
18359
|
-
if (isLoad && isActive && isDiyH5) {
|
|
18360
|
-
timerId = setTimeout(() => {
|
|
18361
|
-
var _a, _b, _c, _d, _e, _f;
|
|
18362
|
-
if (!loopPlayRef.current)
|
|
18363
|
-
return;
|
|
18364
|
-
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
|
18365
|
-
(_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.slideTo(0);
|
|
18366
|
-
}
|
|
18367
|
-
else {
|
|
18368
|
-
const i = (_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.activeIndex;
|
|
18369
|
-
(_f = (_e = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _e === void 0 ? void 0 : _e.swiper) === null || _f === void 0 ? void 0 : _f.slideTo(i + 1);
|
|
18370
|
-
}
|
|
18371
|
-
}, 3000);
|
|
18372
|
-
}
|
|
18373
|
-
return () => {
|
|
18374
|
-
if (timerId)
|
|
18375
|
-
clearTimeout(timerId);
|
|
18376
|
-
};
|
|
18377
|
-
}, [isLoad, isActive, isDiyH5, data, index, swiperRef]);
|
|
18378
18355
|
React.useEffect(() => {
|
|
18379
18356
|
if (isLoad && isActive) {
|
|
18380
|
-
(
|
|
18357
|
+
(swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) && swiperRef.current.swiper.autoplay.start();
|
|
18381
18358
|
if (openHashtag) {
|
|
18382
18359
|
onViewImageEndEvent(rec);
|
|
18383
18360
|
}
|
|
@@ -18387,7 +18364,7 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
|
18387
18364
|
}
|
|
18388
18365
|
}
|
|
18389
18366
|
else {
|
|
18390
|
-
(
|
|
18367
|
+
(swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) && swiperRef.current.swiper.autoplay.stop();
|
|
18391
18368
|
}
|
|
18392
18369
|
}, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
|
|
18393
18370
|
const showFirstImageFn = React.useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
|
|
@@ -18414,13 +18391,13 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
|
18414
18391
|
};
|
|
18415
18392
|
}, [isActive, imgInfo]);
|
|
18416
18393
|
const handleMouseEnter = React.useCallback(() => {
|
|
18417
|
-
if (
|
|
18418
|
-
|
|
18394
|
+
if (swiperRef.current && swiperRef.current.swiper && isAlly) {
|
|
18395
|
+
swiperRef.current.swiper.autoplay.stop();
|
|
18419
18396
|
}
|
|
18420
18397
|
}, []);
|
|
18421
18398
|
const handleMouseLeave = React.useCallback(() => {
|
|
18422
|
-
if (
|
|
18423
|
-
|
|
18399
|
+
if (swiperRef.current && swiperRef.current.swiper && isAlly) {
|
|
18400
|
+
swiperRef.current.swiper.autoplay.start();
|
|
18424
18401
|
}
|
|
18425
18402
|
}, []);
|
|
18426
18403
|
const handleSlideChange = React.useCallback((swiper) => {
|
|
@@ -18441,7 +18418,7 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
|
18441
18418
|
enabled: true
|
|
18442
18419
|
}
|
|
18443
18420
|
}
|
|
18444
|
-
: {}), { loop: true, ref:
|
|
18421
|
+
: {}), { loop: true, ref: swiperRef, onSlideChange: handleSlideChange, className: css.css(Object.assign(Object.assign({ '.swiper-pagination': {
|
|
18445
18422
|
bottom: (_a = imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.marginBottom) !== null && _a !== void 0 ? _a : 0,
|
|
18446
18423
|
fontSize: '14px'
|
|
18447
18424
|
} }, ((imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.dotsBgColor) && {
|
|
@@ -18458,7 +18435,7 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
|
18458
18435
|
return (React.createElement(SwiperSlide, { key: srcKey, "aria-hidden": srcKey !== swiperActiveIndex },
|
|
18459
18436
|
React.createElement(Picture, { src: !isLoad && srcKey > 0 ? '' : url, height: height, imgUrlsPostConfig: imgUrlsPostConfig, onShowFirstImage: showFirstImageFn })));
|
|
18460
18437
|
}))));
|
|
18461
|
-
}
|
|
18438
|
+
};
|
|
18462
18439
|
var PictureGroup$5 = React.memo(PictureGroup$4);
|
|
18463
18440
|
|
|
18464
18441
|
/*
|
|
@@ -18738,7 +18715,7 @@ var NavBack$1 = React.memo(NavBack);
|
|
|
18738
18715
|
* @Author: binruan@chatlabs.com
|
|
18739
18716
|
* @Date: 2024-03-20 10:27:31
|
|
18740
18717
|
* @LastEditors: binruan@chatlabs.com
|
|
18741
|
-
* @LastEditTime: 2025-05-
|
|
18718
|
+
* @LastEditTime: 2025-05-09 15:51:40
|
|
18742
18719
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
|
18743
18720
|
*
|
|
18744
18721
|
*/
|
|
@@ -18758,7 +18735,6 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
18758
18735
|
const skipLinkRef = React.useRef(false);
|
|
18759
18736
|
const [pageNum, setPageNum] = React.useState(2);
|
|
18760
18737
|
const videoWidgetRef = React.useRef(null);
|
|
18761
|
-
const pictureGroupRef = React.useRef(null);
|
|
18762
18738
|
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();
|
|
18763
18739
|
const { backMainFeed, productView, jumpToWeb } = useEventReport();
|
|
18764
18740
|
const isShowFingerTip = React.useMemo(() => {
|
|
@@ -18806,7 +18782,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
18806
18782
|
(_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
|
|
18807
18783
|
}, [data, ctaType, swiperRef]);
|
|
18808
18784
|
const handleSessionCompleted = React.useCallback((fk) => {
|
|
18809
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v
|
|
18785
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
|
18810
18786
|
const item = data === null || data === void 0 ? void 0 : data[activeIndex];
|
|
18811
18787
|
let fromKName = '';
|
|
18812
18788
|
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))) {
|
|
@@ -18833,13 +18809,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
18833
18809
|
eventSubject: 'sessionCompleted',
|
|
18834
18810
|
eventDescription: 'Session completed',
|
|
18835
18811
|
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
|
18836
|
-
|
|
18837
|
-
productId: (_r = item === null || item === void 0 ? void 0 : item.product) === null || _r === void 0 ? void 0 : _r.itemId,
|
|
18812
|
+
productId: (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.itemId,
|
|
18838
18813
|
position: activeIndex + '',
|
|
18839
18814
|
fromKName: fk || fromKName,
|
|
18840
18815
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
|
18841
|
-
ctatId: (
|
|
18842
|
-
traceInfo: (
|
|
18816
|
+
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 : '',
|
|
18817
|
+
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 : ''
|
|
18843
18818
|
}
|
|
18844
18819
|
});
|
|
18845
18820
|
}, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime]);
|
|
@@ -18898,9 +18873,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
18898
18873
|
refreshFeSession
|
|
18899
18874
|
]);
|
|
18900
18875
|
const handleSessionExpire = React.useCallback(lodash.debounce(() => {
|
|
18901
|
-
var _a
|
|
18876
|
+
var _a;
|
|
18902
18877
|
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
|
18903
|
-
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
|
18904
18878
|
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
|
|
18905
18879
|
}, 1000), [handleSessionCompleted, refreshFeSession]);
|
|
18906
18880
|
React.useEffect(() => {
|
|
@@ -18970,18 +18944,18 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
18970
18944
|
return null;
|
|
18971
18945
|
}, [globalConfig, activeIndex, visList]);
|
|
18972
18946
|
const renderContent = React.useCallback((rec, index) => {
|
|
18973
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
|
18947
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18974
18948
|
if (rec === 'organic menu') {
|
|
18975
18949
|
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)));
|
|
18976
18950
|
}
|
|
18977
|
-
if ((
|
|
18951
|
+
if ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.url) {
|
|
18978
18952
|
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 })));
|
|
18979
18953
|
}
|
|
18980
|
-
if ((
|
|
18981
|
-
return (React.createElement(PictureGroup$5,
|
|
18954
|
+
if ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.imgUrls) {
|
|
18955
|
+
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 }));
|
|
18982
18956
|
}
|
|
18983
|
-
if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((
|
|
18984
|
-
return (
|
|
18957
|
+
if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _j === void 0 ? void 0 : _j.length) > 0) {
|
|
18958
|
+
return (_k = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _k === void 0 ? void 0 : _k.map((value, idx) => {
|
|
18985
18959
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
18986
18960
|
const t = resolver[(_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type];
|
|
18987
18961
|
const Component = withBindDataSource(t);
|
|
@@ -19019,7 +18993,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
19019
18993
|
};
|
|
19020
18994
|
}, [isShowMore]);
|
|
19021
18995
|
const renderBottom = React.useCallback((rec, index) => {
|
|
19022
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q
|
|
18996
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
|
19023
18997
|
if (rec === null || rec === void 0 ? void 0 : rec.video) {
|
|
19024
18998
|
let cta = null;
|
|
19025
18999
|
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) {
|
|
@@ -19028,25 +19002,24 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
19028
19002
|
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
|
|
19029
19003
|
cta = '商品CTA';
|
|
19030
19004
|
}
|
|
19031
|
-
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)) {
|
|
19032
|
-
cta = '服务CTA';
|
|
19033
|
-
}
|
|
19034
19005
|
else {
|
|
19035
|
-
cta = (
|
|
19006
|
+
cta = (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
|
|
19036
19007
|
}
|
|
19037
19008
|
const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
|
|
19038
|
-
const isNineProduct = (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nineProductEnable) &&
|
|
19009
|
+
const isNineProduct = (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nineProductEnable) &&
|
|
19010
|
+
index === ((rtcList === null || rtcList === void 0 ? void 0 : rtcList[0]) === 'organic menu' ? 2 : 1) &&
|
|
19011
|
+
((_f = ['MultiCommodity', 'MultiCommodityDiro', 'MultiCommodityDiroNew']) === null || _f === void 0 ? void 0 : _f.includes((_g = value === null || value === void 0 ? void 0 : value.item) === null || _g === void 0 ? void 0 : _g.type));
|
|
19039
19012
|
return (React.createElement(React.Fragment, null,
|
|
19040
19013
|
isNineProduct && (React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value, isNineProduct: isNineProduct })),
|
|
19041
|
-
((
|
|
19042
|
-
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(
|
|
19014
|
+
((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.title) && !isShowMore && React.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
|
|
19015
|
+
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(_j = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.bottomInfoDist) !== null && _j !== void 0 ? _j : 40}px` } },
|
|
19043
19016
|
React.createElement(Nudge, { nudge: nudge }),
|
|
19044
19017
|
((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' },
|
|
19045
19018
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
|
|
19046
19019
|
React.createElement("div", null,
|
|
19047
|
-
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: (
|
|
19020
|
+
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: (_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.title) !== null && _l !== void 0 ? _l : '', 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 }),
|
|
19048
19021
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
|
|
19049
|
-
React.createElement(Hashtag$1, { index: activeIndex, tags: (
|
|
19022
|
+
React.createElement(Hashtag$1, { index: activeIndex, tags: (_o = (_m = rec === null || rec === void 0 ? void 0 : rec.video) === null || _m === void 0 ? void 0 : _m.hashTags) !== null && _o !== void 0 ? _o : [], itemId: (_p = rec === null || rec === void 0 ? void 0 : rec.video) === null || _p === void 0 ? void 0 : _p.itemId, itemType: ((_q = rec === null || rec === void 0 ? void 0 : rec.video) === null || _q === void 0 ? void 0 : _q.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle, hashTagRightMargin: containerWidth - (hashTagRightMargin !== null && hashTagRightMargin !== void 0 ? hashTagRightMargin : 0) }))),
|
|
19050
19023
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
|
|
19051
19024
|
}
|
|
19052
19025
|
return null;
|
|
@@ -19085,7 +19058,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
19085
19058
|
return null;
|
|
19086
19059
|
}, [globalConfig, waterFallData]);
|
|
19087
19060
|
const handleViewImageStartEnd = (item) => {
|
|
19088
|
-
var _a, _b, _c, _d, _e, _f
|
|
19061
|
+
var _a, _b, _c, _d, _e, _f;
|
|
19089
19062
|
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)) {
|
|
19090
19063
|
const endTime = Date.now();
|
|
19091
19064
|
const duration = viewImageStartTime.current === 0 ? 0 : (endTime - viewImageStartTime.current) / 1000;
|
|
@@ -19094,11 +19067,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
19094
19067
|
eventSubject: 'viewImageCarouselEnd',
|
|
19095
19068
|
eventDescription: 'User end view the image carousel',
|
|
19096
19069
|
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 : '',
|
|
19097
|
-
|
|
19098
|
-
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
|
19070
|
+
contentName: (_e = item === null || item === void 0 ? void 0 : item.video.title) !== null && _e !== void 0 ? _e : '',
|
|
19099
19071
|
imageEndTime: `${endTime}`,
|
|
19100
19072
|
playDuration: `${duration}`,
|
|
19101
|
-
contentTags: JSON.stringify((
|
|
19073
|
+
contentTags: JSON.stringify((_f = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _f !== void 0 ? _f : []),
|
|
19102
19074
|
position: activeIndex + '',
|
|
19103
19075
|
contentFormat: 'image',
|
|
19104
19076
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo
|
|
@@ -19107,7 +19079,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
19107
19079
|
}
|
|
19108
19080
|
};
|
|
19109
19081
|
const handleSlideSkip = (item, position) => {
|
|
19110
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x
|
|
19082
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
|
19111
19083
|
if (isPreview || waterFallData)
|
|
19112
19084
|
return;
|
|
19113
19085
|
const t = new Date() - curTime.current;
|
|
@@ -19133,8 +19105,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
19133
19105
|
contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
|
|
19134
19106
|
position: position + '',
|
|
19135
19107
|
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 : '',
|
|
19136
|
-
|
|
19137
|
-
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 : '',
|
|
19108
|
+
traceInfo: (_x = (_v = (_u = item === null || item === void 0 ? void 0 : item.video) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : (_w = item === null || item === void 0 ? void 0 : item.product) === null || _w === void 0 ? void 0 : _w.traceInfo) !== null && _x !== void 0 ? _x : '',
|
|
19138
19109
|
contentFormat
|
|
19139
19110
|
}
|
|
19140
19111
|
});
|
|
@@ -19144,7 +19115,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
19144
19115
|
}
|
|
19145
19116
|
};
|
|
19146
19117
|
const handleScrollEvent = (swiper) => {
|
|
19147
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w
|
|
19118
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
|
|
19148
19119
|
const item = data[swiper.previousIndex];
|
|
19149
19120
|
if (!item)
|
|
19150
19121
|
return;
|
|
@@ -19161,12 +19132,11 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
19161
19132
|
eventSubject: 'scrollDown',
|
|
19162
19133
|
eventDescription: 'User scroll down',
|
|
19163
19134
|
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 : '',
|
|
19164
|
-
|
|
19165
|
-
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 : '',
|
|
19135
|
+
productId: (_g = (_f = item === null || item === void 0 ? void 0 : item.product) === null || _f === void 0 ? void 0 : _f.itemId) !== null && _g !== void 0 ? _g : '',
|
|
19166
19136
|
requestId: null,
|
|
19167
|
-
traceInfo: (
|
|
19137
|
+
traceInfo: (_l = (_j = (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.traceInfo) !== null && _j !== void 0 ? _j : (_k = item === null || item === void 0 ? void 0 : item.product) === null || _k === void 0 ? void 0 : _k.traceInfo) !== null && _l !== void 0 ? _l : '',
|
|
19168
19138
|
contentFormat,
|
|
19169
|
-
position: ((
|
|
19139
|
+
position: ((_m = swiper.previousIndex) !== null && _m !== void 0 ? _m : 0) + ''
|
|
19170
19140
|
}
|
|
19171
19141
|
});
|
|
19172
19142
|
// 如果上一个商品是图片集，需上报 浏览图片集结结束 事件
|
|
@@ -19178,13 +19148,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
19178
19148
|
eventInfo: {
|
|
19179
19149
|
eventSubject: 'scrollUp',
|
|
19180
19150
|
eventDescription: 'User scroll up',
|
|
19181
|
-
contentId: (
|
|
19182
|
-
|
|
19183
|
-
productId: (_x = (_w = item.product) === null || _w === void 0 ? void 0 : _w.itemId) !== null && _x !== void 0 ? _x : '',
|
|
19151
|
+
contentId: (_p = (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.itemId) !== null && _p !== void 0 ? _p : '',
|
|
19152
|
+
productId: (_r = (_q = item.product) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
|
|
19184
19153
|
requestId: null,
|
|
19185
|
-
traceInfo: (
|
|
19154
|
+
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 : '',
|
|
19186
19155
|
contentFormat,
|
|
19187
|
-
position: ((
|
|
19156
|
+
position: ((_w = swiper.previousIndex) !== null && _w !== void 0 ? _w : 0) + ''
|
|
19188
19157
|
}
|
|
19189
19158
|
});
|
|
19190
19159
|
// 如果上一个商品是图片集，需上报 浏览图片集结结束 事件
|
|
@@ -19210,7 +19179,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
19210
19179
|
}
|
|
19211
19180
|
}, [openHashtag, data, activeIndex]);
|
|
19212
19181
|
const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
|
|
19213
|
-
var _a, _b, _c, _d, _e, _f, _g, _h
|
|
19182
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
19214
19183
|
const item = data[activeIndex];
|
|
19215
19184
|
// 如果是图片集则上报事件
|
|
19216
19185
|
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)) {
|
|
@@ -19221,10 +19190,9 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
19221
19190
|
eventSubject: 'viewImageCarouselStart',
|
|
19222
19191
|
eventDescription: 'User start view the image carousel',
|
|
19223
19192
|
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 : '',
|
|
19224
|
-
|
|
19225
|
-
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
|
19193
|
+
contentName: (_e = item === null || item === void 0 ? void 0 : item.video.title) !== null && _e !== void 0 ? _e : '',
|
|
19226
19194
|
imageStartTime: `${startTime}`,
|
|
19227
|
-
contentTags: JSON.stringify((
|
|
19195
|
+
contentTags: JSON.stringify((_f = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _f !== void 0 ? _f : []),
|
|
19228
19196
|
position: activeIndex + '',
|
|
19229
19197
|
contentFormat: 'image',
|
|
19230
19198
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
|
|
@@ -19234,11 +19202,11 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
|
19234
19202
|
if (enableCapi) {
|
|
19235
19203
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
19236
19204
|
eventName: 'ViewContent',
|
|
19237
|
-
product: (
|
|
19205
|
+
product: (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.bindProduct
|
|
19238
19206
|
});
|
|
19239
19207
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
19240
19208
|
eventName: 'PageView',
|
|
19241
|
-
product: (
|
|
19209
|
+
product: (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.bindProduct
|
|
19242
19210
|
});
|
|
19243
19211
|
}
|
|
19244
19212
|
}
|
|
@@ -19391,7 +19359,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
|
19391
19359
|
}, []);
|
|
19392
19360
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
|
19393
19361
|
const handlePlaying = React.useCallback(() => {
|
|
19394
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o
|
|
19362
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
19395
19363
|
setIsPauseVideo(false);
|
|
19396
19364
|
const item = data[index];
|
|
19397
19365
|
if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
|
|
@@ -19404,15 +19372,14 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
|
19404
19372
|
eventSubject: 'playVideo',
|
|
19405
19373
|
eventDescription: 'User played the video',
|
|
19406
19374
|
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 : '',
|
|
19407
|
-
|
|
19408
|
-
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 : '',
|
|
19375
|
+
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 : '',
|
|
19409
19376
|
playType,
|
|
19410
19377
|
startTime: videoCurrentTime,
|
|
19411
19378
|
videoDuration,
|
|
19412
|
-
contentTags: JSON.stringify((
|
|
19379
|
+
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 : []),
|
|
19413
19380
|
position: index + '',
|
|
19414
19381
|
contentFormat: 'video',
|
|
19415
|
-
traceInfo: (
|
|
19382
|
+
traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
|
19416
19383
|
}
|
|
19417
19384
|
});
|
|
19418
19385
|
setIsFirstPlay(false);
|
|
@@ -19451,7 +19418,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
|
19451
19418
|
}
|
|
19452
19419
|
}, [isLoadFinish]);
|
|
19453
19420
|
const onPause = React.useCallback(() => {
|
|
19454
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o
|
|
19421
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
19455
19422
|
const item = data[index];
|
|
19456
19423
|
const videoDuration = ((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
|
|
19457
19424
|
const videoCurrentTime = ((_d = (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
|
|
@@ -19462,15 +19429,14 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
|
19462
19429
|
eventSubject: 'playOverVideo',
|
|
19463
19430
|
eventDescription: 'User finished playing the video',
|
|
19464
19431
|
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 : '',
|
|
19465
|
-
|
|
19466
|
-
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 : '',
|
|
19432
|
+
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 : '',
|
|
19467
19433
|
endTime: videoCurrentTime,
|
|
19468
19434
|
videoDuration,
|
|
19469
19435
|
playDuration,
|
|
19470
|
-
contentTags: JSON.stringify((
|
|
19436
|
+
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 : []),
|
|
19471
19437
|
position: index + '',
|
|
19472
19438
|
contentFormat: 'video',
|
|
19473
|
-
traceInfo: (
|
|
19439
|
+
traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
|
19474
19440
|
}
|
|
19475
19441
|
});
|
|
19476
19442
|
}
|