Browse Source

add:粘贴上传图片;fix:通用表情修改

zhengyingya 5 years ago
parent
commit
083abcbcdf

+ 76
- 56
lib/App.js View File

85
 
85
 
86
     _this.state = {
86
     _this.state = {
87
       loading: {},
87
       loading: {},
88
-
89
       // oss 配置
88
       // oss 配置
90
       oss: {},
89
       oss: {},
91
-
92
       // 评论数据
90
       // 评论数据
93
       list: [],
91
       list: [],
94
       page: 1,
92
       page: 1,
103
       commentId: "",
101
       commentId: "",
104
       userId: "",
102
       userId: "",
105
       content: "",
103
       content: "",
106
-      replyPage: 1
104
+      replyPage: 1,
105
+      emojiList: []
107
     };
106
     };
108
     _this.handleChangeLoading = _this.handleChangeLoading.bind(_this);
107
     _this.handleChangeLoading = _this.handleChangeLoading.bind(_this);
109
     _this.sCreateComment = _this.sCreateComment.bind(_this);
108
     _this.sCreateComment = _this.sCreateComment.bind(_this);
136
     key: "componentDidMount",
135
     key: "componentDidMount",
137
     value: function componentDidMount() {
136
     value: function componentDidMount() {
138
       this.loadLocales();
137
       this.loadLocales();
138
+      this.loadEmoji();
139
     }
139
     }
140
 
140
 
141
     /**
141
     /**
178
         });
178
         });
179
       });
179
       });
180
     }
180
     }
181
+
182
+    /**
183
+     * 加载表情包
184
+     */
185
+
186
+  }, {
187
+    key: "loadEmoji",
188
+    value: function loadEmoji() {
189
+      var _this3 = this;
190
+
191
+      this.axios.get(this.props.emojiAPI + "/emoticons").then(function (response) {
192
+        var emojiMap = {};
193
+        response.data.list.forEach(function (item) {
194
+          emojiMap[item.name] = item.url;
195
+        });
196
+        window.sessionStorage.setItem("emojiMap", JSON.stringify(emojiMap));
197
+        _this3.setState({ emojiList: response.data.list });
198
+      }).catch(this.errorHandler);
199
+    }
181
   }, {
200
   }, {
182
     key: "handleEdit",
201
     key: "handleEdit",
183
     value: function handleEdit(_ref) {
202
     value: function handleEdit(_ref) {
255
   }, {
274
   }, {
256
     key: "sGetComment",
275
     key: "sGetComment",
257
     value: function sGetComment() {
276
     value: function sGetComment() {
258
-      var _this3 = this;
277
+      var _this4 = this;
259
 
278
 
260
       var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
279
       var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
261
           _ref2$page = _ref2.page,
280
           _ref2$page = _ref2.page,
278
 
297
 
279
         if (list) {
298
         if (list) {
280
           var newList = list;
299
           var newList = list;
281
-          var oldList = _this3.state.list;
300
+          var oldList = _this4.state.list;
282
 
301
 
283
           if (pageType === "more") {
302
           if (pageType === "more") {
284
             if (page > 1) {
303
             if (page > 1) {
293
             window.scrollTo(0, 0);
312
             window.scrollTo(0, 0);
294
           }
313
           }
295
 
314
 
296
-          _this3.setState({
315
+          _this4.setState({
297
             list: newList,
316
             list: newList,
298
             page: page,
317
             page: page,
299
             total: total
318
             total: total
300
           });
319
           });
301
-          _this3.props.onCountChange(total);
320
+          _this4.props.onCountChange(total);
302
         } else {
321
         } else {
303
           _message3.default.info(_reactIntlUniversal2.default.get("message.noMoreComment"));
322
           _message3.default.info(_reactIntlUniversal2.default.get("message.noMoreComment"));
304
-          _this3.setState({
323
+          _this4.setState({
305
             isNoMoreComment: true
324
             isNoMoreComment: true
306
           });
325
           });
307
         }
326
         }
308
       }).catch(this.errorHandler).finally(function () {
327
       }).catch(this.errorHandler).finally(function () {
309
-        _this3.handleChangeLoading("sGetComment", false);
328
+        _this4.handleChangeLoading("sGetComment", false);
310
       });
329
       });
311
     }
330
     }
312
 
331
 
317
   }, {
336
   }, {
318
     key: "sGetReply",
337
     key: "sGetReply",
319
     value: function sGetReply() {
338
     value: function sGetReply() {
320
-      var _this4 = this;
339
+      var _this5 = this;
321
 
340
 
322
       var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
341
       var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
323
           commentId = _ref3.commentId,
342
           commentId = _ref3.commentId,
333
         if (!response.data.list) {
352
         if (!response.data.list) {
334
           _message3.default.info(_reactIntlUniversal2.default.get("message.noMoreData"));
353
           _message3.default.info(_reactIntlUniversal2.default.get("message.noMoreData"));
335
         }
354
         }
336
-        var list = _this4.state.list.map(function (item) {
355
+        var list = _this5.state.list.map(function (item) {
337
           if (item.id === commentId) {
356
           if (item.id === commentId) {
338
             if (!item.replies) item.replies = [];
357
             if (!item.replies) item.replies = [];
339
             if (response.data.list) {
358
             if (response.data.list) {
355
           }
374
           }
356
           return item;
375
           return item;
357
         });
376
         });
358
-        _this4.setState({ list: list });
377
+        _this5.setState({ list: list });
359
       }).catch(this.errorHandler).finally(function () {
378
       }).catch(this.errorHandler).finally(function () {
360
-        _this4.handleChangeLoading("sGetReply", false);
379
+        _this5.handleChangeLoading("sGetReply", false);
361
       });
380
       });
362
     }
381
     }
363
 
382
 
369
   }, {
388
   }, {
370
     key: "sCreateComment",
389
     key: "sCreateComment",
371
     value: function sCreateComment() {
390
     value: function sCreateComment() {
372
-      var _this5 = this;
391
+      var _this6 = this;
373
 
392
 
374
       var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
393
       var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
375
           content = _ref4.content;
394
           content = _ref4.content;
394
         },
413
         },
395
         withCredentials: true
414
         withCredentials: true
396
       }).then(function (response) {
415
       }).then(function (response) {
397
-        if (_this5.props.showAlertComment) {
416
+        if (_this6.props.showAlertComment) {
398
           _message3.default.success(_reactIntlUniversal2.default.get("message.success"));
417
           _message3.default.success(_reactIntlUniversal2.default.get("message.success"));
399
         }
418
         }
400
         if ((0, _helper.isFunction)(cb)) cb(response.data);
419
         if ((0, _helper.isFunction)(cb)) cb(response.data);
401
         // 将数据写入到 list 中
420
         // 将数据写入到 list 中
402
         // 临时插入
421
         // 临时插入
403
         // 等到获取数据之后,删除临时数据
422
         // 等到获取数据之后,删除临时数据
404
-        var _state = _this5.state,
423
+        var _state = _this6.state,
405
             list = _state.list,
424
             list = _state.list,
406
             total = _state.total;
425
             total = _state.total;
407
 
426
 
409
           replies: [],
428
           replies: [],
410
           isTemporary: true // 临时的数据
429
           isTemporary: true // 临时的数据
411
         }));
430
         }));
412
-        _this5.setState({ list: list, total: total + 1 });
413
-        _this5.props.onCountChange(total + 1);
431
+        _this6.setState({ list: list, total: total + 1 });
432
+        _this6.props.onCountChange(total + 1);
414
       }).catch(this.errorHandler).finally(function () {
433
       }).catch(this.errorHandler).finally(function () {
415
-        _this5.handleChangeLoading("sCreateComment", false);
434
+        _this6.handleChangeLoading("sCreateComment", false);
416
       });
435
       });
417
     }
436
     }
418
 
437
 
423
   }, {
442
   }, {
424
     key: "sDeleteComment",
443
     key: "sDeleteComment",
425
     value: function sDeleteComment(commentId) {
444
     value: function sDeleteComment(commentId) {
426
-      var _this6 = this;
445
+      var _this7 = this;
427
 
446
 
428
       this.handleChangeLoading("sDeleteComment", true);
447
       this.handleChangeLoading("sDeleteComment", true);
429
       var API = this.props.API;
448
       var API = this.props.API;
432
         method: "delete",
451
         method: "delete",
433
         withCredentials: true
452
         withCredentials: true
434
       }).then(function () {
453
       }).then(function () {
435
-        var _state2 = _this6.state,
454
+        var _state2 = _this7.state,
436
             list = _state2.list,
455
             list = _state2.list,
437
             total = _state2.total;
456
             total = _state2.total;
438
 
457
 
442
         var deletedItem = list.find(function (item) {
461
         var deletedItem = list.find(function (item) {
443
           return item.id === commentId;
462
           return item.id === commentId;
444
         });
463
         });
445
-        _this6.setState({ list: res, total: total - 1 });
446
-        _this6.props.onDelete(_constant.COMMENT_TYPE.COMMENT, deletedItem);
447
-        _this6.props.onCountChange(total - 1);
464
+        _this7.setState({ list: res, total: total - 1 });
465
+        _this7.props.onDelete(_constant.COMMENT_TYPE.COMMENT, deletedItem);
466
+        _this7.props.onCountChange(total - 1);
448
       }).catch(this.errorHandler).finally(function () {
467
       }).catch(this.errorHandler).finally(function () {
449
-        _this6.handleChangeLoading("sDeleteComment", false);
468
+        _this7.handleChangeLoading("sDeleteComment", false);
450
       });
469
       });
451
     }
470
     }
