pb-sxp-ui 1.2.5 → 1.2.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/dist/index.cjs +65 -37
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +9 -1
  4. package/dist/index.js +65 -37
  5. package/dist/index.js.map +1 -1
  6. package/dist/index.min.cjs +3 -3
  7. package/dist/index.min.cjs.map +1 -1
  8. package/dist/index.min.js +3 -3
  9. package/dist/index.min.js.map +1 -1
  10. package/dist/pb-ui.js +65 -37
  11. package/dist/pb-ui.js.map +1 -1
  12. package/dist/pb-ui.min.js +3 -3
  13. package/dist/pb-ui.min.js.map +1 -1
  14. package/es/core/components/SxpPageRender/Popup/index.js +7 -5
  15. package/es/core/components/SxpPageRender/index.js +2 -2
  16. package/es/core/context/SxpDataSourceProvider.js +3 -3
  17. package/es/core/hooks/useEventReport.js +4 -4
  18. package/es/materials/sxp/popup/CommodityDetail/index.d.ts +1 -0
  19. package/es/materials/sxp/popup/CommodityDetail/index.js +11 -6
  20. package/es/materials/sxp/popup/CommodityDetail/material.js +6 -0
  21. package/es/materials/sxp/popup/CommodityDetail/settingRender.js +4 -0
  22. package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +5 -2
  23. package/es/materials/sxp/popup/CommodityList/index.js +10 -10
  24. package/es/materials/sxp/template/components/CommodityGroup.js +11 -1
  25. package/lib/core/components/SxpPageRender/Popup/index.js +7 -5
  26. package/lib/core/components/SxpPageRender/index.js +2 -2
  27. package/lib/core/context/SxpDataSourceProvider.js +3 -3
  28. package/lib/core/hooks/useEventReport.js +4 -4
  29. package/lib/materials/sxp/popup/CommodityDetail/index.d.ts +1 -0
  30. package/lib/materials/sxp/popup/CommodityDetail/index.js +10 -5
  31. package/lib/materials/sxp/popup/CommodityDetail/material.js +6 -0
  32. package/lib/materials/sxp/popup/CommodityDetail/settingRender.js +4 -0
  33. package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +5 -2
  34. package/lib/materials/sxp/popup/CommodityList/index.js +10 -10
  35. package/lib/materials/sxp/template/components/CommodityGroup.js +11 -1
  36. package/package.json +1 -1
package/dist/pb-ui.js CHANGED
@@ -567,7 +567,7 @@
567
567
  const themeTag = React.useRef();
568
568
  const curTime = React.useRef();
569
569
  const [selectTag, setSelectTag] = React.useState(DEFAULT_TAG);
570
- const checkCommodityIndexRef = React.useRef();
570
+ const checkCommodityIndexRef = React.useRef(-1);
571
571
  const popupCurTimeRef = React.useRef(null);
572
572
  const isShowConsent = React.useMemo(() => {
573
573
  var _a, _b, _c, _d;
@@ -736,7 +736,7 @@
736
736
  }
737
737
  }), [bffFetch, utmVal, isShowTag]);
738
738
  const ctaEvent = React.useCallback((eventInfo, rec, product, position) => {
739
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
739
+ 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;
740
740
  const cta = product === null || product === void 0 ? void 0 : product.bindCta;
741
741
  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);
742
742
  let fromKName = '';
@@ -750,7 +750,7 @@
750
750
  fromKName = 'imagePage';
751
751
  }
