pb-sxp-ui 1.3.1 → 1.3.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (64) hide show
  1. package/dist/index.cjs +238 -184
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.css +1 -1
  4. package/dist/index.js +238 -184
  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 +238 -184
  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/Modal/index.js +3 -3
  15. package/es/core/components/SxpPageRender/RenderCard.d.ts +3 -3
  16. package/es/core/components/SxpPageRender/RenderCard.js +17 -27
  17. package/es/core/components/SxpPageRender/WaterFall/List.js +20 -11
  18. package/es/core/components/SxpPageRender/WaterFall/WaterfallList.js +20 -11
  19. package/es/core/components/SxpPageRender/index.js +21 -13
  20. package/es/core/context/EditorDataProvider.d.ts +3 -0
  21. package/es/core/context/EditorDataProvider.js +2 -1
  22. package/es/core/context/SxpDataSourceProvider.d.ts +1 -0
  23. package/es/core/context/SxpDataSourceProvider.js +53 -35
  24. package/es/core/utils/tool.d.ts +3 -3
  25. package/es/core/utils/tool.js +6 -6
  26. package/es/materials/sxp/HashTag/index.d.ts +3 -1
  27. package/es/materials/sxp/HashTag/settingRender.d.ts +7 -0
  28. package/es/materials/sxp/HashTag/settingRender.js +6 -0
  29. package/es/materials/sxp/popup/CommodityDetail/index.d.ts +1 -0
  30. package/es/materials/sxp/popup/CommodityDetail/index.js +26 -27
  31. package/es/materials/sxp/popup/CommodityDetailDiroNew/index.d.ts +1 -0
  32. package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +30 -31
  33. package/es/materials/sxp/popup/CommodityList/index.d.ts +3 -1
  34. package/es/materials/sxp/popup/CommodityList/index.js +11 -7
  35. package/es/materials/sxp/popup/CommodityList/settingRender.d.ts +7 -0
  36. package/es/materials/sxp/popup/CommodityList/settingRender.js +6 -0
  37. package/es/materials/sxp/popup/Iframe/index.d.ts +1 -0
  38. package/es/materials/sxp/popup/Iframe/index.js +8 -7
  39. package/lib/core/components/SxpPageRender/Modal/index.js +3 -3
  40. package/lib/core/components/SxpPageRender/RenderCard.d.ts +3 -3
  41. package/lib/core/components/SxpPageRender/RenderCard.js +16 -26
  42. package/lib/core/components/SxpPageRender/WaterFall/List.js +20 -11
  43. package/lib/core/components/SxpPageRender/WaterFall/WaterfallList.js +20 -11
  44. package/lib/core/components/SxpPageRender/index.js +21 -13
  45. package/lib/core/context/EditorDataProvider.d.ts +3 -0
  46. package/lib/core/context/EditorDataProvider.js +2 -1
  47. package/lib/core/context/SxpDataSourceProvider.d.ts +1 -0
  48. package/lib/core/context/SxpDataSourceProvider.js +53 -35
  49. package/lib/core/utils/tool.d.ts +3 -3
  50. package/lib/core/utils/tool.js +6 -6
  51. package/lib/materials/sxp/HashTag/index.d.ts +3 -1
  52. package/lib/materials/sxp/HashTag/settingRender.d.ts +7 -0
  53. package/lib/materials/sxp/HashTag/settingRender.js +6 -0
  54. package/lib/materials/sxp/popup/CommodityDetail/index.d.ts +1 -0
  55. package/lib/materials/sxp/popup/CommodityDetail/index.js +26 -27
  56. package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.d.ts +1 -0
  57. package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +30 -31
  58. package/lib/materials/sxp/popup/CommodityList/index.d.ts +3 -1
  59. package/lib/materials/sxp/popup/CommodityList/index.js +11 -7
  60. package/lib/materials/sxp/popup/CommodityList/settingRender.d.ts +7 -0
  61. package/lib/materials/sxp/popup/CommodityList/settingRender.js +6 -0
  62. package/lib/materials/sxp/popup/Iframe/index.d.ts +1 -0
  63. package/lib/materials/sxp/popup/Iframe/index.js +8 -7
  64. package/package.json +1 -1
@@ -96,8 +96,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
96
96
  .catch((err) => Promise.reject(err));
97
97
  }, [bffDataSource]);
