@fonixtree/magic-design 2.0.85 → 2.0.86

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 (51) hide show
  1. package/es/common/CountDown/index.js +20 -11
  2. package/es/common/CropperModal/index.js +126 -0
  3. package/es/common/CropperModal/index.less +29 -0
  4. package/es/common/LinkModal/AffiliateStore/index.js +332 -0
  5. package/es/common/LinkModal/index.js +6 -0
  6. package/es/common/UrlPicker/index.js +1 -10
  7. package/es/common/index.js +8 -0
  8. package/es/composite-comp/dito/components/CommonFunctions/defaultJSON.js +1 -1
  9. package/es/composite-comp/dito/components/CommonFunctions/mobile/index.js +1 -1
  10. package/es/composite-comp/dito/components/CommonFunctions/mobile/index.less +2 -2
  11. package/es/composite-comp/dito/components/Orders/mobile/index.js +2 -2
  12. package/es/composite-comp/dito/components/Orders/mobile/index.less +1 -6
  13. package/es/composite-comp/dito/components/PersonalInformation/mobile/index.js +114 -7
  14. package/es/composite-comp/dito/components/PersonalInformation/mobile/index.less +6 -2
  15. package/es/composite-comp/dito/second-config-panels/CommonFunctionsSecondConfig/index.js +1 -2
  16. package/es/core/Designer/ToolBarModal/index.js +5 -1
  17. package/es/core/Renderer/index.js +3 -1
  18. package/es/decorator/compositeDecorator.js +9 -5
  19. package/es/locale/en/en.json +1 -1
  20. package/es/locale/es/es.json +2 -2
  21. package/es/locale/id/id.json +1 -1
  22. package/es/meta-comp/config-panels/TextConfig/index.js +1 -1
  23. package/es/utils/commonUtil.js +11 -4
  24. package/es/utils/coreUtil.js +3 -2
  25. package/lib/common/CountDown/index.js +20 -11
  26. package/lib/common/CropperModal/index.js +126 -0
  27. package/lib/common/CropperModal/index.less +29 -0
  28. package/lib/common/LinkModal/AffiliateStore/index.js +332 -0
  29. package/lib/common/LinkModal/index.js +6 -0
  30. package/lib/common/UrlPicker/index.js +1 -10
  31. package/lib/common/index.js +8 -0
  32. package/lib/composite-comp/dito/components/CommonFunctions/defaultJSON.js +1 -1
  33. package/lib/composite-comp/dito/components/CommonFunctions/mobile/index.js +1 -1
  34. package/lib/composite-comp/dito/components/CommonFunctions/mobile/index.less +2 -2
  35. package/lib/composite-comp/dito/components/Orders/mobile/index.js +2 -2
  36. package/lib/composite-comp/dito/components/Orders/mobile/index.less +1 -6
  37. package/lib/composite-comp/dito/components/PersonalInformation/mobile/index.js +114 -7
  38. package/lib/composite-comp/dito/components/PersonalInformation/mobile/index.less +6 -2
  39. package/lib/composite-comp/dito/second-config-panels/CommonFunctionsSecondConfig/index.js +1 -2
  40. package/lib/core/Designer/ToolBarModal/index.js +5 -1
  41. package/lib/core/Renderer/index.js +3 -1
  42. package/lib/decorator/compositeDecorator.js +9 -5
  43. package/lib/locale/en/en.json +1 -1
  44. package/lib/locale/es/es.json +2 -2
  45. package/lib/locale/id/id.json +1 -1
  46. package/lib/meta-comp/config-panels/TextConfig/index.js +1 -1
  47. package/lib/utils/commonUtil.js +11 -4
  48. package/lib/utils/coreUtil.js +3 -2
  49. package/package.json +2 -1
  50. package/es/composite-comp/dito/second-config-panels/CommonFunctionsSecondConfig/index.less +0 -1
  51. package/lib/composite-comp/dito/second-config-panels/CommonFunctionsSecondConfig/index.less +0 -1
@@ -29,6 +29,8 @@ var _index = require("../../../../../constants/index");
29
29
 
30
30
  var _storeUtil = require("../../../../../utils/storeUtil");
31
31
 
32
+ var _common = require("../../../../../common");
33
+
32
34
  require("./index.less");
33
35
 