752
752
  bffEventReport === null || bffEventReport === void 0 ? void 0 : bffEventReport({
753
- eventInfo: Object.assign(Object.assign({}, eventInfo), { ctaId: (_h = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _h !== void 0 ? _h : '', ctaName: (_j = cta === null || cta === void 0 ? void 0 : cta.title) !== null && _j !== void 0 ? _j : '', contentTags: JSON.stringify(cta === null || cta === void 0 ? void 0 : cta.tags), position: position + '', contentId: (_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.itemId) !== null && _l !== void 0 ? _l : '', productId: isProd ? product === null || product === void 0 ? void 0 : product.itemId : '', traceInfo: (_m = cta === null || cta === void 0 ? void 0 : cta.traceInfo) !== null && _m !== void 0 ? _m : '', fromKName, fromKPage: (_o = location === null || location === void 0 ? void 0 : location.href) !== null && _o !== void 0 ? _o : '' })
753
+ eventInfo: Object.assign(Object.assign({}, eventInfo), { ctaId: (_h = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _h !== void 0 ? _h : '', ctaName: (_j = cta === null || cta === void 0 ? void 0 : cta.title) !== null && _j !== void 0 ? _j : '', contentTags: JSON.stringify(cta === null || cta === void 0 ? void 0 : cta.tags), position: position + '', contentId: (_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.itemId) !== null && _l !== void 0 ? _l : '', productId: isProd ? product === null || product === void 0 ? void 0 : product.itemId : '', traceInfo: (_1 = (_y = (_t = (_p = (_o = (_m = rec === null || rec === void 0 ? void 0 : rec.video) === null || _m === void 0 ? void 0 : _m.bindCta) === null || _o === void 0 ? void 0 : _o.traceInfo) !== null && _p !== void 0 ? _p : (_s = (_r = (_q = rec === null || rec === void 0 ? void 0 : rec.video) === null || _q === void 0 ? void 0 : _q.bindProduct) === null || _r === void 0 ? void 0 : _r.bindCta) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_x = (_w = (_v = (_u = rec === null || rec === void 0 ? void 0 : rec.video) === null || _u === void 0 ? void 0 : _u.bindProducts) === null || _v === void 0 ? void 0 : _v[0]) === null || _w === void 0 ? void 0 : _w.bindCta) === null || _x === void 0 ? void 0 : _x.traceInfo) !== null && _y !== void 0 ? _y : (_0 = (_z = rec === null || rec === void 0 ? void 0 : rec.product) === null || _z === void 0 ? void 0 : _z.bindCta) === null || _0 === void 0 ? void 0 : _0.traceInfo) !== null && _1 !== void 0 ? _1 : '', fromKName, fromKPage: (_2 = location === null || location === void 0 ? void 0 : location.href) !== null && _2 !== void 0 ? _2 : '' })
754
754
  });
755
755
  }, [bffEventReport, isFromHashtag]);
756
756
  const h5EnterLink = React.useCallback(() => {
@@ -1282,14 +1282,14 @@
1282
1282
  * @Author: binruan@chatlabs.com
1283
1283
  * @Date: 2024-03-12 10:59:06
1284
1284
  * @LastEditors: binruan@chatlabs.com
1285
- * @LastEditTime: 2024-06-20 13:39:07
1285
+ * @LastEditTime: 2024-07-31 11:41:47
1286
1286
  * @FilePath: \pb-sxp-ui\src\core\hooks\useEventReport.ts
1287
1287
  *
1288
1288
  */
1289
1289
  function useEventReport() {
1290
1290
  const { bffEventReport, popupDetailData, waterFallData, isFromHashtag } = useSxpDataSource();
1291
1291
  const jumpToWeb = React.useCallback((data, product, cta, position) => {
1292
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
1292
+ 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;
1293
1293
  let fromKName = '';
1294
1294
  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))) {
1295
1295
  fromKName = 'pdpPage';
@@ -1320,12 +1320,12 @@
1320
1320
  position: position + '',
1321
1321
  contentId: (_m = (_l = data === null || data === void 0 ? void 0 : data.video) === null || _l === void 0 ? void 0 : _l.itemId) !== null && _m !== void 0 ? _m : '',
1322
1322
  ctatId: (_o = cta === null || cta === void 0 ? void 0 : cta.itemId) !== null && _o !== void 0 ? _o : '',
1323
- traceInfo: (_p = product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _p !== void 0 ? _p : ''
1323
+ traceInfo: (_0 = (_x = (_v = (_r = (_q = (_p = data === null || data === void 0 ? void 0 : data.video) === null || _p === void 0 ? void 0 : _p.bindProduct) === null || _q === void 0 ? void 0 : _q.traceInfo) !== null && _r !== void 0 ? _r : (_u = (_t = (_s = data === null || data === void 0 ? void 0 : data.video) === null || _s === void 0 ? void 0 : _s.bindProducts) === null || _t === void 0 ? void 0 : _t[0]) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : (_w = data === null || data === void 0 ? void 0 : data.product) === null || _w === void 0 ? void 0 : _w.traceInfo) !== null && _x !== void 0 ? _x : (_z = (_y = data === null || data === void 0 ? void 0 : data.video) === null || _y === void 0 ? void 0 : _y.bindCta) === null || _z === void 0 ? void 0 : _z.traceInfo) !== null && _0 !== void 0 ? _0 : ''
1324
1324
  }
1325
1325
  });
1326
1326
  }, [bffEventReport, popupDetailData, isFromHashtag]);