98
98
  const getRecommendVideos = (0, react_1.useCallback)((query) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
99
- var _d, _e, _f, _g, _h, _j, _k;
100
- query = Object.assign(Object.assign({ maxSize: (_d = query === null || query === void 0 ? void 0 : query.maxSize) !== null && _d !== void 0 ? _d : maxSize, defaultSize: (_e = query === null || query === void 0 ? void 0 : query.defaultSize) !== null && _e !== void 0 ? _e : defaultSize, hashTag: query === null || query === void 0 ? void 0 : query.hashTag, traceInfo: query === null || query === void 0 ? void 0 : query.traceInfo, themeTag: query === null || query === void 0 ? void 0 : query.themeTag }, ((query === null || query === void 0 ? void 0 : query.contentFilter) && { contentFilter: `[${query === null || query === void 0 ? void 0 : query.contentFilter}]` })), ((query === null || query === void 0 ? void 0 : query.productFilter) && { productFilter: `[${query === null || query === void 0 ? void 0 : query.productFilter}]` }));
99
+ var _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
100
+ query = Object.assign(Object.assign(Object.assign({ maxSize: (_d = query === null || query === void 0 ? void 0 : query.maxSize) !== null && _d !== void 0 ? _d : maxSize, defaultSize: (_e = query === null || query === void 0 ? void 0 : query.defaultSize) !== null && _e !== void 0 ? _e : defaultSize, hashTag: query === null || query === void 0 ? void 0 : query.hashTag, traceInfo: query === null || query === void 0 ? void 0 : query.traceInfo, themeTag: query === null || query === void 0 ? void 0 : query.themeTag }, ((query === null || query === void 0 ? void 0 : query.contentFilter) && { contentFilter: `[${query === null || query === void 0 ? void 0 : query.contentFilter}]` })), ((query === null || query === void 0 ? void 0 : query.productFilter) && { productFilter: `[${query === null || query === void 0 ? void 0 : query.productFilter}]` })), { pageNum: query === null || query === void 0 ? void 0 : query.pageNum });
101
101
  if (utmVal) {
102
102
  const val = (_h = (_g = (_f = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _f === void 0 ? void 0 : _f.filter((val) => {
103
103
  var _a, _b;
@@ -106,30 +106,36 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
106
106
  })) === null || _g === void 0 ? void 0 : _g.join('&')) !== null && _h !== void 0 ? _h : '';
107
107
  query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(val) });
108
108
  }
109
- if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) || isEditor) {
109
+ if (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) {
110
+ query = Object.assign(Object.assign({}, query), { directPage: true, level: 1, pageNum: (_j = query === null || query === void 0 ? void 0 : query.pageNum) !== null && _j !== void 0 ? _j : 1 });
111
+ }
112
+ if (isEditor) {
113
+ let pageNum = 1;
110
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] }));
111
- if (!(query === null || query === void 0 ? void 0 : query.channel))
112
- return;
115
+ if (!(query === null || query === void 0 ? void 0 : query.channel) || isInit.current) {
116
+ return undefined;
117
+ }
118
+ isInit.current = true;
113
119
  let list = [];
114
120
  let result = null;
115
- let pageNum = 1;
116
121
  const recurveRecList = (query) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
117
- var _l, _m, _o, _p;
122
+ var _r, _s, _t, _u, _v, _w;
118
123
  query.pageNum = pageNum;
119
124
  result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'GET', query }));
120
125
  if (!(result === null || result === void 0 ? void 0 : result.success)) {
121
126
  return undefined;
122
127
  }
123
- const rec = (_m = (_l = result === null || result === void 0 ? void 0 : result.data) === null || _l === void 0 ? void 0 : _l.recList) === null || _m === void 0 ? void 0 : _m[0];
124
- list = list.concat((_p = (_o = result === null || result === void 0 ? void 0 : result.data) === null || _o === void 0 ? void 0 : _o.recList) !== null && _p !== void 0 ? _p : []);
125
- if ((rec === null || rec === void 0 ? void 0 : rec.product) || (rec === null || rec === void 0 ? void 0 : rec.video)) {
128
+ setLoading(false);
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));
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 : []);
131
+ if (isNotNullList) {
126
132
  pageNum = pageNum + 1;
127
133
  yield recurveRecList(query);
128
134
  }
129
135
  });
130
136
  yield recurveRecList(query);
131
137
  if (!(query === null || query === void 0 ? void 0 : query.hashTag) && result)
132
- setCurReqInfo({ rtc: (_j = result === null || result === void 0 ? void 0 : result.data) === null || _j === void 0 ? void 0 : _j.rtc, requestId: (_k = result === null || result === void 0 ? void 0 : result.data) === null || _k === void 0 ? void 0 : _k.requestId });
138
+ setCurReqInfo({ rtc: (_k = result === null || result === void 0 ? void 0 : result.data) === null || _k === void 0 ? void 0 : _k.rtc, requestId: (_l = result === null || result === void 0 ? void 0 : result.data) === null || _l === void 0 ? void 0 : _l.requestId });
133
139
  return Object.assign(Object.assign({}, result.data), { recList: list });
134
140
  }
135
141
  const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'GET', query }));
@@ -138,15 +144,20 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
138
144
  }
139
145
  if (!(query === null || query === void 0 ? void 0 : query.hashTag))
140
146
  setCurReqInfo({ rtc: result.data.rtc, requestId: result.data.requestId });
147
+ if ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) && !isEditor) {
148
+ let list = [];
149
+ list = list.concat((_q = (_p = (_o = (_m = result === null || result === void 0 ? void 0 : result.data) === null || _m === void 0 ? void 0 : _m.recList) === null || _o === void 0 ? void 0 : _o.filter) === null || _p === void 0 ? void 0 : _p.call(_o, (item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video))) !== null && _q !== void 0 ? _q : []);
150
+ return Object.assign(Object.assign({}, result.data), { recList: list });
151
+ }
141
152
  return result === null || result === void 0 ? void 0 : result.data;
