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/pb-ui.js
CHANGED
@@ -1,8 +1,8 @@
|
|
1
1
|
(function (global, factory) {
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('lodash'), require('uuid'), require('pako'), require('react'), require('qs'), require('eventemitter3'), require('@emotion/css'), require('
|
3
|
-
typeof define === 'function' && define.amd ? define(['exports', 'lodash', 'uuid', 'pako', 'react', 'qs', 'eventemitter3', '@emotion/css', '
|
4
|
-
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.PUI = {}, global.lodash, global.uuid$1, global.pako, global.React, global.qs, global.EventEmitter, global.css, global.
|
5
|
-
})(this, (function (exports, lodash, uuid$1, pako, React, qs, EventEmitter, css,
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('lodash'), require('uuid'), require('pako'), require('react'), require('qs'), require('eventemitter3'), require('@emotion/css'), require('react-dom'), require('hls.js')) :
|
3
|
+
typeof define === 'function' && define.amd ? define(['exports', 'lodash', 'uuid', 'pako', 'react', 'qs', 'eventemitter3', '@emotion/css', 'react-dom', 'hls.js'], factory) :
|
4
|
+
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.PUI = {}, global.lodash, global.uuid$1, global.pako, global.React, global.qs, global.EventEmitter, global.css, global.ReactDOM, global.Hls));
|
5
|
+
})(this, (function (exports, lodash, uuid$1, pako, React, qs, EventEmitter, css, ReactDOM, Hls) { 'use strict';
|
6
6
|
|
7
7
|
function _interopNamespaceDefault(e) {
|
8
8
|
var n = Object.create(null);
|
@@ -438,7 +438,7 @@
|
|
438
438
|
DataSourceType[DataSourceType["BFF"] = 5] = "BFF";
|
439
439
|
})(DataSourceType || (DataSourceType = {}));
|
440
440
|
const UTM_KEYS = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_id', 'utm_content', 'cl_source'];
|
441
|
-
const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false
|
441
|
+
const SxpDataSourceProvider = ({ render, dataSources, utmVal, enableReportEvent = true, maxSize, defaultSize, isPreview = false, sxpParameter, appDomain, hashTagSize, loadingImage, isOpenHashTag = false, enabledMetaConversionApi = false }) => {
|
442
442
|
const [rtcList, setRtcList] = React.useState([]);
|
443
443
|
const [tagList, setTagList] = React.useState([]);
|
444
444
|
const [loading, setLoading] = React.useState(false);
|
@@ -592,7 +592,7 @@
|
|
592
592
|
// 获取 Tag
|
593
593
|
const bffGetTagList = React.useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
|
594
594
|
var _h, _j, _k, _l, _m;
|
595
|
-
if (!utmVal
|
595
|
+
if (!utmVal)
|
596
596
|
return;
|
597
597
|
try {
|
598
598
|
const val = (_k = (_j = (_h = utmVal === null || utmVal === void 0 ? void 0 : utmVal.split('&')) === null || _h === void 0 ? void 0 : _h.filter((val) => {
|
@@ -605,7 +605,7 @@
|
|
605
605
|
catch (e) {
|
606
606
|
console.log('e', e);
|
607
607
|
}
|
608
|
-
}), [bffFetch, utmVal
|
608
|
+
}), [bffFetch, utmVal]);
|
609
609
|
const ctaEvent = React.useCallback((eventInfo, rec, product, position) => {
|
610
610
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
611
611
|
const cta = product === null || product === void 0 ? void 0 : product.bindCta;
|
@@ -938,23 +938,30 @@
|
|
938
938
|
}
|
939
939
|
];
|
940
940
|
|
941
|
-
|
942
|
-
|
943
|
-
|
944
|
-
|
941
|
+
/*
|
942
|
+
* @Author: binruan@chatlabs.com
|
943
|
+
* @Date: 2024-04-28 14:42:22
|
944
|
+
* @LastEditors: binruan@chatlabs.com
|
945
|
+
* @LastEditTime: 2024-05-17 14:07:01
|
946
|
+
* @FilePath: \pb-sxp-ui\src\materials\sxp\defaultSetting.ts
|
947
|
+
*
|
948
|
+
*/
|
949
|
+
const fontOptions = [{ label: '默认字体', value: 'appFont' }];
|
950
|
+
const sxpFonts = typeof window !== 'undefined' && (window === null || window === void 0 ? void 0 : window.localStorage.getItem('sxp_font_links'));
|
951
|
+
const data = sxpFonts && sxpFonts !== '' ? JSON.parse(sxpFonts) : [];
|
945
952
|
var defaultSetting = {
|
946
|
-
fontOptions
|
953
|
+
fontOptions: [...fontOptions, ...data]
|
947
954
|
};
|
948
955
|
|
949
956
|
/*
|
950
957
|
* @Author: binruan@chatlabs.com
|
951
958
|
* @Date: 2023-07-28 18:29:57
|
952
959
|
* @LastEditors: binruan@chatlabs.com
|
953
|
-
* @LastEditTime:
|
960
|
+
* @LastEditTime: 2024-05-17 10:11:41
|
954
961
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\popup\AppointForm\settingRender.tsx
|
955
962
|
*
|
956
963
|
*/
|
957
|
-
var _a$
|
964
|
+
var _a$5, _b$5, _c;
|
958
965
|
var settingRender$5 = [
|
959
966
|
{
|
960
967
|
type: 'Text',
|
@@ -981,7 +988,7 @@
|
|
981
988
|
type: 'Select',
|
982
989
|
name: ['textStyle', 'fontFamily'],
|
983
990
|
options: fontOptions,
|
984
|
-
initialValue: (_a$
|
991
|
+
initialValue: (_a$5 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _a$5 === void 0 ? void 0 : _a$5.value
|
985
992
|
},
|
986
993
|
{
|
987
994
|
type: 'Number',
|
@@ -1024,6 +1031,37 @@
|
|
1024
1031
|
type: 'Text',
|
1025
1032
|
name: ['props', 'submitText']
|
1026
1033
|
},
|
1034
|
+
{
|
1035
|
+
type: 'Group',
|
1036
|
+
label: '提交按钮字体',
|
1037
|
+
child: [
|
1038
|
+
{
|
1039
|
+
type: 'Color',
|
1040
|
+
name: ['props', 'submitButtonStyle', 'color'],
|
1041
|
+
initialValue: '#fff'
|
1042
|
+
},
|
1043
|
+
{
|
1044
|
+
type: 'Select',
|
1045
|
+
name: ['props', 'submitButtonStyle', 'fontFamily'],
|
1046
|
+
options: defaultSetting === null || defaultSetting === void 0 ? void 0 : defaultSetting.fontOptions,
|
1047
|
+
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
|
1048
|
+
},
|
1049
|
+
{
|
1050
|
+
type: 'Number',
|
1051
|
+
name: ['props', 'submitButtonStyle', 'fontSize'],
|
1052
|
+
addonAfter: 'px',
|
1053
|
+
initialValue: 12
|
1054
|
+
}
|
1055
|
+
]
|
1056
|
+
},
|
1057
|
+
{
|
1058
|
+
type: 'TextStyle',
|
1059
|
+
name: ['props', 'submitButtonStyle']
|
1060
|
+
},
|
1061
|
+
{
|
1062
|
+
type: 'TextAlign',
|
1063
|
+
name: ['props', 'submitButtonStyle']
|
1064
|
+
},
|
1027
1065
|
{
|
1028
1066
|
label: '提交文本颜色',
|
1029
1067
|
type: 'Color',
|
@@ -1144,7 +1182,7 @@
|
|
1144
1182
|
}
|
1145
1183
|
|
1146
1184
|
const AppointForm$1 = (_a) => {
|
1147
|
-
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"]);
|
1185
|
+
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"]);
|
1148
1186
|
const { submitForm, popupDetailData } = useSxpDataSource();
|
1149
1187
|
const { jumpToWeb } = useEventReport();
|
1150
1188
|
const formRef = React.useRef();
|
@@ -1175,7 +1213,7 @@
|
|
1175
1213
|
key: '4'
|
1176
1214
|
}
|
1177
1215
|
], []);
|
1178
|
-
|
1216
|
+
React.useMemo(() => {
|
1179
1217
|
if (layoutType === undefined) {
|
1180
1218
|
const list = lodash.cloneDeep(columns) || defaultColumns;
|
1181
1219
|
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 } })));
|
@@ -1218,13 +1256,9 @@
|
|
1218
1256
|
return (React.createElement("div", { className: 'pb-appoint-form' },
|
1219
1257
|
React.createElement("div", { className: `pb-appoint-form-title ${css.css(Object.assign({}, textStyle))}` }, title),
|
1220
1258
|
React.createElement("div", Object.assign({ className: css.css(Object.assign({}, style)) }, props),
|
1221
|
-
React.createElement("div", { className: 'pb-appoint-form-container' },
|
1222
|
-
React.createElement(proComponents.BetaSchemaForm, { columns: columnsData, submitter: false, layout: layoutType, autoFocusFirstInput: false, size: 'large', formRef: formRef, className: 'panel-reset' }))),
|
1259
|
+
React.createElement("div", { className: 'pb-appoint-form-container' })),
|
1223
1260
|
React.createElement("div", { className: 'pb-appoint-form-btn-wrapper' },
|
1224
|
-
React.createElement("button", { onClick: handleSubmit, className: 'pb-appoint-form-btn', style: {
|
1225
|
-
color: submitColor,
|
1226
|
-
background: submitBgColor
|
1227
|
-
} }, loading ? React.createElement(React.Fragment, null, "loading...") : submitText))));
|
1261
|
+
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))));
|
1228
1262
|
};
|
1229
1263
|
var AppointFormComponent = React.memo(AppointForm$1);
|
1230
1264
|
|
@@ -1272,23 +1306,7 @@
|
|
1272
1306
|
sort: 2
|
1273
1307
|
});
|
1274
1308
|
|
1275
|
-
|
1276
|
-
* @Author: binruan@chatlabs.com
|
1277
|
-
* @Date: 2024-04-02 18:01:34
|
1278
|
-
* @LastEditors: binruan@chatlabs.com
|
1279
|
-
* @LastEditTime: 2024-04-12 16:46:04
|
1280
|
-
* @FilePath: \pb-sxp-ui\src\materials\sxp\popup\CommodityDetail\settingRender.tsx
|
1281
|
-
*
|
1282
|
-
*/
|
1283
|
-
var _a$3, _b$3;
|
1284
|
-
/*
|
1285
|
-
* @Author: binruan@chatlabs.com
|
1286
|
-
* @Date: 2024-03-26 16:50:25
|
1287
|
-
* @LastEditors: binruan@chatlabs.com
|
1288
|
-
* @LastEditTime: 2024-03-28 18:42:26
|
1289
|
-
* @FilePath: \pb-sxp-ui\src\materials\sxp\popup\CommodityDetailDiroNew\settingRender.tsx
|
1290
|
-
*
|
1291
|
-
*/
|
1309
|
+
var _a$4, _b$4;
|
1292
1310
|
var settingRender$4 = [
|
1293
1311
|
{
|
1294
1312
|
title: '商品图片',
|
@@ -1312,6 +1330,19 @@
|
|
1312
1330
|
type: 'Number',
|
1313
1331
|
name: ['props', 'swiper', 'delay'],
|
1314
1332
|
addonAfter: 's'
|
1333
|
+
},
|
1334
|
+
{
|
1335
|
+
type: 'Group',
|
1336
|
+
child: [
|
1337
|
+
{
|
1338
|
+
label: '居中垂直偏移',
|
1339
|
+
type: 'Number',
|
1340
|
+
name: ['props', 'swiper', 'translateY'],
|
1341
|
+
min: -100,
|
1342
|
+
addonAfter: '%',
|
1343
|
+
initialValue: 0
|
1344
|
+
}
|
1345
|
+
]
|
1315
1346
|
}
|
1316
1347
|
]
|
1317
1348
|
},
|
@@ -1346,6 +1377,23 @@
|
|
1346
1377
|
name: ['props', 'commodityStyles', 'field'],
|
1347
1378
|
initialValue: 'title'
|
1348
1379
|
},
|
1380
|
+
{
|
1381
|
+
type: 'Group',
|
1382
|
+
child: [
|
1383
|
+
{
|
1384
|
+
label: '上边距',
|
1385
|
+
type: 'Number',
|
1386
|
+
addonAfter: 'px',
|
1387
|
+
name: ['marginTop']
|
1388
|
+
},
|
1389
|
+
{
|
1390
|
+
label: '下边距',
|
1391
|
+
type: 'Number',
|
1392
|
+
addonAfter: 'px',
|
1393
|
+
name: ['marginBottom']
|
1394
|
+
}
|
1395
|
+
]
|
1396
|
+
},
|
1349
1397
|
{
|
1350
1398
|
type: 'Group',
|
1351
1399
|
label: '标题字体',
|
@@ -1358,7 +1406,7 @@
|
|
1358
1406
|
type: 'Select',
|
1359
1407
|
options: fontOptions,
|
1360
1408
|
name: ['fontFamily'],
|
1361
|
-
initialValue: (_a$
|
1409
|
+
initialValue: (_a$4 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _a$4 === void 0 ? void 0 : _a$4.value
|
1362
1410
|
},
|
1363
1411
|
{
|
1364
1412
|
type: 'Number',
|
@@ -1438,7 +1486,7 @@
|
|
1438
1486
|
type: 'Select',
|
1439
1487
|
name: ['props', 'buttonStyle', 'fontFamily'],
|
1440
1488
|
options: fontOptions,
|
1441
|
-
initialValue: (_b$
|
1489
|
+
initialValue: (_b$4 = fontOptions === null || fontOptions === void 0 ? void 0 : fontOptions[0]) === null || _b$4 === void 0 ? void 0 : _b$4.value
|
1442
1490
|
},
|
1443
1491
|
{
|
1444
1492
|
type: 'Number',
|
@@ -8383,7 +8431,7 @@
|
|
8383
8431
|
* @Author: binruan@chatlabs.com
|
8384
8432
|
* @Date: 2024-03-20 10:27:31
|
8385
8433
|
* @LastEditors: binruan@chatlabs.com
|
8386
|
-
* @LastEditTime: 2024-
|
8434
|
+
* @LastEditTime: 2024-04-19 14:12:55
|
8387
8435
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\FormatImage.tsx
|
8388
8436
|
*
|
8389
8437
|
*/
|
@@ -8398,30 +8446,6 @@
|
|
8398
8446
|
React.useEffect(() => {
|
8399
8447
|
setImgSrc(src);
|
8400
8448
|
}, [src]);
|
8401
|
-
React.useRef(null);
|
8402
|
-
// useEffect(() => {
|
8403
|
-
// let observer: any = null;
|
8404
|
-
// const { current } = imgRef;
|
8405
|
-
// if (current) {
|
8406
|
-
// observer = new IntersectionObserver(
|
8407
|
-
// (entries) => {
|
8408
|
-
// entries.forEach((entry) => {
|
8409
|
-
// if (entry.isIntersecting) {
|
8410
|
-
// setImgSrc(src);
|
8411
|
-
// observer.unobserve(current);
|
8412
|
-
// }
|
8413
|
-
// });
|
8414
|
-
// },
|
8415
|
-
// { threshold: 0.1 } // 触发阈值,可根据需要调整
|
8416
|
-
// );
|
8417
|
-
// observer.observe(current);
|
8418
|
-
// }
|
8419
|
-
// return () => {
|
8420
|
-
// if (observer && current) {
|
8421
|
-
// observer.unobserve(current);
|
8422
|
-
// }
|
8423
|
-
// };
|
8424
|
-
// }, [src]);
|
8425
8449
|
return (React.createElement(React.Fragment, null, (imgSrc === null || imgSrc === void 0 ? void 0 : imgSrc.includes('.avif')) ? (React.createElement("picture", null,
|
8426
8450
|
React.createElement("source", { type: 'image/avif', srcSet: imgSrc }),
|
8427
8451
|
React.createElement("source", { type: 'image/webp', srcSet: `${imgSrc}?imageMogr2/format/webp` }),
|
@@ -8518,7 +8542,13 @@
|
|
8518
8542
|
width,
|
8519
8543
|
height: width
|
8520
8544
|
} },
|
8521
|
-
React.createElement(FormatImage$1, { style: {
|
8545
|
+
React.createElement(FormatImage$1, { style: {
|
8546
|
+
height: '100%',
|
8547
|
+
width: '100%',
|
8548
|
+
objectFit: 'cover',
|
8549
|
+
display: 'block',
|
8550
|
+
transform: `translateY(${swiper === null || swiper === void 0 ? void 0 : swiper.translateY})%`
|
8551
|
+
}, src: src }))));
|
8522
8552
|
}))),
|
8523
8553
|
!((_j = product === null || product === void 0 ? void 0 : product.homePage) === null || _j === void 0 ? void 0 : _j.length) && (React.createElement("div", { className: css.css({
|
8524
8554
|
position: 'relative',
|
@@ -8567,7 +8597,9 @@
|
|
8567
8597
|
commodityStyles: {
|
8568
8598
|
price: {
|
8569
8599
|
color: '#000',
|
8570
|
-
fontSize: 18
|
8600
|
+
fontSize: 18,
|
8601
|
+
marginTop: 24,
|
8602
|
+
marginBottom: 10
|
8571
8603
|
},
|
8572
8604
|
title: {
|
8573
8605
|
color: '#000',
|
@@ -8575,7 +8607,8 @@
|
|
8575
8607
|
},
|
8576
8608
|
collection: {
|
8577
8609
|
fontSize: 12,
|
8578
|
-
color: '#000'
|
8610
|
+
color: '#000',
|
8611
|
+
marginBottom: 14
|
8579
8612
|
},
|
8580
8613
|
info: {
|
8581
8614
|
color: 'gray',
|
@@ -8614,26 +8647,68 @@
|
|
8614
8647
|
* @Author: binruan@chatlabs.com
|
8615
8648
|
* @Date: 2023-10-27 14:06:35
|
8616
8649
|
* @LastEditors: binruan@chatlabs.com
|
8617
|
-
* @LastEditTime:
|
8650
|
+
* @LastEditTime: 2024-05-17 10:29:41
|
8618
8651
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\popup\Prompt\settingRender.tsx
|
8619
8652
|
*
|
8620
8653
|
*/
|
8654
|
+
var _a$3, _b$3;
|
8621
8655
|
var settingRender$3 = [
|
8622
8656
|
{
|
8623
|
-
|
8624
|
-
|
8625
|
-
|
8626
|
-
|
8627
|
-
|
8628
|
-
|
8629
|
-
|
8630
|
-
|
8631
|
-
|
8632
|
-
|
8633
|
-
|
8634
|
-
|
8635
|
-
|
8636
|
-
|
8657
|
+
title: '',
|
8658
|
+
child: [
|
8659
|
+
{
|
8660
|
+
type: 'Media',
|
8661
|
+
label: '图标',
|
8662
|
+
name: ['props', 'icon'],
|
8663
|
+
mediaType: 'Image'
|
8664
|
+
},
|
8665
|
+
{
|
8666
|
+
type: 'TextArea',
|
8667
|
+
label: '内容',
|
8668
|
+
name: ['props', 'content']
|
8669
|
+
},
|
8670
|
+
{
|
8671
|
+
type: 'Text',
|
8672
|
+
label: '按钮文案',
|
8673
|
+
name: ['props', 'btnText']
|
8674
|
+
},
|
8675
|
+
{
|
8676
|
+
type: 'Group',
|
8677
|
+
label: '提交按钮字体',
|
8678
|
+
child: [
|
8679
|
+
{
|
8680
|
+
type: 'Color',
|
8681
|
+
name: ['props', 'submitButtonStyle', 'color'],
|
8682
|
+
initialValue: '#fff'
|
8683
|
+
},
|
8684
|
+
{
|
8685
|
+
type: 'Select',
|
8686
|
+
name: ['props', 'submitButtonStyle', 'fontFamily'],
|
8687
|
+
options: defaultSetting === null || defaultSetting === void 0 ? void 0 : defaultSetting.fontOptions,
|
8688
|
+
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
|
8689
|
+
},
|
8690
|
+
{
|
8691
|
+
type: 'Number',
|
8692
|
+
name: ['props', 'submitButtonStyle', 'fontSize'],
|
8693
|
+
addonAfter: 'px',
|
8694
|
+
initialValue: 12
|
8695
|
+
}
|
8696
|
+
]
|
8697
|
+
},
|
8698
|
+
{
|
8699
|
+
type: 'TextStyle',
|
8700
|
+
name: ['props', 'submitButtonStyle']
|
8701
|
+
},
|
8702
|
+
{
|
8703
|
+
type: 'TextAlign',
|
8704
|
+
name: ['props', 'submitButtonStyle']
|
8705
|
+
},
|
8706
|
+
{
|
8707
|
+
label: '提交按钮颜色',
|
8708
|
+
type: 'Color',
|
8709
|
+
name: ['props', 'submitButtonStyle', 'backgroundColor']
|
8710
|
+
}
|
8711
|
+
]
|
8637
8712
|
}
|
8638
8713
|
];
|
8639
8714
|
|
@@ -8672,7 +8747,7 @@
|
|
8672
8747
|
};
|
8673
8748
|
|
8674
8749
|
const Prompt$1 = (_a) => {
|
8675
|
-
var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick } = _a, props = __rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick"]);
|
8750
|
+
var { content, btnText, style, icon, isPopup, isExternalLink, onClose, onClick, submitButtonStyle } = _a, props = __rest(_a, ["content", "btnText", "style", "icon", "isPopup", "isExternalLink", "onClose", "onClick", "submitButtonStyle"]);
|
8676
8751
|
const { popupDetailData } = useSxpDataSource();
|
8677
8752
|
const { jumpToWeb } = useEventReport();
|
8678
8753
|
const iconSrc = typeof icon === 'string' ? icon : getMediaValueByMode(icon);
|
@@ -8694,7 +8769,7 @@
|
|
8694
8769
|
React.createElement("div", { className: 'pb-prompt-icon' },
|
8695
8770
|
React.createElement("img", { width: '100%', src: iconSrc !== null && iconSrc !== void 0 ? iconSrc : img$2 })),
|
8696
8771
|
React.createElement("div", { className: 'pb-prompt-content' }, content),
|
8697
|
-
React.createElement("button", { className: 'pb-prompt-btn', onClick: handleOk }, btnText)));
|
8772
|
+
React.createElement("button", { className: 'pb-prompt-btn', style: submitButtonStyle, onClick: handleOk }, btnText)));
|
8698
8773
|
};
|
8699
8774
|
var PromptComponent = React.memo(Prompt$1);
|
8700
8775
|
|
@@ -8753,6 +8828,19 @@
|
|
8753
8828
|
type: 'Number',
|
8754
8829
|
name: ['props', 'swiper', 'delay'],
|
8755
8830
|
addonAfter: 's'
|
8831
|
+
},
|
8832
|
+
{
|
8833
|
+
type: 'Group',
|
8834
|
+
child: [
|
8835
|
+
{
|
8836
|
+
label: '居中垂直偏移',
|
8837
|
+
type: 'Number',
|
8838
|
+
name: ['props', 'swiper', 'translateY'],
|
8839
|
+
min: -100,
|
8840
|
+
addonAfter: '%',
|
8841
|
+
initialValue: 0
|
8842
|
+
}
|
8843
|
+
]
|
8756
8844
|
}
|
8757
8845
|
]
|
8758
8846
|
},
|
@@ -8984,7 +9072,13 @@ Made in Italy` })));
|
|
8984
9072
|
width,
|
8985
9073
|
height: width
|
8986
9074
|
} },
|
8987
|
-
React.createElement(FormatImage$1, { style: {
|
9075
|
+
React.createElement(FormatImage$1, { style: {
|
9076
|
+
height: '100%',
|
9077
|
+
width: '100%',
|
9078
|
+
objectFit: 'cover',
|
9079
|
+
display: 'block',
|
9080
|
+
transform: `translateY(${swiper === null || swiper === void 0 ? void 0 : swiper.translateY})%`
|
9081
|
+
}, src: src }))));
|
8988
9082
|
}))),
|
8989
9083
|
!((_j = product === null || product === void 0 ? void 0 : product.homePage) === null || _j === void 0 ? void 0 : _j.length) && (React.createElement("div", { className: css.css({
|
8990
9084
|
position: 'relative',
|
@@ -9085,7 +9179,7 @@ Made in Italy` })));
|
|
9085
9179
|
* @Author: binruan@chatlabs.com
|
9086
9180
|
* @Date: 2024-03-26 16:50:25
|
9087
9181
|
* @LastEditors: binruan@chatlabs.com
|
9088
|
-
* @LastEditTime: 2024-
|
9182
|
+
* @LastEditTime: 2024-05-21 16:39:34
|
9089
9183
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\template\components\settingRender.tsx
|
9090
9184
|
*
|
9091
9185
|
*/
|
@@ -9186,6 +9280,14 @@ Made in Italy` })));
|
|
9186
9280
|
label: '与右侧边距',
|
9187
9281
|
addonAfter: 'px',
|
9188
9282
|
name: ['props', 'ctaTempStyles', 'img', 'marginRight']
|
9283
|
+
},
|
9284
|
+
{
|
9285
|
+
label: '居中垂直偏移',
|
9286
|
+
type: 'Number',
|
9287
|
+
name: ['props', 'translateY'],
|
9288
|
+
min: -100,
|
9289
|
+
addonAfter: '%',
|
9290
|
+
initialValue: 0
|
9189
9291
|
}
|
9190
9292
|
]
|
9191
9293
|
},
|
@@ -9391,13 +9493,19 @@ Made in Italy` })));
|
|
9391
9493
|
|
9392
9494
|
const Commodity$1 = (_a) => {
|
9393
9495
|
var _b, _c, _d, _e, _f, _g, _h;
|
9394
|
-
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink"]);
|
9496
|
+
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY"]);
|
9395
9497
|
const { sxpParameter } = useSxpDataSource();
|
9396
9498
|
const product = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProduct;
|
9397
9499
|
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;
|
9398
9500
|
return (React.createElement(EventProvider$1, Object.assign({ isExternalLink: isExternalLink, rec: recData, className: css.css(Object.assign({}, style)), style: { display: 'flex' } }, props),
|
9399
9501
|
React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9400
|
-
React.createElement(FormatImage$1, { className: css.css({
|
9502
|
+
React.createElement(FormatImage$1, { className: css.css({
|
9503
|
+
width: '100%',
|
9504
|
+
objectFit: 'cover',
|
9505
|
+
height: '100%',
|
9506
|
+
display: 'block',
|
9507
|
+
transform: `translateY(${translateY}%)`
|
9508
|
+
}), src: src })),
|
9401
9509
|
React.createElement("div", { className: css.css({
|
9402
9510
|
color: '#fff',
|
9403
9511
|
display: 'flex',
|
@@ -9634,13 +9742,19 @@ Made in Italy` })));
|
|
9634
9742
|
|
9635
9743
|
const CommodityDiro$1 = (_a) => {
|
9636
9744
|
var _b, _c, _d, _e, _f, _g, _h;
|
9637
|
-
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink"]);
|
9745
|
+
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY"]);
|
9638
9746
|
const { sxpParameter } = useSxpDataSource();
|
9639
9747
|
const product = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProduct;
|
9640
9748
|
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;
|
9641
9749
|
return (React.createElement(EventProvider$1, Object.assign({ isExternalLink: isExternalLink, rec: recData, className: css.css(Object.assign({}, style)), style: { display: 'flex' } }, props),
|
9642
9750
|
React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9643
|
-
React.createElement(FormatImage$1, { className: css.css({
|
9751
|
+
React.createElement(FormatImage$1, { className: css.css({
|
9752
|
+
width: '100%',
|
9753
|
+
objectFit: 'cover',
|
9754
|
+
height: '100%',
|
9755
|
+
display: 'block',
|
9756
|
+
transform: `translateY(${translateY}%)`
|
9757
|
+
}), src: src })),
|
9644
9758
|
React.createElement("div", { className: css.css({
|
9645
9759
|
color: '#fff',
|
9646
9760
|
display: 'flex',
|
@@ -9726,13 +9840,19 @@ Made in Italy` })));
|
|
9726
9840
|
|
9727
9841
|
const CommodityDiroNew$1 = (_a) => {
|
9728
9842
|
var _b, _c, _d, _e, _f, _g, _h;
|
9729
|
-
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink"]);
|
9843
|
+
var { content, style, bgImg, recData, bottom_image, ctaTempStyles, isExternalLink, translateY = 0 } = _a, props = __rest(_a, ["content", "style", "bgImg", "recData", "bottom_image", "ctaTempStyles", "isExternalLink", "translateY"]);
|
9730
9844
|
const { sxpParameter } = useSxpDataSource();
|
9731
9845
|
const product = (_b = recData === null || recData === void 0 ? void 0 : recData.video) === null || _b === void 0 ? void 0 : _b.bindProduct;
|
9732
9846
|
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;
|
9733
9847
|
return (React.createElement(EventProvider$1, Object.assign({ isExternalLink: isExternalLink, rec: recData, className: css.css(Object.assign({}, style)), style: { display: 'flex' } }, props),
|
9734
9848
|
React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9735
|
-
React.createElement(FormatImage$1, { className: css.css({
|
9849
|
+
React.createElement(FormatImage$1, { className: css.css({
|
9850
|
+
width: '100%',
|
9851
|
+
objectFit: 'cover',
|
9852
|
+
height: '100%',
|
9853
|
+
display: 'block',
|
9854
|
+
transform: `translateY(${translateY}%)`
|
9855
|
+
}), src: src })),
|
9736
9856
|
React.createElement("div", { className: css.css({
|
9737
9857
|
color: '#fff',
|
9738
9858
|
display: 'flex',
|
@@ -9824,11 +9944,11 @@ Made in Italy` })));
|
|
9824
9944
|
* @Author: binruan@chatlabs.com
|
9825
9945
|
* @Date: 2024-01-16 14:50:13
|
9826
9946
|
* @LastEditors: binruan@chatlabs.com
|
9827
|
-
* @LastEditTime: 2024-
|
9947
|
+
* @LastEditTime: 2024-05-21 16:34:13
|
9828
9948
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\template\components\Img.tsx
|
9829
9949
|
*
|
9830
9950
|
*/
|
9831
|
-
const Img = ({ src, rec, item, index }) => {
|
9951
|
+
const Img = ({ src, rec, item, index, style }) => {
|
9832
9952
|
const ref = React.useRef(null);
|
9833
9953
|
const isOnScreen = useOnScreen(ref);
|
9834
9954
|
const { ctaEvent } = useSxpDataSource();
|
@@ -9841,7 +9961,7 @@ Made in Italy` })));
|
|
9841
9961
|
}
|
9842
9962
|
}, [isOnScreen, src, ref, rec, ctaEvent, item, index]);
|
9843
9963
|
return (React.createElement("div", { ref: ref, hidden: !src, className: css.css({ width: '100%', height: '100%' }) },
|
9844
|
-
React.createElement(FormatImage$1, { className: css.css({ width: '100%', objectFit: 'cover', height: '100%', display: 'block' }), src: src })));
|
9964
|
+
React.createElement(FormatImage$1, { className: css.css(Object.assign({ width: '100%', objectFit: 'cover', height: '100%', display: 'block' }, style)), src: src })));
|
9845
9965
|
};
|
9846
9966
|
var Img$1 = React.memo(Img);
|
9847
9967
|
|
@@ -9849,7 +9969,7 @@ Made in Italy` })));
|
|
9849
9969
|
|
9850
9970
|
const MultiCommodityDiro$1 = (_a) => {
|
9851
9971
|
var _b, _c;
|
9852
|
-
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"]);
|
9972
|
+
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"]);
|
9853
9973
|
const { ctaEvent, setPopupDetailData, sxpParameter } = useSxpDataSource();
|
9854
9974
|
const { popup } = useEditor();
|
9855
9975
|
const { jumpToWeb } = useEventReport();
|
@@ -9874,7 +9994,9 @@ Made in Italy` })));
|
|
9874
9994
|
var _a, _b, _c, _d, _e, _f;
|
9875
9995
|
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) }),
|
9876
9996
|
React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9877
|
-
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
|
9997
|
+
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: {
|
9998
|
+
transform: `translateY(${translateY}%)`
|
9999
|
+
} })),
|
9878
10000
|
React.createElement("div", { className: css.css({
|
9879
10001
|
color: '#000',
|
9880
10002
|
display: 'flex',
|
@@ -9961,7 +10083,7 @@ Made in Italy` })));
|
|
9961
10083
|
|
9962
10084
|
const MultiCommodity$1 = (_a) => {
|
9963
10085
|
var _b, _c;
|
9964
|
-
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"]);
|
10086
|
+
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"]);
|
9965
10087
|
const { sxpParameter } = useSxpDataSource();
|
9966
10088
|
const { ctaEvent, setPopupDetailData } = useSxpDataSource();
|
9967
10089
|
const { popup } = useEditor();
|
@@ -9987,7 +10109,9 @@ Made in Italy` })));
|
|
9987
10109
|
var _a, _b, _c, _d, _e, _f;
|
9988
10110
|
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) }),
|
9989
10111
|
React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
9990
|
-
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
|
10112
|
+
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: {
|
10113
|
+
transform: `translateY(${translateY}%)`
|
10114
|
+
} })),
|
9991
10115
|
React.createElement("div", { className: css.css({
|
9992
10116
|
color: '#fff',
|
9993
10117
|
display: 'flex',
|
@@ -10074,7 +10198,7 @@ Made in Italy` })));
|
|
10074
10198
|
|
10075
10199
|
const MultiCommodityDiroNew$1 = (_a) => {
|
10076
10200
|
var _b, _c;
|
10077
|
-
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"]);
|
10201
|
+
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"]);
|
10078
10202
|
const { ctaEvent, setPopupDetailData, sxpParameter } = useSxpDataSource();
|
10079
10203
|
const { popup } = useEditor();
|
10080
10204
|
const { jumpToWeb } = useEventReport();
|
@@ -10099,7 +10223,9 @@ Made in Italy` })));
|
|
10099
10223
|
var _a, _b, _c, _d, _e, _f;
|
10100
10224
|
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) }),
|
10101
10225
|
React.createElement("div", { className: css.css(Object.assign({ overflow: 'hidden', flexShrink: 0, backgroundColor: '#f2f2f2' }, ctaTempStyles === null || ctaTempStyles === void 0 ? void 0 : ctaTempStyles.img)) },
|
10102
|
-
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
|
10226
|
+
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: {
|
10227
|
+
transform: `translateY(${translateY}%)`
|
10228
|
+
} })),
|
10103
10229
|
React.createElement("div", { className: css.css({
|
10104
10230
|
color: '#fff',
|
10105
10231
|
display: 'flex',
|
@@ -10119,7 +10245,7 @@ Made in Italy` })));
|
|
10119
10245
|
* @Author: binruan@chatlabs.com
|
10120
10246
|
* @Date: 2023-07-28 18:29:57
|
10121
10247
|
* @LastEditors: binruan@chatlabs.com
|
10122
|
-
* @LastEditTime: 2024-
|
10248
|
+
* @LastEditTime: 2024-05-21 16:44:00
|
10123
10249
|
* @FilePath: \pb-sxp-ui\src\materials\sxp\template\MultiCommodityDiroNew\material.tsx
|
10124
10250
|
*
|
10125
10251
|
*/
|
@@ -12329,7 +12455,6 @@ Made in Italy` })));
|
|
12329
12455
|
const videoSrc = rec.video.url;
|
12330
12456
|
if (!videoSrc)
|
12331
12457
|
return;
|
12332
|
-
videoRef === null || videoRef === void 0 ? void 0 : videoRef.src(videoSrc);
|
12333
12458
|
setIsPauseVideo(false);
|
12334
12459
|
const videoPlayerWrapperNode = document.querySelector(`#${videoId}`);
|
12335
12460
|
const dom = document.querySelector('#player-container-id');
|
@@ -12337,6 +12462,7 @@ Made in Italy` })));
|
|
12337
12462
|
if (!dom && !dom2)
|
12338
12463
|
return;
|
12339
12464
|
videoPlayerWrapperNode === null || videoPlayerWrapperNode === void 0 ? void 0 : videoPlayerWrapperNode.appendChild(dom || dom2);
|
12465
|
+
videoRef === null || videoRef === void 0 ? void 0 : videoRef.src(videoSrc);
|
12340
12466
|
videoRef === null || videoRef === void 0 ? void 0 : videoRef.on('loadedmetadata', handleLoadedmetadata);
|
12341
12467
|
videoRef === null || videoRef === void 0 ? void 0 : videoRef.on('loadeddata', handLoadeddata);
|
12342
12468
|
// videoRef?.on('canplay', handleCanplay);
|
@@ -12476,7 +12602,7 @@ Made in Italy` })));
|
|
12476
12602
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\FingerSwipeTip\index.tsx
|
12477
12603
|
*
|
12478
12604
|
*/
|
12479
|
-
const FingerSwipeTip = ({ imageUrl }) => {
|
12605
|
+
const FingerSwipeTip = ({ imageUrl, style }) => {
|
12480
12606
|
const [show, setShow] = React.useState(true);
|
12481
12607
|
useEditor();
|
12482
12608
|
React.useEffect(() => {
|
@@ -12488,7 +12614,7 @@ Made in Italy` })));
|
|
12488
12614
|
const animationCls = React.useMemo(() => {
|
12489
12615
|
return show ? 'pb-fadeIn' : 'pb-fadeOut';
|
12490
12616
|
}, [show]);
|
12491
|
-
return (React.createElement("div", { hidden: !show, className: `pb-finger-wrap ${animationCls}
|
12617
|
+
return (React.createElement("div", { hidden: !show, className: `pb-finger-wrap ${animationCls}`, style: style },
|
12492
12618
|
React.createElement("img", { src: imageUrl || FINGER_SWIPE_ICON })));
|
12493
12619
|
};
|
12494
12620
|
|
@@ -12792,12 +12918,12 @@ Made in Italy` })));
|
|
12792
12918
|
* @Author: binruan@chatlabs.com
|
12793
12919
|
* @Date: 2024-01-15 19:03:09
|
12794
12920
|
* @LastEditors: binruan@chatlabs.com
|
12795
|
-
* @LastEditTime: 2024-05-
|
12921
|
+
* @LastEditTime: 2024-05-17 13:58:46
|
12796
12922
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageRender\index.tsx
|
12797
12923
|
*
|
12798
12924
|
*/
|
12799
12925
|
const SxpPageRender = ({ globalConfig, descStyle, containerHeight = window.innerHeight, containerWidth = window.innerWidth, tempMap, resolver, data = [], ctaType, tipText, nudge, _schema, hashTagStyle, tagList = [], licenseUrl }) => {
|
12800
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
12926
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
12801
12927
|
const { schema } = useEditor();
|
12802
12928
|
const [activeIndex, setActiveIndex] = React.useState(0);
|
12803
12929
|
const viewImageStartTime = React.useRef(0);
|
@@ -12852,29 +12978,23 @@ Made in Italy` })));
|
|
12852
12978
|
};
|
12853
12979
|
const firstRef = React.useRef();
|
12854
12980
|
React.useEffect(() => {
|
12855
|
-
|
12856
|
-
if (!firstRef.current && !videoRef && (playerRef === null || playerRef === void 0 ? void 0 : playerRef.current) && (data === null || data === void 0 ? void 0 : data.length) > 0) {
|
12981
|
+
if (!firstRef.current && !videoRef) {
|
12857
12982
|
firstRef.current = true;
|
12858
12983
|
const player = TCPlayer('player-container-id', {
|
12859
12984
|
licenseUrl, // license 地址,参考准备工作部分,在视立方控制台申请 license 后可获得 licenseUrl
|
12860
12985
|
controls: false,
|
12986
|
+
autoplay: false,
|
12861
12987
|
loop: false,
|
12862
|
-
autoplay: true,
|
12863
12988
|
muted: true,
|
12864
12989
|
preload: 'auto',
|
12865
12990
|
posterImage: false,
|
12866
|
-
bigPlayButton: true
|
12867
|
-
sources: [
|
12868
|
-
{
|
12869
|
-
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 : ''
|
12870
|
-
}
|
12871
|
-
]
|
12991
|
+
bigPlayButton: true
|
12872
12992
|
});
|
12873
12993
|
player === null || player === void 0 ? void 0 : player.ready(() => {
|
12874
12994
|
setVideoRef(player);
|
12875
12995
|
});
|
12876
12996
|
}
|
12877
|
-
}, [videoRef, licenseUrl
|
12997
|
+
}, [videoRef, licenseUrl]);
|
12878
12998
|
React.useEffect(() => {
|
12879
12999
|
if (!isInit)
|
12880
13000
|
handleH5EnterLink();
|
@@ -13063,7 +13183,7 @@ Made in Italy` })));
|
|
13063
13183
|
lineGradStyle
|
13064
13184
|
]);
|
13065
13185
|
const renderLikeButton = React.useCallback((rec, index) => {
|
13066
|
-
var _a, _b;
|
13186
|
+
var _a, _b, _c, _d;
|
13067
13187
|
if (!(globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.isShowLike))
|
13068
13188
|
return;
|
13069
13189
|
let top = (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.likeIconY) !== null && _a !== void 0 ? _a : 400;
|
@@ -13072,8 +13192,8 @@ Made in Italy` })));
|
|
13072
13192
|
}
|
13073
13193
|
if (rec.video) {
|
13074
13194
|
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: {
|
13075
|
-
|
13076
|
-
|
13195
|
+
[(_b = globalConfig.likeIconXPosit) !== null && _b !== void 0 ? _b : 'right']: (_c = globalConfig.likeIconX) !== null && _c !== void 0 ? _c : 0,
|
13196
|
+
[(_d = globalConfig.likeIconYPosit) !== null && _d !== void 0 ? _d : 'bottom']: top
|
13077
13197
|
}, position: index }));
|
13078
13198
|
}
|
13079
13199
|
return null;
|
@@ -13211,7 +13331,7 @@ Made in Italy` })));
|
|
13211
13331
|
} })),
|
13212
13332
|
renderLogo,
|
13213
13333
|
React.createElement(Tagbar$1, { tagList: tagList, setActiveIndex: setActiveIndex }),
|
13214
|
-
isShowFingerTip ? React.createElement(FingerSwipeTip, { imageUrl: globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.swipeTipIcon }) : null,
|
13334
|
+
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,
|
13215
13335
|
React.createElement(Swiper, { ref: swiperRef, onSlideChange: () => {
|
13216
13336
|
swiperRef.current.swiper.allowTouchMove = false;
|
13217
13337
|
setTimeout(() => {
|
@@ -13253,13 +13373,13 @@ Made in Italy` })));
|
|
13253
13373
|
direction: 'vertical', height: height },
|
13254
13374
|
React.createElement(ToggleButton$1, { style: {
|
13255
13375
|
position: 'fixed',
|
13256
|
-
right: (_a = globalConfig === null || globalConfig === void 0 ? void 0 : globalConfig.muteIconX) !== null && _a !== void 0 ? _a : 0,
|
13257
13376
|
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',
|
13258
|
-
|
13259
|
-
|
13377
|
+
zIndex: 999,
|
13378
|
+
[(_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,
|
13379
|
+
[(_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
|
13260
13380
|
}, 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 }),
|
13261
13381
|
renderView),
|
13262
|
-
React.createElement(WaterFall$1, Object.assign({}, (
|
13382
|
+
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)),
|
13263
13383
|
React.createElement("div", { style: { position: 'absolute', zIndex: -100 } },
|
13264
13384
|
React.createElement("video", { ref: playerRef, id: 'player-container-id', playsInline: true, crossOrigin: 'anonymous', style: {
|
13265
13385
|
backgroundColor: 'transparent',
|
@@ -13415,8 +13535,8 @@ Made in Italy` })));
|
|
13415
13535
|
if (!videoRef.current.src) {
|
13416
13536
|
const videoSrc = rec.video.url;
|
13417
13537
|
if (videoSrc.includes('.m3u8')) {
|
13418
|
-
if (
|
13419
|
-
const hls = new
|
13538
|
+
if (Hls.isSupported()) {
|
13539
|
+
const hls = new Hls();
|
13420
13540
|
hls.loadSource(videoSrc);
|
13421
13541
|
hls.attachMedia(videoRef.current);
|
13422
13542
|
}
|
@@ -13702,7 +13822,7 @@ Made in Italy` })));
|
|
13702
13822
|
* @Author: binruan@chatlabs.com
|
13703
13823
|
* @Date: 2024-01-15 19:03:09
|
13704
13824
|
* @LastEditors: binruan@chatlabs.com
|
13705
|
-
* @LastEditTime: 2024-05-17
|
13825
|
+
* @LastEditTime: 2024-05-06 17:26:37
|
13706
13826
|
* @FilePath: \pb-sxp-ui\src\core\components\SxpPageCore\index.tsx
|
13707
13827
|
*
|
13708
13828
|
*/
|
@@ -13719,14 +13839,14 @@ Made in Italy` })));
|
|
13719
13839
|
RESOLVER[v.extend.type] = v;
|
13720
13840
|
});
|
13721
13841
|
const SxpPageCore = ({ data, maxSize = 10, defaultSize = 10, hashTagSize = 20, loadingImage, appDomain, licenseUrl, enabledMetaConversionApi }) => {
|
13722
|
-
var _a, _b, _c, _d, _e, _f
|
13842
|
+
var _a, _b, _c, _d, _e, _f;
|
13723
13843
|
const utmVal = React.useMemo(() => {
|
13724
13844
|
var _a;
|
13725
13845
|
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('?', '') : '';
|
13726
13846
|
return searchParams;
|
13727
13847
|
}, []);
|
13728
13848
|
return (React.createElement(EditorCore, { resolver: RESOLVER, enableDataSource: false, schema: data === null || data === void 0 ? void 0 : data.data, utmVal: utmVal },
|
13729
|
-
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,
|
13849
|
+
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 }) => {
|
13730
13850
|
var _a;
|
13731
13851
|
return (React.createElement(React.Fragment, null,
|
13732
13852
|
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 })),
|