pb-sxp-ui 1.16.5 → 1.16.6
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 +162 -126
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +162 -126
- 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 +162 -126
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +6 -6
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/DiyPortalPreview/VideoWidget.js +10 -8
- package/es/core/components/SxpPageRender/LikeButton/index.js +17 -15
- package/es/core/components/SxpPageRender/PictureGroup/index.d.ts +5 -0
- package/es/core/components/SxpPageRender/PictureGroup/index.js +42 -13
- package/es/core/components/SxpPageRender/VideoWidget/index.js +34 -44
- package/es/core/components/SxpPageRender/WaterFall/index.js +4 -3
- package/es/core/components/SxpPageRender/index.js +46 -35
- package/es/core/context/SxpDataSourceProvider.js +2 -2
- package/es/core/hooks/useEventReport.js +6 -5
- package/lib/core/components/DiyPortalPreview/VideoWidget.js +10 -8
- package/lib/core/components/SxpPageRender/LikeButton/index.js +17 -15
- package/lib/core/components/SxpPageRender/PictureGroup/index.d.ts +5 -0
- package/lib/core/components/SxpPageRender/PictureGroup/index.js +41 -12
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +34 -44
- package/lib/core/components/SxpPageRender/WaterFall/index.js +4 -3
- package/lib/core/components/SxpPageRender/index.js +46 -35
- package/lib/core/context/SxpDataSourceProvider.js +2 -2
- package/lib/core/hooks/useEventReport.js +6 -5
- package/package.json +1 -1
package/dist/pb-ui.js
CHANGED
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
38
38
|
PERFORMANCE OF THIS SOFTWARE.
|
|
39
39
|
***************************************************************************** */
|
|
40
|
-
/* global Reflect, Promise, SuppressedError, Symbol
|
|
40
|
+
/* global Reflect, Promise, SuppressedError, Symbol */
|
|
41
41
|
|
|
42
42
|
|
|
43
43
|
function __rest(s, e) {
|
|
@@ -1079,7 +1079,7 @@
|
|
|
1079
1079
|
}
|
|
1080
1080
|
}), [bffFetch, utmVal]);
|
|
1081
1081
|
const ctaEvent = React.useCallback((eventInfo, rec, product, position) => {
|
|
1082
|
-
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;
|
|
1082
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14;
|
|
1083
1083
|
const cta = product === null || product === void 0 ? void 0 : product.bindCta;
|
|
1084
1084
|
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);
|
|
1085
1085
|
let fromKName = '';
|
|
@@ -1097,7 +1097,7 @@
|
|
|
1097
1097
|
}
|
|
1098
1098
|
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;
|
|
1099
1099
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
1100
|
-
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: (
|
|
1100
|
+
eventInfo: Object.assign(Object.assign({}, eventInfo), { ctaId: (_r = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _r !== void 0 ? _r : '', ctaName: (_s = cta === null || cta === void 0 ? void 0 : cta.title) !== null && _s !== void 0 ? _s : '', contentTags: contentTags ? JSON.stringify(contentTags) : '', position: position + '', contentId: (_u = (_t = rec === null || rec === void 0 ? void 0 : rec.video) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '', sceneId: (_x = (_w = (_v = rec === null || rec === void 0 ? void 0 : rec.video) === null || _v === void 0 ? void 0 : _v.scene) === null || _w === void 0 ? void 0 : _w.sceneId) !== null && _x !== void 0 ? _x : '', productId: isProd ? product === null || product === void 0 ? void 0 : product.itemId : '', traceInfo: (_13 = (_10 = (_5 = (_1 = (_y = cta === null || cta === void 0 ? void 0 : cta.traceInfo) !== null && _y !== void 0 ? _y : (_0 = (_z = rec === null || rec === void 0 ? void 0 : rec.video) === null || _z === void 0 ? void 0 : _z.bindCta) === null || _0 === void 0 ? void 0 : _0.traceInfo) !== null && _1 !== void 0 ? _1 : (_4 = (_3 = (_2 = rec === null || rec === void 0 ? void 0 : rec.video) === null || _2 === void 0 ? void 0 : _2.bindProduct) === null || _3 === void 0 ? void 0 : _3.bindCta) === null || _4 === void 0 ? void 0 : _4.traceInfo) !== null && _5 !== void 0 ? _5 : (_9 = (_8 = (_7 = (_6 = rec === null || rec === void 0 ? void 0 : rec.video) === null || _6 === void 0 ? void 0 : _6.bindProducts) === null || _7 === void 0 ? void 0 : _7[0]) === null || _8 === void 0 ? void 0 : _8.bindCta) === null || _9 === void 0 ? void 0 : _9.traceInfo) !== null && _10 !== void 0 ? _10 : (_12 = (_11 = rec === null || rec === void 0 ? void 0 : rec.product) === null || _11 === void 0 ? void 0 : _11.bindCta) === null || _12 === void 0 ? void 0 : _12.traceInfo) !== null && _13 !== void 0 ? _13 : '', fromKName, fromKPage: (_14 = location === null || location === void 0 ? void 0 : location.href) !== null && _14 !== void 0 ? _14 : '', contentFormat })
|
|
1101
1101
|
});
|
|
1102
1102
|
}, [bffEventReport, isFromHashtag]);
|
|
1103
1103
|
const h5EnterLink = React.useCallback(() => {
|
|
@@ -1758,14 +1758,14 @@
|
|
|
1758
1758
|
* @Author: binruan@chatlabs.com
|
|
1759
1759
|
* @Date: 2024-03-12 10:59:06
|
|
1760
1760
|
* @LastEditors: binruan@chatlabs.com
|
|
1761
|
-
* @LastEditTime:
|
|
1761
|
+
* @LastEditTime: 2025-05-09 15:30:59
|
|
1762
1762
|
* @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
|
|
1763
1763
|
*
|
|
1764
1764
|
*/
|
|
1765
1765
|
function useEventReport() {
|
|
1766
1766
|
const { bffEventReport, popupDetailData, isFromHashtag, eventTimeList, setEventTimeList } = useSxpDataSource();
|
|
1767
1767
|
const jumpToWeb = React.useCallback((e, data, product, cta, position, traceInfo) => {
|
|
1768
|
-
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;
|
|
1768
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16;
|
|
1769
1769
|
const i = eventTimeList === null || eventTimeList === void 0 ? void 0 : eventTimeList.findIndex((item) => item.target === (e === null || e === void 0 ? void 0 : e.target));
|
|
1770
1770
|
if (i !== -1) {
|
|
1771
1771
|
return;
|
|
@@ -1798,11 +1798,11 @@
|
|
|
1798
1798
|
contentFormat = 'image';
|
|
1799
1799
|
}
|
|
1800
1800
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
1801
|
-
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 : '',
|
|
1801
|
+
eventInfo: Object.assign({ eventSubject: 'jumpToWeb', eventDescription: 'User jumped to website', productId: (_v = product === null || product === void 0 ? void 0 : product.itemId) !== null && _v !== void 0 ? _v : '', productName: (_w = product === null || product === void 0 ? void 0 : product.title) !== null && _w !== void 0 ? _w : '', price: (product === null || product === void 0 ? void 0 : product.price) ? (product === null || product === void 0 ? void 0 : product.price) + '' : '0', productCollection: (_x = product === null || product === void 0 ? void 0 : product.collection) !== null && _x !== void 0 ? _x : '', fromKName, fromKPage: location === null || location === void 0 ? void 0 : location.href, contentTags: contentTags ? JSON.stringify(contentTags) : '', position: position + '', contentId: (_z = (_y = data === null || data === void 0 ? void 0 : data.video) === null || _y === void 0 ? void 0 : _y.itemId) !== null && _z !== void 0 ? _z : '', sceneId: (_2 = (_1 = (_0 = data === null || data === void 0 ? void 0 : data.video) === null || _0 === void 0 ? void 0 : _0.scene) === null || _1 === void 0 ? void 0 : _1.sceneId) !== null && _2 !== void 0 ? _2 : '', ctatId: (_3 = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _3 !== void 0 ? _3 : '', traceInfo: (_16 = (_13 = (_11 = (_7 = (_4 = traceInfo !== null && traceInfo !== void 0 ? traceInfo : product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _4 !== void 0 ? _4 : (_6 = (_5 = data === null || data === void 0 ? void 0 : data.video) === null || _5 === void 0 ? void 0 : _5.bindProduct) === null || _6 === void 0 ? void 0 : _6.traceInfo) !== null && _7 !== void 0 ? _7 : (_10 = (_9 = (_8 = data === null || data === void 0 ? void 0 : data.video) === null || _8 === void 0 ? void 0 : _8.bindProducts) === null || _9 === void 0 ? void 0 : _9[0]) === null || _10 === void 0 ? void 0 : _10.traceInfo) !== null && _11 !== void 0 ? _11 : (_12 = data === null || data === void 0 ? void 0 : data.product) === null || _12 === void 0 ? void 0 : _12.traceInfo) !== null && _13 !== void 0 ? _13 : (_15 = (_14 = data === null || data === void 0 ? void 0 : data.video) === null || _14 === void 0 ? void 0 : _14.bindCta) === null || _15 === void 0 ? void 0 : _15.traceInfo) !== null && _16 !== void 0 ? _16 : '' }, (contentFormat && { contentFormat }))
|
|
1802
1802
|
});
|
|
1803
1803
|
}, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
|
|
1804
1804
|
const productView = React.useCallback((data, product, cta, viewTime, position) => {
|
|
1805
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
|
1805
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
|
1806
1806
|
let fromKName = '';
|
|
1807
1807
|
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))) {
|
|
1808
1808
|
fromKName = 'pdpPage';
|
|
@@ -1821,8 +1821,9 @@
|
|
|
1821
1821
|
contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags),
|
|
1822
1822
|
position: position + '',
|
|
1823
1823
|
contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
|
1824
|
+
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 : '',
|
|
1824
1825
|
ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
|
|
1825
|
-
traceInfo: (
|
|
1826
|
+
traceInfo: (_s = (_q = (_l = (_h = product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _h !== void 0 ? _h : (_k = (_j = data === null || data === void 0 ? void 0 : data.video) === null || _j === void 0 ? void 0 : _j.bindProduct) === null || _k === void 0 ? void 0 : _k.traceInfo) !== null && _l !== void 0 ? _l : (_p = (_o = (_m = data === null || data === void 0 ? void 0 : data.video) === null || _m === void 0 ? void 0 : _m.bindProducts) === null || _o === void 0 ? void 0 : _o[0]) === null || _p === void 0 ? void 0 : _p.traceInfo) !== null && _q !== void 0 ? _q : (_r = data === null || data === void 0 ? void 0 : data.product) === null || _r === void 0 ? void 0 : _r.traceInfo) !== null && _s !== void 0 ? _s : '',
|
|
1826
1827
|
timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
|
|
1827
1828
|
eventSubject: 'productView',
|
|
1828
1829
|
eventDescription: 'User browsed the product'
|
|
@@ -15625,7 +15626,7 @@ Made in Italy` })));
|
|
|
15625
15626
|
* @Author: binruan@chatlabs.com
|
|
15626
15627
|
* @Date: 2024-01-10 10:58:24
|
|
15627
15628
|
* @LastEditors: binruan@chatlabs.com
|
|
15628
|
-
* @LastEditTime: 2025-
|
|
15629
|
+
* @LastEditTime: 2025-05-09 15:30:41
|
|
15629
15630
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\WaterFall\index.tsx
|
|
15630
15631
|
*
|
|
15631
15632
|
*/
|
|
@@ -15663,7 +15664,7 @@ Made in Italy` })));
|
|
|
15663
15664
|
}
|
|
15664
15665
|
}, [waterFallData]);
|
|
15665
15666
|
const reportTagsView = React.useCallback(() => {
|
|
15666
|
-
var _a, _b, _c, _d, _e, _f;
|
|
15667
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
15667
15668
|
const rec = recData === null || recData === void 0 ? void 0 : recData.rec;
|
|
15668
15669
|
if (!rec)
|
|
15669
15670
|
return;
|
|
@@ -15683,9 +15684,10 @@ Made in Italy` })));
|
|
|
15683
15684
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
15684
15685
|
eventInfo: {
|
|
15685
15686
|
contentId: (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
|
15687
|
+
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 : '',
|
|
15686
15688
|
position: cacheActiveIndex + '',
|
|
15687
|
-
contentTags: JSON.stringify((
|
|
15688
|
-
traceInfo: (
|
|
15689
|
+
contentTags: JSON.stringify((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.tags),
|
|
15690
|
+
traceInfo: (_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.traceInfo,
|
|
15689
15691
|
hashTags: JSON.stringify([recData === null || recData === void 0 ? void 0 : recData.hashTag]),
|
|
15690
15692
|
fromKName,
|
|
15691
15693
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
|
@@ -17767,7 +17769,7 @@ Made in Italy` })));
|
|
|
17767
17769
|
const likeIcon = useIconLink(defaultLikeIconPath$2);
|
|
17768
17770
|
const unlikeIcon = useIconLink(defaultUnLikeIconPath$2);
|
|
17769
17771
|
const handleClick = lodash.debounce(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
17770
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
|
|
17772
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5;
|
|
17771
17773
|
if (state) {
|
|
17772
17774
|
// 先设置状态
|
|
17773
17775
|
setState(false);
|
|
@@ -17777,11 +17779,12 @@ Made in Italy` })));
|
|
|
17777
17779
|
eventSubject: 'favoriteContentCanceled',
|
|
17778
17780
|
eventDescription: 'This content was unfavorite by the user',
|
|
17779
17781
|
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 : '',
|
|
17780
|
-
|
|
17781
|
-
|
|
17782
|
+
sceneId: (_k = (_j = (_h = recData === null || recData === void 0 ? void 0 : recData.video) === null || _h === void 0 ? void 0 : _h.scene) === null || _j === void 0 ? void 0 : _j.sceneId) !== null && _k !== void 0 ? _k : '',
|
|
17783
|
+
contentName: (_m = (_l = recData === null || recData === void 0 ? void 0 : recData.video) === null || _l === void 0 ? void 0 : _l.title) !== null && _m !== void 0 ? _m : '',
|
|
17784
|
+
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 : []),
|
|
17782
17785
|
position: position + '',
|
|
17783
|
-
contentFormat: ((
|
|
17784
|
-
traceInfo: (
|
|
17786
|
+
contentFormat: ((_q = recData === null || recData === void 0 ? void 0 : recData.video) === null || _q === void 0 ? void 0 : _q.url) ? 'video' : 'image',
|
|
17787
|
+
traceInfo: (_r = recData === null || recData === void 0 ? void 0 : recData.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
17785
17788
|
}
|
|
17786
17789
|
});
|
|
17787
17790
|
// 如果接口调用失败，则回滚状态
|
|
@@ -17789,40 +17792,41 @@ Made in Italy` })));
|
|
|
17789
17792
|
setState(true);
|
|
17790
17793
|
}
|
|
17791
17794
|
else {
|
|
17792
|
-
const nRtcList = (
|
|
17795
|
+
const nRtcList = (_s = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
|
17793
17796
|
if (index === position) {
|
|
17794
17797
|
item.isCollected = false;
|
|
17795
17798
|
}
|
|
17796
17799
|
return item;
|
|
17797
|
-
})) !== null &&
|
|
17800
|
+
})) !== null && _s !== void 0 ? _s : [];
|
|
17798
17801
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
|
17799
17802
|
}
|
|
17800
17803
|
}
|
|
17801
17804
|
else {
|
|
17802
17805
|
setState(true);
|
|
17803
|
-
const result = (
|
|
17806
|
+
const result = (_t = (yield (mutateLike === null || mutateLike === void 0 ? void 0 : mutateLike({ content: JSON.stringify(recData) })))) !== null && _t !== void 0 ? _t : false;
|
|
17804
17807
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
17805
17808
|
eventInfo: {
|
|
17806
17809
|
eventSubject: 'favoriteContent',
|
|
17807
17810
|
eventDescription: 'This content was favorite by the user',
|
|
17808
|
-
contentId: (
|
|
17809
|
-
|
|
17810
|
-
|
|
17811
|
+
contentId: (_v = (_u = recData === null || recData === void 0 ? void 0 : recData.video) === null || _u === void 0 ? void 0 : _u.itemId) !== null && _v !== void 0 ? _v : '',
|
|
17812
|
+
sceneId: (_y = (_x = (_w = recData === null || recData === void 0 ? void 0 : recData.video) === null || _w === void 0 ? void 0 : _w.scene) === null || _x === void 0 ? void 0 : _x.sceneId) !== null && _y !== void 0 ? _y : '',
|
|
17813
|
+
contentName: (_0 = (_z = recData === null || recData === void 0 ? void 0 : recData.video) === null || _z === void 0 ? void 0 : _z.title) !== null && _0 !== void 0 ? _0 : '',
|
|
17814
|
+
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 : []),
|
|
17811
17815
|
position: position + '',
|
|
17812
|
-
contentFormat: ((
|
|
17813
|
-
traceInfo: (
|
|
17816
|
+
contentFormat: ((_3 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _3 === void 0 ? void 0 : _3.url) ? 'video' : 'image',
|
|
17817
|
+
traceInfo: (_4 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _4 === void 0 ? void 0 : _4.traceInfo
|
|
17814
17818
|
}
|
|
17815
17819
|
});
|
|
17816
17820
|
if (!result) {
|
|
17817
17821
|
setState(false);
|
|
17818
17822
|
}
|
|
17819
17823
|
else {
|
|
17820
|
-
const nRtcList = (
|
|
17824
|
+
const nRtcList = (_5 = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
|
17821
17825
|
if (index === position) {
|
|
17822
17826
|
item.isCollected = true;
|
|
17823
17827
|
}
|
|
17824
17828
|
return item;
|
|
17825
|
-
})) !== null &&
|
|
17829
|
+
})) !== null && _5 !== void 0 ? _5 : [];
|
|
17826
17830
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
|
17827
17831
|
}
|
|
17828
17832
|
}
|
|
@@ -17925,6 +17929,26 @@ Made in Italy` })));
|
|
|
17925
17929
|
return;
|
|
17926
17930
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
|
17927
17931
|
}, [videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
17932
|
+
const handleEnd = () => {
|
|
17933
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
17934
|
+
if (!videoRef.current)
|
|
17935
|
+
return;
|
|
17936
|
+
if (isDiyH5) {
|
|
17937
|
+
(_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
|
|
17938
|
+
if (!loopPlayRef.current)
|
|
17939
|
+
return;
|
|
17940
|
+
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
|
17941
|
+
(_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);
|
|
17942
|
+
}
|
|
17943
|
+
else {
|
|
17944
|
+
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;
|
|
17945
|
+
(_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);
|
|
17946
|
+
}
|
|
17947
|
+
}
|
|
17948
|
+
else {
|
|
17949
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.play();
|
|
17950
|
+
}
|
|
17951
|
+
};
|
|
17928
17952
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
|
17929
17953
|
const handlePlaying = React.useCallback(() => {
|
|
17930
17954
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
@@ -17933,7 +17957,7 @@ Made in Italy` })));
|
|
|
17933
17957
|
setIsLoadFinish(true);
|
|
17934
17958
|
}, []);
|
|
17935
17959
|
const handleStartPlay = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
|
17936
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
|
17960
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
|
|
17937
17961
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
17938
17962
|
return;
|
|
17939
17963
|
setIsPauseVideo(false);
|
|
@@ -17944,16 +17968,11 @@ Made in Italy` })));
|
|
|
17944
17968
|
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);
|
|
17945
17969
|
const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
|
|
17946
17970
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
|
17947
|
-
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 : '',
|
|
17971
|
+
eventInfo: Object.assign({ eventSubject: 'playVideo', eventDescription: 'User played the video', contentId: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.itemId) !== null && _k !== void 0 ? _k : '', sceneId: (_o = (_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.scene) === null || _m === void 0 ? void 0 : _m.sceneId) !== null && _o !== void 0 ? _o : '', contentName: (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.title) !== null && _q !== void 0 ? _q : '', playType, startTime: videoCurrentTime, videoDuration, contentTags: JSON.stringify((_s = (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.tags) !== null && _s !== void 0 ? _s : []), position: index + '', contentFormat: 'video', traceInfo: (_t = item === null || item === void 0 ? void 0 : item.video) === null || _t === void 0 ? void 0 : _t.traceInfo }, ((isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) && { loadTime: (loadedTimeRef === null || loadedTimeRef === void 0 ? void 0 : loadedTimeRef.current) - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current) + '' }))
|
|
17948
17972
|
});
|
|
17949
17973
|
isFirstPlayRef.current = false;
|
|
17950
17974
|
}
|
|
17951
17975
|
}), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
17952
|
-
const setCurrentTimeByStartTime = React.useCallback(() => {
|
|
17953
|
-
if (isDiyH5) {
|
|
17954
|
-
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
|
17955
|
-
}
|
|
17956
|
-
}, []);
|
|
17957
17976
|
const handLoadeddata = React.useCallback(() => {
|
|
17958
17977
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
|
|
17959
17978
|
return;
|
|
@@ -17978,13 +17997,12 @@ Made in Italy` })));
|
|
|
17978
17997
|
const handleLoadedmetadata = React.useCallback(() => {
|
|
17979
17998
|
if (!videoRef.current)
|
|
17980
17999
|
return;
|
|
17981
|
-
setCurrentTimeByStartTime();
|
|
17982
18000
|
loadedTimeRef.current = new Date();
|
|
17983
18001
|
handleStartPlay();
|
|
17984
18002
|
handLoadeddata();
|
|
17985
18003
|
}, [videoRef.current, handLoadeddata, handleStartPlay]);
|
|
17986
18004
|
const handleClickVideo = React.useCallback((type) => () => {
|
|
17987
|
-
var _a, _b, _c, _d, _e
|
|
18005
|
+
var _a, _b, _c, _d, _e;
|
|
17988
18006
|
if (!videoRef.current)
|
|
17989
18007
|
return;
|
|
17990
18008
|
if (!isLoadFinish)
|
|
@@ -18005,20 +18023,17 @@ Made in Italy` })));
|
|
|
18005
18023
|
break;
|
|
18006
18024
|
default:
|
|
18007
18025
|
if (isPause) {
|
|
18008
|
-
|
|
18009
|
-
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
|
18010
|
-
}
|
|
18011
|
-
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
|
|
18026
|
+
(_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.play();
|
|
18012
18027
|
}
|
|
18013
18028
|
else {
|
|
18014
|
-
(
|
|
18029
|
+
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.pause();
|
|
18015
18030
|
}
|
|
18016
18031
|
setIsPauseVideo(!isPause);
|
|
18017
18032
|
break;
|
|
18018
18033
|
}
|
|
18019
18034
|
}, [isLoadFinish, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
|
18020
18035
|
const handlePause = React.useCallback(() => {
|
|
18021
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
18036
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
18022
18037
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
|
18023
18038
|
return;
|
|
18024
18039
|
if (activeIndex !== index)
|
|
@@ -18034,14 +18049,15 @@ Made in Italy` })));
|
|
|
18034
18049
|
eventSubject: 'playOverVideo',
|
|
18035
18050
|
eventDescription: 'User finished playing the video',
|
|
18036
18051
|
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 : '',
|
|
18037
|
-
|
|
18052
|
+
sceneId: (_l = (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.scene) === null || _k === void 0 ? void 0 : _k.sceneId) !== null && _l !== void 0 ? _l : '',
|
|
18053
|
+
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 : '',
|
|
18038
18054
|
endTime: videoCurrentTime,
|
|
18039
18055
|
videoDuration,
|
|
18040
18056
|
playDuration,
|
|
18041
|
-
contentTags: JSON.stringify((
|
|
18057
|
+
contentTags: JSON.stringify((_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []),
|
|
18042
18058
|
position: index + '',
|
|
18043
18059
|
contentFormat: 'video',
|
|
18044
|
-
traceInfo: (
|
|
18060
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
18045
18061
|
}
|
|
18046
18062
|
});
|
|
18047
18063
|
}
|
|
@@ -18049,27 +18065,8 @@ Made in Italy` })));
|
|
|
18049
18065
|
const handleWaiting = React.useCallback(() => {
|
|
18050
18066
|
setWaiting(true);
|
|
18051
18067
|
}, []);
|
|
18052
|
-
const handleTimeUpload = () => {
|
|
18053
|
-
if (!videoRef.current || !isDiyH5)
|
|
18054
|
-
return;
|
|
18055
|
-
setTimeout(() => {
|
|
18056
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
18057
|
-
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)) {
|
|
18058
|
-
(_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
|
|
18059
|
-
if (!loopPlayRef.current)
|
|
18060
|
-
return;
|
|
18061
|
-
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
|
18062
|
-
(_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);
|
|
18063
|
-
}
|
|
18064
|
-
else {
|
|
18065
|
-
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;
|
|
18066
|
-
(_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);
|
|
18067
|
-
}
|
|
18068
|
-
}
|
|
18069
|
-
});
|
|
18070
|
-
};
|
|
18071
18068
|
React.useEffect(() => {
|
|
18072
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
|
18069
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18073
18070
|
if (!isActive)
|
|
18074
18071
|
return;
|
|
18075
18072
|
const videoSrc = videoUrl;
|
|
@@ -18090,7 +18087,6 @@ Made in Italy` })));
|
|
|
18090
18087
|
hls === null || hls === void 0 ? void 0 : hls.attachMedia(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current);
|
|
18091
18088
|
hls === null || hls === void 0 ? void 0 : hls.on(Hls.Events.MANIFEST_PARSED, function () {
|
|
18092
18089
|
var _a;
|
|
18093
|
-
setCurrentTimeByStartTime();
|
|
18094
18090
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
|
18095
18091
|
});
|
|
18096
18092
|
}
|
|
@@ -18104,12 +18100,11 @@ Made in Italy` })));
|
|
|
18104
18100
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.addEventListener('play', handleStartPlay);
|
|
18105
18101
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.addEventListener('playing', handlePlaying);
|
|
18106
18102
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.addEventListener('pause', handlePause);
|
|
18107
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended',
|
|
18103
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handleEnd);
|
|
18108
18104
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.addEventListener('canplay', handlePlay);
|
|
18109
18105
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
|
|
18110
|
-
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.addEventListener('timeupdate', handleTimeUpload);
|
|
18111
18106
|
return () => {
|
|
18112
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
|
18107
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18113
18108
|
const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
|
|
18114
18109
|
if (!isPause)
|
|
18115
18110
|
handlePause();
|
|
@@ -18121,10 +18116,9 @@ Made in Italy` })));
|
|
|
18121
18116
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.removeEventListener('play', handleStartPlay);
|
|
18122
18117
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.removeEventListener('playing', handlePlaying);
|
|
18123
18118
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.removeEventListener('pause', handlePause);
|
|
18124
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended',
|
|
18119
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handleEnd);
|
|
18125
18120
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('canplay', handlePlay);
|
|
18126
18121
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.removeEventListener('waiting', handleWaiting);
|
|
18127
|
-
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.removeEventListener('timeupdate', handleTimeUpload);
|
|
18128
18122
|
};
|
|
18129
18123
|
}, [isActive]);
|
|
18130
18124
|
React.useEffect(() => {
|
|
@@ -18335,19 +18329,48 @@ Made in Italy` })));
|
|
|
18335
18329
|
}, onLoad: onShowFirstImage }))));
|
|
18336
18330
|
};
|
|
18337
18331
|
|
|
18338
|
-
const PictureGroup$4 = ({ imgUrls,
|
|
18332
|
+
const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig, swiperRef }, ref) => {
|
|
18339
18333
|
var _a, _b;
|
|
18340
18334
|
const { isActive } = useSwiperSlide();
|
|
18341
|
-
const { sxpParameter, openHashtag } = useSxpDataSource();
|
|
18335
|
+
const { sxpParameter, openHashtag, isDiyH5 } = useSxpDataSource();
|
|
18342
18336
|
const [isLoad, setIsLoad] = React.useState(false);
|
|
18343
18337
|
const [imgInfo, setImgInfo] = React.useState();
|
|
18344
18338
|
const [swiperActiveIndex, setSwiperActiveIndex] = React.useState(0);
|
|
18345
|
-
const
|
|
18339
|
+
const imgsSwiperRef = React.useRef();
|
|
18346
18340
|
const isFirstPlayRef = React.useRef(true);
|
|
18341
|
+
const loopPlayRef = React.useRef(true);
|
|
18347
18342
|
const initTime = new Date();
|
|
18343
|
+
React.useImperativeHandle(ref, () => {
|
|
18344
|
+
return {
|
|
18345
|
+
setLoopPlay(v) {
|
|
18346
|
+
loopPlayRef.current = v;
|
|
18347
|
+
}
|
|
18348
|
+
};
|
|
18349
|
+
});
|
|
18350
|
+
React.useEffect(() => {
|
|
18351
|
+
let timerId;
|
|
18352
|
+
if (isLoad && isActive && isDiyH5) {
|
|
18353
|
+
timerId = setTimeout(() => {
|
|
18354
|
+
var _a, _b, _c, _d, _e, _f;
|
|
18355
|
+
if (!loopPlayRef.current)
|
|
18356
|
+
return;
|
|
18357
|
+
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
|
18358
|
+
(_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);
|
|
18359
|
+
}
|
|
18360
|
+
else {
|
|
18361
|
+
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;
|
|
18362
|
+
(_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);
|
|
18363
|
+
}
|
|
18364
|
+
}, 3000);
|
|
18365
|
+
}
|
|
18366
|
+
return () => {
|
|
18367
|
+
if (timerId)
|
|
18368
|
+
clearTimeout(timerId);
|
|
18369
|
+
};
|
|
18370
|
+
}, [isLoad, isActive, isDiyH5, data, index, swiperRef]);
|
|
18348
18371
|
React.useEffect(() => {
|
|
18349
18372
|
if (isLoad && isActive) {
|
|
18350
|
-
(
|
|
18373
|
+
(imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.start();
|
|
18351
18374
|
if (openHashtag) {
|
|
18352
18375
|
onViewImageEndEvent(rec);
|
|
18353
18376
|
}
|
|
@@ -18357,7 +18380,7 @@ Made in Italy` })));
|
|
|
18357
18380
|
}
|
|
18358
18381
|
}
|
|
18359
18382
|
else {
|
|
18360
|
-
(
|
|
18383
|
+
(imgsSwiperRef === null || imgsSwiperRef === void 0 ? void 0 : imgsSwiperRef.current) && imgsSwiperRef.current.swiper.autoplay.stop();
|
|
18361
18384
|
}
|
|
18362
18385
|
}, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
|
|
18363
18386
|
const showFirstImageFn = React.useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
|
|
@@ -18384,13 +18407,13 @@ Made in Italy` })));
|
|
|
18384
18407
|
};
|
|
18385
18408
|
}, [isActive, imgInfo]);
|
|
18386
18409
|
const handleMouseEnter = React.useCallback(() => {
|
|
18387
|
-
if (
|
|
18388
|
-
|
|
18410
|
+
if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
|
|
18411
|
+
imgsSwiperRef.current.swiper.autoplay.stop();
|
|
18389
18412
|
}
|
|
18390
18413
|
}, []);
|
|
18391
18414
|
const handleMouseLeave = React.useCallback(() => {
|
|
18392
|
-
if (
|
|
18393
|
-
|
|
18415
|
+
if (imgsSwiperRef.current && imgsSwiperRef.current.swiper && isAlly) {
|
|
18416
|
+
imgsSwiperRef.current.swiper.autoplay.start();
|
|
18394
18417
|
}
|
|
18395
18418
|
}, []);
|
|
18396
18419
|
const handleSlideChange = React.useCallback((swiper) => {
|
|
@@ -18411,7 +18434,7 @@ Made in Italy` })));
|
|
|
18411
18434
|
enabled: true
|
|
18412
18435
|
}
|
|
18413
18436
|
}
|
|
18414
|
-
: {}), { loop: true, ref:
|
|
18437
|
+
: {}), { loop: true, ref: imgsSwiperRef, onSlideChange: handleSlideChange, className: css.css(Object.assign(Object.assign({ '.swiper-pagination': {
|
|
18415
18438
|
bottom: (_a = imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.marginBottom) !== null && _a !== void 0 ? _a : 0,
|
|
18416
18439
|
fontSize: '14px'
|
|
18417
18440
|
} }, ((imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.dotsBgColor) && {
|
|
@@ -18428,7 +18451,7 @@ Made in Italy` })));
|
|
|
18428
18451
|
return (React.createElement(SwiperSlide, { key: srcKey, "aria-hidden": srcKey !== swiperActiveIndex },
|
|
18429
18452
|
React.createElement(Picture, { src: !isLoad && srcKey > 0 ? '' : url, height: height, imgUrlsPostConfig: imgUrlsPostConfig, onShowFirstImage: showFirstImageFn })));
|
|
18430
18453
|
}))));
|
|
18431
|
-
};
|
|
18454
|
+
});
|
|
18432
18455
|
var PictureGroup$5 = React.memo(PictureGroup$4);
|
|
18433
18456
|
|
|
18434
18457
|
/*
|
|
@@ -18708,7 +18731,7 @@ Made in Italy` })));
|
|
|
18708
18731
|
* @Author: binruan@chatlabs.com
|
|
18709
18732
|
* @Date: 2024-03-20 10:27:31
|
|
18710
18733
|
* @LastEditors: binruan@chatlabs.com
|
|
18711
|
-
* @LastEditTime: 2025-05-
|
|
18734
|
+
* @LastEditTime: 2025-05-12 14:26:15
|
|
18712
18735
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
|
18713
18736
|
*
|
|
18714
18737
|
*/
|
|
@@ -18728,6 +18751,7 @@ Made in Italy` })));
|
|
|
18728
18751
|
const skipLinkRef = React.useRef(false);
|
|
18729
18752
|
const [pageNum, setPageNum] = React.useState(2);
|
|
18730
18753
|
const videoWidgetRef = React.useRef(null);
|
|
18754
|
+
const pictureGroupRef = React.useRef(null);
|
|
18731
18755
|
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();
|
|
18732
18756
|
const { backMainFeed, productView, jumpToWeb } = useEventReport();
|
|
18733
18757
|
const isShowFingerTip = React.useMemo(() => {
|
|
@@ -18775,7 +18799,7 @@ Made in Italy` })));
|
|
|
18775
18799
|
(_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
|
|
18776
18800
|
}, [data, ctaType, swiperRef]);
|
|
18777
18801
|
const handleSessionCompleted = React.useCallback((fk) => {
|
|
18778
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
|
18802
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
|
|
18779
18803
|
const item = data === null || data === void 0 ? void 0 : data[activeIndex];
|
|
18780
18804
|
let fromKName = '';
|
|
18781
18805
|
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))) {
|
|
@@ -18802,12 +18826,13 @@ Made in Italy` })));
|
|
|
18802
18826
|
eventSubject: 'sessionCompleted',
|
|
18803
18827
|
eventDescription: 'Session completed',
|
|
18804
18828
|
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
|
18805
|
-
|
|
18829
|
+
sceneId: (_q = (_p = (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.scene) === null || _p === void 0 ? void 0 : _p.sceneId) !== null && _q !== void 0 ? _q : '',
|
|
18830
|
+
productId: (_r = item === null || item === void 0 ? void 0 : item.product) === null || _r === void 0 ? void 0 : _r.itemId,
|
|
18806
18831
|
position: activeIndex + '',
|
|
18807
18832
|
fromKName: fk || fromKName,
|
|
18808
18833
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
|
18809
|
-
ctatId: (
|
|
18810
|
-
traceInfo: (
|
|
18834
|
+
ctatId: (_u = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.bindCta) === null || _t === void 0 ? void 0 : _t.itemId) !== null && _u !== void 0 ? _u : '',
|
|
18835
|
+
traceInfo: (_y = (_w = (_v = item === null || item === void 0 ? void 0 : item.video) === null || _v === void 0 ? void 0 : _v.traceInfo) !== null && _w !== void 0 ? _w : (_x = item === null || item === void 0 ? void 0 : item.product) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : ''
|
|
18811
18836
|
}
|
|
18812
18837
|
});
|
|
18813
18838
|
}, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime]);
|
|
@@ -18866,8 +18891,9 @@ Made in Italy` })));
|
|
|
18866
18891
|
refreshFeSession
|
|
18867
18892
|
]);
|
|
18868
18893
|
const handleSessionExpire = React.useCallback(lodash.debounce(() => {
|
|
18869
|
-
var _a;
|
|
18894
|
+
var _a, _b;
|
|
18870
18895
|
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
|
18896
|
+
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
|
18871
18897
|
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
|
|
18872
18898
|
}, 1000), [handleSessionCompleted, refreshFeSession]);
|
|
18873
18899
|
React.useEffect(() => {
|
|
@@ -18937,18 +18963,18 @@ Made in Italy` })));
|
|
|
18937
18963
|
return null;
|
|
18938
18964
|
}, [globalConfig, activeIndex, visList]);
|
|
18939
18965
|
const renderContent = React.useCallback((rec, index) => {
|
|
18940
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
18966
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
18941
18967
|
if (rec === 'organic menu') {
|
|
18942
18968
|
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)));
|
|
18943
18969
|
}
|
|
18944
|
-
if ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null ||
|
|
18970
|
+
if (((_h = (_g = rec.video) === null || _g === void 0 ? void 0 : _g.scene) === null || _h === void 0 ? void 0 : _h.mediaUrl) || ((_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.url)) {
|
|
18945
18971
|
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 })));
|
|
18946
18972
|
}
|
|
18947
|
-
if ((
|
|
18948
|
-
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 }));
|
|
18973
|
+
if ((_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.imgUrls) {
|
|
18974
|
+
return (React.createElement(PictureGroup$5, Object.assign({ data: data }, (activeIndex === index && { ref: pictureGroupRef }), { key: rec === null || rec === void 0 ? void 0 : rec.video.itemId, imgUrls: rec === null || rec === void 0 ? void 0 : rec.video.imgUrls, width: containerWidth, height: height, rec: rec, index: index, onViewImageEndEvent: handleViewImageStartEnd, onViewImageStartEvent: handleViewImageStartEvent, imgUrlsPostConfig: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.imgUrlsPost, swiperRef: swiperRef })));
|
|
18949
18975
|
}
|
|
18950
|
-
if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((
|
|
18951
|
-
return (
|
|
18976
|
+
if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((_l = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _l === void 0 ? void 0 : _l.length) > 0) {
|
|
18977
|
+
return (_m = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _m === void 0 ? void 0 : _m.map((value, idx) => {
|
|
18952
18978
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
18953
18979
|
const t = resolver[(_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type];
|
|
18954
18980
|
const Component = withBindDataSource(t);
|
|
@@ -18986,7 +19012,7 @@ Made in Italy` })));
|
|
|
18986
19012
|
};
|
|
18987
19013
|
}, [isShowMore]);
|
|
18988
19014
|
const renderBottom = React.useCallback((rec, index) => {
|
|
18989
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
19015
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
18990
19016
|
if (rec === null || rec === void 0 ? void 0 : rec.video) {
|
|
18991
19017
|
let cta = null;
|
|
18992
19018
|
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) {
|
|
@@ -18995,22 +19021,25 @@ Made in Italy` })));
|
|
|
18995
19021
|
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
|
|
18996
19022
|
cta = '商品CTA';
|
|
18997
19023
|
}
|
|
19024
|
+
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)) {
|
|
19025
|
+
cta = '服务CTA';
|
|
19026
|
+
}
|
|
18998
19027
|
else {
|
|
18999
|
-
cta = (
|
|
19028
|
+
cta = (_h = (_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.bindCta) === null || _h === void 0 ? void 0 : _h.itemId;
|
|
19000
19029
|
}
|
|
19001
19030
|
const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
|
|
19002
19031
|
const isNineProduct = (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nineProductEnable) && index === ((rtcList === null || rtcList === void 0 ? void 0 : rtcList[0]) === 'organic menu' ? 2 : 1);
|
|
19003
19032
|
return (React.createElement(React.Fragment, null,
|
|
19004
19033
|
isNineProduct && (React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value, isNineProduct: isNineProduct })),
|
|
19005
|
-
((
|
|
19006
|
-
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(
|
|
19034
|
+
((_j = rec === null || rec === void 0 ? void 0 : rec.video) === null || _j === void 0 ? void 0 : _j.title) && !isShowMore && React.createElement("div", { className: 'clc-sxp-bottom-shadow' }),
|
|
19035
|
+
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(_k = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.bottomInfoDist) !== null && _k !== void 0 ? _k : 40}px` } },
|
|
19007
19036
|
React.createElement(Nudge, { nudge: nudge }),
|
|
19008
19037
|
((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' },
|
|
19009
19038
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
|
|
19010
19039
|
React.createElement("div", null,
|
|
19011
|
-
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: (
|
|
19040
|
+
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: (_m = (_l = rec === null || rec === void 0 ? void 0 : rec.video) === null || _l === void 0 ? void 0 : _l.title) !== null && _m !== void 0 ? _m : '', 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 }),
|
|
19012
19041
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
|
|
19013
|
-
React.createElement(Hashtag$1, { index: activeIndex, tags: (
|
|
19042
|
+
React.createElement(Hashtag$1, { index: activeIndex, tags: (_p = (_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.hashTags) !== null && _p !== void 0 ? _p : [], itemId: (_q = rec === null || rec === void 0 ? void 0 : rec.video) === null || _q === void 0 ? void 0 : _q.itemId, itemType: ((_r = rec === null || rec === void 0 ? void 0 : rec.video) === null || _r === void 0 ? void 0 : _r.itemId) ? 'VIDEO' : null, rec: rec, hashTagStyle: hashTagStyle, hashTagRightMargin: containerWidth - (hashTagRightMargin !== null && hashTagRightMargin !== void 0 ? hashTagRightMargin : 0) }))),
|
|
19014
19043
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
|
|
19015
19044
|
}
|
|
19016
19045
|
return null;
|
|
@@ -19049,7 +19078,7 @@ Made in Italy` })));
|
|
|
19049
19078
|
return null;
|
|
19050
19079
|
}, [globalConfig, waterFallData]);
|
|
19051
19080
|
const handleViewImageStartEnd = (item) => {
|
|
19052
|
-
var _a, _b, _c, _d, _e, _f;
|
|
19081
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
19053
19082
|
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)) {
|
|
19054
19083
|
const endTime = Date.now();
|
|
19055
19084
|
const duration = viewImageStartTime.current === 0 ? 0 : (endTime - viewImageStartTime.current) / 1000;
|
|
@@ -19058,10 +19087,11 @@ Made in Italy` })));
|
|
|
19058
19087
|
eventSubject: 'viewImageCarouselEnd',
|
|
19059
19088
|
eventDescription: 'User end view the image carousel',
|
|
19060
19089
|
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 : '',
|
|
19061
|
-
|
|
19090
|
+
sceneId: (_g = (_f = (_e = item === null || item === void 0 ? void 0 : item.video) === null || _e === void 0 ? void 0 : _e.scene) === null || _f === void 0 ? void 0 : _f.sceneId) !== null && _g !== void 0 ? _g : '',
|
|
19091
|
+
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
|
19062
19092
|
imageEndTime: `${endTime}`,
|
|
19063
19093
|
playDuration: `${duration}`,
|
|
19064
|
-
contentTags: JSON.stringify((
|
|
19094
|
+
contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
|
|
19065
19095
|
position: activeIndex + '',
|
|
19066
19096
|
contentFormat: 'image',
|
|
19067
19097
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo
|
|
@@ -19070,7 +19100,7 @@ Made in Italy` })));
|
|
|
19070
19100
|
}
|
|
19071
19101
|
};
|
|
19072
19102
|
const handleSlideSkip = (item, position) => {
|
|
19073
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
|
19103
|
+
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;
|
|
19074
19104
|
if (isPreview || waterFallData)
|
|
19075
19105
|
return;
|
|
19076
19106
|
const t = new Date() - curTime.current;
|
|
@@ -19096,7 +19126,8 @@ Made in Italy` })));
|
|
|
19096
19126
|
contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
|
|
19097
19127
|
position: position + '',
|
|
19098
19128
|
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 : '',
|
|
19099
|
-
|
|
19129
|
+
sceneId: (_w = (_v = (_u = item === null || item === void 0 ? void 0 : item.video) === null || _u === void 0 ? void 0 : _u.scene) === null || _v === void 0 ? void 0 : _v.sceneId) !== null && _w !== void 0 ? _w : '',
|
|
19130
|
+
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 : '',
|
|
19100
19131
|
contentFormat
|
|
19101
19132
|
}
|
|
19102
19133
|
});
|
|
@@ -19106,7 +19137,7 @@ Made in Italy` })));
|
|
|
19106
19137
|
}
|
|
19107
19138
|
};
|
|
19108
19139
|
const handleScrollEvent = (swiper) => {
|
|
19109
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
|
|
19140
|
+
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;
|
|
19110
19141
|
const item = data[swiper.previousIndex];
|
|
19111
19142
|
if (!item)
|
|
19112
19143
|
return;
|
|
@@ -19123,11 +19154,12 @@ Made in Italy` })));
|
|
|
19123
19154
|
eventSubject: 'scrollDown',
|
|
19124
19155
|
eventDescription: 'User scroll down',
|
|
19125
19156
|
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 : '',
|
|
19126
|
-
|
|
19157
|
+
sceneId: (_h = (_g = (_f = item === null || item === void 0 ? void 0 : item.video) === null || _f === void 0 ? void 0 : _f.scene) === null || _g === void 0 ? void 0 : _g.sceneId) !== null && _h !== void 0 ? _h : '',
|
|
19158
|
+
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 : '',
|
|
19127
19159
|
requestId: null,
|
|
19128
|
-
traceInfo: (
|
|
19160
|
+
traceInfo: (_p = (_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.traceInfo) !== null && _m !== void 0 ? _m : (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.traceInfo) !== null && _p !== void 0 ? _p : '',
|
|
19129
19161
|
contentFormat,
|
|
19130
|
-
position: ((
|
|
19162
|
+
position: ((_q = swiper.previousIndex) !== null && _q !== void 0 ? _q : 0) + ''
|
|
19131
19163
|
}
|
|
19132
19164
|
});
|
|
19133
19165
|
// 如果上一个商品是图片集，需上报 浏览图片集结结束 事件
|
|
@@ -19139,12 +19171,13 @@ Made in Italy` })));
|
|
|
19139
19171
|
eventInfo: {
|
|
19140
19172
|
eventSubject: 'scrollUp',
|
|
19141
19173
|
eventDescription: 'User scroll up',
|
|
19142
|
-
contentId: (
|
|
19143
|
-
|
|
19174
|
+
contentId: (_s = (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.itemId) !== null && _s !== void 0 ? _s : '',
|
|
19175
|
+
sceneId: (_v = (_u = (_t = item === null || item === void 0 ? void 0 : item.video) === null || _t === void 0 ? void 0 : _t.scene) === null || _u === void 0 ? void 0 : _u.sceneId) !== null && _v !== void 0 ? _v : '',
|
|
19176
|
+
productId: (_x = (_w = item.product) === null || _w === void 0 ? void 0 : _w.itemId) !== null && _x !== void 0 ? _x : '',
|
|
19144
19177
|
requestId: null,
|
|
19145
|
-
traceInfo: (
|
|
19178
|
+
traceInfo: (_1 = (_z = (_y = item === null || item === void 0 ? void 0 : item.video) === null || _y === void 0 ? void 0 : _y.traceInfo) !== null && _z !== void 0 ? _z : (_0 = item === null || item === void 0 ? void 0 : item.product) === null || _0 === void 0 ? void 0 : _0.traceInfo) !== null && _1 !== void 0 ? _1 : '',
|
|
19146
19179
|
contentFormat,
|
|
19147
|
-
position: ((
|
|
19180
|
+
position: ((_2 = swiper.previousIndex) !== null && _2 !== void 0 ? _2 : 0) + ''
|
|
19148
19181
|
}
|
|
19149
19182
|
});
|
|
19150
19183
|
// 如果上一个商品是图片集，需上报 浏览图片集结结束 事件
|
|
@@ -19170,7 +19203,7 @@ Made in Italy` })));
|
|
|
19170
19203
|
}
|
|
19171
19204
|
}, [openHashtag, data, activeIndex]);
|
|
19172
19205
|
const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
|
|
19173
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
19206
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
19174
19207
|
const item = data[activeIndex];
|
|
19175
19208
|
// 如果是图片集则上报事件
|
|
19176
19209
|
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)) {
|
|
@@ -19181,9 +19214,10 @@ Made in Italy` })));
|
|
|
19181
19214
|
eventSubject: 'viewImageCarouselStart',
|
|
19182
19215
|
eventDescription: 'User start view the image carousel',
|
|
19183
19216
|
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 : '',
|
|
19184
|
-
|
|
19217
|
+
sceneId: (_g = (_f = (_e = item === null || item === void 0 ? void 0 : item.video) === null || _e === void 0 ? void 0 : _e.scene) === null || _f === void 0 ? void 0 : _f.sceneId) !== null && _g !== void 0 ? _g : '',
|
|
19218
|
+
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
|
19185
19219
|
imageStartTime: `${startTime}`,
|
|
19186
|
-
contentTags: JSON.stringify((
|
|
19220
|
+
contentTags: JSON.stringify((_j = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _j !== void 0 ? _j : []),
|
|
19187
19221
|
position: activeIndex + '',
|
|
19188
19222
|
contentFormat: 'image',
|
|
19189
19223
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
|
|
@@ -19193,11 +19227,11 @@ Made in Italy` })));
|
|
|
19193
19227
|
if (enableCapi) {
|
|
19194
19228
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
19195
19229
|
eventName: 'ViewContent',
|
|
19196
|
-
product: (
|
|
19230
|
+
product: (_k = item === null || item === void 0 ? void 0 : item.video) === null || _k === void 0 ? void 0 : _k.bindProduct
|
|
19197
19231
|
});
|
|
19198
19232
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
|
19199
19233
|
eventName: 'PageView',
|
|
19200
|
-
product: (
|
|
19234
|
+
product: (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.bindProduct
|
|
19201
19235
|
});
|
|
19202
19236
|
}
|
|
19203
19237
|
}
|
|
@@ -19350,7 +19384,7 @@ Made in Italy` })));
|
|
|
19350
19384
|
}, []);
|
|
19351
19385
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
|
19352
19386
|
const handlePlaying = React.useCallback(() => {
|
|
19353
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
19387
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
19354
19388
|
setIsPauseVideo(false);
|
|
19355
19389
|
const item = data[index];
|
|
19356
19390
|
if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
|
|
@@ -19363,14 +19397,15 @@ Made in Italy` })));
|
|
|
19363
19397
|
eventSubject: 'playVideo',
|
|
19364
19398
|
eventDescription: 'User played the video',
|
|
19365
19399
|
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 : '',
|
|
19366
|
-
|
|
19400
|
+
sceneId: (_l = (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.scene) === null || _k === void 0 ? void 0 : _k.sceneId) !== null && _l !== void 0 ? _l : '',
|
|
19401
|
+
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 : '',
|
|
19367
19402
|
playType,
|
|
19368
19403
|
startTime: videoCurrentTime,
|
|
19369
19404
|
videoDuration,
|
|
19370
|
-
contentTags: JSON.stringify((
|
|
19405
|
+
contentTags: JSON.stringify((_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []),
|
|
19371
19406
|
position: index + '',
|
|
19372
19407
|
contentFormat: 'video',
|
|
19373
|
-
traceInfo: (
|
|
19408
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
19374
19409
|
}
|
|
19375
19410
|
});
|
|
19376
19411
|
setIsFirstPlay(false);
|
|
@@ -19409,7 +19444,7 @@ Made in Italy` })));
|
|
|
19409
19444
|
}
|
|
19410
19445
|
}, [isLoadFinish]);
|
|
19411
19446
|
const onPause = React.useCallback(() => {
|
|
19412
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
19447
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
|
|
19413
19448
|
const item = data[index];
|
|
19414
19449
|
const videoDuration = ((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
|
|
19415
19450
|
const videoCurrentTime = ((_d = (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
|
|
@@ -19420,14 +19455,15 @@ Made in Italy` })));
|
|
|
19420
19455
|
eventSubject: 'playOverVideo',
|
|
19421
19456
|
eventDescription: 'User finished playing the video',
|
|
19422
19457
|
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 : '',
|
|
19423
|
-
|
|
19458
|
+
sceneId: (_l = (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.scene) === null || _k === void 0 ? void 0 : _k.sceneId) !== null && _l !== void 0 ? _l : '',
|
|
19459
|
+
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 : '',
|
|
19424
19460
|
endTime: videoCurrentTime,
|
|
19425
19461
|
videoDuration,
|
|
19426
19462
|
playDuration,
|
|
19427
|
-
contentTags: JSON.stringify((
|
|
19463
|
+
contentTags: JSON.stringify((_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.tags) !== null && _q !== void 0 ? _q : []),
|
|
19428
19464
|
position: index + '',
|
|
19429
19465
|
contentFormat: 'video',
|
|
19430
|
-
traceInfo: (
|
|
19466
|
+
traceInfo: (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo
|
|
19431
19467
|
}
|
|
19432
19468
|
});
|
|
19433
19469
|
}
|