pb-sxp-ui 1.3.2 → 1.3.4

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.
@@ -4,7 +4,7 @@ import * as ReactDOM from 'react-dom';
4
4
  import { useEditor, useSxpDataSource } from '../../../../core/hooks';
5
5
  const closeIcon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAjhJREFUWEfFlztOw0AQhmeWiJ4CCmpQ5DiRQsIJyAWg5A0lR0AIChDiCJS8ER0cADgBeRSxt4CCDgkaKiq8i+zYeWx2413HEWmiJJv9v535Z2aN8M8vFPT9z3zETD0aAUChUJjwvPFHAJhBhB3Hqd6OAsK2yyucwykAvP38eJX398Z3AJDLlVYR8ToU9Rhj25TWr9KEsKy5dULIGQCMtfZly45TvwsAstm56UwG6wA4FUFwzrdctxZBDcWSy5XWEPG8I84/GcMipdWPtgcsaz5PCHtKG0IuTiqUvjT9U/WYMG2IOPE+AP+LtCB0xKUAAyA2Xbd2o2OG0NQXvTnvhL17D7EPtH9TRCIWwkRcGYGIQgYBABuqPuHXOQBc6pw80lBGwBQiiXhsBHQhkoprA6iM6acjhDQKu5YJZW6XeOI3XJdpvfsdTu52VfXEekD8owQiXGIubpSCbhDbLu8DwKEAd+A41SOdPpE4BS0viFOtvV2iKWqUgn5x/tmS70xR01GuDSCKc86/OCcLgTyyZ0ScDGNhFAktAJV4NFJ9YyaFiAWIE+9uVkkgBgLoig8DMWAa9ro9ynkUdlW5maZDCmB6clmz0k1HH4Cs1Ezbq2p2yEpUuBOKTSZZex00RUWIrltxuuK6EOGDSbGIOPZicpMx6fny650377qNRgBgWeVFQuA+6UjVgREhGIMlSqsPUQqIbZdOOIdZQmCv2axRnU1N1+TzJYsxOEaEV8ep7frPZ7Gd0FTEdP0ft0/kMNdg0eoAAAAASUVORK5CYII=';
6
6
  const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema, fullHeight = window.innerHeight, isFullScreen = false }) => {
7
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
7
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
8
8
  const touchRef = useRef(null);
9
9
  const fTouchRef = useRef(null);
10
10
  const touchMoveRef = useRef(null);
@@ -126,8 +126,7 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
126
126
  React.createElement("div", { onClick: onClose, className: 'modal-icon-wrapper' },
127
127
  React.createElement("img", { src: (_t = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) !== null && _t !== void 0 ? _t : closeIcon, alt: 'close', className: 'modal-icon' })),
128
128
  React.createElement("div", { ref: ref, style: {
129
- height: (_x = (isScrollFullScreen ? fullHeight : MODAL_DEF_CON_H) -
130
- ((_w = (_v = (_u = getPopupById === null || getPopupById === void 0 ? void 0 : getPopupById.item) === null || _u === void 0 ? void 0 : _u.props) === null || _v === void 0 ? void 0 : _v.popupBg) === null || _w === void 0 ? void 0 : _w.bottomMargin)) !== null && _x !== void 0 ? _x : 0,
129
+ height: isScrollFullScreen ? fullHeight : MODAL_DEF_CON_H,
131
130
  overflow: (isScrollFullScreen && modalTrans <= 0) || !isScrollFullScreen ? 'auto' : 'hidden'
132
131
  } }, children)))))), modalEleRef.current);
133
132
  };
@@ -354,7 +354,6 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
354
354
  };
355
355
  const handleScrollEvent = (swiper) => {
356
356
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
357
- viewTime.current = new Date();
358
357
  const item = data[swiper.previousIndex];
359
358
  if (!item)
360
359
  return;
@@ -392,6 +391,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
392
391
  eventName: 'ProductView'
393
392
  });
394
393
  }
394
+ viewTime.current = new Date();
395
395
  };
396
396
  const handleReportProductView = (item) => {
397
397
  var _a, _b, _c;
@@ -401,8 +401,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
401
401
  };
402
402
  useEffect(() => {
403
403
  const item = data[activeIndex];
404
- if (openHashtag)
404
+ if (openHashtag) {
405
405
  handleReportProductView(item);
406
+ }
407
+ else {
408
+ viewTime.current = new Date();
409
+ }
406
410
  }, [openHashtag, data, activeIndex]);
407
411
  const handleViewImageStartEvent = (activeIndex) => {
408
412
  var _a, _b, _c, _d, _e, _f;
@@ -108,9 +108,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
108
108
  }