452
     /**
471
     /**
457
   }, {
476
   }, {
458
     key: "sUpdateComment",
477
     key: "sUpdateComment",
459
     value: function sUpdateComment(_ref5) {
478
     value: function sUpdateComment(_ref5) {
460
-      var _this7 = this;
479
+      var _this8 = this;
461
 
480
 
462
       var commentId = _ref5.commentId,
481
       var commentId = _ref5.commentId,
463
           content = _ref5.content;
482
           content = _ref5.content;
472
         },
491
         },
473
         withCredentials: true
492
         withCredentials: true
474
       }).then(function () {
493
       }).then(function () {
475
-        var list = _this7.state.list;
494
+        var list = _this8.state.list;
476
 
495
 
477
         list = list.map(function (it) {
496
         list = list.map(function (it) {
478
           if (it.id === commentId) {
497
           if (it.id === commentId) {
482
           }
501
           }
483
           return it;
502
           return it;
484
         });
503
         });
485
-        _this7.props.onUpdateComment("comment");
486
-        _this7.setState({ list: list });
504
+        _this8.props.onUpdateComment("comment");
505
+        _this8.setState({ list: list });
487
       }).catch(this.errorHandler).finally(function () {
506
       }).catch(this.errorHandler).finally(function () {
488
-        _this7.handleChangeLoading("sUpdateComment", false);
507
+        _this8.handleChangeLoading("sUpdateComment", false);
489
       });
508
       });
490
     }
509
     }
491
     /**
510
     /**
497
   }, {
516
   }, {
498
     key: "sCreateReply",
517
     key: "sCreateReply",
499
     value: function sCreateReply(data, cb) {
518
     value: function sCreateReply(data, cb) {
500
-      var _this8 = this;
519
+      var _this9 = this;
501
 
520
 
502
       if (!data.content) return this.error(_reactIntlUniversal2.default.get("message.replyNoNull"));
521
       if (!data.content) return this.error(_reactIntlUniversal2.default.get("message.replyNoNull"));
503
       this.handleChangeLoading("sCreateReply", true);
522
       this.handleChangeLoading("sCreateReply", true);
508
         data: data,
527
         data: data,
509
         withCredentials: true
528
         withCredentials: true
510
       }).then(function (response) {
529
       }).then(function (response) {
511
-        if (_this8.props.showAlertReply) {
530
+        if (_this9.props.showAlertReply) {
512
           _message3.default.success(_reactIntlUniversal2.default.get("message.replySuccess"));
531
           _message3.default.success(_reactIntlUniversal2.default.get("message.replySuccess"));
513
         }
532
         }
514
         if ((0, _helper.isFunction)(cb)) cb(response.data);
533
         if ((0, _helper.isFunction)(cb)) cb(response.data);
515
         // 将数据写入到 list 中
534
         // 将数据写入到 list 中
516
         // 临时插入
535
         // 临时插入
517
         // 等到获取数据之后,删除临时数据
536
         // 等到获取数据之后,删除临时数据
518
-        var list = _this8.state.list.map(function (item) {
537
+        var list = _this9.state.list.map(function (item) {
519
           if (item.id === data.comment_id) {
538
           if (item.id === data.comment_id) {
520
             if (!item.replies) item.replies = [];
539
             if (!item.replies) item.replies = [];
521
             item.replies.push(_extends({}, response.data, {
540
             item.replies.push(_extends({}, response.data, {
525
           }
544
           }
526
           return item;
545
           return item;
527
         });
546
         });
528
-        _this8.setState({ list: list });
547
+        _this9.setState({ list: list });
529
       }).catch(this.errorHandler).finally(function () {
548
       }).catch(this.errorHandler).finally(function () {
530
-        _this8.handleChangeLoading("sCreateReply", false);
549
+        _this9.handleChangeLoading("sCreateReply", false);
531
       });
550
       });
532
     }
551
     }
533
 
552
 
540
   }, {
559
   }, {
541
     key: "sDeleteReply",
560
     key: "sDeleteReply",
542
     value: function sDeleteReply(replyId, commentId) {
561
     value: function sDeleteReply(replyId, commentId) {
543
-      var _this9 = this;
562
+      var _this10 = this;
544
 
563
 
545
       this.handleChangeLoading("sDeleteReply", true);
564
       this.handleChangeLoading("sDeleteReply", true);
546
       var API = this.props.API;
565
       var API = this.props.API;
550
         withCredentials: true
569
         withCredentials: true
551
       }).then(function () {
570
       }).then(function () {
552
         var deletedItem = null;
571
         var deletedItem = null;
553
-        var list = _this9.state.list.map(function (item) {
572
+        var list = _this10.state.list.map(function (item) {
554
           if (item.id === commentId) {
573
           if (item.id === commentId) {
555
             var replies = item.replies.filter(function (item) {
574
             var replies = item.replies.filter(function (item) {
556
               return item.id !== replyId;
575
               return item.id !== replyId;
563
           }
582
           }
564
           return item;
583
           return item;
565
         });
584
         });
566
-        _this9.setState({ list: list });
567
-        _this9.props.onDelete(_constant.COMMENT_TYPE.REPLY, deletedItem);
585
+        _this10.setState({ list: list });
586
+        _this10.props.onDelete(_constant.COMMENT_TYPE.REPLY, deletedItem);
568
       }).catch(this.errorHandler).finally(function () {
587
       }).catch(this.errorHandler).finally(function () {
569
-        _this9.handleChangeLoading("sDeleteReply", false);
588
+        _this10.handleChangeLoading("sDeleteReply", false);
570
       });
589
       });
571
     }
590
     }
572
     /**
591
     /**
578
   }, {
597
   }, {
579
     key: "sUpdateReply",
598
     key: "sUpdateReply",
580
     value: function sUpdateReply(_ref6) {
599
     value: function sUpdateReply(_ref6) {
581
-      var _this10 = this;
600
+      var _this11 = this;
582
 
601
 
583
       var commentId = _ref6.commentId,
602
       var commentId = _ref6.commentId,
584
           content = _ref6.content,
603
           content = _ref6.content,
597
         withCredentials: true
616
         withCredentials: true
598
       }).then(function () {
617
       }).then(function () {
599
         for (var i = 1; i <= replyPage; i++) {
618
         for (var i = 1; i <= replyPage; i++) {
600
-          _this10.sGetReply({ commentId: commentId, page: i });
619
+          _this11.sGetReply({ commentId: commentId, page: i });
601
         }
620
         }
602
-        _this10.props.onUpdateComment("reply");
621
+        _this11.props.onUpdateComment("reply");
603
       }).catch(this.errorHandler).finally(function () {
622
       }).catch(this.errorHandler).finally(function () {
604
-        _this10.handleChangeLoading("sUpdateReply", false);
623
+        _this11.handleChangeLoading("sUpdateReply", false);
605
       });
624
       });
606
     }
625
     }
607
     /**
626
     /**
613
   }, {
632
   }, {
614
     key: "sCommentFavor",
633
     key: "sCommentFavor",
615
     value: function sCommentFavor(commentId, favored) {
634
     value: function sCommentFavor(commentId, favored) {
616
-      var _this11 = this;
635
+      var _this12 = this;
617
 
636
 
618
       this.handleChangeLoading("sCommentFavor", true);
637
       this.handleChangeLoading("sCommentFavor", true);
619
       var API = this.props.API;
638
       var API = this.props.API;
622
         method: favored ? "delete" : "put",
641
         method: favored ? "delete" : "put",
623
         withCredentials: true
642
         withCredentials: true
624
       }).then(function (response) {
643
       }).then(function (response) {
625
-        if (_this11.props.showAlertFavor) {
644
+        if (_this12.props.showAlertFavor) {
626
           _message3.default.success(favored ? _reactIntlUniversal2.default.get("message.cancelLickSuccess") : _reactIntlUniversal2.default.get("message.likeSuccess"));
645
           _message3.default.success(favored ? _reactIntlUniversal2.default.get("message.cancelLickSuccess") : _reactIntlUniversal2.default.get("message.likeSuccess"));
627
         }
646
         }
628
         // 更新 list 中的该项数据的 favored
647
         // 更新 list 中的该项数据的 favored
629
-        var list = _this11.state.list.map(function (item) {
648
+        var list = _this12.state.list.map(function (item) {
630
           if (item.id === commentId) {
649
           if (item.id === commentId) {
631
             item.favored = !favored;
650
             item.favored = !favored;
632
             item.favor_count += favored ? -1 : 1;
651
             item.favor_count += favored ? -1 : 1;
633
           }
652
           }
634
           return item;
653
           return item;
635
         });
654
         });
636
-        _this11.setState({ list: list });
655
+        _this12.setState({ list: list });
637
       }).catch(this.errorHandler).finally(function () {
656
       }).catch(this.errorHandler).finally(function () {
638
-        _this11.handleChangeLoading("sCommentFavor", false);
657
+        _this12.handleChangeLoading("sCommentFavor", false);
639
       });
658
       });
640
     }
659
     }
641
 
660
 
649
   }, {
668
   }, {
650
     key: "sReplyFavor",
669
     key: "sReplyFavor",
651
     value: function sReplyFavor(replyId, commentId, favored) {
670
     value: function sReplyFavor(replyId, commentId, favored) {
652
-      var _this12 = this;
671
+      var _this13 = this;
653
 
672
 
654
       this.handleChangeLoading("sReplyFavor", true);
673
       this.handleChangeLoading("sReplyFavor", true);
655
       var API = this.props.API;
674
       var API = this.props.API;
663
       }).then(function (response) {
682
       }).then(function (response) {
664
         _message3.default.success(favored ? _reactIntlUniversal2.default.get("message.cancelLickSuccess") : _reactIntlUniversal2.default.get("message.likeSuccess"));
683
         _message3.default.success(favored ? _reactIntlUniversal2.default.get("message.cancelLickSuccess") : _reactIntlUniversal2.default.get("message.likeSuccess"));
665
         // 更新 list 中的该项数据的 favored
684
         // 更新 list 中的该项数据的 favored
666
-        var list = _this12.state.list.map(function (item) {
685
+        var list = _this13.state.list.map(function (item) {
667
           if (item.id === commentId) {
686
           if (item.id === commentId) {
668
             item.replies = item.replies.map(function (r) {
687
             item.replies = item.replies.map(function (r) {
669
               if (r.id === replyId) {
688
               if (r.id === replyId) {
678
           }
697
           }
679
           return item;
698
           return item;
680
         });
699
         });
681
-        _this12.setState({ list: list });
700
+        _this13.setState({ list: list });
682
       }).catch(this.errorHandler).finally(function () {
701
       }).catch(this.errorHandler).finally(function () {
683
-        _this12.handleChangeLoading("sReplyFavor", false);
702
+        _this13.handleChangeLoading("sReplyFavor", false);
684
       });
703
       });
685
     }
704
     }
686
 
705
 
691
   }, {
710
   }, {
692
     key: "sOssSts",
711
     key: "sOssSts",
693
     value: function sOssSts() {
712
     value: function sOssSts() {
694
-      var _this13 = this;
713
+      var _this14 = this;
695
 
714
 
696
       this.handleChangeLoading("sOssSts", true);
715
       this.handleChangeLoading("sOssSts", true);
697
       var API = this.props.API;
716
       var API = this.props.API;
698
 
717
 
699
       this.axios.get(API + "/oss/sts").then(function (response) {
718
       this.axios.get(API + "/oss/sts").then(function (response) {
700
-        _this13.setState({ oss: _extends({}, response.data) });
719
+        _this14.setState({ oss: _extends({}, response.data) });
701
       }).catch(this.errorHandler).finally(function () {
720
       }).catch(this.errorHandler).finally(function () {
702
-        _this13.handleChangeLoading("sOssSts", false);
721
+        _this14.handleChangeLoading("sOssSts", false);
703
       });
722
       });
704
     }
723
     }
705
   }, {
724
   }, {
777
 App.defaultProps = {
796
 App.defaultProps = {
778
   businessUserId: 0,
797
   businessUserId: 0,
779
   API: "//api.links123.net/comment/v1",
798
   API: "//api.links123.net/comment/v1",
799
+  emojiAPI: "//api.links123.net/link/v1",
780
   showList: true,
800
   showList: true,
781
   showEditor: true,
801
   showEditor: true,
782
   showAlertComment: false,
802
   showAlertComment: false,

+ 1
- 1
lib/App.js.map
File diff suppressed because it is too large
View File


+ 3
- 1
lib/components/ContentItem/index.js View File

396
                 },
396
                 },
397
                 style: { color: "" + IconColor }
397
                 style: { color: "" + IconColor }
398
               },
398
               },
399
-              _react2.default.createElement("i", { className: content.favored ? "comment-item-like" : "comment-item-unlike" })
399
+              _react2.default.createElement("i", {
400
+                className: content.favored ? "comment-item-like" : "comment-item-unlike"
401
+              })
400
             ),
402
             ),
401
             _react2.default.createElement(
403
             _react2.default.createElement(
402
               "span",
404
               "span",

+ 1
- 1
lib/components/ContentItem/index.js.map
File diff suppressed because it is too large
View File


+ 0
- 4
lib/components/EditComment/EditComment.js View File

22
 
22
 
23
 var _react2 = _interopRequireDefault(_react);
23
 var _react2 = _interopRequireDefault(_react);
24
 
24
 
25
-var _propTypes = require("prop-types");
26
-
27
-var _propTypes2 = _interopRequireDefault(_propTypes);
28
-
29
 var _reactIntlUniversal = require("react-intl-universal");
25
 var _reactIntlUniversal = require("react-intl-universal");
30
 
26
 
31
 var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
27
 var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);

+ 1
- 1
lib/components/EditComment/EditComment.js.map
File diff suppressed because it is too large
View File


+ 24
- 20
lib/components/Editor/Emoji.js View File

16
 
16
 
17
 var _react2 = _interopRequireDefault(_react);
17
 var _react2 = _interopRequireDefault(_react);
18
 
18
 
19
-var _emoji = require("../../emoji");
20
-
21
-var _emoji2 = _interopRequireDefault(_emoji);
22
-
23
 require("./Emoji.css");
19
 require("./Emoji.css");
24
 
20
 
25
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
21
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
29
 function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
25
 function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
30
 
26
 
31
 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
27
 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
28
+// import emoji, { prefixUrl } from "../../emoji";
29
+
32
 
30
 
33
 // 每页 20  5*4
31
 // 每页 20  5*4
34
 // 共 20 * 3 = 60 (实际是 54)
32
 // 共 20 * 3 = 60 (实际是 54)
63
     value: function render() {
61
     value: function render() {
64
       var _this2 = this;
62
       var _this2 = this;
65
 
63
 
66
-      var _onClick = this.props.onClick;
64
+      var _props = this.props,
65
+          _onClick = _props.onClick,
66
+          emojiList = _props.emojiList;
67
 
67
 
68
       var content = [];
68
       var content = [];
69
-      var curPage = [];
70
-      for (var i = 0; i < 115; i++) {
71
-        if (curPage.length < 30) {
72
-          curPage.push(_emoji2.default[i]);
73
-        } else {
74
-          content.push(curPage);
75
-          curPage = [];
76
-        }
77
-      }
78
-      if (curPage.length > 0) {
79
-        content.push(curPage);
69
+      // let curPage = [];
70
+      // for (let i = 0; i < 115; i++) {
71
+      //   if (curPage.length < 30) {
72
+      //     curPage.push(emoji[i]);
73
+      //   } else {
74
+      //     content.push(curPage);
75
+      //     curPage = [];
76
+      //   }
77
+      // }
78
+      // if (curPage.length > 0) {
79
+      //   content.push(curPage);
80
+      // }
81
+      for (var i = 0; i < emojiList.length; i += 30) {
82
+        content.push(emojiList.slice(i, i + 30));
80
       }
83
       }
84
+
81
       return _react2.default.createElement(
85
       return _react2.default.createElement(
82
         _carousel2.default,
86
         _carousel2.default,
83
         {
87
         {
92
             page.map(function (item, index) {
96
             page.map(function (item, index) {
93
               return _react2.default.createElement(
97
               return _react2.default.createElement(
94
                 "div",
98
                 "div",
95
-                { className: "item", key: item.value },
99
+                { className: "item", key: item.id },
96
                 _react2.default.createElement("span", { className: "helper" }),
100
                 _react2.default.createElement("span", { className: "helper" }),
97
                 _react2.default.createElement("img", {
101
                 _react2.default.createElement("img", {
98
-                  src: "" + _emoji.prefixUrl + item.value + "." + item.ext,
99
-                  alt: item.title,
102
+                  src: item.url,
103
+                  alt: item.name,
100
                   style: { display: "inline-block" },
104
                   style: { display: "inline-block" },
101
                   onClick: function onClick() {
105
                   onClick: function onClick() {
102
-                    return _onClick(item.title);
106
+                    return _onClick(item.name);
103
                   }
107
                   }
104
                 })
108
                 })
105
               );
109
               );

+ 1
- 1
lib/components/Editor/Emoji.js.map View File

1
-{"version":3,"sources":["../../../src/components/Editor/Emoji.js"],"names":["Emoji","carousel","next","prev","onClick","props","content","curPage","i","length","push","emoji","node","map","page","index","item","value","prefixUrl","ext","title","display","React","Component"],"mappings":";;;;;;;;;;;;;;AAAA;;;;AAEA;;;;AACA;;;;;;;;;;AACA;AACA;;AAEA;;IAEMA,K;;;;;;;;;;;2BACG;AACL,UAAI,KAAKC,QAAT,EAAmB;AACjB,aAAKA,QAAL,CAAcC,IAAd;AACD;AACF;;;2BAEM;AACL,UAAI,KAAKD,QAAT,EAAmB;AACjB,aAAKA,QAAL,CAAcE,IAAd;AACD;AACF;;;6BAEQ;AAAA;;AAAA,UACCC,QADD,GACa,KAAKC,KADlB,CACCD,OADD;;AAEP,UAAME,UAAU,EAAhB;AACA,UAAIC,UAAU,EAAd;AACA,WAAK,IAAIC,IAAI,CAAb,EAAgBA,IAAI,GAApB,EAAyBA,GAAzB,EAA8B;AAC5B,YAAID,QAAQE,MAAR,GAAiB,EAArB,EAAyB;AACvBF,kBAAQG,IAAR,CAAaC,gBAAMH,CAAN,CAAb;AACD,SAFD,MAEO;AACLF,kBAAQI,IAAR,CAAaH,OAAb;AACAA,oBAAU,EAAV;AACD;AACF;AACD,UAAIA,QAAQE,MAAR,GAAiB,CAArB,EAAwB;AACtBH,gBAAQI,IAAR,CAAaH,OAAb;AACD;AACD,aACE;AAAA;AAAA;AACE,eAAK,mBAAQ;AACX,mBAAKN,QAAL,GAAgBW,IAAhB;AACD;AAHH;AAKGN,gBAAQO,GAAR,CAAY,UAACC,IAAD,EAAOC,KAAP;AAAA,iBACX;AAAA;AAAA,cAAK,KAAKA,KAAV,EAAiB,WAAU,OAA3B;AACGD,iBAAKD,GAAL,CAAS,UAACG,IAAD,EAAOD,KAAP;AAAA,qBACR;AAAA;AAAA,kBAAK,WAAU,MAAf,EAAsB,KAAKC,KAAKC,KAAhC;AACE,wDAAM,WAAU,QAAhB,GADF;AAEE;AACE,4BAAQC,gBAAR,GAAoBF,KAAKC,KAAzB,SAAkCD,KAAKG,GADzC;AAEE,uBAAKH,KAAKI,KAFZ;AAGE,yBAAO,EAAEC,SAAS,cAAX,EAHT;AAIE,2BAAS;AAAA,2BAAMjB,SAAQY,KAAKI,KAAb,CAAN;AAAA;AAJX;AAFF,eADQ;AAAA,aAAT;AADH,WADW;AAAA,SAAZ;AALH,OADF;AAuBD;;;;EAnDiBE,gBAAMC,S;;kBAsDXvB,K","file":"Emoji.js","sourcesContent":["import React from \"react\";\nimport { Carousel } from \"antd\";\nimport emoji, { prefixUrl } from \"../../emoji\";\nimport \"./Emoji.css\";\n// 每页 20  5*4\n// 共 20 * 3 = 60 (实际是 54)\n\n// class Emoji\n\nclass Emoji extends React.Component {\n  next() {\n    if (this.carousel) {\n      this.carousel.next();\n    }\n  }\n\n  prev() {\n    if (this.carousel) {\n      this.carousel.prev();\n    }\n  }\n\n  render() {\n    const { onClick } = this.props;\n    const content = [];\n    let curPage = [];\n    for (let i = 0; i < 115; i++) {\n      if (curPage.length < 30) {\n        curPage.push(emoji[i]);\n      } else {\n        content.push(curPage);\n        curPage = [];\n      }\n    }\n    if (curPage.length > 0) {\n      content.push(curPage);\n    }\n    return (\n      <Carousel\n        ref={node => {\n          this.carousel = node;\n        }}\n      >\n        {content.map((page, index) => (\n          <div key={index} className=\"emoji\">\n            {page.map((item, index) => (\n              <div className=\"item\" key={item.value}>\n                <span className=\"helper\" />\n                <img\n                  src={`${prefixUrl}${item.value}.${item.ext}`}\n                  alt={item.title}\n                  style={{ display: \"inline-block\" }}\n                  onClick={() => onClick(item.title)}\n                />\n              </div>\n            ))}\n          </div>\n        ))}\n      </Carousel>\n    );\n  }\n}\n\nexport default Emoji;\n"]}
1
+{"version":3,"sources":["../../../src/components/Editor/Emoji.js"],"names":["Emoji","carousel","next","prev","props","onClick","emojiList","content","i","length","push","slice","node","map","page","index","item","id","url","name","display","React","Component"],"mappings":";;;;;;;;;;;;;;AAAA;;;;AAGA;;;;;;;;;AADA;;;AAEA;AACA;;AAEA;;IAEMA,K;;;;;;;;;;;2BACG;AACL,UAAI,KAAKC,QAAT,EAAmB;AACjB,aAAKA,QAAL,CAAcC,IAAd;AACD;AACF;;;2BAEM;AACL,UAAI,KAAKD,QAAT,EAAmB;AACjB,aAAKA,QAAL,CAAcE,IAAd;AACD;AACF;;;6BAEQ;AAAA;;AAAA,mBACwB,KAAKC,KAD7B;AAAA,UACCC,QADD,UACCA,OADD;AAAA,UACUC,SADV,UACUA,SADV;;AAEP,UAAMC,UAAU,EAAhB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,WAAK,IAAIC,IAAI,CAAb,EAAgBA,IAAIF,UAAUG,MAA9B,EAAsCD,KAAK,EAA3C,EAA+C;AAC7CD,gBAAQG,IAAR,CAAaJ,UAAUK,KAAV,CAAgBH,CAAhB,EAAmBA,IAAI,EAAvB,CAAb;AACD;;AAED,aACE;AAAA;AAAA;AACE,eAAK,mBAAQ;AACX,mBAAKP,QAAL,GAAgBW,IAAhB;AACD;AAHH;AAKGL,gBAAQM,GAAR,CAAY,UAACC,IAAD,EAAOC,KAAP;AAAA,iBACX;AAAA;AAAA,cAAK,KAAKA,KAAV,EAAiB,WAAU,OAA3B;AACGD,iBAAKD,GAAL,CAAS,UAACG,IAAD,EAAOD,KAAP;AAAA,qBACR;AAAA;AAAA,kBAAK,WAAU,MAAf,EAAsB,KAAKC,KAAKC,EAAhC;AACE,wDAAM,WAAU,QAAhB,GADF;AAEE;AACE,uBAAKD,KAAKE,GADZ;AAEE,uBAAKF,KAAKG,IAFZ;AAGE,yBAAO,EAAEC,SAAS,cAAX,EAHT;AAIE,2BAAS;AAAA,2BAAMf,SAAQW,KAAKG,IAAb,CAAN;AAAA;AAJX;AAFF,eADQ;AAAA,aAAT;AADH,WADW;AAAA,SAAZ;AALH,OADF;AAuBD;;;;EAvDiBE,gBAAMC,S;;kBA0DXtB,K","file":"Emoji.js","sourcesContent":["import React from \"react\";\nimport { Carousel } from \"antd\";\n// import emoji, { prefixUrl } from \"../../emoji\";\nimport \"./Emoji.css\";\n// 每页 20  5*4\n// 共 20 * 3 = 60 (实际是 54)\n\n// class Emoji\n\nclass Emoji extends React.Component {\n  next() {\n    if (this.carousel) {\n      this.carousel.next();\n    }\n  }\n\n  prev() {\n    if (this.carousel) {\n      this.carousel.prev();\n    }\n  }\n\n  render() {\n    const { onClick, emojiList } = this.props;\n    const content = [];\n    // let curPage = [];\n    // for (let i = 0; i < 115; i++) {\n    //   if (curPage.length < 30) {\n    //     curPage.push(emoji[i]);\n    //   } else {\n    //     content.push(curPage);\n    //     curPage = [];\n    //   }\n    // }\n    // if (curPage.length > 0) {\n    //   content.push(curPage);\n    // }\n    for (let i = 0; i < emojiList.length; i += 30) {\n      content.push(emojiList.slice(i, i + 30));\n    }\n\n    return (\n      <Carousel\n        ref={node => {\n          this.carousel = node;\n        }}\n      >\n        {content.map((page, index) => (\n          <div key={index} className=\"emoji\">\n            {page.map((item, index) => (\n              <div className=\"item\" key={item.id}>\n                <span className=\"helper\" />\n                <img\n                  src={item.url}\n                  alt={item.name}\n                  style={{ display: \"inline-block\" }}\n                  onClick={() => onClick(item.name)}\n                />\n              </div>\n            ))}\n          </div>\n        ))}\n      </Carousel>\n    );\n  }\n}\n\nexport default Emoji;\n"]}

+ 5
- 1
lib/components/Editor/Upload.js View File

119
     key: "componentDidMount",
119
     key: "componentDidMount",
120
     value: function componentDidMount() {
120
     value: function componentDidMount() {
121
       this.props.app.sOssSts();
121
       this.props.app.sOssSts();
122
+      if (this.props.onRef) {
123
+        this.props.onRef(this);
124
+      }
122
     }
125
     }
123
   }, {
126
   }, {
124
     key: "onImgLoad",
127
     key: "onImgLoad",
154
 
157
 
155
       var file = info.file;
158
       var file = info.file;
156
 
159
 
160
+      console.log(file);
157
       info.onProgress({ percent: 10 });
161
       info.onProgress({ percent: 10 });
158
       var reader = new FileReader();
162
       var reader = new FileReader();
159
       reader.readAsDataURL(info.file);
163
       reader.readAsDataURL(info.file);
162
         // DRIVER_LICENSE_PATH oss 的存储路径位置
166
         // DRIVER_LICENSE_PATH oss 的存储路径位置
163
         UploadToOss(_this2.props.app.oss, _constant.DRIVER_LICENSE_PATH, file).then(function (data) {
167
         UploadToOss(_this2.props.app.oss, _constant.DRIVER_LICENSE_PATH, file).then(function (data) {
164
           info.onProgress({ percent: 100 });
168
           info.onProgress({ percent: 100 });
165
-          info.onSuccess();
169
+          info.onSuccess(data);
166
           _this2.props.onUpload({ path: data.name, uid: file.uid });
170
           _this2.props.onUpload({ path: data.name, uid: file.uid });
167
         }).catch(function (e) {
171
         }).catch(function (e) {
168
           var msg = e.message || _constant.ERROR_DEFAULT;
172
           var msg = e.message || _constant.ERROR_DEFAULT;

+ 1
- 1
lib/components/Editor/Upload.js.map
File diff suppressed because it is too large
View File


+ 171
- 50
lib/components/Editor/index.js View File

52
 
52
 
53
 var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
53
 var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
54
 
54
 
55
+var _dayjs = require("dayjs");
56
+
57
+var _dayjs2 = _interopRequireDefault(_dayjs);
58
+
59
+var _shortid = require("shortid");
60
+
61
+var _shortid2 = _interopRequireDefault(_shortid);
62
+
55
 var _constant = require("../../constant");
63
 var _constant = require("../../constant");
56
 
64
 
57
 var _helper = require("../../helper");
65
 var _helper = require("../../helper");
64
 
72
 
65
 var _Emoji2 = _interopRequireDefault(_Emoji);
73
 var _Emoji2 = _interopRequireDefault(_Emoji);
66
 
74
 
75
+var _Comment = require("../../Comment");
76
+
77
+var _Comment2 = _interopRequireDefault(_Comment);
78
+
67
 require("./index.css");
79
 require("./index.css");
68
 
80
 
69
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
81
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
76
 
88
 
77
 var TextArea = _input2.default.TextArea;
89
 var TextArea = _input2.default.TextArea;
78
 
90
 
91
+
92
+var client = function client(oss) {
93
+  return new window.OSS.Wrapper({
94
+    accessKeyId: oss.access_key_id,
95
+    accessKeySecret: oss.access_key_secret,
96
+    stsToken: oss.security_token,
97
+    endpoint: _constant.OSS_ENDPOINT, //常量,你可以自己定义
98
+    bucket: _constant.OSS_BUCKET
99
+  });
100
+};
101
+
102
+var uploadPath = function uploadPath(path, file) {
103
+  return path + "/" + (0, _dayjs2.default)().format("YYYYMMDD") + "/" + _shortid2.default.generate() + "." + file.type.split("/")[1];
104
+};
105
+
106
+var UploadToOss = function UploadToOss(oss, path, file) {
107
+  var url = uploadPath(path, file);
108
+  return new Promise(function (resolve, reject) {
109
+    client(oss).multipartUpload(url, file).then(function (data) {
110
+      resolve(data);
111
+    }).catch(function (error) {
112
+      reject(error);
113
+    });
114
+  });
115
+};
116
+
79
 var Editor = function (_React$Component) {
117
 var Editor = function (_React$Component) {
80
   _inherits(Editor, _React$Component);
118
   _inherits(Editor, _React$Component);
81
 
119
 
86
 
124
 
87
     _this.state = {
125
     _this.state = {
88
       showUpload: false,
126
       showUpload: false,
89
-      value: props.value, // 编辑器里面的值
90
-
91
-      fileList: props.fileList, // 图片列表
92
-      fileMap: {} // 已经上传的图片路径和 uid 的映射 { uid: path }
127
+      value: props.value || "", // 编辑器里面的值
128
+      fileList: props.fileList || [], // 图片列表
129
+      fileMap: {}, // 已经上传的图片路径和 uid 的映射 { uid: path }
130
+      uploadVisible: false
93
     };
131
     };
94
     _this.handleChange = _this.handleChange.bind(_this);
132
     _this.handleChange = _this.handleChange.bind(_this);
95
     _this.handleClickEmoji = _this.handleClickEmoji.bind(_this);
133
     _this.handleClickEmoji = _this.handleClickEmoji.bind(_this);
97
     _this.handleShowUpload = _this.handleShowUpload.bind(_this);
135
     _this.handleShowUpload = _this.handleShowUpload.bind(_this);
98
     _this.handleUpload = _this.handleUpload.bind(_this);
136
     _this.handleUpload = _this.handleUpload.bind(_this);
99
     _this.handleSubmit = _this.handleSubmit.bind(_this);
137
     _this.handleSubmit = _this.handleSubmit.bind(_this);
138
+    _this.handlePaste = _this.handlePaste.bind(_this);
100
     _this.resetState = _this.resetState.bind(_this);
139
     _this.resetState = _this.resetState.bind(_this);
101
     _this.handleEmojiScroll = _this.handleEmojiScroll.bind(_this);
140
     _this.handleEmojiScroll = _this.handleEmojiScroll.bind(_this);
102
     return _this;
141
     return _this;
105
   _createClass(Editor, [{
144
   _createClass(Editor, [{
106
     key: "componentDidMount",
145
     key: "componentDidMount",
107
     value: function componentDidMount() {
146
     value: function componentDidMount() {
147
+      this.props.app.sOssSts();
108
       if ((0, _helper.isFunction)(this.props.onRef)) {
148
       if ((0, _helper.isFunction)(this.props.onRef)) {
109
         this.props.onRef(this);
149
         this.props.onRef(this);
110
       }
150
       }
209
       this.setState({ fileMap: fileMap, fileList: fileList });
249
       this.setState({ fileMap: fileMap, fileList: fileList });
210
     }
250
     }
211
 
251
 
252
+    /**
253
+     * 粘贴回调
254
+     */
255
+
256
+  }, {
257
+    key: "handlePaste",
258
+    value: function handlePaste(e) {
259
+      var _this2 = this;
260
+
261
+      if (this.state.fileList.length >= this.props.maxUpload) {
262
+        return;
263
+      }
264
+      var items = e.clipboardData && e.clipboardData.items;
265
+      var file = null;
266
+      if (items && items.length) {
267
+        for (var i = 0; i < items.length; i++) {
268
+          if (items[i].type.indexOf("image") !== -1) {
269
+            file = items[i].getAsFile();
270
+            break;
271
+          }
272
+        }
273
+      }
274
+      this.setState({
275
+        uploadVisible: true
276
+      });
277
+      var reader = new FileReader();
278
+      reader.readAsDataURL(file);
279
+      reader.onloadend = function () {
280
+        // DRIVER_LICENSE_PATH oss 的存储路径位置
281
+        UploadToOss(_this2.props.app.oss, _constant.DRIVER_LICENSE_PATH, file).then(function (data) {
282
+          var fileList = _this2.state.fileList.concat({
283
+            url: _constant.OSS_LINK + data.name,
284
+            thumbUrl: _constant.OSS_LINK + data.name,
285
+            type: file.type,
286
+            uid: new Date().valueOf()
287
+          });
288
+          _this2.props.handleChangeFileList(fileList);
289
+          _this2.setState({
290
+            fileList: fileList
291
+          });
292
+        }).catch(function (e) {
293
+          var msg = e.message || _constant.ERROR_DEFAULT;
294
+          if (_this2.props.showError) {
295
+            _message3.default.error(msg);
296
+          }
297
+          if (_this2.props.onError) {
298
+            _this2.props.onError(msg, { response: e.response });
299
+          }
300
+        });
301
+      };
302
+    }
303
+
212
     /**
304
     /**
213
      * 提交编辑器内容
305
      * 提交编辑器内容
214
      * 提交功能,交给父组件来实现
306
      * 提交功能,交给父组件来实现
218
   }, {
310
   }, {
219
     key: "handleSubmit",
311
     key: "handleSubmit",
220
     value: function handleSubmit() {
312
     value: function handleSubmit() {
221
-      var _this2 = this;
313
+      var _this3 = this;
222
 
314
 
223
       var maxLength = this.props.maxLength;
315
       var maxLength = this.props.maxLength;
224
       var _state = this.state,
316
       var _state = this.state,
247
       if (this.props.beforeSubmit) {
339
       if (this.props.beforeSubmit) {
248
         Promise.resolve(this.props.beforeSubmit({ text: value, files: files })).then(function (res) {
340
         Promise.resolve(this.props.beforeSubmit({ text: value, files: files })).then(function (res) {
249
           if (!(res === false)) {
341
           if (!(res === false)) {
250
-            _this2.props.onSubmit({ text: value, files: files }, function (res, action) {
251
-              _this2.resetState();
252
-              if (action === "comment" && _this2.props.onCommentSuccess) {
253
-                _this2.props.onCommentSuccess(res);
342
+            _this3.props.onSubmit({ text: value, files: files }, function (res, action) {
343
+              _this3.resetState();
344
+              if (action === "comment" && _this3.props.onCommentSuccess) {
345
+                _this3.props.onCommentSuccess(res);
254
               }
346
               }
255
             });
347
             });
256
           }
348
           }
257
         });
349
         });
258
       } else {
350
       } else {
259
         this.props.onSubmit({ text: value, files: files }, function (res, action) {
351
         this.props.onSubmit({ text: value, files: files }, function (res, action) {
260
-          _this2.resetState();
261
-          if (action === "comment" && _this2.props.onCommentSuccess) {
262
-            _this2.props.onCommentSuccess(res);
352
+          _this3.resetState();
353
+          if (action === "comment" && _this3.props.onCommentSuccess) {
354
+            _this3.props.onCommentSuccess(res);
263
           }
355
           }
264
         });
356
         });
265
       }
357
       }
268
     key: "resetState",
360
     key: "resetState",
269
     value: function resetState() {
361
     value: function resetState() {
270
       this.handleChange("");
362
       this.handleChange("");
363
+      this.handleChangeFileList([]);
271
       this.setState({
364
       this.setState({
272
         showUpload: false,
365
         showUpload: false,
273
         value: "",
366
         value: "",
276
       });
369
       });
277
     }
370
     }
278
   }, {
371
   }, {
279
-    key: "render",
280
-    value: function render() {
281
-      var _this3 = this;
282
-
372
+    key: "checkDisabledSubmit",
373
+    value: function checkDisabledSubmit() {
283
       var _props = this.props,
374
       var _props = this.props,
284
-          value = _props.value,
285
-          rows = _props.rows,
286
-          showEmoji = _props.showEmoji,
287
-          showUpload = _props.showUpload,
288
-          multiple = _props.multiple,
289
-          emojiPopoverPlacement = _props.emojiPopoverPlacement,
290
-          uploadPopoverPlacement = _props.uploadPopoverPlacement,
291
-          uploadOverlayClassName = _props.uploadOverlayClassName,
292
-          fileList = _props.fileList,
293
-          closeUploadWhenBlur = _props.closeUploadWhenBlur,
294
-          maxUpload = _props.maxUpload,
295
-          btnLoading = _props.btnLoading,
296
           btnDisabled = _props.btnDisabled,
375
           btnDisabled = _props.btnDisabled,
297
-          button = _props.button,
298
-          emojiToolIcon = _props.emojiToolIcon,
299
-          imageToolIcon = _props.imageToolIcon,
300
-          maxLength = _props.maxLength,
301
-          autoFocus = _props.autoFocus;
376
+          value = _props.value,
377
+          fileList = _props.fileList;
378
+
379
+      if (btnDisabled) {
380
+        return true;
381
+      }
382
+      if (value && value !== "") {
383
+        return false;
384
+      }
385
+      if (this.state.value && this.state.value !== "") {
386
+        return false;
387
+      }
388
+      if (fileList && fileList.length > 0) {
389
+        return false;
390
+      }
391
+      if (this.state.fileList.length > 0) {
392
+        return false;
393
+      }
394
+      return true;
395
+    }
396
+  }, {
397
+    key: "render",
398
+    value: function render() {
399
+      var _this4 = this;
400
+
401
+      var _props2 = this.props,
402
+          value = _props2.value,
403
+          rows = _props2.rows,
404
+          showEmoji = _props2.showEmoji,
405
+          showUpload = _props2.showUpload,
406
+          multiple = _props2.multiple,
407
+          emojiPopoverPlacement = _props2.emojiPopoverPlacement,
408
+          uploadPopoverPlacement = _props2.uploadPopoverPlacement,
409
+          uploadOverlayClassName = _props2.uploadOverlayClassName,
410
+          fileList = _props2.fileList,
411
+          maxUpload = _props2.maxUpload,
412
+          btnLoading = _props2.btnLoading,
413
+          button = _props2.button,
414
+          emojiToolIcon = _props2.emojiToolIcon,
415
+          imageToolIcon = _props2.imageToolIcon,
416
+          maxLength = _props2.maxLength,
417
+          autoFocus = _props2.autoFocus;
302
 
418
 
303
       var placeholder = this.props.placeholder || _reactIntlUniversal2.default.get("editor.placeholder");
419
       var placeholder = this.props.placeholder || _reactIntlUniversal2.default.get("editor.placeholder");
304
       var btnSubmitText = this.props.btnSubmitText || _reactIntlUniversal2.default.get("editor.SubmitBtn");
420
       var btnSubmitText = this.props.btnSubmitText || _reactIntlUniversal2.default.get("editor.SubmitBtn");
305
       var handleSubmit = this.handleSubmit;
421
       var handleSubmit = this.handleSubmit;
306
-      var disabledSubmit = btnDisabled || !this.props.value && !this.state.value && !this.props.fileList.length && !this.state.fileList.length;
422
+      var disabledSubmit = this.checkDisabledSubmit();
307
       var inputValue = value || this.state.value;
423
       var inputValue = value || this.state.value;
308
       var uploadFileList = fileList || this.state.fileList;
424
       var uploadFileList = fileList || this.state.fileList;
309
       return _react2.default.createElement(
425
       return _react2.default.createElement(
310
         "div",
426
         "div",
311
-        { className: "comment-editor-container" },
427
+        { className: "comment-editor-container", onPaste: this.handlePaste },
312
         _react2.default.createElement("div", {
428
         _react2.default.createElement("div", {
313
           className: (0, _classnames2.default)({
429
           className: (0, _classnames2.default)({
314
             "comment-editor-toolbar": true,
430
             "comment-editor-toolbar": true,
321
           _react2.default.createElement(TextArea, {
437
           _react2.default.createElement(TextArea, {
322
             value: inputValue,
438
             value: inputValue,
323
             onChange: function onChange(e) {
439
             onChange: function onChange(e) {
324
-              return _this3.handleChange(e.target.value);
440
+              return _this4.handleChange(e.target.value);
325
             },
441
             },
326
             rows: rows,
442
             rows: rows,
327
             placeholder: placeholder,
443
             placeholder: placeholder,
349
                     _react2.default.createElement(_Emoji2.default, {
465
                     _react2.default.createElement(_Emoji2.default, {
350
                       onClick: this.handleClickEmoji,
466
                       onClick: this.handleClickEmoji,
351
                       ref: function ref(node) {
467
                       ref: function ref(node) {
352
-                        _this3.emoji = node;
353
-                      }
468
+                        _this4.emoji = node;
469
+                      },
470
+                      emojiList: this.props.app.emojiList
354
                     })
471
                     })
355
                   ),
472
                   ),
356
                   overlayClassName: "comment-emoji-popover"
473
                   overlayClassName: "comment-emoji-popover"
362
                 {
479
                 {
363
                   trigger: "click"
480
                   trigger: "click"
364
                   // TODO: 针对非 react.js,直接使用 click 事件来控制展开或关闭
481
                   // TODO: 针对非 react.js,直接使用 click 事件来控制展开或关闭
365
-                  // visible={this.state.showUpload}
366
-                  , placement: uploadPopoverPlacement,
482
+                  , visible: this.state.uploadVisible,
483
+                  placement: uploadPopoverPlacement,
367
                   overlayClassName: uploadOverlayClassName,
484
                   overlayClassName: uploadOverlayClassName,
368
                   autoAdjustOverflow: false,
485
                   autoAdjustOverflow: false,
369
                   overlayStyle: { zIndex: 9999 },
486
                   overlayStyle: { zIndex: 9999 },
370
-                  onVisibleChange: closeUploadWhenBlur ? function (visible) {
371
-                    _this3.handleShowUpload(visible);
372
-                  } : null,
487
+                  onVisibleChange: function onVisibleChange(visible) {
488
+                    _this4.setState({
489
+                      uploadVisible: visible
490
+                    });
491
+                  },
373
                   content: _react2.default.createElement(
492
                   content: _react2.default.createElement(
374
                     "div",
493
                     "div",
375
                     {
494
                     {
380
                       }
499
                       }
381
                     },
500
                     },
382
                     _react2.default.createElement(_Upload2.default, {
501
                     _react2.default.createElement(_Upload2.default, {
502
+                      onRef: function onRef(node) {
503
+                        return _this4.uploadRef = node;
504
+                      },
383
                       multiple: multiple,
505
                       multiple: multiple,
384
                       onChangeFileList: this.handleChangeFileList,
506
                       onChangeFileList: this.handleChangeFileList,
385
                       onUpload: this.handleUpload,
507
                       onUpload: this.handleUpload,
409
                 },
531
                 },
410
                 imageToolIcon ? _react2.default.cloneElement(imageToolIcon, {
532
                 imageToolIcon ? _react2.default.cloneElement(imageToolIcon, {
411
                   onClick: function onClick() {
533
                   onClick: function onClick() {
412
-                    return _this3.handleShowUpload(true);
534
+                    return _this4.handleShowUpload(true);
413
                   }
535
                   }
414
                 }) : _react2.default.createElement(_icon2.default, {
536
                 }) : _react2.default.createElement(_icon2.default, {
415
                   type: "picture",
537
                   type: "picture",
416
                   className: "comment-toolbar-icon",
538
                   className: "comment-toolbar-icon",
417
                   style: { marginLeft: 20 },
539
                   style: { marginLeft: 20 },
418
                   onClick: function onClick() {
540
                   onClick: function onClick() {
419
-                    return _this3.handleShowUpload(true);
541
+                    return _this4.handleShowUpload(true);
420
                   }
542
                   }
421
                 })
543
                 })
422
               ) : null
544
               ) : null
430
                 _button2.default,
552
                 _button2.default,
431
                 {
553
                 {
432
                   onClick: function onClick() {
554
                   onClick: function onClick() {
433
-                    return _this3.handleSubmit();
555
+                    return _this4.handleSubmit();
434
                   },
556
                   },
435
                   type: "primary",
557
                   type: "primary",
436
                   loading: btnLoading,
558
                   loading: btnLoading,
485
   uploadPopoverPlacement: "bottomLeft",
607
   uploadPopoverPlacement: "bottomLeft",
486
   uploadOverlayClassName: "",
608
   uploadOverlayClassName: "",
487
   maxUpload: 1,
609
   maxUpload: 1,
488
-  value: "",
489
-  fileList: [],
490
   // btnSubmitText: "发表",
610
   // btnSubmitText: "发表",
491
   btnLoading: false,
611
   btnLoading: false,
492
   btnDisabled: false,
612
   btnDisabled: false,
493
   showError: true,
613
   showError: true,
494
-  maxLength: 5000
614
+  maxLength: 5000,
615
+  handleChangeFileList: function handleChangeFileList() {}
495
 };
616
 };
496
 
617
 
497
-exports.default = Editor;
618
+exports.default = (0, _Comment2.default)(Editor);
498
 //# sourceMappingURL=index.js.map
619
 //# sourceMappingURL=index.js.map

+ 1
- 1
lib/components/Editor/index.js.map
File diff suppressed because it is too large
View File


+ 6
- 8
lib/helper.js View File

12
 
12
 
13
 var _constant = require("./constant");
13
 var _constant = require("./constant");
14
 
14
 
15
-var _emoji = require("./emoji");
15
+// import emoji, { prefixUrl } from "./emoji";
16
 
16
 
17
-var _emoji2 = _interopRequireDefault(_emoji);
18
-
19
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
20
-
21
-var emojiObejct = arrayToObject(_emoji2.default, "title");
17
+// const emojiObejct = arrayToObject(emoji, "title");
22
 
18
 
23
 function isFunction(functionToCheck) {
19
 function isFunction(functionToCheck) {
24
   return functionToCheck && {}.toString.call(functionToCheck) === "[object Function]";
20
   return functionToCheck && {}.toString.call(functionToCheck) === "[object Function]";
78
       return "<a href=\"" + src + "\" rel=\"noopener noreferrer\" target=\"_blank\"><img class=\"comment-img\" src=\"" + src + "\" alt=\"" + src + "\" /></a>";
74
       return "<a href=\"" + src + "\" rel=\"noopener noreferrer\" target=\"_blank\"><img class=\"comment-img\" src=\"" + src + "\" alt=\"" + src + "\" /></a>";
79
     }
75
     }
80
     // 如果不存在对应的表情, 则返回原文
76
     // 如果不存在对应的表情, 则返回原文
81
-    var emoji = emojiObejct[src];
77
+    // const emoji = emojiObejct[src];
78
+    console.log(src);
79
+    var emoji = JSON.parse(sessionStorage.getItem("emojiMap"))[src];
82
     if (emoji) {
80
     if (emoji) {
83
-      return "<img class=\"comment-emoji\" src=\"" + _emoji.prefixUrl + emoji.value + "." + emoji.ext + "\" alt=\"" + emoji.title + "\" />";
81
+      return "<img class=\"comment-emoji\" src=\"" + emoji + "\" alt=\"" + emoji.title + "\" />";
84
     }
82
     }
85
     return "[" + src + "]";
83
     return "[" + src + "]";
86
   }).replace(innerUrl, function (a, b) {
84
   }).replace(innerUrl, function (a, b) {

+ 1
- 1
lib/helper.js.map
File diff suppressed because it is too large
View File


+ 3
- 3
lib/index.js View File

73
             });
73
             });
74
           },
74
           },
75
           handleChangeFileList: function handleChangeFileList(fileList) {
75
           handleChangeFileList: function handleChangeFileList(fileList) {
76
-            console.log(fileList);
76
+            console.log("----", fileList);
77
             _this2.setState({
77
             _this2.setState({
78
               fileList: fileList
78
               fileList: fileList
79
             });
79
             });
126
     type: 1,
126
     type: 1,
127
     businessId: "test",
127
     businessId: "test",
128
     businessUserId: 4,
128
     businessUserId: 4,
129
-    userId: 71748,
129
+    userId: 58297,
130
     currentUser: {
130
     currentUser: {
131
-      user_id: 71748
131
+      user_id: 58297
132
     },
132
     },
133
     userAvaHoverData: {
133
     userAvaHoverData: {
134
       71763: {
134
       71763: {

+ 1
- 1
lib/index.js.map
File diff suppressed because it is too large
View File


+ 3
- 3
lib/version.json View File

1
 {
1
 {
2
     "name":       "comment",
2
     "name":       "comment",
3
-    "buildDate":  1564281547826,
3
+    "buildDate":  1564888264706,
4
     "version":    "1.0.4",
4
     "version":    "1.0.4",
5
-    "numCommits": 174,
6
-    "hash":       "5200566",
5
+    "numCommits": 178,
6
+    "hash":       "088923c",
7
     "dirty":      false
7
     "dirty":      false
8
 }
8
 }

+ 22
- 4
src/App.js View File

1
 import React, { Component } from "react";
1
 import React, { Component } from "react";
2
 import PropTypes from "prop-types";
2
 import PropTypes from "prop-types";
3
-import { message, Modal, Icon } from "antd";
3
+import { message } from "antd";
4
 import axios from "axios";
4
 import axios from "axios";
5
 import Cookies from "js-cookie";
5
 import Cookies from "js-cookie";
6
 import intl from "react-intl-universal";
6
 import intl from "react-intl-universal";
20
     super(props);
20
     super(props);
21
     this.state = {
21
     this.state = {
22
       loading: {},
22
       loading: {},
23
-
24
       // oss 配置
23
       // oss 配置
25
       oss: {},
24
       oss: {},
26
-
27
       // 评论数据
25
       // 评论数据
28
       list: [],
26
       list: [],
29
       page: 1,
27
       page: 1,
38
       commentId: "",
36
       commentId: "",
39
       userId: "",
37
       userId: "",
40
       content: "",
38
       content: "",
41
-      replyPage: 1
39
+      replyPage: 1,
40
+      emojiList: []
42
     };
41
     };
43
     this.handleChangeLoading = this.handleChangeLoading.bind(this);
42
     this.handleChangeLoading = this.handleChangeLoading.bind(this);
44
     this.sCreateComment = this.sCreateComment.bind(this);
43
     this.sCreateComment = this.sCreateComment.bind(this);
69
 
68
 
70
   componentDidMount() {
69
   componentDidMount() {
71
     this.loadLocales();
70
     this.loadLocales();
71
+    this.loadEmoji();
72
   }
72
   }
73
 
73
 
74
   /**
74
   /**
114
       });
114
       });
115
   }
115
   }
116
 
116
 
117
+  /**
118
+   * 加载表情包
119
+   */
120
+  loadEmoji() {
121
+    this.axios
122
+      .get(`${this.props.emojiAPI}/emoticons`)
123
+      .then(response => {
124
+        const emojiMap = {};
125
+        response.data.list.forEach(item => {
126
+          emojiMap[item.name] = item.url;
127
+        });
128
+        window.sessionStorage.setItem("emojiMap", JSON.stringify(emojiMap));
129
+        this.setState({ emojiList: response.data.list });
130
+      })
131
+      .catch(this.errorHandler);
132
+  }
133
+
117
   handleEdit({ replyId, commentId, userId, content, replyPage }) {
134
   handleEdit({ replyId, commentId, userId, content, replyPage }) {
118
     this.setState({
135
     this.setState({
119
       editModalVisible: true,
136
       editModalVisible: true,
629
 App.defaultProps = {
646
 App.defaultProps = {
630
   businessUserId: 0,
647
   businessUserId: 0,
631
   API: "//api.links123.net/comment/v1",
648
   API: "//api.links123.net/comment/v1",
649
+  emojiAPI: "//api.links123.net/link/v1",
632
   showList: true,
650
   showList: true,
633
   showEditor: true,
651
   showEditor: true,
634
   showAlertComment: false,
652
   showAlertComment: false,

+ 0
- 1
src/components/EditComment/EditComment.js View File

1
 import React from "react";
1
 import React from "react";
2
-import PropTypes from "prop-types";
3
 import { Modal, Icon } from "antd";
2
 import { Modal, Icon } from "antd";
4
 import intl from "react-intl-universal";
3
 import intl from "react-intl-universal";
5
 import CommentInput from "../CommentInput";
4
 import CommentInput from "../CommentInput";

+ 21
- 17
src/components/Editor/Emoji.js View File

1
 import React from "react";
1
 import React from "react";
2
 import { Carousel } from "antd";
2
 import { Carousel } from "antd";
3
-import emoji, { prefixUrl } from "../../emoji";
3
+// import emoji, { prefixUrl } from "../../emoji";
4
 import "./Emoji.css";
4
 import "./Emoji.css";
5
 // 每页 20  5*4
5
 // 每页 20  5*4
6
 // 共 20 * 3 = 60 (实际是 54)
6
 // 共 20 * 3 = 60 (实际是 54)
21
   }
21
   }
22
 
22
 
23
   render() {
23
   render() {
24
-    const { onClick } = this.props;
24
+    const { onClick, emojiList } = this.props;
25
     const content = [];
25
     const content = [];
26
-    let curPage = [];
27
-    for (let i = 0; i < 115; i++) {
28
-      if (curPage.length < 30) {
29
-        curPage.push(emoji[i]);
30
-      } else {
31
-        content.push(curPage);
32
-        curPage = [];
33
-      }
34
-    }
35
-    if (curPage.length > 0) {
36
-      content.push(curPage);
26
+    // let curPage = [];
27
+    // for (let i = 0; i < 115; i++) {
28
+    //   if (curPage.length < 30) {
29
+    //     curPage.push(emoji[i]);
30
+    //   } else {
31
+    //     content.push(curPage);
32
+    //     curPage = [];
33
+    //   }
34
+    // }
35
+    // if (curPage.length > 0) {
36
+    //   content.push(curPage);
37
+    // }
38
+    for (let i = 0; i < emojiList.length; i += 30) {
39
+      content.push(emojiList.slice(i, i + 30));
37
     }
40
     }
41
+
38
     return (
42
     return (
39
       <Carousel
43
       <Carousel
40
         ref={node => {
44
         ref={node => {
44
         {content.map((page, index) => (
48
         {content.map((page, index) => (
45
           <div key={index} className="emoji">
49
           <div key={index} className="emoji">
46
             {page.map((item, index) => (
50
             {page.map((item, index) => (
47
-              <div className="item" key={item.value}>
51
+              <div className="item" key={item.id}>
48
                 <span className="helper" />
52
                 <span className="helper" />
49
                 <img
53
                 <img
50
-                  src={`${prefixUrl}${item.value}.${item.ext}`}
51
-                  alt={item.title}
54
+                  src={item.url}
55
+                  alt={item.name}
52
                   style={{ display: "inline-block" }}
56
                   style={{ display: "inline-block" }}
53
-                  onClick={() => onClick(item.title)}
57
+                  onClick={() => onClick(item.name)}
54
                 />
58
                 />
55
               </div>
59
               </div>
56
             ))}
60
             ))}

+ 5
- 1
src/components/Editor/Upload.js View File

60
 
60
 
61
   componentDidMount() {
61
   componentDidMount() {
62
     this.props.app.sOssSts();
62
     this.props.app.sOssSts();
63
+    if (this.props.onRef) {
64
+      this.props.onRef(this);
65
+    }
63
   }
66
   }
64
 
67
 
65
   onImgLoad() {
68
   onImgLoad() {
85
 
88
 
86
   customRequest(info) {
89
   customRequest(info) {
87
     const { file } = info;
90
     const { file } = info;
91
+    console.log(file);
88
     info.onProgress({ percent: 10 });
92
     info.onProgress({ percent: 10 });
89
     let reader = new FileReader();
93
     let reader = new FileReader();
90
     reader.readAsDataURL(info.file);
94
     reader.readAsDataURL(info.file);
94
       UploadToOss(this.props.app.oss, DRIVER_LICENSE_PATH, file)
98
       UploadToOss(this.props.app.oss, DRIVER_LICENSE_PATH, file)
95
         .then(data => {
99
         .then(data => {
96
           info.onProgress({ percent: 100 });
100
           info.onProgress({ percent: 100 });
97
-          info.onSuccess();
101
+          info.onSuccess(data);
98
           this.props.onUpload({ path: data.name, uid: file.uid });
102
           this.props.onUpload({ path: data.name, uid: file.uid });
99
         })
103
         })
100
         .catch(e => {
104
         .catch(e => {

+ 129
- 41
src/components/Editor/index.js View File

3
 import { Icon, Button, Popover, Input, message } from "antd";
3
 import { Icon, Button, Popover, Input, message } from "antd";
4
 import classnames from "classnames";
4
 import classnames from "classnames";
5
 import intl from "react-intl-universal";
5
 import intl from "react-intl-universal";
6
+import dayjs from "dayjs";
7
+import shortid from "shortid";
6
 import { OSS_LINK } from "../../constant";
8
 import { OSS_LINK } from "../../constant";
7
 import { isFunction } from "../../helper";
9
 import { isFunction } from "../../helper";
8
 import Upload from "./Upload";
10
 import Upload from "./Upload";
9
 import Emoji from "./Emoji";
11
 import Emoji from "./Emoji";
12
+import Comment from "../../Comment";
13
+import {
14
+  OSS_ENDPOINT,
15
+  OSS_BUCKET,
16
+  DRIVER_LICENSE_PATH,
17
+  ERROR_DEFAULT
18
+} from "../../constant";
10
 import "./index.css";
19
 import "./index.css";
11
 
20
 
12
 const { TextArea } = Input;
21
 const { TextArea } = Input;
13
 
22
 
23
+const client = oss => {
24
+  return new window.OSS.Wrapper({
25
+    accessKeyId: oss.access_key_id,
26
+    accessKeySecret: oss.access_key_secret,
27
+    stsToken: oss.security_token,
28
+    endpoint: OSS_ENDPOINT, //常量,你可以自己定义
29
+    bucket: OSS_BUCKET
30
+  });
31
+};
32
+
33
+const uploadPath = (path, file) => {
34
+  return `${path}/${dayjs().format("YYYYMMDD")}/${shortid.generate()}.${
35
+    file.type.split("/")[1]
36
+  }`;
37
+};
38
+
39
+const UploadToOss = (oss, path, file) => {
40
+  const url = uploadPath(path, file);
41
+  return new Promise((resolve, reject) => {
42
+    client(oss)
43
+      .multipartUpload(url, file)
44
+      .then(data => {
45
+        resolve(data);
46
+      })
47
+      .catch(error => {
48
+        reject(error);
49
+      });
50
+  });
51
+};
52
+
14
 class Editor extends React.Component {
53
 class Editor extends React.Component {
15
   constructor(props) {
54
   constructor(props) {
16
     super(props);
55
     super(props);
17
     this.state = {
56
     this.state = {
18
       showUpload: false,
57
       showUpload: false,
19
-      value: props.value, // 编辑器里面的值
20
-
21
-      fileList: props.fileList, // 图片列表
22
-      fileMap: {} // 已经上传的图片路径和 uid 的映射 { uid: path }
58
+      value: props.value || "", // 编辑器里面的值
59
+      fileList: props.fileList || [], // 图片列表
60
+      fileMap: {}, // 已经上传的图片路径和 uid 的映射 { uid: path }
61
+      uploadVisible: false
23
     };
62
     };
24
     this.handleChange = this.handleChange.bind(this);
63
     this.handleChange = this.handleChange.bind(this);
25
     this.handleClickEmoji = this.handleClickEmoji.bind(this);
64
     this.handleClickEmoji = this.handleClickEmoji.bind(this);
27
     this.handleShowUpload = this.handleShowUpload.bind(this);
66
     this.handleShowUpload = this.handleShowUpload.bind(this);
28
     this.handleUpload = this.handleUpload.bind(this);
67
     this.handleUpload = this.handleUpload.bind(this);
29
     this.handleSubmit = this.handleSubmit.bind(this);
68
     this.handleSubmit = this.handleSubmit.bind(this);
69
+    this.handlePaste = this.handlePaste.bind(this);
30
     this.resetState = this.resetState.bind(this);
70
     this.resetState = this.resetState.bind(this);
31
     this.handleEmojiScroll = this.handleEmojiScroll.bind(this);
71
     this.handleEmojiScroll = this.handleEmojiScroll.bind(this);
32
   }
72
   }
33
 
73
 
34
   componentDidMount() {
74
   componentDidMount() {
75
+    this.props.app.sOssSts();
35
     if (isFunction(this.props.onRef)) {
76
     if (isFunction(this.props.onRef)) {
36
       this.props.onRef(this);
77
       this.props.onRef(this);
37
     }
78
     }
117
     this.setState({ fileMap, fileList });
158
     this.setState({ fileMap, fileList });
118
   }
159
   }
119
 
160
 
161
+  /**
162
+   * 粘贴回调
163
+   */
164
+  handlePaste(e) {
165
+    if (this.state.fileList.length >= this.props.maxUpload) {
166
+      return;
167
+    }
168
+    const items = e.clipboardData && e.clipboardData.items;
169
+    let file = null;
170
+    if (items && items.length) {
171
+      for (let i = 0; i < items.length; i++) {
172
+        if (items[i].type.indexOf("image") !== -1) {
173
+          file = items[i].getAsFile();
174
+          break;
175
+        }
176
+      }
177
+    }
178
+    this.setState({
179
+      uploadVisible: true
180
+    });
181
+    let reader = new FileReader();
182
+    reader.readAsDataURL(file);
183
+    reader.onloadend = () => {
184
+      // DRIVER_LICENSE_PATH oss 的存储路径位置
185
+      UploadToOss(this.props.app.oss, DRIVER_LICENSE_PATH, file)
186
+        .then(data => {
187
+          const fileList = this.state.fileList.concat({
188
+            url: OSS_LINK + data.name,
189
+            thumbUrl: OSS_LINK + data.name,
190
+            type: file.type,
191
+            uid: new Date().valueOf()
192
+          });
193
+          this.props.handleChangeFileList(fileList);
194
+          this.setState({
195
+            fileList
196
+          });
197
+        })
198
+        .catch(e => {
199
+          const msg = e.message || ERROR_DEFAULT;
200
+          if (this.props.showError) {
201
+            message.error(msg);
202
+          }
203
+          if (this.props.onError) {
204
+            this.props.onError(msg, { response: e.response });
205
+          }
206
+        });
207
+    };
208
+  }
209
+
120
   /**
210
   /**
121
    * 提交编辑器内容
211
    * 提交编辑器内容
122
    * 提交功能,交给父组件来实现
212
    * 提交功能,交给父组件来实现
168
 
258
 
169
   resetState() {
259
   resetState() {
170
     this.handleChange("");
260
     this.handleChange("");
261
+    this.handleChangeFileList([]);
171
     this.setState({
262
     this.setState({
172
       showUpload: false,
263
       showUpload: false,
173
       value: "",
264
       value: "",
176
     });
267
     });
177
   }
268
   }
178
 
269
 
270
+  checkDisabledSubmit() {
271
+    const { btnDisabled, value, fileList } = this.props;
272
+    if (btnDisabled) {
273
+      return true;
274
+    }
275
+    if (value && value !== "") {
276
+      return false;
277
+    }
278
+    if (this.state.value && this.state.value !== "") {
279
+      return false;
280
+    }
281
+    if (fileList && fileList.length > 0) {
282
+      return false;
283
+    }
284
+    if (this.state.fileList.length > 0) {
285
+      return false;
286
+    }
287
+    return true;
288
+  }
289
+
179
   render() {
290
   render() {
180
     const {
291
     const {
181
       value,
292
       value,
188
       uploadPopoverPlacement,
299
       uploadPopoverPlacement,
189
       uploadOverlayClassName,
300
       uploadOverlayClassName,
190
       fileList,
301
       fileList,
191
-      closeUploadWhenBlur,
192
       maxUpload,
302
       maxUpload,
193
       // btnSubmitText,
303
       // btnSubmitText,
194
       btnLoading,
304
       btnLoading,
195
-      btnDisabled,
196
       button,
305
       button,
197
       emojiToolIcon,
306
       emojiToolIcon,
198
       imageToolIcon,
307
       imageToolIcon,
203
     let btnSubmitText =
312
     let btnSubmitText =
204
       this.props.btnSubmitText || intl.get("editor.SubmitBtn");
313
       this.props.btnSubmitText || intl.get("editor.SubmitBtn");
205
     const handleSubmit = this.handleSubmit;
314
     const handleSubmit = this.handleSubmit;
206
-    const disabledSubmit =
207
-      btnDisabled ||
208
-      (!this.props.value &&
209
-        !this.state.value &&
210
-        !this.props.fileList.length &&
211
-        !this.state.fileList.length);
315
+    const disabledSubmit = this.checkDisabledSubmit();
212
     const inputValue = value || this.state.value;
316
     const inputValue = value || this.state.value;
213
     const uploadFileList = fileList || this.state.fileList;
317
     const uploadFileList = fileList || this.state.fileList;
214
     return (
318
     return (
215
-      <div className="comment-editor-container">
319
+      <div className="comment-editor-container" onPaste={this.handlePaste}>
216
         <div
320
         <div
217
           className={classnames({
321
           className={classnames({
218
             "comment-editor-toolbar": true,
322
             "comment-editor-toolbar": true,
219
             "comment-editor-toolbar-error": inputValue.length > maxLength
323
             "comment-editor-toolbar-error": inputValue.length > maxLength
220
           })}
324
           })}
221
-        >
222
-          {/* {intl.get("editor.alreadyEntered", {
223
-            count: inputValue.length,
224
-            maxLength
225
-          })} */}
226
-        </div>
325
+        ></div>
227
         <div className="comment-editor">
326
         <div className="comment-editor">
228
           <TextArea
327
           <TextArea
229
             value={inputValue}
328
             value={inputValue}
251
                         ref={node => {
350
                         ref={node => {
252
                           this.emoji = node;
351
                           this.emoji = node;
253
                         }}
352
                         }}
353
+                        emojiList={this.props.app.emojiList}
254
                       />
354
                       />
255
                     </div>
355
                     </div>
256
                   }
356
                   }
266
                 <Popover
366
                 <Popover
267
                   trigger="click"
367
                   trigger="click"
268
                   // TODO: 针对非 react.js,直接使用 click 事件来控制展开或关闭
368
                   // TODO: 针对非 react.js,直接使用 click 事件来控制展开或关闭
269
-                  // visible={this.state.showUpload}
369
+                  visible={this.state.uploadVisible}
270
                   placement={uploadPopoverPlacement}
370
                   placement={uploadPopoverPlacement}
271
                   overlayClassName={uploadOverlayClassName}
371
                   overlayClassName={uploadOverlayClassName}
272
                   autoAdjustOverflow={false}
372
                   autoAdjustOverflow={false}
273
                   overlayStyle={{ zIndex: 9999 }}
373
                   overlayStyle={{ zIndex: 9999 }}
274
-                  onVisibleChange={
275
-                    closeUploadWhenBlur
276
-                      ? visible => {
277
-                          this.handleShowUpload(visible);
278
-                        }
279
-                      : null
280
-                  }
374
+                  onVisibleChange={visible => {
375
+                    this.setState({
376
+                      uploadVisible: visible
377
+                    });
378
+                  }}
281
                   content={
379
                   content={
282
                     <div
380
                     <div
283
                       style={{
381
                       style={{
287
                       }}
385
                       }}
288
                     >
386
                     >
289
                       <Upload
387
                       <Upload
388
+                        onRef={node => (this.uploadRef = node)}
290
                         multiple={multiple}
389
                         multiple={multiple}
291
                         onChangeFileList={this.handleChangeFileList}
390
                         onChangeFileList={this.handleChangeFileList}
292
                         onUpload={this.handleUpload}
391
                         onUpload={this.handleUpload}
310
                           </span>
409
                           </span>
311
                         ) : null}
410
                         ) : null}
312
                       </span>
411
                       </span>
313
-                      {/* 因为是点击别的区域关闭,所以不用右上角的 Icon */}
314
-                      {/* <Icon
315
-                        type="close"
316
-                        onClick={() => this.handleShowUpload(false)}
317
-                        style={{
318
-                          float: "right",
319
-                          cursor: "pointer",
320
-                          marginTop: 4
321
-                        }}
322
-                      /> */}
323
                     </div>
412
                     </div>
324
                   }
413
                   }
325
                 >
414
                 >
399
   uploadPopoverPlacement: "bottomLeft",
488
   uploadPopoverPlacement: "bottomLeft",
400
   uploadOverlayClassName: "",
489
   uploadOverlayClassName: "",
401
   maxUpload: 1,
490
   maxUpload: 1,
402
-  value: "",
403
-  fileList: [],
404
   // btnSubmitText: "发表",
491
   // btnSubmitText: "发表",
405
   btnLoading: false,
492
   btnLoading: false,
406
   btnDisabled: false,
493
   btnDisabled: false,
407
   showError: true,
494
   showError: true,
408
-  maxLength: 5000
495
+  maxLength: 5000,
496
+  handleChangeFileList: () => {}
409
 };
497
 };
410
 
498
 
411
-export default Editor;
499
+export default Comment(Editor);

+ 6
- 6
src/helper.js View File

5
   IMAGE_PROCESS_LARGE,
5
   IMAGE_PROCESS_LARGE,
6
   IMAGE_PROCESS
6
   IMAGE_PROCESS
7
 } from "./constant";
7
 } from "./constant";
8
-import emoji, { prefixUrl } from "./emoji";
8
+// import emoji, { prefixUrl } from "./emoji";
9
 
9
 
10
-const emojiObejct = arrayToObject(emoji, "title");
10
+// const emojiObejct = arrayToObject(emoji, "title");
11
 
11
 
12
 export function isFunction(functionToCheck) {
12
 export function isFunction(functionToCheck) {
13
   return (
13
   return (
71
         return `<a href="${src}" rel="noopener noreferrer" target="_blank"><img class="comment-img" src="${src}" alt="${src}" /></a>`;
71
         return `<a href="${src}" rel="noopener noreferrer" target="_blank"><img class="comment-img" src="${src}" alt="${src}" /></a>`;
72
       }
72
       }
73
       // 如果不存在对应的表情, 则返回原文
73
       // 如果不存在对应的表情, 则返回原文
74
-      const emoji = emojiObejct[src];
74
+      // const emoji = emojiObejct[src];
75
+      console.log(src);
76
+      const emoji = JSON.parse(sessionStorage.getItem("emojiMap"))[src];
75
       if (emoji) {
77
       if (emoji) {
76
-        return `<img class="comment-emoji" src="${prefixUrl}${emoji.value}.${
77
-          emoji.ext
78
-        }" alt="${emoji.title}" />`;
78
+        return `<img class="comment-emoji" src="${emoji}" alt="${emoji.title}" />`;
79
       }
79
       }
80
       return `[${src}]`;
80
       return `[${src}]`;
81
     })
81
     })

+ 3
- 3
src/index.js View File

40
             });
40
             });
41
           }}
41
           }}
42
           handleChangeFileList={fileList => {
42
           handleChangeFileList={fileList => {
43
-            console.log(fileList);
43
+            console.log("----", fileList);
44
             this.setState({
44
             this.setState({
45
               fileList
45
               fileList
46
             });
46
             });
91
     type: 1,
91
     type: 1,
92
     businessId: "test",
92
     businessId: "test",
93
     businessUserId: 4,
93
     businessUserId: 4,
94
-    userId: 71748,
94
+    userId: 58297,
95
     currentUser: {
95
     currentUser: {
96
-      user_id: 71748
96
+      user_id: 58297
97
     },
97
     },
98
     userAvaHoverData: {
98
     userAvaHoverData: {
99
       71763: {
99
       71763: {