@fonixtree/magic-design 0.0.80 → 0.0.82
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/es/composite-comp/bol/components/Banner/mobile/index.js +48 -2
- package/es/composite-comp/bol/components/Banner/pc/index.js +62 -16
- package/es/composite-comp/dito/components/SearchBar/defaultJSON.js +2 -2
- package/es/composite-comp/dito/components/SearchBar/pc/index.js +2 -4
- package/es/composite-comp/dito/components/SearchBar/pc/index.less +1 -0
- package/es/core/Designer/CompListPanel/CompCard/index.js +3 -1
- package/es/core/Designer/CompListPanel/index.js +3 -3
- package/es/decorator/compositeDecorator.js +16 -13
- package/es/locale/en/en.json +2 -2
- package/es/locale/id/id.json +2 -2
- package/es/utils/businessUtil.js +3 -3
- package/lib/composite-comp/bol/components/Banner/mobile/index.js +48 -2
- package/lib/composite-comp/bol/components/Banner/pc/index.js +62 -16
- package/lib/composite-comp/dito/components/SearchBar/defaultJSON.js +2 -2
- package/lib/composite-comp/dito/components/SearchBar/pc/index.js +2 -4
- package/lib/composite-comp/dito/components/SearchBar/pc/index.less +1 -0
- package/lib/core/Designer/CompListPanel/CompCard/index.js +3 -1
- package/lib/core/Designer/CompListPanel/index.js +3 -3
- package/lib/decorator/compositeDecorator.js +16 -13
- package/lib/locale/en/en.json +2 -2
- package/lib/locale/id/id.json +2 -2
- package/lib/utils/businessUtil.js +3 -3
- package/package.json +1 -1
|
@@ -49,6 +49,22 @@ var __extends = void 0 && (void 0).__extends || function () {
|
|
|
49
49
|
};
|
|
50
50
|
}();
|
|
51
51
|
|
|
52
|
+
var __assign = void 0 && (void 0).__assign || function () {
|
|
53
|
+
__assign = Object.assign || function (t) {
|
|
54
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
55
|
+
s = arguments[i];
|
|
56
|
+
|
|
57
|
+
for (var p in s) {
|
|
58
|
+
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
return t;
|
|
63
|
+
};
|
|
64
|
+
|
|
65
|
+
return __assign.apply(this, arguments);
|
|
66
|
+
};
|
|
67
|
+
|
|
52
68
|
var BannerMobile =
|
|
53
69
|
/** @class */
|
|
54
70
|
function (_super) {
|
|
@@ -74,6 +90,31 @@ function (_super) {
|
|
|
74
90
|
}
|
|
75
91
|
};
|
|
76
92
|
|
|
93
|
+
_this.getPaddingAndBackground = function (item) {
|
|
94
|
+
var spacing = _this.props.data.spacing; // const { spacing, background } = data;
|
|
95
|
+
|
|
96
|
+
var device = window.magicDesign.device;
|
|
97
|
+
var wrapStyle = {}; // 边距
|
|
98
|
+
|
|
99
|
+
if (spacing && spacing[device]) {
|
|
100
|
+
wrapStyle = __assign(__assign({}, wrapStyle), spacing[device]);
|
|
101
|
+
} // 背景
|
|
102
|
+
|
|
103
|
+
|
|
104
|
+
if (item.background) {
|
|
105
|
+
if (item.background.bgType === 'color') {
|
|
106
|
+
wrapStyle.backgroundColor = item.background.color;
|
|
107
|
+
wrapStyle.opacity = item.background.opacity ? item.background.opacity : 1;
|
|
108
|
+
} else {
|
|
109
|
+
wrapStyle.backgroundImage = "url(" + item.background.image + ")";
|
|
110
|
+
wrapStyle.backgroundPosition = 'center';
|
|
111
|
+
wrapStyle.backgroundSize = 'cover';
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
return __assign({}, wrapStyle);
|
|
116
|
+
};
|
|
117
|
+
|
|
77
118
|
_this.getItemStyle = function (item) {
|
|
78
119
|
var data = _this.props.data;
|
|
79
120
|
return {
|
|
@@ -128,7 +169,10 @@ function (_super) {
|
|
|
128
169
|
}
|
|
129
170
|
|
|
130
171
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
131
|
-
className: "m-banner-mobile"
|
|
172
|
+
className: "m-banner-mobile",
|
|
173
|
+
style: {
|
|
174
|
+
marginBottom: data.spacing.mobile.marginBottom || 0
|
|
175
|
+
}
|
|
132
176
|
}, /*#__PURE__*/_react["default"].createElement(_antd.Carousel, {
|
|
133
177
|
ref: this.carouselRef,
|
|
134
178
|
afterChange: function afterChange(n) {
|
|
@@ -142,6 +186,8 @@ function (_super) {
|
|
|
142
186
|
}, data.groupSource.map(function (item, index) {
|
|
143
187
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
144
188
|
key: item.id
|
|
189
|
+
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
190
|
+
style: _this.getPaddingAndBackground(item)
|
|
145
191
|
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
146
192
|
className: "carouselItem",
|
|
147
193
|
onMouseEnter: _this.mouseEnterWrap,
|
|
@@ -176,7 +222,7 @@ function (_super) {
|
|
|
176
222
|
}), item.secondButton.open && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
|
|
177
223
|
className: "btn",
|
|
178
224
|
data: item.secondButton
|
|
179
|
-
})))));
|
|
225
|
+
}))))));
|
|
180
226
|
})), data.setting.dots.open && /*#__PURE__*/_react["default"].createElement("div", {
|
|
181
227
|
className: "swiper-ban"
|
|
182
228
|
}, data.groupSource.length > 1 && data.groupSource.map(function (item, i) {
|
|
@@ -23,8 +23,6 @@ var _AlignSelector = require("../../../../../common/AlignSelector");
|
|
|
23
23
|
|
|
24
24
|
var _common = require("../../../../../common");
|
|
25
25
|
|
|
26
|
-
var _commonUtil = require("../../../../../utils/commonUtil");
|
|
27
|
-
|
|
28
26
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
29
27
|
|
|
30
28
|
var __extends = void 0 && (void 0).__extends || function () {
|
|
@@ -53,6 +51,22 @@ var __extends = void 0 && (void 0).__extends || function () {
|
|
|
53
51
|
};
|
|
54
52
|
}();
|
|
55
53
|
|
|
54
|
+
var __assign = void 0 && (void 0).__assign || function () {
|
|
55
|
+
__assign = Object.assign || function (t) {
|
|
56
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
57
|
+
s = arguments[i];
|
|
58
|
+
|
|
59
|
+
for (var p in s) {
|
|
60
|
+
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
return t;
|
|
65
|
+
};
|
|
66
|
+
|
|
67
|
+
return __assign.apply(this, arguments);
|
|
68
|
+
};
|
|
69
|
+
|
|
56
70
|
// @inject('store')
|
|
57
71
|
// @observer
|
|
58
72
|
var BannerPc =
|
|
@@ -120,20 +134,37 @@ function (_super) {
|
|
|
120
134
|
}
|
|
121
135
|
};
|
|
122
136
|
|
|
123
|
-
_this.
|
|
124
|
-
var
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
};
|
|
137
|
+
_this.getPaddingAndBackground = function (item) {
|
|
138
|
+
var spacing = _this.props.data.spacing; // const { spacing, background } = data;
|
|
139
|
+
|
|
140
|
+
var device = window.magicDesign.device;
|
|
141
|
+
var wrapStyle = {}; // 边距
|
|
128
142
|
|
|
129
|
-
if (
|
|
130
|
-
|
|
131
|
-
}
|
|
132
|
-
|
|
143
|
+
if (spacing && spacing[device]) {
|
|
144
|
+
wrapStyle = __assign(__assign({}, wrapStyle), spacing[device]);
|
|
145
|
+
} // 背景
|
|
146
|
+
|
|
147
|
+
|
|
148
|
+
if (item.background) {
|
|
149
|
+
if (item.background.bgType === 'color') {
|
|
150
|
+
wrapStyle.backgroundColor = item.background.color;
|
|
151
|
+
wrapStyle.opacity = item.background.opacity ? item.background.opacity : 1;
|
|
152
|
+
} else {
|
|
153
|
+
wrapStyle.backgroundImage = "url(" + item.background.image + ")";
|
|
154
|
+
wrapStyle.backgroundPosition = 'center';
|
|
155
|
+
wrapStyle.backgroundSize = 'cover';
|
|
156
|
+
}
|
|
133
157
|
}
|
|
134
158
|
|
|
135
|
-
|
|
136
|
-
|
|
159
|
+
return __assign({}, wrapStyle);
|
|
160
|
+
};
|
|
161
|
+
|
|
162
|
+
_this.getItemStyle = function (item) {
|
|
163
|
+
var data = _this.props.data;
|
|
164
|
+
return {
|
|
165
|
+
justifyContent: _AlignSelector.alignItemMap[item.customize.layout],
|
|
166
|
+
height: data.setting.pcHeight
|
|
167
|
+
};
|
|
137
168
|
};
|
|
138
169
|
|
|
139
170
|
return _this;
|
|
@@ -153,7 +184,20 @@ function (_super) {
|
|
|
153
184
|
|
|
154
185
|
BannerPc.prototype.componentWillUnmount = function () {
|
|
155
186
|
this.destroy();
|
|
156
|
-
};
|
|
187
|
+
}; // getBgStyle = item => {
|
|
188
|
+
// const { data } = this.props;
|
|
189
|
+
// const bgStyle = {
|
|
190
|
+
// justifyContent: alignItemMap[item.customize.layout],
|
|
191
|
+
// };
|
|
192
|
+
// if (item.background.bgType === 'color') {
|
|
193
|
+
// bgStyle.backgroundColor = getColorRgba(item.background.color || '#fff', item.background.opacity / 100 || 1);
|
|
194
|
+
// } else {
|
|
195
|
+
// bgStyle.backgroundImage = `url(${item.background.image})`;
|
|
196
|
+
// }
|
|
197
|
+
// if (data.setting.pcHeight) bgStyle.height = data.setting.pcHeight;
|
|
198
|
+
// return bgStyle;
|
|
199
|
+
// }
|
|
200
|
+
|
|
157
201
|
|
|
158
202
|
BannerPc.prototype.render = function () {
|
|
159
203
|
var _this = this;
|
|
@@ -197,11 +241,13 @@ function (_super) {
|
|
|
197
241
|
}, data.groupSource.map(function (item, index) {
|
|
198
242
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
199
243
|
key: item.id
|
|
244
|
+
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
245
|
+
style: _this.getPaddingAndBackground(item)
|
|
200
246
|
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
201
247
|
className: "carouselItem",
|
|
202
248
|
onMouseEnter: _this.mouseEnterWrap,
|
|
203
249
|
onMouseLeave: _this.mouseLeaveWrap,
|
|
204
|
-
style: _this.
|
|
250
|
+
style: _this.getItemStyle(item)
|
|
205
251
|
}, item.image.open && /*#__PURE__*/_react["default"].createElement(_components.MetaImage, {
|
|
206
252
|
data: item.image,
|
|
207
253
|
hoverState: hoverState && carouseIndex === index,
|
|
@@ -231,7 +277,7 @@ function (_super) {
|
|
|
231
277
|
}), item.secondButton.open && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
|
|
232
278
|
className: "btn",
|
|
233
279
|
data: item.secondButton
|
|
234
|
-
})))));
|
|
280
|
+
}))))));
|
|
235
281
|
})), data.setting.dots.open && /*#__PURE__*/_react["default"].createElement("div", {
|
|
236
282
|
className: "swiper-ban"
|
|
237
283
|
}, data.groupSource.length > 1 && data.groupSource.map(function (item, i) {
|
|
@@ -42,7 +42,7 @@ var getDefaultJSON = function getDefaultJSON() {
|
|
|
42
42
|
open: true,
|
|
43
43
|
color: {
|
|
44
44
|
pc: '#D92929',
|
|
45
|
-
mobile: '#
|
|
45
|
+
mobile: '#232F46'
|
|
46
46
|
}
|
|
47
47
|
},
|
|
48
48
|
icon: {
|
|
@@ -50,7 +50,7 @@ var getDefaultJSON = function getDefaultJSON() {
|
|
|
50
50
|
open: true,
|
|
51
51
|
color: {
|
|
52
52
|
pc: '#D92929',
|
|
53
|
-
mobile: '#
|
|
53
|
+
mobile: '#8493AF'
|
|
54
54
|
}
|
|
55
55
|
}
|
|
56
56
|
},
|
|
@@ -69,9 +69,7 @@ function (_super) {
|
|
|
69
69
|
|
|
70
70
|
_this.searchProduct = function () {
|
|
71
71
|
console.log('--input', _this.state.inputVal);
|
|
72
|
-
(0, _coreUtil.clickUrl)(
|
|
73
|
-
pathname: "/product/list?q=" + _this.state.inputVal
|
|
74
|
-
});
|
|
72
|
+
(0, _coreUtil.clickUrl)("/product/list?q=" + _this.state.inputVal);
|
|
75
73
|
};
|
|
76
74
|
|
|
77
75
|
_this.keyUp = function (e) {
|
|
@@ -121,7 +119,7 @@ function (_super) {
|
|
|
121
119
|
}))), data.content && data.content.icon.open && /*#__PURE__*/_react["default"].createElement("div", {
|
|
122
120
|
className: "shopping-wrap",
|
|
123
121
|
onClick: function onClick() {
|
|
124
|
-
return (0, _coreUtil.clickUrl)('/cart');
|
|
122
|
+
return (0, _coreUtil.clickUrl)('/main/cart');
|
|
125
123
|
},
|
|
126
124
|
style: {
|
|
127
125
|
borderColor: data.content.icon.color.pc,
|
|
@@ -9,6 +9,8 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
9
9
|
|
|
10
10
|
var _Iconfont = _interopRequireDefault(require("../../../../common/Iconfont"));
|
|
11
11
|
|
|
12
|
+
var _constants = require("../../../../constants");
|
|
13
|
+
|
|
12
14
|
require("./index.less");
|
|
13
15
|
|
|
14
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
@@ -24,7 +26,7 @@ function CompCard(_a) {
|
|
|
24
26
|
className: "comp-info"
|
|
25
27
|
}, /*#__PURE__*/_react["default"].createElement("span", null, /*#__PURE__*/_react["default"].createElement(_Iconfont["default"], {
|
|
26
28
|
className: "comp-icon",
|
|
27
|
-
type: icon
|
|
29
|
+
type: icon || _constants.compInfoMap[type].icon
|
|
28
30
|
}), /*#__PURE__*/_react["default"].createElement("span", {
|
|
29
31
|
className: "comp-name"
|
|
30
32
|
}, label)), /*#__PURE__*/_react["default"].createElement(_Iconfont["default"], {
|
|
@@ -109,13 +109,13 @@ function (_super) {
|
|
|
109
109
|
className: "title"
|
|
110
110
|
}, (0, _locale.i18n)('ADD_COMPONENT')), /*#__PURE__*/_react["default"].createElement("div", {
|
|
111
111
|
className: "component-list"
|
|
112
|
-
},
|
|
112
|
+
}, compSource.map(function (compCat) {
|
|
113
113
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
114
|
-
key: compCat,
|
|
114
|
+
key: compCat.moduleCatgId,
|
|
115
115
|
className: "cat-list"
|
|
116
116
|
}, /*#__PURE__*/_react["default"].createElement("h5", {
|
|
117
117
|
className: "cat-name"
|
|
118
|
-
}, compCat, "(", "" +
|
|
118
|
+
}, compCat.category, "(", "" + (compCat.modules ? compCat.modules.length : '0'), ")"), compCat.modules && compCat.modules.map(function (comp) {
|
|
119
119
|
return (0, _coreUtil.isActiveFloor)(comp.terminalType) ? /*#__PURE__*/_react["default"].createElement(_CompCard["default"], _extends({}, comp, {
|
|
120
120
|
key: comp.moduleId,
|
|
121
121
|
onAdd: function onAdd() {
|
|
@@ -90,13 +90,13 @@ function compositeDecorator(WrappedComponent) {
|
|
|
90
90
|
};
|
|
91
91
|
|
|
92
92
|
_this.getStyle = function () {
|
|
93
|
+
var nodeData = _this.props.nodeData;
|
|
93
94
|
var wrapStyle = {
|
|
94
95
|
border: 'none'
|
|
95
96
|
};
|
|
96
97
|
var _a = window.magicDesign,
|
|
97
98
|
device = _a.device,
|
|
98
99
|
mode = _a.mode;
|
|
99
|
-
var nodeData = _this.props.nodeData;
|
|
100
100
|
var spacing = nodeData.spacing,
|
|
101
101
|
background = nodeData.background; // 处理复合组件的选中状态
|
|
102
102
|
|
|
@@ -107,22 +107,25 @@ function compositeDecorator(WrappedComponent) {
|
|
|
107
107
|
if (nodeData.id === _this.state.clickedFloor) {
|
|
108
108
|
wrapStyle.border = '1px dashed red';
|
|
109
109
|
}
|
|
110
|
-
} //
|
|
110
|
+
} // banner的padding和background单独处理
|
|
111
111
|
|
|
112
112
|
|
|
113
|
-
if (
|
|
114
|
-
|
|
115
|
-
|
|
113
|
+
if (nodeData.type != 'BANNER') {
|
|
114
|
+
// 边距
|
|
115
|
+
if (spacing && spacing[device]) {
|
|
116
|
+
wrapStyle = __assign(__assign({}, wrapStyle), spacing[device]);
|
|
117
|
+
} // 背景
|
|
116
118
|
|
|
117
119
|
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
120
|
+
if (background) {
|
|
121
|
+
if (background.bgType === 'color') {
|
|
122
|
+
wrapStyle.backgroundColor = background.color;
|
|
123
|
+
wrapStyle.opacity = background.opacity ? background.opacity : 1;
|
|
124
|
+
} else {
|
|
125
|
+
wrapStyle.backgroundImage = "url(" + background.image + ")";
|
|
126
|
+
wrapStyle.backgroundPosition = 'center';
|
|
127
|
+
wrapStyle.backgroundSize = 'cover';
|
|
128
|
+
}
|
|
126
129
|
}
|
|
127
130
|
}
|
|
128
131
|
|
package/es/locale/en/en.json
CHANGED
|
@@ -32,8 +32,8 @@
|
|
|
32
32
|
"BACKGROUND": "Background",
|
|
33
33
|
"PLACEHOLDER": "Placeholder",
|
|
34
34
|
"FONT_STYLE": "Font Style",
|
|
35
|
-
"FONT_FAMILY": "
|
|
36
|
-
"FONT_WEIGHT": "
|
|
35
|
+
"FONT_FAMILY": "Font Family",
|
|
36
|
+
"FONT_WEIGHT": "Font Weight",
|
|
37
37
|
"FONT_SIZE": "Font Size",
|
|
38
38
|
"LINE_SPACING": "Line Spacing",
|
|
39
39
|
"LINE_COLOR": "Line Color",
|
package/es/locale/id/id.json
CHANGED
|
@@ -32,8 +32,8 @@
|
|
|
32
32
|
"BACKGROUND": "Background",
|
|
33
33
|
"PLACEHOLDER": "Placeholder",
|
|
34
34
|
"FONT_STYLE": "Font Style",
|
|
35
|
-
"FONT_FAMILY": "
|
|
36
|
-
"FONT_WEIGHT": "
|
|
35
|
+
"FONT_FAMILY": "Font Family",
|
|
36
|
+
"FONT_WEIGHT": "Font Weight",
|
|
37
37
|
"FONT_SIZE": "Font Size",
|
|
38
38
|
"LINE_SPACING": "Line Spacing",
|
|
39
39
|
"LINE_COLOR": "Line Color",
|
package/es/utils/businessUtil.js
CHANGED
|
@@ -20,7 +20,7 @@ var parseUrl = function parseUrl(url) {
|
|
|
20
20
|
switch (type) {
|
|
21
21
|
// 商品详情
|
|
22
22
|
case _constants.urlType.PRODUCT_DETAIL:
|
|
23
|
-
pcLink = "/
|
|
23
|
+
pcLink = "/product/detail/" + arg1 + "?productId=" + (arg2 !== null && arg2 !== void 0 ? arg2 : '');
|
|
24
24
|
h5Link = "/product/detail/" + arg1 + "?productId=" + (arg2 !== null && arg2 !== void 0 ? arg2 : '');
|
|
25
25
|
params = {
|
|
26
26
|
type: 'PROD_DETAIL',
|
|
@@ -33,7 +33,7 @@ var parseUrl = function parseUrl(url) {
|
|
|
33
33
|
|
|
34
34
|
case _constants.urlType.CATG_PROD_LIST:
|
|
35
35
|
// 商品列表
|
|
36
|
-
pcLink = "/
|
|
36
|
+
pcLink = "/product/list/" + arg1;
|
|
37
37
|
h5Link = "/product/list/" + arg1;
|
|
38
38
|
params = {
|
|
39
39
|
type: 'PROD_LIST',
|
|
@@ -57,7 +57,7 @@ var parseUrl = function parseUrl(url) {
|
|
|
57
57
|
|
|
58
58
|
case _constants.urlType.CUSTOMIZED:
|
|
59
59
|
// 自定义页面
|
|
60
|
-
pcLink = "/
|
|
60
|
+
pcLink = "/group/" + arg1;
|
|
61
61
|
h5Link = "/group/" + arg1;
|
|
62
62
|
params = {
|
|
63
63
|
type: 'CUSTOMIZED',
|
|
@@ -49,6 +49,22 @@ var __extends = void 0 && (void 0).__extends || function () {
|
|
|
49
49
|
};
|
|
50
50
|
}();
|
|
51
51
|
|
|
52
|
+
var __assign = void 0 && (void 0).__assign || function () {
|
|
53
|
+
__assign = Object.assign || function (t) {
|
|
54
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
55
|
+
s = arguments[i];
|
|
56
|
+
|
|
57
|
+
for (var p in s) {
|
|
58
|
+
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
return t;
|
|
63
|
+
};
|
|
64
|
+
|
|
65
|
+
return __assign.apply(this, arguments);
|
|
66
|
+
};
|
|
67
|
+
|
|
52
68
|
var BannerMobile =
|
|
53
69
|
/** @class */
|
|
54
70
|
function (_super) {
|
|
@@ -74,6 +90,31 @@ function (_super) {
|
|
|
74
90
|
}
|
|
75
91
|
};
|
|
76
92
|
|
|
93
|
+
_this.getPaddingAndBackground = function (item) {
|
|
94
|
+
var spacing = _this.props.data.spacing; // const { spacing, background } = data;
|
|
95
|
+
|
|
96
|
+
var device = window.magicDesign.device;
|
|
97
|
+
var wrapStyle = {}; // 边距
|
|
98
|
+
|
|
99
|
+
if (spacing && spacing[device]) {
|
|
100
|
+
wrapStyle = __assign(__assign({}, wrapStyle), spacing[device]);
|
|
101
|
+
} // 背景
|
|
102
|
+
|
|
103
|
+
|
|
104
|
+
if (item.background) {
|
|
105
|
+
if (item.background.bgType === 'color') {
|
|
106
|
+
wrapStyle.backgroundColor = item.background.color;
|
|
107
|
+
wrapStyle.opacity = item.background.opacity ? item.background.opacity : 1;
|
|
108
|
+
} else {
|
|
109
|
+
wrapStyle.backgroundImage = "url(" + item.background.image + ")";
|
|
110
|
+
wrapStyle.backgroundPosition = 'center';
|
|
111
|
+
wrapStyle.backgroundSize = 'cover';
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
return __assign({}, wrapStyle);
|
|
116
|
+
};
|
|
117
|
+
|
|
77
118
|
_this.getItemStyle = function (item) {
|
|
78
119
|
var data = _this.props.data;
|
|
79
120
|
return {
|
|
@@ -128,7 +169,10 @@ function (_super) {
|
|
|
128
169
|
}
|
|
129
170
|
|
|
130
171
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
131
|
-
className: "m-banner-mobile"
|
|
172
|
+
className: "m-banner-mobile",
|
|
173
|
+
style: {
|
|
174
|
+
marginBottom: data.spacing.mobile.marginBottom || 0
|
|
175
|
+
}
|
|
132
176
|
}, /*#__PURE__*/_react["default"].createElement(_antd.Carousel, {
|
|
133
177
|
ref: this.carouselRef,
|
|
134
178
|
afterChange: function afterChange(n) {
|
|
@@ -142,6 +186,8 @@ function (_super) {
|
|
|
142
186
|
}, data.groupSource.map(function (item, index) {
|
|
143
187
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
144
188
|
key: item.id
|
|
189
|
+
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
190
|
+
style: _this.getPaddingAndBackground(item)
|
|
145
191
|
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
146
192
|
className: "carouselItem",
|
|
147
193
|
onMouseEnter: _this.mouseEnterWrap,
|
|
@@ -176,7 +222,7 @@ function (_super) {
|
|
|
176
222
|
}), item.secondButton.open && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
|
|
177
223
|
className: "btn",
|
|
178
224
|
data: item.secondButton
|
|
179
|
-
})))));
|
|
225
|
+
}))))));
|
|
180
226
|
})), data.setting.dots.open && /*#__PURE__*/_react["default"].createElement("div", {
|
|
181
227
|
className: "swiper-ban"
|
|
182
228
|
}, data.groupSource.length > 1 && data.groupSource.map(function (item, i) {
|
|
@@ -23,8 +23,6 @@ var _AlignSelector = require("../../../../../common/AlignSelector");
|
|
|
23
23
|
|
|
24
24
|
var _common = require("../../../../../common");
|
|
25
25
|
|
|
26
|
-
var _commonUtil = require("../../../../../utils/commonUtil");
|
|
27
|
-
|
|
28
26
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
29
27
|
|
|
30
28
|
var __extends = void 0 && (void 0).__extends || function () {
|
|
@@ -53,6 +51,22 @@ var __extends = void 0 && (void 0).__extends || function () {
|
|
|
53
51
|
};
|
|
54
52
|
}();
|
|
55
53
|
|
|
54
|
+
var __assign = void 0 && (void 0).__assign || function () {
|
|
55
|
+
__assign = Object.assign || function (t) {
|
|
56
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
57
|
+
s = arguments[i];
|
|
58
|
+
|
|
59
|
+
for (var p in s) {
|
|
60
|
+
if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
return t;
|
|
65
|
+
};
|
|
66
|
+
|
|
67
|
+
return __assign.apply(this, arguments);
|
|
68
|
+
};
|
|
69
|
+
|
|
56
70
|
// @inject('store')
|
|
57
71
|
// @observer
|
|
58
72
|
var BannerPc =
|
|
@@ -120,20 +134,37 @@ function (_super) {
|
|
|
120
134
|
}
|
|
121
135
|
};
|
|
122
136
|
|
|
123
|
-
_this.
|
|
124
|
-
var
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
};
|
|
137
|
+
_this.getPaddingAndBackground = function (item) {
|
|
138
|
+
var spacing = _this.props.data.spacing; // const { spacing, background } = data;
|
|
139
|
+
|
|
140
|
+
var device = window.magicDesign.device;
|
|
141
|
+
var wrapStyle = {}; // 边距
|
|
128
142
|
|
|
129
|
-
if (
|
|
130
|
-
|
|
131
|
-
}
|
|
132
|
-
|
|
143
|
+
if (spacing && spacing[device]) {
|
|
144
|
+
wrapStyle = __assign(__assign({}, wrapStyle), spacing[device]);
|
|
145
|
+
} // 背景
|
|
146
|
+
|
|
147
|
+
|
|
148
|
+
if (item.background) {
|
|
149
|
+
if (item.background.bgType === 'color') {
|
|
150
|
+
wrapStyle.backgroundColor = item.background.color;
|
|
151
|
+
wrapStyle.opacity = item.background.opacity ? item.background.opacity : 1;
|
|
152
|
+
} else {
|
|
153
|
+
wrapStyle.backgroundImage = "url(" + item.background.image + ")";
|
|
154
|
+
wrapStyle.backgroundPosition = 'center';
|
|
155
|
+
wrapStyle.backgroundSize = 'cover';
|
|
156
|
+
}
|
|
133
157
|
}
|
|
134
158
|
|
|
135
|
-
|
|
136
|
-
|
|
159
|
+
return __assign({}, wrapStyle);
|
|
160
|
+
};
|
|
161
|
+
|
|
162
|
+
_this.getItemStyle = function (item) {
|
|
163
|
+
var data = _this.props.data;
|
|
164
|
+
return {
|
|
165
|
+
justifyContent: _AlignSelector.alignItemMap[item.customize.layout],
|
|
166
|
+
height: data.setting.pcHeight
|
|
167
|
+
};
|
|
137
168
|
};
|
|
138
169
|
|
|
139
170
|
return _this;
|
|
@@ -153,7 +184,20 @@ function (_super) {
|
|
|
153
184
|
|
|
154
185
|
BannerPc.prototype.componentWillUnmount = function () {
|
|
155
186
|
this.destroy();
|
|
156
|
-
};
|
|
187
|
+
}; // getBgStyle = item => {
|
|
188
|
+
// const { data } = this.props;
|
|
189
|
+
// const bgStyle = {
|
|
190
|
+
// justifyContent: alignItemMap[item.customize.layout],
|
|
191
|
+
// };
|
|
192
|
+
// if (item.background.bgType === 'color') {
|
|
193
|
+
// bgStyle.backgroundColor = getColorRgba(item.background.color || '#fff', item.background.opacity / 100 || 1);
|
|
194
|
+
// } else {
|
|
195
|
+
// bgStyle.backgroundImage = `url(${item.background.image})`;
|
|
196
|
+
// }
|
|
197
|
+
// if (data.setting.pcHeight) bgStyle.height = data.setting.pcHeight;
|
|
198
|
+
// return bgStyle;
|
|
199
|
+
// }
|
|
200
|
+
|
|
157
201
|
|
|
158
202
|
BannerPc.prototype.render = function () {
|
|
159
203
|
var _this = this;
|
|
@@ -197,11 +241,13 @@ function (_super) {
|
|
|
197
241
|
}, data.groupSource.map(function (item, index) {
|
|
198
242
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
199
243
|
key: item.id
|
|
244
|
+
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
245
|
+
style: _this.getPaddingAndBackground(item)
|
|
200
246
|
}, /*#__PURE__*/_react["default"].createElement("div", {
|
|
201
247
|
className: "carouselItem",
|
|
202
248
|
onMouseEnter: _this.mouseEnterWrap,
|
|
203
249
|
onMouseLeave: _this.mouseLeaveWrap,
|
|
204
|
-
style: _this.
|
|
250
|
+
style: _this.getItemStyle(item)
|
|
205
251
|
}, item.image.open && /*#__PURE__*/_react["default"].createElement(_components.MetaImage, {
|
|
206
252
|
data: item.image,
|
|
207
253
|
hoverState: hoverState && carouseIndex === index,
|
|
@@ -231,7 +277,7 @@ function (_super) {
|
|
|
231
277
|
}), item.secondButton.open && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
|
|
232
278
|
className: "btn",
|
|
233
279
|
data: item.secondButton
|
|
234
|
-
})))));
|
|
280
|
+
}))))));
|
|
235
281
|
})), data.setting.dots.open && /*#__PURE__*/_react["default"].createElement("div", {
|
|
236
282
|
className: "swiper-ban"
|
|
237
283
|
}, data.groupSource.length > 1 && data.groupSource.map(function (item, i) {
|
|
@@ -42,7 +42,7 @@ var getDefaultJSON = function getDefaultJSON() {
|
|
|
42
42
|
open: true,
|
|
43
43
|
color: {
|
|
44
44
|
pc: '#D92929',
|
|
45
|
-
mobile: '#
|
|
45
|
+
mobile: '#232F46'
|
|
46
46
|
}
|
|
47
47
|
},
|
|
48
48
|
icon: {
|
|
@@ -50,7 +50,7 @@ var getDefaultJSON = function getDefaultJSON() {
|
|
|
50
50
|
open: true,
|
|
51
51
|
color: {
|
|
52
52
|
pc: '#D92929',
|
|
53
|
-
mobile: '#
|
|
53
|
+
mobile: '#8493AF'
|
|
54
54
|
}
|
|
55
55
|
}
|
|
56
56
|
},
|
|
@@ -69,9 +69,7 @@ function (_super) {
|
|
|
69
69
|
|
|
70
70
|
_this.searchProduct = function () {
|
|
71
71
|
console.log('--input', _this.state.inputVal);
|
|
72
|
-
(0, _coreUtil.clickUrl)(
|
|
73
|
-
pathname: "/product/list?q=" + _this.state.inputVal
|
|
74
|
-
});
|
|
72
|
+
(0, _coreUtil.clickUrl)("/product/list?q=" + _this.state.inputVal);
|
|
75
73
|
};
|
|
76
74
|
|
|
77
75
|
_this.keyUp = function (e) {
|
|
@@ -121,7 +119,7 @@ function (_super) {
|
|
|
121
119
|
}))), data.content && data.content.icon.open && /*#__PURE__*/_react["default"].createElement("div", {
|
|
122
120
|
className: "shopping-wrap",
|
|
123
121
|
onClick: function onClick() {
|
|
124
|
-
return (0, _coreUtil.clickUrl)('/cart');
|
|
122
|
+
return (0, _coreUtil.clickUrl)('/main/cart');
|
|
125
123
|
},
|
|
126
124
|
style: {
|
|
127
125
|
borderColor: data.content.icon.color.pc,
|
|
@@ -9,6 +9,8 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
9
9
|
|
|
10
10
|
var _Iconfont = _interopRequireDefault(require("../../../../common/Iconfont"));
|
|
11
11
|
|
|
12
|
+
var _constants = require("../../../../constants");
|
|
13
|
+
|
|
12
14
|
require("./index.less");
|
|
13
15
|
|
|
14
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
@@ -24,7 +26,7 @@ function CompCard(_a) {
|
|
|
24
26
|
className: "comp-info"
|
|
25
27
|
}, /*#__PURE__*/_react["default"].createElement("span", null, /*#__PURE__*/_react["default"].createElement(_Iconfont["default"], {
|
|
26
28
|
className: "comp-icon",
|
|
27
|
-
type: icon
|
|
29
|
+
type: icon || _constants.compInfoMap[type].icon
|
|
28
30
|
}), /*#__PURE__*/_react["default"].createElement("span", {
|
|
29
31
|
className: "comp-name"
|
|
30
32
|
}, label)), /*#__PURE__*/_react["default"].createElement(_Iconfont["default"], {
|
|
@@ -109,13 +109,13 @@ function (_super) {
|
|
|
109
109
|
className: "title"
|
|
110
110
|
}, (0, _locale.i18n)('ADD_COMPONENT')), /*#__PURE__*/_react["default"].createElement("div", {
|
|
111
111
|
className: "component-list"
|
|
112
|
-
},
|
|
112
|
+
}, compSource.map(function (compCat) {
|
|
113
113
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
114
|
-
key: compCat,
|
|
114
|
+
key: compCat.moduleCatgId,
|
|
115
115
|
className: "cat-list"
|
|
116
116
|
}, /*#__PURE__*/_react["default"].createElement("h5", {
|
|
117
117
|
className: "cat-name"
|
|
118
|
-
}, compCat, "(", "" +
|
|
118
|
+
}, compCat.category, "(", "" + (compCat.modules ? compCat.modules.length : '0'), ")"), compCat.modules && compCat.modules.map(function (comp) {
|
|
119
119
|
return (0, _coreUtil.isActiveFloor)(comp.terminalType) ? /*#__PURE__*/_react["default"].createElement(_CompCard["default"], _extends({}, comp, {
|
|
120
120
|
key: comp.moduleId,
|
|
121
121
|
onAdd: function onAdd() {
|
|
@@ -90,13 +90,13 @@ function compositeDecorator(WrappedComponent) {
|
|
|
90
90
|
};
|
|
91
91
|
|
|
92
92
|
_this.getStyle = function () {
|
|
93
|
+
var nodeData = _this.props.nodeData;
|
|
93
94
|
var wrapStyle = {
|
|
94
95
|
border: 'none'
|
|
95
96
|
};
|
|
96
97
|
var _a = window.magicDesign,
|
|
97
98
|
device = _a.device,
|
|
98
99
|
mode = _a.mode;
|
|
99
|
-
var nodeData = _this.props.nodeData;
|
|
100
100
|
var spacing = nodeData.spacing,
|
|
101
101
|
background = nodeData.background; // 处理复合组件的选中状态
|
|
102
102
|
|
|
@@ -107,22 +107,25 @@ function compositeDecorator(WrappedComponent) {
|
|
|
107
107
|
if (nodeData.id === _this.state.clickedFloor) {
|
|
108
108
|
wrapStyle.border = '1px dashed red';
|
|
109
109
|
}
|
|
110
|
-
} //
|
|
110
|
+
} // banner的padding和background单独处理
|
|
111
111
|
|
|
112
112
|
|
|
113
|
-
if (
|
|
114
|
-
|
|
115
|
-
|
|
113
|
+
if (nodeData.type != 'BANNER') {
|
|
114
|
+
// 边距
|
|
115
|
+
if (spacing && spacing[device]) {
|
|
116
|
+
wrapStyle = __assign(__assign({}, wrapStyle), spacing[device]);
|
|
117
|
+
} // 背景
|
|
116
118
|
|
|
117
119
|
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
120
|
+
if (background) {
|
|
121
|
+
if (background.bgType === 'color') {
|
|
122
|
+
wrapStyle.backgroundColor = background.color;
|
|
123
|
+
wrapStyle.opacity = background.opacity ? background.opacity : 1;
|
|
124
|
+
} else {
|
|
125
|
+
wrapStyle.backgroundImage = "url(" + background.image + ")";
|
|
126
|
+
wrapStyle.backgroundPosition = 'center';
|
|
127
|
+
wrapStyle.backgroundSize = 'cover';
|
|
128
|
+
}
|
|
126
129
|
}
|
|
127
130
|
}
|
|
128
131
|
|
package/lib/locale/en/en.json
CHANGED
|
@@ -32,8 +32,8 @@
|
|
|
32
32
|
"BACKGROUND": "Background",
|
|
33
33
|
"PLACEHOLDER": "Placeholder",
|
|
34
34
|
"FONT_STYLE": "Font Style",
|
|
35
|
-
"FONT_FAMILY": "
|
|
36
|
-
"FONT_WEIGHT": "
|
|
35
|
+
"FONT_FAMILY": "Font Family",
|
|
36
|
+
"FONT_WEIGHT": "Font Weight",
|
|
37
37
|
"FONT_SIZE": "Font Size",
|
|
38
38
|
"LINE_SPACING": "Line Spacing",
|
|
39
39
|
"LINE_COLOR": "Line Color",
|
package/lib/locale/id/id.json
CHANGED
|
@@ -32,8 +32,8 @@
|
|
|
32
32
|
"BACKGROUND": "Background",
|
|
33
33
|
"PLACEHOLDER": "Placeholder",
|
|
34
34
|
"FONT_STYLE": "Font Style",
|
|
35
|
-
"FONT_FAMILY": "
|
|
36
|
-
"FONT_WEIGHT": "
|
|
35
|
+
"FONT_FAMILY": "Font Family",
|
|
36
|
+
"FONT_WEIGHT": "Font Weight",
|
|
37
37
|
"FONT_SIZE": "Font Size",
|
|
38
38
|
"LINE_SPACING": "Line Spacing",
|
|
39
39
|
"LINE_COLOR": "Line Color",
|
|
@@ -20,7 +20,7 @@ var parseUrl = function parseUrl(url) {
|
|
|
20
20
|
switch (type) {
|
|
21
21
|
// 商品详情
|
|
22
22
|
case _constants.urlType.PRODUCT_DETAIL:
|
|
23
|
-
pcLink = "/
|
|
23
|
+
pcLink = "/product/detail/" + arg1 + "?productId=" + (arg2 !== null && arg2 !== void 0 ? arg2 : '');
|
|
24
24
|
h5Link = "/product/detail/" + arg1 + "?productId=" + (arg2 !== null && arg2 !== void 0 ? arg2 : '');
|
|
25
25
|
params = {
|
|
26
26
|
type: 'PROD_DETAIL',
|
|
@@ -33,7 +33,7 @@ var parseUrl = function parseUrl(url) {
|
|
|
33
33
|
|
|
34
34
|
case _constants.urlType.CATG_PROD_LIST:
|
|
35
35
|
// 商品列表
|
|
36
|
-
pcLink = "/
|
|
36
|
+
pcLink = "/product/list/" + arg1;
|
|
37
37
|
h5Link = "/product/list/" + arg1;
|
|
38
38
|
params = {
|
|
39
39
|
type: 'PROD_LIST',
|
|
@@ -57,7 +57,7 @@ var parseUrl = function parseUrl(url) {
|
|
|
57
57
|
|
|
58
58
|
case _constants.urlType.CUSTOMIZED:
|
|
59
59
|
// 自定义页面
|
|
60
|
-
pcLink = "/
|
|
60
|
+
pcLink = "/group/" + arg1;
|
|
61
61
|
h5Link = "/group/" + arg1;
|
|
62
62
|
params = {
|
|
63
63
|
type: 'CUSTOMIZED',
|