pb-sxp-ui 1.20.68 → 1.20.70

package/dist/index.cjs

@@ -2277,16 +2277,19 @@ function useEventReport() {
         });
     }, [bffEventReport, popupDetailData, isFromHashtag, eventTimeList]);
     const productView = React.useCallback((data, product, cta, viewTime, position) => {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
         let fromKName = '';
         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))) {
             fromKName = 'pdpPage';
         }
+        else if (((_e = (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.bindProducts) === null || _e === void 0 ? void 0 : _e.length) || ((_f = data === null || data === void 0 ? void 0 : data.video) === null || _f === void 0 ? void 0 : _f.bindProduct)) {
+            fromKName = 'videoPage';
+        }
         else if (data === null || data === void 0 ? void 0 : data.product) {
             fromKName = 'productPage';
         }
         bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
-            eventInfo: Object.assign(Object.assign({ productId: product === null || product === void 0 ? void 0 : product.itemId, productName: product === null || product === void 0 ? void 0 : product.title, price: (product === null || product === void 0 ? void 0 : product.price) ? (product === null || product === void 0 ? void 0 : product.price) + '' : '0', productCollection: product === null || product === void 0 ? void 0 : product.collection, fromKName, fromKPage: location === null || location === void 0 ? void 0 : location.href, contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags), position: (position !== null && position !== void 0 ? position : 0) + '', contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId, 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 : '', ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId, traceInfo: (_s = (_q = (_l = (_h = product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _h !== void 0 ? _h : (_k = (_j = data === null || data === void 0 ? void 0 : data.video) === null || _j === void 0 ? void 0 : _j.bindProduct) === null || _k === void 0 ? void 0 : _k.traceInfo) !== null && _l !== void 0 ? _l : (_p = (_o = (_m = data === null || data === void 0 ? void 0 : data.video) === null || _m === void 0 ? void 0 : _m.bindProducts) === null || _o === void 0 ? void 0 : _o[0]) === null || _p === void 0 ? void 0 : _p.traceInfo) !== null && _q !== void 0 ? _q : (_r = data === null || data === void 0 ? void 0 : data.product) === null || _r === void 0 ? void 0 : _r.traceInfo) !== null && _s !== void 0 ? _s : '', timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '', eventSubject: 'productView', eventDescription: 'User browsed the product' }, ((product === null || product === void 0 ? void 0 : product.variantId) && { variantId: product.variantId })), ((product === null || product === void 0 ? void 0 : product.variantOption) && { variantOption: product.variantOption }))
+            eventInfo: Object.assign(Object.assign({ productId: product === null || product === void 0 ? void 0 : product.itemId, productName: product === null || product === void 0 ? void 0 : product.title, price: (product === null || product === void 0 ? void 0 : product.price) ? (product === null || product === void 0 ? void 0 : product.price) + '' : '0', productCollection: product === null || product === void 0 ? void 0 : product.collection, fromKName, fromKPage: location === null || location === void 0 ? void 0 : location.href, contentTags: JSON.stringify(product === null || product === void 0 ? void 0 : product.tags), position: (position !== null && position !== void 0 ? position : 0) + '', contentId: (_g = data === null || data === void 0 ? void 0 : data.video) === null || _g === void 0 ? void 0 : _g.itemId, sceneId: (_k = (_j = (_h = data === null || data === void 0 ? void 0 : data.video) === null || _h === void 0 ? void 0 : _h.scene) === null || _j === void 0 ? void 0 : _j.sceneId) !== null && _k !== void 0 ? _k : '', ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId, traceInfo: (_v = (_t = (_p = (_l = product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _l !== void 0 ? _l : (_o = (_m = data === null || data === void 0 ? void 0 : data.video) === null || _m === void 0 ? void 0 : _m.bindProduct) === null || _o === void 0 ? void 0 : _o.traceInfo) !== null && _p !== void 0 ? _p : (_s = (_r = (_q = data === null || data === void 0 ? void 0 : data.video) === null || _q === void 0 ? void 0 : _q.bindProducts) === null || _r === void 0 ? void 0 : _r[0]) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_u = data === null || data === void 0 ? void 0 : data.product) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : '', timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '', eventSubject: 'productView', eventDescription: 'User browsed the product' }, ((product === null || product === void 0 ? void 0 : product.variantId) && { variantId: product.variantId })), ((product === null || product === void 0 ? void 0 : product.variantOption) && { variantOption: product.variantOption }))
         });
     }, [bffEventReport, popupDetailData]);
     const backMainFeed = React.useCallback((lastFeed, selectTag, themeTag, hashTag) => {
@@ -11363,6 +11366,7 @@ const CommodityDetail$1 = (_a) => {
                     eventSubject: 'clickShopifyPopup',
                     eventDescription: 'User clicked to open Shopify popup'
                 }, data, product, position);
+                productView(data, product, cta, viewTime || curTimeRef.current, position);
                 console.log('[CommodityDetail] 打开加购弹窗:', addToCartPopupId);
                 // 打开加购弹窗
                 if (typeof window !== 'undefined' && window.sxpPopup) {
@@ -12754,7 +12758,7 @@ const CommodityDetailDiroNew$1 = (_a) => {
     var { style, rec, viewTime, isPost, bottom_image, tipText, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, iframeBgColor, isActive = true } = _a, props = __rest(_a, ["style", "rec", "viewTime", "isPost", "bottom_image", "tipText", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "iframeBgColor", "isActive"]);
     const { sxpParameter, popupCurTimeRef, popupDetailData, setPopupDetailData, isPreview, bffFbReport, checkCommodityIndexRef, globalConfig, ctaEvent } = useSxpDataSource();
     useEditor();
-    const { productView } = useEventReport();
+    const { productView, jumpToWeb } = useEventReport();
     const [showModal, setShowModal] = React.useState(false);
     const curTimeRef = React.useRef(null);
     const [show3DModal, setShow3DModal] = React.useState(false);
@@ -12777,20 +12781,20 @@ const CommodityDetailDiroNew$1 = (_a) => {
     }
     // 是否为 SKU 层绑定（variantId 和 variantOption 同时存在时）
     const isSkuLevel = !!(product === null || product === void 0 ? void 0 : product.variantId) && !!(product === null || product === void 0 ? void 0 : product.variantOption);
-    const handleOpenAddToCart = (variantId) => {
-        ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({ eventSubject: 'clickCta', eventDescription: 'User clicked the CTA' }, data, product, position);
-        bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
-            eventName: 'ClickCTA',
-            product: product ? [product] : undefined,
-            contentType: 'product',
-            data,
-            position,
-            cta_text: cta === null || cta === void 0 ? void 0 : cta.enTitle,
-            cta_action_type: 'open_internal_popup',
-            target_content_id: product === null || product === void 0 ? void 0 : product.itemId,
-            target_url: product === null || product === void 0 ? void 0 : product.link
-        });
-        if (!isPost) {
+    const handleOpenAddToCart = (variantId, isUserClick = false) => {
+        if (isUserClick) {
+            ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({ eventSubject: 'clickCta', eventDescription: 'User clicked the CTA' }, data, product, position);
+            bffFbReport === null || bffFbReport === void 0 ? void 0 : bffFbReport({
+                eventName: 'ClickCTA',
+                product: product ? [product] : undefined,
+                contentType: 'product',
+                data,
+                position,
+                cta_text: cta === null || cta === void 0 ? void 0 : cta.enTitle,
+                cta_action_type: 'open_internal_popup',
+                target_content_id: product === null || product === void 0 ? void 0 : product.itemId,
+                target_url: product === null || product === void 0 ? void 0 : product.link
+            });
             productView(data, product, cta, viewTime || curTimeRef.current, position);
         }
         ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({ eventSubject: 'clickShopifyPopup', eventDescription: 'User clicked to open Shopify popup' }, data, product, position);
@@ -12815,12 +12819,13 @@ const CommodityDetailDiroNew$1 = (_a) => {
             });
             productView(data, product, cta, viewTime || curTimeRef.current, position);
             if (product === null || product === void 0 ? void 0 : product.link) {
+                jumpToWeb(e, data, product, cta, position);
                 window.location.href = window.getJointUtmLink(product.link);
             }
             return;
         }
         // SKU 层绑定：直接传入 variantId 预选该 SKU
-        handleOpenAddToCart(isSkuLevel ? product === null || product === void 0 ? void 0 : product.variantId : undefined);
+        handleOpenAddToCart(isSkuLevel ? product === null || product === void 0 ? void 0 : product.variantId : undefined, true);
     };
     // popup 模式下，若为 SKU 层绑定，直接自动打开加购弹窗
     React.useEffect(() => {
@@ -20788,29 +20793,8 @@ const StructurePage = (_a) => {
         else if (viewPosition === 'footerSection') {
             fromKName = 'pdpPage';
         }
-        console.log('[handleProductViewLeave] 上报 productView 事件:', {
-            productId,
-            timeOnSite,
-            fromKName
-        });
         bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
-            eventInfo: {
-                eventSubject: 'productView',
-                eventDescription: 'User browsed the product',
-                productId: (productData === null || productData === void 0 ? void 0 : productData.itemId) || '',
-                productName: (productData === null || productData === void 0 ? void 0 : productData.title) || '',
-                price: (productData === null || productData === void 0 ? void 0 : productData.price) ? `${productData.price}` : '0',
-                productCollection: (productData === null || productData === void 0 ? void 0 : productData.collection) || '',
-                fromKName,
-                fromKPage: (location === null || location === void 0 ? void 0 : location.href) || '',
-                contentTags: (productData === null || productData === void 0 ? void 0 : productData.tags) ? JSON.stringify(productData.tags) : '[]',
-                position: `${sectionIndex || 0}`,
-                contentId: '',
-                sceneId: '',
-                ctatId: ((_a = productData === null || productData === void 0 ? void 0 : productData.bindCta) === null || _a === void 0 ? void 0 : _a.itemId) || '',
-                traceInfo: (productData === null || productData === void 0 ? void 0 : productData.traceInfo) || '',
-                timeOnSite: `${timeOnSite}`
-            }
+            eventInfo: Object.assign(Object.assign({ eventSubject: 'productView', eventDescription: 'User browsed the product', productId: (productData === null || productData === void 0 ? void 0 : productData.itemId) || '', productName: (productData === null || productData === void 0 ? void 0 : productData.title) || '', price: (productData === null || productData === void 0 ? void 0 : productData.price) ? `${productData.price}` : '0', productCollection: (productData === null || productData === void 0 ? void 0 : productData.collection) || '', fromKName, fromKPage: (location === null || location === void 0 ? void 0 : location.href) || '', contentTags: (productData === null || productData === void 0 ? void 0 : productData.tags) ? JSON.stringify(productData.tags) : '[]', position: `${sectionIndex || 0}`, contentId: '', sceneId: '', ctatId: ((_a = productData === null || productData === void 0 ? void 0 : productData.bindCta) === null || _a === void 0 ? void 0 : _a.itemId) || '', traceInfo: (productData === null || productData === void 0 ? void 0 : productData.traceInfo) || '', timeOnSite: `${timeOnSite}` }, ((productData === null || productData === void 0 ? void 0 : productData.variantId) && { variantId: productData.variantId })), ((productData === null || productData === void 0 ? void 0 : productData.variantOption) && { variantOption: productData.variantOption }))
         });
     }, [bffEventReport]);
     // 渲染 CTA 按钮或模版组件（带曝光事件上报）
