@fonixtree/magic-design 1.0.29 → 1.0.30

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.
Files changed (7) hide show
  1. package/es/composite-comp/common/components/ImageLabel/index.less +8 -0
  2. package/es/composite-comp/common/components/ProductItem/index.js +25 -17
  3. package/es/composite-comp/common/components/ProductItem/index.less +15 -6
  4. package/lib/composite-comp/common/components/ImageLabel/index.less +8 -0
  5. package/lib/composite-comp/common/components/ProductItem/index.js +25 -17
  6. package/lib/composite-comp/common/components/ProductItem/index.less +15 -6
  7. package/package.json +1 -1
package/es/composite-comp/common/components/ImageLabel/index.less CHANGED
@@ -6,6 +6,7 @@
6
6
  &.img {
7
7
  max-width: 60px;
8
8
  max-height: 60px;
9
+ height: 28px;
9
10
 
10
11
  &.small {
11
12
  max-width: 30px;
@@ -42,4 +43,11 @@
42
43
  vertical-align: middle;
43
44
  float: left;
44
45
  }
46
+
47
+ &.position-7 {
48
+ position: unset;
49
+ margin-left: 6px;
50
+ // width: 56px;
51
+ height: 16px;
52
+ }
45
53
  }
package/es/composite-comp/common/components/ProductItem/index.js CHANGED
@@ -95,20 +95,20 @@ function (_super) {
95
95
  }
96
96
 