142
- }), [bffFetch, utmVal, maxSize, defaultSize, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview, channelQueryList, isEditor]);
143
- const loadVideos = (0, react_1.useCallback)(() => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
144
- var _q, _r, _s, _t;
153
+ }), [bffFetch, utmVal, maxSize, defaultSize, channelQueryList]);
154
+ const loadVideos = (0, react_1.useCallback)((pageNum) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
155
+ var _x, _y, _z, _0;
145
156
  if (rtcList.length <= 0) {
146
157
  return;
147
158
  }
148
159
  const lastItem = rtcList === null || rtcList === void 0 ? void 0 : rtcList[(rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) - 1];
149
- const data = yield getRecommendVideos(Object.assign(Object.assign(Object.assign({ hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag }, (((_q = lastItem === null || lastItem === void 0 ? void 0 : lastItem.product) === null || _q === void 0 ? void 0 : _q.itemId) && { productFilter: (_r = lastItem === null || lastItem === void 0 ? void 0 : lastItem.product) === null || _r === void 0 ? void 0 : _r.itemId })), (((_s = lastItem === null || lastItem === void 0 ? void 0 : lastItem.video) === null || _s === void 0 ? void 0 : _s.itemId) && { contentFilter: (_t = lastItem === null || lastItem === void 0 ? void 0 : lastItem.video) === null || _t === void 0 ? void 0 : _t.itemId })), { themeTag: themeTag.current }));
160
+ const data = yield getRecommendVideos(Object.assign(Object.assign(Object.assign(Object.assign({ hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag }, (((_x = lastItem === null || lastItem === void 0 ? void 0 : lastItem.product) === null || _x === void 0 ? void 0 : _x.itemId) && { productFilter: (_y = lastItem === null || lastItem === void 0 ? void 0 : lastItem.product) === null || _y === void 0 ? void 0 : _y.itemId })), (((_z = lastItem === null || lastItem === void 0 ? void 0 : lastItem.video) === null || _z === void 0 ? void 0 : _z.itemId) && { contentFilter: (_0 = lastItem === null || lastItem === void 0 ? void 0 : lastItem.video) === null || _0 === void 0 ? void 0 : _0.itemId })), { themeTag: themeTag.current }), ((globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) && !isEditor && { pageNum })));
150
161
  setRtcList(rtcList.concat(getFilterRecList(data)));
151
162
  setCacheRtcList(cacheRtcList.concat(getFilterRecList(data)));
152
163
  }), [getRecommendVideos, rtcList, waterFallData, cacheRtcList]);
@@ -158,7 +169,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
158
169
  userInfo = {};
159
170
  }
160
171
  const sessionID = (0, sessionStore_1.storeAndLoadFeSessionId)();
161
- const ef = Object.assign(Object.assign({ sessionID, rtc: curReqInfo.rtc, requestId: curReqInfo.requestId }, eventInfo), { sxpDevice: (0, tool_1.getDevice)(), sxpSystem: (0, tool_1.getSystem)(), sxpBrowser: (0, tool_1.getBrowserInfo)() });
172
+ const ef = Object.assign(Object.assign(Object.assign(Object.assign({ sessionID, rtc: curReqInfo.rtc, requestId: curReqInfo.requestId }, eventInfo), ((0, tool_1.getDevice)() && { sxpDevice: (0, tool_1.getDevice)() })), ((0, tool_1.getSystem)() && { sxpSystem: (0, tool_1.getSystem)() })), ((0, tool_1.getBrowserInfo)() && { sxpBrowser: (0, tool_1.getBrowserInfo)() }));
162
173
  const realUserInfo = Object.entries(userInfo).map(([k, v]) => ({ name: k, value: v }));
163
174
  const realEventInfo = Object.entries(ef)
164
175
  .map(([k, v]) => v && { name: k, value: v })
@@ -174,24 +185,21 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
174
185
  });
175
186
  }, [bffFetch, curReqInfo, enableReportEvent, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview]);
176
187
  const bffFbReport = (0, react_1.useCallback)((_a) => {
177
- var _b, _c;
188
+ var _b, _c, _d;
178
189
  var { eventName, actionSource = 'website', eventSourceUrl = (_b = window === null || window === void 0 ? void 0 : window.location) === null || _b === void 0 ? void 0 : _b.href, externalId } = _a;
179
190
  if (!enableReportEvent || !enabledMetaConversionApi || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview)) {
180
191
  return;
181
192
  }
182
193
  const fakeUserId = (0, localStore_1.storeAndLoadFeUserId)();
194
+ const urlParams = new URLSearchParams(window.location.search);
195
+ const fbclid = urlParams.get('fbclid');
183
196
  return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/fb/events', {
184
197
  method: 'POST',
185
198
  body: {
186
199
  eventName,
187
200
  actionSource,
188
201
  eventSourceUrl,
189
- userData: {
190
- externalId: fakeUserId,
191
- fbc: `fb.2.${new Date().getTime()}.${(0, tool_1.getCookie)('_fbc')}`,
192
- fbp: `fb.2.${new Date().getTime()}.${(0, tool_1.getCookie)('_fbp')}`,
193
- client_user_agent: (_c = window === null || window === void 0 ? void 0 : window.navigator) === null || _c === void 0 ? void 0 : _c.userAgent
194
- }
202
+ userData: Object.assign(Object.assign(Object.assign({ externalId: fakeUserId }, (fbclid && { fbc: `fb.2.${new Date().getTime()}.${fbclid}` })), ((0, tool_1.getCookie)('_fbp') && { fbp: `fb.2.${new Date().getTime()}.${(0, tool_1.getCookie)('_fbp')}` })), { client_user_agent: (_d = (_c = window === null || window === void 0 ? void 0 : window.navigator) === null || _c === void 0 ? void 0 : _c.userAgent) !== null && _d !== void 0 ? _d : '' })
195
203
  },
196
204
  type: 'beacon'
197
205
  });
