pb-sxp-ui 1.14.0 → 1.15.0
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 +713 -237
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +104 -0
- package/dist/index.js +713 -237
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +5 -5
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +5 -5
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +713 -237
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +5 -5
- 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/WaterFall/List.js +3 -3
- package/es/core/components/SxpPageRender/WaterFall/index.js +2 -2
- package/es/core/components/SxpPageRender/index.js +5 -2
- package/es/core/context/SxpDataSourceProvider.js +67 -30
- package/es/core/utils/materials.js +5 -3
- package/es/core/utils/tool.d.ts +2 -1
- package/es/core/utils/tool.js +38 -14
- package/es/materials/sxp/HashTag/index.d.ts +4 -1
- package/es/materials/sxp/HashTag/material.js +2 -1
- package/es/materials/sxp/HashTag/settingRender.d.ts +0 -2
- package/es/materials/sxp/HashTag/settingRender.js +2 -3
- package/es/materials/sxp/consentPopup/Click/index.d.ts +19 -0
- package/es/materials/sxp/consentPopup/Click/index.js +19 -0
- package/es/materials/sxp/consentPopup/Click/material.d.ts +2 -0
- package/es/materials/sxp/consentPopup/Click/material.js +48 -0
- package/es/materials/sxp/consentPopup/Click/settingRender.d.ts +63 -0
- package/es/materials/sxp/consentPopup/Click/settingRender.js +210 -0
- package/es/materials/sxp/consentPopup/Display/index.d.ts +2 -2
- package/es/materials/sxp/consentPopup/Display/index.js +7 -5
- package/es/materials/sxp/consentPopup/Swipe/index.d.ts +12 -0
- package/es/materials/sxp/consentPopup/Swipe/index.js +44 -0
- package/es/materials/sxp/consentPopup/Swipe/material.d.ts +2 -0
- package/es/materials/sxp/consentPopup/Swipe/material.js +24 -0
- package/es/materials/sxp/consentPopup/Swipe/settingRender.d.ts +29 -0
- package/es/materials/sxp/consentPopup/Swipe/settingRender.js +43 -0
- package/es/materials/sxp/consentPopup/index.d.ts +2 -0
- package/es/materials/sxp/consentPopup/index.js +2 -0
- package/es/materials/sxp/popup/ConsentDetail/index.d.ts +2 -1
- package/es/materials/sxp/popup/ConsentDetail/index.js +2 -2
- package/es/materials/sxp/popup/Iframe/index.d.ts +0 -4
- package/es/materials/sxp/popup/Iframe/index.js +4 -5
- package/es/materials/sxp/popup/Iframe/settingRender.js +0 -15
- package/lib/core/components/Consent/index.js +8 -2
- package/lib/core/components/SxpPageRender/ConsentPopup.js +7 -7
- package/lib/core/components/SxpPageRender/WaterFall/List.js +3 -3
- package/lib/core/components/SxpPageRender/WaterFall/index.js +2 -2
- package/lib/core/components/SxpPageRender/index.js +5 -2
- package/lib/core/context/SxpDataSourceProvider.js +66 -29
- package/lib/core/utils/materials.js +5 -3
- package/lib/core/utils/tool.d.ts +2 -1
- package/lib/core/utils/tool.js +39 -14
- package/lib/materials/sxp/HashTag/index.d.ts +4 -1
- package/lib/materials/sxp/HashTag/material.js +2 -1
- package/lib/materials/sxp/HashTag/settingRender.d.ts +0 -2
- package/lib/materials/sxp/HashTag/settingRender.js +2 -3
- package/lib/materials/sxp/consentPopup/Click/index.d.ts +19 -0
- package/lib/materials/sxp/consentPopup/Click/index.js +21 -0
- package/lib/materials/sxp/consentPopup/Click/material.d.ts +2 -0
- package/lib/materials/sxp/consentPopup/Click/material.js +52 -0
- package/lib/materials/sxp/consentPopup/Click/settingRender.d.ts +63 -0
- package/lib/materials/sxp/consentPopup/Click/settingRender.js +212 -0
- package/lib/materials/sxp/consentPopup/Display/index.d.ts +2 -2
- package/lib/materials/sxp/consentPopup/Display/index.js +7 -5
- package/lib/materials/sxp/consentPopup/Swipe/index.d.ts +12 -0
- package/lib/materials/sxp/consentPopup/Swipe/index.js +46 -0
- package/lib/materials/sxp/consentPopup/Swipe/material.d.ts +2 -0
- package/lib/materials/sxp/consentPopup/Swipe/material.js +28 -0
- package/lib/materials/sxp/consentPopup/Swipe/settingRender.d.ts +29 -0
- package/lib/materials/sxp/consentPopup/Swipe/settingRender.js +45 -0
- package/lib/materials/sxp/consentPopup/index.d.ts +2 -0
- package/lib/materials/sxp/consentPopup/index.js +2 -0
- package/lib/materials/sxp/popup/ConsentDetail/index.d.ts +2 -1
- package/lib/materials/sxp/popup/ConsentDetail/index.js +2 -2
- package/lib/materials/sxp/popup/Iframe/index.d.ts +0 -4
- package/lib/materials/sxp/popup/Iframe/index.js +4 -5
- package/lib/materials/sxp/popup/Iframe/settingRender.js +0 -15
- package/package.json +1 -1
@@ -1,12 +1,18 @@
|
|
1
1
|
import React, { memo, useEffect, useMemo } from 'react';
|
2
|
-
import qs from 'qs';
|
3
2
|
import { useSxpDataSource } from '../../../core/hooks';
|
4
3
|
import { AGREE_POLICY } from '../../../core/utils/localStore';
|
4
|
+
import { splitUrlParams } from '../../../core/utils/tool';
|
5
5
|
const Consent = ({ width = window.innerWidth, height = window.innerHeight, privacy_title, privacy_context, privacy_policy_url, privacy_policy_title }) => {
|
6
6
|
const { setIsAgreePolicy, bffEventReport } = useSxpDataSource();
|
7
7
|
const channelObj = useMemo(() => {
|
8
|
+
var _a;
|
8
9
|
const queryString = location.search.slice(1);
|
9
|
-
const params =
|
10
|
+
const params = {};
|
11
|
+
(_a = splitUrlParams(queryString.replace(/\+/g, '%2B'))) === null || _a === void 0 ? void 0 : _a.map((val) => {
|
12
|
+
const key = val.split('=')[0];
|
13
|
+
const value = val.split('=')[1];
|
14
|
+
params[key] = value;
|
15
|
+
});
|
10
16
|
for (const key in params) {
|
11
17
|
params[key] = params[key].replace(/%2B/g, '+');
|
12
18
|
}
|
@@ -1,15 +1,15 @@
|
|
1
|
-
import React, { memo
|
1
|
+
import React, { memo } from 'react';
|
2
2
|
import './index.less';
|
3
3
|
import withBindDataSource from '../../../core/hoc/withBindDataSource';
|
4
|
-
import {
|
4
|
+
import { useEditorDataProvider } from '../../../core/context/EditorDataProvider';
|
5
5
|
const Consent = ({ resolver, globalConfig }) => {
|
6
6
|
var _a, _b;
|
7
|
-
const
|
8
|
-
return getContsentState();
|
9
|
-
}, []);
|
10
|
-
const t = resolver === null || resolver === void 0 ? void 0 : resolver['Display'];
|
11
|
-
const Component = withBindDataSource(t);
|
7
|
+
const { consentPopupCate } = useEditorDataProvider();
|
12
8
|
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;
|
13
|
-
|
9
|
+
if (!value)
|
10
|
+
return null;
|
11
|
+
const t = resolver === null || resolver === void 0 ? void 0 : resolver[value === null || value === void 0 ? void 0 : value.type];
|
12
|
+
const Component = withBindDataSource(t);
|
13
|
+
return (React.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) || {}, consentPopupCate: consentPopupCate })));
|
14
14
|
};
|
15
15
|
export default memo(Consent);
|
@@ -10,7 +10,7 @@ import { useEventReport } from '../../../../core/hooks/useEventReport';
|
|
10
10
|
import { getPriceText } from '../../../../core/utils/materials';
|
11
11
|
const WaterfallFlowItem = (props) => {
|
12
12
|
var _a;
|
13
|
-
const { rec, index, list, reportTagsView, textStyles, space } = props;
|
13
|
+
const { rec, index, list, reportTagsView, textStyles, space, openFixedSize } = props;
|
14
14
|
const { swiperRef, setRtcList, setOpenHashtag, sxpParameter, globalConfig } = useSxpDataSource();
|
15
15
|
const [showVideo, setShowVideo] = useState(false);
|
16
16
|
const imgDom = useRef(null);
|
@@ -104,11 +104,11 @@ const WaterfallFlowItem = (props) => {
|
|
104
104
|
}, 0);
|
105
105
|
};
|
106
106
|
return (React.createElement("div", { ref: ref, className: 'list-content-listItem', key: index, onClick: handleClickToDetail, style: { marginBottom: space } },
|
107
|
-
React.createElement("div", { className: 'list-content-listItem-picture' },
|
107
|
+
React.createElement("div", { className: (openFixedSize === null || openFixedSize === void 0 ? void 0 : openFixedSize.ratio) === '1' ? 'list-content-listItem-picture' : 'list-content-listItem-picture1609' },
|
108
108
|
showVideo && (React.createElement("div", { style: { display: 'none' } },
|
109
109
|
React.createElement("video", { ref: videoDom, crossOrigin: 'anonymous', className: 'list-content-listItem-picture-img' }),
|
110
110
|
React.createElement("canvas", { ref: canvasRef }))),
|
111
|
-
React.createElement(FormatImage, { loading: 'lazy', className: 'list-content-listItem-picture-img', ref: imgDom })),
|
111
|
+
React.createElement(FormatImage, { loading: 'lazy', className: (openFixedSize === null || openFixedSize === void 0 ? void 0 : openFixedSize.ratio) === '1' ? 'list-content-listItem-picture-img' : 'list-content-listItem-picture1609-img', ref: imgDom })),
|
112
112
|
React.createElement("div", { className: 'list-content-listItem-info' },
|
113
113
|
React.createElement("div", { className: `${'list-content-listItem-info-title'} ${priceText ? 'list-content-listItem-info-nowrap' : ''}`, style: textStyles === null || textStyles === void 0 ? void 0 : textStyles.title, dangerouslySetInnerHTML: {
|
114
114
|
__html: setFontForText(title, textStyles === null || textStyles === void 0 ? void 0 : textStyles.title)
|
@@ -8,7 +8,7 @@ import List from './List';
|
|
8
8
|
import { useSxpDataSource } from '../../../../core/hooks';
|
9
9
|
import { useEventReport } from '../../../../core/hooks/useEventReport';
|
10
10
|
const WaterFall = (props) => {
|
11
|
-
var _a;
|
11
|
+
var _a, _b;
|
12
12
|
const { waterFallData, setOpenHashtag, openHashtag, swiperRef, setWaterFallData, cacheRtcList, setRtcList, cacheActiveIndex, rtcList, setCacheRtcList, setIsFromHashtag, isFromHashtag, bffEventReport, themeTag, selectTag, bffFbReport } = useSxpDataSource();
|
13
13
|
const { backMainFeed } = useEventReport();
|
14
14
|
const modalEleRef = useRef(null);
|
@@ -97,6 +97,6 @@ const WaterFall = (props) => {
|
|
97
97
|
display: openHashtag ? 'block' : 'none'
|
98
98
|
} },
|
99
99
|
React.createElement(Navbar, { icon: left, styles: { top: '32px' }, textStyle: (_a = props === null || props === void 0 ? void 0 : props.textStyles) === null || _a === void 0 ? void 0 : _a.hashTagTitle, onClose: handleClose }),
|
100
|
-
(props === null || props === void 0 ? void 0 : props.openFixedSize) === true || (props === null || props === void 0 ? void 0 : props.openFixedSize) === undefined ? (React.createElement(List, Object.assign({ key: waterFallData, reportTagsView: reportTagsView }, props))) : (React.createElement(WaterfallList, Object.assign({ key: waterFallData, reportTagsView: reportTagsView }, props)))), modalEleRef.current);
|
100
|
+
((_b = props === null || props === void 0 ? void 0 : props.openFixedSize) === null || _b === void 0 ? void 0 : _b.open) === true || (props === null || props === void 0 ? void 0 : props.openFixedSize) === undefined ? (React.createElement(List, Object.assign({ key: waterFallData, reportTagsView: reportTagsView }, props))) : (React.createElement(WaterfallList, Object.assign({ key: waterFallData, reportTagsView: reportTagsView }, props)))), modalEleRef.current);
|
101
101
|
};
|
102
102
|
export default memo(WaterFall);
|
@@ -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 || 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,9 +144,12 @@ 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);
|
147
148
|
handleH5EnterLink();
|
148
149
|
if (repCond) {
|
149
|
-
|
150
|
+
setTimeout(() => {
|
151
|
+
SXP_EVENT_BUS.emit(SXP_EVENT_TYPE.PAGE_DID_SHOW, item);
|
152
|
+
});
|
150
153
|
backMainFeed('external', selectTag);
|
151
154
|
}
|
152
155
|
}
|
@@ -1,13 +1,13 @@
|
|
1
1
|
import { __awaiter } from "tslib";
|
2
2
|
import React, { createContext, memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
3
3
|
import qs from 'qs';
|
4
|
+
import { cloneDeep } from 'lodash';
|
4
5
|
import { refreshFeSessionId, storeAndLoadFeSessionId } from '../utils/sessionStore';
|
5
6
|
import { storeAndLoadFeUserId, AGREE_POLICY } from '../utils/localStore';
|
6
7
|
import { useIconLink } from '../components/SxpPageRender/useIconLink';
|
7
8
|
import SXP_EVENT_BUS, { SXP_EVENT_TYPE } from '../utils/event';
|
8
9
|
import Consent from '../components/Consent';
|
9
|
-
import { getCookie } from '../utils/tool';
|
10
|
-
import { cloneDeep } from 'lodash';
|
10
|
+
import { getCookie, splitUrlParams } from '../utils/tool';
|
11
11
|
export const SxpDataSourceContext = createContext({
|
12
12
|
rtcList: [],
|
13
13
|
tagList: []
|
@@ -99,29 +99,32 @@ 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]);
|
102
106
|
const bffFetch = useCallback((path, options) => {
|
103
107
|
if (!bffDataSource)
|
104
108
|
return;
|
105
109
|
const url = bffDataSource.url;
|
106
|
-
const fakeUserId = storeAndLoadFeUserId();
|
107
110
|
if (options === null || options === void 0 ? void 0 : options.query) {
|
108
111
|
const queryString = qs.stringify(options.query);
|
109
112
|
path = `${path}?${queryString}`;
|
110
113
|
}
|
111
114
|
if (options.type === 'beacon' && navigator.sendBeacon) {
|
112
|
-
return navigator.sendBeacon(`${url}/api
|
115
|
+
return navigator.sendBeacon(`${url}/api/${path}`, new Blob([
|
113
116
|
JSON.stringify(Object.assign(Object.assign(Object.assign({}, options.body), bffDataSource.headers), { 'x-user-id': fakeUserId }))
|
114
117
|
], { type: 'application/json;charset=UTF-8' }));
|
115
118
|
}
|
116
119
|
return window
|
117
|
-
.fetch(`${url}/api
|
120
|
+
.fetch(`${url}/api/${path}`, {
|
118
121
|
headers: Object.assign({ 'Content-Type': 'application/json', 'x-user-id': fakeUserId }, bffDataSource.headers),
|
119
122
|
method: options.method,
|
120
123
|
body: JSON.stringify(options.body)
|
121
124
|
})
|
122
125
|
.then((res) => res.json())
|
123
126
|
.catch((err) => Promise.reject(err));
|
124
|
-
}, [bffDataSource]);
|
127
|
+
}, [bffDataSource, fakeUserId]);
|
125
128
|
const getRecommendVideos = useCallback((query) => __awaiter(void 0, void 0, void 0, function* () {
|
126
129
|
var _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
|
127
130
|
query = {
|
@@ -138,7 +141,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
138
141
|
query = Object.assign(Object.assign({}, query), { channel: decodeURIComponent(channel) });
|
139
142
|
}
|
140
143
|
else if (utmVal) {
|
141
|
-
const val = (_k = (_j = (_h = utmVal
|
144
|
+
const val = (_k = (_j = (_h = splitUrlParams(utmVal)) === null || _h === void 0 ? void 0 : _h.filter((val) => {
|
142
145
|
var _a, _b;
|
143
146
|
const key = val.split('=')[0];
|
144
147
|
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);
|
@@ -158,14 +161,16 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
158
161
|
const recurveRecList = (query) => __awaiter(void 0, void 0, void 0, function* () {
|
159
162
|
var _v, _w, _x, _y, _z, _0;
|
160
163
|
query.pageNum = pageNum;
|
161
|
-
result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'POST', body: query }));
|
164
|
+
result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/list', { method: 'POST', body: query }));
|
162
165
|
if (!(result === null || result === void 0 ? void 0 : result.success)) {
|
163
166
|
return undefined;
|
164
167
|
}
|
165
168
|
setLoading(false);
|
166
169
|
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 : []);
|
167
|
-
|
168
|
-
|
170
|
+
if ((rtcList === null || rtcList === void 0 ? void 0 : rtcList.length) === 0) {
|
171
|
+
setRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
172
|
+
setCacheRtcList(getFilterRecList(Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list })));
|
173
|
+
}
|
169
174
|
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));
|
170
175
|
if (isNotNullList) {
|
171
176
|
pageNum = pageNum + 1;
|
@@ -175,12 +180,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
175
180
|
yield recurveRecList(query);
|
176
181
|
if (!(query === null || query === void 0 ? void 0 : query.hashTag) && result)
|
177
182
|
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 });
|
178
|
-
return Object.assign(Object.assign({}, result.data), { recList: list });
|
183
|
+
return Object.assign(Object.assign({}, result === null || result === void 0 ? void 0 : result.data), { recList: list });
|
179
184
|
}
|
180
185
|
if (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) {
|
181
186
|
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 });
|
182
187
|
}
|
183
|
-
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/list', { method: 'POST', body: query }));
|
188
|
+
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/list', { method: 'POST', body: query }));
|
184
189
|
if (!(result === null || result === void 0 ? void 0 : result.success)) {
|
185
190
|
return undefined;
|
186
191
|
}
|
@@ -230,6 +235,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
230
235
|
return expire;
|
231
236
|
}, [data]);
|
232
237
|
const bffEventReport = useCallback(({ userInfo, eventInfo, reportLayId = true }) => {
|
238
|
+
var _a, _b;
|
233
239
|
if (!enableReportEvent || (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview)) {
|
234
240
|
return;
|
235
241
|
}
|
@@ -237,7 +243,16 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
237
243
|
userInfo = {};
|
238
244
|
}
|
239
245
|
const sessionID = storeAndLoadFeSessionId();
|
240
|
-
const
|
246
|
+
const params = {};
|
247
|
+
const queryString = location.search.slice(1);
|
248
|
+
(_a = splitUrlParams(queryString)) === null || _a === void 0 ? void 0 : _a.map((val) => {
|
249
|
+
const key = val.split('=')[0];
|
250
|
+
const value = val.split('=')[1];
|
251
|
+
params[key] = value;
|
252
|
+
});
|
253
|
+
console.log(params, '111');
|
254
|
+
const cl_source = params === null || params === void 0 ? void 0 : params.cl_source;
|
255
|
+
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 }));
|
241
256
|
const realUserInfo = Object.entries(userInfo).map(([k, v]) => ({ name: k, value: v }));
|
242
257
|
const realEventInfo = Object.entries(ef)
|
243
258
|
.map(([k, v]) => v && { name: k, value: v })
|
@@ -246,26 +261,35 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
246
261
|
console.log('userInfo:', userInfo);
|
247
262
|
console.log('eventInfo:', ef);
|
248
263
|
console.log('========= 结束 =========');
|
249
|
-
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(
|
264
|
+
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(`v2/event/report/CLD/${(_b = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _b === void 0 ? void 0 : _b['x-app-id']}/${eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.eventSubject}`, {
|
250
265
|
method: 'POST',
|
251
266
|
body: { userInfo: realUserInfo, eventInfo: realEventInfo },
|
252
267
|
type: 'beacon'
|
253
268
|
});
|
254
|
-
}, [
|
269
|
+
}, [
|
270
|
+
bffFetch,
|
271
|
+
curReqInfo,
|
272
|
+
enableReportEvent,
|
273
|
+
globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
|
274
|
+
layoutVariantId,
|
275
|
+
globalConfig,
|
276
|
+
playbookType,
|
277
|
+
bffDataSource
|
278
|
+
]);
|
255
279
|
const bffFbReport = useCallback(({ eventName, product }) => {
|
256
|
-
var _a, _b, _c, _d, _e;
|
280
|
+
var _a, _b, _c, _d, _e, _f;
|
257
281
|
if (!enableReportEvent ||
|
258
282
|
!enabledMetaConversionApi ||
|
259
283
|
(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview) ||
|
260
284
|
!((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _a === void 0 ? void 0 : _a[eventName])) {
|
261
285
|
return;
|
262
286
|
}
|
263
|
-
|
287
|
+
const jsonParams = cloneDeep((_b = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.converApi) === null || _b === void 0 ? void 0 : _b[eventName]);
|
264
288
|
const urlParams = new URLSearchParams(window.location.search);
|
265
289
|
const fbclid = urlParams === null || urlParams === void 0 ? void 0 : urlParams.get('fbclid');
|
266
290
|
const fix_par = {
|
267
291
|
event_source_url: (_c = window === null || window === void 0 ? void 0 : window.location) === null || _c === void 0 ? void 0 : _c.href,
|
268
|
-
external_id:
|
292
|
+
external_id: fakeUserId,
|
269
293
|
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 : '',
|
270
294
|
fbc: fbclid ? `fb.2.${new Date().getTime()}.${fbclid}` : '',
|
271
295
|
fbp: getCookie('_fbp') ? `fb.2.${new Date().getTime()}.${getCookie('_fbp')}` : '',
|
@@ -317,22 +341,30 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
317
341
|
}
|
318
342
|
};
|
319
343
|
getEventParams(jsonParams);
|
320
|
-
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(
|
344
|
+
return bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch(`v2/event/report/FB/${(_f = bffDataSource === null || bffDataSource === void 0 ? void 0 : bffDataSource.headers) === null || _f === void 0 ? void 0 : _f['x-app-id']}/${eventName}`, {
|
321
345
|
method: 'POST',
|
322
346
|
body: jsonParams,
|
323
347
|
type: 'beacon'
|
324
348
|
});
|
325
|
-
}, [
|
349
|
+
}, [
|
350
|
+
bffFetch,
|
351
|
+
enableReportEvent,
|
352
|
+
enabledMetaConversionApi,
|
353
|
+
globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.enablePreview,
|
354
|
+
globalConfig,
|
355
|
+
fakeUserId,
|
356
|
+
bffDataSource
|
357
|
+
]);
|
326
358
|
const bffMutateLike = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
327
|
-
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/like', { method: 'POST', body }));
|
359
|
+
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/like', { method: 'POST', body }));
|
328
360
|
return res === null || res === void 0 ? void 0 : res.success;
|
329
361
|
}), [bffFetch]);
|
330
362
|
const bffMutateUnlike = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
331
|
-
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/recommend/unlike', { method: 'POST', body }));
|
363
|
+
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/recommend/unlike', { method: 'POST', body }));
|
332
364
|
return res === null || res === void 0 ? void 0 : res.success;
|
333
365
|
}), [bffFetch]);
|
334
366
|
const bffSubmitForm = useCallback((body) => __awaiter(void 0, void 0, void 0, function* () {
|
335
|
-
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/customform', { method: 'POST', body }));
|
367
|
+
const res = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/customform', { method: 'POST', body }));
|
336
368
|
return res === null || res === void 0 ? void 0 : res.success;
|
337
369
|
}), [bffFetch]);
|
338
370
|
const bffGetTagList = useCallback((data) => __awaiter(void 0, void 0, void 0, function* () {
|
@@ -341,12 +373,12 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
341
373
|
if (!utmVal || !isShowTag)
|
342
374
|
return;
|
343
375
|
try {
|
344
|
-
const val = (_10 = (_9 = (_8 = utmVal
|
376
|
+
const val = (_10 = (_9 = (_8 = splitUrlParams(utmVal)) === null || _8 === void 0 ? void 0 : _8.filter((val) => {
|
345
377
|
var _a, _b;
|
346
378
|
const key = val.split('=')[0];
|
347
379
|
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);
|
348
380
|
})) === null || _9 === void 0 ? void 0 : _9.join('&')) !== null && _10 !== void 0 ? _10 : '';
|
349
|
-
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
|
381
|
+
const result = yield (bffFetch === null || bffFetch === void 0 ? void 0 : bffFetch('v1/tag/list', { method: 'GET', query: { channel: decodeURIComponent(val) } }));
|
350
382
|
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 : []);
|
351
383
|
}
|
352
384
|
catch (e) {
|
@@ -376,9 +408,14 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
376
408
|
});
|
377
409
|
}, [bffEventReport, isFromHashtag]);
|
378
410
|
const h5EnterLink = useCallback(() => {
|
379
|
-
var _a, _b;
|
411
|
+
var _a, _b, _c;
|
380
412
|
const queryString = location.search.slice(1);
|
381
|
-
const params =
|
413
|
+
const params = {};
|
414
|
+
(_a = splitUrlParams(queryString.replace(/\+/g, '%2B'))) === null || _a === void 0 ? void 0 : _a.map((val) => {
|
415
|
+
const key = val.split('=')[0];
|
416
|
+
const value = val.split('=')[1];
|
417
|
+
params[key] = value;
|
418
|
+
});
|
382
419
|
for (const key in params) {
|
383
420
|
params[key] = params[key].replace(/%2B/g, '+');
|
384
421
|
}
|
@@ -396,7 +433,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
396
433
|
utmContent: getVal('utm_content'),
|
397
434
|
enterTime: Math.floor(time / 1000) + '',
|
398
435
|
requestId: null,
|
399
|
-
enterUrl: (
|
436
|
+
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 : '',
|
400
437
|
clSource: getVal('cl_source')
|
401
438
|
},
|
402
439
|
reportLayId: false
|
@@ -420,10 +457,10 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
420
457
|
let curData;
|
421
458
|
let gldata;
|
422
459
|
if (data === null || data === void 0 ? void 0 : data.layoutVariantId) {
|
460
|
+
layId = data === null || data === void 0 ? void 0 : data.layoutVariantId;
|
461
|
+
setLayoutVariantId(data === null || data === void 0 ? void 0 : data.layoutVariantId);
|
423
462
|
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];
|
424
463
|
if (id) {
|
425
|
-
layId = id;
|
426
|
-
setLayoutVariantId(id);
|
427
464
|
curData = dataList === null || dataList === void 0 ? void 0 : dataList.find((item) => (item === null || item === void 0 ? void 0 : item.id) === id);
|
428
465
|
if (curData) {
|
429
466
|
setPageData(curData);
|
@@ -32,14 +32,16 @@ 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 = '';
|
35
36
|
if ((!(product === null || product === void 0 ? void 0 : product.currency) || !(product === null || product === void 0 ? void 0 : product.price)) && isHiddenDef)
|
36
37
|
return null;
|
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
|
-
|
38
|
+
let price = Number((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);
|
39
|
+
if (typeof price !== 'number')
|
40
|
+
return text;
|
39
41
|
let priceSymbol = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.priceSymbol;
|
40
42
|
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 : '' : '$';
|
41
43
|
const isToLocStr = enableFormattedPrice === undefined || enableFormattedPrice;
|
42
|
-
let decPic = price.toString();
|
44
|
+
let decPic = price === null || price === void 0 ? void 0 : price.toString();
|
43
45
|
if (priceSymbol === null || priceSymbol === void 0 ? void 0 : priceSymbol.showTwoDecimalPoint) {
|
44
46
|
decPic = price === null || price === void 0 ? void 0 : price.toFixed(2);
|
45
47
|
}
|
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 };
|
@@ -14,7 +14,10 @@ export interface IHashTagProps {
|
|
14
14
|
};
|
15
15
|
buttonBgStyle: CSSProperties;
|
16
16
|
showBanner?: boolean;
|
17
|
-
openFixedSize?:
|
17
|
+
openFixedSize?: {
|
18
|
+
open: true;
|
19
|
+
ratio: string;
|
20
|
+
};
|
18
21
|
}
|
19
22
|
declare const _default: React.NamedExoticComponent<IHashTagProps>;
|
20
23
|
export default _default;
|
@@ -0,0 +1,19 @@
|
|
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;
|
@@ -0,0 +1,19 @@
|
|
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);
|