@@ -21988,7 +21972,7 @@ const StructurePage = (_a) => {
                 // 注意：只上报，不从 visibleProducts 移除，也不删除 productViewStartTime
                 // 这样页面恢复可见时可以重新记录 startTime，后续滑走/再次最小化能正常上报
                 visibleProducts.current.forEach((product) => {
-                    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+                    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
                     const productId = `${(_a = product.productData) === null || _a === void 0 ? void 0 : _a.itemId}-${product.viewPosition}-${product.sectionIndex}`;
                     const startTime = productViewStartTime.current[productId];
                     if (!startTime)
@@ -22002,23 +21986,7 @@ const StructurePage = (_a) => {
                     else if (product.viewPosition === 'footerSection')
                         fromKName = 'pdpPage';
                     (_b = bffEventReportRef.current) === null || _b === void 0 ? void 0 : _b.call(bffEventReportRef, {
-                        eventInfo: {
-                            eventSubject: 'productView',
-                            eventDescription: 'User browsed the product',
-                            productId: ((_c = product.productData) === null || _c === void 0 ? void 0 : _c.itemId) || '',
-                            productName: ((_d = product.productData) === null || _d === void 0 ? void 0 : _d.title) || '',
-                            price: ((_e = product.productData) === null || _e === void 0 ? void 0 : _e.price) ? `${product.productData.price}` : '0',
-                            productCollection: ((_f = product.productData) === null || _f === void 0 ? void 0 : _f.collection) || '',
-                            fromKName,
-                            fromKPage: (location === null || location === void 0 ? void 0 : location.href) || '',
-                            contentTags: ((_g = product.productData) === null || _g === void 0 ? void 0 : _g.tags) ? JSON.stringify(product.productData.tags) : '[]',
-                            position: `${product.sectionIndex || 0}`,
-                            contentId: '',
-                            sceneId: '',
-                            ctatId: ((_j = (_h = product.productData) === null || _h === void 0 ? void 0 : _h.bindCta) === null || _j === void 0 ? void 0 : _j.itemId) || '',
-                            traceInfo: ((_k = product.productData) === null || _k === void 0 ? void 0 : _k.traceInfo) || '',
-                            timeOnSite: `${timeOnSite}`
-                        }
+                        eventInfo: Object.assign(Object.assign({ eventSubject: 'productView', eventDescription: 'User browsed the product', productId: ((_c = product.productData) === null || _c === void 0 ? void 0 : _c.itemId) || '', productName: ((_d = product.productData) === null || _d === void 0 ? void 0 : _d.title) || '', price: ((_e = product.productData) === null || _e === void 0 ? void 0 : _e.price) ? `${product.productData.price}` : '0', productCollection: ((_f = product.productData) === null || _f === void 0 ? void 0 : _f.collection) || '', fromKName, fromKPage: (location === null || location === void 0 ? void 0 : location.href) || '', contentTags: ((_g = product.productData) === null || _g === void 0 ? void 0 : _g.tags) ? JSON.stringify(product.productData.tags) : '[]', position: `${product.sectionIndex || 0}`, contentId: '', sceneId: '', ctatId: ((_j = (_h = product.productData) === null || _h === void 0 ? void 0 : _h.bindCta) === null || _j === void 0 ? void 0 : _j.itemId) || '', traceInfo: ((_k = product.productData) === null || _k === void 0 ? void 0 : _k.traceInfo) || '', timeOnSite: `${timeOnSite}` }, (((_l = product.productData) === null || _l === void 0 ? void 0 : _l.variantId) && { variantId: product.productData.variantId })), (((_m = product.productData) === null || _m === void 0 ? void 0 : _m.variantOption) && { variantOption: product.productData.variantOption }))
                     });
                 });
                 // 不清空 visibleProducts，保留快照供页面恢复时使用
@@ -23330,6 +23298,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
     const initTimeRef = React.useRef();
     const loadedTimeRef = React.useRef();
     const isFirstPlayRef = React.useRef(true);
+    const lastPlayReportTimeRef = React.useRef(0);
     const loopPlayRef = React.useRef(loopPlay);
     const scene = rec.video.scene;
     const videoUrl = (scene === null || scene === void 0 ? void 0 : scene.mediaUrl) || ((_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.url);
@@ -23408,6 +23377,9 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
             return;
         setIsPauseVideo(false);
         const item = data[index];
+        const now = Date.now();
+        if (now - lastPlayReportTimeRef.current < 500)
+            return;
         if (item && ((_c = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _c === void 0 ? void 0 : _c.duration)) {
             videoStartTime.current = ((_d = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _d === void 0 ? void 0 : _d.currentTime) || 0;
             const videoDuration = ((_f = (_e = videoRef === null || videoRef === void 0 ? void 0 : videoRef.current) === null || _e === void 0 ? void 0 : _e.duration) !== null && _f !== void 0 ? _f : 0).toFixed(2);
@@ -23416,6 +23388,7 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
             bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
                 eventInfo: Object.assign({ eventSubject: 'playVideo', eventDescription: 'User played the video', contentId: (_k = (_j = item === null || item === void 0 ? void 0 : item.video) === null || _j === void 0 ? void 0 : _j.itemId) !== null && _k !== void 0 ? _k : '', sceneId: (_o = (_m = (_l = item === null || item === void 0 ? void 0 : item.video) === null || _l === void 0 ? void 0 : _l.scene) === null || _m === void 0 ? void 0 : _m.sceneId) !== null && _o !== void 0 ? _o : '', contentName: (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.title) !== null && _q !== void 0 ? _q : '', playType, startTime: videoCurrentTime, videoDuration, contentTags: JSON.stringify((_s = (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.tags) !== null && _s !== void 0 ? _s : []), position: index + '', contentFormat: 'video', traceInfo: (_t = item === null || item === void 0 ? void 0 : item.video) === null || _t === void 0 ? void 0 : _t.traceInfo }, ((isFirstPlayRef === null || isFirstPlayRef === void 0 ? void 0 : isFirstPlayRef.current) && { loadTime: (loadedTimeRef === null || loadedTimeRef === void 0 ? void 0 : loadedTimeRef.current) - (initTimeRef === null || initTimeRef === void 0 ? void 0 : initTimeRef.current) + '' }))
             });
+            lastPlayReportTimeRef.current = Date.now();
             isFirstPlayRef.current = false;
         }
     }), [bffEventReport, data, index, isFirstPlayRef, videoRef === null || videoRef === void 0 ? void 0 : videoRef.current]);
@@ -23444,9 +23417,8 @@ const VideoWidget$4 = React.forwardRef(({ rec, index, height, data, muted, activ
         if (!videoRef.current)
             return;
         loadedTimeRef.current = new Date();
-        handleStartPlay();
         handLoadeddata();
-    }, [videoRef.current, handLoadeddata, handleStartPlay]);
+    }, [videoRef.current, handLoadeddata]);
     const handleClickVideo = React.useCallback((type) => () => {
         var _a, _b, _c, _d, _e;
         if (!videoRef.current)
@@ -24701,13 +24673,15 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight, containerWidt
         viewTime.current = new Date();
     };
     const handleReportProductView = (item, position) => {
-        var _a, _b, _c, _d;
+        var _a, _b, _c, _d, _e, _f, _g;
+        const pos = position !== null && position !== void 0 ? position : activeIndex;
         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) && (item === null || item === void 0 ? void 0 : item.product)) {
-            // Shopify 加购模式下，点击 Shop Now 打开购物车不上报 productView，只有跳外链才上报
-            const isEnableAddToCart = (_c = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.productPost) === null || _c === void 0 ? void 0 : _c.some((v) => { var _a, _b; return (_b = (_a = v === null || v === void 0 ? void 0 : v.item) === null || _a === void 0 ? void 0 : _a.props) === null || _b === void 0 ? void 0 : _b.enableAddToCart; });
-            if (isEnableAddToCart)
-                return;
-            productView(item, item.product, (_d = item === null || item === void 0 ? void 0 : item.product) === null || _d === void 0 ? void 0 : _d.bindCta, viewTime.current, position !== null && position !== void 0 ? position : activeIndex);
+            productView(item, item.product, (_c = item === null || item === void 0 ? void 0 : item.product) === null || _c === void 0 ? void 0 : _c.bindCta, viewTime.current, pos);
+        }
+        else if (!((_d = item === null || item === void 0 ? void 0 : item.video) === null || _d === void 0 ? void 0 : _d.url) && !((_e = item === null || item === void 0 ? void 0 : item.video) === null || _e === void 0 ? void 0 : _e.imgUrls) && ((_g = (_f = item === null || item === void 0 ? void 0 : item.video) === null || _f === void 0 ? void 0 : _f.bindProducts) === null || _g === void 0 ? void 0 : _g.length)) {
+            item.video.bindProducts.forEach((product) => {
+                productView(item, product, product === null || product === void 0 ? void 0 : product.bindCta, viewTime.current, pos);
+            });
         }
     };
     React.useEffect(() => {