@@ -209,17 +217,17 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
209
217
  return res === null || res === void 0 ? void 0 : res.success;
210
218
  }), [bffFetch]);
211
219
  const bffGetTagList = (0, react_1.useCallback)(() => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
212
- var _u, _v, _w, _x, _y;
220
+ var _1, _2, _3, _4, _5;
213
221
  if (!utmVal || !isShowTag)
214
222
  return;
215
223
  try {
216
- const val = (_w = (_v = (_u = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _u === void 0 ? void 0 : _u.filter((val) => {
224
+ const val = (_3 = (_2 = (_1 = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _1 === void 0 ? void 0 : _1.filter((val) => {
217
225
  var _a, _b;
218
226
  const key = val.split('=')[0];
219
227
  return (_b = ((_a = utmParameter === null || utmParameter === void 0 ? void 0 : utmParameter.channels) !== null && _a !== void 0 ? _a : [])) === null || _b === void 0 ? void 0 : _b.includes(key);
220
- })) === null || _v === void 0 ? void 0 : _v.join('&')) !== null && _w !== void 0 ? _w : '';
228
+ })) === null || _2 === void 0 ? void 0 : _2.join('&')) !== null && _3 !== void 0 ? _3 : '';
221
229
  const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
222
- setTagList((_y = (_x = result === null || result === void 0 ? void 0 : result.data) === null || _x === void 0 ? void 0 : _x.tags) !== null && _y !== void 0 ? _y : []);
230
+ setTagList((_5 = (_4 = result === null || result === void 0 ? void 0 : result.data) === null || _4 === void 0 ? void 0 : _4.tags) !== null && _5 !== void 0 ? _5 : []);
223
231
  }
224
232
  catch (e) {
225
233
  console.log('e', e);
@@ -281,8 +289,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
281
289
  bffGetTagList();
282
290
  getRecommendVideos()
283
291
  .then((data) => {
284
- setRtcList(getFilterRecList(data));
285
- setCacheRtcList(getFilterRecList(data));
292
+ if (data) {
293
+ setRtcList(getFilterRecList(data));
294
+ setCacheRtcList(getFilterRecList(data));
295
+ }
286
296
  })
287
297
  .finally(() => {
288
298
  bffEventReport({
@@ -292,23 +302,30 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
292
302
  }
293
303
  });
294
304
  setLoading(false);
295
- isInit.current = true;
296
305
  });
297
306
  }, [isShowConsent]);
298
307
  (0, react_1.useEffect)(() => {
299
- if (!isInit.current && !isEditor)
308
+ if (!isPreview)
300
309
  return;
301
310
  setLoading(true);
302
311
  bffGetTagList();
303
312
  getRecommendVideos()
304
313
  .then((data) => {
305
- setRtcList(getFilterRecList(data));
306
- setCacheRtcList(getFilterRecList(data));
314
+ if (data) {
315
+ setRtcList(getFilterRecList(data));
316
+ setCacheRtcList(getFilterRecList(data));
317
+ }
307
318
  })
308
319
  .finally(() => {
320
+ bffEventReport({
321
+ eventInfo: {
322
+ eventSubject: 'apiRequest',
323
+ eventDescription: 'api request succeed'
324
+ }
325
+ });
309
326
  setLoading(false);
310
327
  });
311
- }, [bffGetTagList, isEditor, getRecommendVideos]);
328
+ }, [getRecommendVideos, bffGetTagList]);
312
329
  const defaultLoadingImage = (0, useIconLink_1.useIconLink)('/pb_static/a65d23c5893c49d7aaaa81681d3179e2.gif', appDomain);
