pb-sxp-ui 14.0.3 → 14.0.5
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 +470 -810
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +0 -89
- package/dist/index.js +470 -810
- 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 +470 -810
- 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/Consent/index.js +8 -2
- 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 +33 -53
- package/es/core/utils/materials.js +3 -5
- package/es/core/utils/tool.d.ts +2 -1
- package/es/core/utils/tool.js +38 -14
- 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/Consent/index.js +8 -2
- 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 +32 -52
- package/lib/core/utils/materials.js +3 -5
- package/lib/core/utils/tool.d.ts +2 -1
- package/lib/core/utils/tool.js +39 -14
- 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
@@ -117,7 +117,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
117
117
|
contentId: (_m = item === null || item === void 0 ? void 0 : item.video) === null || _m === void 0 ? void 0 : _m.itemId,
|
118
118
|
productId: (_o = item === null || item === void 0 ? void 0 : item.product) === null || _o === void 0 ? void 0 : _o.itemId,
|
119
119
|
position: activeIndex + '',
|
120
|
-
fromKName: fk
|
120
|
+
fromKName: fk ? fk : fromKName,
|
121
121
|
fromKPage: location === null || location === void 0 ? void 0 : location.href,
|
122
122
|
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 : '',
|
123
123
|
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 : ''
|
@@ -144,12 +144,9 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
144
144
|
setIsReload(new Date().getTime());
|
145
145
|
skipLinkRef.current = false;
|
146
146
|
}
|
147
|
-
refreshFeSession === null || refreshFeSession === void 0 ? void 0 : refreshFeSession(false);
|
148
147
|
handleH5EnterLink();
|
149
148
|
if (repCond) {
|
150
|
-
|
151
|
-
SXP_EVENT_BUS.emit(SXP_EVENT_TYPE.PAGE_DID_SHOW, item);
|
152
|
-
});
|
149
|
+
SXP_EVENT_BUS.emit(SXP_EVENT_TYPE.PAGE_DID_SHOW, item);
|
153
150
|
backMainFeed('external', selectTag);
|
154
151
|
}
|
155
152
|
}
|
@@ -7,7 +7,7 @@ import { storeAndLoadFeUserId, AGREE_POLICY } from '../utils/localStore';
|
|
7
7
|
import { useIconLink } from '../components/SxpPageRender/useIconLink';
|
8
8
|
import SXP_EVENT_BUS, { SXP_EVENT_TYPE } from '../utils/event';
|
9
9
|
import Consent from '../components/Consent';
|
10
|
-
import { getCookie } from '../utils/tool';
|
10
|
+
import { getCookie, splitUrlParams } from '../utils/tool';
|
11
11
|
export const SxpDataSourceContext = createContext({
|
12
12
|
rtcList: [],
|
13
13
|
tagList: []
|
@@ -99,32 +99,29 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
99
99
|
const bffDataSource = useMemo(() => {
|
100
100
|
return dataSources === null || dataSources === void 0 ? void 0 : dataSources.find((d) => d.type === DataSourceType.BFF);
|
101
101
|
}, [dataSources]);
|
102
|
-
const fakeUserId = useMemo(() => {
|
103
|
-
var _a;
|
104
|
-
return ((_a = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _a === void 0 ? void 0 : _a['x-app-id']) + storeAndLoadFeUserId();
|
105
|
-
}, [bffDataSource]);
|
106
102
|
const bffFetch = useCallback((path, options) => {
|
107
103
|
if (!bffDataSource)
|
108
104
|
return;
|
109
105
|
const url = bffDataSource.url;
|
106
|
+
const fakeUserId = storeAndLoadFeUserId();
|
110
107
|
if (options === null || options === void 0 ? void 0 : options.query) {
|
111
108
|
const queryString = qs.stringify(options.query);
|
112
109
|
path = `${path}?${queryString}`;
|
113
110
|
}
|
114
111
|
if (options.type === 'beacon' && navigator.sendBeacon) {
|
115
|
-
return navigator.sendBeacon(`${url}/api
|
112
|
+
return navigator.sendBeacon(`${url}/api/v1${path}`, new Blob([
|
116
113
|
JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))
|
117
114
|
], { type: 'application/json;charset=UTF-8' }));
|
118
115
|
}
|
119
116
|
return window
|
120
|
-
.fetch(`${url}/api
|
117
|
+
.fetch(`${url}/api/v1${path}`, {
|
121
118
|
headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId }, bffDataSource.headers),
|
122
119
|
method: options.method,
|
123
120
|
body: JSON.stringify(options.body)
|
124
121
|
})
|
125
122
|
.then((res) => res.json())
|
126
123
|
.catch((err) => Promise.reject(err));
|
127
|
-
}, [bffDataSource
|
124
|
+
}, [bffDataSource]);
|
128
125
|
const getRecommendVideos = useCallback((query) => __awaiter(void 0, void 0, void 0, function* () {
|
129
126
|
var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
|
130
127
|
query = {
|
@@ -141,7 +138,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
141
138
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(channel) });
|
142
139
|
}
|
143
140
|
else if (utmVal) {
|
144
|
-
const val = (_k = (_j = (_h = utmVal
|
141
|
+
const val = (_k = (_j = (_h = splitUrlParams(utmVal)) === null || _h === void 0 ? void 0 : _h.filter((val) => {
|
145
142
|
var _a, _b;
|
146
143
|
const key = val.split('=')[0];
|
147
144
|
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);
|
@@ -161,16 +158,14 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
161
158
|
const recurveRecList = (query) => __awaiter(void 0, void 0, void 0, function* () {
|
162
159
|
var _v, _w, _x, _y, _z, _0;
|
163
160
|
query.pageNum = pageNum;
|
164
|
-
result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
161
|
+
result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'POST', body: query }));
|
165
162
|
if (!(result === null || result === void 0 ? void 0 : result.success)) {
|
166
163
|
return undefined;
|
167
164
|
}
|
168
165
|
setLoading(false);
|
169
166
|
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 : []);
|
170
|
-
|
171
|
-
|
172
|
-
setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
173
|
-
}
|
167
|
+
setRtcList(getFilterRecList(Object.assign(Object.assign({}, result.data), { recList: list })));
|
168
|
+
setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result.data), { recList: list })));
|
174
169
|
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));
|
175
170
|
if (isNotNullList) {
|
176
171
|
pageNum = pageNum + 1;
|
@@ -180,12 +175,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
180
175
|
yield recurveRecList(query);
|
181
176
|
if (!(query === null || query === void 0 ? void 0 : query.hashTag) && result)
|
182
177
|
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 });
|
183
|
-
return Object.assign(Object.assign({}, result
|
178
|
+
return Object.assign(Object.assign({}, result.data), { recList: list });
|
184
179
|
}
|
185
180
|
if (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) {
|
186
181
|
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 });
|
187
182
|
}
|
188
|
-
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
183
|
+
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'POST', body: query }));
|
189
184
|
if (!(result === null || result === void 0 ? void 0 : result.success)) {
|
190
185
|
return undefined;
|
191
186
|
}
|
@@ -235,7 +230,6 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
235
230
|
return expire;
|
236
231
|
}, [data]);
|
237
232
|
const bffEventReport = useCallback(({ userInfo, eventInfo, reportLayId = true }) => {
|
238
|
-
var _a, _b;
|
239
233
|
if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview)) {
|
240
234
|
return;
|
241
235
|
}
|
@@ -243,9 +237,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
243
237
|
userInfo = {};
|
244
238
|
}
|
245
239
|
const sessionID = storeAndLoadFeSessionId();
|
246
|
-
const
|
247
|
-
const cl_source = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('cl_source');
|
248
|
-
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 }));
|
240
|
+
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 + '' }));
|
249
241
|
const realUserInfo = Object.entries(userInfo).map(([k, v]) => ({ name: k, value: v }));
|
250
242
|
const realEventInfo = Object.entries(ef)
|
251
243
|
.map(([k, v]) => v && { name: k, value: v })
|
@@ -254,23 +246,14 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
254
246
|
console.log('userInfo:', userInfo);
|
255
247
|
console.log('eventInfo:', ef);
|
256
248
|
console.log('========= 结束 =========');
|
257
|
-
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(
|
249
|
+
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/event/report', {
|
258
250
|
method: 'POST',
|
259
251
|
body: { userInfo: realUserInfo, eventInfo: realEventInfo },
|
260
252
|
type: 'beacon'
|
261
253
|
});
|
262
|
-
}, [
|
263
|
-
bffFetch,
|
264
|
-
curReqInfo,
|
265
|
-
enableReportEvent,
|
266
|
-
globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
|
267
|
-
layoutVariantId,
|
268
|
-
globalConfig,
|
269
|
-
playbookType,
|
270
|
-
bffDataSource
|
271
|
-
]);
|
254
|
+
}, [bffFetch, curReqInfo, enableReportEvent, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview, layoutVariantId, globalConfig, playbookType]);
|
272
255
|
const bffFbReport = useCallback(({ eventName, product }) => {
|
273
|
-
var _a, _b, _c, _d, _e
|
256
|
+
var _a, _b, _c, _d, _e;
|
274
257
|
if (!enableReportEvent ||
|
275
258
|
!enabledMetaConversionApi ||
|
276
259
|
(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) ||
|
@@ -282,7 +265,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
282
265
|
const fbclid = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('fbclid');
|
283
266
|
const fix_par = {
|
284
267
|
event_source_url: (_c = window === null || window === void 0 ? void 0 : window.location) === null || _c === void 0 ? void 0 : _c.href,
|
285
|
-
external_id:
|
268
|
+
external_id: storeAndLoadFeUserId(),
|
286
269
|
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 : '',
|
287
270
|
fbc: fbclid ? `fb.2.${new Date().getTime()}.${fbclid}` : '',
|
288
271
|
fbp: getCookie('_fbp') ? `fb.2.${new Date().getTime()}.${getCookie('_fbp')}` : '',
|
@@ -334,30 +317,22 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
334
317
|
}
|
335
318
|
};
|
336
319
|
getEventParams(jsonParams);
|
337
|
-
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(
|
320
|
+
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/fb/events', {
|
338
321
|
method: 'POST',
|
339
322
|
body: jsonParams,
|
340
323
|
type: 'beacon'
|
341
324
|
});
|
342
|
-
}, [
|
343
|
-
bffFetch,
|
344
|
-
enableReportEvent,
|
345
|
-
enabledMetaConversionApi,
|
346
|
-
globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
|
347
|
-
globalConfig,
|
348
|
-
fakeUserId,
|
349
|
-
bffDataSource
|
350
|
-
]);
|
325
|
+
}, [bffFetch, enableReportEvent, enabledMetaConversionApi, globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview, globalConfig]);
|
351
326
|
const bffMutateLike = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
352
|
-
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
327
|
+
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/like', { method: 'POST', body }));
|
353
328
|
return res === null || res === void 0 ? void 0 : res.success;
|
354
329
|
}), [bffFetch]);
|
355
330
|
const bffMutateUnlike = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
356
|
-
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
331
|
+
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/unlike', { method: 'POST', body }));
|
357
332
|
return res === null || res === void 0 ? void 0 : res.success;
|
358
333
|
}), [bffFetch]);
|
359
334
|
const bffSubmitForm = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
360
|
-
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
335
|
+
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/customform', { method: 'POST', body }));
|
361
336
|
return res === null || res === void 0 ? void 0 : res.success;
|
362
337
|
}), [bffFetch]);
|
363
338
|
const bffGetTagList = useCallback((data) => __awaiter(void 0, void 0, void 0, function* () {
|
@@ -366,12 +341,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
366
341
|
if (!utmVal || !isShowTag)
|
367
342
|
return;
|
368
343
|
try {
|
369
|
-
const val = (_10 = (_9 = (_8 = utmVal
|
344
|
+
const val = (_10 = (_9 = (_8 = splitUrlParams(utmVal)) === null || _8 === void 0 ? void 0 : _8.filter((val) => {
|
370
345
|
var _a, _b;
|
371
346
|
const key = val.split('=')[0];
|
372
347
|
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);
|
373
348
|
})) === null || _9 === void 0 ? void 0 : _9.join('&')) !== null && _10 !== void 0 ? _10 : '';
|
374
|
-
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('
|
349
|
+
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
|
375
350
|
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 : []);
|
376
351
|
}
|
377
352
|
catch (e) {
|
@@ -401,9 +376,14 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
401
376
|
});
|
402
377
|
}, [bffEventReport, isFromHashtag]);
|
403
378
|
const h5EnterLink = useCallback(() => {
|
404
|
-
var _a, _b;
|
379
|
+
var _a, _b, _c;
|
405
380
|
const queryString = location.search.slice(1);
|
406
|
-
const params =
|
381
|
+
const params = {};
|
382
|
+
(_a = splitUrlParams(queryString.replace(/\+/g, '%2B'))) === null || _a === void 0 ? void 0 : _a.map((val) => {
|
383
|
+
const key = val.split('=')[0];
|
384
|
+
const value = val.split('=')[1];
|
385
|
+
params[key] = value;
|
386
|
+
});
|
407
387
|
for (const key in params) {
|
408
388
|
params[key] = params[key].replace(/%2B/g, '+');
|
409
389
|
}
|
@@ -421,7 +401,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
421
401
|
utmContent: getVal('utm_content'),
|
422
402
|
enterTime: Math.floor(time / 1000) + '',
|
423
403
|
requestId: null,
|
424
|
-
enterUrl: (
|
404
|
+
enterUrl: (_c = (_b = window === null || window === void 0 ? void 0 : window.location) === null || _b === void 0 ? void 0 : _b.href) !== null && _c !== void 0 ? _c : '',
|
425
405
|
clSource: getVal('cl_source')
|
426
406
|
},
|
427
407
|
reportLayId: false
|
@@ -445,10 +425,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
445
425
|
let curData;
|
446
426
|
let gldata;
|
447
427
|
if (data === null || data === void 0 ? void 0 : data.layoutVariantId) {
|
448
|
-
layId = data === null || data === void 0 ? void 0 : data.layoutVariantId;
|
449
|
-
setLayoutVariantId(data === null || data === void 0 ? void 0 : data.layoutVariantId);
|
450
428
|
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];
|
451
429
|
if (id) {
|
430
|
+
layId = id;
|
431
|
+
setLayoutVariantId(id);
|
452
432
|
curData = dataList === null || dataList === void 0 ? void 0 : dataList.find((item) => (item === null || item === void 0 ? void 0 : item.id) === id);
|
453
433
|
if (curData) {
|
454
434
|
setPageData(curData);
|
@@ -32,16 +32,14 @@ export const getBgStyleByImg = (data) => {
|
|
32
32
|
};
|
33
33
|
export const getPriceText = ({ product, enableFormattedPrice, globalConfig, isHiddenDef, style }) => {
|
34
34
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
35
|
-
let text = '';
|
36
35
|
if ((!(product === null || product === void 0 ? void 0 : product.currency) || !(product === null || product === void 0 ? void 0 : product.price)) && isHiddenDef)
|
37
36
|
return null;
|
38
|
-
let price =
|
39
|
-
|
40
|
-
return text;
|
37
|
+
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;
|
38
|
+
let text = '';
|
41
39
|
let priceSymbol = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.priceSymbol;
|
42
40
|
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 : '' : '$';
|
43
41
|
const isToLocStr = enableFormattedPrice === undefined || enableFormattedPrice;
|
44
|
-
let decPic = price
|
42
|
+
let decPic = price.toString();
|
45
43
|
if (priceSymbol === null || priceSymbol === void 0 ? void 0 : priceSymbol.showTwoDecimalPoint) {
|
46
44
|
decPic = price === null || price === void 0 ? void 0 : price.toFixed(2);
|
47
45
|
}
|
package/es/core/utils/tool.d.ts
CHANGED
@@ -12,4 +12,5 @@ declare function getSystem(): string | null;
|
|
12
12
|
declare function getDevice(): string | null;
|
13
13
|
declare function getCookie(val: string): string;
|
14
14
|
declare function getScreenReader(): boolean;
|
15
|
-
|
15
|
+
declare function splitUrlParams(urlParams: string): string[] | undefined;
|
16
|
+
export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie, getScreenReader, splitUrlParams };
|
package/es/core/utils/tool.js
CHANGED
@@ -60,8 +60,8 @@ export const setFontForText = (textContent, style) => {
|
|
60
60
|
const cnStyle = `font-family:${cn !== null && cn !== void 0 ? cn : 'inherit'}`;
|
61
61
|
const enStyle = `font-family:${en !== null && en !== void 0 ? en : 'inherit'}`;
|
62
62
|
const fn = (str) => {
|
63
|
-
|
64
|
-
|
63
|
+
const chineseStartIndex = str.search(chineseRegex);
|
64
|
+
const englishStartIndex = str.search(englishRegex);
|
65
65
|
if (chineseStartIndex !== -1 && englishStartIndex !== -1 && chineseStartIndex < englishStartIndex) {
|
66
66
|
content += `<span style="${cnStyle}">${str.substring(chineseStartIndex, englishStartIndex)}</span>`;
|
67
67
|
text = str.substring(englishStartIndex, str === null || str === void 0 ? void 0 : str.length);
|
@@ -90,7 +90,7 @@ export const setFontForText = (textContent, style) => {
|
|
90
90
|
};
|
91
91
|
function getBrowserInfo() {
|
92
92
|
var _a, _b, _c, _d, _e, _f, _g;
|
93
|
-
|
93
|
+
const userAgent = self.navigator.userAgent;
|
94
94
|
if (!userAgent)
|
95
95
|
return null;
|
96
96
|
if (/edge\/([\d\.]+)/i.exec(userAgent))
|
@@ -111,7 +111,7 @@ function getBrowserInfo() {
|
|
111
111
|
}
|
112
112
|
function getSystem() {
|
113
113
|
var _a, _b, _c;
|
114
|
-
|
114
|
+
const userAgent = self.navigator.userAgent;
|
115
115
|
if (!userAgent)
|
116
116
|
return null;
|
117
117
|
if (/iphone/i.test(userAgent))
|
@@ -121,27 +121,27 @@ function getSystem() {
|
|
121
121
|
if (/windows/i.test(userAgent))
|
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
|
-
return
|
124
|
+
return 'Mac OS';
|
125
125
|
return null;
|
126
126
|
}
|
127
127
|
function getDevice() {
|
128
|
-
|
128
|
+
const userAgent = self.navigator.userAgent;
|
129
129
|
if (!userAgent)
|
130
130
|
return null;
|
131
131
|
if (/iphone/i.test(userAgent))
|
132
|
-
return
|
132
|
+
return 'iPhone';
|
133
133
|
if (/android/i.test(userAgent)) {
|
134
|
-
|
135
|
-
|
134
|
+
const index1 = userAgent.indexOf('(');
|
135
|
+
const index2 = userAgent.indexOf(')');
|
136
136
|
if (index1 !== -1 && index2 !== -1) {
|
137
|
-
|
137
|
+
const value = userAgent.substring(index1 + 1, index2);
|
138
138
|
return `${value}`;
|
139
139
|
}
|
140
140
|
}
|
141
141
|
if (/windows/i.test(userAgent))
|
142
|
-
return
|
142
|
+
return 'Windows';
|
143
143
|
if (/mac/i.test(userAgent))
|
144
|
-
return
|
144
|
+
return 'Mac';
|
145
145
|
return null;
|
146
146
|
}
|
147
147
|
function getCookie(val) {
|
@@ -157,7 +157,7 @@ function getCookie(val) {
|
|
157
157
|
return value !== null && value !== void 0 ? value : '';
|
158
158
|
}
|
159
159
|
function getScreenReader() {
|
160
|
-
|
160
|
+
const userAgent = self.navigator.userAgent;
|
161
161
|
if (!userAgent)
|
162
162
|
return false;
|
163
163
|
return (/TalkBack/i.test(userAgent) ||
|
@@ -167,4 +167,28 @@ function getScreenReader() {
|
|
167
167
|
/JAWS/i.test(userAgent) ||
|
168
168
|
/ChromeVox/i.test(userAgent));
|
169
169
|
}
|
170
|
-
|
170
|
+
function splitUrlParams(urlParams) {
|
171
|
+
if (!urlParams)
|
172
|
+
return;
|
173
|
+
const indList = [];
|
174
|
+
for (let i = 0; i < urlParams.length; i++) {
|
175
|
+
const item = urlParams[i];
|
176
|
+
const curStr = urlParams.substring(i + 1, urlParams.length);
|
177
|
+
if (item === '&' &&
|
178
|
+
(curStr === null || curStr === void 0 ? void 0 : curStr.indexOf('=')) !== -1 &&
|
179
|
+
((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)) {
|
180
|
+
indList.push(i);
|
181
|
+
}
|
182
|
+
}
|
183
|
+
const splitList = indList.length > 0 ? [] : [urlParams];
|
184
|
+
let lastIndex = 0;
|
185
|
+
indList === null || indList === void 0 ? void 0 : indList.map((i) => {
|
186
|
+
splitList === null || splitList === void 0 ? void 0 : splitList.push(urlParams.substring(lastIndex, i));
|
187
|
+
lastIndex = i + 1;
|
188
|
+
if (i === indList[indList.length - 1] && i < urlParams.length) {
|
189
|
+
splitList === null || splitList === void 0 ? void 0 : splitList.push(urlParams.substring(lastIndex, urlParams.length));
|
190
|
+
}
|
191
|
+
});
|
192
|
+
return splitList !== null && splitList !== void 0 ? splitList : [];
|
193
|
+
}
|
194
|
+
export { uuid, getIndexByblockType, getBrowserInfo, getDevice, getSystem, getCookie, getScreenReader, splitUrlParams };
|
@@ -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;
|
@@ -1,20 +1,18 @@
|
|
1
1
|
import { __rest } from "tslib";
|
2
2
|
import React, { memo, useCallback, useMemo, useState } from 'react';
|
3
3
|
import './index.less';
|
4
|
+
import { useEditorDataProvider } from '../../../../core/context/EditorDataProvider';
|
4
5
|
import closeSvg from './close.svg';
|
5
6
|
import tel from './tel.png';
|
6
7
|
import { setFontForText } from '../../../../core/utils/tool';
|
7
|
-
import { getContsentState } from '../../../../core/utils/localStore';
|
8
8
|
const Display = (_a) => {
|
9
9
|
var _b, _c;
|
10
|
-
var { isTel, isShowOnce, open, content, interaction, style, onClick,
|
10
|
+
var { isTel, isShowOnce, open, content, interaction, style, onClick, contsentState, isShowClose } = _a, props = __rest(_a, ["isTel", "isShowOnce", "open", "content", "interaction", "style", "onClick", "contsentState", "isShowClose"]);
|
11
|
+
const { consentPopupCate } = useEditorDataProvider();
|
11
12
|
const [isClose, setIsClose] = useState(false);
|
12
|
-
const contsentState = useMemo(() => {
|
13
|
-
return getContsentState();
|
14
|
-
}, []);
|
15
13
|
const visivle = useMemo(() => {
|
16
|
-
return consentPopupCate || (open && (isShowOnce || contsentState) && style && !isClose);
|
17
|
-
}, [consentPopupCate, open, isClose
|
14
|
+
return consentPopupCate === 'Display' || (open && (isShowOnce || contsentState) && style && !isClose);
|
15
|
+
}, [consentPopupCate, open, isClose]);
|
18
16
|
const handleClickClose = useCallback(() => {
|
19
17
|
setIsClose(true);
|
20
18
|
}, []);
|
@@ -35,7 +35,7 @@ const AniLink = (_a) => {
|
|
35
35
|
onClick === null || onClick === void 0 ? void 0 : onClick();
|
36
36
|
}
|
37
37
|
};
|
38
|
-
const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '
|
38
|
+
const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '查看详情';
|
39
39
|
const aniTimStyle = useMemo(() => {
|
40
40
|
var _a, _b;
|
41
41
|
const ani = event === null || event === void 0 ? void 0 : event.animation;
|
@@ -35,7 +35,7 @@ const AniLinkPopup = (_a) => {
|
|
35
35
|
onClick === null || onClick === void 0 ? void 0 : onClick();
|
36
36
|
}
|
37
37
|
};
|
38
|
-
const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '
|
38
|
+
const title = (cta === null || cta === void 0 ? void 0 : cta.enTitle) || '查看详情';
|
39
39
|
const aniTimStyle = useMemo(() => {
|
40
40
|
const ani = event === null || event === void 0 ? void 0 : event.animation;
|
41
41
|
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;
|
@@ -2,11 +2,11 @@ import { __rest } from "tslib";
|
|
2
2
|
import React, { memo } from 'react';
|
3
3
|
import './index.less';
|
4
4
|
const ConsentDetail = (_a) => {
|
5
|
-
var { content, isTel
|
5
|
+
var { content, isTel } = _a, props = __rest(_a, ["content", "isTel"]);
|
6
6
|
return (React.createElement("article", { className: 'consentDetail-article', dangerouslySetInnerHTML: {
|
7
7
|
__html: typeof content === 'string' ? content : ''
|
8
8
|
}, onClick: (e) => {
|
9
9
|
e.stopPropagation();
|
10
|
-
}
|
10
|
+
} }));
|
11
11
|
};
|
12
12
|
export default 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;
|
@@ -5,11 +5,12 @@ 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, isTel } = _a, props = __rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick", "submitButtonStyle", "contentStyle", "isTel"]);
|
8
|
+
var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick, submitButtonStyle, contentStyle, isTel, iframe } = _a, props = __rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick", "submitButtonStyle", "contentStyle", "isTel", "iframe"]);
|
9
9
|
const { popupDetailData } = useSxpDataSource();
|
10
|
-
const
|
11
|
-
|
12
|
-
|
10
|
+
const { src, allow } = iframe || {};
|
11
|
+
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);
|
12
|
+
return (React.createElement("div", Object.assign({ className: `${css(Object.assign(Object.assign({}, style), { overflow: 'hidden' }))}` }, props),
|
13
|
+
React.createElement("iframe", { src: iframeUrl, allow: allow, scrolling: 'no', style: {
|
13
14
|
width: '100%',
|
14
15
|
height: 'calc(100% - 50px)',
|
15
16
|
marginTop: '50px',
|
@@ -8,5 +8,20 @@ export default [
|
|
8
8
|
name: ['style', 'backgroundColor']
|
9
9
|
}
|
10
10
|
]
|
11
|
+
},
|
12
|
+
{
|
13
|
+
title: 'iframe',
|
14
|
+
child: [
|
15
|
+
{
|
16
|
+
type: 'TextArea',
|
17
|
+
label: 'url',
|
18
|
+
name: ['props', 'iframe', 'src']
|
19
|
+
},
|
20
|
+
{
|
21
|
+
type: 'TextArea',
|
22
|
+
label: 'allow',
|
23
|
+
name: ['props', 'iframe', 'allow']
|
24
|
+
}
|
25
|
+
]
|
11
26
|
}
|
12
27
|
];
|
@@ -2,14 +2,20 @@
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
3
3
|
const tslib_1 = require("tslib");
|
4
4
|
const react_1 = tslib_1.__importStar(require("react"));
|
5
|
-
const qs_1 = tslib_1.__importDefault(require("qs"));
|
6
5
|
const hooks_1 = require("../../../core/hooks");
|
7
6
|
const localStore_1 = require("../../../core/utils/localStore");
|
7
|
+
const tool_1 = require("../../../core/utils/tool");
|
8
8
|
const Consent = ({ width = window.innerWidth, height = window.innerHeight, privacy_title, privacy_context, privacy_policy_url, privacy_policy_title }) => {
|
9
9
|
const { setIsAgreePolicy, bffEventReport } = (0, hooks_1.useSxpDataSource)();
|
10
10
|
const channelObj = (0, react_1.useMemo)(() => {
|
11
|
+
var _a;
|
11
12
|
const queryString = location.search.slice(1);
|
12
|
-
const params =
|
13
|
+
const params = {};
|
14
|
+
(_a = (0, tool_1.splitUrlParams)(queryString.replace(/\+/g, '%2B'))) === null || _a === void 0 ? void 0 : _a.map((val) => {
|
15
|
+
const key = val.split('=')[0];
|
16
|
+
const value = val.split('=')[1];
|
17
|
+
params[key] = value;
|
18
|
+
});
|
13
19
|
for (const key in params) {
|
14
20
|
params[key] = params[key].replace(/%2B/g, '+');
|
15
21
|
}
|
@@ -4,15 +4,15 @@ const tslib_1 = require("tslib");
|
|
4
4
|
const react_1 = tslib_1.__importStar(require("react"));
|
5
5
|
require("./index.less");
|
6
6
|
const withBindDataSource_1 = tslib_1.__importDefault(require("../../../core/hoc/withBindDataSource"));
|
7
|
-
const
|
7
|
+
const localStore_1 = require("../../../core/utils/localStore");
|
8
8
|
const Consent = ({ resolver, globalConfig }) => {
|
9
9
|
var _a, _b;
|
10
|
-
const
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
const t = resolver === null || resolver === void 0 ? void 0 : resolver[value === null || value === void 0 ? void 0 : value.type];
|
10
|
+
const contsentState = (0, react_1.useMemo)(() => {
|
11
|
+
return (0, localStore_1.getContsentState)();
|
12
|
+
}, []);
|
13
|
+
const t = resolver === null || resolver === void 0 ? void 0 : resolver['Display'];
|
15
14
|
const Component = (0, withBindDataSource_1.default)(t);
|
16
|
-
|
15
|
+
const value = (_b = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.consentPopup) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.item;
|
16
|
+
return react_1.default.createElement(Component, Object.assign({}, value === null || value === void 0 ? void 0 : value.props, { style: value === null || value === void 0 ? void 0 : value.style, event: (value === null || value === void 0 ? void 0 : value.event) || {}, contsentState: contsentState }));
|
17
17
|
};
|
18
18
|
exports.default = (0, react_1.memo)(Consent);
|
@@ -11,7 +11,7 @@ const Navbar = ({ icon, styles, textStyle, onClose }) => {
|
|
11
11
|
react_1.default.createElement("button", { className: 'clc-sxp-nav-left', role: 'button', "aria-label": 'back button', onClick: onClose },
|
12
12
|
react_1.default.createElement("img", { src: icon, alt: 'back button' })),
|
13
13
|
react_1.default.createElement("div", { className: 'clc-sxp-nav-title', style: Object.assign(Object.assign({}, textStyle), { paddingLeft: (textStyle === null || textStyle === void 0 ? void 0 : textStyle.textAlign) === 'left' ? '35px' : 0 }), dangerouslySetInnerHTML: {
|
14
|
-
__html: (0, tool_1.setFontForText)(`#${(_a = waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag) !== null && _a !== void 0 ? _a : '
|
14
|
+
__html: (0, tool_1.setFontForText)(`#${(_a = waterFallData === null || waterFallData === void 0 ? void 0 : waterFallData.hashTag) !== null && _a !== void 0 ? _a : '标题'}`, textStyle)
|
15
15
|
} })));
|
16
16
|
};
|
17
17
|
exports.default = (0, react_1.memo)(Navbar);
|