pb-sxp-ui 1.16.25 → 1.17.0-alpha
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 +268 -338
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +15 -7
- package/dist/index.js +268 -338
- 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 +268 -338
- 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 +16 -18
- package/es/core/components/SxpPageRender/PictureGroup/index.d.ts +0 -5
- package/es/core/components/SxpPageRender/PictureGroup/index.js +13 -39
- package/es/core/components/SxpPageRender/RenderCard.js +1 -1
- package/es/core/components/SxpPageRender/VideoWidget/index.js +45 -32
- package/es/core/components/SxpPageRender/WaterFall/index.js +3 -4
- package/es/core/components/SxpPageRender/index.js +37 -53
- package/es/core/context/SxpDataSourceProvider.d.ts +12 -5
- package/es/core/context/SxpDataSourceProvider.js +10 -32
- package/es/core/hooks/useEventReport.js +5 -6
- package/es/materials/sxp/consentPopup/Display/index.js +1 -1
- package/es/materials/sxp/cta/AniLinkPopup/material.js +2 -3
- package/es/materials/sxp/popup/CommodityDetail/material.js +1 -2
- package/es/materials/sxp/popup/CommodityList/index.js +4 -5
- package/es/materials/sxp/popup/CommodityList/material.js +1 -1
- package/es/materials/sxp/popup/CommodityList/settingRender.js +1 -1
- package/es/materials/sxp/template/Appoint/material.js +1 -2
- package/es/materials/sxp/template/Commodity/material.js +2 -3
- package/es/materials/sxp/template/CommodityDiro/material.js +2 -3
- package/es/materials/sxp/template/CommodityDiroNew/material.js +2 -4
- package/es/materials/sxp/template/Link/material.js +2 -4
- package/es/materials/sxp/template/MultiCommodity/index.js +1 -1
- package/es/materials/sxp/template/MultiCommodity/material.js +1 -2
- package/es/materials/sxp/template/MultiCommodityDiro/index.js +1 -1
- package/es/materials/sxp/template/MultiCommodityDiro/material.js +2 -3
- package/es/materials/sxp/template/MultiCommodityDiroNew/index.js +1 -1
- package/es/materials/sxp/template/MultiCommodityDiroNew/material.js +2 -4
- package/es/materials/sxp/template/NineCommodity/material.js +2 -3
- package/es/materials/sxp/template/components/CommodityGroup.js +1 -1
- package/es/materials/sxp/template/components/settingRender.js +1 -1
- package/lib/core/components/DiyPortalPreview/VideoWidget.js +8 -10
- package/lib/core/components/SxpPageRender/LikeButton/index.js +16 -18
- package/lib/core/components/SxpPageRender/PictureGroup/index.d.ts +0 -5
- package/lib/core/components/SxpPageRender/PictureGroup/index.js +12 -38
- package/lib/core/components/SxpPageRender/RenderCard.js +1 -1
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +45 -32
- package/lib/core/components/SxpPageRender/WaterFall/index.js +3 -4
- package/lib/core/components/SxpPageRender/index.js +37 -53
- package/lib/core/context/SxpDataSourceProvider.d.ts +12 -5
- package/lib/core/context/SxpDataSourceProvider.js +10 -32
- package/lib/core/hooks/useEventReport.js +5 -6
- package/lib/materials/sxp/consentPopup/Display/index.js +1 -1
- package/lib/materials/sxp/cta/AniLinkPopup/material.js +1 -2
- package/lib/materials/sxp/popup/CommodityDetail/material.js +1 -2
- package/lib/materials/sxp/popup/CommodityList/index.js +4 -5
- package/lib/materials/sxp/popup/CommodityList/material.js +1 -1
- package/lib/materials/sxp/popup/CommodityList/settingRender.js +1 -1
- package/lib/materials/sxp/template/Appoint/material.js +1 -2
- package/lib/materials/sxp/template/Commodity/material.js +2 -3
- package/lib/materials/sxp/template/CommodityDiro/material.js +2 -3
- package/lib/materials/sxp/template/CommodityDiroNew/material.js +2 -4
- package/lib/materials/sxp/template/Link/material.js +2 -4
- package/lib/materials/sxp/template/MultiCommodity/index.js +1 -1
- package/lib/materials/sxp/template/MultiCommodity/material.js +1 -2
- package/lib/materials/sxp/template/MultiCommodityDiro/index.js +1 -1
- package/lib/materials/sxp/template/MultiCommodityDiro/material.js +2 -3
- package/lib/materials/sxp/template/MultiCommodityDiroNew/index.js +1 -1
- package/lib/materials/sxp/template/MultiCommodityDiroNew/material.js +2 -4
- package/lib/materials/sxp/template/NineCommodity/material.js +2 -3
- package/lib/materials/sxp/template/components/CommodityGroup.js +1 -1
- package/lib/materials/sxp/template/components/settingRender.js +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
@@ -644,7 +644,6 @@ const DEFAULT_TAG = 'FOR U';
|
|
644
644
|
const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false, consentHeight, consentWidth, isOpenConsent = false, isEditor = false, utmParameter, channelQueryList, data, dataList, isDiyH5, onUpdateSchema, onUpdateChannel }) => {
|
645
645
|
var _a, _b, _c, _d, _e;
|
646
646
|
const [rtcList, setRtcList] = React.useState([]);
|
647
|
-
const [firstRtcList, setFirstRtcList] = React.useState([]);
|
648
647
|
const [tagList, setTagList] = React.useState([]);
|
649
648
|
const [loading, setLoading] = React.useState(true);
|
650
649
|
const [curReqInfo, setCurReqInfo] = React.useState({ rtc: '', requestId: '' });
|
@@ -738,7 +737,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
738
737
|
}, [bffDataSource]);
|
739
738
|
// bff API 请求方法
|
740
739
|
const bffFetch = React.useCallback((path, options, isBota = true) => {
|
741
|
-
var _a
|
740
|
+
var _a;
|
742
741
|
if (!bffDataSource)
|
743
742
|
return;
|
744
743
|
const url = bffDataSource.url;
|
@@ -751,9 +750,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
751
750
|
val.split('=')[0];
|
752
751
|
val.split('=')[1];
|
753
752
|
});
|
754
|
-
options.body = Object.assign(Object.assign({}, options.body), { productUserId: fakeUserId });
|
755
753
|
return window
|
756
|
-
.fetch(`${url}/api/${path}`, Object.assign({ headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId
|
754
|
+
.fetch(`${url}/api/${path}`, Object.assign({ headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId }, bffDataSource.headers), method: options.method, body: options.type === 'beacon' && isBota
|
757
755
|
? JSON.stringify({
|
758
756
|
body: btoa(encodeURIComponent(JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))))
|
759
757
|
})
|
@@ -1028,9 +1026,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1028
1026
|
if ((rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) === 0) {
|
1029
1027
|
setRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
1030
1028
|
setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
1031
|
-
if (isDiyH5) {
|
1032
|
-
setFirstRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
1033
|
-
}
|
1034
1029
|
}
|
1035
1030
|
const isNotNullList = (_0 = (_z = result === null || result === void 0 ? void 0 : result.data) === null || _z === void 0 ? void 0 : _z.recList) === null || _0 === void 0 ? void 0 : _0.some((item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video));
|
1036
1031
|
if (isNotNullList) {
|
@@ -1070,17 +1065,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1070
1065
|
if (rtcList.length <= 0) {
|
1071
1066
|
return;
|
1072
1067
|
}
|
1073
|
-
if (isDiyH5 && (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) > 0) {
|
1074
|
-
setRtcList(rtcList.concat(firstRtcList));
|
1075
|
-
setCacheRtcList(cacheRtcList.concat(firstRtcList));
|
1076
|
-
return;
|
1077
|
-
}
|
1078
1068
|
const lastItem = rtcList === null || rtcList === void 0 ? void 0 : rtcList[(rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) - 1];
|
1079
1069
|
const data = yield getRecommendVideos(Object.assign(Object.assign(Object.assign(Object.assign({ hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag }, (((_1 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.product) === null || _1 === void 0 ? void 0 : _1.itemId) && { productFilter: [(_2 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.product) === null || _2 === void 0 ? void 0 : _2.itemId] })), (((_3 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.video) === null || _3 === void 0 ? void 0 : _3.itemId) && { contentFilter: [(_4 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.video) === null || _4 === void 0 ? void 0 : _4.itemId] })), { themeTag: themeTag.current }), ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) && !isEditor && { pageNum })));
|
1080
1070
|
setRtcList(rtcList.concat(getFilterRecList(data)));
|
1081
1071
|
setCacheRtcList(cacheRtcList.concat(getFilterRecList(data)));
|
1082
1072
|
return data;
|
1083
|
-
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList
|
1073
|
+
}), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
|
1084
1074
|
const refreshFeSession = React.useCallback((enableReSid, event) => {
|
1085
1075
|
var _a, _b, _c, _d, _e;
|
1086
1076
|
let expire = false;
|
@@ -1111,8 +1101,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1111
1101
|
// 用户信息都是公共的
|
1112
1102
|
if (!userInfo) {
|
1113
1103
|
userInfo = {
|
1114
|
-
|
1115
|
-
|
1104
|
+
// productUserId: fakeUserId, // 后端逻辑会从请求头获取,所以不需要传
|
1105
|
+
// tpChannelId: 'H5' // 后端处理
|
1116
1106
|
};
|
1117
1107
|
}
|
1118
1108
|
const sessionID = storeAndLoadFeSessionId();
|
@@ -1146,8 +1136,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1146
1136
|
layoutVariantId,
|
1147
1137
|
globalConfig,
|
1148
1138
|
playbookType,
|
1149
|
-
bffDataSource
|
1150
|
-
fakeUserId
|
1139
|
+
bffDataSource
|
1151
1140
|
]);
|
1152
1141
|
const getEventParamsByJson = React.useCallback((json, product) => {
|
1153
1142
|
var _a, _b, _c;
|
@@ -1280,15 +1269,13 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1280
1269
|
}
|
1281
1270
|
}, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig, bffDataSource, getEventParamsByJson]);
|
1282
1271
|
const bffMutateLike = React.useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
1283
|
-
body = Object.assign(Object.assign({}, body), { productUserId: fakeUserId });
|
1284
1272
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/like', { method: 'POST', body }));
|
1285
1273
|
return res === null || res === void 0 ? void 0 : res.success;
|
1286
|
-
}), [bffFetch
|
1274
|
+
}), [bffFetch]);
|
1287
1275
|
const bffMutateUnlike = React.useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
1288
|
-
body = Object.assign(Object.assign({}, body), { productUserId: fakeUserId });
|
1289
1276
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/unlike', { method: 'POST', body }));
|
1290
1277
|
return res === null || res === void 0 ? void 0 : res.success;
|
1291
|
-
}), [bffFetch
|
1278
|
+
}), [bffFetch]);
|
1292
1279
|
const bffSubmitForm = React.useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
1293
1280
|
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/customform', { method: 'POST', body }));
|
1294
1281
|
return res === null || res === void 0 ? void 0 : res.success;
|
@@ -1313,7 +1300,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1313
1300
|
}
|
1314
1301
|
}), [bffFetch, utmVal]);
|
1315
1302
|
const ctaEvent = React.useCallback((eventInfo, rec, product, position) => {
|
1316
|
-
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
|
1303
|
+
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;
|
1317
1304
|
const cta = product === null || product === void 0 ? void 0 : product.bindCta;
|
1318
1305
|
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);
|
1319
1306
|
let fromKName = '';
|
@@ -1331,7 +1318,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1331
1318
|
}
|
1332
1319
|
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;
|
1333
1320
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
1334
|
-
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 : '',
|
1321
|
+
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 })
|
1335
1322
|
});
|
1336
1323
|
}, [bffEventReport, isFromHashtag]);
|
1337
1324
|
const h5EnterLink = React.useCallback(() => {
|
@@ -1433,9 +1420,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1433
1420
|
}
|
1434
1421
|
setRtcList(list);
|
1435
1422
|
setCacheRtcList(list);
|
1436
|
-
if (isDiyH5) {
|
1437
|
-
setFirstRtcList(list);
|
1438
|
-
}
|
1439
1423
|
bffGetTagList(curData !== null && curData !== void 0 ? curData : finalPageData);
|
1440
1424
|
if (channel) {
|
1441
1425
|
const item = list === null || list === void 0 ? void 0 : list[0];
|
@@ -1471,9 +1455,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1471
1455
|
}
|
1472
1456
|
setRtcList(list);
|
1473
1457
|
setCacheRtcList(list);
|
1474
|
-
if (isDiyH5) {
|
1475
|
-
setFirstRtcList(list);
|
1476
|
-
}
|
1477
1458
|
}
|
1478
1459
|
})
|
1479
1460
|
.finally(() => {
|
@@ -1537,8 +1518,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1537
1518
|
refreshFeSession,
|
1538
1519
|
getAccount,
|
1539
1520
|
accountSonsent,
|
1540
|
-
isDiyH5
|
1541
|
-
firstRtcList
|
1521
|
+
isDiyH5
|
1542
1522
|
} }, isShowConsent ? (React.createElement(Consent$4, Object.assign({}, (_e = (_d = (_c = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consent) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.item) === null || _e === void 0 ? void 0 : _e.props))) : (render({
|
1543
1523
|
rtcList,
|
1544
1524
|
mutateLike: bffMutateLike,
|
@@ -1999,14 +1979,14 @@ var settingRender$f = [
|
|
1999
1979
|
* @Author: binruan@chatlabs.com
|
2000
1980
|
* @Date: 2024-03-12 10:59:06
|
2001
1981
|
* @LastEditors: binruan@chatlabs.com
|
2002
|
-
* @LastEditTime:
|
1982
|
+
* @LastEditTime: 2024-11-28 11:17:16
|
2003
1983
|
* @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
|
2004
1984
|
*
|
2005
1985
|
*/
|
2006
1986
|
function useEventReport() {
|
2007
1987
|
const { bffEventReport, popupDetailData, isFromHashtag, eventTimeList, setEventTimeList } = useSxpDataSource();
|
2008
1988
|
const jumpToWeb = React.useCallback((e, data, product, cta, position, traceInfo) => {
|
2009
|
-
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
|
1989
|
+
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;
|
2010
1990
|
const i = eventTimeList === null || eventTimeList === void 0 ? void 0 : eventTimeList.findIndex((item) => item.target === (e === null || e === void 0 ? void 0 : e.target));
|
2011
1991
|
if (i !== -1) {
|
2012
1992
|
return;
|
@@ -2039,11 +2019,11 @@ function useEventReport() {
|
|
2039
2019
|
contentFormat = 'image';
|
2040
2020
|
}
|
2041
2021
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
2042
|
-
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 : '',
|
2022
|
+
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 }))
|
2043
2023
|
});
|
2044
2024
|
}, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
|
2045
2025
|
const productView = React.useCallback((data, product, cta, viewTime, position) => {
|
2046
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p
|
2026
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
2047
2027
|
let fromKName = '';
|
2048
2028
|
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))) {
|
2049
2029
|
fromKName = 'pdpPage';
|
@@ -2062,9 +2042,8 @@ function useEventReport() {
|
|
2062
2042
|
contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags),
|
2063
2043
|
position: position + '',
|
2064
2044
|
contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
2065
|
-
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 : '',
|
2066
2045
|
ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
|
2067
|
-
traceInfo: (
|
2046
|
+
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 : '',
|
2068
2047
|
timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
|
2069
2048
|
eventSubject: 'productView',
|
2070
2049
|
eventDescription: 'User browsed the product'
|
@@ -2660,6 +2639,35 @@ var settingRender$e = [
|
|
2660
2639
|
}
|
2661
2640
|
];
|
2662
2641
|
|
2642
|
+
/*
|
2643
|
+
* @Author: binruan@chatlabs.com
|
2644
|
+
* @Date: 2024-07-09 14:35:10
|
2645
|
+
* @LastEditors: binruan@chatlabs.com
|
2646
|
+
* @LastEditTime: 2024-07-12 17:53:02
|
2647
|
+
* @FilePath: \pb-sxp-ui\src\materials\sxp\popup\CommodityDetail\interactionRender.tsx
|
2648
|
+
*
|
2649
|
+
*/
|
2650
|
+
/*
|
2651
|
+
* @Author: binruan@chatlabs.com
|
2652
|
+
* @Date: 2024-07-05 14:08:41
|
2653
|
+
* @LastEditors: binruan@chatlabs.com
|
2654
|
+
* @LastEditTime: 2024-07-09 14:34:49
|
2655
|
+
* @FilePath: \pb-sxp-ui\src\materials\sxp\cta\AniLink\interactionRender.tsx
|
2656
|
+
*
|
2657
|
+
*/
|
2658
|
+
var interactionRender$g = [
|
2659
|
+
{
|
2660
|
+
title: '滑动事件',
|
2661
|
+
child: [
|
2662
|
+
{
|
2663
|
+
type: 'Switch',
|
2664
|
+
label: '滑动铺满全屏',
|
2665
|
+
name: ['isScrollFullScreen']
|
2666
|
+
}
|
2667
|
+
]
|
2668
|
+
}
|
2669
|
+
];
|
2670
|
+
|
2663
2671
|
/**
|
2664
2672
|
* SSR Window 4.0.2
|
2665
2673
|
* Better handling for window object in SSR environment
|
@@ -10238,7 +10246,7 @@ const CommodityGroup = ({ products, data, defImg, style, onCLick, popupDetailDat
|
|
10238
10246
|
return (React.createElement(React.Fragment, null, (item === null || item === void 0 ? void 0 : item.bindCta) ? (React.createElement(SwiperSlide, { className: css.css({
|
10239
10247
|
width: '50px',
|
10240
10248
|
height: '50px',
|
10241
|
-
|
10249
|
+
marginInlineStart: '10px'
|
10242
10250
|
}), onClick: () => {
|
10243
10251
|
handleClick(item, index);
|
10244
10252
|
}, key: index },
|
@@ -10837,35 +10845,6 @@ const CommodityDetail$1 = (_a) => {
|
|
10837
10845
|
};
|
10838
10846
|
var CommodityDetailComponent = React.memo(CommodityDetail$1);
|
10839
10847
|
|
10840
|
-
/*
|
10841
|
-
* @Author: binruan@chatlabs.com
|
10842
|
-
* @Date: 2024-07-09 14:35:10
|
10843
|
-
* @LastEditors: binruan@chatlabs.com
|
10844
|
-
* @LastEditTime: 2024-07-12 17:53:02
|
10845
|
-
* @FilePath: \pb-sxp-ui\src\materials\sxp\popup\CommodityDetail\interactionRender.tsx
|
10846
|
-
*
|
10847
|
-
*/
|
10848
|
-
/*
|
10849
|
-
* @Author: binruan@chatlabs.com
|
10850
|
-
* @Date: 2024-07-05 14:08:41
|
10851
|
-
* @LastEditors: binruan@chatlabs.com
|
10852
|
-
* @LastEditTime: 2024-07-09 14:34:49
|
10853
|
-
* @FilePath: \pb-sxp-ui\src\materials\sxp\cta\AniLink\interactionRender.tsx
|
10854
|
-
*
|
10855
|
-
*/
|
10856
|
-
var interactionRender$g = [
|
10857
|
-
{
|
10858
|
-
title: '滑动事件',
|
10859
|
-
child: [
|
10860
|
-
{
|
10861
|
-
type: 'Switch',
|
10862
|
-
label: '滑动铺满全屏',
|
10863
|
-
name: ['isScrollFullScreen']
|
10864
|
-
}
|
10865
|
-
]
|
10866
|
-
}
|
10867
|
-
];
|
10868
|
-
|
10869
10848
|
/*
|
10870
10849
|
* @Author: binruan@chatlabs.com
|
10871
10850
|
* @Date: 2023-07-28 18:29:57
|
@@ -10912,7 +10891,6 @@ const CommodityDetail = createMaterial(CommodityDetailComponent, {
|
|
10912
10891
|
taxInfo: {
|
10913
10892
|
color: '#000',
|
10914
10893
|
fontSize: 13,
|
10915
|
-
textAlign: 'left',
|
10916
10894
|
marginBottom: '10px'
|
10917
10895
|
}
|
10918
10896
|
},
|
@@ -12004,7 +11982,7 @@ var settingRender$b = [
|
|
12004
11982
|
type: 'Number',
|
12005
11983
|
label: '与右侧边距',
|
12006
11984
|
addonAfter: 'px',
|
12007
|
-
name: ['props', 'commodityPicture', '
|
11985
|
+
name: ['props', 'commodityPicture', 'marginInlineStart']
|
12008
11986
|
},
|
12009
11987
|
{
|
12010
11988
|
label: '居中垂直偏移',
|
@@ -12290,12 +12268,11 @@ const CommodityList$1 = (_a) => {
|
|
12290
12268
|
React.createElement("button", Object.assign({ role: 'button', "aria-label": item === null || item === void 0 ? void 0 : item.title, tabIndex: 0, className: css.css({
|
12291
12269
|
display: 'flex',
|
12292
12270
|
alignItems: 'normal',
|
12293
|
-
width: '100%'
|
12294
|
-
textAlign: 'left'
|
12271
|
+
width: '100%'
|
12295
12272
|
}) }, props),
|
12296
12273
|
React.createElement(Img$1, { src: (_d = (_c = (_a = item === null || item === void 0 ? void 0 : item.cover) !== null && _a !== void 0 ? _a : (_b = item === null || item === void 0 ? void 0 : item.homePage) === null || _b === void 0 ? void 0 : _b[0]) !== null && _c !== void 0 ? _c : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _d !== void 0 ? _d : bottom_image, rec: recData, item: item, index: index, translateY: translateY, imgStyle: commodityPicture, enableEventReport: false }),
|
12297
12274
|
React.createElement("div", { style: {
|
12298
|
-
width: `calc(100% - ${(_e = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.width) !== null && _e !== void 0 ? _e : 0}px - ${(_f = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.
|
12275
|
+
width: `calc(100% - ${(_e = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.width) !== null && _e !== void 0 ? _e : 0}px - ${(_f = commodityPicture === null || commodityPicture === void 0 ? void 0 : commodityPicture.marginInlineStart) !== null && _f !== void 0 ? _f : 0}px)`,
|
12299
12276
|
display: 'flex',
|
12300
12277
|
flexDirection: 'column',
|
12301
12278
|
justifyContent: 'space-between'
|
@@ -12376,7 +12353,7 @@ const CommodityList = createMaterial(CommodityListComponent, {
|
|
12376
12353
|
commodityPicture: {
|
12377
12354
|
width: 100,
|
12378
12355
|
height: 100,
|
12379
|
-
|
12356
|
+
marginInlineStart: 10
|
12380
12357
|
},
|
12381
12358
|
commodityStyles: {
|
12382
12359
|
price: {
|
@@ -12622,7 +12599,7 @@ var settingRender$8 = [
|
|
12622
12599
|
type: 'Number',
|
12623
12600
|
label: '与右侧边距',
|
12624
12601
|
addonAfter: 'px',
|
12625
|
-
name: ['props', 'ctaTempStyles', 'img', '
|
12602
|
+
name: ['props', 'ctaTempStyles', 'img', 'marginInlineStart']
|
12626
12603
|
},
|
12627
12604
|
{
|
12628
12605
|
label: '居中垂直偏移',
|
@@ -12883,12 +12860,11 @@ const Commodity = createMaterial(CommodityComponent, {
|
|
12883
12860
|
borderRadius: 3,
|
12884
12861
|
width: 60,
|
12885
12862
|
height: 60,
|
12886
|
-
|
12863
|
+
marginInlineStart: 8
|
12887
12864
|
},
|
12888
12865
|
title: {
|
12889
12866
|
fontSize: 12,
|
12890
|
-
color: '#fff'
|
12891
|
-
textAlign: 'left'
|
12867
|
+
color: '#fff'
|
12892
12868
|
},
|
12893
12869
|
ctaTitle: {
|
12894
12870
|
fontSize: 10,
|
@@ -12966,12 +12942,11 @@ const Appoint = createMaterial(AppointComponent, {
|
|
12966
12942
|
borderRadius: 3,
|
12967
12943
|
width: 30,
|
12968
12944
|
height: 30,
|
12969
|
-
|
12945
|
+
marginInlineStart: 8
|
12970
12946
|
},
|
12971
12947
|
ctaTitle: {
|
12972
12948
|
fontSize: 12,
|
12973
12949
|
color: '#fff',
|
12974
|
-
textAlign: 'left',
|
12975
12950
|
width: 130,
|
12976
12951
|
height: 20
|
12977
12952
|
}
|
@@ -13107,6 +13082,27 @@ var linkSettingRender = [
|
|
13107
13082
|
}
|
13108
13083
|
];
|
13109
13084
|
|
13085
|
+
/*
|
13086
|
+
* @Author: binruan@chatlabs.com
|
13087
|
+
* @Date: 2024-08-09 16:59:38
|
13088
|
+
* @LastEditors: binruan@chatlabs.com
|
13089
|
+
* @LastEditTime: 2024-09-09 13:59:50
|
13090
|
+
* @FilePath: \pb-sxp-ui\src\materials\sxp\template\Link\interactionRender.tsx
|
13091
|
+
*
|
13092
|
+
*/
|
13093
|
+
var interactionRender$a = [
|
13094
|
+
{
|
13095
|
+
title: '点击事件',
|
13096
|
+
child: [
|
13097
|
+
{
|
13098
|
+
type: 'link',
|
13099
|
+
name: 'onClick',
|
13100
|
+
hiddenUrl: true
|
13101
|
+
}
|
13102
|
+
]
|
13103
|
+
}
|
13104
|
+
];
|
13105
|
+
|
13110
13106
|
var styles$8 = {"tow-line-ellipsis":"index-module_tow-line-ellipsis__nkBlU","one-line-ellipsis":"index-module_one-line-ellipsis__buFw1"};
|
13111
13107
|
|
13112
13108
|
const Link$1 = (_a) => {
|
@@ -13134,27 +13130,6 @@ const Link$1 = (_a) => {
|
|
13134
13130
|
};
|
13135
13131
|
var LinkComponent = React.memo(Link$1);
|
13136
13132
|
|
13137
|
-
/*
|
13138
|
-
* @Author: binruan@chatlabs.com
|
13139
|
-
* @Date: 2024-08-09 16:59:38
|
13140
|
-
* @LastEditors: binruan@chatlabs.com
|
13141
|
-
* @LastEditTime: 2024-09-09 13:59:50
|
13142
|
-
* @FilePath: \pb-sxp-ui\src\materials\sxp\template\Link\interactionRender.tsx
|
13143
|
-
*
|
13144
|
-
*/
|
13145
|
-
var interactionRender$a = [
|
13146
|
-
{
|
13147
|
-
title: '点击事件',
|
13148
|
-
child: [
|
13149
|
-
{
|
13150
|
-
type: 'link',
|
13151
|
-
name: 'onClick',
|
13152
|
-
hiddenUrl: true
|
13153
|
-
}
|
13154
|
-
]
|
13155
|
-
}
|
13156
|
-
];
|
13157
|
-
|
13158
13133
|
var _a;
|
13159
13134
|
const Link = createMaterial(LinkComponent, {
|
13160
13135
|
displayName: '普通CTA',
|
@@ -13173,19 +13148,17 @@ const Link = createMaterial(LinkComponent, {
|
|
13173
13148
|
borderRadius: 3,
|
13174
13149
|
width: 60,
|
13175
13150
|
height: 60,
|
13176
|
-
|
13151
|
+
marginInlineStart: 8
|
13177
13152
|
},
|
13178
13153
|
ctaTitle: {
|
13179
13154
|
fontSize: 12,
|
13180
13155
|
color: '#fff',
|
13181
|
-
textAlign: 'left',
|
13182
13156
|
width: 130,
|
13183
13157
|
height: 20
|
13184
13158
|
}
|
13185
13159
|
},
|
13186
13160
|
customTitle: {
|
13187
13161
|
style: {
|
13188
|
-
textAlign: 'left',
|
13189
13162
|
textDecoration: 'underline',
|
13190
13163
|
fontWeight: 'bold',
|
13191
13164
|
width: 130,
|
@@ -13275,12 +13248,11 @@ const CommodityDiro = createMaterial(CommodityDiroComponent, {
|
|
13275
13248
|
borderRadius: 3,
|
13276
13249
|
width: 60,
|
13277
13250
|
height: 60,
|
13278
|
-
|
13251
|
+
marginInlineStart: 8
|
13279
13252
|
},
|
13280
13253
|
title: {
|
13281
13254
|
fontSize: 12,
|
13282
|
-
color: '#000'
|
13283
|
-
textAlign: 'left'
|
13255
|
+
color: '#000'
|
13284
13256
|
},
|
13285
13257
|
ctaTitle: {
|
13286
13258
|
fontSize: 10,
|
@@ -13371,19 +13343,17 @@ const CommodityDiroNew = createMaterial(CommodityDiroNewComponent, {
|
|
13371
13343
|
borderRadius: 8,
|
13372
13344
|
width: 78,
|
13373
13345
|
height: 78,
|
13374
|
-
|
13346
|
+
marginInlineStart: 16
|
13375
13347
|
},
|
13376
13348
|
title: {
|
13377
13349
|
fontSize: 13,
|
13378
|
-
color: '#000'
|
13379
|
-
textAlign: 'left'
|
13350
|
+
color: '#000'
|
13380
13351
|
},
|
13381
13352
|
ctaTitle: {
|
13382
13353
|
textDecoration: 'underline',
|
13383
13354
|
fontSize: 14,
|
13384
13355
|
fontWeight: 'bold',
|
13385
13356
|
color: '#000',
|
13386
|
-
textAlign: 'left',
|
13387
13357
|
width: 150,
|
13388
13358
|
height: 20
|
13389
13359
|
}
|
@@ -13425,7 +13395,7 @@ const MultiCommodityDiro$1 = (_a) => {
|
|
13425
13395
|
const [products] = React.useState((_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProducts) !== null && _c !== void 0 ? _c : [1, 2]);
|
13426
13396
|
return (React.createElement(Scroll$1, { isPadding: !!recData }, products === null || products === void 0 ? void 0 : products.map((item, itemIndex) => {
|
13427
13397
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
13428
|
-
return (React.createElement(React.Fragment, null, recData && !(item === null || item === void 0 ? void 0 : item.bindCta) ? null : (React.createElement(SwiperSlide, { key: itemIndex, className: css.css(Object.assign(Object.assign({}, style), { flexShrink: 0,
|
13398
|
+
return (React.createElement(React.Fragment, null, recData && !(item === null || item === void 0 ? void 0 : item.bindCta) ? null : (React.createElement(SwiperSlide, { key: itemIndex, className: css.css(Object.assign(Object.assign({}, style), { flexShrink: 0, marginInlineEnd: 0, marginInlineStart: '8px' })), tag: 'li', role: 'listitem' },
|
13429
13399
|
React.createElement(EventProvider$1, Object.assign({ rec: recData, multItem: item, multiCheckIndex: itemIndex, index: index }, props),
|
13430
13400
|
React.createElement(Img$1, { src: (_d = (_c = (_a = item === null || item === void 0 ? void 0 : item.cover) !== null && _a !== void 0 ? _a : (_b = item === null || item === void 0 ? void 0 : item.homePage) === null || _b === void 0 ? void 0 : _b[0]) !== null && _c !== void 0 ? _c : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _d !== void 0 ? _d : bottom_image, rec: recData, item: item, index: index, translateY: translateY, imgStyle: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img, isActive: isActive }),
|
13431
13401
|
React.createElement("div", { className: css.css({
|
@@ -13471,12 +13441,11 @@ const MultiCommodityDiro = createMaterial(MultiCommodityDiroComponent, {
|
|
13471
13441
|
borderRadius: 3,
|
13472
13442
|
width: 60,
|
13473
13443
|
height: 60,
|
13474
|
-
|
13444
|
+
marginInlineStart: 8
|
13475
13445
|
},
|
13476
13446
|
title: {
|
13477
13447
|
fontSize: 12,
|
13478
|
-
color: '#000'
|
13479
|
-
textAlign: 'left'
|
13448
|
+
color: '#000'
|
13480
13449
|
},
|
13481
13450
|
ctaTitle: {
|
13482
13451
|
fontSize: 10,
|
@@ -13524,7 +13493,7 @@ const MultiCommodity$1 = (_a) => {
|
|
13524
13493
|
const [products] = React.useState((_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProducts) !== null && _c !== void 0 ? _c : [1, 2]);
|
13525
13494
|
return (React.createElement(Scroll$1, { isPadding: !!recData }, products === null || products === void 0 ? void 0 : products.map((item, itemIndex) => {
|
13526
13495
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
13527
|
-
return (React.createElement(React.Fragment, null, recData && !(item === null || item === void 0 ? void 0 : item.bindCta) ? null : (React.createElement(SwiperSlide, { key: itemIndex, className: css.css(Object.assign(Object.assign({}, style), { flexShrink: 0,
|
13496
|
+
return (React.createElement(React.Fragment, null, recData && !(item === null || item === void 0 ? void 0 : item.bindCta) ? null : (React.createElement(SwiperSlide, { key: itemIndex, className: css.css(Object.assign(Object.assign({}, style), { flexShrink: 0, marginInlineEnd: 0, marginInlineStart: '8px' })), tag: 'li', role: 'listitem' },
|
13528
13497
|
React.createElement(EventProvider$1, Object.assign({ rec: recData, multItem: item, multiCheckIndex: itemIndex, index: index }, props),
|
13529
13498
|
React.createElement(Img$1, { src: (_d = (_c = (_a = item === null || item === void 0 ? void 0 : item.cover) !== null && _a !== void 0 ? _a : (_b = item === null || item === void 0 ? void 0 : item.homePage) === null || _b === void 0 ? void 0 : _b[0]) !== null && _c !== void 0 ? _c : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _d !== void 0 ? _d : bottom_image, rec: recData, item: item, index: index, translateY: translateY, imgStyle: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img, isActive: isActive }),
|
13530
13499
|
React.createElement("div", { className: css.css({
|
@@ -13570,12 +13539,11 @@ const MultiCommodity = createMaterial(MultiCommodityComponent, {
|
|
13570
13539
|
borderRadius: 3,
|
13571
13540
|
width: 60,
|
13572
13541
|
height: 60,
|
13573
|
-
|
13542
|
+
marginInlineStart: 8
|
13574
13543
|
},
|
13575
13544
|
title: {
|
13576
13545
|
fontSize: 12,
|
13577
13546
|
color: '#fff',
|
13578
|
-
textAlign: 'left'
|
13579
13547
|
},
|
13580
13548
|
ctaTitle: {
|
13581
13549
|
fontSize: 10,
|
@@ -13631,7 +13599,7 @@ const MultiCommodityDiroNew$1 = (_a) => {
|
|
13631
13599
|
const [products] = React.useState((_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProducts) !== null && _c !== void 0 ? _c : [1, 2]);
|
13632
13600
|
return (React.createElement(Scroll$1, { isPadding: !!recData }, products === null || products === void 0 ? void 0 : products.map((item, itemIndex) => {
|
13633
13601
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
13634
|
-
return (React.createElement(React.Fragment, null, recData && !(item === null || item === void 0 ? void 0 : item.bindCta) ? null : (React.createElement(SwiperSlide, { key: itemIndex, className: css.css(Object.assign(Object.assign({}, style), { flexShrink: 0,
|
13602
|
+
return (React.createElement(React.Fragment, null, recData && !(item === null || item === void 0 ? void 0 : item.bindCta) ? null : (React.createElement(SwiperSlide, { key: itemIndex, className: css.css(Object.assign(Object.assign({}, style), { flexShrink: 0, marginInlineEnd: 0, marginInlineStart: '8px' })), tag: 'li', role: 'listitem' },
|
13635
13603
|
React.createElement(EventProvider$1, Object.assign({ rec: recData, multItem: item, multiCheckIndex: itemIndex, index: index }, props),
|
13636
13604
|
React.createElement(Img$1, { src: (_d = (_c = (_a = item === null || item === void 0 ? void 0 : item.cover) !== null && _a !== void 0 ? _a : (_b = item === null || item === void 0 ? void 0 : item.homePage) === null || _b === void 0 ? void 0 : _b[0]) !== null && _c !== void 0 ? _c : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _d !== void 0 ? _d : bottom_image, rec: recData, item: item, index: index, translateY: translateY, imgStyle: ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img, isActive: isActive }),
|
13637
13605
|
React.createElement("div", { className: css.css({
|
@@ -13678,19 +13646,17 @@ const MultiCommodityDiroNew = createMaterial(MultiCommodityDiroNewComponent, {
|
|
13678
13646
|
borderRadius: 8,
|
13679
13647
|
width: 78,
|
13680
13648
|
height: 78,
|
13681
|
-
|
13649
|
+
marginInlineStart: 16
|
13682
13650
|
},
|
13683
13651
|
title: {
|
13684
13652
|
fontSize: 12,
|
13685
|
-
color: '#000'
|
13686
|
-
textAlign: 'left'
|
13653
|
+
color: '#000'
|
13687
13654
|
},
|
13688
13655
|
ctaTitle: {
|
13689
13656
|
textDecoration: 'underline',
|
13690
13657
|
fontSize: 12,
|
13691
13658
|
fontWeight: 'bold',
|
13692
13659
|
color: '#000',
|
13693
|
-
textAlign: 'left',
|
13694
13660
|
width: 150,
|
13695
13661
|
height: 20
|
13696
13662
|
}
|
@@ -13785,12 +13751,11 @@ const NineCommodity = createMaterial(NineCommodityComponent, {
|
|
13785
13751
|
borderRadius: 3,
|
13786
13752
|
width: 60,
|
13787
13753
|
height: 60,
|
13788
|
-
|
13754
|
+
marginInlineStart: 8
|
13789
13755
|
},
|
13790
13756
|
title: {
|
13791
13757
|
fontSize: 12,
|
13792
|
-
color: '#fff'
|
13793
|
-
textAlign: 'left'
|
13758
|
+
color: '#fff'
|
13794
13759
|
},
|
13795
13760
|
ctaTitle: {
|
13796
13761
|
fontSize: 10,
|
@@ -15879,7 +15844,7 @@ function WaterfallList(_a) {
|
|
15879
15844
|
* @Author: binruan@chatlabs.com
|
15880
15845
|
* @Date: 2024-01-10 10:58:24
|
15881
15846
|
* @LastEditors: binruan@chatlabs.com
|
15882
|
-
* @LastEditTime: 2025-
|
15847
|
+
* @LastEditTime: 2025-02-28 10:00:31
|
15883
15848
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\WaterFall\index.tsx
|
15884
15849
|
*
|
15885
15850
|
*/
|
@@ -15917,7 +15882,7 @@ const WaterFall = (props) => {
|
|
15917
15882
|
}
|
15918
15883
|
}, [waterFallData]);
|
15919
15884
|
const reportTagsView = React.useCallback(() => {
|
15920
|
-
var _a, _b, _c, _d, _e, _f
|
15885
|
+
var _a, _b, _c, _d, _e, _f;
|
15921
15886
|
const rec = recData === null || recData === void 0 ? void 0 : recData.rec;
|
15922
15887
|
if (!rec)
|
15923
15888
|
return;
|
@@ -15937,10 +15902,9 @@ const WaterFall = (props) => {
|
|
15937
15902
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
15938
15903
|
eventInfo: {
|
15939
15904
|
contentId: (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.itemId,
|
15940
|
-
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 : '',
|
15941
15905
|
position: cacheActiveIndex + '',
|
15942
|
-
contentTags: JSON.stringify((
|
15943
|
-
traceInfo: (
|
15906
|
+
contentTags: JSON.stringify((_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.tags),
|
15907
|
+
traceInfo: (_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.traceInfo,
|
15944
15908
|
hashTags: JSON.stringify([recData === null || recData === void 0 ? void 0 : recData.hashTag]),
|
15945
15909
|
fromKName,
|
15946
15910
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
@@ -16711,6 +16675,60 @@ var settingRender$4 = [
|
|
16711
16675
|
}
|
16712
16676
|
];
|
16713
16677
|
|
16678
|
+
/*
|
16679
|
+
* @Author: binruan@chatlabs.com
|
16680
|
+
* @Date: 2024-07-24 14:58:40
|
16681
|
+
* @LastEditors: binruan@chatlabs.com
|
16682
|
+
* @LastEditTime: 2024-09-09 13:54:35
|
16683
|
+
* @FilePath: \pb-sxp-ui\src\materials\sxp\cta\AniLinkPopup\interactionRender.tsx
|
16684
|
+
*
|
16685
|
+
*/
|
16686
|
+
var interactionRender$2 = [
|
16687
|
+
{
|
16688
|
+
title: '点击事件',
|
16689
|
+
child: [
|
16690
|
+
{
|
16691
|
+
type: 'link',
|
16692
|
+
name: 'onClick',
|
16693
|
+
hiddenUrl: true
|
16694
|
+
}
|
16695
|
+
]
|
16696
|
+
},
|
16697
|
+
{
|
16698
|
+
title: '动画效果',
|
16699
|
+
child: [
|
16700
|
+
{
|
16701
|
+
type: 'Select',
|
16702
|
+
name: ['animation', 'name'],
|
16703
|
+
label: '动画',
|
16704
|
+
options: [
|
16705
|
+
{
|
16706
|
+
label: '默认',
|
16707
|
+
value: 1
|
16708
|
+
}
|
16709
|
+
],
|
16710
|
+
fieldProps: {
|
16711
|
+
style: {
|
16712
|
+
width: '100%'
|
16713
|
+
}
|
16714
|
+
}
|
16715
|
+
},
|
16716
|
+
{
|
16717
|
+
type: 'Number',
|
16718
|
+
label: '动画启动时间',
|
16719
|
+
name: ['animation', 'delay'],
|
16720
|
+
addonAfter: 'ms'
|
16721
|
+
},
|
16722
|
+
{
|
16723
|
+
type: 'Number',
|
16724
|
+
label: '动画持续时间',
|
16725
|
+
name: ['animation', 'duration'],
|
16726
|
+
addonAfter: 'ms'
|
16727
|
+
}
|
16728
|
+
]
|
16729
|
+
}
|
16730
|
+
];
|
16731
|
+
|
16714
16732
|
var styles = {"aniLinkPopup":"index-module_aniLinkPopup__YT7kj","animated-fadeIn":"index-module_animated-fadeIn__8ZCbq","fadeIn":"index-module_fadeIn__2E-dk","animated-fadeOut":"index-module_animated-fadeOut__iK4oc","fadeOut":"index-module_fadeOut__MgevT","one-line-ellipsis":"index-module_one-line-ellipsis__NRiVV","two-line-ellipsis":"index-module_two-line-ellipsis__k-YGB","modal-icon-wrapper":"index-module_modal-icon-wrapper__tu3BY","modal-icon-wrapper-img":"index-module_modal-icon-wrapper-img__4b7qZ"};
|
16715
16733
|
|
16716
16734
|
const closeIcon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAjhJREFUWEfFlztOw0AQhmeWiJ4CCmpQ5DiRQsIJyAWg5A0lR0AIChDiCJS8ER0cADgBeRSxt4CCDgkaKiq8i+zYeWx2413HEWmiJJv9v535Z2aN8M8vFPT9z3zETD0aAUChUJjwvPFHAJhBhB3Hqd6OAsK2yyucwykAvP38eJX398Z3AJDLlVYR8ToU9Rhj25TWr9KEsKy5dULIGQCMtfZly45TvwsAstm56UwG6wA4FUFwzrdctxZBDcWSy5XWEPG8I84/GcMipdWPtgcsaz5PCHtKG0IuTiqUvjT9U/WYMG2IOPE+AP+LtCB0xKUAAyA2Xbd2o2OG0NQXvTnvhL17D7EPtH9TRCIWwkRcGYGIQgYBABuqPuHXOQBc6pw80lBGwBQiiXhsBHQhkoprA6iM6acjhDQKu5YJZW6XeOI3XJdpvfsdTu52VfXEekD8owQiXGIubpSCbhDbLu8DwKEAd+A41SOdPpE4BS0viFOtvV2iKWqUgn5x/tmS70xR01GuDSCKc86/OCcLgTyyZ0ScDGNhFAktAJV4NFJ9YyaFiAWIE+9uVkkgBgLoig8DMWAa9ro9ynkUdlW5maZDCmB6clmz0k1HH4Cs1Ezbq2p2yEpUuBOKTSZZex00RUWIrltxuuK6EOGDSbGIOPZicpMx6fny650377qNRgBgWeVFQuA+6UjVgREhGIMlSqsPUQqIbZdOOIdZQmCv2axRnU1N1+TzJYsxOEaEV8ep7frPZ7Gd0FTEdP0ft0/kMNdg0eoAAAAASUVORK5CYII=';
|
@@ -16783,60 +16801,6 @@ const AniLinkPopup$1 = (_a) => {
|
|
16783
16801
|
};
|
16784
16802
|
var AniLinkPopupComponent = React.memo(AniLinkPopup$1);
|
16785
16803
|
|
16786
|
-
/*
|
16787
|
-
* @Author: binruan@chatlabs.com
|
16788
|
-
* @Date: 2024-07-24 14:58:40
|
16789
|
-
* @LastEditors: binruan@chatlabs.com
|
16790
|
-
* @LastEditTime: 2024-09-09 13:54:35
|
16791
|
-
* @FilePath: \pb-sxp-ui\src\materials\sxp\cta\AniLinkPopup\interactionRender.tsx
|
16792
|
-
*
|
16793
|
-
*/
|
16794
|
-
var interactionRender$2 = [
|
16795
|
-
{
|
16796
|
-
title: '点击事件',
|
16797
|
-
child: [
|
16798
|
-
{
|
16799
|
-
type: 'link',
|
16800
|
-
name: 'onClick',
|
16801
|
-
hiddenUrl: true
|
16802
|
-
}
|
16803
|
-
]
|
16804
|
-
},
|
16805
|
-
{
|
16806
|
-
title: '动画效果',
|
16807
|
-
child: [
|
16808
|
-
{
|
16809
|
-
type: 'Select',
|
16810
|
-
name: ['animation', 'name'],
|
16811
|
-
label: '动画',
|
16812
|
-
options: [
|
16813
|
-
{
|
16814
|
-
label: '默认',
|
16815
|
-
value: 1
|
16816
|
-
}
|
16817
|
-
],
|
16818
|
-
fieldProps: {
|
16819
|
-
style: {
|
16820
|
-
width: '100%'
|
16821
|
-
}
|
16822
|
-
}
|
16823
|
-
},
|
16824
|
-
{
|
16825
|
-
type: 'Number',
|
16826
|
-
label: '动画启动时间',
|
16827
|
-
name: ['animation', 'delay'],
|
16828
|
-
addonAfter: 'ms'
|
16829
|
-
},
|
16830
|
-
{
|
16831
|
-
type: 'Number',
|
16832
|
-
label: '动画持续时间',
|
16833
|
-
name: ['animation', 'duration'],
|
16834
|
-
addonAfter: 'ms'
|
16835
|
-
}
|
16836
|
-
]
|
16837
|
-
}
|
16838
|
-
];
|
16839
|
-
|
16840
16804
|
/*
|
16841
16805
|
* @Author: binruan@chatlabs.com
|
16842
16806
|
* @Date: 2024-07-24 14:58:40
|
@@ -16875,7 +16839,6 @@ const AniLinkPopup = createMaterial(AniLinkPopupComponent, {
|
|
16875
16839
|
title: {
|
16876
16840
|
fontSize: 14,
|
16877
16841
|
color: '#000',
|
16878
|
-
textAlign: 'left',
|
16879
16842
|
lineHeight: 2.6
|
16880
16843
|
},
|
16881
16844
|
ctaTitle: {
|
@@ -17104,7 +17067,7 @@ const Display$1 = (_a) => {
|
|
17104
17067
|
React.createElement("span", { style: content === null || content === void 0 ? void 0 : content.style, dangerouslySetInnerHTML: {
|
17105
17068
|
__html: setFontForText((_b = content === null || content === void 0 ? void 0 : content.text) === null || _b === void 0 ? void 0 : _b.replace(/\n/g, '</br>'), content === null || content === void 0 ? void 0 : content.style)
|
17106
17069
|
} }),
|
17107
|
-
React.createElement("span", { style: Object.assign(Object.assign({}, interaction === null || interaction === void 0 ? void 0 : interaction.style), {
|
17070
|
+
React.createElement("span", { style: Object.assign(Object.assign({}, interaction === null || interaction === void 0 ? void 0 : interaction.style), { marginInlineEnd: '5px' }), dangerouslySetInnerHTML: {
|
17108
17071
|
__html: setFontForText((_c = interaction === null || interaction === void 0 ? void 0 : interaction.text) === null || _c === void 0 ? void 0 : _c.replace(/\n/g, '</br>'), interaction === null || interaction === void 0 ? void 0 : interaction.style)
|
17109
17072
|
}, onClick: handleClick })),
|
17110
17073
|
isShowClose && (React.createElement("button", { "aria-label": 'close', className: 'consentPopupDisplay-close', onClick: handleClickClose },
|
@@ -18022,22 +17985,21 @@ const LikeButton = (_a) => {
|
|
18022
17985
|
const likeIcon = useIconLink(defaultLikeIconPath$2);
|
18023
17986
|
const unlikeIcon = useIconLink(defaultUnLikeIconPath$2);
|
18024
17987
|
const handleClick = lodash.debounce(() => __awaiter(void 0, void 0, void 0, function* () {
|
18025
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z
|
17988
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
|
18026
17989
|
if (state) {
|
18027
17990
|
// 先设置状态
|
18028
17991
|
setState(false);
|
18029
|
-
const result = (_e = (yield (mutateUnlike === null || mutateUnlike === void 0 ? void 0 : mutateUnlike({
|
17992
|
+
const result = (_e = (yield (mutateUnlike === null || mutateUnlike === void 0 ? void 0 : mutateUnlike({ videoItemId: (_d = (_c = recData === null || recData === void 0 ? void 0 : recData.video) === null || _c === void 0 ? void 0 : _c.itemId) !== null && _d !== void 0 ? _d : '' })))) !== null && _e !== void 0 ? _e : false;
|
18030
17993
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
18031
17994
|
eventInfo: {
|
18032
17995
|
eventSubject: 'favoriteContentCanceled',
|
18033
17996
|
eventDescription: 'This content was unfavorite by the user',
|
18034
17997
|
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 : '',
|
18035
|
-
|
18036
|
-
|
18037
|
-
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 : []),
|
17998
|
+
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 : '',
|
17999
|
+
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 : []),
|
18038
18000
|
position: position + '',
|
18039
|
-
contentFormat: ((
|
18040
|
-
traceInfo: (
|
18001
|
+
contentFormat: ((_m = recData === null || recData === void 0 ? void 0 : recData.video) === null || _m === void 0 ? void 0 : _m.url) ? 'video' : 'image',
|
18002
|
+
traceInfo: (_o = recData === null || recData === void 0 ? void 0 : recData.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
18041
18003
|
}
|
18042
18004
|
});
|
18043
18005
|
// 如果接口调用失败,则回滚状态
|
@@ -18045,41 +18007,40 @@ const LikeButton = (_a) => {
|
|
18045
18007
|
setState(true);
|
18046
18008
|
}
|
18047
18009
|
else {
|
18048
|
-
const nRtcList = (
|
18010
|
+
const nRtcList = (_p = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
18049
18011
|
if (index === position) {
|
18050
18012
|
item.isCollected = false;
|
18051
18013
|
}
|
18052
18014
|
return item;
|
18053
|
-
})) !== null &&
|
18015
|
+
})) !== null && _p !== void 0 ? _p : [];
|
18054
18016
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
18055
18017
|
}
|
18056
18018
|
}
|
18057
18019
|
else {
|
18058
18020
|
setState(true);
|
18059
|
-
const result = (
|
18021
|
+
const result = (_q = (yield (mutateLike === null || mutateLike === void 0 ? void 0 : mutateLike({ content: JSON.stringify(recData) })))) !== null && _q !== void 0 ? _q : false;
|
18060
18022
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
18061
18023
|
eventInfo: {
|
18062
18024
|
eventSubject: 'favoriteContent',
|
18063
18025
|
eventDescription: 'This content was favorite by the user',
|
18064
|
-
contentId: (
|
18065
|
-
|
18066
|
-
|
18067
|
-
contentTags: JSON.stringify((_4 = (_3 = recData === null || recData === void 0 ? void 0 : recData.video) === null || _3 === void 0 ? void 0 : _3.tags) !== null && _4 !== void 0 ? _4 : []),
|
18026
|
+
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 : '',
|
18027
|
+
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 : '',
|
18028
|
+
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 : []),
|
18068
18029
|
position: position + '',
|
18069
|
-
contentFormat: ((
|
18070
|
-
traceInfo: (
|
18030
|
+
contentFormat: ((_x = recData === null || recData === void 0 ? void 0 : recData.video) === null || _x === void 0 ? void 0 : _x.url) ? 'video' : 'image',
|
18031
|
+
traceInfo: (_y = recData === null || recData === void 0 ? void 0 : recData.video) === null || _y === void 0 ? void 0 : _y.traceInfo
|
18071
18032
|
}
|
18072
18033
|
});
|
18073
18034
|
if (!result) {
|
18074
18035
|
setState(false);
|
18075
18036
|
}
|
18076
18037
|
else {
|
18077
|
-
const nRtcList = (
|
18038
|
+
const nRtcList = (_z = cacheRtcList === null || cacheRtcList === void 0 ? void 0 : cacheRtcList.map((item, index) => {
|
18078
18039
|
if (index === position) {
|
18079
18040
|
item.isCollected = true;
|
18080
18041
|
}
|
18081
18042
|
return item;
|
18082
|
-
})) !== null &&
|
18043
|
+
})) !== null && _z !== void 0 ? _z : [];
|
18083
18044
|
setCacheRtcList === null || setCacheRtcList === void 0 ? void 0 : setCacheRtcList(nRtcList);
|
18084
18045
|
}
|
18085
18046
|
}
|
@@ -18116,7 +18077,7 @@ const mountVideoPlayerAtNode = (() => {
|
|
18116
18077
|
const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activeIndex, videoPostConfig, videoPlayIcon, loopPlay, swiperRef }, ref) => {
|
18117
18078
|
var _a, _b;
|
18118
18079
|
const [isPauseVideo, setIsPauseVideo] = React.useState(false);
|
18119
|
-
const { bffEventReport, sxpParameter,
|
18080
|
+
const { bffEventReport, sxpParameter, waterFallData, openHashtag, bffFbReport, isDiyH5 } = useSxpDataSource();
|
18120
18081
|
const videoStartTime = React.useRef(0);
|
18121
18082
|
const [isLoadFinish, setIsLoadFinish] = React.useState(false);
|
18122
18083
|
const { isActive } = useSwiperSlide();
|
@@ -18182,23 +18143,6 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18182
18143
|
return;
|
18183
18144
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
18184
18145
|
}, [videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
18185
|
-
const handleEnd = () => {
|
18186
|
-
var _a, _b, _c, _d, _e, _f;
|
18187
|
-
if (!videoRef.current)
|
18188
|
-
return;
|
18189
|
-
if (isDiyH5) {
|
18190
|
-
(_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.pause();
|
18191
|
-
if (!loopPlayRef.current)
|
18192
|
-
return;
|
18193
|
-
if (firstRtcList && index < (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) - 1) {
|
18194
|
-
const i = (_c = (_b = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _b === void 0 ? void 0 : _b.swiper) === null || _c === void 0 ? void 0 : _c.activeIndex;
|
18195
|
-
(_e = (_d = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _d === void 0 ? void 0 : _d.swiper) === null || _e === void 0 ? void 0 : _e.slideTo(i + 1);
|
18196
|
-
}
|
18197
|
-
}
|
18198
|
-
else {
|
18199
|
-
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.play();
|
18200
|
-
}
|
18201
|
-
};
|
18202
18146
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
18203
18147
|
const handlePlaying = React.useCallback(() => {
|
18204
18148
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
@@ -18207,7 +18151,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18207
18151
|
setIsLoadFinish(true);
|
18208
18152
|
}, []);
|
18209
18153
|
const handleStartPlay = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
18210
|
-
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q
|
18154
|
+
var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
18211
18155
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
18212
18156
|
return;
|
18213
18157
|
setIsPauseVideo(false);
|
@@ -18218,11 +18162,16 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18218
18162
|
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);
|
18219
18163
|
const playType = (isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) ? '0' : '1';
|
18220
18164
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
18221
|
-
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 : '',
|
18165
|
+
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) + '' }))
|
18222
18166
|
});
|
18223
18167
|
isFirstPlayRef.current = false;
|
18224
18168
|
}
|
18225
18169
|
}), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
18170
|
+
const setCurrentTimeByStartTime = React.useCallback(() => {
|
18171
|
+
if (isDiyH5) {
|
18172
|
+
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
18173
|
+
}
|
18174
|
+
}, []);
|
18226
18175
|
const handLoadeddata = React.useCallback(() => {
|
18227
18176
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) || firstFrameSrc || !blur)
|
18228
18177
|
return;
|
@@ -18247,12 +18196,13 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18247
18196
|
const handleLoadedmetadata = React.useCallback(() => {
|
18248
18197
|
if (!videoRef.current)
|
18249
18198
|
return;
|
18199
|
+
setCurrentTimeByStartTime();
|
18250
18200
|
loadedTimeRef.current = new Date();
|
18251
18201
|
handleStartPlay();
|
18252
18202
|
handLoadeddata();
|
18253
18203
|
}, [videoRef.current, handLoadeddata, handleStartPlay]);
|
18254
18204
|
const handleClickVideo = React.useCallback((type) => () => {
|
18255
|
-
var _a, _b, _c, _d, _e;
|
18205
|
+
var _a, _b, _c, _d, _e, _f;
|
18256
18206
|
if (!videoRef.current)
|
18257
18207
|
return;
|
18258
18208
|
if (!isLoadFinish)
|
@@ -18273,17 +18223,20 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18273
18223
|
break;
|
18274
18224
|
default:
|
18275
18225
|
if (isPause) {
|
18276
|
-
(_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.
|
18226
|
+
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)) {
|
18227
|
+
videoRef.current.currentTime = scene === null || scene === void 0 ? void 0 : scene.startTime;
|
18228
|
+
}
|
18229
|
+
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.play();
|
18277
18230
|
}
|
18278
18231
|
else {
|
18279
|
-
(
|
18232
|
+
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.pause();
|
18280
18233
|
}
|
18281
18234
|
setIsPauseVideo(!isPause);
|
18282
18235
|
break;
|
18283
18236
|
}
|
18284
18237
|
}, [isLoadFinish, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
|
18285
18238
|
const handlePause = React.useCallback(() => {
|
18286
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o
|
18239
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
18287
18240
|
if (!(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current))
|
18288
18241
|
return;
|
18289
18242
|
if (activeIndex !== index)
|
@@ -18299,15 +18252,14 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18299
18252
|
eventSubject: 'playOverVideo',
|
18300
18253
|
eventDescription: 'User finished playing the video',
|
18301
18254
|
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 : '',
|
18302
|
-
|
18303
|
-
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 : '',
|
18255
|
+
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 : '',
|
18304
18256
|
endTime: videoCurrentTime,
|
18305
18257
|
videoDuration,
|
18306
18258
|
playDuration,
|
18307
|
-
contentTags: JSON.stringify((
|
18259
|
+
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 : []),
|
18308
18260
|
position: index + '',
|
18309
18261
|
contentFormat: 'video',
|
18310
|
-
traceInfo: (
|
18262
|
+
traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
18311
18263
|
}
|
18312
18264
|
});
|
18313
18265
|
}
|
@@ -18315,8 +18267,27 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18315
18267
|
const handleWaiting = React.useCallback(() => {
|
18316
18268
|
setWaiting(true);
|
18317
18269
|
}, []);
|
18270
|
+
const handleTimeUpload = () => {
|
18271
|
+
if (!videoRef.current || !isDiyH5)
|
18272
|
+
return;
|
18273
|
+
setTimeout(() => {
|
18274
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
18275
|
+
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)) {
|
18276
|
+
(_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.pause();
|
18277
|
+
if (!loopPlayRef.current)
|
18278
|
+
return;
|
18279
|
+
if (index === (data === null || data === void 0 ? void 0 : data.length) - 1) {
|
18280
|
+
(_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);
|
18281
|
+
}
|
18282
|
+
else {
|
18283
|
+
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;
|
18284
|
+
(_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);
|
18285
|
+
}
|
18286
|
+
}
|
18287
|
+
});
|
18288
|
+
};
|
18318
18289
|
React.useEffect(() => {
|
18319
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
18290
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
18320
18291
|
if (!isActive)
|
18321
18292
|
return;
|
18322
18293
|
const videoSrc = videoUrl;
|
@@ -18337,6 +18308,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18337
18308
|
hls === null || hls === void 0 ? void 0 : hls.attachMedia(videoRef === null || videoRef === void 0 ? void 0 : videoRef.current);
|
18338
18309
|
hls === null || hls === void 0 ? void 0 : hls.on(Hls.Events.MANIFEST_PARSED, function () {
|
18339
18310
|
var _a;
|
18311
|
+
setCurrentTimeByStartTime();
|
18340
18312
|
(_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.play();
|
18341
18313
|
});
|
18342
18314
|
}
|
@@ -18350,11 +18322,12 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18350
18322
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.addEventListener('play', handleStartPlay);
|
18351
18323
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.addEventListener('playing', handlePlaying);
|
18352
18324
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.addEventListener('pause', handlePause);
|
18353
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended',
|
18325
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.addEventListener('ended', handlePlay);
|
18354
18326
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.addEventListener('canplay', handlePlay);
|
18355
18327
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.addEventListener('waiting', handleWaiting);
|
18328
|
+
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.addEventListener('timeupdate', handleTimeUpload);
|
18356
18329
|
return () => {
|
18357
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
18330
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
18358
18331
|
const isPause = (_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.paused;
|
18359
18332
|
if (!isPause)
|
18360
18333
|
handlePause();
|
@@ -18366,9 +18339,10 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
|
|
18366
18339
|
(_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.removeEventListener('play', handleStartPlay);
|
18367
18340
|
(_f = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _f === void 0 ? void 0 : _f.removeEventListener('playing', handlePlaying);
|
18368
18341
|
(_g = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _g === void 0 ? void 0 : _g.removeEventListener('pause', handlePause);
|
18369
|
-
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended',
|
18342
|
+
(_h = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _h === void 0 ? void 0 : _h.removeEventListener('ended', handlePlay);
|
18370
18343
|
(_j = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _j === void 0 ? void 0 : _j.removeEventListener('canplay', handlePlay);
|
18371
18344
|
(_k = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _k === void 0 ? void 0 : _k.removeEventListener('waiting', handleWaiting);
|
18345
|
+
(_l = videoRef.current) === null || _l === void 0 ? void 0 : _l.removeEventListener('timeupdate', handleTimeUpload);
|
18372
18346
|
};
|
18373
18347
|
}, [isActive]);
|
18374
18348
|
React.useEffect(() => {
|
@@ -18579,45 +18553,19 @@ const Picture = (props) => {
|
|
18579
18553
|
}, onLoad: onShowFirstImage }))));
|
18580
18554
|
};
|
18581
18555
|
|
18582
|
-
const PictureGroup$4 =
|
18556
|
+
const PictureGroup$4 = ({ imgUrls, width, height, rec, index, onViewImageEndEvent, onViewImageStartEvent, imgUrlsPostConfig }) => {
|
18583
18557
|
var _a, _b;
|
18584
18558
|
const { isActive } = useSwiperSlide();
|
18585
|
-
const {
|
18559
|
+
const { sxpParameter, openHashtag } = useSxpDataSource();
|
18586
18560
|
const [isLoad, setIsLoad] = React.useState(false);
|
18587
18561
|
const [imgInfo, setImgInfo] = React.useState();
|
18588
18562
|
const [swiperActiveIndex, setSwiperActiveIndex] = React.useState(0);
|
18589
|
-
const
|
18563
|
+
const swiperRef = React.useRef();
|
18590
18564
|
const isFirstPlayRef = React.useRef(true);
|
18591
|
-
const loopPlayRef = React.useRef(true);
|
18592
18565
|
const initTime = new Date();
|
18593
|
-
React.useImperativeHandle(ref, () => {
|
18594
|
-
return {
|
18595
|
-
setLoopPlay(v) {
|
18596
|
-
loopPlayRef.current = v;
|
18597
|
-
}
|
18598
|
-
};
|
18599
|
-
});
|
18600
|
-
React.useEffect(() => {
|
18601
|
-
let timerId;
|
18602
|
-
if (isLoad && isActive && isDiyH5) {
|
18603
|
-
timerId = setTimeout(() => {
|
18604
|
-
var _a, _b, _c, _d;
|
18605
|
-
if (!loopPlayRef.current)
|
18606
|
-
return;
|
18607
|
-
if (firstRtcList && index < (firstRtcList === null || firstRtcList === void 0 ? void 0 : firstRtcList.length) - 1) {
|
18608
|
-
const i = (_b = (_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper) === null || _b === void 0 ? void 0 : _b.activeIndex;
|
18609
|
-
(_d = (_c = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _c === void 0 ? void 0 : _c.swiper) === null || _d === void 0 ? void 0 : _d.slideTo(i + 1);
|
18610
|
-
}
|
18611
|
-
}, 3000);
|
18612
|
-
}
|
18613
|
-
return () => {
|
18614
|
-
if (timerId)
|
18615
|
-
clearTimeout(timerId);
|
18616
|
-
};
|
18617
|
-
}, [isLoad, isActive, isDiyH5, index, swiperRef, firstRtcList]);
|
18618
18566
|
React.useEffect(() => {
|
18619
18567
|
if (isLoad && isActive) {
|
18620
|
-
(
|
18568
|
+
(swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) && swiperRef.current.swiper.autoplay.start();
|
18621
18569
|
if (openHashtag) {
|
18622
18570
|
onViewImageEndEvent(rec);
|
18623
18571
|
}
|
@@ -18627,7 +18575,7 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
18627
18575
|
}
|
18628
18576
|
}
|
18629
18577
|
else {
|
18630
|
-
(
|
18578
|
+
(swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) && swiperRef.current.swiper.autoplay.stop();
|
18631
18579
|
}
|
18632
18580
|
}, [rec, isActive, onViewImageEndEvent, openHashtag, index, onViewImageStartEvent, isLoad, imgInfo]);
|
18633
18581
|
const showFirstImageFn = React.useCallback((e) => __awaiter(void 0, void 0, void 0, function* () {
|
@@ -18654,13 +18602,13 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
18654
18602
|
};
|
18655
18603
|
}, [isActive, imgInfo]);
|
18656
18604
|
const handleMouseEnter = React.useCallback(() => {
|
18657
|
-
if (
|
18658
|
-
|
18605
|
+
if (swiperRef.current && swiperRef.current.swiper && isAlly) {
|
18606
|
+
swiperRef.current.swiper.autoplay.stop();
|
18659
18607
|
}
|
18660
18608
|
}, []);
|
18661
18609
|
const handleMouseLeave = React.useCallback(() => {
|
18662
|
-
if (
|
18663
|
-
|
18610
|
+
if (swiperRef.current && swiperRef.current.swiper && isAlly) {
|
18611
|
+
swiperRef.current.swiper.autoplay.start();
|
18664
18612
|
}
|
18665
18613
|
}, []);
|
18666
18614
|
const handleSlideChange = React.useCallback((swiper) => {
|
@@ -18681,7 +18629,7 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
18681
18629
|
enabled: true
|
18682
18630
|
}
|
18683
18631
|
}
|
18684
|
-
: {}), { loop: true, ref:
|
18632
|
+
: {}), { loop: true, ref: swiperRef, onSlideChange: handleSlideChange, className: css.css(Object.assign(Object.assign({ '.swiper-pagination': {
|
18685
18633
|
bottom: (_a = imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.marginBottom) !== null && _a !== void 0 ? _a : 0,
|
18686
18634
|
fontSize: '14px'
|
18687
18635
|
} }, ((imgUrlsPostConfig === null || imgUrlsPostConfig === void 0 ? void 0 : imgUrlsPostConfig.dotsBgColor) && {
|
@@ -18698,7 +18646,7 @@ const PictureGroup$4 = React.forwardRef(({ imgUrls, data, height, rec, index, on
|
|
18698
18646
|
return (React.createElement(SwiperSlide, { key: srcKey, "aria-hidden": srcKey !== swiperActiveIndex },
|
18699
18647
|
React.createElement(Picture, { src: !isLoad && srcKey > 0 ? '' : url, height: height, imgUrlsPostConfig: imgUrlsPostConfig, onShowFirstImage: showFirstImageFn })));
|
18700
18648
|
}))));
|
18701
|
-
}
|
18649
|
+
};
|
18702
18650
|
var PictureGroup$5 = React.memo(PictureGroup$4);
|
18703
18651
|
|
18704
18652
|
/*
|
@@ -18850,7 +18798,7 @@ const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType, isActive,
|
|
18850
18798
|
const sbf = style.backdropFilter;
|
18851
18799
|
style.backdropFilter = `blur(${sbf !== null && sbf !== void 0 ? sbf : 0}px)`;
|
18852
18800
|
}
|
18853
|
-
return (React.createElement(Component, Object.assign({ style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), style), { zIndex: 50,
|
18801
|
+
return (React.createElement(Component, Object.assign({ style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), style), { zIndex: 50, marginInlineEnd: '20px', boxSizing: 'border-box', transform: 'translate3d(0px, 0px, 0px)' }), textStyle: Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.textStyle), (_z = value === null || value === void 0 ? void 0 : value.item) === null || _z === void 0 ? void 0 : _z.textStyle), bindDatas: (_1 = (_0 = value === null || value === void 0 ? void 0 : value.item) === null || _0 === void 0 ? void 0 : _0.bindDatas) !== null && _1 !== void 0 ? _1 : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_2 = value === null || value === void 0 ? void 0 : value.item) === null || _2 === void 0 ? void 0 : _2.props, { event: ((_3 = value === null || value === void 0 ? void 0 : value.item) === null || _3 === void 0 ? void 0 : _3.event) || {}, schema: schema, id: value === null || value === void 0 ? void 0 : value.id, key: value === null || value === void 0 ? void 0 : value.id, recData: rec, isExternalLink: isExternalLink, index: index, isActive: isActive })));
|
18854
18802
|
}
|
18855
18803
|
else {
|
18856
18804
|
return null;
|
@@ -18978,7 +18926,7 @@ var NavBack$1 = React.memo(NavBack);
|
|
18978
18926
|
* @Author: binruan@chatlabs.com
|
18979
18927
|
* @Date: 2024-03-20 10:27:31
|
18980
18928
|
* @LastEditors: binruan@chatlabs.com
|
18981
|
-
* @LastEditTime: 2025-05-
|
18929
|
+
* @LastEditTime: 2025-05-09 15:51:40
|
18982
18930
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
18983
18931
|
*
|
18984
18932
|
*/
|
@@ -18998,7 +18946,6 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18998
18946
|
const skipLinkRef = React.useRef(false);
|
18999
18947
|
const [pageNum, setPageNum] = React.useState(2);
|
19000
18948
|
const videoWidgetRef = React.useRef(null);
|
19001
|
-
const pictureGroupRef = React.useRef(null);
|
19002
18949
|
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();
|
19003
18950
|
const { backMainFeed, productView, jumpToWeb } = useEventReport();
|
19004
18951
|
const isShowFingerTip = React.useMemo(() => {
|
@@ -19046,7 +18993,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19046
18993
|
(_a = swiperRef === null || swiperRef === void 0 ? void 0 : swiperRef.current) === null || _a === void 0 ? void 0 : _a.swiper.slideTo(index);
|
19047
18994
|
}, [data, ctaType, swiperRef]);
|
19048
18995
|
const handleSessionCompleted = React.useCallback((fk) => {
|
19049
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v
|
18996
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
|
19050
18997
|
const item = data === null || data === void 0 ? void 0 : data[activeIndex];
|
19051
18998
|
let fromKName = '';
|
19052
18999
|
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))) {
|
@@ -19073,13 +19020,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19073
19020
|
eventSubject: 'sessionCompleted',
|
19074
19021
|
eventDescription: 'Session completed',
|
19075
19022
|
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
19076
|
-
|
19077
|
-
productId: (_r = item === null || item === void 0 ? void 0 : item.product) === null || _r === void 0 ? void 0 : _r.itemId,
|
19023
|
+
productId: (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.itemId,
|
19078
19024
|
position: activeIndex + '',
|
19079
19025
|
fromKName: fk || fromKName,
|
19080
19026
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
19081
|
-
ctatId: (
|
19082
|
-
traceInfo: (
|
19027
|
+
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 : '',
|
19028
|
+
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 : ''
|
19083
19029
|
}
|
19084
19030
|
});
|
19085
19031
|
}, [data, bffEventReport, activeIndex, popupDetailData, tempMap, isFromHashtag, curTime]);
|
@@ -19138,9 +19084,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19138
19084
|
refreshFeSession
|
19139
19085
|
]);
|
19140
19086
|
const handleSessionExpire = React.useCallback(lodash.debounce(() => {
|
19141
|
-
var _a
|
19087
|
+
var _a;
|
19142
19088
|
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
19143
|
-
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
19144
19089
|
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false, handleSessionCompleted);
|
19145
19090
|
}, 1000), [handleSessionCompleted, refreshFeSession]);
|
19146
19091
|
React.useEffect(() => {
|
@@ -19210,18 +19155,18 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19210
19155
|
return null;
|
19211
19156
|
}, [globalConfig, activeIndex, visList]);
|
19212
19157
|
const renderContent = React.useCallback((rec, index) => {
|
19213
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k
|
19158
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
19214
19159
|
if (rec === 'organic menu') {
|
19215
19160
|
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)));
|
19216
19161
|
}
|
19217
|
-
if ((
|
19162
|
+
if ((_g = rec === null || rec === void 0 ? void 0 : rec.video) === null || _g === void 0 ? void 0 : _g.url) {
|
19218
19163
|
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 })));
|
19219
19164
|
}
|
19220
|
-
if ((
|
19221
|
-
return (React.createElement(PictureGroup$5,
|
19165
|
+
if ((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.imgUrls) {
|
19166
|
+
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 }));
|
19222
19167
|
}
|
19223
|
-
if (rec.product && Array.isArray(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) && ((
|
19224
|
-
return (
|
19168
|
+
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) {
|
19169
|
+
return (_k = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _k === void 0 ? void 0 : _k.map((value, idx) => {
|
19225
19170
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
19226
19171
|
const t = resolver[(_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type];
|
19227
19172
|
const Component = withBindDataSource(t);
|
@@ -19259,7 +19204,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19259
19204
|
};
|
19260
19205
|
}, [isShowMore]);
|
19261
19206
|
const renderBottom = React.useCallback((rec, index) => {
|
19262
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q
|
19207
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
|
19263
19208
|
if (rec === null || rec === void 0 ? void 0 : rec.video) {
|
19264
19209
|
let cta = null;
|
19265
19210
|
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) {
|
@@ -19268,27 +19213,24 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19268
19213
|
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
|
19269
19214
|
cta = '商品CTA';
|
19270
19215
|
}
|
19271
|
-
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)) {
|
19272
|
-
cta = '服务CTA';
|
19273
|
-
}
|
19274
19216
|
else {
|
19275
|
-
cta = (
|
19217
|
+
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;
|
19276
19218
|
}
|
19277
19219
|
const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
|
19278
19220
|
const isNineProduct = (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.nineProductEnable) &&
|
19279
19221
|
index === ((rtcList === null || rtcList === void 0 ? void 0 : rtcList[0]) === 'organic menu' ? 2 : 1) &&
|
19280
|
-
((
|
19222
|
+
((_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));
|
19281
19223
|
return (React.createElement(React.Fragment, null,
|
19282
19224
|
isNineProduct && (React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value, isNineProduct: isNineProduct })),
|
19283
|
-
((
|
19284
|
-
React.createElement("div", { className: 'clc-sxp-bottom', style: { marginBottom: `${(
|
19225
|
+
((_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' }),
|
19226
|
+
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` } },
|
19285
19227
|
React.createElement(Nudge, { nudge: nudge }),
|
19286
19228
|
((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' },
|
19287
19229
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, isActive: index === activeIndex, value: value }))) : null,
|
19288
19230
|
React.createElement("div", null,
|
19289
|
-
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: (
|
19231
|
+
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 }),
|
19290
19232
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLink'], isActive: index === activeIndex, value: value }),
|
19291
|
-
React.createElement(Hashtag$1, { index: activeIndex, tags: (
|
19233
|
+
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) }))),
|
19292
19234
|
React.createElement(RenderCard$1, { rec: rec, index: index, tempMap: tempMap, resolver: resolver, includesCtaType: ['AniLinkPopup'], isActive: index === activeIndex, value: value })));
|
19293
19235
|
}
|
19294
19236
|
return null;
|
@@ -19327,7 +19269,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19327
19269
|
return null;
|
19328
19270
|
}, [globalConfig, waterFallData]);
|
19329
19271
|
const handleViewImageStartEnd = (item) => {
|
19330
|
-
var _a, _b, _c, _d, _e, _f
|
19272
|
+
var _a, _b, _c, _d, _e, _f;
|
19331
19273
|
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)) {
|
19332
19274
|
const endTime = Date.now();
|
19333
19275
|
const duration = viewImageStartTime.current === 0 ? 0 : (endTime - viewImageStartTime.current) / 1000;
|
@@ -19336,11 +19278,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19336
19278
|
eventSubject: 'viewImageCarouselEnd',
|
19337
19279
|
eventDescription: 'User end view the image carousel',
|
19338
19280
|
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 : '',
|
19339
|
-
|
19340
|
-
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
19281
|
+
contentName: (_e = item === null || item === void 0 ? void 0 : item.video.title) !== null && _e !== void 0 ? _e : '',
|
19341
19282
|
imageEndTime: `${endTime}`,
|
19342
19283
|
playDuration: `${duration}`,
|
19343
|
-
contentTags: JSON.stringify((
|
19284
|
+
contentTags: JSON.stringify((_f = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _f !== void 0 ? _f : []),
|
19344
19285
|
position: activeIndex + '',
|
19345
19286
|
contentFormat: 'image',
|
19346
19287
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo
|
@@ -19349,7 +19290,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19349
19290
|
}
|
19350
19291
|
};
|
19351
19292
|
const handleSlideSkip = (item, position) => {
|
19352
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x
|
19293
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
19353
19294
|
if (isPreview || waterFallData)
|
19354
19295
|
return;
|
19355
19296
|
const t = new Date() - curTime.current;
|
@@ -19375,8 +19316,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19375
19316
|
contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
|
19376
19317
|
position: position + '',
|
19377
19318
|
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 : '',
|
19378
|
-
|
19379
|
-
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 : '',
|
19319
|
+
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 : '',
|
19380
19320
|
contentFormat
|
19381
19321
|
}
|
19382
19322
|
});
|
@@ -19386,7 +19326,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19386
19326
|
}
|
19387
19327
|
};
|
19388
19328
|
const handleScrollEvent = (swiper) => {
|
19389
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w
|
19329
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
|
19390
19330
|
const item = data[swiper.previousIndex];
|
19391
19331
|
if (!item)
|
19392
19332
|
return;
|
@@ -19403,12 +19343,11 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19403
19343
|
eventSubject: 'scrollDown',
|
19404
19344
|
eventDescription: 'User scroll down',
|
19405
19345
|
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 : '',
|
19406
|
-
|
19407
|
-
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 : '',
|
19346
|
+
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 : '',
|
19408
19347
|
requestId: null,
|
19409
|
-
traceInfo: (
|
19348
|
+
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 : '',
|
19410
19349
|
contentFormat,
|
19411
|
-
position: ((
|
19350
|
+
position: ((_m = swiper.previousIndex) !== null && _m !== void 0 ? _m : 0) + ''
|
19412
19351
|
}
|
19413
19352
|
});
|
19414
19353
|
// 如果上一个商品是图片集,需上报 浏览图片集结结束 事件
|
@@ -19420,13 +19359,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19420
19359
|
eventInfo: {
|
19421
19360
|
eventSubject: 'scrollUp',
|
19422
19361
|
eventDescription: 'User scroll up',
|
19423
|
-
contentId: (
|
19424
|
-
|
19425
|
-
productId: (_x = (_w = item.product) === null || _w === void 0 ? void 0 : _w.itemId) !== null && _x !== void 0 ? _x : '',
|
19362
|
+
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 : '',
|
19363
|
+
productId: (_r = (_q = item.product) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
|
19426
19364
|
requestId: null,
|
19427
|
-
traceInfo: (
|
19365
|
+
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 : '',
|
19428
19366
|
contentFormat,
|
19429
|
-
position: ((
|
19367
|
+
position: ((_w = swiper.previousIndex) !== null && _w !== void 0 ? _w : 0) + ''
|
19430
19368
|
}
|
19431
19369
|
});
|
19432
19370
|
// 如果上一个商品是图片集,需上报 浏览图片集结结束 事件
|
@@ -19452,7 +19390,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19452
19390
|
}
|
19453
19391
|
}, [openHashtag, data, activeIndex]);
|
19454
19392
|
const handleViewImageStartEvent = (activeIndex, imgInfo, enableCapi) => {
|
19455
|
-
var _a, _b, _c, _d, _e, _f, _g, _h
|
19393
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
19456
19394
|
const item = data[activeIndex];
|
19457
19395
|
// 如果是图片集则上报事件
|
19458
19396
|
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)) {
|
@@ -19463,10 +19401,9 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19463
19401
|
eventSubject: 'viewImageCarouselStart',
|
19464
19402
|
eventDescription: 'User start view the image carousel',
|
19465
19403
|
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 : '',
|
19466
|
-
|
19467
|
-
contentName: (_h = item === null || item === void 0 ? void 0 : item.video.title) !== null && _h !== void 0 ? _h : '',
|
19404
|
+
contentName: (_e = item === null || item === void 0 ? void 0 : item.video.title) !== null && _e !== void 0 ? _e : '',
|
19468
19405
|
imageStartTime: `${startTime}`,
|
19469
|
-
contentTags: JSON.stringify((
|
19406
|
+
contentTags: JSON.stringify((_f = item === null || item === void 0 ? void 0 : item.video.tags) !== null && _f !== void 0 ? _f : []),
|
19470
19407
|
position: activeIndex + '',
|
19471
19408
|
contentFormat: 'image',
|
19472
19409
|
traceInfo: item === null || item === void 0 ? void 0 : item.video.traceInfo,
|
@@ -19476,11 +19413,11 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19476
19413
|
if (enableCapi) {
|
19477
19414
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
19478
19415
|
eventName: 'ViewContent',
|
19479
|
-
product: (
|
19416
|
+
product: (_g = item === null || item === void 0 ? void 0 : item.video) === null || _g === void 0 ? void 0 : _g.bindProduct
|
19480
19417
|
});
|
19481
19418
|
bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
|
19482
19419
|
eventName: 'PageView',
|
19483
|
-
product: (
|
19420
|
+
product: (_h = item === null || item === void 0 ? void 0 : item.video) === null || _h === void 0 ? void 0 : _h.bindProduct
|
19484
19421
|
});
|
19485
19422
|
}
|
19486
19423
|
}
|
@@ -19572,20 +19509,15 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
19572
19509
|
swiperRef.current.swiper.allowTouchMove = true;
|
19573
19510
|
}, 500);
|
19574
19511
|
}, onActiveIndexChange: (swiper) => {
|
19575
|
-
var _a, _b;
|
19576
19512
|
setActiveIndex(swiper.activeIndex);
|
19577
19513
|
if (openHashtag)
|
19578
19514
|
return;
|
19579
19515
|
// 处理上滑下滑事件
|
19580
19516
|
handleScrollEvent(swiper);
|
19581
|
-
if (waterFallData || isEditor)
|
19517
|
+
if (waterFallData || isEditor || isDiyH5)
|
19582
19518
|
return;
|
19583
19519
|
if ((swiper === null || swiper === void 0 ? void 0 : swiper.activeIndex) + 1 >= (data === null || data === void 0 ? void 0 : data.length)) {
|
19584
19520
|
if (!isLoadMore) {
|
19585
|
-
if (isDiyH5) {
|
19586
|
-
(_a = videoWidgetRef.current) === null || _a === void 0 ? void 0 : _a.setLoopPlay(false);
|
19587
|
-
(_b = pictureGroupRef.current) === null || _b === void 0 ? void 0 : _b.setLoopPlay(false);
|
19588
|
-
}
|
19589
19521
|
setIsLoadMore(true);
|
19590
19522
|
loadVideos === null || loadVideos === void 0 ? void 0 : loadVideos(pageNum).then((res) => {
|
19591
19523
|
var _a;
|
@@ -19638,7 +19570,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19638
19570
|
}, []);
|
19639
19571
|
const PAUSE_ICON = useIconLink('/pb_static/06f28a2025c74c1cb49be6767316d827.png');
|
19640
19572
|
const handlePlaying = React.useCallback(() => {
|
19641
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o
|
19573
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
19642
19574
|
setIsPauseVideo(false);
|
19643
19575
|
const item = data[index];
|
19644
19576
|
if (item && ((_a = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _a === void 0 ? void 0 : _a.duration)) {
|
@@ -19651,15 +19583,14 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19651
19583
|
eventSubject: 'playVideo',
|
19652
19584
|
eventDescription: 'User played the video',
|
19653
19585
|
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 : '',
|
19654
|
-
|
19655
|
-
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 : '',
|
19586
|
+
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 : '',
|
19656
19587
|
playType,
|
19657
19588
|
startTime: videoCurrentTime,
|
19658
19589
|
videoDuration,
|
19659
|
-
contentTags: JSON.stringify((
|
19590
|
+
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 : []),
|
19660
19591
|
position: index + '',
|
19661
19592
|
contentFormat: 'video',
|
19662
|
-
traceInfo: (
|
19593
|
+
traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
19663
19594
|
}
|
19664
19595
|
});
|
19665
19596
|
setIsFirstPlay(false);
|
@@ -19698,7 +19629,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19698
19629
|
}
|
19699
19630
|
}, [isLoadFinish]);
|
19700
19631
|
const onPause = React.useCallback(() => {
|
19701
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o
|
19632
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
19702
19633
|
const item = data[index];
|
19703
19634
|
const videoDuration = ((_b = (_a = videoRef.current) === null || _a === void 0 ? void 0 : _a.duration) !== null && _b !== void 0 ? _b : 0).toFixed(2);
|
19704
19635
|
const videoCurrentTime = ((_d = (_c = videoRef.current) === null || _c === void 0 ? void 0 : _c.currentTime) !== null && _d !== void 0 ? _d : 0).toFixed(2);
|
@@ -19709,15 +19640,14 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
19709
19640
|
eventSubject: 'playOverVideo',
|
19710
19641
|
eventDescription: 'User finished playing the video',
|
19711
19642
|
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 : '',
|
19712
|
-
|
19713
|
-
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 : '',
|
19643
|
+
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 : '',
|
19714
19644
|
endTime: videoCurrentTime,
|
19715
19645
|
videoDuration,
|
19716
19646
|
playDuration,
|
19717
|
-
contentTags: JSON.stringify((
|
19647
|
+
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 : []),
|
19718
19648
|
position: index + '',
|
19719
19649
|
contentFormat: 'video',
|
19720
|
-
traceInfo: (
|
19650
|
+
traceInfo: (_o = item === null || item === void 0 ? void 0 : item.video) === null || _o === void 0 ? void 0 : _o.traceInfo
|
19721
19651
|
}
|
19722
19652
|
});
|
19723
19653
|
}
|