109
109
  if (isEditor) {
110
110
  let pageNum = 1;
111
- query = Object.assign(Object.assign({}, query), (!utmVal && channelQueryList && (channelQueryList === null || channelQueryList === void 0 ? void 0 : channelQueryList.length) > 0 && { channel: channelQueryList === null || channelQueryList === void 0 ? void 0 : channelQueryList[0] }));
112
- if (!(query === null || query === void 0 ? void 0 : query.channel) || isInit.current)
113
- return;
111
+ query = Object.assign(Object.assign(Object.assign({}, query), { directPage: true, level: 1 }), (!utmVal && channelQueryList && (channelQueryList === null || channelQueryList === void 0 ? void 0 : channelQueryList.length) > 0 && { channel: channelQueryList === null || channelQueryList === void 0 ? void 0 : channelQueryList[0] }));
112
+ if (!(query === null || query === void 0 ? void 0 : query.channel) || isInit.current) {
113
+ return undefined;
114
+ }
114
115
  isInit.current = true;
115
116
  let list = [];
116
117
  let result = null;
@@ -121,6 +122,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
121
122
  if (!(result === null || result === void 0 ? void 0 : result.success)) {
122
123
  return undefined;
123
124
  }
125
+ setLoading(false);
124
126
  const isNotNullList = (_s = (_r = result === null || result === void 0 ? void 0 : result.data) === null || _r === void 0 ? void 0 : _r.recList) === null || _s === void 0 ? void 0 : _s.every((item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video));
125
127
  list = list.concat((_w = (_v = (_u = (_t = result === null || result === void 0 ? void 0 : result.data) === null || _t === void 0 ? void 0 : _t.recList) === null || _u === void 0 ? void 0 : _u.filter) === null || _v === void 0 ? void 0 : _v.call(_u, (item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video))) !== null && _w !== void 0 ? _w : []);
126
128
  if (isNotNullList) {
@@ -284,8 +286,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
284
286
  bffGetTagList();
285
287
  getRecommendVideos()
286
288
  .then((data) => {
287
- setRtcList(getFilterRecList(data));
288
- setCacheRtcList(getFilterRecList(data));
289
+ if (data) {
290
+ setRtcList(getFilterRecList(data));
291
+ setCacheRtcList(getFilterRecList(data));
292
+ }
289
293
  })
290
294
  .finally(() => {
291
295
  bffEventReport({
@@ -304,8 +308,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
304
308
  bffGetTagList();
305
309
  getRecommendVideos()
306
310
  .then((data) => {
307
- setRtcList(getFilterRecList(data));
308
- setCacheRtcList(getFilterRecList(data));
311
+ if (data) {
312
+ setRtcList(getFilterRecList(data));
313
+ setCacheRtcList(getFilterRecList(data));
314
+ }
309
315
  })
310
316
  .finally(() => {
311
317
  bffEventReport({
@@ -47,6 +47,7 @@ export interface ICommodityDetailProps {
47
47
  w: number;
48
48
  h: number;
49
49
  };
50
+ isTel?: boolean;
50
51
  }
51
52
  declare const _default: React.NamedExoticComponent<ICommodityDetailProps>;
52
53
  export default _default;
@@ -12,8 +12,8 @@ import FormatImage from '../../../../core/components/SxpPageRender/FormatImage';
12
12
  import { setFontForText } from '../../../../core/utils/tool';
13
13
  import CommodityGroup from '../../template/components/CommodityGroup';
14
14
  const CommodityDetail = (_a) => {
15
- var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5;
16
- var { content, style, bgImg, onClick, schema, isDefault, bottom_image, tipText, isPost, viewTime, rec, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio } = _a, props = __rest(_a, ["content", "style", "bgImg", "onClick", "schema", "isDefault", "bottom_image", "tipText", "isPost", "viewTime", "rec", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio"]);
15
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
16
+ var { content, style, bgImg, onClick, schema, isDefault, bottom_image, tipText, isPost, viewTime, rec, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, isTel } = _a, props = __rest(_a, ["content", "style", "bgImg", "onClick", "schema", "isDefault", "bottom_image", "tipText", "isPost", "viewTime", "rec", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "isTel"]);
17
17
  const { sxpParameter, popupDetailData, isPreview, bffFbReport, popupCurTimeRef, checkCommodityIndexRef } = useSxpDataSource();
18
18
  const { jumpToWeb, productView } = useEventReport();
19
19
  const curTimeRef = useRef(null);
@@ -133,18 +133,18 @@ const CommodityDetail = (_a) => {
133
133
  };
134
134
  return dotsAlignClass === null || dotsAlignClass === void 0 ? void 0 : dotsAlignClass[swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign];
135
135
  }, [swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign]);
136
- const iframeUrl = ((_x = (_w = data === null || data === void 0 ? void 0 : data.video) === null || _w === void 0 ? void 0 : _w.bindProduct) === null || _x === void 0 ? void 0 : _x.remark) || ((_0 = (_z = (_y = data === null || data === void 0 ? void 0 : data.video) === null || _y === void 0 ? void 0 : _y.bindProducts) === null || _z === void 0 ? void 0 : _z[0]) === null || _0 === void 0 ? void 0 : _0.remark) || ((_1 = data === null || data === void 0 ? void 0 : data.product) === null || _1 === void 0 ? void 0 : _1.remark);
136
+ const iframeUrl = product === null || product === void 0 ? void 0 : product.remark;
137
137
  return (React.createElement(React.Fragment, null,
138
138
  React.createElement("div", Object.assign({ className: css(Object.assign({}, style)) }, props),
139
139
  React.createElement("div", { style: { position: 'relative' } },
140
- product && ((_2 = product === null || product === void 0 ? void 0 : product.homePage) === null || _2 === void 0 ? void 0 : _2.length) > 0 && (React.createElement(Swiper, { height: height, modules: [Pagination, Autoplay], pagination: {
140
+ product && ((_w = product === null || product === void 0 ? void 0 : product.homePage) === null || _w === void 0 ? void 0 : _w.length) > 0 && (React.createElement(Swiper, { height: height, modules: [Pagination, Autoplay], pagination: {
141
141
  clickable: true,
142
142
  bulletActiveClass: 'swipe-item-active-bullet',
143
143
  clickableClass: getDotsAlign
144
144
  }, loop: true, autoplay: {
145
145
  delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
146
146
  }, ref: ref },
147
- React.createElement(React.Fragment, null, (_3 = product === null || product === void 0 ? void 0 : product.homePage) === null || _3 === void 0 ? void 0 : _3.map((src) => {
147
+ React.createElement(React.Fragment, null, (_x = product === null || product === void 0 ? void 0 : product.homePage) === null || _x === void 0 ? void 0 : _x.map((src) => {
148
148
  var _a;
149
149
  return (React.createElement(SwiperSlide, { key: src },
150
150
  React.createElement("div", { style: {
@@ -160,7 +160,7 @@ const CommodityDetail = (_a) => {
160
160
  objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
161
161
  }, 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 }))));
162
162
  })))),
163
- !((_4 = product === null || product === void 0 ? void 0 : product.homePage) === null || _4 === void 0 ? void 0 : _4.length) && (React.createElement("div", { className: css({
163
+ !((_y = product === null || product === void 0 ? void 0 : product.homePage) === null || _y === void 0 ? void 0 : _y.length) && (React.createElement("div", { className: css({
164
164
  height,
165
165
  width
166
166
  }) },
@@ -168,7 +168,7 @@ const CommodityDetail = (_a) => {
168
168
  objectFit: 'cover',
169
169
  width: '100%',
170
170
  height: '100%'
171
- }), src: (_5 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _5 !== void 0 ? _5 : bottom_image, alt: 'pdp image' }))),
171
+ }), src: (_z = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _z !== void 0 ? _z : bottom_image, alt: 'pdp image' }))),
172
172
  (iframeUrl || !product) && iframeIcon && (React.createElement("div", { style: {
173
173
  padding: '5px 10px',
174
174
  display: 'flex',
@@ -180,8 +180,7 @@ const CommodityDetail = (_a) => {
180
180
  background: '#fff',
181
181
  borderRadius: '3px'
182
182
  }, onClick: () => setShow3DModal(true) },
183
- React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } }),
184
- React.createElement("span", { style: { fontSize: '12px' } }, "Try in 3D")))),
183
+ React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px' })))),
185
184
  renderCommodityGroup(),
186
185
  React.createElement("div", { className: 'pb-commondity-content' }, renderContent({ isPost }))),
187
186
  renderBtn(),
@@ -189,11 +188,12 @@ const CommodityDetail = (_a) => {
189
188
  React.createElement("div", { style: { paddingBottom: '80px' } }, renderContent({ isPost: false })),
190
189
  renderBtn()),
191
190
  React.createElement(Modal, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
192
- React.createElement("iframe", { src: iframeUrl, style: {
193
- width: '100%',
194
- height: 'calc(100% - 50px)',
195
- marginTop: '40px',
196
- border: 'none'
197
- } }))));
191
+ React.createElement("div", { style: { height: window.innerHeight } },
192
+ React.createElement("iframe", { src: iframeUrl, style: {
193
+ width: '100%',
194
+ height: isTel ? `${664 - 50}px` : `${window.innerHeight - 50}px`,
195
+ marginTop: '50px',
196
+ border: 'none'
197
+ } })))));
198
198
  };
199
199
  export default memo(CommodityDetail);
@@ -47,6 +47,7 @@ export interface ICommodityDetailDiroNewProps {
47
47
  w: number;
48
48
  h: number;
49
49
  };
50
+ isTel?: boolean;
50
51
  }
51
52
  declare const _default: React.NamedExoticComponent<ICommodityDetailDiroNewProps>;
52
53
  export default _default;
@@ -12,8 +12,8 @@ import FormatImage from '../../../../core/components/SxpPageRender/FormatImage';
12
12
  import { setFontForText } from '../../../../core/utils/tool';
13
13
  import CommodityGroup from '../../template/components/CommodityGroup';
14
14
  const CommodityDetailDiroNew = (_a) => {
15
- var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9;
16
- var { style, isDefault, rec, viewTime, isPost, bottom_image, tipText, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio } = _a, props = __rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "tipText", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio"]);
15
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3;
16
+ var { style, isDefault, rec, viewTime, isPost, bottom_image, tipText, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, isTel } = _a, props = __rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "tipText", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "isTel"]);
17
17
  const [spread, setSpread] = useState(true);
18
18
  const { sxpParameter, popupCurTimeRef, popupDetailData, isPreview, bffFbReport, checkCommodityIndexRef } = useSxpDataSource();
19
19
  const { jumpToWeb, productView } = useEventReport();
@@ -117,17 +117,17 @@ Made in Italy` })));
117
117
  };
118
118
  return dotsAlignClass === null || dotsAlignClass === void 0 ? void 0 : dotsAlignClass[swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign];
119
119
  }, [swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign]);
120
- const iframeUrl = ((_x = (_w = data === null || data === void 0 ? void 0 : data.video) === null || _w === void 0 ? void 0 : _w.bindProduct) === null || _x === void 0 ? void 0 : _x.remark) || ((_0 = (_z = (_y = data === null || data === void 0 ? void 0 : data.video) === null || _y === void 0 ? void 0 : _y.bindProducts) === null || _z === void 0 ? void 0 : _z[0]) === null || _0 === void 0 ? void 0 : _0.remark) || ((_1 = data === null || data === void 0 ? void 0 : data.product) === null || _1 === void 0 ? void 0 : _1.remark);
120
+ const iframeUrl = product === null || product === void 0 ? void 0 : product.remark;
121
121
  return (React.createElement("div", { className: 'pb-commondityDiroNew' },
122
122
  React.createElement("div", Object.assign({ className: css(Object.assign(Object.assign({}, style), { transform: 'translate3d(0px, 0px, 0px)' })) }, props),
123
123
  React.createElement("div", { style: { position: 'relative' } },
124
- product && ((_2 = product === null || product === void 0 ? void 0 : product.homePage) === null || _2 === void 0 ? void 0 : _2.length) > 0 && (React.createElement(Swiper, { height: height, modules: [Pagination, Autoplay], pagination: {
124
+ product && ((_w = product === null || product === void 0 ? void 0 : product.homePage) === null || _w === void 0 ? void 0 : _w.length) > 0 && (React.createElement(Swiper, { height: height, modules: [Pagination, Autoplay], pagination: {
125
125
  clickable: true,
126
126
  bulletActiveClass: 'commondityDiroNew-swipe-item-active-bullet',
127
127
  clickableClass: getDotsAlign
128
128
  }, loop: true, autoplay: {
129
129
  delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
130
- }, ref: ref }, (_3 = product === null || product === void 0 ? void 0 : product.homePage) === null || _3 === void 0 ? void 0 : _3.map((src) => {
130
+ }, ref: ref }, (_x = product === null || product === void 0 ? void 0 : product.homePage) === null || _x === void 0 ? void 0 : _x.map((src) => {
131
131
  var _a;
132
132
  return (React.createElement(SwiperSlide, { key: src },
133
133
  React.createElement("div", { style: {
@@ -143,7 +143,7 @@ Made in Italy` })));
143
143
  objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
144
144
  }, 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 }))));
