pb-sxp-ui 1.16.10 → 1.16.12
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 +140 -164
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +140 -164
- 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 +140 -164
- 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 +36 -47
- package/es/core/context/SxpDataSourceProvider.js +2 -2
- package/es/core/hooks/useEventReport.js +5 -6
- package/es/materials/sxp/popup/CommodityDetail/index.js +7 -1
- package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +7 -1
- 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 +36 -47
- package/lib/core/context/SxpDataSourceProvider.js +2 -2
- package/lib/core/hooks/useEventReport.js +5 -6
- package/lib/materials/sxp/popup/CommodityDetail/index.js +7 -1
- package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +7 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
@@ -1085,7 +1085,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1085
1085
|
}
|
1086
1086
|
}), [bffFetch, utmVal]);
|
1087
1087
|
const ctaEvent = React.useCallback((eventInfo, rec, product, position) => {
|
1088
|
-
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
|
1088
|
+
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
1089
|
const cta = product === null || product === void 0 ? void 0 : product.bindCta;
|
1090
1090
|
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);
|
1091
1091
|
let fromKName = '';
|
@@ -1103,7 +1103,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1103
1103
|
}
|
1104
1104
|
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;
|
1105
1105
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
1106
|
-
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 : '',
|
1106
|
+
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 })
|
1107
1107
|
});
|
1108
1108
|
}, [bffEventReport, isFromHashtag]);
|
1109
1109
|
const h5EnterLink = React.useCallback(() => {
|
@@ -1764,14 +1764,14 @@ var settingRender$f = [
|
|
1764
1764
|
* @Author: binruan@chatlabs.com
|
1765
1765
|
* @Date: 2024-03-12 10:59:06
|
1766
1766
|
* @LastEditors: binruan@chatlabs.com
|
1767
|
-
* @LastEditTime:
|
1767
|
+
* @LastEditTime: 2024-11-28 11:17:16
|
1768
1768
|
* @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
|
1769
1769
|
*
|
1770
1770
|
*/
|
1771
1771
|
function useEventReport() {
|
1772
1772
|
const { bffEventReport, popupDetailData, isFromHashtag, eventTimeList, setEventTimeList } = useSxpDataSource();
|
1773
1773
|
const jumpToWeb = React.useCallback((e, data, product, cta, position, traceInfo) => {
|
1774
|
-
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
|
1774
|
+
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
1775
|
const i = eventTimeList === null || eventTimeList === void 0 ? void 0 : eventTimeList.findIndex((item) => item.target === (e === null || e === void 0 ? void 0 : e.target));
|
1776
1776
|
if (i !== -1) {
|
1777
1777
|
return;
|
@@ -1804,11 +1804,11 @@ function useEventReport() {
|
|
1804
1804
|
contentFormat = 'image';
|
1805
1805
|
}
|
1806
1806
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
1807
|
-
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 : '',
|
1807
|
+
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 }))
|
1808
1808
|
});
|
1809
1809
|
}, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
|
1810
1810
|
const productView = React.useCallback((data, product, cta, viewTime, position) => {
|
1811
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p
|
1811
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
1812
1812
|
let fromKName = '';
|
1813
1813
|
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))) {
|
1814
1814
|
fromKName = 'pdpPage';
|
@@ -1827,9 +1827,8 @@ function useEventReport() {
|
|
1827
1827
|
contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags),
|
1828
1828
|
position: position + '',
|
1829
1829
|
contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
1830
|
-
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 : '',
|
1831
1830
|
ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
|
1832
|
-
traceInfo: (
|
1831
|
+
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 : '',
|
1833
1832
|
timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
|
1834
1833
|
eventSubject: 'productView',
|
1835
1834
|
eventDescription: 'User browsed the product'
|
@@ -10381,7 +10380,7 @@ const getPriceText = ({ product, enableFormattedPrice, globalConfig, isHiddenDef
|
|
10381
10380
|
const CommodityDetail$1 = (_a) => {
|
10382
10381
|
var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0;
|
10383
10382
|
var { content, style, bgImg, onClick, schema, isDefault, bottom_image, tipText, isPost, viewTime, rec, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, isTel, iframeBgColor, isActive = true } = _a, props = __rest(_a, ["content", "style", "bgImg", "onClick", "schema", "isDefault", "bottom_image", "tipText", "isPost", "viewTime", "rec", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "isTel", "iframeBgColor", "isActive"]);
|
10384
|
-
const { sxpParameter, popupDetailData, isPreview, bffFbReport, popupCurTimeRef, checkCommodityIndexRef, globalConfig } = useSxpDataSource();
|
10383
|
+
const { sxpParameter, popupDetailData, isPreview, bffFbReport, popupCurTimeRef, checkCommodityIndexRef, globalConfig, ctaEvent } = useSxpDataSource();
|
10385
10384
|
const { jumpToWeb, productView } = useEventReport();
|
10386
10385
|
const curTimeRef = React.useRef(null);
|
10387
10386
|
const [showModal, setShowModal] = React.useState(false);
|
@@ -10407,6 +10406,12 @@ const CommodityDetail$1 = (_a) => {
|
|
10407
10406
|
if (!isPost) {
|
10408
10407
|
productView(data, product, cta, viewTime || curTimeRef.current, position);
|
10409
10408
|
}
|
10409
|
+
else {
|
10410
|
+
ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
|
10411
|
+
eventSubject: 'clickCta',
|
10412
|
+
eventDescription: 'User clicked the CTA'
|
10413
|
+
}, data, product, position);
|
10414
|
+
}
|
10410
10415
|
window.location.href = window.getJointUtmLink(product.link);
|
10411
10416
|
}
|
10412
10417
|
};
|
@@ -11309,7 +11314,7 @@ const CommodityDetailDiroNew$1 = (_a) => {
|
|
11309
11314
|
var _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;
|
11310
11315
|
var { style, isDefault, rec, viewTime, isPost, bottom_image, tipText, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, isTel, iframeBgColor, isActive = true } = _a, props = __rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "tipText", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "isTel", "iframeBgColor", "isActive"]);
|
11311
11316
|
React.useState(true);
|
11312
|
-
const { sxpParameter, popupCurTimeRef, popupDetailData, isPreview, bffFbReport, checkCommodityIndexRef, globalConfig } = useSxpDataSource();
|
11317
|
+
const { sxpParameter, popupCurTimeRef, popupDetailData, isPreview, bffFbReport, checkCommodityIndexRef, globalConfig, ctaEvent } = useSxpDataSource();
|
11313
11318
|
const { jumpToWeb, productView } = useEventReport();
|
11314
11319
|
React.useState(false);
|
11315
11320
|
React.useState(false);
|
@@ -11338,6 +11343,12 @@ const CommodityDetailDiroNew$1 = (_a) => {
|
|
11338
11343
|
if (!isPost) {
|
11339
11344
|
productView(data, product, cta, viewTime || curTimeRef.current, position);
|
11340
11345
|
}
|
11346
|
+
else {
|
11347
|
+
ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
|
11348
|
+
eventSubject: 'clickCta',
|
11349
|
+
eventDescription: 'User clicked the CTA'
|
11350
|
+
}, data, product, position);
|
11351
|
+
}
|
11341
11352
|
window.location.href = window.getJointUtmLink(product.link);
|
11342
11353
|
}
|
11343
11354
|
};
|
@@ -15632,7 +15643,7 @@ function WaterfallList(_a) {
|
|
15632
15643
|
* @Author: binruan@chatlabs.com
|
15633
15644
|
* @Date: 2024-01-10 10:58:24
|
15634
15645
|
* @LastEditors: binruan@chatlabs.com
|
15635
|
-
* @LastEditTime: 2025-
|
15646
|
+
* @LastEditTime: 2025-02-28 10:00:31
|
15636
15647
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\WaterFall\index.tsx
|
15637
15648
|
*
|
15638
15649
|
*/
|
@@ -15670,7 +15681,7 @@ const WaterFall = (props) => {
|
|
15670
15681
|
}
|
15671
15682
|
}, [waterFallData]);
|
15672
15683
|
const reportTagsView = React.useCallback(() => {
|
15673
|
-
var _a, _b, _c, _d, _e, _f
|
15684
|
+
var _a, _b, _c, _d, _e, _f;
|
15674
15685
|
const rec = recData === null || recData === void 0 ? void 0 : recData.rec;
|
15675
15686
|
if (!rec)
|
15676
15687
|
return;
|
@@ -15690,10 +15701,9 @@ const WaterFall = (props) => {
|
|
15690
15701
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
15691
15702
|
eventInfo: {
|
15692
15703
|
contentId: (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
15693
|
-
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 : '',
|
15694
15704
|
position: cacheActiveIndex + '',
|
15695
|
-
contentTags: JSON.stringify((
|
15696
|
-
traceInfo: (
|
15705
|
+
contentTags: JSON.stringify((_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.tags),
|
15706
|
+
traceInfo: (_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.traceInfo,
|
15697
15707
|
hashTags: JSON.stringify([recData === null || recData === void 0 ? void 0 : recData.hashTag]),
|
15698
15708
|
fromKName,
|
15699
15709
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
@@ -17775,7 +17785,7 @@ const LikeButton = (_a) => {
|
|
17775
17785
|
const likeIcon = useIconLink(defaultLikeIconPath$2);
|
17776
17786
|
const unlikeIcon = useIconLink(defaultUnLikeIconPath$2);
|
17777
17787
|
const handleClick = lodash.debounce(() => __awaiter(void 0, void 0, void 0, function* () {
|
17778
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z
|
17788
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
|
17779
17789
|
if (state) {
|
17780
17790
|
// 先设置状态
|
17781
17791
|
setState(false);
|
@@ -17785,12 +17795,11 @@ const LikeButton = (_a) => {
|
|
17785
17795
|
eventSubject: 'favoriteContentCanceled',
|
17786
17796
|
eventDescription: 'This content was unfavorite by the user',
|
17787
17797
|
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 : '',
|
17788
|
-
|
17789
|
-
|
17790
|
-
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 : []),
|
17798
|
+
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 : '',
|
17799
|
+
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 : []),
|
17791
17800
|
position: position + '',
|
17792
|
-
contentFormat: ((
|
17793
|
-
traceInfo: (
|
17801
|
+
contentFormat: ((_m = recData === null || recData === void 0 ? void 0 : recData.video) === null || _m === void 0 ? void 0 : _m.url) ? 'video' : 'image',
|
17802
|
+
traceInfo: (_o = recData === null || recData === void 0 ? void 0 : recData.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
17794
17803
|
}
|
17795
17804
|
});
|
17796
17805
|
// 如果接口调用失败,则回滚状态
|
@@ -17798,41 +17807,40 @@ const LikeButton = (_a) => {
|
|
17798
17807
|
setState(true);
|
17799
17808
|
}
|
17800
17809
|
else {
|
17801
|
-
const nRtcList = (
|
17810
|
+
const nRtcList = (_p = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
17802
17811
|
if (index === position) {
|
17803
17812
|
item.isCollected = false;
|
17804
17813
|
}
|
17805
17814
|
return item;
|
17806
|
-
})) !== null &&
|
17815
|
+
})) !== null && _p !== void 0 ? _p : [];
|
17807
17816
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
17808
17817
|
}
|
17809
17818
|
}
|
17810
17819
|
else {
|
17811
17820
|
setState(true);
|
17812
|
-
const result = (
|
17821
|
+
const result = (_q = (yield (mutateLike === null || mutateLike === void 0 ? void 0 : mutateLike({ content: JSON.stringify(recData) })))) !== null && _q !== void 0 ? _q : false;
|
17813
17822
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
17814
17823
|
eventInfo: {
|
17815
17824
|
eventSubject: 'favoriteContent',
|
17816
17825
|
eventDescription: 'This content was favorite by the user',
|
17817
|
-
contentId: (
|
17818
|
-
|
17819
|
-
|
17820
|
-
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 : []),
|
17826
|
+
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 : '',
|
17827
|
+
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 : '',
|
17828
|
+
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 : []),
|
17821
17829
|
position: position + '',
|
17822
|
-
contentFormat: ((
|
17823
|
-
traceInfo: (
|
17830
|
+
contentFormat: ((_x = recData === null || recData === void 0 ? void 0 : recData.video) === null || _x === void 0 ? void 0 : _x.url) ? 'video' : 'image',
|
17831
|
+
traceInfo: (_y = recData === null || recData === void 0 ? void 0 : recData.video) === null || _y === void 0 ? void 0 : _y.traceInfo
|
17824
17832
|
}
|
17825
17833
|
});
|
17826
17834
|
if (!result) {
|
17827
17835
|
setState(false);
|
17828
17836
|
}
|
17829
17837
|
else {
|
17830
|
-
const nRtcList = (
|
17838
|
+
const nRtcList = (_z = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
17831
17839
|
if (index === position) {
|
17832
17840
|
item.isCollected = true;
|
17833
17841
|
}
|
17834
17842
|
return item;
|
17835
|
-
})) !== null &&
|
17843
|
+
})) !== null && _z !== void 0 ? _z : [];
|
17836
17844
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
17837
17845
|
}
|
17838
17846
|
}
|
@@ -17935,26 +17943,6 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
17935
17943
|
return;
|
17936
17944
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
17937
17945
|
}, [videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
17938
|
-
const handleEnd = () => {
|
17939
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
17940
|
-
if (!videoRef.current)
|
17941
|
-
return;
|
17942
|
-
if (isDiyH5) {
|
17943
|
-
(_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
|
17944
|
-
if (!loopPlayRef.current)
|
17945
|
-
return;
|
17946
|
-
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
17947
|
-
(_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);
|
17948
|
-
}
|
17949
|
-
else {
|
17950
|
-
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;
|
17951
|
-
(_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);
|
17952
|
-
}
|
17953
|
-
}
|
17954
|
-
else {
|
17955
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.play();
|
17956
|
-
}
|
17957
|
-
};
|
17958
17946
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
17959
17947
|
const handlePlaying = React.useCallback(() => {
|
17960
17948
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
@@ -17963,7 +17951,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
17963
17951
|
setIsLoadFinish(true);
|
17964
17952
|
}, []);
|
17965
17953
|
const handleStartPlay = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
17966
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q
|
17954
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
17967
17955
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
17968
17956
|
return;
|
17969
17957
|
setIsPauseVideo(false);
|
@@ -17974,11 +17962,16 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
17974
17962
|
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);
|
17975
17963
|
const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
|
17976
17964
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
17977
|
-
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 : '',
|
17965
|
+
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) + '' }))
|
17978
17966
|
});
|
17979
17967
|
isFirstPlayRef.current = false;
|
17980
17968
|
}
|
17981
17969
|
}), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
17970
|
+
const setCurrentTimeByStartTime = React.useCallback(() => {
|
17971
|
+
if (isDiyH5) {
|
17972
|
+
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
17973
|
+
}
|
17974
|
+
}, []);
|
17982
17975
|
const handLoadeddata = React.useCallback(() => {
|
17983
17976
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
|
17984
17977
|
return;
|
@@ -18003,12 +17996,13 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18003
17996
|
const handleLoadedmetadata = React.useCallback(() => {
|
18004
17997
|
if (!videoRef.current)
|
18005
17998
|
return;
|
17999
|
+
setCurrentTimeByStartTime();
|
18006
18000
|
loadedTimeRef.current = new Date();
|
18007
18001
|
handleStartPlay();
|
18008
18002
|
handLoadeddata();
|
18009
18003
|
}, [videoRef.current, handLoadeddata, handleStartPlay]);
|
18010
18004
|
const handleClickVideo = React.useCallback((type) => () => {
|
18011
|
-
var _a, _b, _c, _d, _e;
|
18005
|
+
var _a, _b, _c, _d, _e, _f;
|
18012
18006
|
if (!videoRef.current)
|
18013
18007
|
return;
|
18014
18008
|
if (!isLoadFinish)
|
@@ -18029,17 +18023,20 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18029
18023
|
break;
|
18030
18024
|
default:
|
18031
18025
|
if (isPause) {
|
18032
|
-
(_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.
|
18026
|
+
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)) {
|
18027
|
+
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
18028
|
+
}
|
18029
|
+
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
|
18033
18030
|
}
|
18034
18031
|
else {
|
18035
|
-
(
|
18032
|
+
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.pause();
|
18036
18033
|
}
|
18037
18034
|
setIsPauseVideo(!isPause);
|
18038
18035
|
break;
|
18039
18036
|
}
|
18040
18037
|
}, [isLoadFinish, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
18041
18038
|
const handlePause = React.useCallback(() => {
|
18042
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o
|
18039
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
18043
18040
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
18044
18041
|
return;
|
18045
18042
|
if (activeIndex !== index)
|
@@ -18055,15 +18052,14 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18055
18052
|
eventSubject: 'playOverVideo',
|
18056
18053
|
eventDescription: 'User finished playing the video',
|
18057
18054
|
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 : '',
|
18058
|
-
|
18059
|
-
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 : '',
|
18055
|
+
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 : '',
|
18060
18056
|
endTime: videoCurrentTime,
|
18061
18057
|
videoDuration,
|
18062
18058
|
playDuration,
|
18063
|
-
contentTags: JSON.stringify((
|
18059
|
+
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 : []),
|
18064
18060
|
position: index + '',
|
18065
18061
|
contentFormat: 'video',
|
18066
|
-
traceInfo: (
|
18062
|
+
traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
18067
18063
|
}
|
18068
18064
|
});
|
18069
18065
|
}
|
@@ -18071,8 +18067,27 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18071
18067
|
const handleWaiting = React.useCallback(() => {
|
18072
18068
|
setWaiting(true);
|
18073
18069
|
}, []);
|
18070
|
+
const handleTimeUpload = () => {
|
18071
|
+
if (!videoRef.current || !isDiyH5)
|
18072
|
+
return;
|
18073
|
+
setTimeout(() => {
|
18074
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
18075
|
+
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)) {
|
18076
|
+
(_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
|
18077
|
+
if (!loopPlayRef.current)
|
18078
|
+
return;
|
18079
|
+
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
18080
|
+
(_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);
|
18081
|
+
}
|
18082
|
+
else {
|
18083
|
+
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;
|
18084
|
+
(_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);
|
18085
|
+
}
|
18086
|
+
}
|
18087
|
+
});
|
18088
|
+
};
|
18074
18089
|
React.useEffect(() => {
|
18075
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
18090
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
18076
18091
|
if (!isActive)
|
18077
18092
|
return;
|
18078
18093
|
const videoSrc = videoUrl;
|
@@ -18093,6 +18108,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18093
18108
|
hls === null || hls === void 0 ? void 0 : hls.attachMedia(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current);
|
18094
18109
|
hls === null || hls === void 0 ? void 0 : hls.on(Hls.Events.MANIFEST_PARSED, function () {
|
18095
18110
|
var _a;
|
18111
|
+
setCurrentTimeByStartTime();
|
18096
18112
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
18097
18113
|
});
|
18098
18114
|
}
|
@@ -18106,11 +18122,12 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18106
18122
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.addEventListener('play', handleStartPlay);
|
18107
18123
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.addEventListener('playing', handlePlaying);
|
18108
18124
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.addEventListener('pause', handlePause);
|
18109
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended',
|
18125
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handlePlay);
|
18110
18126
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.addEventListener('canplay', handlePlay);
|
18111
18127
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
|
18128
|
+
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.addEventListener('timeupdate', handleTimeUpload);
|
18112
18129
|
return () => {
|
18113
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
18130
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
18114
18131
|
const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
|
18115
18132
|
if (!isPause)
|
18116
18133
|
handlePause();
|
@@ -18122,9 +18139,10 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18122
18139
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.removeEventListener('play', handleStartPlay);
|
18123
18140
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.removeEventListener('playing', handlePlaying);
|
18124
18141
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.removeEventListener('pause', handlePause);
|
18125
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended',
|
18142
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handlePlay);
|
18126
18143
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('canplay', handlePlay);
|
18127
18144
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.removeEventListener('waiting', handleWaiting);
|
18145
|
+
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.removeEventListener('timeupdate', handleTimeUpload);
|
18128
18146
|
};
|
18129
18147
|
}, [isActive]);
|
18130
18148
|
React.useEffect(() => {
|
@@ -18335,48 +18353,19 @@ const Picture = (props) => {
|
|
18335
18353
|
}, onLoad: onShowFirstImage }))));
|
18336
18354
|
};
|
18337
18355
|
|
18338
|
-
const PictureGroup$4 =
|
18356
|
+
const PictureGroup$4 = ({ imgUrls, width, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig }) => {
|
18339
18357
|
var _a, _b;
|
18340
18358
|
const { isActive } = useSwiperSlide();
|
18341
|
-
const { sxpParameter, openHashtag
|
18359
|
+
const { sxpParameter, openHashtag } = useSxpDataSource();
|
18342
18360
|
const [isLoad, setIsLoad] = React.useState(false);
|
18343
18361
|
const [imgInfo, setImgInfo] = React.useState();
|
18344
18362
|
const [swiperActiveIndex, setSwiperActiveIndex] = React.useState(0);
|
18345
|
-
const
|
18363
|
+
const swiperRef = React.useRef();
|
18346
18364
|
const isFirstPlayRef = React.useRef(true);
|
18347
|
-
const loopPlayRef = React.useRef(true);
|
18348
18365
|
const initTime = new Date();
|
18349
|
-
React.useImperativeHandle(ref, () => {
|
18350
|
-
return {
|
18351
|
-
setLoopPlay(v) {
|
18352
|
-
loopPlayRef.current = v;
|
18353
|
-
}
|
18354
|
-
};
|
18355
|
-
});
|
18356
|
-
React.useEffect(() => {
|
18357
|
-
let timerId;
|
18358
|
-
if (isLoad && isActive && isDiyH5) {
|
18359
|
-
timerId = setTimeout(() => {
|
18360
|
-
var _a, _b, _c, _d, _e, _f;
|
18361
|
-
if (!loopPlayRef.current)
|
18362
|
-
return;
|
18363
|
-
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
18364
|
-
(_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);
|
18365
|
-
}
|
18366
|
-
else {
|
18367
|
-
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;
|
18368
|
-
(_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);
|
18369
|
-
}
|
18370
|
-
}, 3000);
|
18371
|
-
}
|
18372
|
-
return () => {
|
18373
|
-
if (timerId)
|
18374
|
-
clearTimeout(timerId);
|
18375
|
-
};
|
18376
|
-
}, [isLoad, isActive, isDiyH5, data, index, swiperRef]);
|
18377
18366
|
React.useEffect(() => {
|
18378
18367
|
if (isLoad && isActive) {
|
18379
|
-
(
|
18368
|
+
(swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) && swiperRef.current.swiper.autoplay.start();
|
18380
18369
|
if (openHashtag) {
|
18381
18370
|
onViewImageEndEvent(rec);
|
18382
18371
|
}
|
@@ -18386,7 +18375,7 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
18386
18375
|
}
|
18387
18376
|
}
|
18388
18377
|
else {
|
18389
|
-
(
|
18378
|
+
(swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) && swiperRef.current.swiper.autoplay.stop();
|
18390
18379
|
}
|
18391
18380
|
}, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
|
18392
18381
|
const showFirstImageFn = React.useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
|
@@ -18413,13 +18402,13 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
18413
18402
|
};
|
18414
18403
|
}, [isActive, imgInfo]);
|
18415
18404
|
const handleMouseEnter = React.useCallback(() => {
|
18416
|
-
if (
|
18417
|
-
|
18405
|
+
if (swiperRef.current && swiperRef.current.swiper && isAlly) {
|
18406
|
+
swiperRef.current.swiper.autoplay.stop();
|
18418
18407
|
}
|
18419
18408
|
}, []);
|
18420
18409
|
const handleMouseLeave = React.useCallback(() => {
|
18421
|
-
if (
|
18422
|
-
|
18410
|
+
if (swiperRef.current && swiperRef.current.swiper && isAlly) {
|
18411
|
+
swiperRef.current.swiper.autoplay.start();
|
18423
18412
|
}
|
18424
18413
|
}, []);
|
18425
18414
|
const handleSlideChange = React.useCallback((swiper) => {
|
@@ -18440,7 +18429,7 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
18440
18429
|
enabled: true
|
18441
18430
|
}
|
18442
18431
|
}
|
18443
|
-
: {}), { loop: true, ref:
|
18432
|
+
: {}), { loop: true, ref: swiperRef, onSlideChange: handleSlideChange, className: css.css(Object.assign(Object.assign({ '.swiper-pagination': {
|
18444
18433
|
bottom: (_a = imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.marginBottom) !== null && _a !== void 0 ? _a : 0,
|
18445
18434
|
fontSize: '14px'
|
18446
18435
|
} }, ((imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.dotsBgColor) && {
|
@@ -18457,7 +18446,7 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
18457
18446
|
return (React.createElement(SwiperSlide, { key: srcKey, "aria-hidden": srcKey !== swiperActiveIndex },
|
18458
18447
|
React.createElement(Picture, { src: !isLoad && srcKey > 0 ? '' : url, height: height, imgUrlsPostConfig: imgUrlsPostConfig, onShowFirstImage: showFirstImageFn })));
|
18459
18448
|
}))));
|
18460
|
-
}
|
18449
|
+
};
|
18461
18450
|
var PictureGroup$5 = React.memo(PictureGroup$4);
|
18462
18451
|
|
18463
18452
|
/*
|
@@ -18737,7 +18726,7 @@ var NavBack$1 = React.memo(NavBack);
|
|
18737
18726
|
* @Author: binruan@chatlabs.com
|
18738
18727
|
* @Date: 2024-03-20 10:27:31
|
18739
18728
|
* @LastEditors: binruan@chatlabs.com
|
18740
|
-
* @LastEditTime: 2025-05-
|
18729
|
+
* @LastEditTime: 2025-05-09 15:51:40
|
18741
18730
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
18742
18731
|
*
|
18743
18732
|
*/
|
@@ -18757,7 +18746,6 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18757
18746
|
const skipLinkRef = React.useRef(false);
|
18758
18747
|
const [pageNum, setPageNum] = React.useState(2);
|
18759
18748
|
const videoWidgetRef = React.useRef(null);
|
18760
|
-
const pictureGroupRef = React.useRef(null);
|
18761
18749
|
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();
|
18762
18750
|
const { backMainFeed, productView, jumpToWeb } = useEventReport();
|
18763
18751
|
const isShowFingerTip = React.useMemo(() => {
|
@@ -18805,7 +18793,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18805
18793
|
(_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
|
18806
18794
|
}, [data, ctaType, swiperRef]);
|
18807
18795
|
const handleSessionCompleted = React.useCallback((fk) => {
|
18808
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v
|
18796
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
18809
18797
|
const item = data === null || data === void 0 ? void 0 : data[activeIndex];
|
18810
18798
|
let fromKName = '';
|
18811
18799
|
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))) {
|
@@ -18832,13 +18820,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18832
18820
|
eventSubject: 'sessionCompleted',
|
18833
18821
|
eventDescription: 'Session completed',
|
18834
18822
|
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
18835
|
-
|
18836
|
-
productId: (_r = item === null || item === void 0 ? void 0 : item.product) === null || _r === void 0 ? void 0 : _r.itemId,
|
18823
|
+
productId: (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.itemId,
|
18837
18824
|
position: activeIndex + '',
|
18838
18825
|
fromKName: fk || fromKName,
|
18839
18826
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
18840
|
-
ctatId: (
|
18841
|
-
traceInfo: (
|
18827
|
+
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 : '',
|
18828
|
+
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 : ''
|
18842
18829
|
}
|
18843
18830
|
});
|
18844
18831
|
}, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime]);
|
@@ -18897,9 +18884,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18897
18884
|
refreshFeSession
|
18898
18885
|
]);
|
18899
18886
|
const handleSessionExpire = React.useCallback(lodash.debounce(() => {
|
18900
|
-
var _a
|
18887
|
+
var _a;
|
18901
18888
|
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
18902
|
-
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
18903
18889
|
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
|
18904
18890
|
}, 1000), [handleSessionCompleted, refreshFeSession]);
|
18905
18891
|
React.useEffect(() => {
|
@@ -18969,18 +18955,18 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18969
18955
|
return null;
|
18970
18956
|
}, [globalConfig, activeIndex, visList]);
|
18971
18957
|
const renderContent = React.useCallback((rec, index) => {
|
18972
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
18958
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
18973
18959
|
if (rec === 'organic menu') {
|
18974
18960
|
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)));
|
18975
18961
|
}
|
18976
|
-
if ((
|
18962
|
+
if ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.url) {
|
18977
18963
|
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 })));
|
18978
18964
|
}
|
18979
|
-
if ((
|
18980
|
-
return (React.createElement(PictureGroup$5,
|
18965
|
+
if ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.imgUrls) {
|
18966
|
+
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 }));
|
18981
18967
|
}
|
18982
|
-
if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((
|
18983
|
-
return (
|
18968
|
+
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) {
|
18969
|
+
return (_k = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _k === void 0 ? void 0 : _k.map((value, idx) => {
|
18984
18970
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
18985
18971
|
const t = resolver[(_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type];
|
18986
18972
|
const Component = withBindDataSource(t);
|
@@ -19018,7 +19004,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19018
19004
|
};
|
19019
19005
|
}, [isShowMore]);
|
19020
19006
|
const renderBottom = React.useCallback((rec, index) => {
|
19021
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q
|
19007
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
19022
19008
|
if (rec === null || rec === void 0 ? void 0 : rec.video) {
|
19023
19009
|
let cta = null;
|
19024
19010
|
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) {
|
@@ -19027,27 +19013,24 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19027
19013
|
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
|
19028
19014
|
cta = '商品CTA';
|
19029
19015
|
}
|
19030
|
-
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)) {
|
19031
|
-
cta = '服务CTA';
|
19032
|
-
}
|
19033
19016
|
else {
|
19034
|
-
cta = (
|
19017
|
+
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;
|
19035
19018
|
}
|
19036
19019
|
const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
|
19037
19020
|
const isNineProduct = (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nineProductEnable) &&
|
19038
19021
|
index === ((rtcList === null || rtcList === void 0 ? void 0 : rtcList[0]) === 'organic menu' ? 2 : 1) &&
|
19039
|
-
((
|
19022
|
+
((_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));
|
19040
19023
|
return (React.createElement(React.Fragment, null,
|
19041
19024
|
isNineProduct && (React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value, isNineProduct: isNineProduct })),
|
19042
|
-
((
|
19043
|
-
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(
|
19025
|
+
((_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' }),
|
19026
|
+
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` } },
|
19044
19027
|
React.createElement(Nudge, { nudge: nudge }),
|
19045
19028
|
((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' },
|
19046
19029
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
|
19047
19030
|
React.createElement("div", null,
|
19048
|
-
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: (
|
19031
|
+
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 }),
|
19049
19032
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
|
19050
|
-
React.createElement(Hashtag$1, { index: activeIndex, tags: (
|
19033
|
+
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) }))),
|
19051
19034
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
|
19052
19035
|
}
|
19053
19036
|
return null;
|
@@ -19086,7 +19069,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19086
19069
|
return null;
|
19087
19070
|
}, [globalConfig, waterFallData]);
|
19088
19071
|
const handleViewImageStartEnd = (item) => {
|
19089
|
-
var _a, _b, _c, _d, _e, _f
|
19072
|
+
var _a, _b, _c, _d, _e, _f;
|
19090
19073
|
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)) {
|
19091
19074
|
const endTime = Date.now();
|
19092
19075
|
const duration = viewImageStartTime.current === 0 ? 0 : (endTime - viewImageStartTime.current) / 1000;
|
@@ -19095,11 +19078,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19095
19078
|
eventSubject: 'viewImageCarouselEnd',
|
19096
19079
|
eventDescription: 'User end view the image carousel',
|
19097
19080
|
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 : '',
|
19098
|
-
|
19099
|
-
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
19081
|
+
contentName: (_e = item === null || item === void 0 ? void 0 : item.video.title) !== null && _e !== void 0 ? _e : '',
|
19100
19082
|
imageEndTime: `${endTime}`,
|
19101
19083
|
playDuration: `${duration}`,
|
19102
|
-
contentTags: JSON.stringify((
|
19084
|
+
contentTags: JSON.stringify((_f = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _f !== void 0 ? _f : []),
|
19103
19085
|
position: activeIndex + '',
|
19104
19086
|
contentFormat: 'image',
|
19105
19087
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo
|
@@ -19108,7 +19090,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19108
19090
|
}
|
19109
19091
|
};
|
19110
19092
|
const handleSlideSkip = (item, position) => {
|
19111
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x
|
19093
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
19112
19094
|
if (isPreview || waterFallData)
|
19113
19095
|
return;
|
19114
19096
|
const t = new Date() - curTime.current;
|
@@ -19134,8 +19116,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19134
19116
|
contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
|
19135
19117
|
position: position + '',
|
19136
19118
|
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 : '',
|
19137
|
-
|
19138
|
-
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 : '',
|
19119
|
+
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 : '',
|
19139
19120
|
contentFormat
|
19140
19121
|
}
|
19141
19122
|
});
|
@@ -19145,7 +19126,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19145
19126
|
}
|
19146
19127
|
};
|
19147
19128
|
const handleScrollEvent = (swiper) => {
|
19148
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w
|
19129
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
|
19149
19130
|
const item = data[swiper.previousIndex];
|
19150
19131
|
if (!item)
|
19151
19132
|
return;
|
@@ -19162,12 +19143,11 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19162
19143
|
eventSubject: 'scrollDown',
|
19163
19144
|
eventDescription: 'User scroll down',
|
19164
19145
|
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 : '',
|
19165
|
-
|
19166
|
-
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 : '',
|
19146
|
+
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 : '',
|
19167
19147
|
requestId: null,
|
19168
|
-
traceInfo: (
|
19148
|
+
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 : '',
|
19169
19149
|
contentFormat,
|
19170
|
-
position: ((
|
19150
|
+
position: ((_m = swiper.previousIndex) !== null && _m !== void 0 ? _m : 0) + ''
|
19171
19151
|
}
|
19172
19152
|
});
|
19173
19153
|
// 如果上一个商品是图片集,需上报 浏览图片集结结束 事件
|
@@ -19179,13 +19159,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19179
19159
|
eventInfo: {
|
19180
19160
|
eventSubject: 'scrollUp',
|
19181
19161
|
eventDescription: 'User scroll up',
|
19182
|
-
contentId: (
|
19183
|
-
|
19184
|
-
productId: (_x = (_w = item.product) === null || _w === void 0 ? void 0 : _w.itemId) !== null && _x !== void 0 ? _x : '',
|
19162
|
+
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 : '',
|
19163
|
+
productId: (_r = (_q = item.product) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
|
19185
19164
|
requestId: null,
|
19186
|
-
traceInfo: (
|
19165
|
+
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 : '',
|
19187
19166
|
contentFormat,
|
19188
|
-
position: ((
|
19167
|
+
position: ((_w = swiper.previousIndex) !== null && _w !== void 0 ? _w : 0) + ''
|
19189
19168
|
}
|
19190
19169
|
});
|
19191
19170
|
// 如果上一个商品是图片集,需上报 浏览图片集结结束 事件
|
@@ -19211,7 +19190,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19211
19190
|
}
|
19212
19191
|
}, [openHashtag, data, activeIndex]);
|
19213
19192
|
const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
|
19214
|
-
var _a, _b, _c, _d, _e, _f, _g, _h
|
19193
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
19215
19194
|
const item = data[activeIndex];
|
19216
19195
|
// 如果是图片集则上报事件
|
19217
19196
|
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)) {
|
@@ -19222,10 +19201,9 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19222
19201
|
eventSubject: 'viewImageCarouselStart',
|
19223
19202
|
eventDescription: 'User start view the image carousel',
|
19224
19203
|
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 : '',
|
19225
|
-
|
19226
|
-
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
19204
|
+
contentName: (_e = item === null || item === void 0 ? void 0 : item.video.title) !== null && _e !== void 0 ? _e : '',
|
19227
19205
|
imageStartTime: `${startTime}`,
|
19228
|
-
contentTags: JSON.stringify((
|
19206
|
+
contentTags: JSON.stringify((_f = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _f !== void 0 ? _f : []),
|
19229
19207
|
position: activeIndex + '',
|
19230
19208
|
contentFormat: 'image',
|
19231
19209
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
|
@@ -19235,11 +19213,11 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19235
19213
|
if (enableCapi) {
|
19236
19214
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
19237
19215
|
eventName: 'ViewContent',
|
19238
|
-
product: (
|
19216
|
+
product: (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.bindProduct
|
19239
19217
|
});
|
19240
19218
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
19241
19219
|
eventName: 'PageView',
|
19242
|
-
product: (
|
19220
|
+
product: (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.bindProduct
|
19243
19221
|
});
|
19244
19222
|
}
|
19245
19223
|
}
|
@@ -19392,7 +19370,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19392
19370
|
}, []);
|
19393
19371
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
19394
19372
|
const handlePlaying = React.useCallback(() => {
|
19395
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o
|
19373
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
19396
19374
|
setIsPauseVideo(false);
|
19397
19375
|
const item = data[index];
|
19398
19376
|
if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
|
@@ -19405,15 +19383,14 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19405
19383
|
eventSubject: 'playVideo',
|
19406
19384
|
eventDescription: 'User played the video',
|
19407
19385
|
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 : '',
|
19408
|
-
|
19409
|
-
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 : '',
|
19386
|
+
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 : '',
|
19410
19387
|
playType,
|
19411
19388
|
startTime: videoCurrentTime,
|
19412
19389
|
videoDuration,
|
19413
|
-
contentTags: JSON.stringify((
|
19390
|
+
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 : []),
|
19414
19391
|
position: index + '',
|
19415
19392
|
contentFormat: 'video',
|
19416
|
-
traceInfo: (
|
19393
|
+
traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
19417
19394
|
}
|
19418
19395
|
});
|
19419
19396
|
setIsFirstPlay(false);
|
@@ -19452,7 +19429,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19452
19429
|
}
|
19453
19430
|
}, [isLoadFinish]);
|
19454
19431
|
const onPause = React.useCallback(() => {
|
19455
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o
|
19432
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
19456
19433
|
const item = data[index];
|
19457
19434
|
const videoDuration = ((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
|
19458
19435
|
const videoCurrentTime = ((_d = (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
|
@@ -19463,15 +19440,14 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19463
19440
|
eventSubject: 'playOverVideo',
|
19464
19441
|
eventDescription: 'User finished playing the video',
|
19465
19442
|
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 : '',
|
19466
|
-
|
19467
|
-
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 : '',
|
19443
|
+
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 : '',
|
19468
19444
|
endTime: videoCurrentTime,
|
19469
19445
|
videoDuration,
|
19470
19446
|
playDuration,
|
19471
|
-
contentTags: JSON.stringify((
|
19447
|
+
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 : []),
|
19472
19448
|
position: index + '',
|
19473
19449
|
contentFormat: 'video',
|
19474
|
-
traceInfo: (
|
19450
|
+
traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
19475
19451
|
}
|
19476
19452
|
});
|
19477
19453
|
}
|