97
97
  ProductItem.prototype.render = function () {
98
- var _a, _b;
99
-
100
- var _c = this.props,
101
- data = _c.data,
102
- panelProps = _c.panelProps,
103
- onItemClick = _c.onItemClick,
104
- showProName = _c.showProName,
105
- showProgress = _c.showProgress,
106
- fixHeight = _c.fixHeight,
107
- layout = _c.layout,
108
- imgHeight = _c.imgHeight,
109
- imgWidth = _c.imgWidth,
110
- unknownPrice = _c.unknownPrice,
111
- rest = __rest(_c, ["data", "panelProps", "onItemClick", "showProName", "showProgress", "fixHeight", "layout", "imgHeight", "imgWidth", "unknownPrice"]);
98
+ var _a, _b, _c;
99
+
100
+ var _d = this.props,
101
+ data = _d.data,
102
+ panelProps = _d.panelProps,
103
+ onItemClick = _d.onItemClick,
104
+ showProName = _d.showProName,
105
+ showProgress = _d.showProgress,
106
+ fixHeight = _d.fixHeight,
107
+ layout = _d.layout,
108
+ imgHeight = _d.imgHeight,
109
+ imgWidth = _d.imgWidth,
110
+ unknownPrice = _d.unknownPrice,
111
+ rest = __rest(_d, ["data", "panelProps", "onItemClick", "showProName", "showProgress", "fixHeight", "layout", "imgHeight", "imgWidth", "unknownPrice"]);
112
112
 
113
113
  var promotions = (0, _businessUtil.getPromotionList)(data);
114
114
  var price = (0, _currencyUtil.formatCurrency)(data.salesPrice);
@@ -145,11 +145,14 @@ function (_super) {
145
145
  if (imgWidth) imgStyle.width = imgWidth;
146
146
  if (imgHeight) imgStyle.height = imgHeight;
147
147
  var imgLabels = ((_a = data.labels) === null || _a === void 0 ? void 0 : _a.filter(function (f) {
148
- return f.position !== '6';
148
+ return f.position !== '6' && f.position !== '7';
149
149
  })) || [];
150
150
  var prodLabels = ((_b = data.labels) === null || _b === void 0 ? void 0 : _b.filter(function (f) {
151
151
  return f.position === '6';
152
152
  })) || [];
153
+ var priceLabels = ((_c = data.labels) === null || _c === void 0 ? void 0 : _c.filter(function (f) {
154
+ return f.position === '7';
155
+ })) || [];
153
156
  return /*#__PURE__*/_react["default"].createElement("div", _extends({
154
157
  className: (0, _classnames["default"])('m-product-item-wrap', {
155
158
  fixHeight: fixHeight,
@@ -196,13 +199,18 @@ function (_super) {
196
199
  text: data.offerName
197
200
  }),
198
201
  readonly: true
199
- }))), panelProps.activityPrice.open && /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
202
+ }))), panelProps.activityPrice.open && /*#__PURE__*/_react["default"].createElement("div", {
203
+ className: "price-wrap"
204
+ }, /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
200
205
  className: "price",
201
206
  data: __assign(__assign({}, panelProps.activityPrice), {
202
207
  text: _price
203
208
  }),
204
209
  readonly: true
205
- }), panelProps.salesPrice.open && /*#__PURE__*/_react["default"].createElement("div", {
210
+ }), priceLabels.length > 0 && /*#__PURE__*/_react["default"].createElement(_ImageLabel["default"], {
211
+ labels: priceLabels,
212
+ small: true
213
+ })), panelProps.salesPrice.open && /*#__PURE__*/_react["default"].createElement("div", {
206
214
  className: "price-sold-wrap"
207
215
  }, /*#__PURE__*/_react["default"].createElement("div", {
208
216
  className: "old-price-wrap"
package/es/composite-comp/common/components/ProductItem/index.less CHANGED
@@ -22,6 +22,7 @@
22
22
  .content-wrap {
23
23
  padding: 8px;
24
24
  width: 100%;
25
+
25
26
  .promotions-wrap {
26
27
  display: flex;
27
28
  flex-wrap: wrap;
@@ -46,11 +47,16 @@
46
47
  max-height: 40px;
47
48
  }
48
49
 
49
- .price {
50
- width: 100%;
51
- white-space: nowrap;
52
- overflow: hidden;
53
- text-overflow: ellipsis;
50
+ .price-wrap {
51
+ display: flex;
52
+ align-items: center;
53
+
54
+ .price {
55
+ width: auto !important;
56
+ white-space: nowrap;
57
+ overflow: hidden;
58
+ text-overflow: ellipsis;
59
+ }
54
60
  }
55
61
 
56
62
  .price-sold-wrap {
@@ -62,9 +68,11 @@
62
68
  text-overflow: ellipsis;
63
69
  flex-wrap: wrap;
64
70
  line-height: 15px;
71
+
65
72
  .old-price-wrap {
66
73
  display: flex;
67
74
  line-height: 13px;
75
+
68
76
  .discount {
69
77
  margin-right: 3px;
70
78
  font-family: 'Montserrat';
@@ -76,6 +84,7 @@
76
84
  padding: 0 4px;
77
85
  background-color: #CE1126;
78
86
  }
87
+
79
88
  .old-price {
80
89
  text-decoration: line-through;
81
90
  width: fit-content;
@@ -85,7 +94,7 @@
85
94
  .sold-count {
86
95
  color: #7b7b7b;
87
96
  font-size: 12px;
88
- text-align: right ;
97
+ text-align: right;
89
98
  flex-grow: 1;
90
99
  }
91
100
  }
package/lib/composite-comp/common/components/ImageLabel/index.less CHANGED
@@ -6,6 +6,7 @@
6
6
  &.img {
7
7
  max-width: 60px;
8
8
  max-height: 60px;
9
+ height: 28px;
9
10
 
10
11
  &.small {
11
12
  max-width: 30px;
@@ -42,4 +43,11 @@
42
43
  vertical-align: middle;
43
44
  float: left;
44
45
  }
46
+
47
+ &.position-7 {
48
+ position: unset;
49
+ margin-left: 6px;
50
+ // width: 56px;
51
+ height: 16px;
52
+ }
45
53
  }
package/lib/composite-comp/common/components/ProductItem/index.js CHANGED
@@ -95,20 +95,20 @@ function (_super) {
95
95
  }
96
96
 
97
97
  ProductItem.prototype.render = function () {
98
- var _a, _b;
99
-
100
- var _c = this.props,
101
- data = _c.data,
102
- panelProps = _c.panelProps,
103
- onItemClick = _c.onItemClick,
104
- showProName = _c.showProName,
105
- showProgress = _c.showProgress,
106
- fixHeight = _c.fixHeight,
107
- layout = _c.layout,
108
- imgHeight = _c.imgHeight,
109
- imgWidth = _c.imgWidth,
110
- unknownPrice = _c.unknownPrice,
111
- rest = __rest(_c, ["data", "panelProps", "onItemClick", "showProName", "showProgress", "fixHeight", "layout", "imgHeight", "imgWidth", "unknownPrice"]);
98
+ var _a, _b, _c;
99
+
100
+ var _d = this.props,
101
+ data = _d.data,
102
+ panelProps = _d.panelProps,
103
+ onItemClick = _d.onItemClick,
104
+ showProName = _d.showProName,
105
+ showProgress = _d.showProgress,
106
+ fixHeight = _d.fixHeight,
107
+ layout = _d.layout,
108
+ imgHeight = _d.imgHeight,
109
+ imgWidth = _d.imgWidth,
110
+ unknownPrice = _d.unknownPrice,
111
+ rest = __rest(_d, ["data", "panelProps", "onItemClick", "showProName", "showProgress", "fixHeight", "layout", "imgHeight", "imgWidth", "unknownPrice"]);
112
112
 
113
113
  var promotions = (0, _businessUtil.getPromotionList)(data);
114
114
  var price = (0, _currencyUtil.formatCurrency)(data.salesPrice);
@@ -145,11 +145,14 @@ function (_super) {
145
145
  if (imgWidth) imgStyle.width = imgWidth;
146
146
  if (imgHeight) imgStyle.height = imgHeight;
147
147
  var imgLabels = ((_a = data.labels) === null || _a === void 0 ? void 0 : _a.filter(function (f) {
148
- return f.position !== '6';
148
+ return f.position !== '6' && f.position !== '7';
149
149
  })) || [];
150
150
  var prodLabels = ((_b = data.labels) === null || _b === void 0 ? void 0 : _b.filter(function (f) {
151
151
  return f.position === '6';
152
152
  })) || [];
153
+ var priceLabels = ((_c = data.labels) === null || _c === void 0 ? void 0 : _c.filter(function (f) {
154
+ return f.position === '7';
155
+ })) || [];
153
156
  return /*#__PURE__*/_react["default"].createElement("div", _extends({
154
157
  className: (0, _classnames["default"])('m-product-item-wrap', {
155
158
  fixHeight: fixHeight,
@@ -196,13 +199,18 @@ function (_super) {
196
199
  text: data.offerName
197
200
  }),
198
201
  readonly: true
199
- }))), panelProps.activityPrice.open && /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
202
+ }))), panelProps.activityPrice.open && /*#__PURE__*/_react["default"].createElement("div", {
203
+ className: "price-wrap"
204
+ }, /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
200
205
  className: "price",
201
206
  data: __assign(__assign({}, panelProps.activityPrice), {
202
207
  text: _price
203
208
  }),
204
209
  readonly: true
205
- }), panelProps.salesPrice.open && /*#__PURE__*/_react["default"].createElement("div", {
210
+ }), priceLabels.length > 0 && /*#__PURE__*/_react["default"].createElement(_ImageLabel["default"], {
211
+ labels: priceLabels,
212
+ small: true
213
+ })), panelProps.salesPrice.open && /*#__PURE__*/_react["default"].createElement("div", {
206
214
  className: "price-sold-wrap"
207
215
  }, /*#__PURE__*/_react["default"].createElement("div", {
208
216
  className: "old-price-wrap"
package/lib/composite-comp/common/components/ProductItem/index.less CHANGED
@@ -22,6 +22,7 @@
22
22
  .content-wrap {
23
23
  padding: 8px;
24
24
  width: 100%;
25
+
25
26
  .promotions-wrap {
26
27
  display: flex;
27
28
  flex-wrap: wrap;
@@ -46,11 +47,16 @@
46
47
  max-height: 40px;
47
48
  }
48
49
 
49
- .price {
50
- width: 100%;
51
- white-space: nowrap;
52
- overflow: hidden;
53
- text-overflow: ellipsis;
50
+ .price-wrap {
51
+ display: flex;
52
+ align-items: center;
53
+
54
+ .price {
55
+ width: auto !important;
56
+ white-space: nowrap;
57
+ overflow: hidden;
58
+ text-overflow: ellipsis;
59
+ }
54
60
  }
55
61
 
56
62
  .price-sold-wrap {
@@ -62,9 +68,11 @@
62
68
  text-overflow: ellipsis;
63
69
  flex-wrap: wrap;
64
70
  line-height: 15px;
71
+
65
72
  .old-price-wrap {
66
73
  display: flex;
67
74
  line-height: 13px;
75
+
68
76
  .discount {
69
77
  margin-right: 3px;
70
78
  font-family: 'Montserrat';
@@ -76,6 +84,7 @@
76
84
  padding: 0 4px;
77
85
  background-color: #CE1126;
78
86
  }
87
+
79
88
  .old-price {
80
89
  text-decoration: line-through;
81
90
  width: fit-content;
@@ -85,7 +94,7 @@
85
94
  .sold-count {
86
95
  color: #7b7b7b;
87
96
  font-size: 12px;
88
- text-align: right ;
97
+ text-align: right;
89
98
  flex-grow: 1;
90
99
  }
91
100
  }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@fonixtree/magic-design",
3
3
  "author": "Cylon Team",
4
- "version": "1.0.29",
4
+ "version": "1.0.30",
5
5
  "description": "Magic Design",
6
6
  "license": "MIT",
7
7
  "module": "es/index.js",