313
330
  return (react_1.default.createElement(exports.SxpDataSourceContext.Provider, { value: {
314
331
  rtcList,
@@ -356,7 +373,8 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
356
373
  setSelectTag,
357
374
  globalConfig,
358
375
  popupCurTimeRef,
359
- checkCommodityIndexRef
376
+ checkCommodityIndexRef,
377
+ isEditor
360
378
  } }, isShowConsent ? (react_1.default.createElement(Consent_1.default, Object.assign({}, (_c = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consent) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item) === null || _c === void 0 ? void 0 : _c.props))) : (render({
361
379
  rtcList,
362
380
  mutateLike: bffMutateLike,
@@ -7,8 +7,8 @@ interface IfontType {
7
7
  'fontFamily-en': string;
8
8
  }
9
9
  export declare const setFontForText: (textContent?: string | null, style?: IfontType | any) => string;
10
- declare function getBrowserInfo(): string;
11
- declare function getSystem(): string;
12
- declare function getDevice(): string;
10
+ declare function getBrowserInfo(): string | null;
11
+ declare function getSystem(): string | null;
12
+ declare function getDevice(): string | null;
13
13
  declare function getCookie(val: string): string;
14
14
  export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie };
@@ -100,7 +100,7 @@ function getBrowserInfo() {
100
100
  var _a, _b, _c, _d, _e, _f, _g;
101
101
  let userAgent = self.navigator.userAgent;
102
102
  if (!userAgent)
103
- return 'Unknown';
103
+ return null;
104
104
  if (/edge\/([\d\.]+)/i.exec(userAgent))
105
105
  return `Edge ${(_a = /edge\/([\d\.]+)/i.exec(userAgent)) === null || _a === void 0 ? void 0 : _a[1]}`;
106
106
  if (/edg\/([\d\.]+)/i.exec(userAgent))
@@ -115,14 +115,14 @@ function getBrowserInfo() {
115
115
  return `Firefox ${(_f = /firefox\/([\d\.]+)/i.exec(userAgent)) === null || _f === void 0 ? void 0 : _f[1]}`;
116
116
  if (/safari/i.test(userAgent))
117
117
  return `Safari ${(_g = /version\/([\d\.]+)/i.exec(userAgent)) === null || _g === void 0 ? void 0 : _g[1]}`;
118
- return 'Unknown';
118
+ return null;
119
119
  }
120
120
  exports.getBrowserInfo = getBrowserInfo;
121
121
  function getSystem() {
122
122
  var _a, _b, _c;
123
123
  let userAgent = self.navigator.userAgent;
124
124
  if (!userAgent)
125
- return 'Unknown';
125
+ return null;
126
126
  if (/iphone/i.test(userAgent))
127
127
  return `IOS ${(_a = userAgent.match(/OS\s(.*?)\slike/)) === null || _a === void 0 ? void 0 : _a[1]}`;
128
128
  if (/android/i.test(userAgent))
@@ -131,13 +131,13 @@ function getSystem() {
131
131
  return `Windows ${(_c = userAgent.match(/Windows\s(.*?)\;/)) === null || _c === void 0 ? void 0 : _c[1]}`;
132
132
  if (/mac/i.test(userAgent))
133
133
  return `Mac OS`;
134
- return 'Unknown';
134
+ return null;
135
135
  }
136
136
  exports.getSystem = getSystem;
137
137
  function getDevice() {
138
138
  let userAgent = self.navigator.userAgent;
139
139
  if (!userAgent)
140
- return 'Unknown';
140
+ return null;
141
141
  if (/iphone/i.test(userAgent))
142
142
  return `iPhone`;
143
143
  if (/android/i.test(userAgent)) {
@@ -152,7 +152,7 @@ function getDevice() {
152
152
  return `Windows`;
153
153
  if (/mac/i.test(userAgent))
154
154
  return `Mac`;
155
- return 'Unknown';
155
+ return null;
156
156
  }
157
157
  exports.getDevice = getDevice;
158
158
  function getCookie(val) {
@@ -8,7 +8,9 @@ export interface IHashTagProps {
8
8
  hashTagDesc: CSSProperties;
9
9
  hashTagLink: CSSProperties;
10
10
  title: CSSProperties;
11
- price: CSSProperties;
11
+ price: CSSProperties & {
12
+ enableFormattedPrice?: boolean;
13
+ };
12
14
  };
13
15
  buttonBgStyle: CSSProperties;
14
16
  showBanner?: boolean;
@@ -61,6 +61,13 @@ declare const _default: ({
61
61
  name?: undefined;
62
62
  initialValue?: undefined;
63
63
  child?: undefined;
64
+ } | {
65
+ label: string;
66
+ type: string;
67
+ name: string[];
68
+ initialValue: boolean;
69
+ options?: undefined;
70
+ child?: undefined;
64
71
  })[];
65
72
  }[];
66
73
  } | {
@@ -105,6 +105,12 @@ exports.default = [
105
105
  {
106
106
  label: '间距',
107
107
  type: 'TextSpace'
108
+ },
109
+ {
110
+ label: '价格千分符展示',
111
+ type: 'Switch',
112
+ name: ['enableFormattedPrice'],
113
+ initialValue: true
108
114
  }
109
115
  ]
110
116
  }
@@ -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, _0, _1, _2;
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 = isPost ? (_w = data === null || data === void 0 ? void 0 : data.product) === null || _w === void 0 ? void 0 : _w.remark : (_y = (_x = data === null || data === void 0 ? void 0 : data.video) === null || _x === void 0 ? void 0 : _x.bindProduct) === null || _y === void 0 ? void 0 : _y.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 && ((_z = product === null || product === void 0 ? void 0 : product.homePage) === null || _z === void 0 ? void 0 : _z.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, (_0 = product === null || product === void 0 ? void 0 : product.homePage) === null || _0 === void 0 ? void 0 : _0.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
+ !((_1 = product === null || product === void 0 ? void 0 : product.homePage) === null || _1 === void 0 ? void 0 : _1.length) && (react_1.default.createElement("div", { className: (0, css_1.css)({
166
166
  height,
167
167
  width
168
168
  }) },
@@ -170,21 +170,19 @@ 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' }))),
174
- (iframeUrl && iframeIcon) ||
175
- (!product && iframeIcon && (react_1.default.createElement("div", { style: {
176
- padding: '5px 10px',
177
- display: 'flex',
178
- alignItems: 'center',
179
- position: 'absolute',
180
- right: '10px',
181
- bottom: '10px',
182
- zIndex: 1,
183
- background: '#fff',
184
- borderRadius: '3px'
185
- }, onClick: () => setShow3DModal(true) },
186
- react_1.default.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } }),
187
- react_1.default.createElement("span", { style: { fontSize: '12px' } }, "Try in 3D"))))),
173
+ }), src: (_2 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _2 !== void 0 ? _2 : bottom_image, alt: 'pdp image' }))),
174
+ (iframeUrl || !product) && iframeIcon && (react_1.default.createElement("div", { style: {
175
+ padding: '5px 10px',
176
+ display: 'flex',
177
+ alignItems: 'center',
178
+ position: 'absolute',
179
+ right: '10px',
180
+ bottom: '10px',
181
+ zIndex: 1,
182
+ background: '#fff',
183
+ borderRadius: '3px'
184
+ }, onClick: () => setShow3DModal(true) },
185
+ react_1.default.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } })))),
188
186
  renderCommodityGroup(),