34
36
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -253,7 +255,10 @@ function (_super) {
253
255
 
254
256
  _this.state = {
255
257
  messageNum: '',
256
- userInfo: currentUser
258
+ userInfo: currentUser,
259
+ loading: false,
260
+ selectedImgFile: {},
261
+ editImgModalVisible: false
257
262
  };
258
263
 
259
264
  _this.getNum = function (v) {
@@ -280,8 +285,12 @@ function (_super) {
280
285
  return;
281
286
  }
282
287
 
283
- setSelectedImgFile(file);
284
- setEditImgModalVisible(true);
288
+ _this.hideBottomBar();
289
+
290
+ _this.setState({
291
+ editImgModalVisible: true,
292
+ selectedImgFile: file
293
+ });
285
294
  }
286
295
 
287
296
  e.target.value = '';
@@ -365,6 +374,91 @@ function (_super) {
365
374
  });
366
375
  };
367
376
 
377
+ _this.modifyPhoto = function (params) {
378
+ return __awaiter(_this, void 0, void 0, function () {
379
+ return __generator(this, function (_a) {
380
+ switch (_a.label) {
381
+ case 0:
382
+ return [4
383
+ /*yield*/
384
+ , (0, _commonUtil.commonFetch)('/designer/v1/h5/users/modify', params, 'POST')];
385
+
386
+ case 1:
387
+ _a.sent();
388
+
389
+ this.showBottomBar();
390
+ this.setState(function (preState, props) {
391
+ return {
392
+ userInfo: __assign(__assign({}, preState.userInfo), {
393
+ photo: params.photo
394
+ }),
395
+ loading: false,
396
+ editImgModalVisible: false
397
+ };
398
+ });
399
+ return [2
400
+ /*return*/
401
+ ];
402
+ }
403
+ });
404
+ });
405
+ };
406
+
407
+ _this.hideBottomBar = function () {
408
+ var homeNavBar = document.querySelector('.home-navigation');
409
+ console.log('homeNavBar', homeNavBar);
410
+ if (homeNavBar) homeNavBar.style.visibility = 'hidden';
411
+ };
412
+
413
+ _this.showBottomBar = function () {
414
+ var homeNavBar = document.querySelector('.home-navigation');
415
+ if (homeNavBar) homeNavBar.style.visibility = 'visible';
416
+ };
417
+
418
+ _this.onUploadImg = function (formData) {
419
+ if (_this.state.loading) return;
420
+
421
+ _this.setState({
422
+ loading: true
423
+ });
424
+
425
+ fetch('/designer/v1/h5/image', {
426
+ method: 'POST',
427
+ body: formData
428
+ }).then(function (response) {
429
+ return response.json();
430
+ }).then(function (responseData) {
431
+ var _a;
432
+
433
+ if (((_a = responseData === null || responseData === void 0 ? void 0 : responseData.fileUrl) === null || _a === void 0 ? void 0 : _a.length) > 120) {
434
+ _antd.message.toast({
435
+ type: 'error',
436
+ message: (0, _locale.i18n)('IMAGE_NAME_IS_TOO_LONG'),
437
+ duration: 3000
438
+ });
439
+
440
+ return;
441
+ }
442
+
443
+ _this.modifyPhoto({
444
+ photo: responseData.fileUrl
445
+ });
446
+ })["catch"](function (err) {
447
+ _antd.message.toast({
448
+ type: 'error',
449
+ message: err === null || err === void 0 ? void 0 : err.data,
450
+ duration: 5000
451
+ });
452
+
453
+ _this.showBottomBar();
454
+
455
+ _this.setState({
456
+ editImgModalVisible: false,
457
+ loading: false
458
+ });
459
+ });
460
+ };
461
+
368
462
  _this.onItemClick = function (v) {
369
463
  var _a;
370
464
 
@@ -392,7 +486,9 @@ function (_super) {
392
486
  var data = this.props.data;
393
487
  var _a = this.state,
394
488
  messageNum = _a.messageNum,
395
- userInfo = _a.userInfo;
489
+ userInfo = _a.userInfo,
490
+ editImgModalVisible = _a.editImgModalVisible,
491
+ selectedImgFile = _a.selectedImgFile;
396
492
  return /*#__PURE__*/_react["default"].createElement("div", {
397
493
  className: (0, _classnames["default"])('personal-information-mobile')
398
494
  }, /*#__PURE__*/_react["default"].createElement("div", {
@@ -412,7 +508,6 @@ function (_super) {
412
508
  }
413
509
  }), /*#__PURE__*/_react["default"].createElement("input", {
414
510
  accept: "image/*",
415
- disabled: !(0, _lodash.isEmpty)(LPObj),
416
511
  id: "userPhoto",
417
512
  onChange: this.handleFileChange,
418
513
  type: "file"
@@ -421,7 +516,9 @@ function (_super) {
421
516
  }, /*#__PURE__*/_react["default"].createElement("p", {
422
517
  className: "name",
423
518
  onClick: this.clickName
424
- }, userInfo.firstName || userInfo.nickName))) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
519
+ }, userInfo.firstName || userInfo.nickName), /*#__PURE__*/_react["default"].createElement("p", {
520
+ className: "phone"
521
+ }, userInfo.mobilePhone))) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
425
522
  className: "photo"
