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.js
CHANGED
@@ -5,8 +5,8 @@ import React, { useContext, useMemo, createContext, memo, useState, useRef, useE
|
|
5
5
|
import qs from 'qs';
|
6
6
|
import EventEmitter from 'eventemitter3';
|
7
7
|
import { css } from '@emotion/css';
|
8
|
-
import { BetaSchemaForm } from '@ant-design/pro-components';
|
9
8
|
import * as ReactDOM from 'react-dom';
|
9
|
+
import Hls from 'hls.js';
|
10
10
|
|
11
11
|
/******************************************************************************
|
12
12
|
Copyright (c) Microsoft Corporation.
|
@@ -423,7 +423,7 @@ var DataSourceType;
|
|
423
423
|
DataSourceType[DataSourceType["BFF"] = 5] = "BFF";
|
424
424
|
})(DataSourceType || (DataSourceType = {}));
|
425
425
|
const UTM_KEYS = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_id', 'utm_content', 'cl_source'];
|
426
|
-
const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false
|
426
|
+
const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false }) => {
|
427
427
|
const [rtcList, setRtcList] = useState([]);
|
428
428
|
const [tagList, setTagList] = useState([]);
|
429
429
|
const [loading, setLoading] = useState(false);
|
@@ -577,7 +577,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
577
577
|
// 获取 Tag
|
578
578
|
const bffGetTagList = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
579
579
|
var _h, _j, _k, _l, _m;
|
580
|
-
if (!utmVal
|
580
|
+
if (!utmVal)
|
581
581
|
return;
|
582
582
|
try {
|
583
583
|
const val = (_k = (_j = (_h = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _h === void 0 ? void 0 : _h.filter((val) => {
|
@@ -590,7 +590,7 @@ const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent
|
|
590
590
|
catch (e) {
|
591
591
|
console.log('e', e);
|
592
592
|
}
|
593
|
-
}), [bffFetch, utmVal
|
593
|
+
}), [bffFetch, utmVal]);
|
594
594
|
const ctaEvent = useCallback((eventInfo, rec, product, position) => {
|
595
595
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
596
596
|
const cta = product === null || product === void 0 ? void 0 : product.bindCta;
|
@@ -923,23 +923,30 @@ var interactionRender$8 = [
|
|
923
923
|
}
|
924
924
|
];
|
925
925
|
|
926
|
-
|
927
|
-
|
928
|
-
|
929
|
-
|
926
|
+
/*
|
927
|
+
* @Author: binruan@chatlabs.com
|
928
|
+
* @Date: 2024-04-28 14:42:22
|
929
|
+
* @LastEditors: binruan@chatlabs.com
|
930
|
+
* @LastEditTime: 2024-05-17 14:07:01
|
931
|
+
* @FilePath: \pb-sxp-ui\src\materials\sxp\defaultSetting.ts
|
932
|
+
*
|
933
|
+
*/
|
934
|
+
const fontOptions = [{ label: '默认字体', value: 'appFont' }];
|
935
|
+
const sxpFonts = typeof window !== 'undefined' && (window === null || window === void 0 ? void 0 : window.localStorage.getItem('sxp_font_links'));
|
936
|
+
const data = sxpFonts && sxpFonts !== '' ? JSON.parse(sxpFonts) : [];
|
930
937
|
var defaultSetting = {
|
931
|
-
fontOptions
|
938
|
+
fontOptions: [...fontOptions, ...data]
|
932
939
|
};
|
933
940
|
|
934
941
|
/*
|
935
942
|
* @Author: binruan@chatlabs.com
|
936
943
|
* @Date: 2023-07-28 18:29:57
|
937
944
|
* @LastEditors: binruan@chatlabs.com
|
938
|
-
* @LastEditTime:
|
945
|
+
* @LastEditTime: 2024-05-17 10:11:41
|
939
946
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\popup\AppointForm\settingRender.tsx
|
940
947
|
*
|
941
948
|
*/
|
942
|
-
var _a$
|
949
|
+
var _a$5, _b$5, _c;
|
943
950
|
var settingRender$5 = [
|
944
951
|
{
|
945
952
|
type: 'Text',
|
@@ -966,7 +973,7 @@ var settingRender$5 = [
|
|
966
973
|
type: 'Select',
|
967
974
|
name: ['textStyle', 'fontFamily'],
|
968
975
|
options: fontOptions,
|
969
|
-
initialValue: (_a$
|
976
|
+
initialValue: (_a$5 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _a$5 === void 0 ? void 0 : _a$5.value
|
970
977
|
},
|
971
978
|
{
|
972
979
|
type: 'Number',
|
@@ -1009,6 +1016,37 @@ var settingRender$5 = [
|
|
1009
1016
|
type: 'Text',
|
1010
1017
|
name: ['props', 'submitText']
|
1011
1018
|
},
|
1019
|
+
{
|
1020
|
+
type: 'Group',
|
1021
|
+
label: '提交按钮字体',
|
1022
|
+
child: [
|
1023
|
+
{
|
1024
|
+
type: 'Color',
|
1025
|
+
name: ['props', 'submitButtonStyle', 'color'],
|
1026
|
+
initialValue: '#fff'
|
1027
|
+
},
|
1028
|
+
{
|
1029
|
+
type: 'Select',
|
1030
|
+
name: ['props', 'submitButtonStyle', 'fontFamily'],
|
1031
|
+
options: defaultSetting === null || defaultSetting === void 0 ? void 0 : defaultSetting.fontOptions,
|
1032
|
+
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
|
1033
|
+
},
|
1034
|
+
{
|
1035
|
+
type: 'Number',
|
1036
|
+
name: ['props', 'submitButtonStyle', 'fontSize'],
|
1037
|
+
addonAfter: 'px',
|
1038
|
+
initialValue: 12
|
1039
|
+
}
|
1040
|
+
]
|
1041
|
+
},
|
1042
|
+
{
|
1043
|
+
type: 'TextStyle',
|
1044
|
+
name: ['props', 'submitButtonStyle']
|
1045
|
+
},
|
1046
|
+
{
|
1047
|
+
type: 'TextAlign',
|
1048
|
+
name: ['props', 'submitButtonStyle']
|
1049
|
+
},
|
1012
1050
|
{
|
1013
1051
|
label: '提交文本颜色',
|
1014
1052
|
type: 'Color',
|
@@ -1129,7 +1167,7 @@ function useEventReport() {
|
|
1129
1167
|
}
|
1130
1168
|
|
1131
1169
|
const AppointForm$1 = (_a) => {
|
1132
|
-
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"]);
|
1170
|
+
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"]);
|
1133
1171
|
const { submitForm, popupDetailData } = useSxpDataSource();
|
1134
1172
|
const { jumpToWeb } = useEventReport();
|
1135
1173
|
const formRef = useRef();
|
@@ -1160,7 +1198,7 @@ const AppointForm$1 = (_a) => {
|
|
1160
1198
|
key: '4'
|
1161
1199
|
}
|
1162
1200
|
], []);
|
1163
|
-
|
1201
|
+
useMemo(() => {
|
1164
1202
|
if (layoutType === undefined) {
|
1165
1203
|
const list = cloneDeep(columns) || defaultColumns;
|
1166
1204
|
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 } })));
|
@@ -1203,13 +1241,9 @@ const AppointForm$1 = (_a) => {
|
|
1203
1241
|
return (React.createElement("div", { className: 'pb-appoint-form' },
|
1204
1242
|
React.createElement("div", { className: `pb-appoint-form-title ${css(Object.assign({}, textStyle))}` }, title),
|
1205
1243
|
React.createElement("div", Object.assign({ className: css(Object.assign({}, style)) }, props),
|
1206
|
-
React.createElement("div", { className: 'pb-appoint-form-container' },
|
1207
|
-
React.createElement(BetaSchemaForm, { columns: columnsData, submitter: false, layout: layoutType, autoFocusFirstInput: false, size: 'large', formRef: formRef, className: 'panel-reset' }))),
|
1244
|
+
React.createElement("div", { className: 'pb-appoint-form-container' })),
|
1208
1245
|
React.createElement("div", { className: 'pb-appoint-form-btn-wrapper' },
|
1209
|
-
React.createElement("button", { onClick: handleSubmit, className: 'pb-appoint-form-btn', style: {
|
1210
|
-
color: submitColor,
|
1211
|
-
background: submitBgColor
|
1212
|
-
} }, loading ? React.createElement(React.Fragment, null, "loading...") : submitText))));
|
1246
|
+
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))));
|
1213
1247
|
};
|
1214
1248
|
var AppointFormComponent = memo(AppointForm$1);
|
1215
1249
|
|
@@ -1257,23 +1291,7 @@ const AppointForm = createMaterial(AppointFormComponent, {
|
|
1257
1291
|
sort: 2
|
1258
1292
|
});
|
1259
1293
|
|
1260
|
-
|
1261
|
-
* @Author: binruan@chatlabs.com
|
1262
|
-
* @Date: 2024-04-02 18:01:34
|
1263
|
-
* @LastEditors: binruan@chatlabs.com
|
1264
|
-
* @LastEditTime: 2024-04-12 16:46:04
|
1265
|
-
* @FilePath: \pb-sxp-ui\src\materials\sxp\popup\CommodityDetail\settingRender.tsx
|
1266
|
-
*
|
1267
|
-
*/
|
1268
|
-
var _a$3, _b$3;
|
1269
|
-
/*
|
1270
|
-
* @Author: binruan@chatlabs.com
|
1271
|
-
* @Date: 2024-03-26 16:50:25
|
1272
|
-
* @LastEditors: binruan@chatlabs.com
|
1273
|
-
* @LastEditTime: 2024-03-28 18:42:26
|
1274
|
-
* @FilePath: \pb-sxp-ui\src\materials\sxp\popup\CommodityDetailDiroNew\settingRender.tsx
|
1275
|
-
*
|
1276
|
-
*/
|
1294
|
+
var _a$4, _b$4;
|
1277
1295
|
var settingRender$4 = [
|
1278
1296
|
{
|
1279
1297
|
title: '商品图片',
|
@@ -1297,6 +1315,19 @@ var settingRender$4 = [
|
|
1297
1315
|
type: 'Number',
|
1298
1316
|
name: ['props', 'swiper', 'delay'],
|
1299
1317
|
addonAfter: 's'
|
1318
|
+
},
|
1319
|
+
{
|
1320
|
+
type: 'Group',
|
1321
|
+
child: [
|
1322
|
+
{
|
1323
|
+
label: '居中垂直偏移',
|
1324
|
+
type: 'Number',
|
1325
|
+
name: ['props', 'swiper', 'translateY'],
|
1326
|
+
min: -100,
|
1327
|
+
addonAfter: '%',
|
1328
|
+
initialValue: 0
|
1329
|
+
}
|
1330
|
+
]
|
1300
1331
|
}
|
1301
1332
|
]
|
1302
1333
|
},
|
@@ -1331,6 +1362,23 @@ var settingRender$4 = [
|
|
1331
1362
|
name: ['props', 'commodityStyles', 'field'],
|
1332
1363
|
initialValue: 'title'
|
1333
1364
|
},
|
1365
|
+
{
|
1366
|
+
type: 'Group',
|
1367
|
+
child: [
|
1368
|
+
{
|
1369
|
+
label: '上边距',
|
1370
|
+
type: 'Number',
|
1371
|
+
addonAfter: 'px',
|
1372
|
+
name: ['marginTop']
|
1373
|
+
},
|
1374
|
+
{
|
1375
|
+
label: '下边距',
|
1376
|
+
type: 'Number',
|
1377
|
+
addonAfter: 'px',
|
1378
|
+
name: ['marginBottom']
|
1379
|
+
}
|
1380
|
+
]
|
1381
|
+
},
|
1334
1382
|
{
|
1335
1383
|
type: 'Group',
|
1336
1384
|
label: '标题字体',
|
@@ -1343,7 +1391,7 @@ var settingRender$4 = [
|
|
1343
1391
|
type: 'Select',
|
1344
1392
|
options: fontOptions,
|
1345
1393
|
name: ['fontFamily'],
|
1346
|
-
initialValue: (_a$
|
1394
|
+
initialValue: (_a$4 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _a$4 === void 0 ? void 0 : _a$4.value
|
1347
1395
|
},
|
1348
1396
|
{
|
1349
1397
|
type: 'Number',
|
@@ -1423,7 +1471,7 @@ var settingRender$4 = [
|
|
1423
1471
|
type: 'Select',
|
1424
1472
|
name: ['props', 'buttonStyle', 'fontFamily'],
|
1425
1473
|
options: fontOptions,
|
1426
|
-
initialValue: (_b$
|
1474
|
+
initialValue: (_b$4 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _b$4 === void 0 ? void 0 : _b$4.value
|
1427
1475
|
},
|
1428
1476
|
{
|
1429
1477
|
type: 'Number',
|
@@ -8368,7 +8416,7 @@ var ExpandableText$1 = memo(ExpandableText);
|
|
8368
8416
|
* @Author: binruan@chatlabs.com
|
8369
8417
|
* @Date: 2024-03-20 10:27:31
|
8370
8418
|
* @LastEditors: binruan@chatlabs.com
|
8371
|
-
* @LastEditTime: 2024-
|
8419
|
+
* @LastEditTime: 2024-04-19 14:12:55
|
8372
8420
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\FormatImage.tsx
|
8373
8421
|
*
|
8374
8422
|
*/
|
@@ -8383,30 +8431,6 @@ const FormatImage = forwardRef((props, ref) => {
|
|
8383
8431
|
useEffect(() => {
|
8384
8432
|
setImgSrc(src);
|
8385
8433
|
}, [src]);
|
8386
|
-
useRef(null);
|
8387
|
-
// useEffect(() => {
|
8388
|
-
// let observer: any = null;
|
8389
|
-
// const { current } = imgRef;
|
8390
|
-
// if (current) {
|
8391
|
-
// observer = new IntersectionObserver(
|
8392
|
-
// (entries) => {
|
8393
|
-
// entries.forEach((entry) => {
|
8394
|
-
// if (entry.isIntersecting) {
|
8395
|
-
// setImgSrc(src);
|
8396
|
-
// observer.unobserve(current);
|
8397
|
-
// }
|
8398
|
-
// });
|
8399
|
-
// },
|
8400
|
-
// { threshold: 0.1 } // 触发阈值,可根据需要调整
|
8401
|
-
// );
|
8402
|
-
// observer.observe(current);
|
8403
|
-
// }
|
8404
|
-
// return () => {
|
8405
|
-
// if (observer && current) {
|
8406
|
-
// observer.unobserve(current);
|
8407
|
-
// }
|
8408
|
-
// };
|
8409
|
-
// }, [src]);
|
8410
8434
|
return (React.createElement(React.Fragment, null, (imgSrc === null || imgSrc === void 0 ? void 0 : imgSrc.includes('.avif')) ? (React.createElement("picture", null,
|
8411
8435
|
React.createElement("source", { type: 'image/avif', srcSet: imgSrc }),
|
8412
8436
|
React.createElement("source", { type: 'image/webp', srcSet: `${imgSrc}?imageMogr2/format/webp` }),
|
@@ -8503,7 +8527,13 @@ const CommodityDetail$1 = (_a) => {
|
|
8503
8527
|
width,
|
8504
8528
|
height: width
|
8505
8529
|
} },
|
8506
|
-
React.createElement(FormatImage$1, { style: {
|
8530
|
+
React.createElement(FormatImage$1, { style: {
|
8531
|
+
height: '100%',
|
8532
|
+
width: '100%',
|
8533
|
+
objectFit: 'cover',
|
8534
|
+
display: 'block',
|
8535
|
+
transform: `translateY(${swiper === null || swiper === void 0 ? void 0 : swiper.translateY})%`
|
8536
|
+
}, src: src }))));
|
8507
8537
|
}))),
|
8508
8538
|
!((_j = product === null || product === void 0 ? void 0 : product.homePage) === null || _j === void 0 ? void 0 : _j.length) && (React.createElement("div", { className: css({
|
8509
8539
|
position: 'relative',
|
@@ -8552,7 +8582,9 @@ const CommodityDetail = createMaterial(CommodityDetailComponent, {
|
|
8552
8582
|
commodityStyles: {
|
8553
8583
|
price: {
|
8554
8584
|
color: '#000',
|
8555
|
-
fontSize: 18
|
8585
|
+
fontSize: 18,
|
8586
|
+
marginTop: 24,
|
8587
|
+
marginBottom: 10
|
8556
8588
|
},
|
8557
8589
|
title: {
|
8558
8590
|
color: '#000',
|
@@ -8560,7 +8592,8 @@ const CommodityDetail = createMaterial(CommodityDetailComponent, {
|
|
8560
8592
|
},
|
8561
8593
|
collection: {
|
8562
8594
|
fontSize: 12,
|
8563
|
-
color: '#000'
|
8595
|
+
color: '#000',
|
8596
|
+
marginBottom: 14
|
8564
8597
|
},
|
8565
8598
|
info: {
|
8566
8599
|
color: 'gray',
|
@@ -8599,26 +8632,68 @@ var interactionRender$7 = [
|
|
8599
8632
|
* @Author: binruan@chatlabs.com
|
8600
8633
|
* @Date: 2023-10-27 14:06:35
|
8601
8634
|
* @LastEditors: binruan@chatlabs.com
|
8602
|
-
* @LastEditTime:
|
8635
|
+
* @LastEditTime: 2024-05-17 10:29:41
|
8603
8636
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\popup\Prompt\settingRender.tsx
|
8604
8637
|
*
|
8605
8638
|
*/
|
8639
|
+
var _a$3, _b$3;
|
8606
8640
|
var settingRender$3 = [
|
8607
8641
|
{
|
8608
|
-
|
8609
|
-
|
8610
|
-
|
8611
|
-
|
8612
|
-
|
8613
|
-
|
8614
|
-
|
8615
|
-
|
8616
|
-
|
8617
|
-
|
8618
|
-
|
8619
|
-
|
8620
|
-
|
8621
|
-
|
8642
|
+
title: '',
|
8643
|
+
child: [
|
8644
|
+
{
|
8645
|
+
type: 'Media',
|
8646
|
+
label: '图标',
|
8647
|
+
name: ['props', 'icon'],
|
8648
|
+
mediaType: 'Image'
|
8649
|
+
},
|
8650
|
+
{
|
8651
|
+
type: 'TextArea',
|
8652
|
+
label: '内容',
|
8653
|
+
name: ['props', 'content']
|
8654
|
+
},
|
8655
|
+
{
|
8656
|
+
type: 'Text',
|
8657
|
+
label: '按钮文案',
|
8658
|
+
name: ['props', 'btnText']
|
8659
|
+
},
|
8660
|
+
{
|
8661
|
+
type: 'Group',
|
8662
|
+
label: '提交按钮字体',
|
8663
|
+
child: [
|
8664
|
+
{
|
8665
|
+
type: 'Color',
|
8666
|
+
name: ['props', 'submitButtonStyle', 'color'],
|
8667
|
+
initialValue: '#fff'
|
8668
|
+
},
|
8669
|
+
{
|
8670
|
+
type: 'Select',
|
8671
|
+
name: ['props', 'submitButtonStyle', 'fontFamily'],
|
8672
|
+
options: defaultSetting === null || defaultSetting === void 0 ? void 0 : defaultSetting.fontOptions,
|
8673
|
+
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
|
8674
|
+
},
|
8675
|
+
{
|
8676
|
+
type: 'Number',
|
8677
|
+
name: ['props', 'submitButtonStyle', 'fontSize'],
|
8678
|
+
addonAfter: 'px',
|
8679
|
+
initialValue: 12
|
8680
|
+
}
|
8681
|
+
]
|
8682
|
+
},
|
8683
|
+
{
|
8684
|
+
type: 'TextStyle',
|
8685
|
+
name: ['props', 'submitButtonStyle']
|
8686
|
+
},
|
8687
|
+
{
|
8688
|
+
type: 'TextAlign',
|
8689
|
+
name: ['props', 'submitButtonStyle']
|
8690
|
+
},
|
8691
|
+
{
|
8692
|
+
label: '提交按钮颜色',
|
8693
|
+
type: 'Color',
|
8694
|
+
name: ['props', 'submitButtonStyle', 'backgroundColor']
|
8695
|
+
}
|
8696
|
+
]
|
8622
8697
|
}
|
8623
8698
|
];
|
8624
8699
|
|
@@ -8657,7 +8732,7 @@ const getMediaValueByMode = (obj) => {
|
|
8657
8732
|
};
|
8658
8733
|
|
8659
8734
|
const Prompt$1 = (_a) => {
|
8660
|
-
var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick } = _a, props = __rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick"]);
|
8735
|
+
var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick, submitButtonStyle } = _a, props = __rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick", "submitButtonStyle"]);
|
8661
8736
|
const { popupDetailData } = useSxpDataSource();
|
8662
8737
|
const { jumpToWeb } = useEventReport();
|
8663
8738
|
const iconSrc = typeof icon === 'string' ? icon : getMediaValueByMode(icon);
|
@@ -8679,7 +8754,7 @@ const Prompt$1 = (_a) => {
|
|
8679
8754
|
React.createElement("div", { className: 'pb-prompt-icon' },
|
8680
8755
|
React.createElement("img", { width: '100%', src: iconSrc !== null && iconSrc !== void 0 ? iconSrc : img$2 })),
|
8681
8756
|
React.createElement("div", { className: 'pb-prompt-content' }, content),
|
8682
|
-
React.createElement("button", { className: 'pb-prompt-btn', onClick: handleOk }, btnText)));
|
8757
|
+
React.createElement("button", { className: 'pb-prompt-btn', style: submitButtonStyle, onClick: handleOk }, btnText)));
|
8683
8758
|
};
|
8684
8759
|
var PromptComponent = memo(Prompt$1);
|
8685
8760
|
|
@@ -8738,6 +8813,19 @@ var settingRender$2 = [
|
|
8738
8813
|
type: 'Number',
|
8739
8814
|
name: ['props', 'swiper', 'delay'],
|
8740
8815
|
addonAfter: 's'
|
8816
|
+
},
|
8817
|
+
{
|
8818
|
+
type: 'Group',
|
8819
|
+
child: [
|
8820
|
+
{
|
8821
|
+
label: '居中垂直偏移',
|
8822
|
+
type: 'Number',
|
8823
|
+
name: ['props', 'swiper', 'translateY'],
|
8824
|
+
min: -100,
|
8825
|
+
addonAfter: '%',
|
8826
|
+
initialValue: 0
|
8827
|
+
}
|
8828
|
+
]
|
8741
8829
|
}
|
8742
8830
|
]
|
8743
8831
|
},
|
@@ -8969,7 +9057,13 @@ Made in Italy` })));
|
|
8969
9057
|
width,
|
8970
9058
|
height: width
|
8971
9059
|
} },
|
8972
|
-
React.createElement(FormatImage$1, { style: {
|
9060
|
+
React.createElement(FormatImage$1, { style: {
|
9061
|
+
height: '100%',
|
9062
|
+
width: '100%',
|
9063
|
+
objectFit: 'cover',
|
9064
|
+
display: 'block',
|
9065
|
+
transform: `translateY(${swiper === null || swiper === void 0 ? void 0 : swiper.translateY})%`
|
9066
|
+
}, src: src }))));
|
8973
9067
|
}))),
|
8974
9068
|
!((_j = product === null || product === void 0 ? void 0 : product.homePage) === null || _j === void 0 ? void 0 : _j.length) && (React.createElement("div", { className: css({
|
8975
9069
|
position: 'relative',
|
@@ -9070,7 +9164,7 @@ var _a$1, _b$1;
|
|
9070
9164
|
* @Author: binruan@chatlabs.com
|
9071
9165
|
* @Date: 2024-03-26 16:50:25
|
9072
9166
|
* @LastEditors: binruan@chatlabs.com
|
9073
|
-
* @LastEditTime: 2024-
|
9167
|
+
* @LastEditTime: 2024-05-21 16:39:34
|
9074
9168
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\template\components\settingRender.tsx
|
9075
9169
|
*
|
9076
9170
|
*/
|
@@ -9171,6 +9265,14 @@ var settingRender$1 = [
|
|
9171
9265
|
label: '与右侧边距',
|
9172
9266
|
addonAfter: 'px',
|
9173
9267
|
name: ['props', 'ctaTempStyles', 'img', 'marginRight']
|
9268
|
+
},
|
9269
|
+
{
|
9270
|
+
label: '居中垂直偏移',
|
9271
|
+
type: 'Number',
|
9272
|
+
name: ['props', 'translateY'],
|
9273
|
+
min: -100,
|
9274
|
+
addonAfter: '%',
|
9275
|
+
initialValue: 0
|
9174
9276
|
}
|
9175
9277
|
]
|
9176
9278
|
},
|
@@ -9376,13 +9478,19 @@ var styles$6 = {"tow-line-ellipsis":"index-module_tow-line-ellipsis__3bKKx"};
|
|
9376
9478
|
|
9377
9479
|
const Commodity$1 = (_a) => {
|
9378
9480
|
var _b, _c, _d, _e, _f, _g, _h;
|
9379
|
-
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink"]);
|
9481
|
+
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY"]);
|
9380
9482
|
const { sxpParameter } = useSxpDataSource();
|
9381
9483
|
const product = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProduct;
|
9382
9484
|
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;
|
9383
9485
|
return (React.createElement(EventProvider$1, Object.assign({ isExternalLink: isExternalLink, rec: recData, className: css(Object.assign({}, style)), style: { display: 'flex' } }, props),
|
9384
9486
|
React.createElement("div", { className: css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9385
|
-
React.createElement(FormatImage$1, { className: css({
|
9487
|
+
React.createElement(FormatImage$1, { className: css({
|
9488
|
+
width: '100%',
|
9489
|
+
objectFit: 'cover',
|
9490
|
+
height: '100%',
|
9491
|
+
display: 'block',
|
9492
|
+
transform: `translateY(${translateY}%)`
|
9493
|
+
}), src: src })),
|
9386
9494
|
React.createElement("div", { className: css({
|
9387
9495
|
color: '#fff',
|
9388
9496
|
display: 'flex',
|
@@ -9619,13 +9727,19 @@ var styles$4 = {"tow-line-ellipsis":"index-module_tow-line-ellipsis__yyHVb"};
|
|
9619
9727
|
|
9620
9728
|
const CommodityDiro$1 = (_a) => {
|
9621
9729
|
var _b, _c, _d, _e, _f, _g, _h;
|
9622
|
-
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink"]);
|
9730
|
+
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY"]);
|
9623
9731
|
const { sxpParameter } = useSxpDataSource();
|
9624
9732
|
const product = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProduct;
|
9625
9733
|
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;
|
9626
9734
|
return (React.createElement(EventProvider$1, Object.assign({ isExternalLink: isExternalLink, rec: recData, className: css(Object.assign({}, style)), style: { display: 'flex' } }, props),
|
9627
9735
|
React.createElement("div", { className: css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9628
|
-
React.createElement(FormatImage$1, { className: css({
|
9736
|
+
React.createElement(FormatImage$1, { className: css({
|
9737
|
+
width: '100%',
|
9738
|
+
objectFit: 'cover',
|
9739
|
+
height: '100%',
|
9740
|
+
display: 'block',
|
9741
|
+
transform: `translateY(${translateY}%)`
|
9742
|
+
}), src: src })),
|
9629
9743
|
React.createElement("div", { className: css({
|
9630
9744
|
color: '#fff',
|
9631
9745
|
display: 'flex',
|
@@ -9711,13 +9825,19 @@ var styles$3 = {"tow-line-ellipsis":"index-module_tow-line-ellipsis__I-yCC"};
|
|
9711
9825
|
|
9712
9826
|
const CommodityDiroNew$1 = (_a) => {
|
9713
9827
|
var _b, _c, _d, _e, _f, _g, _h;
|
9714
|
-
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink"]);
|
9828
|
+
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY"]);
|
9715
9829
|
const { sxpParameter } = useSxpDataSource();
|
9716
9830
|
const product = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProduct;
|
9717
9831
|
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;
|
9718
9832
|
return (React.createElement(EventProvider$1, Object.assign({ isExternalLink: isExternalLink, rec: recData, className: css(Object.assign({}, style)), style: { display: 'flex' } }, props),
|
9719
9833
|
React.createElement("div", { className: css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9720
|
-
React.createElement(FormatImage$1, { className: css({
|
9834
|
+
React.createElement(FormatImage$1, { className: css({
|
9835
|
+
width: '100%',
|
9836
|
+
objectFit: 'cover',
|
9837
|
+
height: '100%',
|
9838
|
+
display: 'block',
|
9839
|
+
transform: `translateY(${translateY}%)`
|
9840
|
+
}), src: src })),
|
9721
9841
|
React.createElement("div", { className: css({
|
9722
9842
|
color: '#fff',
|
9723
9843
|
display: 'flex',
|
@@ -9809,11 +9929,11 @@ var Scroll$1 = memo(Scroll);
|
|
9809
9929
|
* @Author: binruan@chatlabs.com
|
9810
9930
|
* @Date: 2024-01-16 14:50:13
|
9811
9931
|
* @LastEditors: binruan@chatlabs.com
|
9812
|
-
* @LastEditTime: 2024-
|
9932
|
+
* @LastEditTime: 2024-05-21 16:34:13
|
9813
9933
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\template\components\Img.tsx
|
9814
9934
|
*
|
9815
9935
|
*/
|
9816
|
-
const Img = ({ src, rec, item, index }) => {
|
9936
|
+
const Img = ({ src, rec, item, index, style }) => {
|
9817
9937
|
const ref = useRef(null);
|
9818
9938
|
const isOnScreen = useOnScreen(ref);
|
9819
9939
|
const { ctaEvent } = useSxpDataSource();
|
@@ -9826,7 +9946,7 @@ const Img = ({ src, rec, item, index }) => {
|
|
9826
9946
|
}
|
9827
9947
|
}, [isOnScreen, src, ref, rec, ctaEvent, item, index]);
|
9828
9948
|
return (React.createElement("div", { ref: ref, hidden: !src, className: css({ width: '100%', height: '100%' }) },
|
9829
|
-
React.createElement(FormatImage$1, { className: css({ width: '100%', objectFit: 'cover', height: '100%', display: 'block' }), src: src })));
|
9949
|
+
React.createElement(FormatImage$1, { className: css(Object.assign({ width: '100%', objectFit: 'cover', height: '100%', display: 'block' }, style)), src: src })));
|
9830
9950
|
};
|
9831
9951
|
var Img$1 = memo(Img);
|
9832
9952
|
|
@@ -9834,7 +9954,7 @@ var styles$2 = {"two-line-ellipsis":"index-module_two-line-ellipsis__SFQwJ"};
|
|
9834
9954
|
|
9835
9955
|
const MultiCommodityDiro$1 = (_a) => {
|
9836
9956
|
var _b, _c;
|
9837
|
-
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"]);
|
9957
|
+
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"]);
|
9838
9958
|
const { ctaEvent, setPopupDetailData, sxpParameter } = useSxpDataSource();
|
9839
9959
|
const { popup } = useEditor();
|
9840
9960
|
const { jumpToWeb } = useEventReport();
|
@@ -9859,7 +9979,9 @@ const MultiCommodityDiro$1 = (_a) => {
|
|
9859
9979
|
var _a, _b, _c, _d, _e, _f;
|
9860
9980
|
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(Object.assign(Object.assign({}, style), { display: 'flex', flexShrink: 0, marginLeft: 0, marginRight: '8px' })) }, props, { onClick: () => handleClick(item) }),
|
9861
9981
|
React.createElement("div", { className: css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9862
|
-
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
|
9982
|
+
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: {
|
9983
|
+
transform: `translateY(${translateY}%)`
|
9984
|
+
} })),
|
9863
9985
|
React.createElement("div", { className: css({
|
9864
9986
|
color: '#000',
|
9865
9987
|
display: 'flex',
|
@@ -9946,7 +10068,7 @@ var styles$1 = {"two-line-ellipsis":"index-module_two-line-ellipsis__mdzn0"};
|
|
9946
10068
|
|
9947
10069
|
const MultiCommodity$1 = (_a) => {
|
9948
10070
|
var _b, _c;
|
9949
|
-
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"]);
|
10071
|
+
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"]);
|
9950
10072
|
const { sxpParameter } = useSxpDataSource();
|
9951
10073
|
const { ctaEvent, setPopupDetailData } = useSxpDataSource();
|
9952
10074
|
const { popup } = useEditor();
|
@@ -9972,7 +10094,9 @@ const MultiCommodity$1 = (_a) => {
|
|
9972
10094
|
var _a, _b, _c, _d, _e, _f;
|
9973
10095
|
return (React.createElement(SwiperSlide, Object.assign({ hidden: recData && !(item === null || item === void 0 ? void 0 : item.bindCta), key: item.itemId, className: css(Object.assign(Object.assign({}, style), { display: 'flex', flexShrink: 0, marginLeft: 0, marginRight: '8px' })) }, props, { onClick: () => handleClick(item) }),
|
9974
10096
|
React.createElement("div", { className: css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9975
|
-
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
|
10097
|
+
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: {
|
10098
|
+
transform: `translateY(${translateY}%)`
|
10099
|
+
} })),
|
9976
10100
|
React.createElement("div", { className: css({
|
9977
10101
|
color: '#fff',
|
9978
10102
|
display: 'flex',
|
@@ -10059,7 +10183,7 @@ var styles = {"tow-line-ellipsis":"index-module_tow-line-ellipsis__fselR"};
|
|
10059
10183
|
|
10060
10184
|
const MultiCommodityDiroNew$1 = (_a) => {
|
10061
10185
|
var _b, _c;
|
10062
|
-
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"]);
|
10186
|
+
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"]);
|
10063
10187
|
const { ctaEvent, setPopupDetailData, sxpParameter } = useSxpDataSource();
|
10064
10188
|
const { popup } = useEditor();
|
10065
10189
|
const { jumpToWeb } = useEventReport();
|
@@ -10084,7 +10208,9 @@ const MultiCommodityDiroNew$1 = (_a) => {
|
|
10084
10208
|
var _a, _b, _c, _d, _e, _f;
|
10085
10209
|
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(Object.assign(Object.assign({}, style), { display: 'flex', flexShrink: 0, marginLeft: 0, marginRight: '8px' })) }, props, { onClick: () => handleClick(item) }),
|
10086
10210
|
React.createElement("div", { className: css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
10087
|
-
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
|
10211
|
+
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: {
|
10212
|
+
transform: `translateY(${translateY}%)`
|
10213
|
+
} })),
|
10088
10214
|
React.createElement("div", { className: css({
|
10089
10215
|
color: '#fff',
|
10090
10216
|
display: 'flex',
|
@@ -10104,7 +10230,7 @@ var MultiCommodityDiroNewComponent = memo(MultiCommodityDiroNew$1);
|
|
10104
10230
|
* @Author: binruan@chatlabs.com
|
10105
10231
|
* @Date: 2023-07-28 18:29:57
|
10106
10232
|
* @LastEditors: binruan@chatlabs.com
|
10107
|
-
* @LastEditTime: 2024-
|
10233
|
+
* @LastEditTime: 2024-05-21 16:44:00
|
10108
10234
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\template\MultiCommodityDiroNew\material.tsx
|
10109
10235
|
*
|
10110
10236
|
*/
|
@@ -12314,7 +12440,6 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
12314
12440
|
const videoSrc = rec.video.url;
|
12315
12441
|
if (!videoSrc)
|
12316
12442
|
return;
|
12317
|
-
videoRef === null || videoRef === void 0 ? void 0 : videoRef.src(videoSrc);
|
12318
12443
|
setIsPauseVideo(false);
|
12319
12444
|
const videoPlayerWrapperNode = document.querySelector(`#${videoId}`);
|
12320
12445
|
const dom = document.querySelector('#player-container-id');
|
@@ -12322,6 +12447,7 @@ const VideoWidget$2 = ({ rec, index, height, data, muted, activeIndex, videoPost
|
|
12322
12447
|
if (!dom && !dom2)
|
12323
12448
|
return;
|
12324
12449
|
videoPlayerWrapperNode === null || videoPlayerWrapperNode === void 0 ? void 0 : videoPlayerWrapperNode.appendChild(dom || dom2);
|
12450
|
+
videoRef === null || videoRef === void 0 ? void 0 : videoRef.src(videoSrc);
|
12325
12451
|
videoRef === null || videoRef === void 0 ? void 0 : videoRef.on('loadedmetadata', handleLoadedmetadata);
|
12326
12452
|
videoRef === null || videoRef === void 0 ? void 0 : videoRef.on('loadeddata', handLoadeddata);
|
12327
12453
|
// videoRef?.on('canplay', handleCanplay);
|
@@ -12461,7 +12587,7 @@ var ToggleButton$1 = memo(ToggleButton);
|
|
12461
12587
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\FingerSwipeTip\index.tsx
|
12462
12588
|
*
|
12463
12589
|
*/
|
12464
|
-
const FingerSwipeTip = ({ imageUrl }) => {
|
12590
|
+
const FingerSwipeTip = ({ imageUrl, style }) => {
|
12465
12591
|
const [show, setShow] = useState(true);
|
12466
12592
|
useEditor();
|
12467
12593
|
useEffect(() => {
|
@@ -12473,7 +12599,7 @@ const FingerSwipeTip = ({ imageUrl }) => {
|
|
12473
12599
|
const animationCls = useMemo(() => {
|
12474
12600
|
return show ? 'pb-fadeIn' : 'pb-fadeOut';
|
12475
12601
|
}, [show]);
|
12476
|
-
return (React.createElement("div", { hidden: !show, className: `pb-finger-wrap ${animationCls}
|
12602
|
+
return (React.createElement("div", { hidden: !show, className: `pb-finger-wrap ${animationCls}`, style: style },
|
12477
12603
|
React.createElement("img", { src: imageUrl || FINGER_SWIPE_ICON })));
|
12478
12604
|
};
|
12479
12605
|
|
@@ -12777,12 +12903,12 @@ var Tagbar$1 = memo(Tagbar);
|
|
12777
12903
|
* @Author: binruan@chatlabs.com
|
12778
12904
|
* @Date: 2024-01-15 19:03:09
|
12779
12905
|
* @LastEditors: binruan@chatlabs.com
|
12780
|
-
* @LastEditTime: 2024-05-
|
12906
|
+
* @LastEditTime: 2024-05-17 13:58:46
|
12781
12907
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
12782
12908
|
*
|
12783
12909
|
*/
|
12784
12910
|
const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, tagList = [], licenseUrl }) => {
|
12785
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
12911
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
12786
12912
|
const { schema } = useEditor();
|
12787
12913
|
const [activeIndex, setActiveIndex] = useState(0);
|
12788
12914
|
const viewImageStartTime = useRef(0);
|
@@ -12837,29 +12963,23 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
12837
12963
|
};
|
12838
12964
|
const firstRef = useRef();
|
12839
12965
|
useEffect(() => {
|
12840
|
-
|
12841
|
-
if (!firstRef.current && !videoRef && (playerRef === null || playerRef === void 0 ? void 0 : playerRef.current) && (data === null || data === void 0 ? void 0 : data.length) > 0) {
|
12966
|
+
if (!firstRef.current && !videoRef) {
|
12842
12967
|
firstRef.current = true;
|
12843
12968
|
const player = TCPlayer('player-container-id', {
|
12844
12969
|
licenseUrl, // license 地址,参考准备工作部分,在视立方控制台申请 license 后可获得 licenseUrl
|
12845
12970
|
controls: false,
|
12971
|
+
autoplay: false,
|
12846
12972
|
loop: false,
|
12847
|
-
autoplay: true,
|
12848
12973
|
muted: true,
|
12849
12974
|
preload: 'auto',
|
12850
12975
|
posterImage: false,
|
12851
|
-
bigPlayButton: true
|
12852
|
-
sources: [
|
12853
|
-
{
|
12854
|
-
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 : ''
|
12855
|
-
}
|
12856
|
-
]
|
12976
|
+
bigPlayButton: true
|
12857
12977
|
});
|
12858
12978
|
player === null || player === void 0 ? void 0 : player.ready(() => {
|
12859
12979
|
setVideoRef(player);
|
12860
12980
|
});
|
12861
12981
|
}
|
12862
|
-
}, [videoRef, licenseUrl
|
12982
|
+
}, [videoRef, licenseUrl]);
|
12863
12983
|
useEffect(() => {
|
12864
12984
|
if (!isInit)
|
12865
12985
|
handleH5EnterLink();
|
@@ -13048,7 +13168,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
13048
13168
|
lineGradStyle
|
13049
13169
|
]);
|
13050
13170
|
const renderLikeButton = useCallback((rec, index) => {
|
13051
|
-
var _a, _b;
|
13171
|
+
var _a, _b, _c, _d;
|
13052
13172
|
if (!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLike))
|
13053
13173
|
return;
|
13054
13174
|
let top = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconY) !== null && _a !== void 0 ? _a : 400;
|
@@ -13057,8 +13177,8 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
13057
13177
|
}
|
13058
13178
|
if (rec.video) {
|
13059
13179
|
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: {
|
13060
|
-
|
13061
|
-
|
13180
|
+
[(_b = globalConfig.likeIconXPosit) !== null && _b !== void 0 ? _b : 'right']: (_c = globalConfig.likeIconX) !== null && _c !== void 0 ? _c : 0,
|
13181
|
+
[(_d = globalConfig.likeIconYPosit) !== null && _d !== void 0 ? _d : 'bottom']: top
|
13062
13182
|
}, position: index }));
|
13063
13183
|
}
|
13064
13184
|
return null;
|
@@ -13196,7 +13316,7 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
13196
13316
|
} })),
|
13197
13317
|
renderLogo,
|
13198
13318
|
React.createElement(Tagbar$1, { tagList: tagList, setActiveIndex: setActiveIndex }),
|
13199
|
-
isShowFingerTip ? React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon }) : null,
|
13319
|
+
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,
|
13200
13320
|
React.createElement(Swiper, { ref: swiperRef, onSlideChange: () => {
|
13201
13321
|
swiperRef.current.swiper.allowTouchMove = false;
|
13202
13322
|
setTimeout(() => {
|
@@ -13238,13 +13358,13 @@ const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.inner
|
|
13238
13358
|
direction: 'vertical', height: height },
|
13239
13359
|
React.createElement(ToggleButton$1, { style: {
|
13240
13360
|
position: 'fixed',
|
13241
|
-
right: (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconX) !== null && _a !== void 0 ? _a : 0,
|
13242
13361
|
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',
|
13243
|
-
|
13244
|
-
|
13362
|
+
zIndex: 999,
|
13363
|
+
[(_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,
|
13364
|
+
[(_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
|
13245
13365
|
}, 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 }),
|
13246
13366
|
renderView),
|
13247
|
-
React.createElement(WaterFall$1, Object.assign({}, (
|
13367
|
+
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)),
|
13248
13368
|
React.createElement("div", { style: { position: 'absolute', zIndex: -100 } },
|
13249
13369
|
React.createElement("video", { ref: playerRef, id: 'player-container-id', playsInline: true, crossOrigin: 'anonymous', style: {
|
13250
13370
|
backgroundColor: 'transparent',
|
@@ -13400,8 +13520,8 @@ const VideoWidget = ({ rec, index, height, data, muted, activeIndex, videoPostCo
|
|
13400
13520
|
if (!videoRef.current.src) {
|
13401
13521
|
const videoSrc = rec.video.url;
|
13402
13522
|
if (videoSrc.includes('.m3u8')) {
|
13403
|
-
if (
|
13404
|
-
const hls = new
|
13523
|
+
if (Hls.isSupported()) {
|
13524
|
+
const hls = new Hls();
|
13405
13525
|
hls.loadSource(videoSrc);
|
13406
13526
|
hls.attachMedia(videoRef.current);
|
13407
13527
|
}
|
@@ -13687,7 +13807,7 @@ const Popup = () => {
|
|
13687
13807
|
* @Author: binruan@chatlabs.com
|
13688
13808
|
* @Date: 2024-01-15 19:03:09
|
13689
13809
|
* @LastEditors: binruan@chatlabs.com
|
13690
|
-
* @LastEditTime: 2024-05-17
|
13810
|
+
* @LastEditTime: 2024-05-06 17:26:37
|
13691
13811
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageCore\index.tsx
|
13692
13812
|
*
|
13693
13813
|
*/
|
@@ -13704,14 +13824,14 @@ Object.values(_materials_).forEach((v) => {
|
|
13704
13824
|
RESOLVER[v.extend.type] = v;
|
13705
13825
|
});
|
13706
13826
|
const SxpPageCore = ({ data, maxSize = 10, defaultSize = 10, hashTagSize = 20, loadingImage, appDomain, licenseUrl, enabledMetaConversionApi }) => {
|
13707
|
-
var _a, _b, _c, _d, _e, _f
|
13827
|
+
var _a, _b, _c, _d, _e, _f;
|
13708
13828
|
const utmVal = useMemo(() => {
|
13709
13829
|
var _a;
|
13710
13830
|
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('?', '') : '';
|
13711
13831
|
return searchParams;
|
13712
13832
|
}, []);
|
13713
13833
|
return (React.createElement(EditorCore, { resolver: RESOLVER, enableDataSource: false, schema: data === null || data === void 0 ? void 0 : data.data, utmVal: utmVal },
|
13714
|
-
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,
|
13834
|
+
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 }) => {
|
13715
13835
|
var _a;
|
13716
13836
|
return (React.createElement(React.Fragment, null,
|
13717
13837
|
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 })),
|