pb-sxp-ui 1.3.1 → 1.3.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +190 -146
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +190 -146
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +3 -3
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +3 -3
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +190 -146
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +3 -3
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/SxpPageRender/Modal/index.js +3 -3
- package/es/core/components/SxpPageRender/RenderCard.d.ts +3 -3
- package/es/core/components/SxpPageRender/RenderCard.js +17 -27
- package/es/core/components/SxpPageRender/WaterFall/List.js +20 -11
- package/es/core/components/SxpPageRender/WaterFall/WaterfallList.js +20 -11
- package/es/core/components/SxpPageRender/index.js +14 -10
- package/es/core/context/EditorDataProvider.d.ts +3 -0
- package/es/core/context/EditorDataProvider.js +2 -1
- package/es/core/context/SxpDataSourceProvider.d.ts +1 -0
- package/es/core/context/SxpDataSourceProvider.js +43 -31
- package/es/core/utils/tool.d.ts +3 -3
- package/es/core/utils/tool.js +6 -6
- package/es/materials/sxp/HashTag/index.d.ts +3 -1
- package/es/materials/sxp/HashTag/settingRender.d.ts +7 -0
- package/es/materials/sxp/HashTag/settingRender.js +6 -0
- package/es/materials/sxp/popup/CommodityDetail/index.js +13 -14
- package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +13 -14
- package/es/materials/sxp/popup/CommodityList/index.d.ts +3 -1
- package/es/materials/sxp/popup/CommodityList/index.js +11 -7
- package/es/materials/sxp/popup/CommodityList/settingRender.d.ts +7 -0
- package/es/materials/sxp/popup/CommodityList/settingRender.js +6 -0
- package/es/materials/sxp/popup/Iframe/index.d.ts +1 -0
- package/es/materials/sxp/popup/Iframe/index.js +8 -7
- package/lib/core/components/SxpPageRender/Modal/index.js +3 -3
- package/lib/core/components/SxpPageRender/RenderCard.d.ts +3 -3
- package/lib/core/components/SxpPageRender/RenderCard.js +16 -26
- package/lib/core/components/SxpPageRender/WaterFall/List.js +20 -11
- package/lib/core/components/SxpPageRender/WaterFall/WaterfallList.js +20 -11
- package/lib/core/components/SxpPageRender/index.js +14 -10
- package/lib/core/context/EditorDataProvider.d.ts +3 -0
- package/lib/core/context/EditorDataProvider.js +2 -1
- package/lib/core/context/SxpDataSourceProvider.d.ts +1 -0
- package/lib/core/context/SxpDataSourceProvider.js +43 -31
- package/lib/core/utils/tool.d.ts +3 -3
- package/lib/core/utils/tool.js +6 -6
- package/lib/materials/sxp/HashTag/index.d.ts +3 -1
- package/lib/materials/sxp/HashTag/settingRender.d.ts +7 -0
- package/lib/materials/sxp/HashTag/settingRender.js +6 -0
- package/lib/materials/sxp/popup/CommodityDetail/index.js +13 -14
- package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +13 -14
- package/lib/materials/sxp/popup/CommodityList/index.d.ts +3 -1
- package/lib/materials/sxp/popup/CommodityList/index.js +11 -7
- package/lib/materials/sxp/popup/CommodityList/settingRender.d.ts +7 -0
- package/lib/materials/sxp/popup/CommodityList/settingRender.js +6 -0
- package/lib/materials/sxp/popup/Iframe/index.d.ts +1 -0
- package/lib/materials/sxp/popup/Iframe/index.js +8 -7
- package/package.json +1 -1
package/es/core/utils/tool.js
CHANGED
@@ -92,7 +92,7 @@ function getBrowserInfo() {
|
|
92
92
|
var _a, _b, _c, _d, _e, _f, _g;
|
93
93
|
let userAgent = self.navigator.userAgent;
|
94
94
|
if (!userAgent)
|
95
|
-
return
|
95
|
+
return null;
|
96
96
|
if (/edge\/([\d\.]+)/i.exec(userAgent))
|
97
97
|
return `Edge ${(_a = /edge\/([\d\.]+)/i.exec(userAgent)) === null || _a === void 0 ? void 0 : _a[1]}`;
|
98
98
|
if (/edg\/([\d\.]+)/i.exec(userAgent))
|
@@ -107,13 +107,13 @@ function getBrowserInfo() {
|
|
107
107
|
return `Firefox ${(_f = /firefox\/([\d\.]+)/i.exec(userAgent)) === null || _f === void 0 ? void 0 : _f[1]}`;
|
108
108
|
if (/safari/i.test(userAgent))
|
109
109
|
return `Safari ${(_g = /version\/([\d\.]+)/i.exec(userAgent)) === null || _g === void 0 ? void 0 : _g[1]}`;
|
110
|
-
return
|
110
|
+
return null;
|
111
111
|
}
|
112
112
|
function getSystem() {
|
113
113
|
var _a, _b, _c;
|
114
114
|
let userAgent = self.navigator.userAgent;
|
115
115
|
if (!userAgent)
|
116
|
-
return
|
116
|
+
return null;
|
117
117
|
if (/iphone/i.test(userAgent))
|
118
118
|
return `IOS ${(_a = userAgent.match(/OS\s(.*?)\slike/)) === null || _a === void 0 ? void 0 : _a[1]}`;
|
119
119
|
if (/android/i.test(userAgent))
|
@@ -122,12 +122,12 @@ function getSystem() {
|
|
122
122
|
return `Windows ${(_c = userAgent.match(/Windows\s(.*?)\;/)) === null || _c === void 0 ? void 0 : _c[1]}`;
|
123
123
|
if (/mac/i.test(userAgent))
|
124
124
|
return `Mac OS`;
|
125
|
-
return
|
125
|
+
return null;
|
126
126
|
}
|
127
127
|
function getDevice() {
|
128
128
|
let userAgent = self.navigator.userAgent;
|
129
129
|
if (!userAgent)
|
130
|
-
return
|
130
|
+
return null;
|
131
131
|
if (/iphone/i.test(userAgent))
|
132
132
|
return `iPhone`;
|
133
133
|
if (/android/i.test(userAgent)) {
|
@@ -142,7 +142,7 @@ function getDevice() {
|
|
142
142
|
return `Windows`;
|
143
143
|
if (/mac/i.test(userAgent))
|
144
144
|
return `Mac`;
|
145
|
-
return
|
145
|
+
return null;
|
146
146
|
}
|
147
147
|
function getCookie(val) {
|
148
148
|
const cookies = document.cookie;
|
@@ -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
|
} | {
|
@@ -169,20 +169,19 @@ const CommodityDetail = (_a) => {
|
|
169
169
|
width: '100%',
|
170
170
|
height: '100%'
|
171
171
|
}), src: (_5 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _5 !== void 0 ? _5 : bottom_image, alt: 'pdp image' }))),
|
172
|
-
(iframeUrl && iframeIcon
|
173
|
-
|
174
|
-
|
175
|
-
|
176
|
-
|
177
|
-
|
178
|
-
|
179
|
-
|
180
|
-
|
181
|
-
|
182
|
-
|
183
|
-
|
184
|
-
|
185
|
-
React.createElement("span", { style: { fontSize: '12px' } }, "Try in 3D"))))),
|
172
|
+
(iframeUrl || !product) && iframeIcon && (React.createElement("div", { style: {
|
173
|
+
padding: '5px 10px',
|
174
|
+
display: 'flex',
|
175
|
+
alignItems: 'center',
|
176
|
+
position: 'absolute',
|
177
|
+
right: '10px',
|
178
|
+
bottom: '10px',
|
179
|
+
zIndex: 1,
|
180
|
+
background: '#fff',
|
181
|
+
borderRadius: '3px'
|
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")))),
|
186
185
|
renderCommodityGroup(),
|
187
186
|
React.createElement("div", { className: 'pb-commondity-content' }, renderContent({ isPost }))),
|
188
187
|
renderBtn(),
|
@@ -152,20 +152,19 @@ Made in Italy` })));
|
|
152
152
|
width: '100%',
|
153
153
|
height: '100%'
|
154
154
|
}), src: (_5 = sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _5 !== void 0 ? _5 : bottom_image, alt: 'pdp image' }))),
|
155
|
-
(iframeUrl && iframeIcon
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
React.createElement("span", { style: { fontSize: '12px' } }, "Try in 3D"))))),
|
155
|
+
(iframeUrl || !product) && iframeIcon && (React.createElement("div", { style: {
|
156
|
+
padding: '5px 10px',
|
157
|
+
display: 'flex',
|
158
|
+
alignItems: 'center',
|
159
|
+
position: 'absolute',
|
160
|
+
right: '10px',
|
161
|
+
bottom: '10px',
|
162
|
+
zIndex: 1,
|
163
|
+
background: '#fff',
|
164
|
+
borderRadius: '3px'
|
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")))),
|
169
168
|
renderCommodityGroup(),
|
170
169
|
React.createElement("div", { className: 'pb-commondityDiroNew-content' },
|
171
170
|
React.createElement("div", { className: 'pb-commondityDiroNew-content-top' },
|
@@ -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;
|
@@ -8,7 +8,7 @@ import { setFontForText } from '../../../../core/utils/tool';
|
|
8
8
|
import Img from '../../template/components/Img';
|
9
9
|
import { throttle } from 'lodash';
|
10
10
|
const CommodityList = (_a) => {
|
11
|
-
var _b, _c;
|
11
|
+
var _b, _c, _d;
|
12
12
|
var { style, isDefault, rec, viewTime, isPost, bottom_image, commodityStyles, buttonStyle, translateY = 0, commodityPicture, isExternalLink, onClick } = _a, props = __rest(_a, ["style", "isDefault", "rec", "viewTime", "isPost", "bottom_image", "commodityStyles", "buttonStyle", "translateY", "commodityPicture", "isExternalLink", "onClick"]);
|
13
13
|
const { sxpParameter, popupDetailData, setPopupDetailData, ctaEvent } = useSxpDataSource();
|
14
14
|
const { jumpToWeb } = useEventReport();
|
@@ -17,16 +17,20 @@ const CommodityList = (_a) => {
|
|
17
17
|
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];
|
18
18
|
const index = popupDetailData === null || popupDetailData === void 0 ? void 0 : popupDetailData.index;
|
19
19
|
const priceText = useCallback((product) => {
|
20
|
-
var _a, _b, _c, _d, _e;
|
20
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
21
|
+
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);
|
21
22
|
if ((product === null || product === void 0 ? void 0 : product.currency) && (product === null || product === void 0 ? void 0 : product.price)) {
|
22
|
-
return `${(
|
23
|
-
|
24
|
-
|
23
|
+
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
|
24
|
+
? (_g = (_f = product === null || product === void 0 ? void 0 : product.price) === null || _f === void 0 ? void 0 : _f.toLocaleString('zh', {
|
25
|
+
minimumFractionDigits: 0
|
26
|
+
})) !== null && _g !== void 0 ? _g : ''
|
27
|
+
: product === null || product === void 0 ? void 0 : product.price}`;
|
25
28
|
}
|
26
29
|
else {
|
27
|
-
|
30
|
+
const p = 7000;
|
31
|
+
return `$${isToLocStr ? p === null || p === void 0 ? void 0 : p.toLocaleString() : p}`;
|
28
32
|
}
|
29
|
-
}, []);
|
33
|
+
}, [(_d = commodityStyles === null || commodityStyles === void 0 ? void 0 : commodityStyles.price) === null || _d === void 0 ? void 0 : _d.enableFormattedPrice]);
|
30
34
|
const handleClick = throttle((item, multiCheckIndex) => {
|
31
35
|
ctaEvent === null || ctaEvent === void 0 ? void 0 : ctaEvent({
|
32
36
|
eventSubject: 'clickCta',
|
@@ -95,6 +95,13 @@ declare const _default: ({
|
|
95
95
|
name?: undefined;
|
96
96
|
initialValue?: undefined;
|
97
97
|
child?: undefined;
|
98
|
+
} | {
|
99
|
+
label: string;
|
100
|
+
type: string;
|
101
|
+
name: string[];
|
102
|
+
initialValue: boolean;
|
103
|
+
options?: undefined;
|
104
|
+
child?: undefined;
|
98
105
|
})[];
|
99
106
|
}[];
|
100
107
|
} | {
|
@@ -5,14 +5,15 @@ import './index.less';
|
|
5
5
|
import { useSxpDataSource } from '../../../../core/hooks';
|
6
6
|
const Iframe = (_a) => {
|
7
7
|
var _b, _c;
|
8
|
-
var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick, submitButtonStyle, contentStyle } = _a, props = __rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick", "submitButtonStyle", "contentStyle"]);
|
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({}, style)
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
11
|
+
return (React.createElement("div", Object.assign({ className: `${css(Object.assign(Object.assign({}, style), { height: isTel ? 664 : '100%' }))}` }, props),
|
12
|
+
React.createElement("iframe", { src: iframeUrl, style: {
|
13
|
+
width: '100%',
|
14
|
+
height: 'calc(100% - 50px)',
|
15
|
+
marginTop: '40px',
|
16
|
+
border: 'none'
|
17
|
+
} })));
|
17
18
|
};
|
18
19
|
export default memo(Iframe);
|
@@ -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;
|
10
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
|
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,8 @@ 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: (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),
|
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,
|
134
134
|
overflow: (isScrollFullScreen && modalTrans <= 0) || !isScrollFullScreen ? 'auto' : 'hidden'
|
135
135
|
} }, children)))))), modalEleRef.current);
|
136
136
|
};
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import
|
1
|
+
import { FC } from 'react';
|
2
2
|
import './index.less';
|
3
3
|
import { RecItemType } from './typing';
|
4
4
|
interface IRenderCardProps {
|
@@ -9,5 +9,5 @@ interface IRenderCardProps {
|
|
9
9
|
includesCtaType?: string[];
|
10
10
|
isActive?: boolean;
|
11
11
|
}
|
12
|
-
declare const
|
13
|
-
export default
|
12
|
+
declare const RenderCard: FC<IRenderCardProps>;
|
13
|
+
export default RenderCard;
|
@@ -21,43 +21,33 @@ const RenderCard = ({ rec, index, tempMap, resolver, includesCtaType, isActive }
|
|
21
21
|
cta = (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
|
22
22
|
}
|
23
23
|
const value = tempMap === null || tempMap === void 0 ? void 0 : tempMap[cta];
|
24
|
-
const renderComp = (0, react_1.
|
25
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3
|
24
|
+
const renderComp = (0, react_1.useCallback)(() => {
|
25
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3;
|
26
26
|
if (!(rec === null || rec === void 0 ? void 0 : rec.video))
|
27
27
|
return null;
|
28
|
-
|
29
|
-
if ((_b = (_a = rec === null || rec === void 0 ? void 0 : rec.video) === null || _a === void 0 ? void 0 : _a.bindProducts) === null || _b === void 0 ? void 0 : _b.length) {
|
30
|
-
cta = '多商品CTA';
|
31
|
-
}
|
32
|
-
else if ((_c = rec === null || rec === void 0 ? void 0 : rec.video) === null || _c === void 0 ? void 0 : _c.bindProduct) {
|
33
|
-
cta = '商品CTA';
|
34
|
-
}
|
35
|
-
else {
|
36
|
-
cta = (_e = (_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindCta) === null || _e === void 0 ? void 0 : _e.itemId;
|
37
|
-
}
|
38
|
-
if (includesCtaType && !(includesCtaType === null || includesCtaType === void 0 ? void 0 : includesCtaType.includes((_f = value === null || value === void 0 ? void 0 : value.item) === null || _f === void 0 ? void 0 : _f.type)))
|
28
|
+
if (includesCtaType && !(includesCtaType === null || includesCtaType === void 0 ? void 0 : includesCtaType.includes((_a = value === null || value === void 0 ? void 0 : value.item) === null || _a === void 0 ? void 0 : _a.type)))
|
39
29
|
return;
|
40
|
-
if (!includesCtaType && ((
|
30
|
+
if (!includesCtaType && ((_b = value === null || value === void 0 ? void 0 : value.item) === null || _b === void 0 ? void 0 : _b.category) === 'cta')
|
41
31
|
return;
|
42
|
-
if ((((
|
43
|
-
(((
|
44
|
-
(((
|
45
|
-
(((
|
46
|
-
(((
|
47
|
-
(((
|
32
|
+
if ((((_c = value === null || value === void 0 ? void 0 : value.item) === null || _c === void 0 ? void 0 : _c.type) === 'CommodityDiro' && !((_d = rec === null || rec === void 0 ? void 0 : rec.video) === null || _d === void 0 ? void 0 : _d.bindProduct)) ||
|
33
|
+
(((_e = value === null || value === void 0 ? void 0 : value.item) === null || _e === void 0 ? void 0 : _e.type) === 'Commodity' && !((_f = rec === null || rec === void 0 ? void 0 : rec.video) === null || _f === void 0 ? void 0 : _f.bindProduct)) ||
|
34
|
+
(((_g = value === null || value === void 0 ? void 0 : value.item) === null || _g === void 0 ? void 0 : _g.type) === 'CommodityDiroNew' && !((_h = rec === null || rec === void 0 ? void 0 : rec.video) === null || _h === void 0 ? void 0 : _h.bindProduct)) ||
|
35
|
+
(((_j = value === null || value === void 0 ? void 0 : value.item) === null || _j === void 0 ? void 0 : _j.type) === 'MultiCommodity' && !((_l = (_k = rec === null || rec === void 0 ? void 0 : rec.video) === null || _k === void 0 ? void 0 : _k.bindProducts) === null || _l === void 0 ? void 0 : _l.length)) ||
|
36
|
+
(((_m = value === null || value === void 0 ? void 0 : value.item) === null || _m === void 0 ? void 0 : _m.type) === 'MultiCommodityDiro' && !((_p = (_o = rec === null || rec === void 0 ? void 0 : rec.video) === null || _o === void 0 ? void 0 : _o.bindProducts) === null || _p === void 0 ? void 0 : _p.length)) ||
|
37
|
+
(((_q = value === null || value === void 0 ? void 0 : value.item) === null || _q === void 0 ? void 0 : _q.type) === 'MultiCommodityDiroNew' && !((_s = (_r = rec === null || rec === void 0 ? void 0 : rec.video) === null || _r === void 0 ? void 0 : _r.bindProducts) === null || _s === void 0 ? void 0 : _s.length))) {
|
48
38
|
return null;
|
49
39
|
}
|
50
40
|
if (value && resolver) {
|
51
|
-
const t = resolver[(
|
41
|
+
const t = resolver[(_t = value === null || value === void 0 ? void 0 : value.item) === null || _t === void 0 ? void 0 : _t.type];
|
52
42
|
const Component = (0, withBindDataSource_1.default)(t);
|
53
|
-
const defaulSetting = (
|
54
|
-
const isExternalLink = ((
|
55
|
-
return (react_1.default.createElement(Component, Object.assign({ style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), (
|
43
|
+
const defaulSetting = (_u = t === null || t === void 0 ? void 0 : t.extend) === null || _u === void 0 ? void 0 : _u.defaulSetting;
|
44
|
+
const isExternalLink = ((_x = (_w = (_v = value === null || value === void 0 ? void 0 : value.item) === null || _v === void 0 ? void 0 : _v.event) === null || _w === void 0 ? void 0 : _w.onClick) === null || _x === void 0 ? void 0 : _x.linkType) === 'externalLink';
|
45
|
+
return (react_1.default.createElement(Component, Object.assign({ style: Object.assign(Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.style), (_y = value === null || value === void 0 ? void 0 : value.item) === null || _y === void 0 ? void 0 : _y.style), { zIndex: 50, marginLeft: '20px', boxSizing: 'border-box', transform: 'translate3d(0px, 0px, 0px)' }), textStyle: Object.assign(Object.assign({}, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.textStyle), (_z = value === null || value === void 0 ? void 0 : value.item) === null || _z === void 0 ? void 0 : _z.textStyle), bindDatas: (_1 = (_0 = value === null || value === void 0 ? void 0 : value.item) === null || _0 === void 0 ? void 0 : _0.bindDatas) !== null && _1 !== void 0 ? _1 : [] }, defaulSetting === null || defaulSetting === void 0 ? void 0 : defaulSetting.props, (_2 = value === null || value === void 0 ? void 0 : value.item) === null || _2 === void 0 ? void 0 : _2.props, { event: ((_3 = value === null || value === void 0 ? void 0 : value.item) === null || _3 === void 0 ? void 0 : _3.event) || {}, schema: schema, id: value === null || value === void 0 ? void 0 : value.id, key: value === null || value === void 0 ? void 0 : value.id, recData: rec, isExternalLink: isExternalLink, index: index, isActive: isActive })));
|
56
46
|
}
|
57
47
|
else {
|
58
48
|
return null;
|
59
49
|
}
|
60
50
|
}, [rec, resolver, tempMap, schema, value === null || value === void 0 ? void 0 : value.id, isActive]);
|
61
|
-
return react_1.default.createElement(react_1.default.Fragment, null, renderComp);
|
51
|
+
return react_1.default.createElement(react_1.default.Fragment, null, renderComp());
|
62
52
|
};
|
63
|
-
exports.default =
|
53
|
+
exports.default = RenderCard;
|
@@ -10,6 +10,7 @@ const css_1 = require("@emotion/css");
|
|
10
10
|
const tool_1 = require("../../../../core/utils/tool");
|
11
11
|
const useEventReport_1 = require("../../../../core/hooks/useEventReport");
|
12
12
|
const WaterfallFlowItem = (props) => {
|
13
|
+
var _a;
|
13
14
|
const { rec, index, list, reportTagsView, textStyles, space } = props;
|
14
15
|
const { swiperRef, setRtcList, setOpenHashtag, sxpParameter } = (0, hooks_1.useSxpDataSource)();
|
15
16
|
const [showVideo, setShowVideo] = (0, react_1.useState)(false);
|
@@ -38,16 +39,19 @@ const WaterfallFlowItem = (props) => {
|
|
38
39
|
return ((_a = rec === null || rec === void 0 ? void 0 : rec.product) === null || _a === void 0 ? void 0 : _a.title) || ((_b = rec === null || rec === void 0 ? void 0 : rec.video) === null || _b === void 0 ? void 0 : _b.title) || null;
|
39
40
|
}, [rec]);
|
40
41
|
const priceText = (0, react_1.useMemo)(() => {
|
41
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
42
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
43
|
+
const isToLocStr = ((_a = textStyles === null || textStyles === void 0 ? void 0 : textStyles.price) === null || _a === void 0 ? void 0 : _a.enableFormattedPrice) === undefined || ((_b = textStyles === null || textStyles === void 0 ? void 0 : textStyles.price) === null || _b === void 0 ? void 0 : _b.enableFormattedPrice);
|
44
|
+
if (((_c = rec === null || rec === void 0 ? void 0 : rec.product) === null || _c === void 0 ? void 0 : _c.currency) && ((_d = rec === null || rec === void 0 ? void 0 : rec.product) === null || _d === void 0 ? void 0 : _d.price)) {
|
45
|
+
return `${(_h = (_g = (_f = (_e = rec === null || rec === void 0 ? void 0 : rec.product) === null || _e === void 0 ? void 0 : _e.currency) === null || _f === void 0 ? void 0 : _f.split('-')[1]) === null || _g === void 0 ? void 0 : _g.toUpperCase()) !== null && _h !== void 0 ? _h : ''}${isToLocStr
|
46
|
+
? (_l = (_k = (_j = rec === null || rec === void 0 ? void 0 : rec.product) === null || _j === void 0 ? void 0 : _j.price) === null || _k === void 0 ? void 0 : _k.toLocaleString('zh', {
|
47
|
+
minimumFractionDigits: 0
|
48
|
+
})) !== null && _l !== void 0 ? _l : ''
|
49
|
+
: (_m = rec === null || rec === void 0 ? void 0 : rec.product) === null || _m === void 0 ? void 0 : _m.price}`;
|
46
50
|
}
|
47
51
|
else {
|
48
52
|
return null;
|
49
53
|
}
|
50
|
-
}, [rec]);
|
54
|
+
}, [rec, (_a = textStyles === null || textStyles === void 0 ? void 0 : textStyles.price) === null || _a === void 0 ? void 0 : _a.enableFormattedPrice]);
|
51
55
|
(0, react_1.useEffect)(() => {
|
52
56
|
const observer = new IntersectionObserver((entries) => {
|
53
57
|
entries.forEach((entry) => {
|
@@ -132,22 +136,27 @@ function WaterfallList(_a) {
|
|
132
136
|
const containerRef = (0, react_1.useRef)(null);
|
133
137
|
const [isLoadMore, setIsLoadMore] = (0, react_1.useState)(false);
|
134
138
|
const loadMoreData = (0, react_1.useCallback)(() => {
|
135
|
-
var _a, _b, _c, _d;
|
136
139
|
if (isLoadMore)
|
137
140
|
return;
|
138
141
|
setIsLoadMore(true);
|
139
142
|
waterFallData &&
|
140
|
-
(getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos(
|
143
|
+
(getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({
|
144
|
+
hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag
|
145
|
+
}).then((res) => {
|
141
146
|
var _a;
|
142
147
|
setList(list === null || list === void 0 ? void 0 : list.concat((_a = res === null || res === void 0 ? void 0 : res.recList) !== null && _a !== void 0 ? _a : []));
|
143
148
|
setIsLoadMore(false);
|
144
149
|
}));
|
145
150
|
}, [waterFallData, getRecommendVideos, list, isLoadMore]);
|
146
151
|
(0, react_1.useEffect)(() => {
|
147
|
-
var _a, _b
|
152
|
+
var _a, _b;
|
148
153
|
setIsLoadingData(true);
|
149
154
|
waterFallData &&
|
150
|
-
(getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos(
|
155
|
+
(getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({
|
156
|
+
hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag,
|
157
|
+
defaultSize: hashTagSize,
|
158
|
+
maxSize: hashTagSize
|
159
|
+
}).then((res) => {
|
151
160
|
var _a, _b;
|
152
161
|
setData(res);
|
153
162
|
setList((_b = (_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.filter((item) => (item === null || item === void 0 ? void 0 : item.video) !== null || (item === null || item === void 0 ? void 0 : item.product) !== null)) !== null && _b !== void 0 ? _b : []);
|
@@ -156,7 +165,7 @@ function WaterfallList(_a) {
|
|
156
165
|
if (isOpenHashTag) {
|
157
166
|
const res = preview_json_1.default;
|
158
167
|
setData(res);
|
159
|
-
setList((
|
168
|
+
setList((_b = (_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.filter((item) => (item === null || item === void 0 ? void 0 : item.video) !== null || (item === null || item === void 0 ? void 0 : item.product) !== null)) !== null && _b !== void 0 ? _b : []);
|
160
169
|
setIsLoadingData(false);
|
161
170
|
}
|
162
171
|
}, [waterFallData, getRecommendVideos, hashTagSize, isOpenHashTag]);
|
@@ -10,6 +10,7 @@ const css_1 = require("@emotion/css");
|
|
10
10
|
const tool_1 = require("../../../../core/utils/tool");
|
11
11
|
const useEventReport_1 = require("../../../../core/hooks/useEventReport");
|
12
12
|
const WaterfallFlowItem = (props) => {
|
13
|
+
var _a;
|
13
14
|
const { rec, style = {}, sizeChange = () => { }, unitWidth, index, showBorder, list, reportTagsView, textStyles, space } = props;
|
14
15
|
const { swiperRef, setRtcList, setOpenHashtag, sxpParameter } = (0, hooks_1.useSxpDataSource)();
|
15
16
|
const [showVideo, setShowVideo] = (0, react_1.useState)(false);
|
@@ -61,16 +62,19 @@ const WaterfallFlowItem = (props) => {
|
|
61
62
|
}
|
62
63
|
}, [top, showBorder]);
|
63
64
|
const priceText = (0, react_1.useMemo)(() => {
|
64
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
65
|
-
|
66
|
-
|
67
|
-
|
68
|
-
|
65
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
66
|
+
const isToLocStr = ((_a = textStyles === null || textStyles === void 0 ? void 0 : textStyles.price) === null || _a === void 0 ? void 0 : _a.enableFormattedPrice) === undefined || ((_b = textStyles === null || textStyles === void 0 ? void 0 : textStyles.price) === null || _b === void 0 ? void 0 : _b.enableFormattedPrice);
|
67
|
+
if (((_c = rec === null || rec === void 0 ? void 0 : rec.product) === null || _c === void 0 ? void 0 : _c.currency) && ((_d = rec === null || rec === void 0 ? void 0 : rec.product) === null || _d === void 0 ? void 0 : _d.price)) {
|
68
|
+
return `${(_h = (_g = (_f = (_e = rec === null || rec === void 0 ? void 0 : rec.product) === null || _e === void 0 ? void 0 : _e.currency) === null || _f === void 0 ? void 0 : _f.split('-')[1]) === null || _g === void 0 ? void 0 : _g.toUpperCase()) !== null && _h !== void 0 ? _h : ''}${isToLocStr
|
69
|
+
? (_l = (_k = (_j = rec === null || rec === void 0 ? void 0 : rec.product) === null || _j === void 0 ? void 0 : _j.price) === null || _k === void 0 ? void 0 : _k.toLocaleString('zh', {
|
70
|
+
minimumFractionDigits: 0
|
71
|
+
})) !== null && _l !== void 0 ? _l : ''
|
72
|
+
: (_m = rec === null || rec === void 0 ? void 0 : rec.product) === null || _m === void 0 ? void 0 : _m.price}`;
|
69
73
|
}
|
70
74
|
else {
|
71
75
|
return null;
|
72
76
|
}
|
73
|
-
}, [rec]);
|
77
|
+
}, [rec, (_a = textStyles === null || textStyles === void 0 ? void 0 : textStyles.price) === null || _a === void 0 ? void 0 : _a.enableFormattedPrice]);
|
74
78
|
(0, react_1.useEffect)(() => {
|
75
79
|
if (imgDom.current === null || src === '') {
|
76
80
|
return;
|
@@ -211,10 +215,14 @@ function WaterfallList(_a) {
|
|
211
215
|
styleListRef.current = getStyleList();
|
212
216
|
}, [unitWidth, rowsNum, list]);
|
213
217
|
(0, react_1.useEffect)(() => {
|
214
|
-
var _a, _b
|
218
|
+
var _a, _b;
|
215
219
|
setIsLoadingData(true);
|
216
220
|
waterFallData &&
|
217
|
-
(getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos(
|
221
|
+
(getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({
|
222
|
+
hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag,
|
223
|
+
defaultSize: hashTagSize,
|
224
|
+
maxSize: hashTagSize
|
225
|
+
}).then((res) => {
|
218
226
|
var _a, _b;
|
219
227
|
setData(res);
|
220
228
|
setList((_b = (_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.filter((item) => (item === null || item === void 0 ? void 0 : item.video) !== null || (item === null || item === void 0 ? void 0 : item.product) !== null)) !== null && _b !== void 0 ? _b : []);
|
@@ -223,7 +231,7 @@ function WaterfallList(_a) {
|
|
223
231
|
if (isOpenHashTag) {
|
224
232
|
const res = preview_json_1.default;
|
225
233
|
setData(res);
|
226
|
-
setList((
|
234
|
+
setList((_b = (_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.filter((item) => (item === null || item === void 0 ? void 0 : item.video) !== null || (item === null || item === void 0 ? void 0 : item.product) !== null)) !== null && _b !== void 0 ? _b : []);
|
227
235
|
setIsLoadingData(false);
|
228
236
|
}
|
229
237
|
}, [waterFallData, getRecommendVideos, hashTagSize, isOpenHashTag]);
|
@@ -248,10 +256,11 @@ function WaterfallList(_a) {
|
|
248
256
|
};
|
249
257
|
}, [onResize]);
|
250
258
|
const loadMoreData = (0, react_1.useCallback)(() => {
|
251
|
-
var _a, _b, _c, _d;
|
252
259
|
setIsLoadingData(true);
|
253
260
|
waterFallData &&
|
254
|
-
(getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos(
|
261
|
+
(getRecommendVideos === null || getRecommendVideos === void 0 ? void 0 : getRecommendVideos({
|
262
|
+
hashTag: waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag
|
263
|
+
}).then((res) => {
|
255
264
|
var _a, _b;
|
256
265
|
setList(list === null || list === void 0 ? void 0 : list.concat((_b = (_a = res === null || res === void 0 ? void 0 : res.recList) === null || _a === void 0 ? void 0 : _a.filter((item) => !(item === null || item === void 0 ? void 0 : item.video))) !== null && _b !== void 0 ? _b : []));
|
257
266
|
setIsLoadingData(false);
|