merge master

CHANGELOG.md

@@ -1,8 +1,13 @@
 # CHANGELOG
 
+<<<<<<< HEAD
 ## 1.0.0
 
 - [x] 完成通用评论国际化
+=======
+## 0.5.14
+- [x] 增加onDelete回调
+>>>>>>> upstream/master
 
 ## 0.5.13
 - [x] emoji增加到每页30个

README.md

@@ -2,7 +2,7 @@
 
 通用评论系统及编辑器
 
-**`version 0.5.13`**
+**`version 0.5.14`**
 
 ```js
 import Comment, { Editor, RenderText } from 'comment';
@@ -42,11 +42,14 @@ render() {
 
 ### 在非 React.js 项目中使用 ~~作为静态文件引入~~
 
-1. 引入通用评论的 css 和 js 文件。在 `./assets/static` 目录。
+**使用`assets` 分支的 `./assets/static` 目录[https://git.links123.net/npm/comment/src/branch/assets/assets/static](https://git.links123.net/npm/comment/src/branch/assets/assets/static)的静态文件**
+
+1. 引入通用评论的 css 和 js 文件。在 `assets` 分支的 `./assets/static` 目录: [https://git.links123.net/npm/comment/src/branch/assets/assets/static](https://git.links123.net/npm/comment/src/branch/assets/assets/static)。
 2. 调用 `window.renderComment` 方法并传入对应参数来渲染通用评论。参数列表：
   - `id`: string, 必填, 渲染评论的节点的 ID
   - `type`: number, 必填, 评论的 type    
-  - `businessId`: string, 必填, 评论的 businessId    
+  - `businessId`: string, 选填, 评论的 businessId，默认 test
+  - `API`: string, 选填, 评论的 businessId，默认 http://api.links123.net/comment/v1
 
 具体可参考 `./assets/example.html`。
 
@@ -74,10 +77,11 @@ render() {
   <script type="text/javascript">
     // 调用 renderComment 这个方法，渲染通用评论
     window.renderComment({
-      id: 'comment', // 渲染通用评论到 comment 这个节点，id 名称可 自定义
-      type: 1, // 评论的 type
-      businessId: 'test' // 评论的 businessId
-    })
+      id: 'comment', // required, 渲染通用评论到 comment 这个节点，id 名称可 自定义
+      type: 1, // required, 评论的 type
+      businessId: 'test' // 评论的 businessId, 默认 test
+      API: 'http://api.links123.net/comment/v1', // API 前缀, 默认 http://api.links123.net/comment/v1 
+    });
   </script>
 </body>
 </html>
@@ -98,11 +102,11 @@ render() {
 
 ```html
 <!-- ... -->
-  <link rel="stylesheet" type="text/css" media="screen" href="./static/css/comment.0.5.13.css" />
+  <link rel="stylesheet" type="text/css" media="screen" href="./static/css/xxx.css" />
 <!-- ... -->
   <div id="RENDER_ELEMENT_WRAPPER"></div>
 <!-- ... -->
-  <script type="text/javascript" src="./static/js/comment.0.5.13.js"></script>
+  <script type="text/javascript" src="./static/js/xxx.js"></script>
 <!-- ... -->
 ```
 
@@ -143,7 +147,8 @@ function main() {
     window.renderComment({
       id: id,
       type: 1,
-      businessId: 'test'
+      businessId: 'test',
+      API: 'http://api.links123.net/comment/v1',
     })
   })
   
@@ -154,22 +159,24 @@ function main() {
     window.renderComment({
       id: id,
       type: 1,
-      businessId: 'test1'
+      businessId: 'test1',
+      API: 'http://api.links123.net/comment/v1',
     })
   })
-
 }
 
 main();
 ```
 
-#### class 样式冲突
+#### ~~class 样式冲突~~
 