189
187
  react_1.default.createElement("div", { className: 'pb-commondity-content' }, renderContent({ isPost }))),
190
188
  renderBtn(),
@@ -192,11 +190,12 @@ const CommodityDetail = (_a) => {
192
190
  react_1.default.createElement("div", { style: { paddingBottom: '80px' } }, renderContent({ isPost: false })),
193
191
  renderBtn()),
194
192
  react_1.default.createElement(Modal_1.default, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
195
- react_1.default.createElement("iframe", { src: iframeUrl, style: {
196
- width: '100%',
197
- height: 'calc(100% - 50px)',
198
- marginTop: '40px',
199
- border: 'none'
200
- } }))));
193
+ react_1.default.createElement("div", { style: { height: '100vh' } },
194
+ react_1.default.createElement("iframe", { src: iframeUrl, style: {
195
+ width: '100%',
196
+ height: isTel ? `${664 - 40}px` : `calc(100vh - 40px)`,
197
+ marginTop: '40px',
198
+ border: 'none'
199
+ } })))));
201
200
  };
202
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;
@@ -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 CommodityDetailDiroNew = (_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, _6, _7, _8, _9;
18
- var { style, isDefault, rec, viewTime, isPost, bottom_image, tipText, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio } = _a, props = tslib_1.__rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "tipText", "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, _0, _1, _2, _3, _4, _5, _6;
18
+ var { style, isDefault, rec, viewTime, isPost, bottom_image, tipText, swiper, commodityStyles, buttonStyle, index, commodityGroup, popupBg, iframeIcon, commodityImgRatio, isTel } = _a, props = tslib_1.__rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "tipText", "swiper", "commodityStyles", "buttonStyle", "index", "commodityGroup", "popupBg", "iframeIcon", "commodityImgRatio", "isTel"]);
19
19
  const [spread, setSpread] = (0, react_1.useState)(true);
20
20
  const { sxpParameter, popupCurTimeRef, popupDetailData, isPreview, bffFbReport, checkCommodityIndexRef } = (0, hooks_1.useSxpDataSource)();
21
21
  const { jumpToWeb, productView } = (0, useEventReport_1.useEventReport)();
@@ -119,17 +119,17 @@ Made in Italy` })));
119
119
  };
120
120
  return dotsAlignClass === null || dotsAlignClass === void 0 ? void 0 : dotsAlignClass[swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign];
121
121
  }, [swiper === null || swiper === void 0 ? void 0 : swiper.dotsAlign]);
122
- 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);
122
+ const iframeUrl = isPost ? (_w = data === null || data === void 0 ? void 0 : data.product) === null || _w === void 0 ? void 0 : _w.remark : (_y = (_x = data === null || data === void 0 ? void 0 : data.video) === null || _x === void 0 ? void 0 : _x.bindProduct) === null || _y === void 0 ? void 0 : _y.remark;
123
123
  return (react_1.default.createElement("div", { className: 'pb-commondityDiroNew' },
124
124
  react_1.default.createElement("div", Object.assign({ className: (0, css_1.css)(Object.assign(Object.assign({}, style), { transform: 'translate3d(0px, 0px, 0px)' })) }, props),
125
125
  react_1.default.createElement("div", { style: { position: 'relative' } },
126
- 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: {
126
+ product && ((_z = product === null || product === void 0 ? void 0 : product.homePage) === null || _z === void 0 ? void 0 : _z.length) > 0 && (react_1.default.createElement(react_2.Swiper, { height: height, modules: [modules_1.Pagination, modules_1.Autoplay], pagination: {
127
127
  clickable: true,
128
128
  bulletActiveClass: 'commondityDiroNew-swipe-item-active-bullet',
129
129
  clickableClass: getDotsAlign
130
130
  }, loop: true, autoplay: {
131
131
  delay: (swiper === null || swiper === void 0 ? void 0 : swiper.delay) * 1000
132
- }, ref: ref }, (_3 = product === null || product === void 0 ? void 0 : product.homePage) === null || _3 === void 0 ? void 0 : _3.map((src) => {
132
+ }, ref: ref }, (_0 = product === null || product === void 0 ? void 0 : product.homePage) === null || _0 === void 0 ? void 0 : _0.map((src) => {
133
133
  var _a;
134
134
  return (react_1.default.createElement(react_2.SwiperSlide, { key: src },
135
135
  react_1.default.createElement("div", { style: {
@@ -145,7 +145,7 @@ Made in Italy` })));
145
145
  objectPosition: `50% ${(swiper === null || swiper === void 0 ? void 0 : swiper.translateY) ? (swiper === null || swiper === void 0 ? void 0 : swiper.translateY) + 50 : 50}%`