1327
1327
  const productView = React.useCallback((data, product, cta, viewTime, position) => {
1328
- var _a, _b, _c, _d;
1328
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
1329
1329
  let fromKName = '';
1330
1330
  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))) {
1331
1331
  fromKName = 'pdpPage';
@@ -1345,7 +1345,7 @@
1345
1345
  position: position + '',
1346
1346
  contentId: (_d = data === null || data === void 0 ? void 0 : data.video) === null || _d === void 0 ? void 0 : _d.itemId,
1347
1347
  ctatId: cta === null || cta === void 0 ? void 0 : cta.itemId,
1348
- traceInfo: product === null || product === void 0 ? void 0 : product.traceInfo,
1348
+ traceInfo: (_o = (_l = (_g = (_f = (_e = data === null || data === void 0 ? void 0 : data.video) === null || _e === void 0 ? void 0 : _e.bindProduct) === null || _f === void 0 ? void 0 : _f.traceInfo) !== null && _g !== void 0 ? _g : (_k = (_j = (_h = data === null || data === void 0 ? void 0 : data.video) === null || _h === void 0 ? void 0 : _h.bindProducts) === null || _j === void 0 ? void 0 : _j[0]) === null || _k === void 0 ? void 0 : _k.traceInfo) !== null && _l !== void 0 ? _l : (_m = data === null || data === void 0 ? void 0 : data.product) === null || _m === void 0 ? void 0 : _m.traceInfo) !== null && _o !== void 0 ? _o : '',
1349
1349
  timeOnSite: Math.floor((new Date() - viewTime) / 1000) + '',
1350
1350
  eventSubject: 'productView',
1351
1351
  eventDescription: 'User browsed the product'
@@ -1621,6 +1621,10 @@
1621
1621
  {
1622
1622
  label: '商品描述',
1623
1623
  value: 'info'
1624
+ },
1625
+ {
1626
+ label: '税费说明',
1627
+ value: 'taxInfo'
1624
1628
  }
1625
1629
  ],
1626
1630
  name: ['props', 'commodityStyles', 'field'],
@@ -8795,7 +8799,7 @@
8795
8799
  * @Author: binruan@chatlabs.com
8796
8800
  * @Date: 2024-03-20 10:27:31
8797
8801
  * @LastEditors: binruan@chatlabs.com
8798
- * @LastEditTime: 2024-06-20 18:56:52
8802
+ * @LastEditTime: 2024-07-31 17:54:50
8799
8803
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\FormatImage.tsx
8800
8804
  *
8801
8805
  */
@@ -8868,6 +8872,14 @@
8868
8872
 
