pb-sxp-ui 1.10.1 → 1.10.3
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 +78 -51
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +78 -51
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +4 -4
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +4 -4
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +78 -51
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +4 -4
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/SxpPageCore/index.js +3 -2
- package/es/core/components/SxpPageRender/WaterFall/List.js +2 -2
- package/es/core/components/SxpPageRender/WaterFall/WaterfallList.js +2 -2
- package/es/core/components/SxpPageRender/index.js +4 -4
- package/es/core/context/EditorContext.d.ts +0 -2
- package/es/core/context/EditorContext.js +3 -9
- package/es/core/context/SxpDataSourceProvider.d.ts +9 -0
- package/es/core/context/SxpDataSourceProvider.js +26 -4
- package/es/core/hooks/useEventReport.d.ts +1 -1
- package/es/core/hooks/useEventReport.js +10 -3
- package/es/materials/sxp/MultiPosts/index.js +3 -4
- package/es/materials/sxp/cta/AniLink/index.js +2 -2
- package/es/materials/sxp/cta/AniLinkPopup/index.js +2 -2
- package/es/materials/sxp/popup/AppointForm/index.js +2 -2
- package/es/materials/sxp/popup/CommodityDetail/index.js +2 -2
- package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +2 -2
- package/es/materials/sxp/popup/CommodityList/index.js +3 -3
- package/es/materials/sxp/popup/Prompt/index.js +2 -2
- package/es/materials/sxp/template/Link/index.js +1 -3
- package/es/materials/sxp/template/components/EventProvider.js +3 -3
- package/lib/core/components/SxpPageCore/index.js +3 -2
- package/lib/core/components/SxpPageRender/WaterFall/List.js +2 -2
- package/lib/core/components/SxpPageRender/WaterFall/WaterfallList.js +2 -2
- package/lib/core/components/SxpPageRender/index.js +4 -4
- package/lib/core/context/EditorContext.d.ts +0 -2
- package/lib/core/context/EditorContext.js +3 -9
- package/lib/core/context/SxpDataSourceProvider.d.ts +9 -0
- package/lib/core/context/SxpDataSourceProvider.js +26 -4
- package/lib/core/hooks/useEventReport.d.ts +1 -1
- package/lib/core/hooks/useEventReport.js +10 -3
- package/lib/materials/sxp/MultiPosts/index.js +2 -3
- package/lib/materials/sxp/cta/AniLink/index.js +2 -2
- package/lib/materials/sxp/cta/AniLinkPopup/index.js +2 -2
- package/lib/materials/sxp/popup/AppointForm/index.js +2 -2
- package/lib/materials/sxp/popup/CommodityDetail/index.js +2 -2
- package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +2 -2
- package/lib/materials/sxp/popup/CommodityList/index.js +3 -3
- package/lib/materials/sxp/popup/Prompt/index.js +2 -2
- package/lib/materials/sxp/template/Link/index.js +1 -3
- package/lib/materials/sxp/template/components/EventProvider.js +3 -3
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
@@ -653,9 +653,8 @@ var DataSourceType;
|
|
653
653
|
DataSourceType[DataSourceType["BFF"] = 5] = "BFF";
|
654
654
|
})(DataSourceType || (DataSourceType = {}));
|
655
655
|
const DEFAULT_TAG = 'FOR U';
|
656
|
-
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, onUpdateSchema }) => {
|
656
|
+
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, onUpdateSchema, onUpdateChannel }) => {
|
657
657
|
var _a, _b, _c, _d, _e;
|
658
|
-
const { channel } = useEditor();
|
659
658
|
const [rtcList, setRtcList] = React.useState([]);
|
660
659
|
const [tagList, setTagList] = React.useState([]);
|
661
660
|
const [loading, setLoading] = React.useState(false);
|
@@ -681,11 +680,17 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
681
680
|
const [pageData, setPageData] = React.useState(data);
|
682
681
|
const [showConsent, setShowConsent] = React.useState(false);
|
683
682
|
const [layoutVariantId, setLayoutVariantId] = React.useState();
|
683
|
+
const [channel, setChannel] = React.useState();
|
684
|
+
const [eventTimeList, setEventTimeList] = React.useState([]);
|
684
685
|
const isShowConsent = React.useMemo(() => {
|
685
686
|
var _a, _b, _c, _d;
|
686
687
|
return (((((_d = (_c = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consent) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item) === null || _c === void 0 ? void 0 : _c.props) === null || _d === void 0 ? void 0 : _d.privacy_necessity) && !isAgreePolicy && !isEditor) || isOpenConsent) &&
|
687
688
|
showConsent);
|
688
689
|
}, [isAgreePolicy, globalConfig, isOpenConsent, isEditor, showConsent]);
|
690
|
+
const updateChannel = React.useCallback((d) => {
|
691
|
+
onUpdateChannel === null || onUpdateChannel === void 0 ? void 0 : onUpdateChannel(d);
|
692
|
+
setChannel(d);
|
693
|
+
}, []);
|
689
694
|
const getFilterRecList = React.useCallback((data) => {
|
690
695
|
var _a;
|
691
696
|
const recList = data === null || data === void 0 ? void 0 : data.recList;
|
@@ -699,6 +704,24 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
699
704
|
})) !== null && _a !== void 0 ? _a : [];
|
700
705
|
return nList;
|
701
706
|
}, []);
|
707
|
+
React.useEffect(() => {
|
708
|
+
let intervalId;
|
709
|
+
if (eventTimeList.length > 0) {
|
710
|
+
// 定期检查数组中的时间
|
711
|
+
const checkTimes = () => {
|
712
|
+
const now = new Date(); // 获取当前时间
|
713
|
+
const threshold = 15 * 1000; // 15秒的毫秒数
|
714
|
+
// 过滤掉超过15秒的时间
|
715
|
+
setEventTimeList((prevArray) => prevArray.filter((item) => now - item.time <= threshold));
|
716
|
+
};
|
717
|
+
// 每秒检查一次
|
718
|
+
intervalId = setInterval(checkTimes, 1000);
|
719
|
+
}
|
720
|
+
// 清理函数
|
721
|
+
return () => {
|
722
|
+
clearInterval(intervalId);
|
723
|
+
};
|
724
|
+
}, [eventTimeList]); // 依赖于 timeArray
|
702
725
|
React.useEffect(() => {
|
703
726
|
const handleChangeThemeTag = (tag) => {
|
704
727
|
themeTag.current = tag;
|
@@ -1126,7 +1149,11 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
1126
1149
|
popupCurTimeRef,
|
1127
1150
|
checkCommodityIndexRef,
|
1128
1151
|
isEditor,
|
1129
|
-
isNoMoreData
|
1152
|
+
isNoMoreData,
|
1153
|
+
updateChannel,
|
1154
|
+
channel,
|
1155
|
+
eventTimeList,
|
1156
|
+
setEventTimeList
|
1130
1157
|
} }, 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({
|
1131
1158
|
rtcList,
|
1132
1159
|
mutateLike: bffMutateLike,
|
@@ -1256,7 +1283,6 @@ const EditorContext = React.createContext({
|
|
1256
1283
|
});
|
1257
1284
|
const EditorCore = React.forwardRef(({ children, resolver, isSsr, schema, enableDataSource = true, utmVal }, ref) => {
|
1258
1285
|
const [currentNode, setCurrentNode] = React.useState(null);
|
1259
|
-
const [channel, setChannel] = React.useState();
|
1260
1286
|
const [_schema, setSchema] = React.useState(schema || {
|
1261
1287
|
pointData: [item],
|
1262
1288
|
dataSource: [],
|
@@ -1277,9 +1303,6 @@ const EditorCore = React.forwardRef(({ children, resolver, isSsr, schema, enable
|
|
1277
1303
|
const [undoStack, setUndoStack] = React.useState([[item]]);
|
1278
1304
|
const [redoStack, setRedoStack] = React.useState([]);
|
1279
1305
|
const [popup, setPopup] = React.useState(popupInit);
|
1280
|
-
const channelParams = React.useMemo(() => {
|
1281
|
-
return channel || utmVal;
|
1282
|
-
}, [channel, utmVal]);
|
1283
1306
|
typeof window !== 'undefined' &&
|
1284
1307
|
(window.sxpPopup = (type, aniType) => {
|
1285
1308
|
setPopup(Object.assign(Object.assign(Object.assign({}, popupInit), { id: type }), aniType));
|
@@ -1288,10 +1311,10 @@ const EditorCore = React.forwardRef(({ children, resolver, isSsr, schema, enable
|
|
1288
1311
|
(window.getJointUtmLink = (url) => {
|
1289
1312
|
setSlideSkipState();
|
1290
1313
|
if ((url === null || url === void 0 ? void 0 : url.indexOf('?')) !== -1) {
|
1291
|
-
return url + (
|
1314
|
+
return url + (utmVal ? '&' + utmVal : '');
|
1292
1315
|
}
|
1293
1316
|
else {
|
1294
|
-
return url + (
|
1317
|
+
return url + (utmVal ? '?' + utmVal : '');
|
1295
1318
|
}
|
1296
1319
|
});
|
1297
1320
|
// 切换页面类型,清空操作栈
|
@@ -1359,9 +1382,7 @@ const EditorCore = React.forwardRef(({ children, resolver, isSsr, schema, enable
|
|
1359
1382
|
setUndoStack,
|
1360
1383
|
getCurPageConf,
|
1361
1384
|
popup,
|
1362
|
-
setPopup
|
1363
|
-
channel,
|
1364
|
-
setChannel
|
1385
|
+
setPopup
|
1365
1386
|
} },
|
1366
1387
|
React.createElement(DataSourceProvider$1, { isSsr: isSsr, enable: enableDataSource }, children)));
|
1367
1388
|
});
|
@@ -1593,14 +1614,21 @@ var settingRender$d = [
|
|
1593
1614
|
* @Author: binruan@chatlabs.com
|
1594
1615
|
* @Date: 2024-03-12 10:59:06
|
1595
1616
|
* @LastEditors: binruan@chatlabs.com
|
1596
|
-
* @LastEditTime: 2024-
|
1617
|
+
* @LastEditTime: 2024-11-28 11:17:16
|
1597
1618
|
* @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
|
1598
1619
|
*
|
1599
1620
|
*/
|
1600
1621
|
function useEventReport() {
|
1601
|
-
const { bffEventReport, popupDetailData,
|
1602
|
-
const jumpToWeb = React.useCallback((data, product, cta, position, traceInfo) => {
|
1622
|
+
const { bffEventReport, popupDetailData, isFromHashtag, eventTimeList, setEventTimeList } = useSxpDataSource();
|
1623
|
+
const jumpToWeb = React.useCallback((e, data, product, cta, position, traceInfo) => {
|
1603
1624
|
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;
|
1625
|
+
const i = eventTimeList === null || eventTimeList === void 0 ? void 0 : eventTimeList.findIndex((item) => item.target === (e === null || e === void 0 ? void 0 : e.target));
|
1626
|
+
if (i !== -1) {
|
1627
|
+
return;
|
1628
|
+
}
|
1629
|
+
else if (e) {
|
1630
|
+
setEventTimeList === null || setEventTimeList === void 0 ? void 0 : setEventTimeList((prev) => [...prev, { target: e === null || e === void 0 ? void 0 : e.target, time: new Date() }]);
|
1631
|
+
}
|
1604
1632
|
let fromKName = '';
|
1605
1633
|
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))) {
|
1606
1634
|
fromKName = 'pdpPage';
|
@@ -1628,7 +1656,7 @@ function useEventReport() {
|
|
1628
1656
|
bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
|
1629
1657
|
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 }))
|
1630
1658
|
});
|
1631
|
-
}, [bffEventReport, popupDetailData, isFromHashtag]);
|
1659
|
+
}, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
|
1632
1660
|
const productView = React.useCallback((data, product, cta, viewTime, position) => {
|
1633
1661
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
1634
1662
|
let fromKName = '';
|
@@ -1734,7 +1762,7 @@ const AppointForm$1 = (_a) => {
|
|
1734
1762
|
const { name, value } = e.target;
|
1735
1763
|
setFormData(Object.assign(Object.assign({}, formData), { [name]: value }));
|
1736
1764
|
}, [formData]);
|
1737
|
-
const handleSubmit = lodash.debounce(() => __awaiter(void 0, void 0, void 0, function* () {
|
1765
|
+
const handleSubmit = lodash.debounce((e) => __awaiter(void 0, void 0, void 0, function* () {
|
1738
1766
|
var _d, _e, _f, _g, _h;
|
1739
1767
|
const vals = formData;
|
1740
1768
|
if (!vals)
|
@@ -1757,7 +1785,7 @@ const AppointForm$1 = (_a) => {
|
|
1757
1785
|
const product = (_f = data === null || data === void 0 ? void 0 : data.video) === null || _f === void 0 ? void 0 : _f.bindProduct;
|
1758
1786
|
const cta = (_h = (_g = data === null || data === void 0 ? void 0 : data.video) === null || _g === void 0 ? void 0 : _g.bindProduct) === null || _h === void 0 ? void 0 : _h.bindCta;
|
1759
1787
|
const position = popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.index;
|
1760
|
-
jumpToWeb(data, product, cta, position);
|
1788
|
+
jumpToWeb(e, data, product, cta, position);
|
1761
1789
|
}
|
1762
1790
|
if (!isPopup) {
|
1763
1791
|
onClose === null || onClose === void 0 ? void 0 : onClose();
|
@@ -10204,9 +10232,9 @@ const CommodityDetail$1 = (_a) => {
|
|
10204
10232
|
product = p;
|
10205
10233
|
cta = p === null || p === void 0 ? void 0 : p.bindCta;
|
10206
10234
|
}
|
10207
|
-
const handleLink = () => {
|
10235
|
+
const handleLink = (e) => {
|
10208
10236
|
if (product === null || product === void 0 ? void 0 : product.link) {
|
10209
|
-
jumpToWeb(data, product, cta, position);
|
10237
|
+
jumpToWeb(e, data, product, cta, position);
|
10210
10238
|
if (!isPost) {
|
10211
10239
|
productView(data, product, cta, viewTime || curTimeRef.current, position);
|
10212
10240
|
}
|
@@ -10666,14 +10694,14 @@ const Prompt$1 = (_a) => {
|
|
10666
10694
|
const { popupDetailData } = useSxpDataSource();
|
10667
10695
|
const { jumpToWeb } = useEventReport();
|
10668
10696
|
const iconSrc = typeof icon === 'string' ? icon : getMediaValueByMode(icon);
|
10669
|
-
const handleOk = () => {
|
10697
|
+
const handleOk = (e) => {
|
10670
10698
|
var _a, _b, _c;
|
10671
10699
|
if (isExternalLink) {
|
10672
10700
|
const data = popupDetailData;
|
10673
10701
|
const product = (_a = data === null || data === void 0 ? void 0 : data.video) === null || _a === void 0 ? void 0 : _a.bindProduct;
|
10674
10702
|
const cta = (_c = (_b = data === null || data === void 0 ? void 0 : data.video) === null || _b === void 0 ? void 0 : _b.bindProduct) === null || _c === void 0 ? void 0 : _c.bindCta;
|
10675
10703
|
const position = popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.index;
|
10676
|
-
jumpToWeb(data, product, cta, position);
|
10704
|
+
jumpToWeb(e, data, product, cta, position);
|
10677
10705
|
}
|
10678
10706
|
if (!isPopup) {
|
10679
10707
|
onClose === null || onClose === void 0 ? void 0 : onClose();
|
@@ -11115,9 +11143,9 @@ const CommodityDetailDiroNew$1 = (_a) => {
|
|
11115
11143
|
product = p;
|
11116
11144
|
cta = p === null || p === void 0 ? void 0 : p.bindCta;
|
11117
11145
|
}
|
11118
|
-
const handleLink = () => {
|
11146
|
+
const handleLink = (e) => {
|
11119
11147
|
if (product === null || product === void 0 ? void 0 : product.link) {
|
11120
|
-
jumpToWeb(data, product, cta, position);
|
11148
|
+
jumpToWeb(e, data, product, cta, position);
|
11121
11149
|
if (!isPost) {
|
11122
11150
|
productView(data, product, cta, viewTime || curTimeRef.current, position);
|
11123
11151
|
}
|
@@ -11798,7 +11826,7 @@ const CommodityList$1 = (_a) => {
|
|
11798
11826
|
style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price
|
11799
11827
|
});
|
11800
11828
|
}, [(_d = commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price) === null || _d === void 0 ? void 0 : _d.enableFormattedPrice, globalConfig]);
|
11801
|
-
const handleClick = lodash.throttle((item, multiCheckIndex) => {
|
11829
|
+
const handleClick = lodash.throttle((item, multiCheckIndex, e) => {
|
11802
11830
|
ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
|
11803
11831
|
eventSubject: 'clickCta',
|
11804
11832
|
eventDescription: 'User clicked the CTA'
|
@@ -11806,7 +11834,7 @@ const CommodityList$1 = (_a) => {
|
|
11806
11834
|
setPopupDetailData === null || setPopupDetailData === void 0 ? void 0 : setPopupDetailData(Object.assign(Object.assign({}, recData), { video: Object.assign(Object.assign({}, recData === null || recData === void 0 ? void 0 : recData.video), { bindProduct: item }), index, multiCheckIndex }));
|
11807
11835
|
if (isExternalLink) {
|
11808
11836
|
if (item === null || item === void 0 ? void 0 : item.link) {
|
11809
|
-
jumpToWeb(recData, item, item.bindCta, index);
|
11837
|
+
jumpToWeb(e, recData, item, item.bindCta, index);
|
11810
11838
|
window.location.href = window.getJointUtmLink(item.link);
|
11811
11839
|
}
|
11812
11840
|
}
|
@@ -11821,7 +11849,7 @@ const CommodityList$1 = (_a) => {
|
|
11821
11849
|
}, []);
|
11822
11850
|
return (React.createElement("ul", { role: 'list', className: css.css(Object.assign(Object.assign({}, style), { display: 'flex', flexDirection: 'column', gap: '10px', padding: '0 20px', marginTop: '50px', boxSizing: 'border-box' })) }, product === null || product === void 0 ? void 0 : product.map((item, index) => {
|
11823
11851
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
11824
|
-
return (React.createElement(React.Fragment, null, recData && !(item === null || item === void 0 ? void 0 : item.bindCta) ? null : (React.createElement("li", { role: 'listitem', key: index, onClick: () => handleClick(item, index) },
|
11852
|
+
return (React.createElement(React.Fragment, null, recData && !(item === null || item === void 0 ? void 0 : item.bindCta) ? null : (React.createElement("li", { role: 'listitem', key: index, onClick: (e) => handleClick(item, index, e) },
|
11825
11853
|
React.createElement("button", Object.assign({ role: 'button', "aria-label": item === null || item === void 0 ? void 0 : item.title, tabIndex: 0, className: css.css({
|
11826
11854
|
display: 'flex',
|
11827
11855
|
alignItems: 'normal',
|
@@ -12331,9 +12359,9 @@ const EventProvider = (_a) => {
|
|
12331
12359
|
const { setPopupDetailData, ctaEvent } = useSxpDataSource();
|
12332
12360
|
const { jumpToWeb } = useEventReport();
|
12333
12361
|
const [element, setElement] = React.useState(null);
|
12334
|
-
const handleClick = lodash.throttle((
|
12362
|
+
const handleClick = lodash.throttle((e) => {
|
12335
12363
|
var _a, _b, _c, _d, _e, _f;
|
12336
|
-
|
12364
|
+
e.preventDefault();
|
12337
12365
|
const item = multItem ? multItem : (_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProduct) !== null && _b !== void 0 ? _b : rec === null || rec === void 0 ? void 0 : rec.video;
|
12338
12366
|
ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
|
12339
12367
|
eventSubject: 'clickCta',
|
@@ -12347,7 +12375,7 @@ const EventProvider = (_a) => {
|
|
12347
12375
|
if (jumpLink || link) {
|
12348
12376
|
const cta = ((_e = rec === null || rec === void 0 ? void 0 : rec.video) === null || _e === void 0 ? void 0 : _e.bindCta) || (multItem === null || multItem === void 0 ? void 0 : multItem.bindCta);
|
12349
12377
|
const product = ((_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.bindProduct) || multItem;
|
12350
|
-
jumpToWeb(rec, product, cta, index);
|
12378
|
+
jumpToWeb(e, rec, product, cta, index);
|
12351
12379
|
window.location.href = window.getJointUtmLink(jumpLink || link || '');
|
12352
12380
|
}
|
12353
12381
|
}
|
@@ -12646,8 +12674,7 @@ var styles$7 = {"tow-line-ellipsis":"index-module_tow-line-ellipsis__nkBlU","one
|
|
12646
12674
|
const Link$1 = (_a) => {
|
12647
12675
|
var _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
12648
12676
|
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, index, customTitle, isActive } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "index", "customTitle", "isActive"]);
|
12649
|
-
const { sxpParameter
|
12650
|
-
useEventReport();
|
12677
|
+
const { sxpParameter } = useSxpDataSource();
|
12651
12678
|
const cta = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindCta;
|
12652
12679
|
(_c = recData === null || recData === void 0 ? void 0 : recData.video) === null || _c === void 0 ? void 0 : _c.bindProduct;
|
12653
12680
|
const src = (_e = (_d = cta === null || cta === void 0 ? void 0 : cta.icon) !== null && _d !== void 0 ? _d : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _e !== void 0 ? _e : bottom_image;
|
@@ -15081,12 +15108,12 @@ function WaterfallList$1(_a) {
|
|
15081
15108
|
(_a = scrollParent === null || scrollParent === void 0 ? void 0 : scrollParent.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('scroll', onScroll);
|
15082
15109
|
};
|
15083
15110
|
}, [onScroll, scrollParent]);
|
15084
|
-
const handleClickLink = () => {
|
15111
|
+
const handleClickLink = (e) => {
|
15085
15112
|
var _a, _b, _c, _d, _e;
|
15086
15113
|
if ((_a = data === null || data === void 0 ? void 0 : data.tag) === null || _a === void 0 ? void 0 : _a.link) {
|
15087
15114
|
reportTagsView();
|
15088
15115
|
const rec = waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.rec;
|
15089
|
-
jumpToWeb(rec, (_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.bindProduct, (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindCta, cacheActiveIndex, (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.traceInfo);
|
15116
|
+
jumpToWeb(e, rec, (_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.bindProduct, (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindCta, cacheActiveIndex, (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.traceInfo);
|
15090
15117
|
window.location.href = window.getJointUtmLink((_e = data === null || data === void 0 ? void 0 : data.tag) === null || _e === void 0 ? void 0 : _e.link);
|
15091
15118
|
}
|
15092
15119
|
};
|
@@ -15312,12 +15339,12 @@ function WaterfallList(_a) {
|
|
15312
15339
|
// container?.removeEventListener('scroll', handleScroll); // 在组件卸载时移除事件监听器
|
15313
15340
|
// };
|
15314
15341
|
// }, [isLoadingData, containerRef, loadMoreData]);
|
15315
|
-
const handleClickLink = () => {
|
15342
|
+
const handleClickLink = (e) => {
|
15316
15343
|
var _a, _b, _c, _d, _e;
|
15317
15344
|
if ((_a = data === null || data === void 0 ? void 0 : data.tag) === null || _a === void 0 ? void 0 : _a.link) {
|
15318
15345
|
reportTagsView();
|
15319
15346
|
const rec = waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.rec;
|
15320
|
-
jumpToWeb(rec, (_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.bindProduct, (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindCta, cacheActiveIndex, (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.traceInfo);
|
15347
|
+
jumpToWeb(e, rec, (_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.bindProduct, (_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindCta, cacheActiveIndex, (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.traceInfo);
|
15321
15348
|
window.location.href = window.getJointUtmLink((_e = data === null || data === void 0 ? void 0 : data.tag) === null || _e === void 0 ? void 0 : _e.link);
|
15322
15349
|
}
|
15323
15350
|
};
|
@@ -15757,7 +15784,7 @@ const AniLink$1 = (_a) => {
|
|
15757
15784
|
const isOnScreen = useOnScreen(ref);
|
15758
15785
|
const cta = ((_d = (_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProducts) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.bindCta) || ((_f = (_e = recData === null || recData === void 0 ? void 0 : recData.video) === null || _e === void 0 ? void 0 : _e.bindProduct) === null || _f === void 0 ? void 0 : _f.bindCta) || ((_g = recData === null || recData === void 0 ? void 0 : recData.video) === null || _g === void 0 ? void 0 : _g.bindCta);
|
15759
15786
|
const product = ((_j = (_h = recData === null || recData === void 0 ? void 0 : recData.video) === null || _h === void 0 ? void 0 : _h.bindProducts) === null || _j === void 0 ? void 0 : _j[0]) || ((_k = recData === null || recData === void 0 ? void 0 : recData.video) === null || _k === void 0 ? void 0 : _k.bindProduct);
|
15760
|
-
const handleTo = () => {
|
15787
|
+
const handleTo = (e) => {
|
15761
15788
|
var _a, _b, _c, _d;
|
15762
15789
|
const item = ((_b = (_a = recData === null || recData === void 0 ? void 0 : recData.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b[0]) || ((_c = recData === null || recData === void 0 ? void 0 : recData.video) === null || _c === void 0 ? void 0 : _c.bindProduct) || (recData === null || recData === void 0 ? void 0 : recData.video);
|
15763
15790
|
ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
|
@@ -15768,7 +15795,7 @@ const AniLink$1 = (_a) => {
|
|
15768
15795
|
if (isExternalLink) {
|
15769
15796
|
const link = (product === null || product === void 0 ? void 0 : product.link) || ((_d = item === null || item === void 0 ? void 0 : item.bindCta) === null || _d === void 0 ? void 0 : _d.link);
|
15770
15797
|
if (link) {
|
15771
|
-
jumpToWeb(recData, product, cta, index);
|
15798
|
+
jumpToWeb(e, recData, product, cta, index);
|
15772
15799
|
window.location.href = window.getJointUtmLink(link);
|
15773
15800
|
}
|
15774
15801
|
}
|
@@ -16204,7 +16231,7 @@ const AniLinkPopup$1 = (_a) => {
|
|
16204
16231
|
const [visible, setVisible] = React.useState(true);
|
16205
16232
|
const cta = ((_d = (_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProducts) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.bindCta) || ((_f = (_e = recData === null || recData === void 0 ? void 0 : recData.video) === null || _e === void 0 ? void 0 : _e.bindProduct) === null || _f === void 0 ? void 0 : _f.bindCta) || ((_g = recData === null || recData === void 0 ? void 0 : recData.video) === null || _g === void 0 ? void 0 : _g.bindCta);
|
16206
16233
|
const product = ((_j = (_h = recData === null || recData === void 0 ? void 0 : recData.video) === null || _h === void 0 ? void 0 : _h.bindProducts) === null || _j === void 0 ? void 0 : _j[0]) || ((_k = recData === null || recData === void 0 ? void 0 : recData.video) === null || _k === void 0 ? void 0 : _k.bindProduct);
|
16207
|
-
const handleTo = () => {
|
16234
|
+
const handleTo = (e) => {
|
16208
16235
|
var _a, _b, _c, _d;
|
16209
16236
|
const item = ((_b = (_a = recData === null || recData === void 0 ? void 0 : recData.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b[0]) || ((_c = recData === null || recData === void 0 ? void 0 : recData.video) === null || _c === void 0 ? void 0 : _c.bindProduct) || (recData === null || recData === void 0 ? void 0 : recData.video);
|
16210
16237
|
ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
|
@@ -16215,7 +16242,7 @@ const AniLinkPopup$1 = (_a) => {
|
|
16215
16242
|
if (isExternalLink) {
|
16216
16243
|
const link = (product === null || product === void 0 ? void 0 : product.link) || ((_d = item === null || item === void 0 ? void 0 : item.bindCta) === null || _d === void 0 ? void 0 : _d.link);
|
16217
16244
|
if (link) {
|
16218
|
-
jumpToWeb(recData, product, cta, index);
|
16245
|
+
jumpToWeb(e, recData, product, cta, index);
|
16219
16246
|
window.location.href = window.getJointUtmLink(link);
|
16220
16247
|
}
|
16221
16248
|
}
|
@@ -16819,8 +16846,7 @@ var settingRender = [
|
|
16819
16846
|
const MultiPosts$1 = (_a) => {
|
16820
16847
|
var _b, _c;
|
16821
16848
|
var { bgImgUrl, style, recData } = _a, props = __rest(_a, ["bgImgUrl", "style", "recData"]);
|
16822
|
-
const {
|
16823
|
-
const { bffEventReport, curTime } = useSxpDataSource();
|
16849
|
+
const { bffEventReport, curTime, updateChannel } = useSxpDataSource();
|
16824
16850
|
const { isActive } = useSwiperSlide() || {};
|
16825
16851
|
const initRef = React.useRef(false);
|
16826
16852
|
const viewTime = React.useRef();
|
@@ -16850,7 +16876,7 @@ const MultiPosts$1 = (_a) => {
|
|
16850
16876
|
});
|
16851
16877
|
if ((v === null || v === void 0 ? void 0 : v.linkType) === 'recommendFlow') {
|
16852
16878
|
endMultiPost('multipostClick');
|
16853
|
-
|
16879
|
+
updateChannel === null || updateChannel === void 0 ? void 0 : updateChannel(value);
|
16854
16880
|
curTime.current = new Date();
|
16855
16881
|
}
|
16856
16882
|
else {
|
@@ -17936,7 +17962,7 @@ var NavBack$1 = React.memo(NavBack);
|
|
17936
17962
|
* @Author: binruan@chatlabs.com
|
17937
17963
|
* @Date: 2024-03-20 10:27:31
|
17938
17964
|
* @LastEditors: binruan@chatlabs.com
|
17939
|
-
* @LastEditTime: 2024-11-27
|
17965
|
+
* @LastEditTime: 2024-11-27 17:08:59
|
17940
17966
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
17941
17967
|
*
|
17942
17968
|
*/
|
@@ -17944,7 +17970,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
17944
17970
|
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;
|
17945
17971
|
const mutedIcon = useIconLink('/pb_static/5beaaa5ce7f3477b99db3838619cc471.png');
|
17946
17972
|
const unmutedIcon = useIconLink('/pb_static/fea8668a8a894e4aa3a86bcc775e895e.png');
|
17947
|
-
const { schema
|
17973
|
+
const { schema } = useEditor();
|
17948
17974
|
const { openMultiPosts } = useEditorDataProvider();
|
17949
17975
|
const [activeIndex, setActiveIndex] = React.useState(0);
|
17950
17976
|
const viewImageStartTime = React.useRef(0);
|
@@ -17955,7 +17981,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
17955
17981
|
const [isReload, setIsReload] = React.useState(new Date().getTime());
|
17956
17982
|
const skipLinkRef = React.useRef(false);
|
17957
17983
|
const [pageNum, setPageNum] = React.useState(2);
|
17958
|
-
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 } = useSxpDataSource();
|
17984
|
+
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 } = useSxpDataSource();
|
17959
17985
|
const { backMainFeed, productView, jumpToWeb } = useEventReport();
|
17960
17986
|
const isShowFingerTip = React.useMemo(() => {
|
17961
17987
|
return data.length > 0 && !loading && (getFeUserState() || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enableSwiperTip));
|
@@ -18117,10 +18143,10 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
18117
18143
|
const isExternalLink = ((_d = (_c = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.logoBar) === null || _c === void 0 ? void 0 : _c.onClick) === null || _d === void 0 ? void 0 : _d.linkType) === 'externalLink';
|
18118
18144
|
const rec = visList[activeIndex];
|
18119
18145
|
return (React.createElement("div", Object.assign({ className: 'clc-sxp-logo-banner', style: { backgroundColor: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.color } }, (link && {
|
18120
|
-
onClick: () => {
|
18146
|
+
onClick: (e) => {
|
18121
18147
|
var _a, _b, _c, _d;
|
18122
18148
|
if (isExternalLink) {
|
18123
|
-
jumpToWeb(rec, (_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.bindCta, activeIndex, ((_c = rec === null || rec === void 0 ? void 0 : rec.product) === null || _c === void 0 ? void 0 : _c.traceInfo) || ((_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.traceInfo));
|
18149
|
+
jumpToWeb(e, rec, (_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.bindCta, activeIndex, ((_c = rec === null || rec === void 0 ? void 0 : rec.product) === null || _c === void 0 ? void 0 : _c.traceInfo) || ((_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.traceInfo));
|
18124
18150
|
}
|
18125
18151
|
new Function(link)();
|
18126
18152
|
}
|
@@ -18960,7 +18986,7 @@ const Popup = () => {
|
|
18960
18986
|
* @Author: binruan@chatlabs.com
|
18961
18987
|
* @Date: 2024-01-15 19:03:09
|
18962
18988
|
* @LastEditors: binruan@chatlabs.com
|
18963
|
-
* @LastEditTime: 2024-
|
18989
|
+
* @LastEditTime: 2024-11-27 16:58:32
|
18964
18990
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageCore\index.tsx
|
18965
18991
|
*
|
18966
18992
|
*/
|
@@ -18984,8 +19010,9 @@ const SxpPageCore = ({ data, maxSize = 10, defaultSize = 10, hashTagSize = 20, l
|
|
18984
19010
|
return searchParams;
|
18985
19011
|
}, []);
|
18986
19012
|
const [_schema, setSchema] = React.useState(data === null || data === void 0 ? void 0 : data.data);
|
18987
|
-
|
18988
|
-
|
19013
|
+
const [channel, setChannel] = React.useState();
|
19014
|
+
return (React.createElement(EditorCore, { resolver: RESOLVER, enableDataSource: false, schema: _schema, utmVal: channel || utmVal },
|
19015
|
+
React.createElement(SxpDataSourceProvider$1, { utmVal: utmVal, dataSources: data === null || data === void 0 ? void 0 : data.data_sources, sxpParameter: data === null || data === void 0 ? void 0 : data.sxp_parameter, maxSize: (_b = (_a = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _a === void 0 ? void 0 : _a.personalized_recommend) !== null && _b !== void 0 ? _b : maxSize, defaultSize: (_d = (_c = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _c === void 0 ? void 0 : _c.default_recommend) !== null && _d !== void 0 ? _d : defaultSize, hashTagSize: (_f = (_e = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _e === void 0 ? void 0 : _e.hash_tag_size) !== null && _f !== void 0 ? _f : hashTagSize, loadingImage: loadingImage, appDomain: appDomain, enabledMetaConversionApi: enabledMetaConversionApi, utmParameter: data === null || data === void 0 ? void 0 : data.utm_parameter, data: data, dataList: dataList, onUpdateSchema: (d) => setSchema(d), onUpdateChannel: (d) => setChannel(d), render: ({ rtcList, tagList, pageData }) => {
|
18989
19016
|
var _a;
|
18990
19017
|
return (React.createElement(React.Fragment, null,
|
18991
19018
|
React.createElement(SxpPageRender, Object.assign({}, (_a = pageData === null || pageData === void 0 ? void 0 : pageData.data) === null || _a === void 0 ? void 0 : _a.sxpPageConf, { tagList: tagList, data: rtcList, resolver: RESOLVER })),
|