pb-sxp-ui 14.0.3 → 14.0.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.
- package/dist/index.cjs +444 -802
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +0 -89
- package/dist/index.js +444 -802
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +6 -6
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +6 -6
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +444 -802
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +6 -6
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/SxpPageRender/ConsentPopup.js +8 -8
- package/es/core/components/SxpPageRender/Navbar.js +1 -1
- package/es/core/components/SxpPageRender/WaterFall/preview.json +272 -207
- package/es/core/components/SxpPageRender/index.js +2 -5
- package/es/core/context/SxpDataSourceProvider.js +48 -49
- package/es/core/utils/materials.js +3 -5
- package/es/materials/sxp/consentPopup/Display/index.d.ts +2 -2
- package/es/materials/sxp/consentPopup/Display/index.js +5 -7
- package/es/materials/sxp/consentPopup/index.d.ts +0 -2
- package/es/materials/sxp/consentPopup/index.js +0 -2
- package/es/materials/sxp/cta/AniLink/index.js +1 -1
- package/es/materials/sxp/cta/AniLinkPopup/index.js +1 -1
- package/es/materials/sxp/popup/ConsentDetail/index.d.ts +1 -2
- package/es/materials/sxp/popup/ConsentDetail/index.js +2 -2
- package/es/materials/sxp/popup/Iframe/index.d.ts +4 -0
- package/es/materials/sxp/popup/Iframe/index.js +5 -4
- package/es/materials/sxp/popup/Iframe/settingRender.js +15 -0
- package/lib/core/components/SxpPageRender/ConsentPopup.js +7 -7
- package/lib/core/components/SxpPageRender/Navbar.js +1 -1
- package/lib/core/components/SxpPageRender/WaterFall/preview.json +272 -207
- package/lib/core/components/SxpPageRender/index.js +2 -5
- package/lib/core/context/SxpDataSourceProvider.js +48 -49
- package/lib/core/utils/materials.js +3 -5
- package/lib/materials/sxp/consentPopup/Display/index.d.ts +2 -2
- package/lib/materials/sxp/consentPopup/Display/index.js +5 -7
- package/lib/materials/sxp/consentPopup/index.d.ts +0 -2
- package/lib/materials/sxp/consentPopup/index.js +0 -2
- package/lib/materials/sxp/cta/AniLink/index.js +1 -1
- package/lib/materials/sxp/cta/AniLinkPopup/index.js +1 -1
- package/lib/materials/sxp/popup/ConsentDetail/index.d.ts +1 -2
- package/lib/materials/sxp/popup/ConsentDetail/index.js +2 -2
- package/lib/materials/sxp/popup/Iframe/index.d.ts +4 -0
- package/lib/materials/sxp/popup/Iframe/index.js +5 -4
- package/lib/materials/sxp/popup/Iframe/settingRender.js +15 -0
- package/package.json +1 -1
- package/es/materials/sxp/consentPopup/Click/index.d.ts +0 -19
- package/es/materials/sxp/consentPopup/Click/index.js +0 -19
- package/es/materials/sxp/consentPopup/Click/material.d.ts +0 -2
- package/es/materials/sxp/consentPopup/Click/material.js +0 -48
- package/es/materials/sxp/consentPopup/Click/settingRender.d.ts +0 -63
- package/es/materials/sxp/consentPopup/Click/settingRender.js +0 -210
- package/es/materials/sxp/consentPopup/Swipe/index.d.ts +0 -12
- package/es/materials/sxp/consentPopup/Swipe/index.js +0 -44
- package/es/materials/sxp/consentPopup/Swipe/material.d.ts +0 -2
- package/es/materials/sxp/consentPopup/Swipe/material.js +0 -24
- package/es/materials/sxp/consentPopup/Swipe/settingRender.d.ts +0 -29
- package/es/materials/sxp/consentPopup/Swipe/settingRender.js +0 -43
- package/lib/materials/sxp/consentPopup/Click/index.d.ts +0 -19
- package/lib/materials/sxp/consentPopup/Click/index.js +0 -21
- package/lib/materials/sxp/consentPopup/Click/material.d.ts +0 -2
- package/lib/materials/sxp/consentPopup/Click/material.js +0 -52
- package/lib/materials/sxp/consentPopup/Click/settingRender.d.ts +0 -63
- package/lib/materials/sxp/consentPopup/Click/settingRender.js +0 -212
- package/lib/materials/sxp/consentPopup/Swipe/index.d.ts +0 -12
- package/lib/materials/sxp/consentPopup/Swipe/index.js +0 -46
- package/lib/materials/sxp/consentPopup/Swipe/material.d.ts +0 -2
- package/lib/materials/sxp/consentPopup/Swipe/material.js +0 -28
- package/lib/materials/sxp/consentPopup/Swipe/settingRender.d.ts +0 -29
- package/lib/materials/sxp/consentPopup/Swipe/settingRender.js +0 -45
@@ -120,7 +120,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
120
120
|
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
121
121
|
productId: (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.itemId,
|
122
122
|
position: activeIndex + '',
|
123
|
-
fromKName: fk
|
123
|
+
fromKName: fk ? fk : fromKName,
|
124
124
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
125
125
|
ctatId: (_r = (_q = (_p = item === null || item === void 0 ? void 0 : item.video) === null || _p === void 0 ? void 0 : _p.bindCta) === null || _q === void 0 ? void 0 : _q.itemId) !== null && _r !== void 0 ? _r : '',
|
126
126
|
traceInfo: (_v = (_t = (_s = item === null || item === void 0 ? void 0 : item.video) === null || _s === void 0 ? void 0 : _s.traceInfo) !== null && _t !== void 0 ? _t : (_u = item === null || item === void 0 ? void 0 : item.product) === null || _u === void 0 ? void 0 : _u.traceInfo) !== null && _v !== void 0 ? _v : ''
|
@@ -147,12 +147,9 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
147
147
|
setIsReload(new Date().getTime());
|
148
148
|
skipLinkRef.current = false;
|
149
149
|
}
|
150
|
-
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false);
|
151
150
|
handleH5EnterLink();
|
152
151
|
if (repCond) {
|
153
|
-
|
154
|
-
event_1.default.emit(event_1.SXP_EVENT_TYPE.PAGE_DID_SHOW, item);
|
155
|
-
});
|
152
|
+
event_1.default.emit(event_1.SXP_EVENT_TYPE.PAGE_DID_SHOW, item);
|
156
153
|
backMainFeed('external', selectTag);
|
157
154
|
}
|
158
155
|
}
|
@@ -102,32 +102,53 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
102
102
|
const bffDataSource = (0, react_1.useMemo)(() => {
|
103
103
|
return dataSources === null || dataSources === void 0 ? void 0 : dataSources.find((d) => d.type === DataSourceType.BFF);
|
104
104
|
}, [dataSources]);
|
105
|
-
const fakeUserId = (0, react_1.useMemo)(() => {
|
106
|
-
var _a;
|
107
|
-
return ((_a = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _a === void 0 ? void 0 : _a['x-app-id']) + (0, localStore_1.storeAndLoadFeUserId)();
|
108
|
-
}, [bffDataSource]);
|
109
105
|
const bffFetch = (0, react_1.useCallback)((path, options) => {
|
110
106
|
if (!bffDataSource)
|
111
107
|
return;
|
112
108
|
const url = bffDataSource.url;
|
109
|
+
const fakeUserId = (0, localStore_1.storeAndLoadFeUserId)();
|
113
110
|
if (options === null || options === void 0 ? void 0 : options.query) {
|
114
111
|
const queryString = qs_1.default.stringify(options.query);
|
115
112
|
path = `${path}?${queryString}`;
|
116
113
|
}
|
117
114
|
if (options.type === 'beacon' && navigator.sendBeacon) {
|
118
|
-
return navigator.sendBeacon(`${url}/api
|
115
|
+
return navigator.sendBeacon(`${url}/api/v1${path}`, new Blob([
|
119
116
|
JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))
|
120
117
|
], { type: 'application/json;charset=UTF-8' }));
|
121
118
|
}
|
122
119
|
return window
|
123
|
-
.fetch(`${url}/api
|
120
|
+
.fetch(`${url}/api/v1${path}`, {
|
124
121
|
headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId }, bffDataSource.headers),
|
125
122
|
method: options.method,
|
126
123
|
body: JSON.stringify(options.body)
|
127
124
|
})
|
128
125
|
.then((res) => res.json())
|
129
126
|
.catch((err) => Promise.reject(err));
|
130
|
-
}, [bffDataSource
|
127
|
+
}, [bffDataSource]);
|
128
|
+
function splitUrlParams(urlParams) {
|
129
|
+
if (!urlParams)
|
130
|
+
return;
|
131
|
+
const indList = [];
|
132
|
+
for (let i = 0; i < urlParams.length; i++) {
|
133
|
+
const item = urlParams[i];
|
134
|
+
const curStr = urlParams.substring(i + 1, urlParams.length);
|
135
|
+
if (item === '&' &&
|
136
|
+
(curStr === null || curStr === void 0 ? void 0 : curStr.indexOf('=')) !== -1 &&
|
137
|
+
((curStr === null || curStr === void 0 ? void 0 : curStr.indexOf('=')) < (curStr === null || curStr === void 0 ? void 0 : curStr.indexOf('&')) || (curStr === null || curStr === void 0 ? void 0 : curStr.indexOf('&')) === -1)) {
|
138
|
+
indList.push(i);
|
139
|
+
}
|
140
|
+
}
|
141
|
+
const splitList = indList.length > 0 ? [] : [urlParams];
|
142
|
+
let lastIndex = 0;
|
143
|
+
indList === null || indList === void 0 ? void 0 : indList.map((i) => {
|
144
|
+
splitList === null || splitList === void 0 ? void 0 : splitList.push(urlParams.substring(lastIndex, i));
|
145
|
+
lastIndex = i + 1;
|
146
|
+
if (i === indList[indList.length - 1] && i < urlParams.length) {
|
147
|
+
splitList === null || splitList === void 0 ? void 0 : splitList.push(urlParams.substring(lastIndex, urlParams.length));
|
148
|
+
}
|
149
|
+
});
|
150
|
+
return splitList !== null && splitList !== void 0 ? splitList : [];
|
151
|
+
}
|
131
152
|
const getRecommendVideos = (0, react_1.useCallback)((query) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
132
153
|
var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
|
133
154
|
query = {
|
@@ -144,7 +165,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
144
165
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(channel) });
|
145
166
|
}
|
146
167
|
else if (utmVal) {
|
147
|
-
const val = (_k = (_j = (_h = utmVal
|
168
|
+
const val = (_k = (_j = (_h = splitUrlParams(utmVal)) === null || _h === void 0 ? void 0 : _h.filter((val) => {
|
148
169
|
var _a, _b;
|
149
170
|
const key = val.split('=')[0];
|
150
171
|
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);
|
@@ -164,16 +185,14 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
164
185
|
const recurveRecList = (query) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
165
186
|
var _v, _w, _x, _y, _z, _0;
|
166
187
|
query.pageNum = pageNum;
|
167
|
-
result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
188
|
+
result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'POST', body: query }));
|
168
189
|
if (!(result === null || result === void 0 ? void 0 : result.success)) {
|
169
190
|
return undefined;
|
170
191
|
}
|
171
192
|
setLoading(false);
|
172
193
|
list = list.concat((_y = (_x = (_w = (_v = result === null || result === void 0 ? void 0 : result.data) === null || _v === void 0 ? void 0 : _v.recList) === null || _w === void 0 ? void 0 : _w.filter) === null || _x === void 0 ? void 0 : _x.call(_w, (item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video))) !== null && _y !== void 0 ? _y : []);
|
173
|
-
|
174
|
-
|
175
|
-
setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
176
|
-
}
|
194
|
+
setRtcList(getFilterRecList(Object.assign(Object.assign({}, result.data), { recList: list })));
|
195
|
+
setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result.data), { recList: list })));
|
177
196
|
const isNotNullList = (_0 = (_z = result === null || result === void 0 ? void 0 : result.data) === null || _z === void 0 ? void 0 : _z.recList) === null || _0 === void 0 ? void 0 : _0.some((item) => (item === null || item === void 0 ? void 0 : item.product) || (item === null || item === void 0 ? void 0 : item.video));
|
178
197
|
if (isNotNullList) {
|
179
198
|
pageNum = pageNum + 1;
|
@@ -183,12 +202,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
183
202
|
yield recurveRecList(query);
|
184
203
|
if (!(query === null || query === void 0 ? void 0 : query.hashTag) && result)
|
185
204
|
setCurReqInfo({ rtc: (_l = result === null || result === void 0 ? void 0 : result.data) === null || _l === void 0 ? void 0 : _l.rtc, requestId: (_m = result === null || result === void 0 ? void 0 : result.data) === null || _m === void 0 ? void 0 : _m.requestId });
|
186
|
-
return Object.assign(Object.assign({}, result
|
205
|
+
return Object.assign(Object.assign({}, result.data), { recList: list });
|
187
206
|
}
|
188
207
|
if (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) {
|
189
208
|
query = Object.assign(Object.assign({}, query), { directPage: true, level: 1, pageNum: (_o = query === null || query === void 0 ? void 0 : query.pageNum) !== null && _o !== void 0 ? _o : 1 });
|
190
209
|
}
|
191
|
-
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
210
|
+
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'POST', body: query }));
|
192
211
|
if (!(result === null || result === void 0 ? void 0 : result.success)) {
|
193
212
|
return undefined;
|
194
213
|
}
|
@@ -238,7 +257,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
238
257
|
return expire;
|
239
258
|
}, [data]);
|
240
259
|
const bffEventReport = (0, react_1.useCallback)(({ userInfo, eventInfo, reportLayId = true }) => {
|
241
|
-
var _a, _b;
|
242
260
|
if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview)) {
|
243
261
|
return;
|
244
262
|
}
|
@@ -246,9 +264,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
246
264
|
userInfo = {};
|
247
265
|
}
|
248
266
|
const sessionID = (0, sessionStore_1.storeAndLoadFeSessionId)();
|
249
|
-
const
|
250
|
-
const cl_source = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('cl_source');
|
251
|
-
const ef = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ sessionID, rtc: curReqInfo.rtc, requestId: curReqInfo.requestId }, { playbookType }), (layoutVariantId && reportLayId && { layoutVariantId })), eventInfo), ((eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) && channel && { position: Number(eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) + 1 + '' })), (cl_source && { cl_source }));
|
267
|
+
const ef = Object.assign(Object.assign(Object.assign(Object.assign({ sessionID, rtc: curReqInfo.rtc, requestId: curReqInfo.requestId }, { playbookType }), (layoutVariantId && reportLayId && { layoutVariantId })), eventInfo), ((eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) && channel && { position: Number(eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.position) + 1 + '' }));
|
252
268
|
const realUserInfo = Object.entries(userInfo).map(([k, v]) => ({ name: k, value: v }));
|
253
269
|
const realEventInfo = Object.entries(ef)
|
254
270
|
.map(([k, v]) => v && { name: k, value: v })
|
@@ -257,23 +273,14 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
257
273
|
console.log('userInfo:', userInfo);
|
258
274
|
console.log('eventInfo:', ef);
|
259
275
|
console.log('========= 结束 =========');
|
260
|
-
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(
|
276
|
+
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/event/report', {
|
261
277
|
method: 'POST',
|
262
278
|
body: { userInfo: realUserInfo, eventInfo: realEventInfo },
|
263
279
|
type: 'beacon'
|
264
280
|
});
|
265
|
-
}, [
|
266
|
-
bffFetch,
|
267
|
-
curReqInfo,
|
268
|
-
enableReportEvent,
|
269
|
-
globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
|
270
|
-
layoutVariantId,
|
271
|
-
globalConfig,
|
272
|
-
playbookType,
|
273
|
-
bffDataSource
|
274
|
-
]);
|
281
|
+
}, [bffFetch, curReqInfo, enableReportEvent, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview, layoutVariantId, globalConfig, playbookType]);
|
275
282
|
const bffFbReport = (0, react_1.useCallback)(({ eventName, product }) => {
|
276
|
-
var _a, _b, _c, _d, _e
|
283
|
+
var _a, _b, _c, _d, _e;
|
277
284
|
if (!enableReportEvent ||
|
278
285
|
!enabledMetaConversionApi ||
|
279
286
|
(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) ||
|
@@ -285,7 +292,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
285
292
|
const fbclid = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('fbclid');
|
286
293
|
const fix_par = {
|
287
294
|
event_source_url: (_c = window === null || window === void 0 ? void 0 : window.location) === null || _c === void 0 ? void 0 : _c.href,
|
288
|
-
external_id:
|
295
|
+
external_id: (0, localStore_1.storeAndLoadFeUserId)(),
|
289
296
|
client_user_agent: (_e = (_d = window === null || window === void 0 ? void 0 : window.navigator) === null || _d === void 0 ? void 0 : _d.userAgent) !== null && _e !== void 0 ? _e : '',
|
290
297
|
fbc: fbclid ? `fb.2.${new Date().getTime()}.${fbclid}` : '',
|
291
298
|
fbp: (0, tool_1.getCookie)('_fbp') ? `fb.2.${new Date().getTime()}.${(0, tool_1.getCookie)('_fbp')}` : '',
|
@@ -337,30 +344,22 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
337
344
|
}
|
338
345
|
};
|
339
346
|
getEventParams(jsonParams);
|
340
|
-
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(
|
347
|
+
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/fb/events', {
|
341
348
|
method: 'POST',
|
342
349
|
body: jsonParams,
|
343
350
|
type: 'beacon'
|
344
351
|
});
|
345
|
-
}, [
|
346
|
-
bffFetch,
|
347
|
-
enableReportEvent,
|
348
|
-
enabledMetaConversionApi,
|
349
|
-
globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
|
350
|
-
globalConfig,
|
351
|
-
fakeUserId,
|
352
|
-
bffDataSource
|
353
|
-
]);
|
352
|
+
}, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview, globalConfig]);
|
354
353
|
const bffMutateLike = (0, react_1.useCallback)((body) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
355
|
-
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
354
|
+
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/like', { method: 'POST', body }));
|
356
355
|
return res === null || res === void 0 ? void 0 : res.success;
|
357
356
|
}), [bffFetch]);
|
358
357
|
const bffMutateUnlike = (0, react_1.useCallback)((body) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
359
|
-
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
358
|
+
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/unlike', { method: 'POST', body }));
|
360
359
|
return res === null || res === void 0 ? void 0 : res.success;
|
361
360
|
}), [bffFetch]);
|
362
361
|
const bffSubmitForm = (0, react_1.useCallback)((body) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
363
|
-
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
362
|
+
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/customform', { method: 'POST', body }));
|
364
363
|
return res === null || res === void 0 ? void 0 : res.success;
|
365
364
|
}), [bffFetch]);
|
366
365
|
const bffGetTagList = (0, react_1.useCallback)((data) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
|
@@ -369,12 +368,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
369
368
|
if (!utmVal || !isShowTag)
|
370
369
|
return;
|
371
370
|
try {
|
372
|
-
const val = (_10 = (_9 = (_8 = utmVal
|
371
|
+
const val = (_10 = (_9 = (_8 = splitUrlParams(utmVal)) === null || _8 === void 0 ? void 0 : _8.filter((val) => {
|
373
372
|
var _a, _b;
|
374
373
|
const key = val.split('=')[0];
|
375
374
|
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);
|
376
375
|
})) === null || _9 === void 0 ? void 0 : _9.join('&')) !== null && _10 !== void 0 ? _10 : '';
|
377
|
-
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
376
|
+
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
|
378
377
|
setTagList((_12 = (_11 = result === null || result === void 0 ? void 0 : result.data) === null || _11 === void 0 ? void 0 : _11.tags) !== null && _12 !== void 0 ? _12 : []);
|
379
378
|
}
|
380
379
|
catch (e) {
|
@@ -448,10 +447,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
448
447
|
let curData;
|
449
448
|
let gldata;
|
450
449
|
if (data === null || data === void 0 ? void 0 : data.layoutVariantId) {
|
451
|
-
layId = data === null || data === void 0 ? void 0 : data.layoutVariantId;
|
452
|
-
setLayoutVariantId(data === null || data === void 0 ? void 0 : data.layoutVariantId);
|
453
450
|
const id = (_b = (_a = data === null || data === void 0 ? void 0 : data.layoutVariantId) === null || _a === void 0 ? void 0 : _a.split('-')) === null || _b === void 0 ? void 0 : _b[1];
|
454
451
|
if (id) {
|
452
|
+
layId = id;
|
453
|
+
setLayoutVariantId(id);
|
455
454
|
curData = dataList === null || dataList === void 0 ? void 0 : dataList.find((item) => (item === null || item === void 0 ? void 0 : item.id) === id);
|
456
455
|
if (curData) {
|
457
456
|
setPageData(curData);
|
@@ -38,16 +38,14 @@ const getBgStyleByImg = (data) => {
|
|
38
38
|
exports.getBgStyleByImg = getBgStyleByImg;
|
39
39
|
const getPriceText = ({ product, enableFormattedPrice, globalConfig, isHiddenDef, style }) => {
|
40
40
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
41
|
-
let text = '';
|
42
41
|
if ((!(product === null || product === void 0 ? void 0 : product.currency) || !(product === null || product === void 0 ? void 0 : product.price)) && isHiddenDef)
|
43
42
|
return null;
|
44
|
-
let price =
|
45
|
-
|
46
|
-
return text;
|
43
|
+
let price = (product === null || product === void 0 ? void 0 : product.currency) && (product === null || product === void 0 ? void 0 : product.price) ? product === null || product === void 0 ? void 0 : product.price : 7000;
|
44
|
+
let text = '';
|
47
45
|
let priceSymbol = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.priceSymbol;
|
48
46
|
let currency = (product === null || product === void 0 ? void 0 : product.currency) ? (_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 : '' : '$';
|
49
47
|
const isToLocStr = enableFormattedPrice === undefined || enableFormattedPrice;
|
50
|
-
let decPic = price
|
48
|
+
let decPic = price.toString();
|
51
49
|
if (priceSymbol === null || priceSymbol === void 0 ? void 0 : priceSymbol.showTwoDecimalPoint) {
|
52
50
|
decPic = price === null || price === void 0 ? void 0 : price.toFixed(2);
|
53
51
|
}
|
@@ -13,9 +13,9 @@ export interface IDisplayProps {
|
|
13
13
|
};
|
14
14
|
style?: Record<string, any>;
|
15
15
|
isTel?: boolean;
|
16
|
-
isShowClose?: boolean;
|
17
|
-
consentPopupCate?: string;
|
18
16
|
onClick?: () => void;
|
17
|
+
contsentState?: boolean;
|
18
|
+
isShowClose?: boolean;
|
19
19
|
}
|
20
20
|
declare const _default: React.NamedExoticComponent<IDisplayProps>;
|
21
21
|
export default _default;
|
@@ -3,20 +3,18 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
const tslib_1 = require("tslib");
|
4
4
|
const react_1 = tslib_1.__importStar(require("react"));
|
5
5
|
require("./index.less");
|
6
|
+
const EditorDataProvider_1 = require("../../../../core/context/EditorDataProvider");
|
6
7
|
const close_svg_1 = tslib_1.__importDefault(require("./close.svg"));
|
7
8
|
const tel_png_1 = tslib_1.__importDefault(require("./tel.png"));
|
8
9
|
const tool_1 = require("../../../../core/utils/tool");
|
9
|
-
const localStore_1 = require("../../../../core/utils/localStore");
|
10
10
|
const Display = (_a) => {
|
11
11
|
var _b, _c;
|
12
|
-
var { isTel, isShowOnce, open, content, interaction, style, onClick,
|
12
|
+
var { isTel, isShowOnce, open, content, interaction, style, onClick, contsentState, isShowClose } = _a, props = tslib_1.__rest(_a, ["isTel", "isShowOnce", "open", "content", "interaction", "style", "onClick", "contsentState", "isShowClose"]);
|
13
|
+
const { consentPopupCate } = (0, EditorDataProvider_1.useEditorDataProvider)();
|
13
14
|
const [isClose, setIsClose] = (0, react_1.useState)(false);
|
14
|
-
const contsentState = (0, react_1.useMemo)(() => {
|
15
|
-
return (0, localStore_1.getContsentState)();
|
16
|
-
}, []);
|
17
15
|
const visivle = (0, react_1.useMemo)(() => {
|
18
|
-
return consentPopupCate || (open && (isShowOnce || contsentState) && style && !isClose);
|
19
|
-
}, [consentPopupCate, open, isClose
|
16
|
+
return consentPopupCate === 'Display' || (open && (isShowOnce || contsentState) && style && !isClose);
|
17
|
+
}, [consentPopupCate, open, isClose]);
|
20
18
|
const handleClickClose = (0, react_1.useCallback)(() => {
|
21
19
|
setIsClose(true);
|
22
20
|
}, []);
|
@@ -2,5 +2,3 @@
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
3
3
|
const tslib_1 = require("tslib");
|
4
4
|
tslib_1.__exportStar(require("./Display/material"), exports);
|
5
|
-
tslib_1.__exportStar(require("./Click/material"), exports);
|
6
|
-
tslib_1.__exportStar(require("./Swipe/material"), exports);
|
@@ -37,7 +37,7 @@ const AniLink = (_a) => {
|
|
37
37
|
onClick === null || onClick === void 0 ? void 0 : onClick();
|
38
38
|
}
|
39
39
|
};
|
40
|
-
const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '
|
40
|
+
const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '查看详情';
|
41
41
|
const aniTimStyle = (0, react_1.useMemo)(() => {
|
42
42
|
var _a, _b;
|
43
43
|
const ani = event === null || event === void 0 ? void 0 : event.animation;
|
@@ -37,7 +37,7 @@ const AniLinkPopup = (_a) => {
|
|
37
37
|
onClick === null || onClick === void 0 ? void 0 : onClick();
|
38
38
|
}
|
39
39
|
};
|
40
|
-
const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '
|
40
|
+
const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '查看详情';
|
41
41
|
const aniTimStyle = (0, react_1.useMemo)(() => {
|
42
42
|
const ani = event === null || event === void 0 ? void 0 : event.animation;
|
43
43
|
if (ani) {
|
@@ -1,9 +1,8 @@
|
|
1
|
-
import React
|
1
|
+
import React from 'react';
|
2
2
|
import './index.less';
|
3
3
|
export interface IConsentDetailProps {
|
4
4
|
content?: string;
|
5
5
|
isTel?: boolean;
|
6
|
-
style?: CSSProperties;
|
7
6
|
}
|
8
7
|
declare const _default: React.NamedExoticComponent<IConsentDetailProps>;
|
9
8
|
export default _default;
|
@@ -4,11 +4,11 @@ const tslib_1 = require("tslib");
|
|
4
4
|
const react_1 = tslib_1.__importStar(require("react"));
|
5
5
|
require("./index.less");
|
6
6
|
const ConsentDetail = (_a) => {
|
7
|
-
var { content, isTel
|
7
|
+
var { content, isTel } = _a, props = tslib_1.__rest(_a, ["content", "isTel"]);
|
8
8
|
return (react_1.default.createElement("article", { className: 'consentDetail-article', dangerouslySetInnerHTML: {
|
9
9
|
__html: typeof content === 'string' ? content : ''
|
10
10
|
}, onClick: (e) => {
|
11
11
|
e.stopPropagation();
|
12
|
-
}
|
12
|
+
} }));
|
13
13
|
};
|
14
14
|
exports.default = (0, react_1.memo)(ConsentDetail);
|
@@ -12,6 +12,10 @@ export interface IIframeProps {
|
|
12
12
|
submitButtonStyle?: CSSProperties;
|
13
13
|
contentStyle?: CSSProperties;
|
14
14
|
isTel?: boolean;
|
15
|
+
iframe?: {
|
16
|
+
src?: string;
|
17
|
+
allow?: string;
|
18
|
+
};
|
15
19
|
}
|
16
20
|
declare const _default: React.NamedExoticComponent<IIframeProps>;
|
17
21
|
export default _default;
|
@@ -7,11 +7,12 @@ require("./index.less");
|
|
7
7
|
const hooks_1 = require("../../../../core/hooks");
|
8
8
|
const Iframe = (_a) => {
|
9
9
|
var _b, _c;
|
10
|
-
var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick, submitButtonStyle, contentStyle, isTel } = _a, props = tslib_1.__rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick", "submitButtonStyle", "contentStyle", "isTel"]);
|
10
|
+
var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick, submitButtonStyle, contentStyle, isTel, iframe } = _a, props = tslib_1.__rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick", "submitButtonStyle", "contentStyle", "isTel", "iframe"]);
|
11
11
|
const { popupDetailData } = (0, hooks_1.useSxpDataSource)();
|
12
|
-
const
|
13
|
-
|
14
|
-
|
12
|
+
const { src, allow } = iframe || {};
|
13
|
+
const iframeUrl = src || ((_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);
|
14
|
+
return (react_1.default.createElement("div", Object.assign({ className: `${(0, css_1.css)(Object.assign(Object.assign({}, style), { overflow: 'hidden' }))}` }, props),
|
15
|
+
react_1.default.createElement("iframe", { src: iframeUrl, allow: allow, scrolling: 'no', style: {
|
15
16
|
width: '100%',
|
16
17
|
height: 'calc(100% - 50px)',
|
17
18
|
marginTop: '50px',
|
@@ -10,5 +10,20 @@ exports.default = [
|
|
10
10
|
name: ['style', 'backgroundColor']
|
11
11
|
}
|
12
12
|
]
|
13
|
+
},
|
14
|
+
{
|
15
|
+
title: 'iframe',
|
16
|
+
child: [
|
17
|
+
{
|
18
|
+
type: 'TextArea',
|
19
|
+
label: 'url',
|
20
|
+
name: ['props', 'iframe', 'src']
|
21
|
+
},
|
22
|
+
{
|
23
|
+
type: 'TextArea',
|
24
|
+
label: 'allow',
|
25
|
+
name: ['props', 'iframe', 'allow']
|
26
|
+
}
|
27
|
+
]
|
13
28
|
}
|
14
29
|
];
|
package/package.json
CHANGED
@@ -1,19 +0,0 @@
|
|
1
|
-
import React, { CSSProperties } from 'react';
|
2
|
-
import './index.less';
|
3
|
-
export interface IClickProps {
|
4
|
-
open?: boolean;
|
5
|
-
content?: string;
|
6
|
-
style?: Record<string, any>;
|
7
|
-
isTel?: boolean;
|
8
|
-
acceptButton?: {
|
9
|
-
text?: string;
|
10
|
-
style?: CSSProperties;
|
11
|
-
};
|
12
|
-
rejectButton?: {
|
13
|
-
text?: string;
|
14
|
-
style?: CSSProperties;
|
15
|
-
};
|
16
|
-
consentPopupCate?: string;
|
17
|
-
}
|
18
|
-
declare const _default: React.NamedExoticComponent<IClickProps>;
|
19
|
-
export default _default;
|
@@ -1,19 +0,0 @@
|
|
1
|
-
import { __rest } from "tslib";
|
2
|
-
import React, { memo, useMemo } from 'react';
|
3
|
-
import './index.less';
|
4
|
-
import tel from './tel.png';
|
5
|
-
import ConsentDetail from '../../popup/ConsentDetail';
|
6
|
-
const Click = (_a) => {
|
7
|
-
var { isTel, open, content, style, consentPopupCate, acceptButton, rejectButton } = _a, props = __rest(_a, ["isTel", "open", "content", "style", "consentPopupCate", "acceptButton", "rejectButton"]);
|
8
|
-
const visivle = useMemo(() => {
|
9
|
-
return consentPopupCate || (open && style);
|
10
|
-
}, [consentPopupCate, open]);
|
11
|
-
const handleClickAccept = () => { };
|
12
|
-
const handleClickReject = () => { };
|
13
|
-
return (React.createElement(React.Fragment, null, isTel ? (React.createElement("img", { src: tel, style: { objectFit: 'cover', width: '100%', height: '100%' } })) : (React.createElement(React.Fragment, null, visivle && (React.createElement("div", { className: 'consentPopupClick' },
|
14
|
-
React.createElement("div", { className: 'consentPopupClick-container', style: style },
|
15
|
-
React.createElement(ConsentDetail, { content: content, style: { padding: 0 } }),
|
16
|
-
React.createElement("button", { style: acceptButton === null || acceptButton === void 0 ? void 0 : acceptButton.style, onClick: handleClickAccept }, acceptButton === null || acceptButton === void 0 ? void 0 : acceptButton.text),
|
17
|
-
React.createElement("button", { style: rejectButton === null || rejectButton === void 0 ? void 0 : rejectButton.style, onClick: handleClickReject }, rejectButton === null || rejectButton === void 0 ? void 0 : rejectButton.text))))))));
|
18
|
-
};
|
19
|
-
export default memo(Click);
|
@@ -1,48 +0,0 @@
|
|
1
|
-
import settingRender from './settingRender';
|
2
|
-
import ClickComponent from '.';
|
3
|
-
import { createMaterial } from '../../../../core/create';
|
4
|
-
const Click = createMaterial(ClickComponent, {
|
5
|
-
displayName: 'Click Consent',
|
6
|
-
icon: '',
|
7
|
-
category: 'consentPopup',
|
8
|
-
type: 'Click',
|
9
|
-
related: {
|
10
|
-
settingRender,
|
11
|
-
bindableProps: []
|
12
|
-
},
|
13
|
-
defaulSetting: {
|
14
|
-
props: {
|
15
|
-
content: '<p><strong><span style="font-size:14px"><span style="line-height:3">Your Cookie Preferences</span></span></strong></p><p>We use cookie, including third-party cookies, to ensure the proper functioning and security of this site, to analyse its use, and to show you personalised content. You can authorise the use of all cookies by clicking on "Accept all cookies". If you click on "Reject all cookies", we will only use cookies necessary for the proper functioning and security of this site. To personalise on adjust your preferences at any time, click on "Cookies Settings" below or at the bottom of any Fendi.com webpage. For more information, read our Cookie Policy.</p><p></p>',
|
16
|
-
acceptButton: {
|
17
|
-
text: 'Accept all cookies',
|
18
|
-
style: {
|
19
|
-
backgroundColor: '#000',
|
20
|
-
height: 45,
|
21
|
-
color: '#fff',
|
22
|
-
fontSize: 12,
|
23
|
-
textAlign: 'center',
|
24
|
-
marginTop: 5,
|
25
|
-
marginBottom: 5
|
26
|
-
}
|
27
|
-
},
|
28
|
-
rejectButton: {
|
29
|
-
text: 'Reject all cookies',
|
30
|
-
style: {
|
31
|
-
backgroundColor: '#000',
|
32
|
-
height: 45,
|
33
|
-
color: '#fff',
|
34
|
-
fontSize: 12,
|
35
|
-
textAlign: 'center',
|
36
|
-
marginTop: 5,
|
37
|
-
marginBottom: 5
|
38
|
-
}
|
39
|
-
}
|
40
|
-
},
|
41
|
-
style: {
|
42
|
-
backgroundColor: '#fff',
|
43
|
-
padding: 18
|
44
|
-
}
|
45
|
-
},
|
46
|
-
sort: 2
|
47
|
-
});
|
48
|
-
export { Click };
|
@@ -1,63 +0,0 @@
|
|
1
|
-
declare const _default: ({
|
2
|
-
title: string;
|
3
|
-
child: {
|
4
|
-
type: string;
|
5
|
-
name: string[];
|
6
|
-
}[];
|
7
|
-
} | {
|
8
|
-
title: string;
|
9
|
-
child: ({
|
10
|
-
type: string;
|
11
|
-
label: string;
|
12
|
-
name: string[];
|
13
|
-
addonAfter?: undefined;
|
14
|
-
child?: undefined;
|
15
|
-
} | {
|
16
|
-
type: string;
|
17
|
-
label: string;
|
18
|
-
name: string[];
|
19
|
-
addonAfter: string;
|
20
|
-
child?: undefined;
|
21
|
-
} | {
|
22
|
-
type: string;
|
23
|
-
label: string;
|
24
|
-
child: ({
|
25
|
-
type: string;
|
26
|
-
name: string[];
|
27
|
-
max: number;
|
28
|
-
addonAfter?: undefined;
|
29
|
-
} | {
|
30
|
-
type: string;
|
31
|
-
name: string[];
|
32
|
-
addonAfter: string;
|
33
|
-
max: number;
|
34
|
-
})[];
|
35
|
-
name?: undefined;
|
36
|
-
addonAfter?: undefined;
|
37
|
-
} | {
|
38
|
-
type: string;
|
39
|
-
label: string;
|
40
|
-
child: {
|
41
|
-
type: string;
|
42
|
-
name: string[];
|
43
|
-
bottomText: string;
|
44
|
-
}[];
|
45
|
-
name?: undefined;
|
46
|
-
addonAfter?: undefined;
|
47
|
-
} | {
|
48
|
-
type: string;
|
49
|
-
label: string;
|
50
|
-
child: ({
|
51
|
-
type: string;
|
52
|
-
name: string[];
|
53
|
-
addonAfter?: undefined;
|
54
|
-
} | {
|
55
|
-
type: string;
|
56
|
-
name: string[];
|
57
|
-
addonAfter: string;
|
58
|
-
})[];
|
59
|
-
name?: undefined;
|
60
|
-
addonAfter?: undefined;
|
61
|
-
})[];
|
62
|
-
})[];
|
63
|
-
export default _default;
|