8869
8873
  const CommodityGroup = ({ products, data, defImg, style, onCLick, popupDetailData, check }) => {
8870
8874
  var _a;
8875
+ const { productView } = useEventReport();
8876
+ const { popupCurTimeRef } = useSxpDataSource();
8877
+ const handleClick = (item, index) => {
8878
+ if (check === index)
8879
+ return;
8880
+ productView(popupDetailData, item, item === null || item === void 0 ? void 0 : item.bindCta, popupCurTimeRef.current, popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.index);
8881
+ onCLick === null || onCLick === void 0 ? void 0 : onCLick(index);
8882
+ };
8871
8883
  return (React.createElement(React.Fragment, null, (data === null || data === void 0 ? void 0 : data.open) && ((products && (products === null || products === void 0 ? void 0 : products.length) > 1) || !popupDetailData) && (React.createElement(Scroll$1, { enableSlideActive: true, isPadding: false, style: Object.assign(Object.assign({}, style), data === null || data === void 0 ? void 0 : data.style) }, (_a = (popupDetailData ? products : [0, 1, 2, 3])) === null || _a === void 0 ? void 0 : _a.map((item, index) => {
8872
8884
  var _a, _b, _c;
8873
8885
  return (React.createElement(React.Fragment, null, (item === null || item === void 0 ? void 0 : item.bindCta) ? (React.createElement(SwiperSlide, { className: css.css({
@@ -8875,7 +8887,7 @@
8875
8887
  height: '50px',
8876
8888
  marginRight: '10px'
8877
8889
  }), onClick: () => {
8878
- onCLick === null || onCLick === void 0 ? void 0 : onCLick(index);
8890
+ handleClick(item, index);
8879
8891
  }, key: index },
8880
8892
  React.createElement(FormatImage$1, { style: {
8881
8893
  height: '100%',
@@ -8893,8 +8905,7 @@
8893
8905
  const CommodityDetail$1 = (_a) => {
8894
8906
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
8895
8907
  var { content, style, bgImg, onClick, schema, isDefault, bottom_image, tipText, isPost, viewTime, rec, swiper, commodityStyles, buttonStyle, index, commodityGroup } = _a, props = __rest(_a, ["content", "style", "bgImg", "onClick", "schema", "isDefault", "bottom_image", "tipText", "isPost", "viewTime", "rec", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup"]);
8896
- const { sxpParameter, popupDetailData, isPreview, bffFbReport, popupCurTimeRef } = useSxpDataSource();
8897
- useEditor();
8908
+ const { sxpParameter, popupDetailData, isPreview, bffFbReport, popupCurTimeRef, checkCommodityIndexRef } = useSxpDataSource();
8898
8909
  const { jumpToWeb, productView } = useEventReport();
8899
8910
  const curTimeRef = React.useRef(null);
8900
8911
  const [showModal, setShowModal] = React.useState(false);
@@ -8907,6 +8918,7 @@
8907
8918
  : (_k = (_j = (_h = data === null || data === void 0 ? void 0 : data.video) === null || _h === void 0 ? void 0 : _h.bindProduct) === null || _j === void 0 ? void 0 : _j.bindCta) !== null && _k !== void 0 ? _k : (_o = (_m = (_l = data === null || data === void 0 ? void 0 : data.video) === null || _l === void 0 ? void 0 : _l.bindProducts) === null || _m === void 0 ? void 0 : _m[0]) === null || _o === void 0 ? void 0 : _o.bindCta;
8908
8919
  const position = isPost ? index : popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.index;
8909
8920
  if (!isPost && (commodityGroup === null || commodityGroup === void 0 ? void 0 : commodityGroup.open) && ((_p = data === null || data === void 0 ? void 0 : data.video) === null || _p === void 0 ? void 0 : _p.bindProducts) && ((_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.length) > 0) {
8921
+ checkCommodityIndexRef.current = checkCommodityIndex;
8910
8922
  const p = (_s = data === null || data === void 0 ? void 0 : data.video) === null || _s === void 0 ? void 0 : _s.bindProducts[checkCommodityIndex];
8911
8923
  product = p;
8912
8924
  cta = p === null || p === void 0 ? void 0 : p.bindCta;
@@ -8950,7 +8962,7 @@
8950
8962
  }, [product === null || product === void 0 ? void 0 : product.price, product === null || product === void 0 ? void 0 : product.currency]);
8951
8963
  const width = isPreview ? 375 : (_t = style === null || style === void 0 ? void 0 : style.width) !== null && _t !== void 0 ? _t : window.innerWidth;
8952
8964
  const renderContent = ({ isPost }) => {
8953
- var _a, _b, _c;
8965
+ var _a, _b, _c, _d;
8954
8966
  return (React.createElement("div", null,
8955
8967
  React.createElement("div", { className: 'pb-commondity-content-collection', style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection), hidden: !!product && (!(product === null || product === void 0 ? void 0 : product.collection) || (product === null || product === void 0 ? void 0 : product.collection) === ''), dangerouslySetInnerHTML: {
8956
8968
  __html: setFontForText((_a = product === null || product === void 0 ? void 0 : product.collection) !== null && _a !== void 0 ? _a : 'Tiffany Lock', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
@@ -8961,8 +8973,11 @@
8961
8973
  React.createElement("div", { className: 'pb-commondity-content-price', style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price), hidden: !!product && !(product === null || product === void 0 ? void 0 : product.price), dangerouslySetInnerHTML: {
8962
8974
  __html: setFontForText(priceText, commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
8963
8975
  } }),
8976
+ React.createElement("div", { hidden: !!product && !(product === null || product === void 0 ? void 0 : product.taxInfo), style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.taxInfo), dangerouslySetInnerHTML: {
8977
+ __html: setFontForText((_c = product === null || product === void 0 ? void 0 : product.taxInfo) !== null && _c !== void 0 ? _c : '税费', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.taxInfo)
8978
+ } }),
8964
8979
  React.createElement("div", { hidden: !!product && (!(product === null || product === void 0 ? void 0 : product.info) || (product === null || product === void 0 ? void 0 : product.info) === '') },
8965
- React.createElement(ExpandableText$1, { foldText: tipText === null || tipText === void 0 ? void 0 : tipText.foldText, unfoldText: tipText === null || tipText === void 0 ? void 0 : tipText.unfoldText, onClick: () => setShowModal(true), isPost: isPost, text: (_c = product === null || product === void 0 ? void 0 : product.info) !== null && _c !== void 0 ? _c : `The design inspiration of Tiffany Lock series comes from the power of connection and inclusiveness, and the
8980
+ React.createElement(ExpandableText$1, { foldText: tipText === null || tipText === void 0 ? void 0 : tipText.foldText, unfoldText: tipText === null || tipText === void 0 ? void 0 : tipText.unfoldText, onClick: () => setShowModal(true), isPost: isPost, text: (_d = product === null || product === void 0 ? void 0 : product.info) !== null && _d !== void 0 ? _d : `The design inspiration of Tiffany Lock series comes from the power of connection and inclusiveness, and the
8966
8981
  bold and avant-garde visual design interprets the emotional bond connecting my heart. The Tiffany Lock
8967
8982
  collection is unisex and is inspired by the padlock pattern found in the Tiffany Antique Collection. This
8968
8983
  necklace features a stylish and eye-catching oval clasp chain decorated with a lock pattern. Crafted from
@@ -8984,6 +8999,7 @@
8984
8999
  const handleClick = React.useCallback((index) => {
8985
9000
  popupCurTimeRef.current = new Date();
8986
9001
  setCheckCommodityIndex(index);
9002
+ checkCommodityIndexRef.current = index;
8987
9003
  }, []);
8988
9004
  const renderCommodityGroup = React.useCallback(() => {
8989
9005
  var _a, _b, _c;
@@ -9004,6 +9020,7 @@
9004
9020
  delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
9005
9021
  } },
9006
9022
  React.createElement(React.Fragment, null, (_v = product === null || product === void 0 ? void 0 : product.homePage) === null || _v === void 0 ? void 0 : _v.map((src) => {
9023
+ var _a;
9007
9024
  return (React.createElement(SwiperSlide, { key: src },
9008
9025
  React.createElement("div", { style: {
9009
9026
  overflow: 'hidden',
@@ -9016,7 +9033,7 @@
9016
9033
  objectFit: 'cover',
9017
9034
  display: 'block',
9018
9035
  objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
9019
- }, src: src }))));
9036
+ }, src: (_a = src !== null && src !== void 0 ? src : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _a !== void 0 ? _a : bottom_image }))));
9020
9037
  }))))),
9021
9038
  !((_w = product === null || product === void 0 ? void 0 : product.homePage) === null || _w === void 0 ? void 0 : _w.length) && (React.createElement("div", { className: css.css({
9022
9039
  position: 'relative',
@@ -9080,7 +9097,7 @@
9080
9097
  * @Author: binruan@chatlabs.com
9081
9098
  * @Date: 2023-07-28 18:29:57
9082
9099
  * @LastEditors: binruan@chatlabs.com
9083
- * @LastEditTime: 2024-07-12 17:40:06
9100
+ * @LastEditTime: 2024-07-31 13:58:45
9084
9101
  * @FilePath: \pb-sxp-ui\src\materials\sxp\popup\CommodityDetail\material.tsx
9085
9102
  *
9086
9103
  */
@@ -9118,6 +9135,12 @@
9118
9135
  info: {
9119
9136
  color: 'gray',
9120
9137
  fontSize: 12
9138
+ },
9139
+ taxInfo: {
9140
+ color: '#000',
9141
+ fontSize: 13,
9142
+ textAlign: 'left',
9143
+ marginBottom: '10px'
9121
9144
  }
9122
9145
  },
9123
9146
  buttonStyle: {
@@ -9603,7 +9626,7 @@
9603
9626
  var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1;
9604
9627
  var { style, isDefault, rec, viewTime, isPost, bottom_image, tipText, swiper, commodityStyles, buttonStyle, index, commodityGroup } = _a, props = __rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "tipText", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup"]);
9605
9628
  React.useState(true);
9606
- const { sxpParameter, popupCurTimeRef, popupDetailData, isPreview, bffFbReport } = useSxpDataSource();
9629
+ const { sxpParameter, popupCurTimeRef, popupDetailData, isPreview, bffFbReport, checkCommodityIndexRef } = useSxpDataSource();
9607
9630
  const { jumpToWeb, productView } = useEventReport();
9608
9631
  React.useState(false);
9609
9632
  React.useState(false);
@@ -9618,6 +9641,7 @@
9618
9641
  : (_k = (_j = (_h = data === null || data === void 0 ? void 0 : data.video) === null || _h === void 0 ? void 0 : _h.bindProduct) === null || _j === void 0 ? void 0 : _j.bindCta) !== null && _k !== void 0 ? _k : (_o = (_m = (_l = data === null || data === void 0 ? void 0 : data.video) === null || _l === void 0 ? void 0 : _l.bindProducts) === null || _m === void 0 ? void 0 : _m[0]) === null || _o === void 0 ? void 0 : _o.bindCta;
9619
9642
  const position = isPost ? index : popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.index;
9620
9643
  if (!isPost && (commodityGroup === null || commodityGroup === void 0 ? void 0 : commodityGroup.open) && ((_p = data === null || data === void 0 ? void 0 : data.video) === null || _p === void 0 ? void 0 : _p.bindProducts) && ((_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.length) > 0) {
9644
+ checkCommodityIndexRef.current = checkCommodityIndex;
9621
9645
  const p = (_s = data === null || data === void 0 ? void 0 : data.video) === null || _s === void 0 ? void 0 : _s.bindProducts[checkCommodityIndex];
9622
9646
  product = p;
9623
9647
  cta = p === null || p === void 0 ? void 0 : p.bindCta;
@@ -9725,6 +9749,7 @@ Made in Italy` })));
9725
9749
  const handleClick = React.useCallback((index) => {
9726
9750
  popupCurTimeRef.current = new Date();
9727
9751
  setCheckCommodityIndex(index);
9752
+ checkCommodityIndexRef.current = index;
9728
9753
  }, []);
9729
9754
  const renderCommodityGroup = React.useCallback(() => {
9730
9755
  var _a, _b, _c;
@@ -9743,6 +9768,7 @@ Made in Italy` })));
9743
9768
  }, loop: true, autoplay: {
9744
9769
  delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
9745
9770
  } }, (_v = product === null || product === void 0 ? void 0 : product.homePage) === null || _v === void 0 ? void 0 : _v.map((src) => {
9771
+ var _a;
9746
9772
  return (React.createElement(SwiperSlide, { key: src },
9747
9773
  React.createElement("div", { style: {
9748
9774
  overflow: 'hidden',
@@ -9755,7 +9781,7 @@ Made in Italy` })));
9755
9781
  objectFit: 'cover',
9756
9782
  display: 'block',
9757
9783
  objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
9758
- }, src: src }))));
9784
+ }, src: (_a = src !== null && src !== void 0 ? src : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _a !== void 0 ? _a : bottom_image }))));
9759
9785
  }))),
9760
9786
  !((_w = product === null || product === void 0 ? void 0 : product.homePage) === null || _w === void 0 ? void 0 : _w.length) && (React.createElement("div", { className: css.css({
9761
9787
  position: 'relative',
@@ -10205,25 +10231,24 @@ Made in Italy` })));
10205
10231
  onClick === null || onClick === void 0 ? void 0 : onClick();
10206
10232
  }
10207
10233
  }, popup === null || popup === void 0 ? void 0 : popup.duration);
10208
- return (React.createElement("div", { className: css.css(Object.assign(Object.assign({}, style), { display: 'flex', flexDirection: 'column', gap: '10px', padding: '0 20px', marginTop: '50px' })) }, product === null || product === void 0 ? void 0 : product.map((item, index) => {
10209
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
10234
+ return (React.createElement("div", { 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) => {
10235
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
10210
10236
  return (React.createElement(React.Fragment, null, recData && !(item === null || item === void 0 ? void 0 : item.bindCta) ? null : (React.createElement("div", Object.assign({ key: index }, props, { className: css.css({
10211
10237
  display: 'flex'
10212
10238
  }), onClick: () => handleClick(item, index) }),
10213
10239
  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 }),
10214
10240
  React.createElement("div", { style: {
10215
- flex: 1,
10216
- 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.marginRight) !== null && _f !== void 0 ? _f : 0}px - ${(_g = style === null || style === void 0 ? void 0 : style.padding) !== null && _g !== void 0 ? _g : 0}px)`,
10241
+ 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.marginRight) !== null && _f !== void 0 ? _f : 0}px)`,
10217
10242
  display: 'flex',
10218
10243
  flexDirection: 'column',
10219
10244
  justifyContent: 'space-between'
10220
10245
  } },
10221
10246
  React.createElement("div", null,
10222
10247
  React.createElement("div", { className: 'one-line-ellipsis', style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title, hidden: !!item && !(item === null || item === void 0 ? void 0 : item.title), dangerouslySetInnerHTML: {
10223
- __html: setFontForText((_h = item === null || item === void 0 ? void 0 : item.title) !== null && _h !== void 0 ? _h : 'Pendant in Yellow Gold with Diamonds, Medium', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title)
10248
+ __html: setFontForText((_g = item === null || item === void 0 ? void 0 : item.title) !== null && _g !== void 0 ? _g : 'Pendant in Yellow Gold with Diamonds, Medium', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title)
10224
10249
  } }),
10225
10250
  React.createElement("div", { className: 'two-line-ellipsis', style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection, hidden: !!item && (!(item === null || item === void 0 ? void 0 : item.collection) || (item === null || item === void 0 ? void 0 : item.collection) === ''), dangerouslySetInnerHTML: {
10226
- __html: setFontForText((_j = item === null || item === void 0 ? void 0 : item.collection) !== null && _j !== void 0 ? _j : 'Tiffany Lock', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
10251
+ __html: setFontForText((_h = item === null || item === void 0 ? void 0 : item.collection) !== null && _h !== void 0 ? _h : 'Tiffany Lock', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
10227
10252
  } })),
10228
10253
  React.createElement("div", { className: css.css({
10229
10254
  display: 'flex',
@@ -10232,11 +10257,12 @@ Made in Italy` })));
10232
10257
  width: '100%',
10233
10258
  overflow: 'hidden'
10234
10259
  }) },
10235
- React.createElement("div", { style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price, hidden: !!item && !(item === null || item === void 0 ? void 0 : item.price), dangerouslySetInnerHTML: {
10236
- __html: setFontForText(priceText(item), commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
10237
- } }),
10260
+ React.createElement("div", null,
10261
+ React.createElement("div", { style: commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price, hidden: !!item && !(item === null || item === void 0 ? void 0 : item.price), dangerouslySetInnerHTML: {
10262
+ __html: setFontForText(priceText(item), commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
10263
+ } })),
10238
10264
  React.createElement("div", { className: 'one-line-ellipsis', style: Object.assign(Object.assign({}, buttonStyle), { padding: '0 15px' }), dangerouslySetInnerHTML: {
10239
- __html: setFontForText((_l = (_k = item === null || item === void 0 ? void 0 : item.bindCta) === null || _k === void 0 ? void 0 : _k.enTitle) !== null && _l !== void 0 ? _l : 'Shop Now', buttonStyle)
10265
+ __html: setFontForText((_k = (_j = item === null || item === void 0 ? void 0 : item.bindCta) === null || _j === void 0 ? void 0 : _j.enTitle) !== null && _k !== void 0 ? _k : 'Shop Now', buttonStyle)
10240
10266
  } })))))));
10241
10267
  })));
10242
10268
  };
@@ -15495,7 +15521,7 @@ Made in Italy` })));
15495
15521
  * @Author: binruan@chatlabs.com
15496
15522
  * @Date: 2024-01-15 19:03:09
15497
15523
  * @LastEditors: binruan@chatlabs.com
15498
- * @LastEditTime: 2024-07-29 10:02:52
15524
+ * @LastEditTime: 2024-07-31 11:33:42
15499
15525
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
15500
15526
  *
15501
15527
  */
@@ -15767,7 +15793,7 @@ Made in Italy` })));
15767
15793
  }
15768
15794
  };
15769
15795
  const handleSlideSkip = (item, position) => {
15770
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
15796
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
15771
15797
  if (isPreview || waterFallData)
15772
15798
  return;
15773
15799
  const t = new Date() - curTime.current;
@@ -15786,7 +15812,7 @@ Made in Italy` })));
15786
15812
  contentTags: (product === null || product === void 0 ? void 0 : product.tags) ? JSON.stringify(product === null || product === void 0 ? void 0 : product.tags) : '',
15787
15813
  position: position + '',
15788
15814
  contentId: (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.itemId) !== null && _q !== void 0 ? _q : '',
15789
- traceInfo: (_r = product === null || product === void 0 ? void 0 : product.traceInfo) !== null && _r !== void 0 ? _r : ''
15815
+ traceInfo: (_s = (_r = item === null || item === void 0 ? void 0 : item.video) === null || _r === void 0 ? void 0 : _r.traceInfo) !== null && _s !== void 0 ? _s : ''
15790
15816
  }
15791
15817
  });
15792
15818
  setSlideSkipState();
@@ -16317,7 +16343,7 @@ Made in Italy` })));
16317
16343
  * @Author: binruan@chatlabs.com
16318
16344
  * @Date: 2023-10-31 10:56:01
16319
16345
  * @LastEditors: binruan@chatlabs.com
16320
- * @LastEditTime: 2024-07-29 18:06:11
16346
+ * @LastEditTime: 2024-07-31 18:54:49
16321
16347
  * @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\Popup\index.tsx
16322
16348
  *
16323
16349
  */
@@ -16343,7 +16369,7 @@ Made in Italy` })));
16343
16369
  }
16344
16370
  }, [popup]);
16345
16371
  const handleClose = () => {
16346
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
16372
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
16347
16373
  if (!popup ||
16348
16374
  (popup === null || popup === void 0 ? void 0 : popup.id) === '' ||
16349
16375
  !visible ||
@@ -16357,9 +16383,11 @@ Made in Italy` })));
16357
16383
  let product = (_g = data === null || data === void 0 ? void 0 : data.video) === null || _g === void 0 ? void 0 : _g.bindProduct;
16358
16384
  let cta = (_j = (_h = data === null || data === void 0 ? void 0 : data.video) === null || _h === void 0 ? void 0 : _h.bindProduct) === null || _j === void 0 ? void 0 : _j.bindCta;
16359
16385
  if ((checkCommodityIndexRef === null || checkCommodityIndexRef === void 0 ? void 0 : checkCommodityIndexRef.current) >= 0) {
16360
- const p = (_k = data === null || data === void 0 ? void 0 : data.video) === null || _k === void 0 ? void 0 : _k.bindProducts[checkCommodityIndexRef === null || checkCommodityIndexRef === void 0 ? void 0 : checkCommodityIndexRef.current];
16361
- product = p;
16362
- cta = p === null || p === void 0 ? void 0 : p.bindCta;
16386
+ const p = (_l = (_k = data === null || data === void 0 ? void 0 : data.video) === null || _k === void 0 ? void 0 : _k.bindProducts) === null || _l === void 0 ? void 0 : _l[checkCommodityIndexRef === null || checkCommodityIndexRef === void 0 ? void 0 : checkCommodityIndexRef.current];
16387
+ if (p) {
16388
+ product = p;
16389
+ cta = p === null || p === void 0 ? void 0 : p.bindCta;
16390
+ }
16363
16391
  }
16364
16392
  if (product && cta) {
16365
16393
  productView(data, product, cta, popupCurTimeRef.current, popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.index);
@@ -16381,7 +16409,7 @@ Made in Italy` })));
16381
16409
  const isExternalLink = ((_d = (_c = (_b = value === null || value === void 0 ? void 0 : value.item) === null || _b === void 0 ? void 0 : _b.event) === null || _c === void 0 ? void 0 : _c.onClick) === null || _d === void 0 ? void 0 : _d.linkType) === 'externalLink';
16382
16410
  const isPopup = ((_g = (_f = (_e = value === null || value === void 0 ? void 0 : value.item) === null || _e === void 0 ? void 0 : _e.event) === null || _f === void 0 ? void 0 : _f.onClick) === null || _g === void 0 ? void 0 : _g.linkType) === 'popup';
16383
16411
  const defaulSetting = (_h = t === null || t === void 0 ? void 0 : t.extend) === null || _h === void 0 ? void 0 : _h.defaulSetting;
16384
- return (React.createElement(Component, Object.assign({ key: index, style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), (_j = value === null || value === void 0 ? void 0 : value.item) === null || _j === void 0 ? void 0 : _j.style), { width: (_k = window.innerWidth) !== null && _k !== void 0 ? _k : '100vw', height: '100%' }), textStyle: Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.textStyle), (_l = value === null || value === void 0 ? void 0 : value.item) === null || _l === void 0 ? void 0 : _l.textStyle), bindDatas: (_o = (_m = value === null || value === void 0 ? void 0 : value.item) === null || _m === void 0 ? void 0 : _m.bindDatas) !== null && _o !== void 0 ? _o : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_p = value === null || value === void 0 ? void 0 : value.item) === null || _p === void 0 ? void 0 : _p.props, { event: ((_q = value === null || value === void 0 ? void 0 : value.item) === null || _q === void 0 ? void 0 : _q.event) || {}, schema: schema, id: value === null || value === void 0 ? void 0 : value.id, isExternalLink: isExternalLink, isPopup: isPopup, onClose: handleClose })));
16412
+ return (React.createElement(Component, Object.assign({ key: index, style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), (_j = value === null || value === void 0 ? void 0 : value.item) === null || _j === void 0 ? void 0 : _j.style), { width: (_k = window.innerWidth) !== null && _k !== void 0 ? _k : '100vw', height: '100%' }), textStyle: Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.textStyle), (_l = value === null || value === void 0 ? void 0 : value.item) === null || _l === void 0 ? void 0 : _l.textStyle), bindDatas: (_o = (_m = value === null || value === void 0 ? void 0 : value.item) === null || _m === void 0 ? void 0 : _m.bindDatas) !== null && _o !== void 0 ? _o : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_p = value === null || value === void 0 ? void 0 : value.item) === null || _p === void 0 ? void 0 : _p.props, { event: ((_q = value === null || value === void 0 ? void 0 : value.item) === null || _q === void 0 ? void 0 : _q.event) || {}, schema: schema, id: value === null || value === void 0 ? void 0 : value.id, isExternalLink: isExternalLink, isPopup: isPopup, onClose: handleClose, index: index })));
16385
16413
  }
16386
16414
  else {
16387
16415
  return React.createElement(React.Fragment, null);