146
146
  }, 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 }))));
147
147
  }))),
148
- !((_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)({
148
+ !((_1 = product === null || product === void 0 ? void 0 : product.homePage) === null || _1 === void 0 ? void 0 : _1.length) && (react_1.default.createElement("div", { className: (0, css_1.css)({
149
149
  height,
150
150
  width
151
151
  }) },
@@ -153,27 +153,25 @@ Made in Italy` })));
153
153
  objectFit: 'cover',
154
154
  width: '100%',
155
155
  height: '100%'
156
- }), src: (_5 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _5 !== void 0 ? _5 : bottom_image, alt: 'pdp image' }))),
157
- (iframeUrl && iframeIcon) ||
158
- (!product && iframeIcon && (react_1.default.createElement("div", { style: {
159
- padding: '5px 10px',
160
- display: 'flex',
161
- alignItems: 'center',
162
- position: 'absolute',
163
- right: '10px',
164
- bottom: '10px',
165
- zIndex: 1,
166
- background: '#fff',
167
- borderRadius: '3px'
168
- }, onClick: () => setShow3DModal(true) },
169
- react_1.default.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } }),
170
- react_1.default.createElement("span", { style: { fontSize: '12px' } }, "Try in 3D"))))),
156
+ }), src: (_2 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _2 !== void 0 ? _2 : bottom_image, alt: 'pdp image' }))),
157
+ (iframeUrl || !product) && iframeIcon && (react_1.default.createElement("div", { style: {
158
+ padding: '5px 10px',
159
+ display: 'flex',
160
+ alignItems: 'center',
161
+ position: 'absolute',
162
+ right: '10px',
163
+ bottom: '10px',
164
+ zIndex: 1,
165
+ background: '#fff',
166
+ borderRadius: '3px'
167
+ }, onClick: () => setShow3DModal(true) },
168
+ react_1.default.createElement("img", { src: iframeIcon, alt: '3d', width: '20px', height: '20px', style: { marginRight: '5px' } })))),
171
169
  renderCommodityGroup(),
172
170
  react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content' },
173
171
  react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top' },
174
172
  react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top-left' },
175
173
  react_1.default.createElement("div", { className: 'pb-commondityDiroNew-content-top-left-title', style: getStyle(commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title), dangerouslySetInnerHTML: {
176
- __html: (0, tool_1.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)
174
+ __html: (0, tool_1.setFontForText)((_3 = product === null || product === void 0 ? void 0 : product.title) !== null && _3 !== void 0 ? _3 : 'Large Dior Toujours BagLarge', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.title)
177
175
  } }),
178
176
  react_1.default.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: {
179
177
  __html: (0, tool_1.setFontForText)((product === null || product === void 0 ? void 0 : product.collection) || 'Black Macrocannage CalfskinLarge', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.collection)
@@ -183,20 +181,21 @@ Made in Italy` })));
183
181
  __html: (0, tool_1.setFontForText)(priceText, commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price)
184
182
  } }),
185
183
  react_1.default.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: {
186
- __html: (0, tool_1.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)
184
+ __html: (0, tool_1.setFontForText)((_4 = product === null || product === void 0 ? void 0 : product.taxInfo) !== null && _4 !== void 0 ? _4 : '税费', commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.taxInfo)
187
185
  } }))),
188
- (!product || (product === null || product === void 0 ? void 0 : product.link)) && (react_1.default.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 },
186
+ (!product || (product === null || product === void 0 ? void 0 : product.link)) && (react_1.default.createElement("button", { "aria-label": (_5 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _5 !== void 0 ? _5 : 'Shop now', onClick: handleLink, className: 'pb-commondityDiroNew-btn', style: buttonStyle },
189
187
  react_1.default.createElement("span", { dangerouslySetInnerHTML: {
190
- __html: (0, tool_1.setFontForText)((_9 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _9 !== void 0 ? _9 : 'Shop now', buttonStyle)
188
+ __html: (0, tool_1.setFontForText)((_6 = cta === null || cta === void 0 ? void 0 : cta.enTitle) !== null && _6 !== void 0 ? _6 : 'Shop now', buttonStyle)
191
189
  } }))),
192
190
  productInfoText({ isPost }))),