426
523
  }, /*#__PURE__*/_react["default"].createElement(_Iconfont["default"], {
427
524
  color: "#fff",
@@ -467,7 +564,17 @@ function (_super) {
467
564
  item.title.text = text;
468
565
  }
469
566
  }));
470
- })));
567
+ })), editImgModalVisible && /*#__PURE__*/_react["default"].createElement(_common.CropperModal, {
568
+ onClose: function onClose() {
569
+ _this.setState({
570
+ editImgModalVisible: false
571
+ });
572
+
573
+ _this.showBottomBar();
574
+ },
575
+ onSubmit: this.onUploadImg,
576
+ uploadedImageFile: selectedImgFile
577
+ }));
471
578
  };
472
579
 
473
580
  PersonalInfoMobile.defaultProps = {
@@ -1,12 +1,12 @@
1
1
  .personal-information-mobile {
2
- height: 4.6rem;
2
+ height: 3.24rem;
3
3
  padding: 0.32rem;
4
4
  box-sizing: border-box;
5
5
  }
6
6
  .personal-information-mobile .top {
7
7
  display: flex;
8
8
  justify-content: space-between;
9
- align-items: start;
9
+ align-items: flex-start;
10
10
  }
11
11
  .personal-information-mobile .top .pInfoWrap {
12
12
  display: flex;
@@ -16,9 +16,13 @@
16
16
  position: relative;
17
17
  display: inline-block;
18
18
  vertical-align: middle;
19
+ margin-right: 0.3rem;
20
+ height: 0.88rem;
21
+ width: 0.88rem;
19
22
  }
20
23
  .personal-information-mobile .top .pInfoWrap .photoWrap > input {
21
24
  position: absolute;
25
+ z-index: 1;
22
26
  top: 0;
23
27
  left: 0;
24
28
  width: 100%;
@@ -17,8 +17,6 @@ var _coreUtil = require("../../../../utils/coreUtil");
17
17
 
18
18
  var _locale = require("../../../../locale");
19
19
 
20
- require("./index.less");
21
-
22
20
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
23
21
 
24
22
  var __extends = void 0 && (void 0).__extends || function () {
@@ -47,6 +45,7 @@ var __extends = void 0 && (void 0).__extends || function () {
47
45
  };
48
46
  }();
49
47
 
48
+ // import './index.less';
50
49
  var CommonFunctionsSecondConfig =
51
50
  /** @class */
52
51
  function (_super) {
@@ -153,7 +153,11 @@ function (_super) {
153
153
 
154
154
  _this.props.quillRef.format('list', currentListType == 'bullet' ? '' : 'bullet');
155
155
  } else if (type == 'link') {
156
- _this.props.quillRef.format('link', JSON.stringify(value));
156
+ if (window.magicDesign.outputType === 'html') {
157
+ _this.props.quillRef.format('link', value.name);
158
+ } else {
159
+ _this.props.quillRef.format('link', JSON.stringify(value));
160
+ }
157
161
  } else if (type == 'size') {
158
162
  _this.props.quillRef.format('size', value + 'px');
159
163
  } else if (type == 'font') {
@@ -137,7 +137,9 @@ var Renderer = function Renderer(props) {
137
137
  };
138
138
  }
139
139
 
140
- return {};
140
+ return {
141
+ overflow: 'auto'
142
+ };
141
143
  };
142
144
 
143
145
  return /*#__PURE__*/_react["default"].createElement("div", {
@@ -87,7 +87,11 @@ function compositeDecorator(WrappedComponent) {
87
87
  }; // 复合组件点击事件
88
88
 
89
89
  _this.onCompositeCompClick = function (event) {
90
- // 触发左侧楼层的滚动
90
+ if (window.magicDesign.mode === 'renderer') {
91
+ return;
92
+ } // 触发左侧楼层的滚动
93
+
94
+
91
95
  if (document.getElementById("card" + _this.props.nodeData.id)) {
92
96
  document.getElementById("card" + _this.props.nodeData.id).scrollIntoView({
93
97
  behavior: 'smooth'
@@ -115,19 +119,20 @@ function compositeDecorator(WrappedComponent) {
115
119
  device = _b.device,
116
120
  compWidth = _b.compWidth;
117
121
  var zIndex = '0';
122
+ var position = 'relative';
118
123
 
119
124
  if (nodeData.type === 'CAROUSEL' || nodeData.type === 'IMAGE_GALLERY' || nodeData.type === 'ORDERS') {
120
125
  zIndex = '1';
121
126
  } // 解决pc导航hover上去,类目被下面组件遮罩的问题
122
127
 
123
128
 
124
- if (nodeData.type === 'PC_NAVIGATION') {
129
+ if (nodeData.type === 'PC_NAVIGATION' || nodeData.type === 'PERSONAL_INFOMATION') {
125
130
  zIndex = '2';
126
131
  }
127
132
 
128
133
  var wrapStyle = {
129
134
  border: 'none',
130
- position: 'relative',
135
+ position: position,
131
136
  zIndex: zIndex,
132
137
  margin: '0 auto'
133
138
  }; // 复合组件内边距
@@ -205,8 +210,7 @@ function compositeDecorator(WrappedComponent) {
205
210
  };
206
211
 
207
212
  _this.getWrapStyle = function () {
208
- var mode = window.magicDesign.mode; // const { nodeData } = this.props;
209
-
213
+ var mode = window.magicDesign.mode;
210
214
  var style = {
211
215
  position: 'relative',
212
216
  zIndex: '1'
@@ -1,4 +1,5 @@
1
1
  {
2
+ "SUBMIT": "Submit",
2
3
  "CANCELLED": "Cancelled",
3
4
  "DONE": "Done",
4
5
  "TO_RECEIVE": "To Receive",
@@ -128,7 +129,6 @@
128
129
  "MOVE_DOWN": "Move Down",
129
130
  "COPY": "Copy",
130
131
  "DELETE": "Delete",
131
- "DONE": "Done",
132
132
  "ADD_COMPONENT": "Add Component",
133
133
  "ALL": "ALL",
134
134
  "HOT": "Hot",
@@ -1,6 +1,7 @@
1
1
  {
2
+ "SUBMIT": "Submit",
2
3
  "CANCELLED": "Cancelled",
3
- "DONE": "Done",
4
+ "DONE": "Hecho",
4
5
  "TO_RECEIVE": "To Receive",
5
6
  "TO_SHIP": "To ship",
6
7
  "TO_PAY": "To Pay",
@@ -128,7 +129,6 @@
128
129
  "MOVE_DOWN": "Mover hacia abajo",
129
130
  "COPY": "Copiar",
130
131
  "DELETE": "Eliminar",
131
- "DONE": "Hecho",
132
132
  "ADD_COMPONENT": "Agregar Componente",
133
133
  "ALL": "TODO",
134
134
  "HOT": "Caliente",
@@ -1,4 +1,5 @@
1
1
  {
2
+ "SUBMIT": "Submit",
2
3
  "CANCELLED": "Cancelled",
3
4
  "DONE": "Done",
4
5
  "TO_RECEIVE": "To Receive",
@@ -128,7 +129,6 @@
128
129
  "MOVE_DOWN": "Move Down",
129
130
  "COPY": "Copy",
130
131
  "DELETE": "Delete",
131
- "DONE": "Done",
132
132
  "ADD_COMPONENT": "Add Component",
133
133
  "ALL": "ALL",
134
134
  "HOT": "Hot",
@@ -278,7 +278,7 @@ function (_super) {
278
278
  showBgColor: true,
279
279
  showTextAlign: true,
280
280
  value: textData
281
- })), /*#__PURE__*/_react["default"].createElement(_common.Field, {
281
+ })), window.magicDesign.outputType != 'html' && /*#__PURE__*/_react["default"].createElement(_common.Field, {
282
282
  split: true,
283
283
  title: "URL"
284
284
  }, /*#__PURE__*/_react["default"].createElement(_common.UrlPicker, {
@@ -296,7 +296,7 @@ function commonFetch(url, data, method) {
296
296
  });
297
297
  }
298
298
 
299
- var navigateTo = function navigateTo(url) {
299
+ var navigateTo = function navigateTo(url, state) {
300
300
  console.log(url);
301
301
 
302
302
  if (!url) {
@@ -305,13 +305,20 @@ var navigateTo = function navigateTo(url) {
305
305
 
306
306
  var _a = url.split(';'),
307
307
  h5Url = _a[0],
308
- appUrl = _a[1]; // 未配置App路径并且h5绝对路径时直接跳转,其他情况让业务层处理
308
+ appUrl = _a[1];
309
+
310
+ if (appUrl && (0, _androidUtil.browserVersion)().isApp) {
311
+ window.location.href = appUrl;
312
+ } // 未配置App路径并且h5绝对路径时直接跳转,其他情况让业务层处理
309
313
 
310
314
 
311
315
  if (!appUrl && !h5Url.startsWith('/')) {
312
316
  window.location.href = h5Url;
313
317
  } else if (window.magicDesign.history) {
314
- window.magicDesign.history.push(url);
318
+ window.magicDesign.history.push({
319
+ pathname: h5Url,
320
+ state: state
321
+ });
315
322
  } else if (window.magicDesign.navigatePreUrl) {
316
323
  // 预览模式跳转
317
324
  if (h5Url.startsWith('/')) {
@@ -349,7 +356,7 @@ function goLogin(state, replaceFlag) {
349
356
  var signUrl = isFromSf === 'Y' ? '/sign-in-opt' : '/sign-in';
350
357
 
351
358
  if (replaceFlag) {
352
- Fishx.history.replace({
359
+ window.magicDesign.history.replace({
353
360
  pathname: signUrl,
354
361
  state: state
355
362
  });
@@ -341,11 +341,12 @@ var clickUrl = function clickUrl(url) {
341
341
  if ((0, _androidUtil.browserVersion)().isAshitaApp) {
342
342
  (0, _androidUtil.sendToApp)(data);
343
343
  } else if ((0, _androidUtil.browserVersion)().isApp && params.link && params.link.startsWith('http')) {
344
- // 兼容Nuri的 绝对路径跳转
344
+ var urlTemp = "" + params.link + (params.link.includes('?') ? '&' : '?') + "userToken=" + (localStorage.getItem('h5Token') || ''); // 兼容Nuri的 绝对路径跳转
345
+
345
346
  (0, _androidUtil.sendToAndroid)({
346
347
  type: 'jumpBrowser',
347
348
  params: {
348
- url: params.link
349
+ url: urlTemp
349
350
  }
350
351
  });
351
352
  } else {
@@ -57,9 +57,11 @@ function (_super) {
57
57
  hour: '00',
58
58
  min: '00',
59
59
  second: '00',
60
- nowTime: _this.props.now
60
+ nowTime: Number(_this.props.now),
61
+ now: _this.props.now
61
62
  };
62
63
  _this.timer = null;
64
+ _this.preTime = '';
63
65
 
64
66
  _this.componentWillUnmount = function () {
65
67
  _this.clearTimer();
@@ -112,19 +114,26 @@ function (_super) {
112
114
  return _this;
113
115
  }
114
116
 
115
- CountDown.prototype.componentWillReceiveProps = function (nextProps) {
116
- var _this = this;
117
-
118
- if (nextProps.now !== this.props.now) {
119
- this.setState({
117
+ CountDown.getDerivedStateFromProps = function (nextProps, prevState) {
118
+ // 检查是否需要更新sortType
119
+ if (nextProps.now !== prevState.now) {
120
+ return {
121
+ now: nextProps.now,
120
122
  nowTime: nextProps.now
121
- }, function () {
122
- _this.clearTimer();
123
+ };
124
+ }
125
+
126
+ return null;
127
+ };
123
128
 
124
- _this.calcLastTime();
129
+ CountDown.prototype.componentDidUpdate = function () {
130
+ var now = this.state.now;
125
131
 
126
- _this.timer = setInterval(_this.calcLastTime, 1000);
127
- });
132
+ if (this.preTime != now) {
133
+ this.preTime = now;
134
+ this.clearTimer();
135
+ this.calcLastTime();
136
+ this.timer = setInterval(this.calcLastTime, 1000);
128
137
  }
129
138
  };
130
139
 
@@ -0,0 +1,126 @@
1
+ "use strict";
2
+
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports["default"] = void 0;
9
+
10
+ var _react = _interopRequireWildcard(require("react"));
11
+
12
+ var _reactCropper = _interopRequireDefault(require("react-cropper"));
13
+
14
+ require("cropperjs/dist/cropper.css");
15
+
16
+ require("./index.less");
17
+
18
+ var _locale = require("../../locale");
19
+
20
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
21
+
22
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
23
+
24
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
25
+
26
+ var __extends = void 0 && (void 0).__extends || function () {
27
+ var _extendStatics = function extendStatics(d, b) {
28
+ _extendStatics = Object.setPrototypeOf || {
29
+ __proto__: []
30
+ } instanceof Array && function (d, b) {
31
+ d.__proto__ = b;
32
+ } || function (d, b) {
33
+ for (var p in b) {
34
+ if (b.hasOwnProperty(p)) d[p] = b[p];
35
+ }
36
+ };
37
+
38
+ return _extendStatics(d, b);
39
+ };
40
+
41
+ return function (d, b) {
42
+ _extendStatics(d, b);
43
+
44
+ function __() {
45
+ this.constructor = d;
46
+ }
47
+
48
+ d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
49
+ };
50
+ }();
51
+
52
+ var AComponent =
53
+ /** @class */
54
+ function (_super) {
55
+ __extends(AComponent, _super);
56
+
57
+ function AComponent() {
58
+ var _this = _super !== null && _super.apply(this, arguments) || this;
59
+
60
+ _this.state = {
61
+ src: ''
62
+ };
63
+
64
+ _this.onSubmit = function () {
65
+ _this.cropper.getCroppedCanvas().toBlob(function (blob) {
66
+ var fileName = _this.props.uploadedImageFile.name; // Vovi手机没有图片后缀
67
+
68
+ if (fileName && fileName.lastIndexOf('.') === -1) {
69
+ fileName = "file_" + new Date().getTime() + ".jpg";
70
+ }
71
+
72
+ var formData = new FormData();
73
+ formData.append('file', blob, fileName);
74
+
75
+ _this.props.onSubmit(formData);
76
+ });
77
+ };
78
+
79
+ return _this;
80
+ }
81
+
82
+ AComponent.prototype.componentDidMount = function () {
83
+ var _this = this;
84
+
85
+ var fileReader = new FileReader();
86
+
87
+ fileReader.onload = function (e) {
88
+ var dataURL = e.target.result;
89
+
90
+ _this.setState({
91
+ src: dataURL
92
+ });
93
+ };
94
+
95
+ fileReader.readAsDataURL(this.props.uploadedImageFile);
96
+ };
97
+
98
+ AComponent.prototype.render = function () {
99
+ var _this = this;
100
+
101
+ return /*#__PURE__*/_react["default"].createElement("div", {
102
+ className: "cropperModalWrap"
103
+ }, /*#__PURE__*/_react["default"].createElement(_reactCropper["default"], {
104
+ aspectRatio: 1,
105
+ className: "company-logo-cropper",
106
+ guides: false,
107
+ onInitialized: function onInitialized(cop) {
108
+ _this.cropper = cop;
109
+ },
110
+ src: this.state.src,
111
+ viewMode: 1,
112
+ zoomable: false
113
+ }), /*#__PURE__*/_react["default"].createElement("div", {
114
+ className: "btnWrap"
115
+ }, /*#__PURE__*/_react["default"].createElement("span", {
116
+ onClick: this.props.onClose
117
+ }, (0, _locale.i18n)('CANCEL')), /*#__PURE__*/_react["default"].createElement("span", {
118
+ onClick: this.onSubmit
119
+ }, (0, _locale.i18n)('SUBMIT'))));
120
+ };
121
+
122
+ return AComponent;
123
+ }(_react.Component);
124
+
125
+ var _default = AComponent;
126
+ exports["default"] = _default;
@@ -0,0 +1,29 @@
1
+ .cropperModalWrap {
2
+ background: #000;
3
+ position: fixed;
4
+ z-index: 1000;
5
+ top: 0;
6
+ bottom: 0;
7
+ left: 0;
8
+ right: 0;
9
+ display: flex;
10
+ justify-content: center;
11
+ align-items: center;
12
+
13
+ .btnWrap {
14
+ span {
15
+ color: #fff;
16
+ font-size: 18px;
17
+ position: absolute;
18
+ bottom: 10px;
19
+
20
+ &:first-child {
21
+ left: 12px;
22
+ }
23
+
24
+ &:last-child {
25
+ right: 12px;
26
+ }
27
+ }
28
+ }
29
+ }