145
145
  }))),
146
- !((_4 = product === null || product === void 0 ? void 0 : product.homePage) === null || _4 === void 0 ? void 0 : _4.length) && (React.createElement("div", { className: css({
146
+ !((_y = product === null || product === void 0 ? void 0 : product.homePage) === null || _y === void 0 ? void 0 : _y.length) && (React.createElement("div", { className: css({
147
147
  height,
148
148
  width
149
149
  }) },
@@ -151,7 +151,7 @@ Made in Italy` })));
151
151
  objectFit: 'cover',
152
152
  width: '100%',
153
153
  height: '100%'
154
- }), src: (_5 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _5 !== void 0 ? _5 : bottom_image, alt: 'pdp image' }))),
154
+ }), src: (_z = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _z !== void 0 ? _z : bottom_image, alt: 'pdp image' }))),
155
155
  (iframeUrl || !product) && iframeIcon && (React.createElement("div", { style: {
156
156
  padding: '5px 10px',
157
157
  display: 'flex',
@@ -163,14 +163,13 @@ Made in Italy` })));
163
163
  background: '#fff',
164
164
  borderRadius: '3px'
165
165
  }, onClick: () => setShow3DModal(true) },
166
- React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } }),
167
- React.createElement("span", { style: { fontSize: '12px' } }, "Try in 3D")))),
166
+ React.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px' })))),
168
167
  renderCommodityGroup(),