193
191
  react_1.default.createElement(Modal_1.default, { visible: showModal, onClose: () => setShowModal(false) }, productInfoText({ isPost: false })),
194
192
  react_1.default.createElement(Modal_1.default, { visible: show3DModal, padding: 0, isFullScreen: true, onClose: () => setShow3DModal(false) },
195
- react_1.default.createElement("iframe", { src: iframeUrl, style: {
196
- width: '100%',
197
- height: 'calc(100% - 50px)',
198
- marginTop: '40px',
199
- border: 'none'
200
- } }))));
193
+ react_1.default.createElement("div", { style: { height: '100vh' } },
194
+ react_1.default.createElement("iframe", { src: iframeUrl, style: {
195
+ width: '100%',
196
+ height: isTel ? `${664 - 40}px` : `calc(100vh - 40px)`,
197
+ marginTop: '40px',
198
+ border: 'none'
199
+ } })))));
201
200
  };
202
201
  exports.default = (0, react_1.memo)(CommodityDetailDiroNew);
@@ -16,7 +16,9 @@ export interface ICommodityListProps {
16
16
  commodityStyles?: {
17
17
  title: CSSProperties;
18
18
  collection: CSSProperties;
19
- price: CSSProperties;
19
+ price: CSSProperties & {
20
+ enableFormattedPrice?: boolean;
21
+ };
20
22
  };
21
23
  buttonStyle?: CSSProperties;
22
24
  translateY?: number;
@@ -10,7 +10,7 @@ const tool_1 = require("../../../../core/utils/tool");
10
10
  const Img_1 = tslib_1.__importDefault(require("../../template/components/Img"));
11
11
  const lodash_1 = require("lodash");
12
12
  const CommodityList = (_a) => {
13
- var _b, _c;
13
+ var _b, _c, _d;
14
14
  var { style, isDefault, rec, viewTime, isPost, bottom_image, commodityStyles, buttonStyle, translateY = 0, commodityPicture, isExternalLink, onClick } = _a, props = tslib_1.__rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "commodityStyles", "buttonStyle", "translateY", "commodityPicture", "isExternalLink", "onClick"]);
15
15
  const { sxpParameter, popupDetailData, setPopupDetailData, ctaEvent } = (0, hooks_1.useSxpDataSource)();
16
16
  const { jumpToWeb } = (0, useEventReport_1.useEventReport)();
@@ -19,16 +19,20 @@ const CommodityList = (_a) => {
19
19
  const product = (_c = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProducts) !== null && _c !== void 0 ? _c : [null, null, null, null];
20
20
  const index = popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.index;
21
21
  const priceText = (0, react_1.useCallback)((product) => {
22
- var _a, _b, _c, _d, _e;
22
+ var _a, _b, _c, _d, _e, _f, _g;
23
+ const isToLocStr = ((_a = commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price) === null || _a === void 0 ? void 0 : _a.enableFormattedPrice) === undefined || ((_b = commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price) === null || _b === void 0 ? void 0 : _b.enableFormattedPrice);
23
24
  if ((product === null || product === void 0 ? void 0 : product.currency) && (product === null || product === void 0 ? void 0 : product.price)) {
24
- return `${(_c = (_b = (_a = product === null || product === void 0 ? void 0 : product.currency) === null || _a === void 0 ? void 0 : _a.split('-')[1]) === null || _b === void 0 ? void 0 : _b.toUpperCase()) !== null && _c !== void 0 ? _c : ''}${(_e = (_d = product === null || product === void 0 ? void 0 : product.price) === null || _d === void 0 ? void 0 : _d.toLocaleString('zh', {
25
- minimumFractionDigits: 0
26
- })) !== null && _e !== void 0 ? _e : ''}`;
25
+ return `${(_e = (_d = (_c = product === null || product === void 0 ? void 0 : product.currency) === null || _c === void 0 ? void 0 : _c.split('-')[1]) === null || _d === void 0 ? void 0 : _d.toUpperCase()) !== null && _e !== void 0 ? _e : ''}${isToLocStr
26
+ ? (_g = (_f = product === null || product === void 0 ? void 0 : product.price) === null || _f === void 0 ? void 0 : _f.toLocaleString('zh', {
27
+ minimumFractionDigits: 0
28
+ })) !== null && _g !== void 0 ? _g : ''
29
+ : product === null || product === void 0 ? void 0 : product.price}`;
27
30
  }
28
31
  else {
29
- return '$7,000';
32
+ const p = 7000;
33
+ return `$${isToLocStr ? p === null || p === void 0 ? void 0 : p.toLocaleString() : p}`;
30
34
  }
31
- }, []);
35
+ }, [(_d = commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price) === null || _d === void 0 ? void 0 : _d.enableFormattedPrice]);
32
36
  const handleClick = (0, lodash_1.throttle)((item, multiCheckIndex) => {
33
37
  ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
34
38
  eventSubject: 'clickCta',