pb-sxp-ui 1.0.69 → 1.0.70
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 +250 -130
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +1 -2
- package/dist/index.js +250 -130
- package/dist/index.js.map +1 -1
- package/dist/index.min.cjs +3 -3
- package/dist/index.min.cjs.map +1 -1
- package/dist/index.min.js +3 -3
- package/dist/index.min.js.map +1 -1
- package/dist/pb-ui.js +253 -133
- package/dist/pb-ui.js.map +1 -1
- package/dist/pb-ui.min.js +3 -3
- package/dist/pb-ui.min.js.map +1 -1
- package/es/core/components/DiyPortalPreview/VideoWidget.js +3 -2
- package/es/core/components/SxpPageCore/index.js +2 -2
- package/es/core/components/SxpPageRender/FingerSwipeTip/index.d.ts +2 -1
- package/es/core/components/SxpPageRender/FingerSwipeTip/index.js +2 -2
- package/es/core/components/SxpPageRender/FormatImage.js +1 -2
- package/es/core/components/SxpPageRender/VideoWidget/index.js +1 -1
- package/es/core/components/SxpPageRender/index.d.ts +5 -0
- package/es/core/components/SxpPageRender/index.js +14 -20
- package/es/core/context/SxpDataSourceProvider.d.ts +0 -1
- package/es/core/context/SxpDataSourceProvider.js +3 -3
- package/es/materials/sxp/defaultSetting.d.ts +1 -4
- package/es/materials/sxp/defaultSetting.js +4 -5
- package/es/materials/sxp/popup/AppointForm/index.d.ts +2 -1
- package/es/materials/sxp/popup/AppointForm/index.js +3 -8
- package/es/materials/sxp/popup/AppointForm/settingRender.d.ts +29 -8
- package/es/materials/sxp/popup/AppointForm/settingRender.js +33 -2
- package/es/materials/sxp/popup/CommodityDetail/index.d.ts +1 -0
- package/es/materials/sxp/popup/CommodityDetail/index.js +7 -1
- package/es/materials/sxp/popup/CommodityDetail/material.js +5 -2
- package/es/materials/sxp/popup/CommodityDetail/settingRender.d.ts +28 -0
- package/es/materials/sxp/popup/CommodityDetail/settingRender.js +30 -0
- package/es/materials/sxp/popup/CommodityDetailDiroNew/index.d.ts +1 -0
- package/es/materials/sxp/popup/CommodityDetailDiroNew/index.js +7 -1
- package/es/materials/sxp/popup/CommodityDetailDiroNew/settingRender.d.ts +16 -0
- package/es/materials/sxp/popup/CommodityDetailDiroNew/settingRender.js +13 -0
- package/es/materials/sxp/popup/Prompt/index.d.ts +2 -1
- package/es/materials/sxp/popup/Prompt/index.js +2 -2
- package/es/materials/sxp/popup/Prompt/settingRender.d.ts +46 -11
- package/es/materials/sxp/popup/Prompt/settingRender.js +57 -14
- package/es/materials/sxp/template/Commodity/index.d.ts +1 -0
- package/es/materials/sxp/template/Commodity/index.js +8 -2
- package/es/materials/sxp/template/CommodityDiro/index.d.ts +1 -0
- package/es/materials/sxp/template/CommodityDiro/index.js +8 -2
- package/es/materials/sxp/template/CommodityDiroNew/index.d.ts +1 -0
- package/es/materials/sxp/template/CommodityDiroNew/index.js +8 -2
- package/es/materials/sxp/template/MultiCommodity/index.d.ts +1 -0
- package/es/materials/sxp/template/MultiCommodity/index.js +4 -2
- package/es/materials/sxp/template/MultiCommodityDiro/index.d.ts +1 -0
- package/es/materials/sxp/template/MultiCommodityDiro/index.js +4 -2
- package/es/materials/sxp/template/MultiCommodityDiroNew/index.d.ts +1 -0
- package/es/materials/sxp/template/MultiCommodityDiroNew/index.js +4 -2
- package/es/materials/sxp/template/components/Img.d.ts +2 -1
- package/es/materials/sxp/template/components/Img.js +2 -2
- package/es/materials/sxp/template/components/settingRender.d.ts +50 -0
- package/es/materials/sxp/template/components/settingRender.js +8 -0
- package/lib/core/components/DiyPortalPreview/VideoWidget.js +3 -2
- package/lib/core/components/SxpPageCore/index.js +2 -2
- package/lib/core/components/SxpPageRender/FingerSwipeTip/index.d.ts +2 -1
- package/lib/core/components/SxpPageRender/FingerSwipeTip/index.js +2 -2
- package/lib/core/components/SxpPageRender/FormatImage.js +0 -1
- package/lib/core/components/SxpPageRender/VideoWidget/index.js +1 -1
- package/lib/core/components/SxpPageRender/index.d.ts +5 -0
- package/lib/core/components/SxpPageRender/index.js +14 -20
- package/lib/core/context/SxpDataSourceProvider.d.ts +0 -1
- package/lib/core/context/SxpDataSourceProvider.js +3 -3
- package/lib/materials/sxp/defaultSetting.d.ts +1 -4
- package/lib/materials/sxp/defaultSetting.js +4 -5
- package/lib/materials/sxp/popup/AppointForm/index.d.ts +2 -1
- package/lib/materials/sxp/popup/AppointForm/index.js +3 -8
- package/lib/materials/sxp/popup/AppointForm/settingRender.d.ts +29 -8
- package/lib/materials/sxp/popup/AppointForm/settingRender.js +34 -2
- package/lib/materials/sxp/popup/CommodityDetail/index.d.ts +1 -0
- package/lib/materials/sxp/popup/CommodityDetail/index.js +7 -1
- package/lib/materials/sxp/popup/CommodityDetail/material.js +5 -2
- package/lib/materials/sxp/popup/CommodityDetail/settingRender.d.ts +28 -0
- package/lib/materials/sxp/popup/CommodityDetail/settingRender.js +30 -0
- package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.d.ts +1 -0
- package/lib/materials/sxp/popup/CommodityDetailDiroNew/index.js +7 -1
- package/lib/materials/sxp/popup/CommodityDetailDiroNew/settingRender.d.ts +16 -0
- package/lib/materials/sxp/popup/CommodityDetailDiroNew/settingRender.js +13 -0
- package/lib/materials/sxp/popup/Prompt/index.d.ts +2 -1
- package/lib/materials/sxp/popup/Prompt/index.js +2 -2
- package/lib/materials/sxp/popup/Prompt/settingRender.d.ts +46 -11
- package/lib/materials/sxp/popup/Prompt/settingRender.js +58 -14
- package/lib/materials/sxp/template/Commodity/index.d.ts +1 -0
- package/lib/materials/sxp/template/Commodity/index.js +8 -2
- package/lib/materials/sxp/template/CommodityDiro/index.d.ts +1 -0
- package/lib/materials/sxp/template/CommodityDiro/index.js +8 -2
- package/lib/materials/sxp/template/CommodityDiroNew/index.d.ts +1 -0
- package/lib/materials/sxp/template/CommodityDiroNew/index.js +8 -2
- package/lib/materials/sxp/template/MultiCommodity/index.d.ts +1 -0
- package/lib/materials/sxp/template/MultiCommodity/index.js +4 -2
- package/lib/materials/sxp/template/MultiCommodityDiro/index.d.ts +1 -0
- package/lib/materials/sxp/template/MultiCommodityDiro/index.js +4 -2
- package/lib/materials/sxp/template/MultiCommodityDiroNew/index.d.ts +1 -0
- package/lib/materials/sxp/template/MultiCommodityDiroNew/index.js +4 -2
- package/lib/materials/sxp/template/components/Img.d.ts +2 -1
- package/lib/materials/sxp/template/components/Img.js +2 -2
- package/lib/materials/sxp/template/components/settingRender.d.ts +50 -0
- package/lib/materials/sxp/template/components/settingRender.js +8 -0
- package/package.json +2 -3
package/dist/index.cjs
CHANGED
@@ -9,8 +9,8 @@ var React = require('react');
|
|
9
9
|
var qs = require('qs');
|
10
10
|
var EventEmitter = require('eventemitter3');
|
11
11
|
var css = require('@emotion/css');
|
12
|
-
var proComponents = require('@ant-design/pro-components');
|
13
12
|
var ReactDOM = require('react-dom');
|
13
|
+
var Hls = require('hls.js');
|
14
14
|
|
15
15
|
function _interopNamespaceDefault(e) {
|
16
16
|
var n = Object.create(null);
|
@@ -446,7 +446,7 @@ var DataSourceType;
|
|
446
446
|
DataSourceType[DataSourceType["BFF"] = 5] = "BFF";
|
447
447
|
})(DataSourceType || (DataSourceType = {}));
|
448
448
|
const UTM_KEYS = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_id', 'utm_content', 'cl_source'];
|
449
|
-
const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false
|
449
|
+
const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false }) => {
|
450
450
|
const [rtcList, setRtcList] = React.useState([]);
|
451
451
|
const [tagList, setTagList] = React.useState([]);
|
452
452
|
const [loading, setLoading] = React.useState(false);
|
@@ -600,7 +600,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
600
600
|
// 获取 Tag
|
601
601
|
const bffGetTagList = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
602
602
|
var _h, _j, _k, _l, _m;
|
603
|
-
if (!utmVal
|
603
|
+
if (!utmVal)
|
604
604
|
return;
|
605
605
|
try {
|
606
606
|
const val = (_k = (_j = (_h = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _h === void 0 ? void 0 : _h.filter((val) => {
|
@@ -613,7 +613,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
613
613
|
catch (e) {
|
614
614
|
console.log('e', e);
|
615
615
|
}
|
616
|
-
}), [bffFetch, utmVal
|
616
|
+
}), [bffFetch, utmVal]);
|
617
617
|
const ctaEvent = React.useCallback((eventInfo, rec, product, position) => {
|
618
618
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
619
619
|
const cta = product === null || product === void 0 ? void 0 : product.bindCta;
|
@@ -946,23 +946,30 @@ var interactionRender$8 = [
|
|
946
946
|
}
|
947
947
|
];
|
948
948
|
|
949
|
-
|
950
|
-
|
951
|
-
|
952
|
-
|
949
|
+
/*
|
950
|
+
* @Author: binruan@chatlabs.com
|
951
|
+
* @Date: 2024-04-28 14:42:22
|
952
|
+
* @LastEditors: binruan@chatlabs.com
|
953
|
+
* @LastEditTime: 2024-05-17 14:07:01
|
954
|
+
* @FilePath: \pb-sxp-ui\src\materials\sxp\defaultSetting.ts
|
955
|
+
*
|
956
|
+
*/
|
957
|
+
const fontOptions = [{ label: '默认字体', value: 'appFont' }];
|
958
|
+
const sxpFonts = typeof window !== 'undefined' && (window === null || window === void 0 ? void 0 : window.localStorage.getItem('sxp_font_links'));
|
959
|
+
const data = sxpFonts && sxpFonts !== '' ? JSON.parse(sxpFonts) : [];
|
953
960
|
var defaultSetting = {
|
954
|
-
fontOptions
|
961
|
+
fontOptions: [...fontOptions, ...data]
|
955
962
|
};
|
956
963
|
|
957
964
|
/*
|
958
965
|
* @Author: binruan@chatlabs.com
|
959
966
|
* @Date: 2023-07-28 18:29:57
|
960
967
|
* @LastEditors: binruan@chatlabs.com
|
961
|
-
* @LastEditTime:
|
968
|
+
* @LastEditTime: 2024-05-17 10:11:41
|
962
969
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\popup\AppointForm\settingRender.tsx
|
963
970
|
*
|
964
971
|
*/
|
965
|
-
var _a$
|
972
|
+
var _a$5, _b$5, _c;
|
966
973
|
var settingRender$5 = [
|
967
974
|
{
|
968
975
|
type: 'Text',
|
@@ -989,7 +996,7 @@ var settingRender$5 = [
|
|
989
996
|
type: 'Select',
|
990
997
|
name: ['textStyle', 'fontFamily'],
|
991
998
|
options: fontOptions,
|
992
|
-
initialValue: (_a$
|
999
|
+
initialValue: (_a$5 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _a$5 === void 0 ? void 0 : _a$5.value
|
993
1000
|
},
|
994
1001
|
{
|
995
1002
|
type: 'Number',
|
@@ -1032,6 +1039,37 @@ var settingRender$5 = [
|
|
1032
1039
|
type: 'Text',
|
1033
1040
|
name: ['props', 'submitText']
|
1034
1041
|
},
|
1042
|
+
{
|
1043
|
+
type: 'Group',
|
1044
|
+
label: '提交按钮字体',
|
1045
|
+
child: [
|
1046
|
+
{
|
1047
|
+
type: 'Color',
|
1048
|
+
name: ['props', 'submitButtonStyle', 'color'],
|
1049
|
+
initialValue: '#fff'
|
1050
|
+
},
|
1051
|
+
{
|
1052
|
+
type: 'Select',
|
1053
|
+
name: ['props', 'submitButtonStyle', 'fontFamily'],
|
1054
|
+
options: defaultSetting === null || defaultSetting === void 0 ? void 0 : defaultSetting.fontOptions,
|
1055
|
+
initialValue: (_c = (_b$5 = defaultSetting === null || defaultSetting === void 0 ? void 0 : defaultSetting.fontOptions) === null || _b$5 === void 0 ? void 0 : _b$5[0]) === null || _c === void 0 ? void 0 : _c.value
|
1056
|
+
},
|
1057
|
+
{
|
1058
|
+
type: 'Number',
|
1059
|
+
name: ['props', 'submitButtonStyle', 'fontSize'],
|
1060
|
+
addonAfter: 'px',
|
1061
|
+
initialValue: 12
|
1062
|
+
}
|
1063
|
+
]
|
1064
|
+
},
|
1065
|
+
{
|
1066
|
+
type: 'TextStyle',
|
1067
|
+
name: ['props', 'submitButtonStyle']
|
1068
|
+
},
|
1069
|
+
{
|
1070
|
+
type: 'TextAlign',
|
1071
|
+
name: ['props', 'submitButtonStyle']
|
1072
|
+
},
|
1035
1073
|
{
|
1036
1074
|
label: '提交文本颜色',
|
1037
1075
|
type: 'Color',
|
@@ -1152,7 +1190,7 @@ function useEventReport() {
|
|
1152
1190
|
}
|
1153
1191
|
|
1154
1192
|
const AppointForm$1 = (_a) => {
|
1155
|
-
var { columns, style, title, textStyle, submitBgColor, submitColor, submitText, layoutType, isExternalLink, isPopup, onClick, onClose } = _a, props = __rest(_a, ["columns", "style", "title", "textStyle", "submitBgColor", "submitColor", "submitText", "layoutType", "isExternalLink", "isPopup", "onClick", "onClose"]);
|
1193
|
+
var { columns, style, title, textStyle, submitBgColor, submitColor, submitText, layoutType, isExternalLink, isPopup, onClick, onClose, submitButtonStyle } = _a, props = __rest(_a, ["columns", "style", "title", "textStyle", "submitBgColor", "submitColor", "submitText", "layoutType", "isExternalLink", "isPopup", "onClick", "onClose", "submitButtonStyle"]);
|
1156
1194
|
const { submitForm, popupDetailData } = useSxpDataSource();
|
1157
1195
|
const { jumpToWeb } = useEventReport();
|
1158
1196
|
const formRef = React.useRef();
|
@@ -1183,7 +1221,7 @@ const AppointForm$1 = (_a) => {
|
|
1183
1221
|
key: '4'
|
1184
1222
|
}
|
1185
1223
|
], []);
|
1186
|
-
|
1224
|
+
React.useMemo(() => {
|
1187
1225
|
if (layoutType === undefined) {
|
1188
1226
|
const list = lodash.cloneDeep(columns) || defaultColumns;
|
1189
1227
|
return list === null || list === void 0 ? void 0 : list.map((obj) => (Object.assign(Object.assign({}, obj), { title: undefined, fieldProps: { placeholder: obj === null || obj === void 0 ? void 0 : obj.title } })));
|
@@ -1226,13 +1264,9 @@ const AppointForm$1 = (_a) => {
|
|
1226
1264
|
return (React.createElement("div", { className: 'pb-appoint-form' },
|
1227
1265
|
React.createElement("div", { className: `pb-appoint-form-title ${css.css(Object.assign({}, textStyle))}` }, title),
|
1228
1266
|
React.createElement("div", Object.assign({ className: css.css(Object.assign({}, style)) }, props),
|
1229
|
-
React.createElement("div", { className: 'pb-appoint-form-container' },
|
1230
|
-
React.createElement(proComponents.BetaSchemaForm, { columns: columnsData, submitter: false, layout: layoutType, autoFocusFirstInput: false, size: 'large', formRef: formRef, className: 'panel-reset' }))),
|
1267
|
+
React.createElement("div", { className: 'pb-appoint-form-container' })),
|
1231
1268
|
React.createElement("div", { className: 'pb-appoint-form-btn-wrapper' },
|
1232
|
-
React.createElement("button", { onClick: handleSubmit, className: 'pb-appoint-form-btn', style: {
|
1233
|
-
color: submitColor,
|
1234
|
-
background: submitBgColor
|
1235
|
-
} }, loading ? React.createElement(React.Fragment, null, "loading...") : submitText))));
|
1269
|
+
React.createElement("button", { onClick: handleSubmit, className: 'pb-appoint-form-btn', style: Object.assign({ color: submitColor, background: submitBgColor }, submitButtonStyle) }, loading ? React.createElement(React.Fragment, null, "loading...") : submitText))));
|
1236
1270
|
};
|
1237
1271
|
var AppointFormComponent = React.memo(AppointForm$1);
|
1238
1272
|
|
@@ -1280,23 +1314,7 @@ const AppointForm = createMaterial(AppointFormComponent, {
|
|
1280
1314
|
sort: 2
|
1281
1315
|
});
|
1282
1316
|
|
1283
|
-
|
1284
|
-
* @Author: binruan@chatlabs.com
|
1285
|
-
* @Date: 2024-04-02 18:01:34
|
1286
|
-
* @LastEditors: binruan@chatlabs.com
|
1287
|
-
* @LastEditTime: 2024-04-12 16:46:04
|
1288
|
-
* @FilePath: \pb-sxp-ui\src\materials\sxp\popup\CommodityDetail\settingRender.tsx
|
1289
|
-
*
|
1290
|
-
*/
|
1291
|
-
var _a$3, _b$3;
|
1292
|
-
/*
|
1293
|
-
* @Author: binruan@chatlabs.com
|
1294
|
-
* @Date: 2024-03-26 16:50:25
|
1295
|
-
* @LastEditors: binruan@chatlabs.com
|
1296
|
-
* @LastEditTime: 2024-03-28 18:42:26
|
1297
|
-
* @FilePath: \pb-sxp-ui\src\materials\sxp\popup\CommodityDetailDiroNew\settingRender.tsx
|
1298
|
-
*
|
1299
|
-
*/
|
1317
|
+
var _a$4, _b$4;
|
1300
1318
|
var settingRender$4 = [
|
1301
1319
|
{
|
1302
1320
|
title: '商品图片',
|
@@ -1320,6 +1338,19 @@ var settingRender$4 = [
|
|
1320
1338
|
type: 'Number',
|
1321
1339
|
name: ['props', 'swiper', 'delay'],
|
1322
1340
|
addonAfter: 's'
|
1341
|
+
},
|
1342
|
+
{
|
1343
|
+
type: 'Group',
|
1344
|
+
child: [
|
1345
|
+
{
|
1346
|
+
label: '居中垂直偏移',
|
1347
|
+
type: 'Number',
|
1348
|
+
name: ['props', 'swiper', 'translateY'],
|
1349
|
+
min: -100,
|
1350
|
+
addonAfter: '%',
|
1351
|
+
initialValue: 0
|
1352
|
+
}
|
1353
|
+
]
|
1323
1354
|
}
|
1324
1355
|
]
|
1325
1356
|
},
|
@@ -1354,6 +1385,23 @@ var settingRender$4 = [
|
|
1354
1385
|
name: ['props', 'commodityStyles', 'field'],
|
1355
1386
|
initialValue: 'title'
|
1356
1387
|
},
|
1388
|
+
{
|
1389
|
+
type: 'Group',
|
1390
|
+
child: [
|
1391
|
+
{
|
1392
|
+
label: '上边距',
|
1393
|
+
type: 'Number',
|
1394
|
+
addonAfter: 'px',
|
1395
|
+
name: ['marginTop']
|
1396
|
+
},
|
1397
|
+
{
|
1398
|
+
label: '下边距',
|
1399
|
+
type: 'Number',
|
1400
|
+
addonAfter: 'px',
|
1401
|
+
name: ['marginBottom']
|
1402
|
+
}
|
1403
|
+
]
|
1404
|
+
},
|
1357
1405
|
{
|
1358
1406
|
type: 'Group',
|
1359
1407
|
label: '标题字体',
|
@@ -1366,7 +1414,7 @@ var settingRender$4 = [
|
|
1366
1414
|
type: 'Select',
|
1367
1415
|
options: fontOptions,
|
1368
1416
|
name: ['fontFamily'],
|
1369
|
-
initialValue: (_a$
|
1417
|
+
initialValue: (_a$4 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _a$4 === void 0 ? void 0 : _a$4.value
|
1370
1418
|
},
|
1371
1419
|
{
|
1372
1420
|
type: 'Number',
|
@@ -1446,7 +1494,7 @@ var settingRender$4 = [
|
|
1446
1494
|
type: 'Select',
|
1447
1495
|
name: ['props', 'buttonStyle', 'fontFamily'],
|
1448
1496
|
options: fontOptions,
|
1449
|
-
initialValue: (_b$
|
1497
|
+
initialValue: (_b$4 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _b$4 === void 0 ? void 0 : _b$4.value
|
1450
1498
|
},
|
1451
1499
|
{
|
1452
1500
|
type: 'Number',
|
@@ -8391,7 +8439,7 @@ var ExpandableText$1 = React.memo(ExpandableText);
|
|
8391
8439
|
* @Author: binruan@chatlabs.com
|
8392
8440
|
* @Date: 2024-03-20 10:27:31
|
8393
8441
|
* @LastEditors: binruan@chatlabs.com
|
8394
|
-
* @LastEditTime: 2024-
|
8442
|
+
* @LastEditTime: 2024-04-19 14:12:55
|
8395
8443
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\FormatImage.tsx
|
8396
8444
|
*
|
8397
8445
|
*/
|
@@ -8406,30 +8454,6 @@ const FormatImage = React.forwardRef((props, ref) => {
|
|
8406
8454
|
React.useEffect(() => {
|
8407
8455
|
setImgSrc(src);
|
8408
8456
|
}, [src]);
|
8409
|
-
React.useRef(null);
|
8410
|
-
// useEffect(() => {
|
8411
|
-
// let observer: any = null;
|
8412
|
-
// const { current } = imgRef;
|
8413
|
-
// if (current) {
|
8414
|
-
// observer = new IntersectionObserver(
|
8415
|
-
// (entries) => {
|
8416
|
-
// entries.forEach((entry) => {
|
8417
|
-
// if (entry.isIntersecting) {
|
8418
|
-
// setImgSrc(src);
|
8419
|
-
// observer.unobserve(current);
|
8420
|
-
// }
|
8421
|
-
// });
|
8422
|
-
// },
|
8423
|
-
// { threshold: 0.1 } // 触发阈值,可根据需要调整
|
8424
|
-
// );
|
8425
|
-
// observer.observe(current);
|
8426
|
-
// }
|
8427
|
-
// return () => {
|
8428
|
-
// if (observer && current) {
|
8429
|
-
// observer.unobserve(current);
|
8430
|
-
// }
|
8431
|
-
// };
|
8432
|
-
// }, [src]);
|
8433
8457
|
return (React.createElement(React.Fragment, null, (imgSrc === null || imgSrc === void 0 ? void 0 : imgSrc.includes('.avif')) ? (React.createElement("picture", null,
|
8434
8458
|
React.createElement("source", { type: 'image/avif', srcSet: imgSrc }),
|
8435
8459
|
React.createElement("source", { type: 'image/webp', srcSet: `${imgSrc}?imageMogr2/format/webp` }),
|
@@ -8526,7 +8550,13 @@ const CommodityDetail$1 = (_a) => {
|
|
8526
8550
|
width,
|
8527
8551
|
height: width
|
8528
8552
|
} },
|
8529
|
-
React.createElement(FormatImage$1, { style: {
|
8553
|
+
React.createElement(FormatImage$1, { style: {
|
8554
|
+
height: '100%',
|
8555
|
+
width: '100%',
|
8556
|
+
objectFit: 'cover',
|
8557
|
+
display: 'block',
|
8558
|
+
transform: `translateY(${swiper === null || swiper === void 0 ? void 0 : swiper.translateY})%`
|
8559
|
+
}, src: src }))));
|
8530
8560
|
}))),
|
8531
8561
|
!((_j = product === null || product === void 0 ? void 0 : product.homePage) === null || _j === void 0 ? void 0 : _j.length) && (React.createElement("div", { className: css.css({
|
8532
8562
|
position: 'relative',
|
@@ -8575,7 +8605,9 @@ const CommodityDetail = createMaterial(CommodityDetailComponent, {
|
|
8575
8605
|
commodityStyles: {
|
8576
8606
|
price: {
|
8577
8607
|
color: '#000',
|
8578
|
-
fontSize: 18
|
8608
|
+
fontSize: 18,
|
8609
|
+
marginTop: 24,
|
8610
|
+
marginBottom: 10
|
8579
8611
|
},
|
8580
8612
|
title: {
|
8581
8613
|
color: '#000',
|
@@ -8583,7 +8615,8 @@ const CommodityDetail = createMaterial(CommodityDetailComponent, {
|
|
8583
8615
|
},
|
8584
8616
|
collection: {
|
8585
8617
|
fontSize: 12,
|
8586
|
-
color: '#000'
|
8618
|
+
color: '#000',
|
8619
|
+
marginBottom: 14
|
8587
8620
|
},
|
8588
8621
|
info: {
|
8589
8622
|
color: 'gray',
|
@@ -8622,26 +8655,68 @@ var interactionRender$7 = [
|
|
8622
8655
|
* @Author: binruan@chatlabs.com
|
8623
8656
|
* @Date: 2023-10-27 14:06:35
|
8624
8657
|
* @LastEditors: binruan@chatlabs.com
|
8625
|
-
* @LastEditTime:
|
8658
|
+
* @LastEditTime: 2024-05-17 10:29:41
|
8626
8659
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\popup\Prompt\settingRender.tsx
|
8627
8660
|
*
|
8628
8661
|
*/
|
8662
|
+
var _a$3, _b$3;
|
8629
8663
|
var settingRender$3 = [
|
8630
8664
|
{
|
8631
|
-
|
8632
|
-
|
8633
|
-
|
8634
|
-
|
8635
|
-
|
8636
|
-
|
8637
|
-
|
8638
|
-
|
8639
|
-
|
8640
|
-
|
8641
|
-
|
8642
|
-
|
8643
|
-
|
8644
|
-
|
8665
|
+
title: '',
|
8666
|
+
child: [
|
8667
|
+
{
|
8668
|
+
type: 'Media',
|
8669
|
+
label: '图标',
|
8670
|
+
name: ['props', 'icon'],
|
8671
|
+
mediaType: 'Image'
|
8672
|
+
},
|
8673
|
+
{
|
8674
|
+
type: 'TextArea',
|
8675
|
+
label: '内容',
|
8676
|
+
name: ['props', 'content']
|
8677
|
+
},
|
8678
|
+
{
|
8679
|
+
type: 'Text',
|
8680
|
+
label: '按钮文案',
|
8681
|
+
name: ['props', 'btnText']
|
8682
|
+
},
|
8683
|
+
{
|
8684
|
+
type: 'Group',
|
8685
|
+
label: '提交按钮字体',
|
8686
|
+
child: [
|
8687
|
+
{
|
8688
|
+
type: 'Color',
|
8689
|
+
name: ['props', 'submitButtonStyle', 'color'],
|
8690
|
+
initialValue: '#fff'
|
8691
|
+
},
|
8692
|
+
{
|
8693
|
+
type: 'Select',
|
8694
|
+
name: ['props', 'submitButtonStyle', 'fontFamily'],
|
8695
|
+
options: defaultSetting === null || defaultSetting === void 0 ? void 0 : defaultSetting.fontOptions,
|
8696
|
+
initialValue: (_b$3 = (_a$3 = defaultSetting === null || defaultSetting === void 0 ? void 0 : defaultSetting.fontOptions) === null || _a$3 === void 0 ? void 0 : _a$3[0]) === null || _b$3 === void 0 ? void 0 : _b$3.value
|
8697
|
+
},
|
8698
|
+
{
|
8699
|
+
type: 'Number',
|
8700
|
+
name: ['props', 'submitButtonStyle', 'fontSize'],
|
8701
|
+
addonAfter: 'px',
|
8702
|
+
initialValue: 12
|
8703
|
+
}
|
8704
|
+
]
|
8705
|
+
},
|
8706
|
+
{
|
8707
|
+
type: 'TextStyle',
|
8708
|
+
name: ['props', 'submitButtonStyle']
|
8709
|
+
},
|
8710
|
+
{
|
8711
|
+
type: 'TextAlign',
|
8712
|
+
name: ['props', 'submitButtonStyle']
|
8713
|
+
},
|
8714
|
+
{
|
8715
|
+
label: '提交按钮颜色',
|
8716
|
+
type: 'Color',
|
8717
|
+
name: ['props', 'submitButtonStyle', 'backgroundColor']
|
8718
|
+
}
|
8719
|
+
]
|
8645
8720
|
}
|
8646
8721
|
];
|
8647
8722
|
|
@@ -8680,7 +8755,7 @@ const getMediaValueByMode = (obj) => {
|
|
8680
8755
|
};
|
8681
8756
|
|
8682
8757
|
const Prompt$1 = (_a) => {
|
8683
|
-
var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick } = _a, props = __rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick"]);
|
8758
|
+
var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick, submitButtonStyle } = _a, props = __rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick", "submitButtonStyle"]);
|
8684
8759
|
const { popupDetailData } = useSxpDataSource();
|
8685
8760
|
const { jumpToWeb } = useEventReport();
|
8686
8761
|
const iconSrc = typeof icon === 'string' ? icon : getMediaValueByMode(icon);
|
@@ -8702,7 +8777,7 @@ const Prompt$1 = (_a) => {
|
|
8702
8777
|
React.createElement("div", { className: 'pb-prompt-icon' },
|
8703
8778
|
React.createElement("img", { width: '100%', src: iconSrc !== null && iconSrc !== void 0 ? iconSrc : img$2 })),
|
8704
8779
|
React.createElement("div", { className: 'pb-prompt-content' }, content),
|
8705
|
-
React.createElement("button", { className: 'pb-prompt-btn', onClick: handleOk }, btnText)));
|
8780
|
+
React.createElement("button", { className: 'pb-prompt-btn', style: submitButtonStyle, onClick: handleOk }, btnText)));
|
8706
8781
|
};
|
8707
8782
|
var PromptComponent = React.memo(Prompt$1);
|
8708
8783
|
|
@@ -8761,6 +8836,19 @@ var settingRender$2 = [
|
|
8761
8836
|
type: 'Number',
|
8762
8837
|
name: ['props', 'swiper', 'delay'],
|
8763
8838
|
addonAfter: 's'
|
8839
|
+
},
|
8840
|
+
{
|
8841
|
+
type: 'Group',
|
8842
|
+
child: [
|
8843
|
+
{
|
8844
|
+
label: '居中垂直偏移',
|
8845
|
+
type: 'Number',
|
8846
|
+
name: ['props', 'swiper', 'translateY'],
|
8847
|
+
min: -100,
|
8848
|
+
addonAfter: '%',
|
8849
|
+
initialValue: 0
|
8850
|
+
}
|
8851
|
+
]
|
8764
8852
|
}
|
8765
8853
|
]
|
8766
8854
|
},
|
@@ -8992,7 +9080,13 @@ Made in Italy` })));
|
|
8992
9080
|
width,
|
8993
9081
|
height: width
|
8994
9082
|
} },
|
8995
|
-
React.createElement(FormatImage$1, { style: {
|
9083
|
+
React.createElement(FormatImage$1, { style: {
|
9084
|
+
height: '100%',
|
9085
|
+
width: '100%',
|
9086
|
+
objectFit: 'cover',
|
9087
|
+
display: 'block',
|
9088
|
+
transform: `translateY(${swiper === null || swiper === void 0 ? void 0 : swiper.translateY})%`
|
9089
|
+
}, src: src }))));
|
8996
9090
|
}))),
|
8997
9091
|
!((_j = product === null || product === void 0 ? void 0 : product.homePage) === null || _j === void 0 ? void 0 : _j.length) && (React.createElement("div", { className: css.css({
|
8998
9092
|
position: 'relative',
|
@@ -9093,7 +9187,7 @@ var _a$1, _b$1;
|
|
9093
9187
|
* @Author: binruan@chatlabs.com
|
9094
9188
|
* @Date: 2024-03-26 16:50:25
|
9095
9189
|
* @LastEditors: binruan@chatlabs.com
|
9096
|
-
* @LastEditTime: 2024-
|
9190
|
+
* @LastEditTime: 2024-05-21 16:39:34
|
9097
9191
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\template\components\settingRender.tsx
|
9098
9192
|
*
|
9099
9193
|
*/
|
@@ -9194,6 +9288,14 @@ var settingRender$1 = [
|
|
9194
9288
|
label: '与右侧边距',
|
9195
9289
|
addonAfter: 'px',
|
9196
9290
|
name: ['props', 'ctaTempStyles', 'img', 'marginRight']
|
9291
|
+
},
|
9292
|
+
{
|
9293
|
+
label: '居中垂直偏移',
|
9294
|
+
type: 'Number',
|
9295
|
+
name: ['props', 'translateY'],
|
9296
|
+
min: -100,
|
9297
|
+
addonAfter: '%',
|
9298
|
+
initialValue: 0
|
9197
9299
|
}
|
9198
9300
|
]
|
9199
9301
|
},
|
@@ -9399,13 +9501,19 @@ var styles$6 = {"tow-line-ellipsis":"index-module_tow-line-ellipsis__3bKKx"};
|
|
9399
9501
|
|
9400
9502
|
const Commodity$1 = (_a) => {
|
9401
9503
|
var _b, _c, _d, _e, _f, _g, _h;
|
9402
|
-
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink"]);
|
9504
|
+
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY"]);
|
9403
9505
|
const { sxpParameter } = useSxpDataSource();
|
9404
9506
|
const product = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProduct;
|
9405
9507
|
const src = (_e = (_d = (_c = product === null || product === void 0 ? void 0 : product.homePage) === null || _c === void 0 ? void 0 : _c[0]) !== null && _d !== void 0 ? _d : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _e !== void 0 ? _e : bottom_image;
|
9406
9508
|
return (React.createElement(EventProvider$1, Object.assign({ isExternalLink: isExternalLink, rec: recData, className: css.css(Object.assign({}, style)), style: { display: 'flex' } }, props),
|
9407
9509
|
React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9408
|
-
React.createElement(FormatImage$1, { className: css.css({
|
9510
|
+
React.createElement(FormatImage$1, { className: css.css({
|
9511
|
+
width: '100%',
|
9512
|
+
objectFit: 'cover',
|
9513
|
+
height: '100%',
|
9514
|
+
display: 'block',
|
9515
|
+
transform: `translateY(${translateY}%)`
|
9516
|
+
}), src: src })),
|
9409
9517
|
React.createElement("div", { className: css.css({
|
9410
9518
|
color: '#fff',
|
9411
9519
|
display: 'flex',
|
@@ -9642,13 +9750,19 @@ var styles$4 = {"tow-line-ellipsis":"index-module_tow-line-ellipsis__yyHVb"};
|
|
9642
9750
|
|
9643
9751
|
const CommodityDiro$1 = (_a) => {
|
9644
9752
|
var _b, _c, _d, _e, _f, _g, _h;
|
9645
|
-
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink"]);
|
9753
|
+
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY"]);
|
9646
9754
|
const { sxpParameter } = useSxpDataSource();
|
9647
9755
|
const product = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProduct;
|
9648
9756
|
const src = (_e = (_d = (_c = product === null || product === void 0 ? void 0 : product.homePage) === null || _c === void 0 ? void 0 : _c[0]) !== null && _d !== void 0 ? _d : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _e !== void 0 ? _e : bottom_image;
|
9649
9757
|
return (React.createElement(EventProvider$1, Object.assign({ isExternalLink: isExternalLink, rec: recData, className: css.css(Object.assign({}, style)), style: { display: 'flex' } }, props),
|
9650
9758
|
React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9651
|
-
React.createElement(FormatImage$1, { className: css.css({
|
9759
|
+
React.createElement(FormatImage$1, { className: css.css({
|
9760
|
+
width: '100%',
|
9761
|
+
objectFit: 'cover',
|
9762
|
+
height: '100%',
|
9763
|
+
display: 'block',
|
9764
|
+
transform: `translateY(${translateY}%)`
|
9765
|
+
}), src: src })),
|
9652
9766
|
React.createElement("div", { className: css.css({
|
9653
9767
|
color: '#fff',
|
9654
9768
|
display: 'flex',
|
@@ -9734,13 +9848,19 @@ var styles$3 = {"tow-line-ellipsis":"index-module_tow-line-ellipsis__I-yCC"};
|
|
9734
9848
|
|
9735
9849
|
const CommodityDiroNew$1 = (_a) => {
|
9736
9850
|
var _b, _c, _d, _e, _f, _g, _h;
|
9737
|
-
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink"]);
|
9851
|
+
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY"]);
|
9738
9852
|
const { sxpParameter } = useSxpDataSource();
|
9739
9853
|
const product = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProduct;
|
9740
9854
|
const src = (_e = (_d = (_c = product === null || product === void 0 ? void 0 : product.homePage) === null || _c === void 0 ? void 0 : _c[0]) !== null && _d !== void 0 ? _d : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _e !== void 0 ? _e : bottom_image;
|
9741
9855
|
return (React.createElement(EventProvider$1, Object.assign({ isExternalLink: isExternalLink, rec: recData, className: css.css(Object.assign({}, style)), style: { display: 'flex' } }, props),
|
9742
9856
|
React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9743
|
-
React.createElement(FormatImage$1, { className: css.css({
|
9857
|
+
React.createElement(FormatImage$1, { className: css.css({
|
9858
|
+
width: '100%',
|
9859
|
+
objectFit: 'cover',
|
9860
|
+
height: '100%',
|
9861
|
+
display: 'block',
|
9862
|
+
transform: `translateY(${translateY}%)`
|
9863
|
+
}), src: src })),
|
9744
9864
|
React.createElement("div", { className: css.css({
|
9745
9865
|
color: '#fff',
|
9746
9866
|
display: 'flex',
|
@@ -9832,11 +9952,11 @@ var Scroll$1 = React.memo(Scroll);
|
|
9832
9952
|
* @Author: binruan@chatlabs.com
|
9833
9953
|
* @Date: 2024-01-16 14:50:13
|
9834
9954
|
* @LastEditors: binruan@chatlabs.com
|
9835
|
-
* @LastEditTime: 2024-
|
9955
|
+
* @LastEditTime: 2024-05-21 16:34:13
|
9836
9956
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\template\components\Img.tsx
|
9837
9957
|
*
|
9838
9958
|
*/
|
9839
|
-
const Img = ({ src, rec, item, index }) => {
|
9959
|
+
const Img = ({ src, rec, item, index, style }) => {
|
9840
9960
|
const ref = React.useRef(null);
|
9841
9961
|
const isOnScreen = useOnScreen(ref);
|
9842
9962
|
const { ctaEvent } = useSxpDataSource();
|
@@ -9849,7 +9969,7 @@ const Img = ({ src, rec, item, index }) => {
|
|
9849
9969
|
}
|
9850
9970
|
}, [isOnScreen, src, ref, rec, ctaEvent, item, index]);
|
9851
9971
|
return (React.createElement("div", { ref: ref, hidden: !src, className: css.css({ width: '100%', height: '100%' }) },
|
9852
|
-
React.createElement(FormatImage$1, { className: css.css({ width: '100%', objectFit: 'cover', height: '100%', display: 'block' }), src: src })));
|
9972
|
+
React.createElement(FormatImage$1, { className: css.css(Object.assign({ width: '100%', objectFit: 'cover', height: '100%', display: 'block' }, style)), src: src })));
|
9853
9973
|
};
|
9854
9974
|
var Img$1 = React.memo(Img);
|
9855
9975
|
|
@@ -9857,7 +9977,7 @@ var styles$2 = {"two-line-ellipsis":"index-module_two-line-ellipsis__SFQwJ"};
|
|
9857
9977
|
|
9858
9978
|
const MultiCommodityDiro$1 = (_a) => {
|
9859
9979
|
var _b, _c;
|
9860
|
-
var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index"]);
|
9980
|
+
var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index", "translateY"]);
|
9861
9981
|
const { ctaEvent, setPopupDetailData, sxpParameter } = useSxpDataSource();
|
9862
9982
|
const { popup } = useEditor();
|
9863
9983
|
const { jumpToWeb } = useEventReport();
|
@@ -9882,7 +10002,9 @@ const MultiCommodityDiro$1 = (_a) => {
|
|
9882
10002
|
var _a, _b, _c, _d, _e, _f;
|
9883
10003
|
return (React.createElement(SwiperSlide, Object.assign({ hidden: recData && !(item === null || item === void 0 ? void 0 : item.bindCta), key: item === null || item === void 0 ? void 0 : item.itemId, className: css.css(Object.assign(Object.assign({}, style), { display: 'flex', flexShrink: 0, marginLeft: 0, marginRight: '8px' })) }, props, { onClick: () => handleClick(item) }),
|
9884
10004
|
React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9885
|
-
React.createElement(Img$1, { src: (_c = (_b = (_a = item === null || item === void 0 ? void 0 : item.homePage) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _c !== void 0 ? _c : bottom_image, rec: recData, item: item, index: index
|
10005
|
+
React.createElement(Img$1, { src: (_c = (_b = (_a = item === null || item === void 0 ? void 0 : item.homePage) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _c !== void 0 ? _c : bottom_image, rec: recData, item: item, index: index, style: {
|
10006
|
+
transform: `translateY(${translateY}%)`
|
10007
|
+
} })),
|
9886
10008
|
React.createElement("div", { className: css.css({
|
9887
10009
|
color: '#000',
|
9888
10010
|
display: 'flex',
|
@@ -9969,7 +10091,7 @@ var styles$1 = {"two-line-ellipsis":"index-module_two-line-ellipsis__mdzn0"};
|
|
9969
10091
|
|
9970
10092
|
const MultiCommodity$1 = (_a) => {
|
9971
10093
|
var _b, _c;
|
9972
|
-
var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index"]);
|
10094
|
+
var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index", "translateY"]);
|
9973
10095
|
const { sxpParameter } = useSxpDataSource();
|
9974
10096
|
const { ctaEvent, setPopupDetailData } = useSxpDataSource();
|
9975
10097
|
const { popup } = useEditor();
|
@@ -9995,7 +10117,9 @@ const MultiCommodity$1 = (_a) => {
|
|
9995
10117
|
var _a, _b, _c, _d, _e, _f;
|
9996
10118
|
return (React.createElement(SwiperSlide, Object.assign({ hidden: recData && !(item === null || item === void 0 ? void 0 : item.bindCta), key: item.itemId, className: css.css(Object.assign(Object.assign({}, style), { display: 'flex', flexShrink: 0, marginLeft: 0, marginRight: '8px' })) }, props, { onClick: () => handleClick(item) }),
|
9997
10119
|
React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9998
|
-
React.createElement(Img$1, { src: (_c = (_b = (_a = item === null || item === void 0 ? void 0 : item.homePage) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _c !== void 0 ? _c : bottom_image, rec: recData, item: item, index: index
|
10120
|
+
React.createElement(Img$1, { src: (_c = (_b = (_a = item === null || item === void 0 ? void 0 : item.homePage) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _c !== void 0 ? _c : bottom_image, rec: recData, item: item, index: index, style: {
|
10121
|
+
transform: `translateY(${translateY}%)`
|
10122
|
+
} })),
|
9999
10123
|
React.createElement("div", { className: css.css({
|
10000
10124
|
color: '#fff',
|
10001
10125
|
display: 'flex',
|
@@ -10082,7 +10206,7 @@ var styles = {"tow-line-ellipsis":"index-module_tow-line-ellipsis__fselR"};
|
|
10082
10206
|
|
10083
10207
|
const MultiCommodityDiroNew$1 = (_a) => {
|
10084
10208
|
var _b, _c;
|
10085
|
-
var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index"]);
|
10209
|
+
var { content, style, bgImg, recData, onClick, bottom_image, ctaTempStyles, isExternalLink, index, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "onClick", "bottom_image", "ctaTempStyles", "isExternalLink", "index", "translateY"]);
|
10086
10210
|
const { ctaEvent, setPopupDetailData, sxpParameter } = useSxpDataSource();
|
10087
10211
|
const { popup } = useEditor();
|
10088
10212
|
const { jumpToWeb } = useEventReport();
|
@@ -10107,7 +10231,9 @@ const MultiCommodityDiroNew$1 = (_a) => {
|
|
10107
10231
|
var _a, _b, _c, _d, _e, _f;
|
10108
10232
|
return (React.createElement(SwiperSlide, Object.assign({ hidden: recData && !(item === null || item === void 0 ? void 0 : item.bindCta), key: item === null || item === void 0 ? void 0 : item.itemId, className: css.css(Object.assign(Object.assign({}, style), { display: 'flex', flexShrink: 0, marginLeft: 0, marginRight: '8px' })) }, props, { onClick: () => handleClick(item) }),
|
10109
10233
|
React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
10110
|
-
React.createElement(Img$1, { src: (_c = (_b = (_a = item === null || item === void 0 ? void 0 : item.homePage) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _c !== void 0 ? _c : bottom_image, rec: recData, item: item, index: index
|
10234
|
+
React.createElement(Img$1, { src: (_c = (_b = (_a = item === null || item === void 0 ? void 0 : item.homePage) === null || _a === void 0 ? void 0 : _a[0]) !== null && _b !== void 0 ? _b : sxpParameter === null || sxpParameter === void 0 ? void 0 : sxpParameter.bottom_image) !== null && _c !== void 0 ? _c : bottom_image, rec: recData, item: item, index: index, style: {
|
10235
|
+
transform: `translateY(${translateY}%)`
|
10236
|
+
} })),
|
10111
10237
|
React.createElement("div", { className: css.css({
|
10112
10238
|
color: '#fff',
|
10113
10239
|
display: 'flex',
|
@@ -10127,7 +10253,7 @@ var MultiCommodityDiroNewComponent = React.memo(MultiCommodityDiroNew$1);
|
|
10127
10253
|
* @Author: binruan@chatlabs.com
|
10128
10254
|
* @Date: 2023-07-28 18:29:57
|
10129
10255
|
* @LastEditors: binruan@chatlabs.com
|
10130
|
-
* @LastEditTime: 2024-
|
10256
|
+
* @LastEditTime: 2024-05-21 16:44:00
|
10131
10257
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\template\MultiCommodityDiroNew\material.tsx
|
10132
10258
|
*
|
10133
10259
|
*/
|
@@ -12337,7 +12463,6 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
12337
12463
|
const videoSrc = rec.video.url;
|
12338
12464
|
if (!videoSrc)
|
12339
12465
|
return;
|
12340
|
-
videoRef === null || videoRef === void 0 ? void 0 : videoRef.src(videoSrc);
|
12341
12466
|
setIsPauseVideo(false);
|
12342
12467
|
const videoPlayerWrapperNode = document.querySelector(`#${videoId}`);
|
12343
12468
|
const dom = document.querySelector('#player-container-id');
|
@@ -12345,6 +12470,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
12345
12470
|
if (!dom && !dom2)
|
12346
12471
|
return;
|
12347
12472
|
videoPlayerWrapperNode === null || videoPlayerWrapperNode === void 0 ? void 0 : videoPlayerWrapperNode.appendChild(dom || dom2);
|
12473
|
+
videoRef === null || videoRef === void 0 ? void 0 : videoRef.src(videoSrc);
|
12348
12474
|
videoRef === null || videoRef === void 0 ? void 0 : videoRef.on('loadedmetadata', handleLoadedmetadata);
|
12349
12475
|
videoRef === null || videoRef === void 0 ? void 0 : videoRef.on('loadeddata', handLoadeddata);
|
12350
12476
|
// videoRef?.on('canplay', handleCanplay);
|
@@ -12484,7 +12610,7 @@ var ToggleButton$1 = React.memo(ToggleButton);
|
|
12484
12610
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\FingerSwipeTip\index.tsx
|
12485
12611
|
*
|
12486
12612
|
*/
|
12487
|
-
const FingerSwipeTip = ({ imageUrl }) => {
|
12613
|
+
const FingerSwipeTip = ({ imageUrl, style }) => {
|
12488
12614
|
const [show, setShow] = React.useState(true);
|
12489
12615
|
useEditor();
|
12490
12616
|
React.useEffect(() => {
|
@@ -12496,7 +12622,7 @@ const FingerSwipeTip = ({ imageUrl }) => {
|
|
12496
12622
|
const animationCls = React.useMemo(() => {
|
12497
12623
|
return show ? 'pb-fadeIn' : 'pb-fadeOut';
|
12498
12624
|
}, [show]);
|
12499
|
-
return (React.createElement("div", { hidden: !show, className: `pb-finger-wrap ${animationCls}
|
12625
|
+
return (React.createElement("div", { hidden: !show, className: `pb-finger-wrap ${animationCls}`, style: style },
|
12500
12626
|
React.createElement("img", { src: imageUrl || FINGER_SWIPE_ICON })));
|
12501
12627
|
};
|
12502
12628
|
|
@@ -12800,12 +12926,12 @@ var Tagbar$1 = React.memo(Tagbar);
|
|
12800
12926
|
* @Author: binruan@chatlabs.com
|
12801
12927
|
* @Date: 2024-01-15 19:03:09
|
12802
12928
|
* @LastEditors: binruan@chatlabs.com
|
12803
|
-
* @LastEditTime: 2024-05-
|
12929
|
+
* @LastEditTime: 2024-05-17 13:58:46
|
12804
12930
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
12805
12931
|
*
|
12806
12932
|
*/
|
12807
12933
|
const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, tagList = [], licenseUrl }) => {
|
12808
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
12934
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
12809
12935
|
const { schema } = useEditor();
|
12810
12936
|
const [activeIndex, setActiveIndex] = React.useState(0);
|
12811
12937
|
const viewImageStartTime = React.useRef(0);
|
@@ -12860,29 +12986,23 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
12860
12986
|
};
|
12861
12987
|
const firstRef = React.useRef();
|
12862
12988
|
React.useEffect(() => {
|
12863
|
-
|
12864
|
-
if (!firstRef.current && !videoRef && (playerRef === null || playerRef === void 0 ? void 0 : playerRef.current) && (data === null || data === void 0 ? void 0 : data.length) > 0) {
|
12989
|
+
if (!firstRef.current && !videoRef) {
|
12865
12990
|
firstRef.current = true;
|
12866
12991
|
const player = TCPlayer('player-container-id', {
|
12867
12992
|
licenseUrl, // license 地址,参考准备工作部分,在视立方控制台申请 license 后可获得 licenseUrl
|
12868
12993
|
controls: false,
|
12994
|
+
autoplay: false,
|
12869
12995
|
loop: false,
|
12870
|
-
autoplay: true,
|
12871
12996
|
muted: true,
|
12872
12997
|
preload: 'auto',
|
12873
12998
|
posterImage: false,
|
12874
|
-
bigPlayButton: true
|
12875
|
-
sources: [
|
12876
|
-
{
|
12877
|
-
src: (_c = (_b = (_a = data === null || data === void 0 ? void 0 : data[0]) === null || _a === void 0 ? void 0 : _a.video) === null || _b === void 0 ? void 0 : _b.url) !== null && _c !== void 0 ? _c : ''
|
12878
|
-
}
|
12879
|
-
]
|
12999
|
+
bigPlayButton: true
|
12880
13000
|
});
|
12881
13001
|
player === null || player === void 0 ? void 0 : player.ready(() => {
|
12882
13002
|
setVideoRef(player);
|
12883
13003
|
});
|
12884
13004
|
}
|
12885
|
-
}, [videoRef, licenseUrl
|
13005
|
+
}, [videoRef, licenseUrl]);
|
12886
13006
|
React.useEffect(() => {
|
12887
13007
|
if (!isInit)
|
12888
13008
|
handleH5EnterLink();
|
@@ -13071,7 +13191,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
13071
13191
|
lineGradStyle
|
13072
13192
|
]);
|
13073
13193
|
const renderLikeButton = React.useCallback((rec, index) => {
|
13074
|
-
var _a, _b;
|
13194
|
+
var _a, _b, _c, _d;
|
13075
13195
|
if (!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLike))
|
13076
13196
|
return;
|
13077
13197
|
let top = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconY) !== null && _a !== void 0 ? _a : 400;
|
@@ -13080,8 +13200,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
13080
13200
|
}
|
13081
13201
|
if (rec.video) {
|
13082
13202
|
return (React.createElement(LikeButton$1, { key: rec.position, activeIcon: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIcon, unActicveIcon: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.unlikeIcon, active: rec.isCollected, recData: rec, className: 'clc-sxp-like-button', style: {
|
13083
|
-
|
13084
|
-
|
13203
|
+
[(_b = globalConfig.likeIconXPosit) !== null && _b !== void 0 ? _b : 'right']: (_c = globalConfig.likeIconX) !== null && _c !== void 0 ? _c : 0,
|
13204
|
+
[(_d = globalConfig.likeIconYPosit) !== null && _d !== void 0 ? _d : 'bottom']: top
|
13085
13205
|
}, position: index }));
|
13086
13206
|
}
|
13087
13207
|
return null;
|
@@ -13219,7 +13339,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
13219
13339
|
} })),
|
13220
13340
|
renderLogo,
|
13221
13341
|
React.createElement(Tagbar$1, { tagList: tagList, setActiveIndex: setActiveIndex }),
|
13222
|
-
isShowFingerTip ? React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon }) : null,
|
13342
|
+
isShowFingerTip ? (React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon, style: { top: `${50 + ((_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipOffset) !== null && _a !== void 0 ? _a : 0)}%` } })) : null,
|
13223
13343
|
React.createElement(Swiper, { ref: swiperRef, onSlideChange: () => {
|
13224
13344
|
swiperRef.current.swiper.allowTouchMove = false;
|
13225
13345
|
setTimeout(() => {
|
@@ -13261,13 +13381,13 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
13261
13381
|
direction: 'vertical', height: height },
|
13262
13382
|
React.createElement(ToggleButton$1, { style: {
|
13263
13383
|
position: 'fixed',
|
13264
|
-
right: (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconX) !== null && _a !== void 0 ? _a : 0,
|
13265
13384
|
visibility: ((_c = (_b = data === null || data === void 0 ? void 0 : data[activeIndex]) === null || _b === void 0 ? void 0 : _b.video) === null || _c === void 0 ? void 0 : _c.url) ? 'visible' : 'hidden',
|
13266
|
-
|
13267
|
-
|
13385
|
+
zIndex: 999,
|
13386
|
+
[(_d = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconXPosit) !== null && _d !== void 0 ? _d : 'right']: (_e = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconX) !== null && _e !== void 0 ? _e : 0,
|
13387
|
+
[(_f = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconYPosit) !== null && _f !== void 0 ? _f : 'bottom']: (_g = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconY) !== null && _g !== void 0 ? _g : 23
|
13268
13388
|
}, defaultValue: isMuted, activeIcon: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.unMuteIcon) ? globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.unMuteIcon : mutedIcon, unactiveIcon: (globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIcon) ? globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIcon : unmutedIcon, onChange: setIsMuted }),
|
13269
13389
|
renderView),
|
13270
|
-
React.createElement(WaterFall$1, Object.assign({}, (
|
13390
|
+
React.createElement(WaterFall$1, Object.assign({}, (_k = (_j = (_h = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.hashTag) === null || _h === void 0 ? void 0 : _h[0]) === null || _j === void 0 ? void 0 : _j.item) === null || _k === void 0 ? void 0 : _k.props)),
|
13271
13391
|
React.createElement("div", { style: { position: 'absolute', zIndex: -100 } },
|
13272
13392
|
React.createElement("video", { ref: playerRef, id: 'player-container-id', playsInline: true, crossOrigin: 'anonymous', style: {
|
13273
13393
|
backgroundColor: 'transparent',
|
@@ -13423,8 +13543,8 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
|
|
13423
13543
|
if (!videoRef.current.src) {
|
13424
13544
|
const videoSrc = rec.video.url;
|
13425
13545
|
if (videoSrc.includes('.m3u8')) {
|
13426
|
-
if (
|
13427
|
-
const hls = new
|
13546
|
+
if (Hls.isSupported()) {
|
13547
|
+
const hls = new Hls();
|
13428
13548
|
hls.loadSource(videoSrc);
|
13429
13549
|
hls.attachMedia(videoRef.current);
|
13430
13550
|
}
|
@@ -13710,7 +13830,7 @@ const Popup = () => {
|
|
13710
13830
|
* @Author: binruan@chatlabs.com
|
13711
13831
|
* @Date: 2024-01-15 19:03:09
|
13712
13832
|
* @LastEditors: binruan@chatlabs.com
|
13713
|
-
* @LastEditTime: 2024-05-17
|
13833
|
+
* @LastEditTime: 2024-05-06 17:26:37
|
13714
13834
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageCore\index.tsx
|
13715
13835
|
*
|
13716
13836
|
*/
|
@@ -13727,14 +13847,14 @@ Object.values(_materials_).forEach((v) => {
|
|
13727
13847
|
RESOLVER[v.extend.type] = v;
|
13728
13848
|
});
|
13729
13849
|
const SxpPageCore = ({ data, maxSize = 10, defaultSize = 10, hashTagSize = 20, loadingImage, appDomain, licenseUrl, enabledMetaConversionApi }) => {
|
13730
|
-
var _a, _b, _c, _d, _e, _f
|
13850
|
+
var _a, _b, _c, _d, _e, _f;
|
13731
13851
|
const utmVal = React.useMemo(() => {
|
13732
13852
|
var _a;
|
13733
13853
|
const searchParams = (location === null || location === void 0 ? void 0 : location.search) ? (_a = location === null || location === void 0 ? void 0 : location.search) === null || _a === void 0 ? void 0 : _a.replace('?', '') : '';
|
13734
13854
|
return searchParams;
|
13735
13855
|
}, []);
|
13736
13856
|
return (React.createElement(EditorCore, { resolver: RESOLVER, enableDataSource: false, schema: data === null || data === void 0 ? void 0 : data.data, utmVal: utmVal },
|
13737
|
-
React.createElement(SxpDataSourceProvider$1, { utmVal: utmVal, dataSources: data === null || data === void 0 ? void 0 : data.data_sources, sxpParameter: data === null || data === void 0 ? void 0 : data.sxp_parameter, maxSize: (_b = (_a = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _a === void 0 ? void 0 : _a.personalized_recommend) !== null && _b !== void 0 ? _b : maxSize, defaultSize: (_d = (_c = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _c === void 0 ? void 0 : _c.default_recommend) !== null && _d !== void 0 ? _d : defaultSize, hashTagSize: (_f = (_e = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _e === void 0 ? void 0 : _e.hash_tag_size) !== null && _f !== void 0 ? _f : hashTagSize, loadingImage: loadingImage, appDomain: appDomain, enabledMetaConversionApi: enabledMetaConversionApi,
|
13857
|
+
React.createElement(SxpDataSourceProvider$1, { utmVal: utmVal, dataSources: data === null || data === void 0 ? void 0 : data.data_sources, sxpParameter: data === null || data === void 0 ? void 0 : data.sxp_parameter, maxSize: (_b = (_a = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _a === void 0 ? void 0 : _a.personalized_recommend) !== null && _b !== void 0 ? _b : maxSize, defaultSize: (_d = (_c = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _c === void 0 ? void 0 : _c.default_recommend) !== null && _d !== void 0 ? _d : defaultSize, hashTagSize: (_f = (_e = data === null || data === void 0 ? void 0 : data.sxp_parameter) === null || _e === void 0 ? void 0 : _e.hash_tag_size) !== null && _f !== void 0 ? _f : hashTagSize, loadingImage: loadingImage, appDomain: appDomain, enabledMetaConversionApi: enabledMetaConversionApi, render: ({ rtcList, tagList }) => {
|
13738
13858
|
var _a;
|
13739
13859
|
return (React.createElement(React.Fragment, null,
|
13740
13860
|
React.createElement(SxpPageRender, Object.assign({}, (_a = data === null || data === void 0 ? void 0 : data.data) === null || _a === void 0 ? void 0 : _a.sxpPageConf, { tagList: tagList, data: rtcList, resolver: RESOLVER, licenseUrl: licenseUrl })),
|