169
168
  React.createElement("div", { className: 'pb-commondityDiroNew-content' },
170
169
  React.createElement("div", { className: 'pb-commondityDiroNew-content-top' },
171
170
  React.createElement("div", { className: 'pb-commondityDiroNew-content-top-left' },
172
171
  React.createElement("div", { className: 'pb-commondityDiroNew-content-top-left-title', style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title), dangerouslySetInnerHTML: {
173
- __html: setFontForText((_6 = product === null || product === void 0 ? void 0 : product.title) !== null && _6 !== void 0 ? _6 : 'Large Dior Toujours BagLarge', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title)
172
+ __html: setFontForText((_0 = product === null || product === void 0 ? void 0 : product.title) !== null && _0 !== void 0 ? _0 : 'Large Dior Toujours BagLarge', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title)
174
173
  } }),
175
174
  React.createElement("div", { className: 'pb-commondityDiroNew-content-collection', hidden: !!product && (!(product === null || product === void 0 ? void 0 : product.collection) || (product === null || product === void 0 ? void 0 : product.collection) === ''), style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection), dangerouslySetInnerHTML: {
176
175
  __html: setFontForText((product === null || product === void 0 ? void 0 : product.collection) || 'Black Macrocannage CalfskinLarge', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
@@ -180,20 +179,21 @@ Made in Italy` })));
180
179
  __html: setFontForText(priceText, commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
181
180
  } }),
182
181
  React.createElement("div", { className: 'pb-commondityDiroNew-content-top-right-price', hidden: !!product && !(product === null || product === void 0 ? void 0 : product.taxInfo), style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.taxInfo), dangerouslySetInnerHTML: {
183
- __html: setFontForText((_7 = product === null || product === void 0 ? void 0 : product.taxInfo) !== null && _7 !== void 0 ? _7 : '税费', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.taxInfo)
182
+ __html: setFontForText((_1 = product === null || product === void 0 ? void 0 : product.taxInfo) !== null && _1 !== void 0 ? _1 : '税费', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.taxInfo)
184
183
  } }))),
185
- (!product || (product === null || product === void 0 ? void 0 : product.link)) && (React.createElement("button", { "aria-label": (_8 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _8 !== void 0 ? _8 : 'Shop now', onClick: handleLink, className: 'pb-commondityDiroNew-btn', style: buttonStyle },
184
+ (!product || (product === null || product === void 0 ? void 0 : product.link)) && (React.createElement("button", { "aria-label": (_2 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _2 !== void 0 ? _2 : 'Shop now', onClick: handleLink, className: 'pb-commondityDiroNew-btn', style: buttonStyle },
186
185
  React.createElement("span", { dangerouslySetInnerHTML: {
187
- __html: setFontForText((_9 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _9 !== void 0 ? _9 : 'Shop now', buttonStyle)
186
+ __html: setFontForText((_3 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _3 !== void 0 ? _3 : 'Shop now', buttonStyle)
188
187
  } }))),
189
188
  productInfoText({ isPost }))),
190
189
  React.createElement(Modal, { visible: showModal, onClose: () => setShowModal(false) }, productInfoText({ isPost: false })),
191
190
  React.createElement(Modal, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
192
- React.createElement("iframe", { src: iframeUrl, style: {
193
- width: '100%',
194
- height: 'calc(100% - 50px)',
195
- marginTop: '40px',
196
- border: 'none'
197
- } }))));
191
+ React.createElement("div", { style: { height: window.innerHeight } },
192
+ React.createElement("iframe", { src: iframeUrl, style: {
193
+ width: '100%',
194
+ height: isTel ? `${664 - 50}px` : `${window.innerHeight - 50}px`,
195
+ marginTop: '50px',
196
+ border: 'none'
197
+ } })))));
198
198
  };
199
199
  export default memo(CommodityDetailDiroNew);
@@ -8,7 +8,7 @@ const Iframe = (_a) => {
8
8
  var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick, submitButtonStyle, contentStyle, isTel } = _a, props = __rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick", "submitButtonStyle", "contentStyle", "isTel"]);
9
9
  const { popupDetailData } = useSxpDataSource();
10
10
  const iframeUrl = (_c = (_b = popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.video) === null || _b === void 0 ? void 0 : _b.bindCta) === null || _c === void 0 ? void 0 : _c.remark;
11
- return (React.createElement("div", Object.assign({ className: `${css(Object.assign(Object.assign({}, style), { height: isTel ? 664 : '100%' }))}` }, props),
11
+ return (React.createElement("div", Object.assign({ className: `${css(Object.assign(Object.assign({}, style), { height: isTel ? 664 : window === null || window === void 0 ? void 0 : window.innerHeight }))}` }, props),
12
12
  React.createElement("iframe", { src: iframeUrl, style: {
13
13
  width: '100%',
14
14
  height: 'calc(100% - 50px)',
@@ -7,7 +7,7 @@ const ReactDOM = tslib_1.__importStar(require("react-dom"));
7
7
  const hooks_1 = require("../../../../core/hooks");
8
8
  const closeIcon = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAjhJREFUWEfFlztOw0AQhmeWiJ4CCmpQ5DiRQsIJyAWg5A0lR0AIChDiCJS8ER0cADgBeRSxt4CCDgkaKiq8i+zYeWx2413HEWmiJJv9v535Z2aN8M8vFPT9z3zETD0aAUChUJjwvPFHAJhBhB3Hqd6OAsK2yyucwykAvP38eJX398Z3AJDLlVYR8ToU9Rhj25TWr9KEsKy5dULIGQCMtfZly45TvwsAstm56UwG6wA4FUFwzrdctxZBDcWSy5XWEPG8I84/GcMipdWPtgcsaz5PCHtKG0IuTiqUvjT9U/WYMG2IOPE+AP+LtCB0xKUAAyA2Xbd2o2OG0NQXvTnvhL17D7EPtH9TRCIWwkRcGYGIQgYBABuqPuHXOQBc6pw80lBGwBQiiXhsBHQhkoprA6iM6acjhDQKu5YJZW6XeOI3XJdpvfsdTu52VfXEekD8owQiXGIubpSCbhDbLu8DwKEAd+A41SOdPpE4BS0viFOtvV2iKWqUgn5x/tmS70xR01GuDSCKc86/OCcLgTyyZ0ScDGNhFAktAJV4NFJ9YyaFiAWIE+9uVkkgBgLoig8DMWAa9ro9ynkUdlW5maZDCmB6clmz0k1HH4Cs1Ezbq2p2yEpUuBOKTSZZex00RUWIrltxuuK6EOGDSbGIOPZicpMx6fny650377qNRgBgWeVFQuA+6UjVgREhGIMlSqsPUQqIbZdOOIdZQmCv2axRnU1N1+TzJYsxOEaEV8ep7frPZ7Gd0FTEdP0ft0/kMNdg0eoAAAAASUVORK5CYII=';
9
9
  const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema, fullHeight = window.innerHeight, isFullScreen = false }) => {
10
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
10
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
11
11
  const touchRef = (0, react_1.useRef)(null);
12
12
  const fTouchRef = (0, react_1.useRef)(null);
13
13
  const touchMoveRef = (0, react_1.useRef)(null);
@@ -129,8 +129,7 @@ const Modal = ({ visible, onClose, children, modalStyle, padding, popup, schema,
129
129
  react_1.default.createElement("div", { onClick: onClose, className: 'modal-icon-wrapper' },
130
130
  react_1.default.createElement("img", { src: (_t = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.popupCloseIcon) !== null && _t !== void 0 ? _t : closeIcon, alt: 'close', className: 'modal-icon' })),
131
131
  react_1.default.createElement("div", { ref: ref, style: {
132
- height: (_x = (isScrollFullScreen ? fullHeight : MODAL_DEF_CON_H) -
133
- ((_w = (_v = (_u = getPopupById === null || getPopupById === void 0 ? void 0 : getPopupById.item) === null || _u === void 0 ? void 0 : _u.props) === null || _v === void 0 ? void 0 : _v.popupBg) === null || _w === void 0 ? void 0 : _w.bottomMargin)) !== null && _x !== void 0 ? _x : 0,
132
+ height: isScrollFullScreen ? fullHeight : MODAL_DEF_CON_H,
134
133
  overflow: (isScrollFullScreen && modalTrans <= 0) || !isScrollFullScreen ? 'auto' : 'hidden'
135
134
  } }, children)))))), modalEleRef.current);
136
135
  };
@@ -357,7 +357,6 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
357
357
  };
358
358
  const handleScrollEvent = (swiper) => {
359
359
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
360
- viewTime.current = new Date();
361
360
  const item = data[swiper.previousIndex];
362
361
  if (!item)
363
362
  return;
@@ -395,6 +394,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
395
394
  eventName: 'ProductView'
396
395
  });
397
396
  }
397
+ viewTime.current = new Date();
398
398
  };
399
399
  const handleReportProductView = (item) => {
400
400
  var _a, _b, _c;
@@ -404,8 +404,12 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
404
404
  };
405
405
  (0, react_1.useEffect)(() => {
406
406
  const item = data[activeIndex];
407
- if (openHashtag)
407
+ if (openHashtag) {
408
408
  handleReportProductView(item);
409
+ }
410
+ else {
411
+ viewTime.current = new Date();
412
+ }
409
413
  }, [openHashtag, data, activeIndex]);
410
414
  const handleViewImageStartEvent = (activeIndex) => {
411
415
  var _a, _b, _c, _d, _e, _f;
@@ -111,9 +111,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
111
111
  }
112
112
  if (isEditor) {
113
113
  let pageNum = 1;
114
- query = Object.assign(Object.assign({}, query), (!utmVal && channelQueryList && (channelQueryList === null || channelQueryList === void 0 ? void 0 : channelQueryList.length) > 0 && { channel: channelQueryList === null || channelQueryList === void 0 ? void 0 : channelQueryList[0] }));
115
- if (!(query === null || query === void 0 ? void 0 : query.channel) || isInit.current)
116
- return;
114
+ query = Object.assign(Object.assign(Object.assign({}, query), { directPage: true, level: 1 }), (!utmVal && channelQueryList && (channelQueryList === null || channelQueryList === void 0 ? void 0 : channelQueryList.length) > 0 && { channel: channelQueryList === null || channelQueryList === void 0 ? void 0 : channelQueryList[0] }));
115
+ if (!(query === null || query === void 0 ? void 0 : query.channel) || isInit.current) {
116
+ return undefined;
117
+ }
117
118
  isInit.current = true;
118
119
  let list = [];
119
120
  let result = null;
@@ -124,6 +125,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
124
125
  if (!(result === null || result === void 0 ? void 0 : result.success)) {
125
126
  return undefined;
126
127
  }
128
+ setLoading(false);
127
129
  const isNotNullList = (_s = (_r = result === null || result === void 0 ? void 0 : result.data) === null || _r === void 0 ? void 0 : _r.recList) === null || _s === void 0 ? void 0 : _s.every((item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video));
128
130
  list = list.concat((_w = (_v = (_u = (_t = result === null || result === void 0 ? void 0 : result.data) === null || _t === void 0 ? void 0 : _t.recList) === null || _u === void 0 ? void 0 : _u.filter) === null || _v === void 0 ? void 0 : _v.call(_u, (item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video))) !== null && _w !== void 0 ? _w : []);
129
131
  if (isNotNullList) {
@@ -287,8 +289,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
287
289
  bffGetTagList();
288
290
  getRecommendVideos()
289
291
  .then((data) => {
290
- setRtcList(getFilterRecList(data));
291
- setCacheRtcList(getFilterRecList(data));
292
+ if (data) {
293
+ setRtcList(getFilterRecList(data));
294
+ setCacheRtcList(getFilterRecList(data));
295
+ }
292
296
  })
293
297
  .finally(() => {
294
298
  bffEventReport({
@@ -307,8 +311,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
307
311
  bffGetTagList();
308
312
  getRecommendVideos()
309
313
  .then((data) => {
310
- setRtcList(getFilterRecList(data));
311
- setCacheRtcList(getFilterRecList(data));
314
+ if (data) {
315
+ setRtcList(getFilterRecList(data));
316
+ setCacheRtcList(getFilterRecList(data));
317
+ }
312
318
  })
313
319
  .finally(() => {
314
320
  bffEventReport({
@@ -47,6 +47,7 @@ export interface ICommodityDetailProps {
47
47
  w: number;
48
48
  h: number;
49
49
  };
50
+ isTel?: boolean;
50
51
  }
51
52
  declare const _default: React.NamedExoticComponent<ICommodityDetailProps>;
52
53
  export default _default;
@@ -14,8 +14,8 @@ const FormatImage_1 = tslib_1.__importDefault(require("../../../../core/componen
14
14
  const tool_1 = require("../../../../core/utils/tool");
15
15
  const CommodityGroup_1 = tslib_1.__importDefault(require("../../template/components/CommodityGroup"));
16
16
  const CommodityDetail = (_a) => {
17
- var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5;
18
- var { content, style, bgImg, onClick, schema, isDefault, bottom_image, tipText, isPost, viewTime, rec, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio } = _a, props = tslib_1.__rest(_a, ["content", "style", "bgImg", "onClick", "schema", "isDefault", "bottom_image", "tipText", "isPost", "viewTime", "rec", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio"]);
17
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
18
+ var { content, style, bgImg, onClick, schema, isDefault, bottom_image, tipText, isPost, viewTime, rec, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, isTel } = _a, props = tslib_1.__rest(_a, ["content", "style", "bgImg", "onClick", "schema", "isDefault", "bottom_image", "tipText", "isPost", "viewTime", "rec", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "isTel"]);
19
19
  const { sxpParameter, popupDetailData, isPreview, bffFbReport, popupCurTimeRef, checkCommodityIndexRef } = (0, hooks_1.useSxpDataSource)();
20
20
  const { jumpToWeb, productView } = (0, useEventReport_1.useEventReport)();
21
21
  const curTimeRef = (0, react_1.useRef)(null);
@@ -135,18 +135,18 @@ const CommodityDetail = (_a) => {
135
135
  };
136
136
  return dotsAlignClass === null || dotsAlignClass === void 0 ? void 0 : dotsAlignClass[swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign];
137
137
  }, [swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign]);
138
- const iframeUrl = ((_x = (_w = data === null || data === void 0 ? void 0 : data.video) === null || _w === void 0 ? void 0 : _w.bindProduct) === null || _x === void 0 ? void 0 : _x.remark) || ((_0 = (_z = (_y = data === null || data === void 0 ? void 0 : data.video) === null || _y === void 0 ? void 0 : _y.bindProducts) === null || _z === void 0 ? void 0 : _z[0]) === null || _0 === void 0 ? void 0 : _0.remark) || ((_1 = data === null || data === void 0 ? void 0 : data.product) === null || _1 === void 0 ? void 0 : _1.remark);
138
+ const iframeUrl = product === null || product === void 0 ? void 0 : product.remark;
139
139
  return (react_1.default.createElement(react_1.default.Fragment, null,
140
140
  react_1.default.createElement("div", Object.assign({ className: (0, css_1.css)(Object.assign({}, style)) }, props),
141
141
  react_1.default.createElement("div", { style: { position: 'relative' } },
142
- product && ((_2 = product === null || product === void 0 ? void 0 : product.homePage) === null || _2 === void 0 ? void 0 : _2.length) > 0 && (react_1.default.createElement(react_2.Swiper, { height: height, modules: [modules_1.Pagination, modules_1.Autoplay], pagination: {
142
+ product && ((_w = product === null || product === void 0 ? void 0 : product.homePage) === null || _w === void 0 ? void 0 : _w.length) > 0 && (react_1.default.createElement(react_2.Swiper, { height: height, modules: [modules_1.Pagination, modules_1.Autoplay], pagination: {
143
143
  clickable: true,
144
144
  bulletActiveClass: 'swipe-item-active-bullet',
145
145
  clickableClass: getDotsAlign
146
146
  }, loop: true, autoplay: {
147
147
  delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
148
148
  }, ref: ref },
149
- react_1.default.createElement(react_1.default.Fragment, null, (_3 = product === null || product === void 0 ? void 0 : product.homePage) === null || _3 === void 0 ? void 0 : _3.map((src) => {
149
+ react_1.default.createElement(react_1.default.Fragment, null, (_x = product === null || product === void 0 ? void 0 : product.homePage) === null || _x === void 0 ? void 0 : _x.map((src) => {
150
150
  var _a;
151
151
  return (react_1.default.createElement(react_2.SwiperSlide, { key: src },
152
152
  react_1.default.createElement("div", { style: {
@@ -162,7 +162,7 @@ const CommodityDetail = (_a) => {
162
162
  objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
163
163
  }, 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 }))));
164
164
  })))),
165
- !((_4 = product === null || product === void 0 ? void 0 : product.homePage) === null || _4 === void 0 ? void 0 : _4.length) && (react_1.default.createElement("div", { className: (0, css_1.css)({
165
+ !((_y = product === null || product === void 0 ? void 0 : product.homePage) === null || _y === void 0 ? void 0 : _y.length) && (react_1.default.createElement("div", { className: (0, css_1.css)({
166
166
  height,
167
167
  width
168
168
  }) },
@@ -170,7 +170,7 @@ const CommodityDetail = (_a) => {
170
170
  objectFit: 'cover',
171
171
  width: '100%',
172
172
  height: '100%'
173
- }), src: (_5 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _5 !== void 0 ? _5 : bottom_image, alt: 'pdp image' }))),
173
+ }), src: (_z = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _z !== void 0 ? _z : bottom_image, alt: 'pdp image' }))),
174
174
  (iframeUrl || !product) && iframeIcon && (react_1.default.createElement("div", { style: {
175
175
  padding: '5px 10px',
176
176
  display: 'flex',
@@ -182,8 +182,7 @@ const CommodityDetail = (_a) => {
182
182
  background: '#fff',
183
183
  borderRadius: '3px'
184
184
  }, onClick: () => setShow3DModal(true) },
185
- react_1.default.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } }),
186
- react_1.default.createElement("span", { style: { fontSize: '12px' } }, "Try in 3D")))),
185
+ react_1.default.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px' })))),
187
186
  renderCommodityGroup(),
188
187
  react_1.default.createElement("div", { className: 'pb-commondity-content' }, renderContent({ isPost }))),
189
188
  renderBtn(),
@@ -191,11 +190,12 @@ const CommodityDetail = (_a) => {
191
190
  react_1.default.createElement("div", { style: { paddingBottom: '80px' } }, renderContent({ isPost: false })),
192
191
  renderBtn()),
193
192
  react_1.default.createElement(Modal_1.default, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
194
- react_1.default.createElement("iframe", { src: iframeUrl, style: {
195
- width: '100%',
196
- height: 'calc(100% - 50px)',
197
- marginTop: '40px',
198
- border: 'none'
199
- } }))));
193
+ react_1.default.createElement("div", { style: { height: window.innerHeight } },
194
+ react_1.default.createElement("iframe", { src: iframeUrl, style: {
195
+ width: '100%',
196
+ height: isTel ? `${664 - 50}px` : `${window.innerHeight - 50}px`,
197
+ marginTop: '50px',
198
+ border: 'none'
199
+ } })))));
200
200
  };
201
201
  exports.default = (0, react_1.memo)(CommodityDetail);
@@ -47,6 +47,7 @@ export interface ICommodityDetailDiroNewProps {
47
47
  w: number;
48
48
  h: number;
49
49
  };
50
+ isTel?: boolean;
50
51
  }
51
52
  declare const _default: React.NamedExoticComponent<ICommodityDetailDiroNewProps>;
52
53
  export default _default;