-`master` 分支的图片预览 `container` 样式和 boostrap 有冲突。在 [`fix/classname`](https://git.links123.net/node/npmcomment/src/branch/fix/classname) 分支对评论的样式名称做了修改，改为了 `comment-image-preview-container`。
+> assets 分支已修复。
 
-解决办法就是使用 [`fix/classname`](https://git.links123.net/node/npmcomment/src/branch/fix/classname) 分支中的静态文件：
+~~`master` 分支的图片预览 `container` 样式和 boostrap 有冲突。在 [`fix/classname`](https://git.links123.net/node/npmcomment/src/branch/fix/classname) 分支对评论的样式名称做了修改，改为了 `comment-image-preview-container`。~~
 
+解决办法就是使用 [`fix/classname`](https://git.links123.net/node/npmcomment/src/branch/fix/classname) 分支中的静态文件：
 
+- [https://git.links123.net/node/npmcomment/src/branch/fix/classname](https://git.links123.net/node/npmcomment/src/branch/fix/classname)
 - static: [https://git.links123.net/node/npmcomment/src/branch/fix/classname/assets/static](https://git.links123.net/node/npmcomment/src/branch/fix/classname/assets/static)
 
 
@@ -181,24 +188,26 @@ main();
 - 标记了`deprecated`的配置项表示不推荐使用，并且可能在将来版本中不再受支持。
 
 
-| props            | type           | default                            | required | description                                                                       |
-| ---------------- | -------------- | ---------------------------------- | -------- | --------------------------------------------------------------------------------- |
-| type             | number         |                                    | true     | 评论的 type                                                                       |
-| businessId       | string         |                                    | true     | 评论的 business id                                                                |
-| API              | string         | http://api.links123.net/comment/v1 | false    | API 前缀                                                                          |
-| showList         | boolean        | true                               | false    | 是否显示评论列表                                                                  |
-| showEditor       | boolean        | true                               | false    | 是否显示评论输入框                                                                |
-| showAlertComment | boolean        | false                              | false    | 评论成功之后，是否通过 Antd 的 Message 组件进行提示                               |
-| showAlertReply   | boolean        | false                              | false    | 回复成功之后，是否通过 Antd 的 Message 组件进行提示                               |
-| showAlertFavor   | boolean        | false                              | false    | 点赞/取消点赞成功之后，是否通过 Antd 的 Message 组件进行提示                      |
-| showError        | boolean        | true                               | false    | 是否使用Antd的Message组件提示错误信息                                             |
-| onError          | function(msg)  |                                    | false    | 错误回调, 出错了会被调用                                                          |
-| userId           | number         |                                    | false    | 用户id, comment内部不维护用户id, 调用组件时传递过来, 目前用于判断是否显示删除按钮 |
-| token            | string         |                                    | false    | [deprecated] token，用于身份认证，非必须。默认使用 cookie                         |
-| pageType         | string         | more                               | false    | 分页类别， more-加载更多 pagination-页码                                          |
-| page             | number         |                                    | false    | 页码受控模式,如果传递了此参数,则需要通过onPageChange回调手动维护page.             |
-| onPageChange     | function(page) |                                    | false    | 页码发生变化时的回调,注意:分页数据获取还是在组件内部处理的                        |
-| locales          | string         | 语言                                | false    | 语言，zh-CN/en-US。默认根据 url 中的 lang 参数来获取。所以一般情况可不传入       |
+| props            | type           | default                            | required | description                                                                           |
+| ---------------- | -------------- | ---------------------------------- | -------- | ------------------------------------------------------------------------------------- |
+| type             | number         |                                    | true     | 评论的 type                                                                           |
+| businessId       | string         |                                    | true     | 评论的 business id                                                                    |
+| API              | string         | http://api.links123.net/comment/v1 | false    | API 前缀                                                                              |
+| showList         | boolean        | true                               | false    | 是否显示评论列表                                                                      |
+| showEditor       | boolean        | true                               | false    | 是否显示评论输入框                                                                    |
+| showAlertComment | boolean        | false                              | false    | 评论成功之后，是否通过 Antd 的 Message 组件进行提示                                   |
+| showAlertReply   | boolean        | false                              | false    | 回复成功之后，是否通过 Antd 的 Message 组件进行提示                                   |
+| showAlertFavor   | boolean        | false                              | false    | 点赞/取消点赞成功之后，是否通过 Antd 的 Message 组件进行提示                          |
+| showError        | boolean        | true                               | false    | 是否使用Antd的Message组件提示错误信息                                                 |
+| onError          | function(msg)  |                                    | false    | 错误回调, 出错了会被调用                                                              |
+| userId           | number         |                                    | false    | 用户id, comment内部不维护用户id, 调用组件时传递过来, 目前用于判断是否显示删除按钮     |
+| token            | string         |                                    | false    | [deprecated] token，用于身份认证，非必须。默认使用 cookie                             |
+| pageType         | string         | more                               | false    | 分页类别， more-加载更多 pagination-页码                                              |
+| page             | number         |                                    | false    | 页码受控模式,如果传递了此参数,则需要通过onPageChange回调手动维护page.                 |
+| onPageChange     | function(page) |                                    | false    | 页码发生变化时的回调,注意:分页数据获取还是在组件内部处理的                            |
+| onDelete         | function(type) |                                    | false    | 评论或回复删除成功后的回调, type: "comment" \| "reply" , 用于区分删除的是评论还是回复 |
+| locales          | string         | 语言                                | false    | 语言，zh-CN/en-US。默认根据 url 中的 lang 参数来获取。所以一般情况可不传入       
+
 
 ## Editor
 

assets/example.html

@@ -5,7 +5,7 @@
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <title>通用评论 demo</title>
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="stylesheet" type="text/css" media="screen" href="./static/css/main.81c08691.css" />
+  <link rel="stylesheet" type="text/css" media="screen" href="./static/css/main.a3c3a441.css" />
 </head>
 <body>
   <div>
@@ -20,7 +20,7 @@
   </div>
   
   <script src="http://gosspublic.alicdn.com/aliyun-oss-sdk.min.js"></script>
-  <script type="text/javascript" src="./static/js/main.9d10db91.js"></script>
+  <script type="text/javascript" src="./static/js/main.426815d8.js"></script>
   <script type="text/javascript" src="example.js"></script>
 </body>
 </html>

assets/example.js

@@ -8,7 +8,7 @@ var RENDER_ELEMENT_COMMENT = 'comment'; // 渲染评论的标签的 id
 function createElement(id) {
   var node = document.createElement('div');
   node.setAttribute("id", id);
-  document.getElementById(RENDER_ELEMENT_WRAPPER).appendChild(node); 
+  document.getElementById(RENDER_ELEMENT_WRAPPER).appendChild(node);
 }
 
 /**
@@ -25,7 +25,7 @@ function removeChild(id) {
 
 
 function main() {
-  document.getElementById('render').addEventListener('click', function() {
+  document.getElementById('render').addEventListener('click', function () {
     // 首先清空父标签的内容
     removeChild(RENDER_ELEMENT_WRAPPER);
 
@@ -36,22 +36,25 @@ function main() {
     window.renderComment({
       id: id,
       type: 1,
-      businessId: 'test'
+      businessId: 'test',
+      userId: 71299
     })
   })
-  
-  document.getElementById('re-render').addEventListener('click', function() {
+
+  document.getElementById('re-render').addEventListener('click', function () {
     removeChild(RENDER_ELEMENT_WRAPPER)
     var id = RENDER_ELEMENT_COMMENT;
     createElement(id)
     window.renderComment({
       id: id,
       type: 1,
-      businessId: 'test1'
+      businessId: 'test1',
+      userId: 71299
     })
   })
-  
+
 }
 
 
+
 main();

lib/App.js

@@ -27,6 +27,10 @@ var _axios = require("axios");
 
 var _axios2 = _interopRequireDefault(_axios);
 
+var _reactIntlUniversal = require("react-intl-universal");
+
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
+
 var _constant = require("./constant");
 
 var _Comment = require("./Comment");
@@ -51,19 +55,30 @@ var _RenderText2 = _interopRequireDefault(_RenderText);
 
 var _lang = require("./lang");
 
-var _lang2 = _interopRequireDefault(_lang);
+var _enUS = require("./lang/en-US.js");
+
+var _enUS2 = _interopRequireDefault(_enUS);
+
+var _zhCN = require("./lang/zh-CN.js");
+
+var _zhCN2 = _interopRequireDefault(_zhCN);
 
 require("./App.css");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 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; }
 
 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; }
 
-// import styles from "./App.module.css";
+var LOCALES = {
+  "zh-CN": _zhCN2.default,
+  "en-US": _enUS2.default
+};
 
 var App = function (_Component) {
   _inherits(App, _Component);
@@ -84,7 +99,9 @@ var App = function (_Component) {
       page: 1,
       total: 0,
       // 是否没有更多评论了
-      isNoMoreComment: false
+      isNoMoreComment: false,
+      initDone: false,
+      locale: "zh-CN"
     };
     _this.handleChangeLoading = _this.handleChangeLoading.bind(_this);
     _this.sCreateComment = _this.sCreateComment.bind(_this);
@@ -111,7 +128,38 @@ var App = function (_Component) {
     }
   }, {
     key: "componentDidMount",
-    value: function componentDidMount() {}
+    value: function componentDidMount() {
+      this.loadLocales();
+    }
+
+    /**
+     * 加载语言包
+     * 只能根据url或者传入的props来确定加载哪个语言包
+     * 优先级：传入的props > url
+     */
+
+  }, {
+    key: "loadLocales",
+    value: function loadLocales() {
+      var _this2 = this;
+
+      var currentLocale = this.props.locales;
+
+      if (!currentLocale) {
+        currentLocale = _reactIntlUniversal2.default.determineLocale({
+          urlLocaleKey: "lang"
+        });
+      }
+      currentLocale = _lang.SUPPORT_LOCALES.find(function (item) {
+        return item.value === currentLocale;
+      }) ? currentLocale : "zh-CN";
+      _reactIntlUniversal2.default.init({
+        currentLocale: currentLocale,
+        locales: _defineProperty({}, currentLocale, LOCALES[currentLocale])
+      }).then(function () {
+        _this2.setState({ initDone: true, locale: currentLocale });
+      });
+    }
   }, {
     key: "error",
     value: function error(msg) {
@@ -127,13 +175,16 @@ var App = function (_Component) {
   }, {
     key: "errorHandler",
     value: function errorHandler(error) {
+      var locale = this.state.locale;
+
+      var localResponse = _lang.LOCALES_RESPONSE[locale];
       if (error.response && error.response.data && error.response.data.msg) {
-        this.error(_lang2.default[error.response.data.msg] || _constant.ERROR_DEFAULT, {
+        this.error(localResponse[error.response.data.msg] || _constant.ERROR_DEFAULT, {
           response: error.response
         });
         return;
       }
-      this.error(_lang2.default[error.message] || _constant.ERROR_DEFAULT, {
+      this.error(localResponse[error.response.data.msg] || _constant.ERROR_DEFAULT, {
         response: error.response
       });
     }
@@ -160,7 +211,7 @@ var App = function (_Component) {
   }, {
     key: "sGetComment",
     value: function sGetComment() {
-      var _this2 = this;
+      var _this3 = this;
 
       var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
           _ref$page = _ref.page,
@@ -182,7 +233,7 @@ var App = function (_Component) {
 
         if (list) {
           var newList = list;
-          var oldList = _this2.state.list;
+          var oldList = _this3.state.list;
 
           if (pageType === "more") {
             if (page > 1) {
@@ -197,19 +248,19 @@ var App = function (_Component) {
             window.scrollTo(0, 0);
           }
 
-          _this2.setState({
+          _this3.setState({
             list: newList,
             page: page,
             total: total
           });
         } else {
-          _message3.default.info("没有更多评论了");
-          _this2.setState({
+          _message3.default.info(_reactIntlUniversal2.default.get("message.noMoreComment"));
+          _this3.setState({
             isNoMoreComment: true
           });
         }
       }).catch(this.errorHandler).finally(function () {
-        _this2.handleChangeLoading("sGetComment", false);
+        _this3.handleChangeLoading("sGetComment", false);
       });
     }
 
@@ -220,7 +271,7 @@ var App = function (_Component) {
   }, {
     key: "sGetReply",
     value: function sGetReply() {
-      var _this3 = this;
+      var _this4 = this;
 
       var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
           commentId = _ref2.commentId,
@@ -232,9 +283,9 @@ var App = function (_Component) {
 
       this.axios.get(API + "/replies?comment_id=" + commentId + "&page=" + page + "&limit=" + _constant.LIMIT).then(function (response) {
         if (!response.data.list) {
-          _message3.default.info("没有更多数据了！");
+          _message3.default.info(_reactIntlUniversal2.default.get("message.noMoreData"));
         }
-        var list = _this3.state.list.map(function (item) {
+        var list = _this4.state.list.map(function (item) {
           if (item.id === commentId) {
             if (!item.replies) item.replies = [];
             if (response.data.list) {
@@ -256,9 +307,9 @@ var App = function (_Component) {
           }
           return item;
         });
-        _this3.setState({ list: list });
+        _this4.setState({ list: list });
       }).catch(this.errorHandler).finally(function () {
-        _this3.handleChangeLoading("sGetReply", false);
+        _this4.handleChangeLoading("sGetReply", false);
       });
     }
 
@@ -270,14 +321,14 @@ var App = function (_Component) {
   }, {
     key: "sCreateComment",
     value: function sCreateComment() {
-      var _this4 = this;
+      var _this5 = this;
 
       var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
           content = _ref3.content;
 
       var cb = arguments[1];
 
-      if (!content) return this.error("评论内容不能为空 ");
+      if (!content) return this.error(_reactIntlUniversal2.default.get("message.notNull"));
       this.handleChangeLoading("sCreateComment", true);
       var _props2 = this.props,
           API = _props2.API,
@@ -293,23 +344,23 @@ var App = function (_Component) {
         },
         withCredentials: true
       }).then(function (response) {
-        if (_this4.props.showAlertComment) {
-          _message3.default.success("评论成功！");
+        if (_this5.props.showAlertComment) {
+          _message3.default.success(_reactIntlUniversal2.default.get("message.success"));
         }
         if ((0, _helper.isFunction)(cb)) cb();
         // 将数据写入到 list 中
         // 临时插入
         // 等到获取数据之后，删除临时数据
-        var _state = _this4.state,
+        var _state = _this5.state,
             list = _state.list,
             total = _state.total;
 
         list.unshift(_extends({}, response.data, {
           isTemporary: true // 临时的数据
         }));
-        _this4.setState({ list: list, total: total + 1 });
+        _this5.setState({ list: list, total: total + 1 });
       }).catch(this.errorHandler).finally(function () {
-        _this4.handleChangeLoading("sCreateComment", false);
+        _this5.handleChangeLoading("sCreateComment", false);
       });
     }
 
@@ -320,7 +371,7 @@ var App = function (_Component) {
   }, {
     key: "sDeleteComment",
     value: function sDeleteComment(commentId) {
-      var _this5 = this;
+      var _this6 = this;
 
       this.handleChangeLoading("sDeleteComment", true);
       var API = this.props.API;
@@ -329,16 +380,17 @@ var App = function (_Component) {
         method: "delete",
         withCredentials: true
       }).then(function () {
-        var _state2 = _this5.state,
+        var _state2 = _this6.state,
             list = _state2.list,
             total = _state2.total;
 
         var res = list.filter(function (item) {
           return item.id !== commentId;
         });
-        _this5.setState({ list: res, total: total - 1 });
+        _this6.setState({ list: res, total: total - 1 });
+        _this6.props.onDelete(_constant.COMMENT_TYPE.COMMENT);
       }).catch(this.errorHandler).finally(function () {
-        _this5.handleChangeLoading("sDeleteComment", false);
+        _this6.handleChangeLoading("sDeleteComment", false);
       });
     }
 
@@ -351,9 +403,9 @@ var App = function (_Component) {
   }, {
     key: "sCreateReply",
     value: function sCreateReply(data, cb) {
-      var _this6 = this;
+      var _this7 = this;
 
-      if (!data.content) return this.error("回复内容不能为空 ");
+      if (!data.content) return this.error(_reactIntlUniversal2.default.get("message.replyNoNull"));
       this.handleChangeLoading("sCreateReply", true);
       var API = this.props.API;
 
@@ -362,14 +414,14 @@ var App = function (_Component) {
         data: data,
         withCredentials: true
       }).then(function (response) {
-        if (_this6.props.showAlertReply) {
-          _message3.default.success("回复成功！");
+        if (_this7.props.showAlertReply) {
+          _message3.default.success(_reactIntlUniversal2.default.get("message.replySuccess"));
         }
         if ((0, _helper.isFunction)(cb)) cb();
         // 将数据写入到 list 中
         // 临时插入
         // 等到获取数据之后，删除临时数据
-        var list = _this6.state.list.map(function (item) {
+        var list = _this7.state.list.map(function (item) {
           if (item.id === data.comment_id) {
             if (!item.replies) item.replies = [];
             item.replies.push(_extends({}, response.data, {
@@ -379,9 +431,9 @@ var App = function (_Component) {
           }
           return item;
         });
-        _this6.setState({ list: list });
+        _this7.setState({ list: list });
       }).catch(this.errorHandler).finally(function () {
-        _this6.handleChangeLoading("sCreateReply", false);
+        _this7.handleChangeLoading("sCreateReply", false);
       });
     }
 
@@ -394,7 +446,7 @@ var App = function (_Component) {
   }, {
     key: "sDeleteReply",
     value: function sDeleteReply(replyId, commentId) {
-      var _this7 = this;
+      var _this8 = this;
 
       this.handleChangeLoading("sDeleteReply", true);
       var API = this.props.API;
@@ -403,7 +455,7 @@ var App = function (_Component) {
         method: "delete",
         withCredentials: true
       }).then(function () {
-        var list = _this7.state.list.map(function (item) {
+        var list = _this8.state.list.map(function (item) {
           if (item.id === commentId) {
             var replies = item.replies.filter(function (item) {
               return item.id !== replyId;
@@ -413,9 +465,10 @@ var App = function (_Component) {
           }
           return item;
         });
-        _this7.setState({ list: list });
+        _this8.setState({ list: list });
+        _this8.props.onDelete(_constant.COMMENT_TYPE.REPLY);
       }).catch(this.errorHandler).finally(function () {
-        _this7.handleChangeLoading("sDeleteReply", false);
+        _this8.handleChangeLoading("sDeleteReply", false);
       });
     }
 
@@ -428,7 +481,7 @@ var App = function (_Component) {
   }, {
     key: "sCommentFavor",
     value: function sCommentFavor(commentId, favored) {
-      var _this8 = this;
+      var _this9 = this;
 
       this.handleChangeLoading("sCommentFavor", true);
       var API = this.props.API;
@@ -437,20 +490,20 @@ var App = function (_Component) {
         method: favored ? "delete" : "put",
         withCredentials: true
       }).then(function (response) {
-        if (_this8.props.showAlertFavor) {
-          _message3.default.success(favored ? "取消点赞成功！" : "点赞成功！");
+        if (_this9.props.showAlertFavor) {
+          _message3.default.success(favored ? _reactIntlUniversal2.default.get("message.cancelLickSuccess") : _reactIntlUniversal2.default.get("message.likeSuccess"));
         }
         // 更新 list 中的该项数据的 favored
-        var list = _this8.state.list.map(function (item) {
+        var list = _this9.state.list.map(function (item) {
           if (item.id === commentId) {
             item.favored = !favored;
             item.favor_count += favored ? -1 : 1;
           }
           return item;
         });
-        _this8.setState({ list: list });
+        _this9.setState({ list: list });
       }).catch(this.errorHandler).finally(function () {
-        _this8.handleChangeLoading("sCommentFavor", false);
+        _this9.handleChangeLoading("sCommentFavor", false);
       });
     }
 
@@ -464,7 +517,7 @@ var App = function (_Component) {
   }, {
     key: "sReplyFavor",
     value: function sReplyFavor(replyId, commentId, favored) {
-      var _this9 = this;
+      var _this10 = this;
 
       this.handleChangeLoading("sReplyFavor", true);
       var API = this.props.API;
@@ -476,9 +529,9 @@ var App = function (_Component) {
         },
         withCredentials: true
       }).then(function (response) {
-        _message3.default.success(favored ? "取消点赞成功！" : "点赞成功！");
+        _message3.default.success(favored ? _reactIntlUniversal2.default.get("message.cancelLickSuccess") : _reactIntlUniversal2.default.get("message.likeSuccess"));
         // 更新 list 中的该项数据的 favored
-        var list = _this9.state.list.map(function (item) {
+        var list = _this10.state.list.map(function (item) {
           if (item.id === commentId) {
             item.replies = item.replies.map(function (r) {
               if (r.id === replyId) {
@@ -493,9 +546,9 @@ var App = function (_Component) {
           }
           return item;
         });
-        _this9.setState({ list: list });
+        _this10.setState({ list: list });
       }).catch(this.errorHandler).finally(function () {
-        _this9.handleChangeLoading("sReplyFavor", false);
+        _this10.handleChangeLoading("sReplyFavor", false);
       });
     }
 
@@ -506,15 +559,15 @@ var App = function (_Component) {
   }, {
     key: "sOssSts",
     value: function sOssSts() {
-      var _this10 = this;
+      var _this11 = this;
 
       this.handleChangeLoading("sOssSts", true);
       var API = this.props.API;
 
       this.axios.get(API + "/oss/sts").then(function (response) {
-        _this10.setState({ oss: _extends({}, response.data) });
+        _this11.setState({ oss: _extends({}, response.data) });
       }).catch(this.errorHandler).finally(function () {
-        _this10.handleChangeLoading("sOssSts", false);
+        _this11.handleChangeLoading("sOssSts", false);
       });
     }
   }, {
@@ -533,7 +586,7 @@ var App = function (_Component) {
         sDeleteReply: this.sDeleteReply
       });
 
-      return _react2.default.createElement(
+      return this.state.initDone && _react2.default.createElement(
         _Comment.CommentContext.Provider,
         { value: value },
         _react2.default.createElement(
@@ -567,7 +620,9 @@ App.propTypes = {
   userId: _propTypes2.default.number, // 用户id, comment内部不维护用户id, 调用组件时传递过来, 目前用于判断是否显示删除按钮
   pageType: _propTypes2.default.string, // 分页类型
   page: _propTypes2.default.number, // 页码
-  onPageChange: _propTypes2.default.func // 页码变化回调
+  onPageChange: _propTypes2.default.func, // 页码变化回调
+  onDelete: _propTypes2.default.func,
+  locales: _propTypes2.default.string //  传入的语言环境， en-US/zh-CN
 };
 
 App.defaultProps = {
@@ -579,7 +634,8 @@ App.defaultProps = {
   showAlertFavor: false,
   showError: true,
   pageType: "more",
-  onPageChange: function onPageChange(page) {}
+  onPageChange: function onPageChange(page) {},
+  onDelete: function onDelete() {}
 };
 
 exports.Editor = _Editor2.default;

lib/components/CommentBox/index.js

@@ -20,6 +20,10 @@ var _propTypes = require("prop-types");
 
 var _propTypes2 = _interopRequireDefault(_propTypes);
 
+var _reactIntlUniversal = require("react-intl-universal");
+
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
+
 var _Comment = require("../../Comment");
 
 var _Comment2 = _interopRequireDefault(_Comment);
@@ -122,7 +126,7 @@ var CommentBox = function (_Component) {
                       return _this2.handleGetMoreReply(commentId);
                     }
                   },
-                  "\u67E5\u770B\u66F4\u591A\u56DE\u590D"
+                  _reactIntlUniversal2.default.get("reply.moreReply")
                 ),
                 _react2.default.createElement(
                   "a",
@@ -131,7 +135,8 @@ var CommentBox = function (_Component) {
                     onClick: _this2.handleToggleReply
                   },
                   _react2.default.createElement(_icon2.default, { type: "up" }),
-                  " \u6536\u8D77\u56DE\u590D"
+                  " ",
+                  _reactIntlUniversal2.default.get("reply.collapse")
                 )
               )];
             }

lib/components/CommentList/index.js

@@ -22,6 +22,10 @@ var _react = require("react");
 
 var _react2 = _interopRequireDefault(_react);
 
+var _reactIntlUniversal = require("react-intl-universal");
+
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
+
 var _Comment = require("../../Comment");
 
 var _Comment2 = _interopRequireDefault(_Comment);
@@ -85,7 +89,7 @@ var CommentList = function (_Component) {
             _react2.default.createElement(
               "span",
               null,
-              "\u67E5\u770B\u66F4\u591A\u8BC4\u8BBA"
+              _reactIntlUniversal2.default.get("comment.moreComment")
             )
           );
         } else {
@@ -126,9 +130,7 @@ var CommentList = function (_Component) {
           _react2.default.createElement(
             "div",
             null,
-            "\u5171 ",
-            total,
-            " \u6761\u8BC4\u8BBA"
+            _reactIntlUniversal2.default.get("comment.totalComment", { total: total })
           ),
           list.map(function (item) {
             return _react2.default.createElement(_CommentBox2.default, { content: item, key: item.id, commentId: item.id });

lib/components/CommentList/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CommentList/index.js"],"names":["CommentList","props","state","app","sGetComment","page","list","total","pageType","isNoMoreComment","onPageChange","length","LIMIT","p","loading","spinning","Boolean","sCommentFavor","sReplyFavor","map","item","id","renderPagination","Component","propTypes"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;;;;AAEA;;;;AACA;;;;AACA;;AACA;;;;;;;;;;IAEMA,W;;;AACJ,uBAAYC,KAAZ,EAAmB;AAAA;;AAAA,0HACXA,KADW;;AAEjB,UAAKC,KAAL,GAAa,EAAb;AAFiB;AAGlB;;;;yCAEoB;AACnB,WAAKD,KAAL,CAAWE,GAAX,CAAeC,WAAf,CAA2B,EAAEC,MAAM,KAAKJ,KAAL,CAAWE,GAAX,CAAeE,IAAvB,EAA3B;AACD;;;uCAEkB;AAAA,uBASb,KAAKJ,KAAL,CAAWE,GATE;AAAA,UAEfG,IAFe,cAEfA,IAFe;AAAA,UAGfC,KAHe,cAGfA,KAHe;AAAA,UAIfF,IAJe,cAIfA,IAJe;AAAA,UAKfG,QALe,cAKfA,QALe;AAAA,UAMfC,eANe,cAMfA,eANe;AAAA,UAOfL,WAPe,cAOfA,WAPe;AAAA,UAQfM,YARe,cAQfA,YARe;;AAUjB,UAAIF,aAAa,MAAjB,EAAyB;AACvB,YAAI,CAACC,eAAD,IAAoBH,KAAKK,MAAL,KAAgBJ,KAAxC,EAA+C;AAC7C,iBACE;AAAA;AAAA;AACE,yBAAU,wBADZ;AAEE,uBAAS,mBAAM;AACbH,4BAAY,EAAEC,MAAMA,OAAO,CAAf,EAAZ;AACAK,6BAAaL,OAAO,CAApB;AACD;AALH;AAOE;AAAA;AAAA;AAAA;AAAA;AAPF,WADF;AAWD,SAZD,MAYO;AACL,iBAAO,IAAP;AACD;AACF,OAhBD,MAgBO,IAAIG,aAAa,YAAjB,EAA+B;AACpC,eACE;AAAA;AAAA,YAAK,WAAU,yBAAf;AACE;AACE,sBAAUI,eADZ;AAEE,qBAASP,IAFX;AAGE,mBAAOE,KAHT;AAIE,sBAAU,qBAAK;AACbH,0BAAY,EAAEC,MAAMQ,CAAR,EAAZ;AACAH,2BAAaG,CAAb;AACD;AAPH;AADF,SADF;AAaD;AACF;;;6BAEQ;AAAA,wBAC0B,KAAKZ,KAAL,CAAWE,GADrC;AAAA,UACCG,IADD,eACCA,IADD;AAAA,UACOC,KADP,eACOA,KADP;AAAA,UACcO,OADd,eACcA,OADd;;;AAGP,UAAMC,WAAWC,QACfF,QAAQV,WAAR,IAAuBU,QAAQG,aAA/B,IAAgDH,QAAQI,WADzC,CAAjB;AAGA,aACE;AAAA;AAAA;AACE;AAAA;AAAA,YAAM,UAAUH,QAAhB;AACE;AAAA;AAAA;AAAA;AAAQR,iBAAR;AAAA;AAAA,WADF;AAEGD,eAAKa,GAAL,CAAS;AAAA,mBACR,8BAAC,oBAAD,IAAY,SAASC,IAArB,EAA2B,KAAKA,KAAKC,EAArC,EAAyC,WAAWD,KAAKC,EAAzD,GADQ;AAAA,WAAT,CAFH;AAKG,eAAKC,gBAAL;AALH;AADF,OADF;AAWD;;;;EAtEuBC,gB;;AAyE1BvB,YAAYwB,SAAZ,GAAwB,EAAxB;;kBAEe,uBAAQxB,WAAR,C","file":"index.js","sourcesContent":["import React, { Component } from \"react\";\nimport { Spin, Pagination } from \"antd\";\nimport Comment from \"../../Comment\";\nimport CommentBox from \"../CommentBox\";\nimport \"./index.css\";\nimport { LIMIT } from \"../../constant\";\n\nclass CommentList extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {};\n  }\n\n  componentWillMount() {\n    this.props.app.sGetComment({ page: this.props.app.page });\n  }\n\n  renderPagination() {\n    const {\n      list,\n      total,\n      page,\n      pageType,\n      isNoMoreComment,\n      sGetComment,\n      onPageChange\n    } = this.props.app;\n    if (pageType === \"more\") {\n      if (!isNoMoreComment && list.length !== total) {\n        return (\n          <div\n            className=\"comment-list-show-more\"\n            onClick={() => {\n              sGetComment({ page: page + 1 });\n              onPageChange(page + 1);\n            }}\n          >\n            <span>查看更多评论</span>\n          </div>\n        );\n      } else {\n        return null;\n      }\n    } else if (pageType === \"pagination\") {\n      return (\n        <div className=\"comment-list-pagination\">\n          <Pagination\n            pageSize={LIMIT}\n            current={page}\n            total={total}\n            onChange={p => {\n              sGetComment({ page: p });\n              onPageChange(p);\n            }}\n          />\n        </div>\n      );\n    }\n  }\n\n  render() {\n    const { list, total, loading } = this.props.app;\n\n    const spinning = Boolean(\n      loading.sGetComment || loading.sCommentFavor || loading.sReplyFavor\n    );\n    return (\n      <div>\n        <Spin spinning={spinning}>\n          <div>共 {total} 条评论</div>\n          {list.map(item => (\n            <CommentBox content={item} key={item.id} commentId={item.id} />\n          ))}\n          {this.renderPagination()}\n        </Spin>\n      </div>\n    );\n  }\n}\n\nCommentList.propTypes = {};\n\nexport default Comment(CommentList);\n"]}
+{"version":3,"sources":["../../../src/components/CommentList/index.js"],"names":["CommentList","props","state","app","sGetComment","page","list","total","pageType","isNoMoreComment","onPageChange","length","intl","get","LIMIT","p","loading","spinning","Boolean","sCommentFavor","sReplyFavor","map","item","id","renderPagination","Component","propTypes"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;;;;AAEA;;;;AACA;;;;AACA;;;;AACA;;AACA;;;;;;;;;;IAEMA,W;;;AACJ,uBAAYC,KAAZ,EAAmB;AAAA;;AAAA,0HACXA,KADW;;AAEjB,UAAKC,KAAL,GAAa,EAAb;AAFiB;AAGlB;;;;yCAEoB;AACnB,WAAKD,KAAL,CAAWE,GAAX,CAAeC,WAAf,CAA2B,EAAEC,MAAM,KAAKJ,KAAL,CAAWE,GAAX,CAAeE,IAAvB,EAA3B;AACD;;;uCAEkB;AAAA,uBASb,KAAKJ,KAAL,CAAWE,GATE;AAAA,UAEfG,IAFe,cAEfA,IAFe;AAAA,UAGfC,KAHe,cAGfA,KAHe;AAAA,UAIfF,IAJe,cAIfA,IAJe;AAAA,UAKfG,QALe,cAKfA,QALe;AAAA,UAMfC,eANe,cAMfA,eANe;AAAA,UAOfL,WAPe,cAOfA,WAPe;AAAA,UAQfM,YARe,cAQfA,YARe;;AAUjB,UAAIF,aAAa,MAAjB,EAAyB;AACvB,YAAI,CAACC,eAAD,IAAoBH,KAAKK,MAAL,KAAgBJ,KAAxC,EAA+C;AAC7C,iBACE;AAAA;AAAA;AACE,yBAAU,wBADZ;AAEE,uBAAS,mBAAM;AACbH,4BAAY,EAAEC,MAAMA,OAAO,CAAf,EAAZ;AACAK,6BAAaL,OAAO,CAApB;AACD;AALH;AAOE;AAAA;AAAA;AAAOO,2CAAKC,GAAL,CAAS,qBAAT;AAAP;AAPF,WADF;AAWD,SAZD,MAYO;AACL,iBAAO,IAAP;AACD;AACF,OAhBD,MAgBO,IAAIL,aAAa,YAAjB,EAA+B;AACpC,eACE;AAAA;AAAA,YAAK,WAAU,yBAAf;AACE;AACE,sBAAUM,eADZ;AAEE,qBAAST,IAFX;AAGE,mBAAOE,KAHT;AAIE,sBAAU,qBAAK;AACbH,0BAAY,EAAEC,MAAMU,CAAR,EAAZ;AACAL,2BAAaK,CAAb;AACD;AAPH;AADF,SADF;AAaD;AACF;;;6BAEQ;AAAA,wBAC0B,KAAKd,KAAL,CAAWE,GADrC;AAAA,UACCG,IADD,eACCA,IADD;AAAA,UACOC,KADP,eACOA,KADP;AAAA,UACcS,OADd,eACcA,OADd;;;AAGP,UAAMC,WAAWC,QACfF,QAAQZ,WAAR,IAAuBY,QAAQG,aAA/B,IAAgDH,QAAQI,WADzC,CAAjB;AAGA,aACE;AAAA;AAAA;AACE;AAAA;AAAA,YAAM,UAAUH,QAAhB;AAEE;AAAA;AAAA;AAAML,yCAAKC,GAAL,CAAS,sBAAT,EAAiC,EAAEN,YAAF,EAAjC;AAAN,WAFF;AAGGD,eAAKe,GAAL,CAAS;AAAA,mBACR,8BAAC,oBAAD,IAAY,SAASC,IAArB,EAA2B,KAAKA,KAAKC,EAArC,EAAyC,WAAWD,KAAKC,EAAzD,GADQ;AAAA,WAAT,CAHH;AAMG,eAAKC,gBAAL;AANH;AADF,OADF;AAYD;;;;EAvEuBC,gB;;AA0E1BzB,YAAY0B,SAAZ,GAAwB,EAAxB;;kBAEe,uBAAQ1B,WAAR,C","file":"index.js","sourcesContent":["import React, { Component } from \"react\";\nimport { Spin, Pagination } from \"antd\";\nimport intl from \"react-intl-universal\";\nimport Comment from \"../../Comment\";\nimport CommentBox from \"../CommentBox\";\nimport \"./index.css\";\nimport { LIMIT } from \"../../constant\";\n\nclass CommentList extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {};\n  }\n\n  componentWillMount() {\n    this.props.app.sGetComment({ page: this.props.app.page });\n  }\n\n  renderPagination() {\n    const {\n      list,\n      total,\n      page,\n      pageType,\n      isNoMoreComment,\n      sGetComment,\n      onPageChange\n    } = this.props.app;\n    if (pageType === \"more\") {\n      if (!isNoMoreComment && list.length !== total) {\n        return (\n          <div\n            className=\"comment-list-show-more\"\n            onClick={() => {\n              sGetComment({ page: page + 1 });\n              onPageChange(page + 1);\n            }}\n          >\n            <span>{intl.get(\"comment.moreComment\")}</span>\n          </div>\n        );\n      } else {\n        return null;\n      }\n    } else if (pageType === \"pagination\") {\n      return (\n        <div className=\"comment-list-pagination\">\n          <Pagination\n            pageSize={LIMIT}\n            current={page}\n            total={total}\n            onChange={p => {\n              sGetComment({ page: p });\n              onPageChange(p);\n            }}\n          />\n        </div>\n      );\n    }\n  }\n\n  render() {\n    const { list, total, loading } = this.props.app;\n\n    const spinning = Boolean(\n      loading.sGetComment || loading.sCommentFavor || loading.sReplyFavor\n    );\n    return (\n      <div>\n        <Spin spinning={spinning}>\n          {/* <div>共 {total} 条评论</div> */}\n          <div>{intl.get(\"comment.totalComment\", { total })}</div>\n          {list.map(item => (\n            <CommentBox content={item} key={item.id} commentId={item.id} />\n          ))}\n          {this.renderPagination()}\n        </Spin>\n      </div>\n    );\n  }\n}\n\nCommentList.propTypes = {};\n\nexport default Comment(CommentList);\n"]}

lib/components/ContentItem/index.js

@@ -48,6 +48,10 @@ var _relativeTime = require("dayjs/plugin/relativeTime");
 
 var _relativeTime2 = _interopRequireDefault(_relativeTime);
 
+var _reactIntlUniversal = require("react-intl-universal");
+
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
+
 var _Comment = require("../../Comment");
 
 var _Comment2 = _interopRequireDefault(_Comment);
@@ -79,10 +83,16 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
 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; }
 
 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; }
+// import 'dayjs/locale/es';
+
 
-_dayjs2.default.locale("zh-cn");
+// dayjs.locale("zh-cn");
 _dayjs2.default.extend(_relativeTime2.default);
 
+var LOCALES = {
+  "zh-CN": "zh-cn"
+};
+
 var CommentItem = function (_Component) {
   _inherits(CommentItem, _Component);
 
@@ -159,6 +169,7 @@ var CommentItem = function (_Component) {
           showReply = _props.showReply,
           onShowReply = _props.onShowReply,
           app = _props.app;
+      var locale = this.props.app.locale;
       var showInput = this.state.showInput;
 
 
@@ -201,7 +212,7 @@ var CommentItem = function (_Component) {
             _react2.default.createElement(
               "strong",
               null,
-              content.user_name || "游客"
+              content.user_name || _reactIntlUniversal2.default.get("comment.tourist")
             ),
             _react2.default.createElement(
               "span",
@@ -212,7 +223,7 @@ var CommentItem = function (_Component) {
                   placement: "top",
                   title: (0, _dayjs2.default)(content.created * 1000).format("YYYY-MM-DD HH:mm:ss")
                 },
-                (0, _dayjs2.default)(content.created * 1000).fromNow()
+                LOCALES[locale] ? (0, _dayjs2.default)(content.created * 1000).locale(LOCALES[locale]).fromNow() : (0, _dayjs2.default)(content.created * 1000).fromNow()
               )
             )
           ),
@@ -274,15 +285,15 @@ var CommentItem = function (_Component) {
               _react2.default.createElement(
                 "a",
                 { className: "comment-item-bottom-left", onClick: onShowReply },
-                content.reply_count,
-                " \u6761\u56DE\u590D",
+                _reactIntlUniversal2.default.get("reply.totalReply", { total: content.reply_count }),
                 showReply ? _react2.default.createElement(_icon2.default, { type: "up" }) : _react2.default.createElement(_icon2.default, { type: "down" })
               )
             ) : null,
             app.userId === content.user_id && _react2.default.createElement(
               _popconfirm2.default,
               {
-                title: "\u786E\u5B9A\u8981\u5220\u9664\u5417?",
+                // title="确定要删除吗?"
+                title: _reactIntlUniversal2.default.get("popConfirm.title"),
                 onConfirm: function onConfirm() {
                   if (replyId) {
                     app.sDeleteReply(content.id, commentId);
@@ -290,13 +301,14 @@ var CommentItem = function (_Component) {
                   }
                   app.sDeleteComment(content.id);
                 },
-                okText: "\u786E\u5B9A",
-                cancelText: "\u53D6\u6D88"
+                okText: _reactIntlUniversal2.default.get("popConfirm.ok"),
+                cancelText: _reactIntlUniversal2.default.get("popConfirm.cancel")
               },
               _react2.default.createElement(
                 "a",
                 { className: "comment-item-bottom-right" },
-                "\xA0 \u5220\u9664"
+                "\xA0 ",
+                _reactIntlUniversal2.default.get("popConfirm.delete")
               )
             ),
             _react2.default.createElement(
@@ -305,7 +317,8 @@ var CommentItem = function (_Component) {
                 onClick: this.handleToggleInput,
                 className: "comment-item-bottom-right"
               },
-              "\xA0 \u56DE\u590D"
+              "\xA0 ",
+              _reactIntlUniversal2.default.get("comment.reply")
             ),
             _react2.default.createElement(
               "div",

lib/components/Editor/Upload.js

@@ -42,6 +42,10 @@ var _shortid = require("shortid");
 
 var _shortid2 = _interopRequireDefault(_shortid);
 
+var _reactIntlUniversal = require("react-intl-universal");
+
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
+
 var _constant = require("../../constant");
 
 var _Comment = require("../../Comment");
@@ -173,7 +177,7 @@ var App = function (_React$Component) {
         _react2.default.createElement(
           "div",
           { className: "ant-upload-text" },
-          "\u4E0A\u4F20"
+          _reactIntlUniversal2.default.get("editor.uploadBtn")
         )
       );
       return _react2.default.createElement(

lib/components/Editor/index.js

@@ -48,6 +48,10 @@ var _classnames = require("classnames");
 
 var _classnames2 = _interopRequireDefault(_classnames);
 
+var _reactIntlUniversal = require("react-intl-universal");
+
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
+
 var _constant = require("../../constant");
 
 var _helper = require("../../helper");
@@ -218,7 +222,8 @@ var Editor = function (_React$Component) {
           fileList = _state.fileList;
 
       if (value.length > maxLength) {
-        _message3.default.error("\u5B57\u6570\u4E0D\u5F97\u8D85\u8FC7" + maxLength + "\u5B57");
+        // message.error(`字数不得超过${maxLength}字`);
+        _message3.default.error(_reactIntlUniversal2.default.get("editor.maxLength", { maxLength: maxLength }));
         return;
       }
       var files = [];
@@ -267,13 +272,11 @@ var Editor = function (_React$Component) {
 
       var _props = this.props,
           value = _props.value,
-          placeholder = _props.placeholder,
           rows = _props.rows,
           showEmoji = _props.showEmoji,
           showUpload = _props.showUpload,
           closeUploadWhenBlur = _props.closeUploadWhenBlur,
           maxUpload = _props.maxUpload,
-          btnSubmitText = _props.btnSubmitText,
           btnLoading = _props.btnLoading,
           btnDisabled = _props.btnDisabled,
           button = _props.button,
@@ -282,6 +285,8 @@ var Editor = function (_React$Component) {
           maxLength = _props.maxLength,
           autoFocus = _props.autoFocus;
 
+      var placeholder = this.props.placeholder || _reactIntlUniversal2.default.get("editor.placeholder");
+      var btnSubmitText = this.props.placeholder || _reactIntlUniversal2.default.get("editor.SubmitBtn");
       var handleSubmit = this.handleSubmit;
       var disabledSubmit = btnDisabled || !this.props.value && !this.state.value && !this.state.fileList.length;
       var inputValue = value || this.state.value;
@@ -296,11 +301,10 @@ var Editor = function (_React$Component) {
               "comment-editor-toolbar-error": inputValue.length > maxLength
             })
           },
-          "\u5DF2\u8F93\u5165 ",
-          inputValue.length,
-          " / ",
-          maxLength,
-          " \u5B57"
+          _reactIntlUniversal2.default.get("editor.alreadyEntered", {
+            count: inputValue.length,
+            maxLength: maxLength
+          })
         ),
         _react2.default.createElement(
           "div",
@@ -346,9 +350,10 @@ var Editor = function (_React$Component) {
               showUpload ? _react2.default.createElement(
                 _popover2.default,
                 {
-                  trigger: "click",
-                  visible: this.state.showUpload,
-                  overlayStyle: { zIndex: 999 },
+                  trigger: "click"
+                  // TODO: 针对非 react.js，直接使用 click 事件来控制展开或关闭
+                  // visible={this.state.showUpload}
+                  , overlayStyle: { zIndex: 999 },
                   onVisibleChange: closeUploadWhenBlur ? function (visible) {
                     _this3.handleShowUpload(visible);
                   } : null,
@@ -378,7 +383,7 @@ var Editor = function (_React$Component) {
                     _react2.default.createElement(
                       "span",
                       null,
-                      "\u4E0A\u4F20\u56FE\u7247",
+                      _reactIntlUniversal2.default.get("editor.uploadTip"),
                       maxUpload >= 2 ? _react2.default.createElement(
                         "span",
                         { style: { color: "#666", fontWeight: 400 } },
@@ -386,18 +391,7 @@ var Editor = function (_React$Component) {
                         maxUpload - this.state.fileList.length,
                         "\u5F20\u56FE\u7247)"
                       ) : null
-                    ),
-                    _react2.default.createElement(_icon2.default, {
-                      type: "close",
-                      onClick: function onClick() {
-                        return _this3.handleShowUpload(false);
-                      },
-                      style: {
-                        float: "right",
-                        cursor: "pointer",
-                        marginTop: 4
-                      }
-                    })
+                    )
                   )
                 },
                 imageToolIcon ? _react2.default.cloneElement(imageToolIcon, {
@@ -465,12 +459,12 @@ Editor.propTypes = {
 
 Editor.defaultProps = {
   rows: 5,
-  placeholder: "说点什么吧...",
+  // placeholder: "说点什么吧",
   showEmoji: true,
   showUpload: true,
   closeUploadWhenBlur: false,
   maxUpload: 1,
-  btnSubmitText: "发表",
+  // btnSubmitText: "发表",
   btnLoading: false,
   btnDisabled: false,
   showError: true,

lib/components/ImagePreviewer/ImagePreviewer.js

@@ -26,6 +26,10 @@ var _classnames = require("classnames");
 
 var _classnames2 = _interopRequireDefault(_classnames);
 
+var _reactIntlUniversal = require("react-intl-universal");
+
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
+
 require("./ImagePreviewer.less");
 
 var _helper = require("../../helper");
@@ -161,13 +165,14 @@ var ImagePreviewer = function (_React$Component) {
             "span",
             { className: "button", onClick: onFold },
             _react2.default.createElement(_icon2.default, { type: "to-top" }),
-            "\u6536\u8D77"
+            _reactIntlUniversal2.default.get("picture.collapse")
           ),
           _react2.default.createElement(
             "span",
             { className: "button", onClick: this.onOrigin },
             _react2.default.createElement(_icon2.default, { type: "search" }),
-            " \u67E5\u770B\u539F\u56FE"
+            " ",
+            _reactIntlUniversal2.default.get("picture.viewOriginal")
           )
         ),
         _react2.default.createElement(

lib/constant.js

@@ -26,4 +26,9 @@ var IMAGE_SPLIT = exports.IMAGE_SPLIT = "IMAGE_SPLIT";
 var IMAGE_PROCESS = exports.IMAGE_PROCESS = "?x-oss-process=image/resize,h_350";
 var IMAGE_PROCESS_SMALL = exports.IMAGE_PROCESS_SMALL = "?x-oss-process=image/resize,h_100";
 var IMAGE_PROCESS_LARGE = exports.IMAGE_PROCESS_LARGE = "?x-oss-process=image/resize,h_500";
+
+var COMMENT_TYPE = exports.COMMENT_TYPE = {
+  COMMENT: "comment",
+  REPLY: "reply"
+};
 //# sourceMappingURL=constant.js.map

lib/constant.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/constant.js"],"names":["ERROR_DEFAULT","LIMIT","OSS_ENDPOINT","OSS_BUCKET","DRIVER_LICENSE_PATH","OSS_LINK","MAX_UPLOAD_NUMBER","URL_REGEXP","REGEXP","AVATAR","IMAGE_SPLIT","IMAGE_PROCESS","IMAGE_PROCESS_SMALL","IMAGE_PROCESS_LARGE"],"mappings":";;;;;AAAO,IAAMA,wCAAgB,MAAtB;;AAEA,IAAMC,wBAAQ,EAAd,C,CAAkB;;AAElB,IAAMC,sCAAe,6BAArB;AACA,IAAMC,kCAAa,eAAnB;AACA,IAAMC,oDAAsB,UAA5B;;AAEA,IAAMC,8BAAW,6CAAjB;;AAEA,IAAMC,gDAAoB,CAA1B;;AAEA,IAAMC,kCAAa,oGAAnB;;AAEA,IAAMC,0BAAS,eAAf;;AAEA,IAAMC,0BAAS,EAAf;;AAEA,IAAMC,oCAAc,aAApB;;AAEA,IAAMC,wCAAgB,mCAAtB;AACA,IAAMC,oDAAsB,mCAA5B;AACA,IAAMC,oDAAsB,mCAA5B","file":"constant.js","sourcesContent":["export const ERROR_DEFAULT = \"出错了！\";\n\nexport const LIMIT = 10; // 默认 limit\n\nexport const OSS_ENDPOINT = \"oss-cn-beijing.aliyuncs.com\";\nexport const OSS_BUCKET = \"links-comment\";\nexport const DRIVER_LICENSE_PATH = \"/comment\";\n\nexport const OSS_LINK = \"//links-comment.oss-cn-beijing.aliyuncs.com\";\n\nexport const MAX_UPLOAD_NUMBER = 4;\n\nexport const URL_REGEXP = /((http(s)?:)?\\/\\/)?(www\\.)?[-a-zA-Z0-9@:%._+~#=]{2,256}\\.[a-z]{2,6}\\b([-a-zA-Z0-9@:%_+.~#?&//=]*)/g;\n\nexport const REGEXP = /\\[[^[\\]]+?\\]/g;\n\nexport const AVATAR = \"\";\n\nexport const IMAGE_SPLIT = \"IMAGE_SPLIT\";\n\nexport const IMAGE_PROCESS = \"?x-oss-process=image/resize,h_350\";\nexport const IMAGE_PROCESS_SMALL = \"?x-oss-process=image/resize,h_100\";\nexport const IMAGE_PROCESS_LARGE = \"?x-oss-process=image/resize,h_500\";\n"]}
+{"version":3,"sources":["../src/constant.js"],"names":["ERROR_DEFAULT","LIMIT","OSS_ENDPOINT","OSS_BUCKET","DRIVER_LICENSE_PATH","OSS_LINK","MAX_UPLOAD_NUMBER","URL_REGEXP","REGEXP","AVATAR","IMAGE_SPLIT","IMAGE_PROCESS","IMAGE_PROCESS_SMALL","IMAGE_PROCESS_LARGE","COMMENT_TYPE","COMMENT","REPLY"],"mappings":";;;;;AAAO,IAAMA,wCAAgB,MAAtB;;AAEA,IAAMC,wBAAQ,EAAd,C,CAAkB;;AAElB,IAAMC,sCAAe,6BAArB;AACA,IAAMC,kCAAa,eAAnB;AACA,IAAMC,oDAAsB,UAA5B;;AAEA,IAAMC,8BAAW,6CAAjB;;AAEA,IAAMC,gDAAoB,CAA1B;;AAEA,IAAMC,kCAAa,oGAAnB;;AAEA,IAAMC,0BAAS,eAAf;;AAEA,IAAMC,0BAAS,EAAf;;AAEA,IAAMC,oCAAc,aAApB;;AAEA,IAAMC,wCAAgB,mCAAtB;AACA,IAAMC,oDAAsB,mCAA5B;AACA,IAAMC,oDAAsB,mCAA5B;;AAEA,IAAMC,sCAAe;AAC1BC,WAAS,SADiB;AAE1BC,SAAO;AAFmB,CAArB","file":"constant.js","sourcesContent":["export const ERROR_DEFAULT = \"出错了！\";\n\nexport const LIMIT = 10; // 默认 limit\n\nexport const OSS_ENDPOINT = \"oss-cn-beijing.aliyuncs.com\";\nexport const OSS_BUCKET = \"links-comment\";\nexport const DRIVER_LICENSE_PATH = \"/comment\";\n\nexport const OSS_LINK = \"//links-comment.oss-cn-beijing.aliyuncs.com\";\n\nexport const MAX_UPLOAD_NUMBER = 4;\n\nexport const URL_REGEXP = /((http(s)?:)?\\/\\/)?(www\\.)?[-a-zA-Z0-9@:%._+~#=]{2,256}\\.[a-z]{2,6}\\b([-a-zA-Z0-9@:%_+.~#?&//=]*)/g;\n\nexport const REGEXP = /\\[[^[\\]]+?\\]/g;\n\nexport const AVATAR = \"\";\n\nexport const IMAGE_SPLIT = \"IMAGE_SPLIT\";\n\nexport const IMAGE_PROCESS = \"?x-oss-process=image/resize,h_350\";\nexport const IMAGE_PROCESS_SMALL = \"?x-oss-process=image/resize,h_100\";\nexport const IMAGE_PROCESS_LARGE = \"?x-oss-process=image/resize,h_500\";\n\nexport const COMMENT_TYPE = {\n  COMMENT: \"comment\",\n  REPLY: \"reply\"\n};\n"]}

lib/index.js

@@ -14,12 +14,10 @@ var _App = require("./App");
 
 var _App2 = _interopRequireDefault(_App);
 
-var _registerServiceWorker = require("./registerServiceWorker");
-
-var _registerServiceWorker2 = _interopRequireDefault(_registerServiceWorker);
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+// import registerServiceWorker from "./registerServiceWorker";
+
 var Index = function Index(props) {
   return _react2.default.createElement(
     _App2.default,
@@ -34,33 +32,49 @@ var Index = function Index(props) {
  *  - {string} id 渲染评论的DOM的 ID
  *  - {number} type 评论的 type
  *  - {string} businessId 评论的 businessId
+ *  - {string} API, API 前缀, 默认 http://api.links123.net/comment/v1
  */
 function renderComment(config) {
   if (!config.id) {
     throw new Error("id is required");
   }
-  if (!config.id) {
+  if (!config.type) {
     throw new Error("type is required");
   }
-  if (!config.id) {
-    throw new Error("businessId is required");
+  if (!config.businessId) {
+    // throw new Error("businessId is required");
+    console.warn("没有传入 businessId 参数，默认使用: test");
+  }
+  if (!config.API) {
+    // throw new Error("API is required");
+    console.warn("没有传入 API 参数，默认使用: http://api.links123.net/comment/v1");
   }
   var id = config.id,
       _config$type = config.type,
       type = _config$type === undefined ? 1 : _config$type,
       _config$businessId = config.businessId,
-      businessId = _config$businessId === undefined ? "test" : _config$businessId;
+      businessId = _config$businessId === undefined ? "test" : _config$businessId,
+      _config$API = config.API,
+      API = _config$API === undefined ? "http://api.links123.net/comment/v1" : _config$API,
+      userId = config.userId;
 
 
-  _reactDom2.default.render(_react2.default.createElement(Index, { type: type, businessId: businessId }), document.getElementById(id));
+  _reactDom2.default.render(_react2.default.createElement(Index, { type: type, businessId: businessId, API: API, userId: userId }), document.getElementById(id));
   // registerServiceWorker();
 }
 
 window.renderComment = renderComment;
 
+renderComment({
+  id: "root-comment",
+  type: 1,
+  businessId: "test"
+});
+
 // renderComment({
 //   id: "root-comment",
 //   type: 1,
-//   businessId: "test"
+//   businessId: "test",
+//   API: 'http://api.links123.net/comment/v1',
 // });
 //# sourceMappingURL=index.js.map

lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.js"],"names":["Index","props","renderComment","config","id","Error","type","businessId","ReactDOM","render","document","getElementById","window"],"mappings":";;;;AAAA;;;;AACA;;;;AACA;;;;AACA;;;;;;AAEA,IAAMA,QAAQ,SAARA,KAAQ;AAAA,SACZ;AAAC,iBAAD;AAAA,eAAK,sBAAL,EAAsB,oBAAtB,EAAqC,oBAArC,EAAoD,eAApD,IAAkEC,KAAlE;AACE,kCAAC,WAAD,IAAQ,WAAW,CAAnB,EAAsB,eAAtB;AADF,GADY;AAAA,CAAd;;AAMA;;;;;;;AAOA,SAASC,aAAT,CAAuBC,MAAvB,EAA+B;AAC7B,MAAI,CAACA,OAAOC,EAAZ,EAAgB;AACd,UAAM,IAAIC,KAAJ,CAAU,gBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOC,EAAZ,EAAgB;AACd,UAAM,IAAIC,KAAJ,CAAU,kBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOC,EAAZ,EAAgB;AACd,UAAM,IAAIC,KAAJ,CAAU,wBAAV,CAAN;AACD;AAT4B,MAUrBD,EAVqB,GAUiBD,MAVjB,CAUrBC,EAVqB;AAAA,qBAUiBD,MAVjB,CAUjBG,IAViB;AAAA,MAUjBA,IAViB,gCAUV,CAVU;AAAA,2BAUiBH,MAVjB,CAUPI,UAVO;AAAA,MAUPA,UAVO,sCAUM,MAVN;;;AAY7BC,qBAASC,MAAT,CACE,8BAAC,KAAD,IAAO,MAAMH,IAAb,EAAmB,YAAYC,UAA/B,GADF,EAEEG,SAASC,cAAT,CAAwBP,EAAxB,CAFF;AAIA;AACD;;AAEDQ,OAAOV,aAAP,GAAuBA,aAAvB;;AAEA;AACA;AACA;AACA;AACA","file":"index.js","sourcesContent":["import React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport App, { Editor } from \"./App\";\nimport registerServiceWorker from \"./registerServiceWorker\";\n\nconst Index = props => (\n  <App showAlertComment showAlertReply showAlertFavor showError {...props}>\n    <Editor maxUpload={9} autoFocus />\n  </App>\n);\n\n/**\n * 渲染评论组件\n * @param {object} config 编辑器配置\n *  - {string} id 渲染评论的DOM的 ID\n *  - {number} type 评论的 type\n *  - {string} businessId 评论的 businessId\n */\nfunction renderComment(config) {\n  if (!config.id) {\n    throw new Error(\"id is required\");\n  }\n  if (!config.id) {\n    throw new Error(\"type is required\");\n  }\n  if (!config.id) {\n    throw new Error(\"businessId is required\");\n  }\n  const { id, type = 1, businessId = \"test\" } = config;\n\n  ReactDOM.render(\n    <Index type={type} businessId={businessId} />,\n    document.getElementById(id)\n  );\n  // registerServiceWorker();\n}\n\nwindow.renderComment = renderComment;\n\n// renderComment({\n//   id: \"root-comment\",\n//   type: 1,\n//   businessId: \"test\"\n// });\n"]}
+{"version":3,"sources":["../src/index.js"],"names":["Index","props","renderComment","config","id","Error","type","businessId","console","warn","API","userId","ReactDOM","render","document","getElementById","window"],"mappings":";;;;AAAA;;;;AACA;;;;AACA;;;;;;AACA;;AAEA,IAAMA,QAAQ,SAARA,KAAQ;AAAA,SACZ;AAAC,iBAAD;AAAA,eAAK,sBAAL,EAAsB,oBAAtB,EAAqC,oBAArC,EAAoD,eAApD,IAAkEC,KAAlE;AACE,kCAAC,WAAD,IAAQ,WAAW,CAAnB,EAAsB,eAAtB;AADF,GADY;AAAA,CAAd;;AAMA;;;;;;;;AAQA,SAASC,aAAT,CAAuBC,MAAvB,EAA+B;AAC7B,MAAI,CAACA,OAAOC,EAAZ,EAAgB;AACd,UAAM,IAAIC,KAAJ,CAAU,gBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOG,IAAZ,EAAkB;AAChB,UAAM,IAAID,KAAJ,CAAU,kBAAV,CAAN;AACD;AACD,MAAI,CAACF,OAAOI,UAAZ,EAAwB;AACtB;AACAC,YAAQC,IAAR,CAAa,+BAAb;AACD;AACD,MAAI,CAACN,OAAOO,GAAZ,EAAiB;AACf;AACAF,YAAQC,IAAR,CACE,sDADF;AAGD;AAhB4B,MAkB3BL,EAlB2B,GAuBzBD,MAvByB,CAkB3BC,EAlB2B;AAAA,qBAuBzBD,MAvByB,CAmB3BG,IAnB2B;AAAA,MAmB3BA,IAnB2B,gCAmBpB,CAnBoB;AAAA,2BAuBzBH,MAvByB,CAoB3BI,UApB2B;AAAA,MAoB3BA,UApB2B,sCAoBd,MApBc;AAAA,oBAuBzBJ,MAvByB,CAqB3BO,GArB2B;AAAA,MAqB3BA,GArB2B,+BAqBrB,oCArBqB;AAAA,MAsB3BC,MAtB2B,GAuBzBR,MAvByB,CAsB3BQ,MAtB2B;;;AAyB7BC,qBAASC,MAAT,CACE,8BAAC,KAAD,IAAO,MAAMP,IAAb,EAAmB,YAAYC,UAA/B,EAA2C,KAAKG,GAAhD,EAAqD,QAAQC,MAA7D,GADF,EAEEG,SAASC,cAAT,CAAwBX,EAAxB,CAFF;AAIA;AACD;;AAEDY,OAAOd,aAAP,GAAuBA,aAAvB;;AAEAA,cAAc;AACZE,MAAI,cADQ;AAEZE,QAAM,CAFM;AAGZC,cAAY;AAHA,CAAd;;AAMA;AACA;AACA;AACA;AACA;AACA","file":"index.js","sourcesContent":["import React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport App, { Editor } from \"./App\";\n// import registerServiceWorker from \"./registerServiceWorker\";\n\nconst Index = props => (\n  <App showAlertComment showAlertReply showAlertFavor showError {...props}>\n    <Editor maxUpload={9} autoFocus />\n  </App>\n);\n\n/**\n * 渲染评论组件\n * @param {object} config 编辑器配置\n *  - {string} id 渲染评论的DOM的 ID\n *  - {number} type 评论的 type\n *  - {string} businessId 评论的 businessId\n *  - {string} API, API 前缀, 默认 http://api.links123.net/comment/v1\n */\nfunction renderComment(config) {\n  if (!config.id) {\n    throw new Error(\"id is required\");\n  }\n  if (!config.type) {\n    throw new Error(\"type is required\");\n  }\n  if (!config.businessId) {\n    // throw new Error(\"businessId is required\");\n    console.warn(\"没有传入 businessId 参数，默认使用: test\");\n  }\n  if (!config.API) {\n    // throw new Error(\"API is required\");\n    console.warn(\n      \"没有传入 API 参数，默认使用: http://api.links123.net/comment/v1\"\n    );\n  }\n  const {\n    id,\n    type = 1,\n    businessId = \"test\",\n    API = \"http://api.links123.net/comment/v1\",\n    userId\n  } = config;\n\n  ReactDOM.render(\n    <Index type={type} businessId={businessId} API={API} userId={userId} />,\n    document.getElementById(id)\n  );\n  // registerServiceWorker();\n}\n\nwindow.renderComment = renderComment;\n\nrenderComment({\n  id: \"root-comment\",\n  type: 1,\n  businessId: \"test\"\n});\n\n// renderComment({\n//   id: \"root-comment\",\n//   type: 1,\n//   businessId: \"test\",\n//   API: 'http://api.links123.net/comment/v1',\n// });\n"]}

lib/lang/en-US.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var USdata = {
+  "editor.alreadyEntered": "already entered {count}/{maxLength}",
+  "editor.placeholder": "say...",
+  "editor.maxLength": "Input number must < {maxLength}",
+  "editor.SubmitBtn": "Submit",
+  "editor.uploadTip": "Upload Pictures",
+  "editor.uploadCount": "(You can also upload {count} images)",
+  "editor.uploadBtn": "upload",
+
+  "comment.tourist": "tourist",
+  "comment.totalComment": "total {total, plural, =1 {one comment} other {# comments}}",
+  "comment.reply": "reply",
+  "comment.moreComment": "More",
+
+  "reply.totalReply": "{total, plural, =1 {one reply} other {# replies}}",
+  "reply.moreReply": "More",
+  "reply.collapse": "clloasp reply",
+
+  "picture.collapse": "collapse",
+  "picture.viewOriginal": "view original picture",
+
+  "popConfirm.title": "Sure?",
+  "popConfirm.ok": "Ok",
+  "popConfirm.cancel": "Cancel",
+  "popConfirm.delete": "Delete",
+
+  "message.noMoreComment": "no more comment",
+  "message.noMoreData": "no more data",
+  "message.notNull": "comment not null",
+  "message.success": "comment success",
+  "message.replyNoNull": "reply not null",
+  "message.replySuccess": "reply success",
+  "message.cancelLickSuccess": "cancel like success",
+  "message.likeSuccess": "like success"
+};
+
+exports.default = USdata;
+//# sourceMappingURL=en-US.js.map

lib/lang/en-US.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/lang/en-US.js"],"names":["USdata"],"mappings":";;;;;AAAA,IAAMA,SAAS;AACb,2BAAyB,qCADZ;AAEb,wBAAsB,QAFT;AAGb,sBAAoB,iCAHP;AAIb,sBAAoB,QAJP;AAKb,sBAAoB,iBALP;AAMb,wBAAsB,sCANT;AAOb,sBAAoB,QAPP;;AASb,qBAAmB,SATN;AAUb,0BACE,4DAXW;AAYb,mBAAiB,OAZJ;AAab,yBAAuB,MAbV;;AAeb,sBAAoB,mDAfP;AAgBb,qBAAmB,MAhBN;AAiBb,oBAAkB,eAjBL;;AAmBb,sBAAoB,UAnBP;AAoBb,0BAAwB,uBApBX;;AAsBb,sBAAoB,OAtBP;AAuBb,mBAAiB,IAvBJ;AAwBb,uBAAqB,QAxBR;AAyBb,uBAAqB,QAzBR;;AA2Bb,2BAAyB,iBA3BZ;AA4Bb,wBAAsB,cA5BT;AA6Bb,qBAAmB,kBA7BN;AA8Bb,qBAAmB,iBA9BN;AA+Bb,yBAAuB,gBA/BV;AAgCb,0BAAwB,eAhCX;AAiCb,+BAA6B,qBAjChB;AAkCb,yBAAuB;AAlCV,CAAf;;kBAqCeA,M","file":"en-US.js","sourcesContent":["const USdata = {\n  \"editor.alreadyEntered\": \"already entered {count}/{maxLength}\",\n  \"editor.placeholder\": \"say...\",\n  \"editor.maxLength\": \"Input number must < {maxLength}\",\n  \"editor.SubmitBtn\": \"Submit\",\n  \"editor.uploadTip\": \"Upload Pictures\",\n  \"editor.uploadCount\": \"(You can also upload {count} images)\",\n  \"editor.uploadBtn\": \"upload\",\n\n  \"comment.tourist\": \"tourist\",\n  \"comment.totalComment\":\n    \"total {total, plural, =1 {one comment} other {# comments}}\",\n  \"comment.reply\": \"reply\",\n  \"comment.moreComment\": \"More\",\n\n  \"reply.totalReply\": \"{total, plural, =1 {one reply} other {# replies}}\",\n  \"reply.moreReply\": \"More\",\n  \"reply.collapse\": \"clloasp reply\",\n\n  \"picture.collapse\": \"collapse\",\n  \"picture.viewOriginal\": \"view original picture\",\n\n  \"popConfirm.title\": \"Sure?\",\n  \"popConfirm.ok\": \"Ok\",\n  \"popConfirm.cancel\": \"Cancel\",\n  \"popConfirm.delete\": \"Delete\",\n\n  \"message.noMoreComment\": \"no more comment\",\n  \"message.noMoreData\": \"no more data\",\n  \"message.notNull\": \"comment not null\",\n  \"message.success\": \"comment success\",\n  \"message.replyNoNull\": \"reply not null\",\n  \"message.replySuccess\": \"reply success\",\n  \"message.cancelLickSuccess\": \"cancel like success\",\n  \"message.likeSuccess\": \"like success\"\n};\n\nexport default USdata;\n"]}

lib/lang/index.js

@@ -3,20 +3,42 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-// 语言包
-// 英文短语和中文提示的对应
-var data = {
-  "not found": "没有数据",
-  "auth failed": "请先登录",
-  "create comment failed": "创建评论失败",
-  "comment favor failed": "评论点赞失败",
-  "delete comment favor failed": "评论取消点赞失败",
-  "get comments failed": "获取评论列表失败",
-  "create reply failed": "创建回复失败",
-  "reply favor failed": "回复点赞失败",
-  "delete reply favor failed": "删除回复点赞失败",
-  "get replies failed": "获取回复列表失败"
-};
+/**
+ * 当前支持的语言
+ */
+var SUPPORT_LOCALES = exports.SUPPORT_LOCALES = [{
+  name: "English",
+  value: "en-US"
+}, {
+  name: "简体中文",
+  value: "zh-CN"
+}];
 
-exports.default = data;
+// 服务端返回的英文短语和中文提示的对应
+var LOCALES_RESPONSE = exports.LOCALES_RESPONSE = {
+  "zh-CN": {
+    "not found": "没有数据",
+    "auth failed": "请先登录",
+    "create comment failed": "创建评论失败",
+    "comment favor failed": "评论点赞失败",
+    "delete comment favor failed": "评论取消点赞失败",
+    "get comments failed": "获取评论列表失败",
+    "create reply failed": "创建回复失败",
+    "reply favor failed": "回复点赞失败",
+    "delete reply favor failed": "删除回复点赞失败",
+    "get replies failed": "获取回复列表失败"
+  },
+  "en-US": {
+    "not found": "no data",
+    "auth failed": "please log in first",
+    "create comment failed": "Failed to create comment",
+    "comment favor failed": "Comment likes failure",
+    "delete comment favor failed": "评论取消点赞失败",
+    "get comments failed": "Comment cancels praise failure",
+    "create reply failed": "Create reply failed",
+    "reply favor failed": "Reply to praise failed",
+    "delete reply favor failed": "Delete reply clicks failed",
+    "get replies failed": "Failed to get reply list"
+  }
+};
 //# sourceMappingURL=index.js.map

lib/lang/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/lang/index.js"],"names":["data"],"mappings":";;;;;AAAA;AACA;AACA,IAAMA,OAAO;AACX,eAAa,MADF;AAEX,iBAAe,MAFJ;AAGX,2BAAyB,QAHd;AAIX,0BAAwB,QAJb;AAKX,iCAA+B,UALpB;AAMX,yBAAuB,UANZ;AAOX,yBAAuB,QAPZ;AAQX,wBAAsB,QARX;AASX,+BAA6B,UATlB;AAUX,wBAAsB;AAVX,CAAb;;kBAaeA,I","file":"index.js","sourcesContent":["// 语言包\n// 英文短语和中文提示的对应\nconst data = {\n  \"not found\": \"没有数据\",\n  \"auth failed\": \"请先登录\",\n  \"create comment failed\": \"创建评论失败\",\n  \"comment favor failed\": \"评论点赞失败\",\n  \"delete comment favor failed\": \"评论取消点赞失败\",\n  \"get comments failed\": \"获取评论列表失败\",\n  \"create reply failed\": \"创建回复失败\",\n  \"reply favor failed\": \"回复点赞失败\",\n  \"delete reply favor failed\": \"删除回复点赞失败\",\n  \"get replies failed\": \"获取回复列表失败\"\n};\n\nexport default data;\n"]}
+{"version":3,"sources":["../../src/lang/index.js"],"names":["SUPPORT_LOCALES","name","value","LOCALES_RESPONSE"],"mappings":";;;;;AAAA;;;AAGO,IAAMA,4CAAkB,CAC7B;AACEC,QAAM,SADR;AAEEC,SAAO;AAFT,CAD6B,EAK7B;AACED,QAAM,MADR;AAEEC,SAAO;AAFT,CAL6B,CAAxB;;AAWP;AACO,IAAMC,8CAAmB;AAC9B,WAAS;AACP,iBAAa,MADN;AAEP,mBAAe,MAFR;AAGP,6BAAyB,QAHlB;AAIP,4BAAwB,QAJjB;AAKP,mCAA+B,UALxB;AAMP,2BAAuB,UANhB;AAOP,2BAAuB,QAPhB;AAQP,0BAAsB,QARf;AASP,iCAA6B,UATtB;AAUP,0BAAsB;AAVf,GADqB;AAa9B,WAAS;AACP,iBAAa,SADN;AAEP,mBAAe,qBAFR;AAGP,6BAAyB,0BAHlB;AAIP,4BAAwB,uBAJjB;AAKP,mCAA+B,UALxB;AAMP,2BAAuB,gCANhB;AAOP,2BAAuB,qBAPhB;AAQP,0BAAsB,wBARf;AASP,iCAA6B,4BATtB;AAUP,0BAAsB;AAVf;AAbqB,CAAzB","file":"index.js","sourcesContent":["/**\n * 当前支持的语言\n */\nexport const SUPPORT_LOCALES = [\n  {\n    name: \"English\",\n    value: \"en-US\"\n  },\n  {\n    name: \"简体中文\",\n    value: \"zh-CN\"\n  }\n];\n\n// 服务端返回的英文短语和中文提示的对应\nexport const LOCALES_RESPONSE = {\n  \"zh-CN\": {\n    \"not found\": \"没有数据\",\n    \"auth failed\": \"请先登录\",\n    \"create comment failed\": \"创建评论失败\",\n    \"comment favor failed\": \"评论点赞失败\",\n    \"delete comment favor failed\": \"评论取消点赞失败\",\n    \"get comments failed\": \"获取评论列表失败\",\n    \"create reply failed\": \"创建回复失败\",\n    \"reply favor failed\": \"回复点赞失败\",\n    \"delete reply favor failed\": \"删除回复点赞失败\",\n    \"get replies failed\": \"获取回复列表失败\"\n  },\n  \"en-US\": {\n    \"not found\": \"no data\",\n    \"auth failed\": \"please log in first\",\n    \"create comment failed\": \"Failed to create comment\",\n    \"comment favor failed\": \"Comment likes failure\",\n    \"delete comment favor failed\": \"评论取消点赞失败\",\n    \"get comments failed\": \"Comment cancels praise failure\",\n    \"create reply failed\": \"Create reply failed\",\n    \"reply favor failed\": \"Reply to praise failed\",\n    \"delete reply favor failed\": \"Delete reply clicks failed\",\n    \"get replies failed\": \"Failed to get reply list\"\n  }\n};\n"]}

lib/lang/zh-CN.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var CNdata = {
+  "editor.alreadyEntered": "已输入{count}/140字",
+  "editor.placeholder": "说点什么吧...",
+  "editor.maxLength": "字数不过超过{maxLength}字",
+  "editor.SubmitBtn": "发表",
+  "editor.uploadTip": "上传图片",
+  "editor.uploadCount": "(您还能上传{count}张图片)",
+  "editor.uploadBtn": "上传",
+
+  "comment.tourist": "游客",
+  "comment.totalComment": "共{total}条评论",
+  "comment.reply": "回复",
+  "comment.moreComment": "查看更多评论",
+
+  "reply.totalReply": "{total}条回复",
+  "reply.moreReply": "查看更多回复",
+  "reply.collapse": "收起回复",
+
+  "picture.collapse": "收起",
+  "picture.viewOriginal": "查看原图",
+
+  "popConfirm.title": "确定要删除吗",
+  "popConfirm.ok": "确定",
+  "popConfirm.cancel": "取消",
+  "popConfirm.delete": "删除",
+
+  "message.noMoreComment": "没有更多评论了",
+  "message.noMoreData": "没有更多数据了！",
+  "message.notNull": "评论内容不能为空",
+  "message.success": "评论成功！",
+  "message.replyNoNull": "回复内容不能为空",
+  "message.replySuccess": "回复成功！",
+  "message.cancelLickSuccess": "取消点赞成功！",
+  "message.likeSuccess": "点赞成功！"
+};
+
+exports.default = CNdata;
+//# sourceMappingURL=zh-CN.js.map

lib/lang/zh-CN.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/lang/zh-CN.js"],"names":["CNdata"],"mappings":";;;;;AAAA,IAAMA,SAAS;AACb,2BAAyB,iBADZ;AAEb,wBAAsB,UAFT;AAGb,sBAAoB,oBAHP;AAIb,sBAAoB,IAJP;AAKb,sBAAoB,MALP;AAMb,wBAAsB,mBANT;AAOb,sBAAoB,IAPP;;AASb,qBAAmB,IATN;AAUb,0BAAwB,aAVX;AAWb,mBAAiB,IAXJ;AAYb,yBAAuB,QAZV;;AAcb,sBAAoB,YAdP;AAeb,qBAAmB,QAfN;AAgBb,oBAAkB,MAhBL;;AAkBb,sBAAoB,IAlBP;AAmBb,0BAAwB,MAnBX;;AAqBb,sBAAoB,QArBP;AAsBb,mBAAiB,IAtBJ;AAuBb,uBAAqB,IAvBR;AAwBb,uBAAqB,IAxBR;;AA0Bb,2BAAyB,SA1BZ;AA2Bb,wBAAsB,UA3BT;AA4Bb,qBAAmB,UA5BN;AA6Bb,qBAAmB,OA7BN;AA8Bb,yBAAuB,UA9BV;AA+Bb,0BAAwB,OA/BX;AAgCb,+BAA6B,SAhChB;AAiCb,yBAAuB;AAjCV,CAAf;;kBAoCeA,M","file":"zh-CN.js","sourcesContent":["const CNdata = {\n  \"editor.alreadyEntered\": \"已输入{count}/140字\",\n  \"editor.placeholder\": \"说点什么吧...\",\n  \"editor.maxLength\": \"字数不过超过{maxLength}字\",\n  \"editor.SubmitBtn\": \"发表\",\n  \"editor.uploadTip\": \"上传图片\",\n  \"editor.uploadCount\": \"(您还能上传{count}张图片)\",\n  \"editor.uploadBtn\": \"上传\",\n\n  \"comment.tourist\": \"游客\",\n  \"comment.totalComment\": \"共{total}条评论\",\n  \"comment.reply\": \"回复\",\n  \"comment.moreComment\": \"查看更多评论\",\n\n  \"reply.totalReply\": \"{total}条回复\",\n  \"reply.moreReply\": \"查看更多回复\",\n  \"reply.collapse\": \"收起回复\",\n\n  \"picture.collapse\": \"收起\",\n  \"picture.viewOriginal\": \"查看原图\",\n\n  \"popConfirm.title\": \"确定要删除吗\",\n  \"popConfirm.ok\": \"确定\",\n  \"popConfirm.cancel\": \"取消\",\n  \"popConfirm.delete\": \"删除\",\n\n  \"message.noMoreComment\": \"没有更多评论了\",\n  \"message.noMoreData\": \"没有更多数据了！\",\n  \"message.notNull\": \"评论内容不能为空\",\n  \"message.success\": \"评论成功！\",\n  \"message.replyNoNull\": \"回复内容不能为空\",\n  \"message.replySuccess\": \"回复成功！\",\n  \"message.cancelLickSuccess\": \"取消点赞成功！\",\n  \"message.likeSuccess\": \"点赞成功！\"\n};\n\nexport default CNdata;\n"]}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "comment",
-  "version": "0.5.13",
+  "version": "0.5.14",
   "main": "lib/App.js",
   "description": "通用评论",
   "keywords": [

src/App.js

@@ -3,7 +3,7 @@ import PropTypes from "prop-types";
 import { message } from "antd";
 import axios from "axios";
 import intl from "react-intl-universal";
-import { ERROR_DEFAULT, LIMIT } from "./constant";
+import { ERROR_DEFAULT, LIMIT, COMMENT_TYPE } from "./constant";
 import { CommentContext } from "./Comment";
 import { isFunction } from "./helper";
 import CommentInput from "./components/CommentInput";
@@ -265,6 +265,7 @@ class App extends Component {
         const { list, total } = this.state;
         const res = list.filter(item => item.id !== commentId);
         this.setState({ list: res, total: total - 1 });
+        this.props.onDelete(COMMENT_TYPE.COMMENT);
       })
       .catch(this.errorHandler)
       .finally(() => {
@@ -335,6 +336,7 @@ class App extends Component {
           return item;
         });
         this.setState({ list });
+        this.props.onDelete(COMMENT_TYPE.REPLY);
       })
       .catch(this.errorHandler)
       .finally(() => {
@@ -491,6 +493,7 @@ App.propTypes = {
   pageType: PropTypes.string, // 分页类型
   page: PropTypes.number, // 页码
   onPageChange: PropTypes.func, // 页码变化回调
+  onDelete: PropTypes.func,
   locales: PropTypes.string //  传入的语言环境， en-US/zh-CN
 };
 
@@ -503,7 +506,8 @@ App.defaultProps = {
   showAlertFavor: false,
   showError: true,
   pageType: "more",
-  onPageChange: page => {}
+  onPageChange: page => {},
+  onDelete: () => {}
 };
 
 export { Editor, RenderText };

src/components/Editor/index.js

@@ -244,7 +244,8 @@ class Editor extends React.Component {
               {showUpload ? (
                 <Popover
                   trigger="click"
-                  visible={this.state.showUpload}
+                  // TODO: 针对非 react.js，直接使用 click 事件来控制展开或关闭
+                  // visible={this.state.showUpload}
                   overlayStyle={{ zIndex: 999 }}
                   onVisibleChange={
                     closeUploadWhenBlur
@@ -279,13 +280,14 @@ class Editor extends React.Component {
                         {intl.get("editor.uploadTip")}
                         {maxUpload >= 2 ? (
                           <span style={{ color: "#666", fontWeight: 400 }}>
-                            {intl.get("editor.uploadCount", {
-                              count: maxUpload - this.state.fileList.length
-                            })}
+                            (您还能上传
+                            {maxUpload - this.state.fileList.length}
+                            张图片)
                           </span>
                         ) : null}
                       </span>
-                      <Icon
+                      {/* 因为是点击别的区域关闭，所以不用右上角的 Icon */}
+                      {/* <Icon
                         type="close"
                         onClick={() => this.handleShowUpload(false)}
                         style={{
@@ -293,7 +295,7 @@ class Editor extends React.Component {
                           cursor: "pointer",
                           marginTop: 4
                         }}
-                      />
+                      /> */}
                     </div>
                   }
                 >

src/constant.js

@@ -21,3 +21,8 @@ export const IMAGE_SPLIT = "IMAGE_SPLIT";
 export const IMAGE_PROCESS = "?x-oss-process=image/resize,h_350";
 export const IMAGE_PROCESS_SMALL = "?x-oss-process=image/resize,h_100";
 export const IMAGE_PROCESS_LARGE = "?x-oss-process=image/resize,h_500";
+
+export const COMMENT_TYPE = {
+  COMMENT: "comment",
+  REPLY: "reply"
+};

src/index.js

@@ -15,21 +15,35 @@ const Index = props => (
  *  - {string} id 渲染评论的DOM的 ID
  *  - {number} type 评论的 type
  *  - {string} businessId 评论的 businessId
+ *  - {string} API, API 前缀, 默认 http://api.links123.net/comment/v1
  */
 function renderComment(config) {
   if (!config.id) {
     throw new Error("id is required");
   }
-  if (!config.id) {
+  if (!config.type) {
     throw new Error("type is required");
   }
-  if (!config.id) {
-    throw new Error("businessId is required");
+  if (!config.businessId) {
+    // throw new Error("businessId is required");
+    console.warn("没有传入 businessId 参数，默认使用: test");
   }
-  const { id, type = 1, businessId = "test" } = config;
+  if (!config.API) {
+    // throw new Error("API is required");
+    console.warn(
+      "没有传入 API 参数，默认使用: http://api.links123.net/comment/v1"
+    );
+  }
+  const {
+    id,
+    type = 1,
+    businessId = "test",
+    API = "http://api.links123.net/comment/v1",
+    userId
+  } = config;
 
   ReactDOM.render(
-    <Index type={type} businessId={businessId} />,
+    <Index type={type} businessId={businessId} API={API} userId={userId} />,
     document.getElementById(id)
   );
   // registerServiceWorker();
@@ -42,3 +56,10 @@ renderComment({
   type: 1,
   businessId: "test"
 });
+
+// renderComment({
+//   id: "root-comment",
+//   type: 1,
+//   businessId: "test",
+//   API: 'http://api.links123.net/comment/v1',
+// });