Browse Source

Merge remote-tracking branch 'upstream/master'

cloudzqy 5 years ago
parent
commit
b397440216
52 changed files with 772 additions and 388 deletions
  1. 15
    0
      CHANGELOG.md
  2. 52
    47
      README.md
  3. 1
    1
      assets/example.html
  4. 2
    0
      assets/static/js/main.2b09a9d7.js
  5. 1
    0
      assets/static/js/main.2b09a9d7.js.map
  6. 0
    2
      assets/static/js/main.426815d8.js
  7. 0
    1
      assets/static/js/main.426815d8.js.map
  8. 134
    66
      lib/App.js
  9. 1
    1
      lib/App.js.map
  10. 0
    12
      lib/CHANGELOG.md
  11. 7
    2
      lib/components/CommentBox/index.js
  12. 1
    1
      lib/components/CommentBox/index.js.map
  13. 5
    2
      lib/components/CommentInput/index.js
  14. 1
    1
      lib/components/CommentInput/index.js.map
  15. 22
    9
      lib/components/CommentList/index.js
  16. 1
    1
      lib/components/CommentList/index.js.map
  17. 24
    10
      lib/components/ContentItem/index.js
  18. 1
    1
      lib/components/ContentItem/index.js.map
  19. 5
    1
      lib/components/Editor/Upload.js
  20. 1
    1
      lib/components/Editor/Upload.js.map
  21. 13
    12
      lib/components/Editor/index.js
  22. 1
    1
      lib/components/Editor/index.js.map
  23. 7
    2
      lib/components/ImagePreviewer/ImagePreviewer.js
  24. 1
    1
      lib/components/ImagePreviewer/ImagePreviewer.js.map
  25. 1
    0
      lib/index.example.js
  26. 1
    1
      lib/index.example.js.map
  27. 17
    11
      lib/index.js
  28. 1
    1
      lib/index.js.map
  29. 43
    0
      lib/lang/en-US.js
  30. 1
    0
      lib/lang/en-US.js.map
  31. 37
    15
      lib/lang/index.js
  32. 1
    1
      lib/lang/index.js.map
  33. 43
    0
      lib/lang/zh-CN.js
  34. 1
    0
      lib/lang/zh-CN.js.map
  35. 0
    72
      lib/mock.js
  36. 0
    1
      lib/mock.js.map
  37. 2
    1
      package.json
  38. 21
    0
      public/locales/en-US.json
  39. 21
    0
      public/locales/zh-CN.json
  40. 91
    28
      src/App.js
  41. 3
    2
      src/components/CommentBox/index.js
  42. 5
    3
      src/components/CommentInput/index.js
  43. 4
    2
      src/components/CommentList/index.js
  44. 27
    29
      src/components/ContentItem/index.js
  45. 2
    1
      src/components/Editor/Upload.js
  46. 17
    8
      src/components/Editor/index.js
  47. 3
    2
      src/components/ImagePreviewer/ImagePreviewer.jsx
  48. 1
    0
      src/index.example.js
  49. 18
    20
      src/index.js
  50. 38
    0
      src/lang/en-US.js
  51. 40
    15
      src/lang/index.js
  52. 37
    0
      src/lang/zh-CN.js

+ 15
- 0
CHANGELOG.md View File

@@ -1,6 +1,21 @@
1 1
 # CHANGELOG
2 2
 
3
+## 1.0.2
4
+- [x] App增加onCountChange回调
5
+
6
+## 1.0.1
7
+- [x] App增加business_user_id属性
8
+
9
+## 1.0.0
10
+
11
+- [x] 完成通用评论国际化
12
+
13
+## 0.6.0
14
+
15
+- [x] 添加pageType slice,用于截断评论,点击查看更多回调进行跳转
16
+
3 17
 ## 0.5.14
18
+
4 19
 - [x] 增加onDelete回调
5 20
 
6 21
 ## 0.5.13

+ 52
- 47
README.md View File

@@ -2,7 +2,7 @@
2 2
 
3 3
 通用评论系统及编辑器
4 4
 
5
-**`version 0.5.14`**
5
+**`version 1.0.2`**
6 6
 
7 7
 ```js
8 8
 import Comment, { Editor, RenderText } from 'comment';
@@ -177,62 +177,67 @@ main();
177 177
 解决办法就是使用 [`fix/classname`](https://git.links123.net/node/npmcomment/src/branch/fix/classname) 分支中的静态文件:
178 178
 
179 179
 - [https://git.links123.net/node/npmcomment/src/branch/fix/classname](https://git.links123.net/node/npmcomment/src/branch/fix/classname)
180
+- 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
+
182
+
183
+> 尝试过使用 CSS Module 进行修改,不过改造量较大,改动的过程中影响了其他样式,所以暂时放弃了。
180 184
 
181
-尝试过使用 CSS Module 进行修改,不过改造量较大,改动的过程中影响了其他样式,所以暂时放弃了。
182 185
 
183 186
 ## Comment
184 187
 
185 188
 - 标记了`deprecated`的配置项表示不推荐使用,并且可能在将来版本中不再受支持。
186 189
 
187 190
 
188
-| props            | type           | default                            | required | description                                                                           |
189
-| ---------------- | -------------- | ---------------------------------- | -------- | ------------------------------------------------------------------------------------- |
190
-| type             | number         |                                    | true     | 评论的 type                                                                           |
191
-| businessId       | string         |                                    | true     | 评论的 business id                                                                    |
192
-| API              | string         | http://api.links123.net/comment/v1 | false    | API 前缀                                                                              |
193
-| showList         | boolean        | true                               | false    | 是否显示评论列表                                                                      |
194
-| showEditor       | boolean        | true                               | false    | 是否显示评论输入框                                                                    |
195
-| showAlertComment | boolean        | false                              | false    | 评论成功之后,是否通过 Antd 的 Message 组件进行提示                                   |
196
-| showAlertReply   | boolean        | false                              | false    | 回复成功之后,是否通过 Antd 的 Message 组件进行提示                                   |
197
-| showAlertFavor   | boolean        | false                              | false    | 点赞/取消点赞成功之后,是否通过 Antd 的 Message 组件进行提示                          |
198
-| showError        | boolean        | true                               | false    | 是否使用Antd的Message组件提示错误信息                                                 |
199
-| onError          | function(msg)  |                                    | false    | 错误回调, 出错了会被调用                                                              |
200
-| userId           | number         |                                    | false    | 用户id, comment内部不维护用户id, 调用组件时传递过来, 目前用于判断是否显示删除按钮     |
201
-| token            | string         |                                    | false    | [deprecated] token,用于身份认证,非必须。默认使用 cookie                             |
202
-| pageType         | string         | more                               | false    | 分页类别, more-加载更多 pagination-页码                                              |
203
-| page             | number         |                                    | false    | 页码受控模式,如果传递了此参数,则需要通过onPageChange回调手动维护page.                 |
204
-| limit             | number         |10                                  | false    | 一次加载的评论数量            |
205
-| onGetMoreBtnClick      | function() |                                    | false    | 点击查看更多按钮的回调                            |
206
-| onPageChange     | function(page) |                                    | false    | 页码发生变化时的回调,注意:分页数据获取还是在组件内部处理的                            |
207
-| onDelete         | function(type) |                                    | false    | 评论或回复删除成功后的回调, type: "comment" \| "reply" , 用于区分删除的是评论还是回复 |
208
-
191
+| props             | type            | default                            | required | description                                       |                          |
192
+|-------------------|-----------------|------------------------------------|----------|---------------------------------------------------|--------------------------|
193
+| type              | number          |                                    | true     | 评论的 type                                          |                          |
194
+| businessId        | string          |                                    | true     | 评论的 business id                                   |                          |
195
+| API               | string          | http://api.links123.net/comment/v1 | false    | API 前缀                                            |                          |
196
+| showList          | boolean         | true                               | false    | 是否显示评论列表                                          |                          |
197
+| showEditor        | boolean         | true                               | false    | 是否显示评论输入框                                         |                          |
198
+| showAlertComment  | boolean         | false                              | false    | 评论成功之后,是否通过 Antd 的 Message 组件进行提示                 |                          |
199
+| showAlertReply    | boolean         | false                              | false    | 回复成功之后,是否通过 Antd 的 Message 组件进行提示                 |                          |
200
+| showAlertFavor    | boolean         | false                              | false    | 点赞/取消点赞成功之后,是否通过 Antd 的 Message 组件进行提示            |                          |
201
+| showError         | boolean         | true                               | false    | 是否使用Antd的Message组件提示错误信息                          |                          |
202
+| onError           | function(msg)   |                                    | false    | 错误回调, 出错了会被调用                                     |                          |
203
+| userId            | number          |                                    | false    | 用户id, comment内部不维护用户id, 调用组件时传递过来, 目前用于判断是否显示删除按钮 |                          |
204
+| token             | string          |                                    | false    | [deprecated] token,用于身份认证,非必须。默认使用 cookie         |                          |
205
+| pageType          | string          | more                               | false    | 分页类别, more-加载更多 pagination-页码                     |                          |
206
+| page              | number          |                                    | false    | 页码受控模式,如果传递了此参数,则需要通过onPageChange回调手动维护page.      |                          |
207
+| limit             | number          | 10                                 | false    | 一次加载的评论数量                                         |                          |
208
+| onGetMoreBtnClick | function()      |                                    | false    | 点击查看更多按钮的回调                                       |                          |
209
+| onPageChange      | function(page)  |                                    | false    | 页码发生变化时的回调,注意:分页数据获取还是在组件内部处理的                    |                          |
210
+| onDelete          | function(type)  |                                    | false    | 评论或回复删除成功后的回调, type: "comment" \                  | "reply" , 用于区分删除的是评论还是回复 |
211
+| locales           | string          | 语言                                 | false    |                                                   |                          |
212
+| businessUserId    | number          |                                    | false    | 评论目标的用户id, 用于发送通知                                 |                          |
213
+| onCountChange     | function(count) |                                    | false    | 评论数量发生变更时的回调(初次获取也会调用)                            |                          |
209 214
 
210 215
 ## Editor
211 216
 
212
-| props               | type                            | default       | required | description                                                                                       |
213
-| ------------------- | ------------------------------- | ------------- | -------- | ------------------------------------------------------------------------------------------------- |
214
-| rows                | number                          | 5             | false    | 编辑器的高度。默认情况下,回复评论/回复回复的编辑器会比评论的编辑器高度小一行                     |
215
-| placeholder         | string                          | 说点什么吧... | false    | 评论的中的提示文字                                                                                |
216
-| showEmoji           | boolean                         | true          | false    | 是否显示 Toolbar 中表情工具                                                                       |
217
-| showUpload          | boolean                         | true          | false    | 是否显示 Toolbar 中 上传图片工具                                                                  |
218
-| maxUpload           | number                          | 1             | false    | 最大能够上传的图片数量                                                                            |
219
-| value               | string                          |               | false    | 编辑器的值。如果设置了该属性,则编辑器变为受控组件,需要父组件来维护 value                        |
220
-| onChange            | function(value)                 |               | false    | 编辑器内容改变的回调函数                                                                          |
221
-| onSubmit            | function({ text, files })       |               | false    | 点击提交按钮的回调函数,text 为编辑器的文本,files 为上传的文件列表                               |
222
-| beforeSubmit        | function ({text,files}):Promise |               | false    | 点击提交按钮后的钩子, 若Promise resolve false则不触发onSubmit函数, 主要用于控制默认的submit行为   |
223
-| onCommentSuccess    | function()                      |               | false    | 提交评论成功后的回调                                                                              |
224
-| btnSubmitText       | string                          | 发表          | false    | 提交按钮的文字                                                                                    |
225
-| btnLoading          | boolean                         | false         | false    | 按钮是否正在加载中                                                                                |
226
-| btnDisable          | boolean                         | false         | false    | 按钮是否禁用                                                                                      |
227
-| button              | ReactNode                       |               | false    | 按钮组件。如果上面几个 btn 相关的属性都无法满足要求,则可以使用 button 来自定义提交编辑器值的按钮 |
228
-| emojiToolIcon       | ReactNode                       |               | false    | Toolbar 中表情的图标                                                                              |
229
-| imageToolIcon       | ReactNode                       |               | false    | Toolbar 中上传文件的图标                                                                          |
230
-| onRef               | function                        |               | false    | 传递子组件的引用                                                                                  |
231
-| closeUploadWhenBlur | boolean                         |               | false    | 当 upload 失去焦点(鼠标点击非 Upload 的区域)的时候,是否自动关闭 Popover                        |
232
-| showError           | boolean                         | true          | false    | 是否使用Antd的Message组件提示错误信息, 主要是上传图片出错的情况                                   |
233
-| onError             | function(msg,{response})        |               | false    | 错误回调, 出错了会被调用, 主要是上传图片出错的情况                                                |
234
-| maxLength           | number                          | 140           | false    | 限制最大输入字数                                                                                  |
235
-| autoFocus           | boolean                         | false         | false    | 编辑器自动聚焦                                                                                    |
217
+| props               | type                            | default  | required | description                                                         |
218
+|---------------------|---------------------------------|----------|----------|---------------------------------------------------------------------|
219
+| rows                | number                          | 5        | false    | 编辑器的高度。默认情况下,回复评论/回复回复的编辑器会比评论的编辑器高度小一行                             |
220
+| placeholder         | string                          | 说点什么吧... | false    | 评论的中的提示文字                                                           |
221
+| showEmoji           | boolean                         | true     | false    | 是否显示 Toolbar 中表情工具                                                  |
222
+| showUpload          | boolean                         | true     | false    | 是否显示 Toolbar 中 上传图片工具                                               |
223
+| maxUpload           | number                          | 1        | false    | 最大能够上传的图片数量                                                         |
224
+| value               | string                          |          | false    | 编辑器的值。如果设置了该属性,则编辑器变为受控组件,需要父组件来维护 value                            |
225
+| onChange            | function(value)                 |          | false    | 编辑器内容改变的回调函数                                                        |
226
+| onSubmit            | function({ text, files })       |          | false    | 点击提交按钮的回调函数,text 为编辑器的文本,files 为上传的文件列表                             |
227
+| beforeSubmit        | function ({text,files}):Promise |          | false    | 点击提交按钮后的钩子, 若Promise resolve false则不触发onSubmit函数, 主要用于控制默认的submit行为 |
228
+| onCommentSuccess    | function()                      |          | false    | 提交评论成功后的回调                                                          |
229
+| btnSubmitText       | string                          | 发表       | false    | 提交按钮的文字                                                             |
230
+| btnLoading          | boolean                         | false    | false    | 按钮是否正在加载中                                                           |
231
+| btnDisable          | boolean                         | false    | false    | 按钮是否禁用                                                              |
232
+| button              | ReactNode                       |          | false    | 按钮组件。如果上面几个 btn 相关的属性都无法满足要求,则可以使用 button 来自定义提交编辑器值的按钮             |
233
+| emojiToolIcon       | ReactNode                       |          | false    | Toolbar 中表情的图标                                                      |
234
+| imageToolIcon       | ReactNode                       |          | false    | Toolbar 中上传文件的图标                                                    |
235
+| onRef               | function                        |          | false    | 传递子组件的引用                                                            |
236
+| closeUploadWhenBlur | boolean                         |          | false    | 当 upload 失去焦点(鼠标点击非 Upload 的区域)的时候,是否自动关闭 Popover                   |
237
+| showError           | boolean                         | true     | false    | 是否使用Antd的Message组件提示错误信息, 主要是上传图片出错的情况                              |
238
+| onError             | function(msg,{response})        |          | false    | 错误回调, 出错了会被调用, 主要是上传图片出错的情况                                         |
239
+| maxLength           | number                          | 140      | false    | 限制最大输入字数                                                            |
240
+| autoFocus           | boolean                         | false    | false    | 编辑器自动聚焦                                                             |
236 241
 
237 242
 
238 243
 ### 什么时候不要使用 value/onChange/onSubmit

+ 1
- 1
assets/example.html View File

@@ -20,7 +20,7 @@
20 20
   </div>
21 21
   
22 22
   <script src="http://gosspublic.alicdn.com/aliyun-oss-sdk.min.js"></script>
23
-  <script type="text/javascript" src="./static/js/main.426815d8.js"></script>
23
+  <script type="text/javascript" src="./static/js/main.2b09a9d7.js"></script>
24 24
   <script type="text/javascript" src="example.js"></script>
25 25
 </body>
26 26
 </html>

+ 2
- 0
assets/static/js/main.2b09a9d7.js
File diff suppressed because it is too large
View File


+ 1
- 0
assets/static/js/main.2b09a9d7.js.map
File diff suppressed because it is too large
View File


+ 0
- 2
assets/static/js/main.426815d8.js
File diff suppressed because it is too large
View File


+ 0
- 1
assets/static/js/main.426815d8.js.map
File diff suppressed because it is too large
View File


+ 134
- 66
lib/App.js View File

@@ -27,6 +27,10 @@ var _axios = require("axios");
27 27
 
28 28
 var _axios2 = _interopRequireDefault(_axios);
29 29
 
30
+var _reactIntlUniversal = require("react-intl-universal");
31
+
32
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
33
+
30 34
 var _constant = require("./constant");
31 35
 
32 36
 var _Comment = require("./Comment");
@@ -51,19 +55,30 @@ var _RenderText2 = _interopRequireDefault(_RenderText);
51 55
 
52 56
 var _lang = require("./lang");
53 57
 
54
-var _lang2 = _interopRequireDefault(_lang);
58
+var _enUS = require("./lang/en-US.js");
59
+
60
+var _enUS2 = _interopRequireDefault(_enUS);
61
+
62
+var _zhCN = require("./lang/zh-CN.js");
63
+
64
+var _zhCN2 = _interopRequireDefault(_zhCN);
55 65
 
56 66
 require("./App.css");
57 67
 
58 68
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
59 69
 
70
+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; }
71
+
60 72
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
61 73
 
62 74
 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; }
63 75
 
64 76
 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; }
65 77
 
66
-// import styles from "./App.module.css";
78
+var LOCALES = {
79
+  "zh-CN": _zhCN2.default,
80
+  "en-US": _enUS2.default
81
+};
67 82
 
68 83
 var App = function (_Component) {
69 84
   _inherits(App, _Component);
@@ -84,7 +99,9 @@ var App = function (_Component) {
84 99
       page: 1,
85 100
       total: 0,
86 101
       // 是否没有更多评论了
87
-      isNoMoreComment: false
102
+      isNoMoreComment: false,
103
+      initDone: false,
104
+      locale: "zh-CN"
88 105
     };
89 106
     _this.handleChangeLoading = _this.handleChangeLoading.bind(_this);
90 107
     _this.sCreateComment = _this.sCreateComment.bind(_this);
@@ -111,7 +128,38 @@ var App = function (_Component) {
111 128
     }
112 129
   }, {
113 130
     key: "componentDidMount",
114
-    value: function componentDidMount() {}
131
+    value: function componentDidMount() {
132
+      this.loadLocales();
133
+    }
134
+
135
+    /**
136
+     * 加载语言包
137
+     * 只能根据url或者传入的props来确定加载哪个语言包
138
+     * 优先级:传入的props > url
139
+     */
140
+
141
+  }, {
142
+    key: "loadLocales",
143
+    value: function loadLocales() {
144
+      var _this2 = this;
145
+
146
+      var currentLocale = this.props.locales;
147
+
148
+      if (!currentLocale) {
149
+        currentLocale = _reactIntlUniversal2.default.determineLocale({
150
+          urlLocaleKey: "lang"
151
+        });
152
+      }
153
+      currentLocale = _lang.SUPPORT_LOCALES.find(function (item) {
154
+        return item.value === currentLocale;
155
+      }) ? currentLocale : "zh-CN";
156
+      _reactIntlUniversal2.default.init({
157
+        currentLocale: currentLocale,
158
+        locales: _defineProperty({}, currentLocale, LOCALES[currentLocale])
159
+      }).then(function () {
160
+        _this2.setState({ initDone: true, locale: currentLocale });
161
+      });
162
+    }
115 163
   }, {
116 164
     key: "error",
117 165
     value: function error(msg) {
@@ -127,13 +175,16 @@ var App = function (_Component) {
127 175
   }, {
128 176
     key: "errorHandler",
129 177
     value: function errorHandler(error) {
178
+      var locale = this.state.locale;
179
+
180
+      var localResponse = _lang.LOCALES_RESPONSE[locale];
130 181
       if (error.response && error.response.data && error.response.data.msg) {
131
-        this.error(_lang2.default[error.response.data.msg] || _constant.ERROR_DEFAULT, {
182
+        this.error(localResponse[error.response.data.msg] || _constant.ERROR_DEFAULT, {
132 183
           response: error.response
133 184
         });
134 185
         return;
135 186
       }
136
-      this.error(_lang2.default[error.message] || _constant.ERROR_DEFAULT, {
187
+      this.error(localResponse[error.response.data.msg] || _constant.ERROR_DEFAULT, {
137 188
         response: error.response
138 189
       });
139 190
     }
@@ -160,7 +211,7 @@ var App = function (_Component) {
160 211
   }, {
161 212
     key: "sGetComment",
162 213
     value: function sGetComment() {
163
-      var _this2 = this;
214
+      var _this3 = this;
164 215
 
165 216
       var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
166 217
           _ref$page = _ref.page,
@@ -172,9 +223,10 @@ var App = function (_Component) {
172 223
       var _props = this.props,
173 224
           API = _props.API,
174 225
           type = _props.type,
175
-          businessId = _props.businessId;
226
+          businessId = _props.businessId,
227
+          limit = _props.limit;
176 228
 
177
-      this.axios.get(API + "/comments?type=" + type + "&business_id=" + businessId + "&page=" + page + "&limit=" + _constant.LIMIT).then(function (response) {
229
+      this.axios.get(API + "/comments?type=" + type + "&business_id=" + businessId + "&page=" + page + "&limit=" + limit).then(function (response) {
178 230
         var _response$data = response.data,
179 231
             list = _response$data.list,
180 232
             page = _response$data.page,
@@ -182,7 +234,7 @@ var App = function (_Component) {
182 234
 
183 235
         if (list) {
184 236
           var newList = list;
185
-          var oldList = _this2.state.list;
237
+          var oldList = _this3.state.list;
186 238
 
187 239
           if (pageType === "more") {
188 240
             if (page > 1) {
@@ -197,19 +249,20 @@ var App = function (_Component) {
197 249
             window.scrollTo(0, 0);
198 250
           }
199 251
 
200
-          _this2.setState({
252
+          _this3.setState({
201 253
             list: newList,
202 254
             page: page,
203 255
             total: total
204 256
           });
257
+          _this3.props.onCountChange(total);
205 258
         } else {
206
-          _message3.default.info("没有更多评论了");
207
-          _this2.setState({
259
+          _message3.default.info(_reactIntlUniversal2.default.get("message.noMoreComment"));
260
+          _this3.setState({
208 261
             isNoMoreComment: true
209 262
           });
210 263
         }
211 264
       }).catch(this.errorHandler).finally(function () {
212
-        _this2.handleChangeLoading("sGetComment", false);
265
+        _this3.handleChangeLoading("sGetComment", false);
213 266
       });
214 267
     }
215 268
 
@@ -220,7 +273,7 @@ var App = function (_Component) {
220 273
   }, {
221 274
     key: "sGetReply",
222 275
     value: function sGetReply() {
223
-      var _this3 = this;
276
+      var _this4 = this;
224 277
 
225 278
       var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
226 279
           commentId = _ref2.commentId,
@@ -228,13 +281,15 @@ var App = function (_Component) {
228 281
           page = _ref2$page === undefined ? 1 : _ref2$page;
229 282
 
230 283
       this.handleChangeLoading("sGetReply", true);
231
-      var API = this.props.API;
284
+      var _props2 = this.props,
285
+          API = _props2.API,
286
+          limit = _props2.limit;
232 287
 
233
-      this.axios.get(API + "/replies?comment_id=" + commentId + "&page=" + page + "&limit=" + _constant.LIMIT).then(function (response) {
288
+      this.axios.get(API + "/replies?comment_id=" + commentId + "&page=" + page + "&limit=" + limit).then(function (response) {
234 289
         if (!response.data.list) {
235
-          _message3.default.info("没有更多数据了!");
290
+          _message3.default.info(_reactIntlUniversal2.default.get("message.noMoreData"));
236 291
         }
237
-        var list = _this3.state.list.map(function (item) {
292
+        var list = _this4.state.list.map(function (item) {
238 293
           if (item.id === commentId) {
239 294
             if (!item.replies) item.replies = [];
240 295
             if (response.data.list) {
@@ -256,9 +311,9 @@ var App = function (_Component) {
256 311
           }
257 312
           return item;
258 313
         });
259
-        _this3.setState({ list: list });
314
+        _this4.setState({ list: list });
260 315
       }).catch(this.errorHandler).finally(function () {
261
-        _this3.handleChangeLoading("sGetReply", false);
316
+        _this4.handleChangeLoading("sGetReply", false);
262 317
       });
263 318
     }
264 319
 
@@ -270,46 +325,49 @@ var App = function (_Component) {
270 325
   }, {
271 326
     key: "sCreateComment",
272 327
     value: function sCreateComment() {
273
-      var _this4 = this;
328
+      var _this5 = this;
274 329
 
275 330
       var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
276 331
           content = _ref3.content;
277 332
 
278 333
       var cb = arguments[1];
279 334
 
280
-      if (!content) return this.error("评论内容不能为空 ");
335
+      if (!content) return this.error(_reactIntlUniversal2.default.get("message.notNull"));
281 336
       this.handleChangeLoading("sCreateComment", true);
282
-      var _props2 = this.props,
283
-          API = _props2.API,
284
-          type = _props2.type,
285
-          businessId = _props2.businessId;
337
+      var _props3 = this.props,
338
+          API = _props3.API,
339
+          type = _props3.type,
340
+          businessId = _props3.businessId,
341
+          businessUserId = _props3.businessUserId;
286 342
 
287 343
       this.axios(API + "/comments", {
288 344
         method: "post",
289 345
         data: {
290 346
           type: type,
291 347
           business_id: businessId,
348
+          business_user_id: businessUserId,
292 349
           content: content
293 350
         },
294 351
         withCredentials: true
295 352
       }).then(function (response) {
296
-        if (_this4.props.showAlertComment) {
297
-          _message3.default.success("评论成功!");
353
+        if (_this5.props.showAlertComment) {
354
+          _message3.default.success(_reactIntlUniversal2.default.get("message.success"));
298 355
         }
299 356
         if ((0, _helper.isFunction)(cb)) cb();
300 357
         // 将数据写入到 list 中
301 358
         // 临时插入
302 359
         // 等到获取数据之后,删除临时数据
303
-        var _state = _this4.state,
360
+        var _state = _this5.state,
304 361
             list = _state.list,
305 362
             total = _state.total;
306 363
 
307 364
         list.unshift(_extends({}, response.data, {
308 365
           isTemporary: true // 临时的数据
309 366
         }));
310
-        _this4.setState({ list: list, total: total + 1 });
367
+        _this5.setState({ list: list, total: total + 1 });
368
+        _this5.props.onCountChange(total + 1);
311 369
       }).catch(this.errorHandler).finally(function () {
312
-        _this4.handleChangeLoading("sCreateComment", false);
370
+        _this5.handleChangeLoading("sCreateComment", false);
313 371
       });
314 372
     }
315 373
 
@@ -320,7 +378,7 @@ var App = function (_Component) {
320 378
   }, {
321 379
     key: "sDeleteComment",
322 380
     value: function sDeleteComment(commentId) {
323
-      var _this5 = this;
381
+      var _this6 = this;
324 382
 
325 383
       this.handleChangeLoading("sDeleteComment", true);
326 384
       var API = this.props.API;
@@ -329,17 +387,18 @@ var App = function (_Component) {
329 387
         method: "delete",
330 388
         withCredentials: true
331 389
       }).then(function () {
332
-        var _state2 = _this5.state,
390
+        var _state2 = _this6.state,
333 391
             list = _state2.list,
334 392
             total = _state2.total;
335 393
 
336 394
         var res = list.filter(function (item) {
337 395
           return item.id !== commentId;
338 396
         });
339
-        _this5.setState({ list: res, total: total - 1 });
340
-        _this5.props.onDelete(_constant.COMMENT_TYPE.COMMENT);
397
+        _this6.setState({ list: res, total: total - 1 });
398
+        _this6.props.onDelete(_constant.COMMENT_TYPE.COMMENT);
399
+        _this6.props.onCountChange(total - 1);
341 400
       }).catch(this.errorHandler).finally(function () {
342
-        _this5.handleChangeLoading("sDeleteComment", false);
401
+        _this6.handleChangeLoading("sDeleteComment", false);
343 402
       });
344 403
     }
345 404
 
@@ -352,9 +411,9 @@ var App = function (_Component) {
352 411
   }, {
353 412
     key: "sCreateReply",
354 413
     value: function sCreateReply(data, cb) {
355
-      var _this6 = this;
414
+      var _this7 = this;
356 415
 
357
-      if (!data.content) return this.error("回复内容不能为空 ");
416
+      if (!data.content) return this.error(_reactIntlUniversal2.default.get("message.replyNoNull"));
358 417
       this.handleChangeLoading("sCreateReply", true);
359 418
       var API = this.props.API;
360 419
 
@@ -363,14 +422,14 @@ var App = function (_Component) {
363 422
         data: data,
364 423
         withCredentials: true
365 424
       }).then(function (response) {
366
-        if (_this6.props.showAlertReply) {
367
-          _message3.default.success("回复成功!");
425
+        if (_this7.props.showAlertReply) {
426
+          _message3.default.success(_reactIntlUniversal2.default.get("message.replySuccess"));
368 427
         }
369 428
         if ((0, _helper.isFunction)(cb)) cb();
370 429
         // 将数据写入到 list 中
371 430
         // 临时插入
372 431
         // 等到获取数据之后,删除临时数据
373
-        var list = _this6.state.list.map(function (item) {
432
+        var list = _this7.state.list.map(function (item) {
374 433
           if (item.id === data.comment_id) {
375 434
             if (!item.replies) item.replies = [];
376 435
             item.replies.push(_extends({}, response.data, {
@@ -380,9 +439,9 @@ var App = function (_Component) {
380 439
           }
381 440
           return item;
382 441
         });
383
-        _this6.setState({ list: list });
442
+        _this7.setState({ list: list });
384 443
       }).catch(this.errorHandler).finally(function () {
385
-        _this6.handleChangeLoading("sCreateReply", false);
444
+        _this7.handleChangeLoading("sCreateReply", false);
386 445
       });
387 446
     }
388 447
 
@@ -395,7 +454,7 @@ var App = function (_Component) {
395 454
   }, {
396 455
     key: "sDeleteReply",
397 456
     value: function sDeleteReply(replyId, commentId) {
398
-      var _this7 = this;
457
+      var _this8 = this;
399 458
 
400 459
       this.handleChangeLoading("sDeleteReply", true);
401 460
       var API = this.props.API;
@@ -404,7 +463,7 @@ var App = function (_Component) {
404 463
         method: "delete",
405 464
         withCredentials: true
406 465
       }).then(function () {
407
-        var list = _this7.state.list.map(function (item) {
466
+        var list = _this8.state.list.map(function (item) {
408 467
           if (item.id === commentId) {
409 468
             var replies = item.replies.filter(function (item) {
410 469
               return item.id !== replyId;
@@ -414,10 +473,10 @@ var App = function (_Component) {
414 473
           }
415 474
           return item;
416 475
         });
417
-        _this7.setState({ list: list });
418
-        _this7.props.onDelete(_constant.COMMENT_TYPE.REPLY);
476
+        _this8.setState({ list: list });
477
+        _this8.props.onDelete(_constant.COMMENT_TYPE.REPLY);
419 478
       }).catch(this.errorHandler).finally(function () {
420
-        _this7.handleChangeLoading("sDeleteReply", false);
479
+        _this8.handleChangeLoading("sDeleteReply", false);
421 480
       });
422 481
     }
423 482
 
@@ -430,7 +489,7 @@ var App = function (_Component) {
430 489
   }, {
431 490
     key: "sCommentFavor",
432 491
     value: function sCommentFavor(commentId, favored) {
433
-      var _this8 = this;
492
+      var _this9 = this;
434 493
 
435 494
       this.handleChangeLoading("sCommentFavor", true);
436 495
       var API = this.props.API;
@@ -439,20 +498,20 @@ var App = function (_Component) {
439 498
         method: favored ? "delete" : "put",
440 499
         withCredentials: true
441 500
       }).then(function (response) {
442
-        if (_this8.props.showAlertFavor) {
443
-          _message3.default.success(favored ? "取消点赞成功!" : "点赞成功!");
501
+        if (_this9.props.showAlertFavor) {
502
+          _message3.default.success(favored ? _reactIntlUniversal2.default.get("message.cancelLickSuccess") : _reactIntlUniversal2.default.get("message.likeSuccess"));
444 503
         }
445 504
         // 更新 list 中的该项数据的 favored
446
-        var list = _this8.state.list.map(function (item) {
505
+        var list = _this9.state.list.map(function (item) {
447 506
           if (item.id === commentId) {
448 507
             item.favored = !favored;
449 508
             item.favor_count += favored ? -1 : 1;
450 509
           }
451 510
           return item;
452 511
         });
453
-        _this8.setState({ list: list });
512
+        _this9.setState({ list: list });
454 513
       }).catch(this.errorHandler).finally(function () {
455
-        _this8.handleChangeLoading("sCommentFavor", false);
514
+        _this9.handleChangeLoading("sCommentFavor", false);
456 515
       });
457 516
     }
458 517
 
@@ -466,7 +525,7 @@ var App = function (_Component) {
466 525
   }, {
467 526
     key: "sReplyFavor",
468 527
     value: function sReplyFavor(replyId, commentId, favored) {
469
-      var _this9 = this;
528
+      var _this10 = this;
470 529
 
471 530
       this.handleChangeLoading("sReplyFavor", true);
472 531
       var API = this.props.API;
@@ -478,9 +537,9 @@ var App = function (_Component) {
478 537
         },
479 538
         withCredentials: true
480 539
       }).then(function (response) {
481
-        _message3.default.success(favored ? "取消点赞成功!" : "点赞成功!");
540
+        _message3.default.success(favored ? _reactIntlUniversal2.default.get("message.cancelLickSuccess") : _reactIntlUniversal2.default.get("message.likeSuccess"));
482 541
         // 更新 list 中的该项数据的 favored
483
-        var list = _this9.state.list.map(function (item) {
542
+        var list = _this10.state.list.map(function (item) {
484 543
           if (item.id === commentId) {
485 544
             item.replies = item.replies.map(function (r) {
486 545
               if (r.id === replyId) {
@@ -495,9 +554,9 @@ var App = function (_Component) {
495 554
           }
496 555
           return item;
497 556
         });
498
-        _this9.setState({ list: list });
557
+        _this10.setState({ list: list });
499 558
       }).catch(this.errorHandler).finally(function () {
500
-        _this9.handleChangeLoading("sReplyFavor", false);
559
+        _this10.handleChangeLoading("sReplyFavor", false);
501 560
       });
502 561
     }
503 562
 
@@ -508,15 +567,15 @@ var App = function (_Component) {
508 567
   }, {
509 568
     key: "sOssSts",
510 569
     value: function sOssSts() {
511
-      var _this10 = this;
570
+      var _this11 = this;
512 571
 
513 572
       this.handleChangeLoading("sOssSts", true);
514 573
       var API = this.props.API;
515 574
 
516 575
       this.axios.get(API + "/oss/sts").then(function (response) {
517
-        _this10.setState({ oss: _extends({}, response.data) });
576
+        _this11.setState({ oss: _extends({}, response.data) });
518 577
       }).catch(this.errorHandler).finally(function () {
519
-        _this10.handleChangeLoading("sOssSts", false);
578
+        _this11.handleChangeLoading("sOssSts", false);
520 579
       });
521 580
     }
522 581
   }, {
@@ -535,7 +594,7 @@ var App = function (_Component) {
535 594
         sDeleteReply: this.sDeleteReply
536 595
       });
537 596
 
538
-      return _react2.default.createElement(
597
+      return this.state.initDone && _react2.default.createElement(
539 598
         _Comment.CommentContext.Provider,
540 599
         { value: value },
541 600
         _react2.default.createElement(
@@ -558,6 +617,7 @@ var App = function (_Component) {
558 617
 App.propTypes = {
559 618
   type: _propTypes2.default.number.isRequired, // 评论的 type
560 619
   businessId: _propTypes2.default.string.isRequired, // 评论的 business_id
620
+  businessUserId: _propTypes2.default.number,
561 621
   API: _propTypes2.default.string, // 评论的 API 前缀
562 622
   showList: _propTypes2.default.bool, // 是否显示评论列表
563 623
   showEditor: _propTypes2.default.bool, // 是否显示评论输入框
@@ -569,11 +629,16 @@ App.propTypes = {
569 629
   userId: _propTypes2.default.number, // 用户id, comment内部不维护用户id, 调用组件时传递过来, 目前用于判断是否显示删除按钮
570 630
   pageType: _propTypes2.default.string, // 分页类型
571 631
   page: _propTypes2.default.number, // 页码
632
+  limit: _propTypes2.default.number, // 一次加载评论数量
572 633
   onPageChange: _propTypes2.default.func, // 页码变化回调
573
-  onDelete: _propTypes2.default.func
634
+  onGetMoreBtnClick: _propTypes2.default.func, // 点击查看更多按钮回调
635
+  onDelete: _propTypes2.default.func,
636
+  locales: _propTypes2.default.string, //  传入的语言环境, en-US/zh-CN
637
+  onCountChange: _propTypes2.default.func // 评论数量变更时的回调
574 638
 };
575 639
 
576 640
 App.defaultProps = {
641
+  businessUserId: 0,
577 642
   API: "//api.links123.net/comment/v1",
578 643
   showList: true,
579 644
   showEditor: true,
@@ -582,8 +647,11 @@ App.defaultProps = {
582 647
   showAlertFavor: false,
583 648
   showError: true,
584 649
   pageType: "more",
650
+  limit: _constant.LIMIT,
651
+  onGetMoreBtnClick: function onGetMoreBtnClick() {},
585 652
   onPageChange: function onPageChange(page) {},
586
-  onDelete: function onDelete() {}
653
+  onDelete: function onDelete() {},
654
+  onCountChange: function onCountChange() {}
587 655
 };
588 656
 
589 657
 exports.Editor = _Editor2.default;

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


+ 0
- 12
lib/CHANGELOG.md View File

@@ -1,12 +0,0 @@
1
-# CHANGELOG
2
-
3
-
4
-## 0.1.0
5
-
6
-- [x] 不兼容更新。
7
-- [x] 添加了很多 `Props`
8
-- [x] 组件导出为 `Comment` 和 `Editor`
9
-
10
-
11
-
12
-

+ 7
- 2
lib/components/CommentBox/index.js View File

@@ -20,6 +20,10 @@ var _propTypes = require("prop-types");
20 20
 
21 21
 var _propTypes2 = _interopRequireDefault(_propTypes);
22 22
 
23
+var _reactIntlUniversal = require("react-intl-universal");
24
+
25
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
26
+
23 27
 var _Comment = require("../../Comment");
24 28
 
25 29
 var _Comment2 = _interopRequireDefault(_Comment);
@@ -122,7 +126,7 @@ var CommentBox = function (_Component) {
122 126
                       return _this2.handleGetMoreReply(commentId);
123 127
                     }
124 128
                   },
125
-                  "\u67E5\u770B\u66F4\u591A\u56DE\u590D"
129
+                  _reactIntlUniversal2.default.get("reply.moreReply")
126 130
                 ),
127 131
                 _react2.default.createElement(
128 132
                   "a",
@@ -131,7 +135,8 @@ var CommentBox = function (_Component) {
131 135
                     onClick: _this2.handleToggleReply
132 136
                   },
133 137
                   _react2.default.createElement(_icon2.default, { type: "up" }),
134
-                  " \u6536\u8D77\u56DE\u590D"
138
+                  " ",
139
+                  _reactIntlUniversal2.default.get("reply.collapse")
135 140
                 )
136 141
               )];
137 142
             }

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


+ 5
- 2
lib/components/CommentInput/index.js View File

@@ -71,6 +71,7 @@ var CommentInput = function (_Component) {
71 71
           action = _props.action,
72 72
           commentId = _props.commentId,
73 73
           replyId = _props.replyId,
74
+          userId = _props.userId,
74 75
           callback = _props.callback;
75 76
 
76 77
       if (action === "comment") {
@@ -80,7 +81,8 @@ var CommentInput = function (_Component) {
80 81
       } else if (action === "reply") {
81 82
         this.props.app.sCreateReply({
82 83
           comment_id: commentId,
83
-          content: value
84
+          content: value,
85
+          business_user_id: userId
84 86
         }, function () {
85 87
           return callback && callback();
86 88
         });
@@ -88,7 +90,8 @@ var CommentInput = function (_Component) {
88 90
         this.props.app.sCreateReply({
89 91
           comment_id: commentId,
90 92
           content: value,
91
-          reply_id: replyId
93
+          reply_id: replyId,
94
+          business_user_id: userId
92 95
         }, function () {
93 96
           return callback && callback();
94 97
         });

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


+ 22
- 9
lib/components/CommentList/index.js View File

@@ -22,6 +22,10 @@ var _react = require("react");
22 22
 
23 23
 var _react2 = _interopRequireDefault(_react);
24 24
 
25
+var _reactIntlUniversal = require("react-intl-universal");
26
+
27
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
28
+
25 29
 var _Comment = require("../../Comment");
26 30
 
27 31
 var _Comment2 = _interopRequireDefault(_Comment);
@@ -32,8 +36,6 @@ var _CommentBox2 = _interopRequireDefault(_CommentBox);
32 36
 
33 37
 require("./index.css");
34 38
 
35
-var _constant = require("../../constant");
36
-
37 39
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
38 40
 
39 41
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
@@ -67,11 +69,24 @@ var CommentList = function (_Component) {
67 69
           total = _props$app.total,
68 70
           page = _props$app.page,
69 71
           pageType = _props$app.pageType,
72
+          limit = _props$app.limit,
70 73
           isNoMoreComment = _props$app.isNoMoreComment,
71 74
           sGetComment = _props$app.sGetComment,
72
-          onPageChange = _props$app.onPageChange;
75
+          onPageChange = _props$app.onPageChange,
76
+          onGetMoreBtnClick = _props$app.onGetMoreBtnClick;
73 77
 
74
-      if (pageType === "more") {
78
+      if (pageType === "slice") {
79
+        // 截断多余评论,通过点击查看更多跳转
80
+        return _react2.default.createElement(
81
+          "div",
82
+          { className: "comment-list-show-more", onClick: onGetMoreBtnClick },
83
+          _react2.default.createElement(
84
+            "span",
85
+            null,
86
+            "\u67E5\u770B\u66F4\u591A"
87
+          )
88
+        );
89
+      } else if (pageType === "more") {
75 90
         if (!isNoMoreComment && list.length !== total) {
76 91
           return _react2.default.createElement(
77 92
             "div",
@@ -85,7 +100,7 @@ var CommentList = function (_Component) {
85 100
             _react2.default.createElement(
86 101
               "span",
87 102
               null,
88
-              "\u67E5\u770B\u66F4\u591A\u8BC4\u8BBA"
103
+              _reactIntlUniversal2.default.get("comment.moreComment")
89 104
             )
90 105
           );
91 106
         } else {
@@ -96,7 +111,7 @@ var CommentList = function (_Component) {
96 111
           "div",
97 112
           { className: "comment-list-pagination" },
98 113
           _react2.default.createElement(_pagination2.default, {
99
-            pageSize: _constant.LIMIT,
114
+            pageSize: limit,
100 115
             current: page,
101 116
             total: total,
102 117
             onChange: function onChange(p) {
@@ -126,9 +141,7 @@ var CommentList = function (_Component) {
126 141
           _react2.default.createElement(
127 142
             "div",
128 143
             null,
129
-            "\u5171 ",
130
-            total,
131
-            " \u6761\u8BC4\u8BBA"
144
+            _reactIntlUniversal2.default.get("comment.totalComment", { total: total })
132 145
           ),
133 146
           list.map(function (item) {
134 147
             return _react2.default.createElement(_CommentBox2.default, { content: item, key: item.id, commentId: item.id });

+ 1
- 1
lib/components/CommentList/index.js.map View File

@@ -1 +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\";\r\nimport { Spin, Pagination } from \"antd\";\r\nimport Comment from \"../../Comment\";\r\nimport CommentBox from \"../CommentBox\";\r\nimport \"./index.css\";\r\nimport { LIMIT } from \"../../constant\";\r\n\r\nclass CommentList extends Component {\r\n  constructor(props) {\r\n    super(props);\r\n    this.state = {};\r\n  }\r\n\r\n  componentWillMount() {\r\n    this.props.app.sGetComment({ page: this.props.app.page });\r\n  }\r\n\r\n  renderPagination() {\r\n    const {\r\n      list,\r\n      total,\r\n      page,\r\n      pageType,\r\n      isNoMoreComment,\r\n      sGetComment,\r\n      onPageChange\r\n    } = this.props.app;\r\n    if (pageType === \"more\") {\r\n      if (!isNoMoreComment && list.length !== total) {\r\n        return (\r\n          <div\r\n            className=\"comment-list-show-more\"\r\n            onClick={() => {\r\n              sGetComment({ page: page + 1 });\r\n              onPageChange(page + 1);\r\n            }}\r\n          >\r\n            <span>查看更多评论</span>\r\n          </div>\r\n        );\r\n      } else {\r\n        return null;\r\n      }\r\n    } else if (pageType === \"pagination\") {\r\n      return (\r\n        <div className=\"comment-list-pagination\">\r\n          <Pagination\r\n            pageSize={LIMIT}\r\n            current={page}\r\n            total={total}\r\n            onChange={p => {\r\n              sGetComment({ page: p });\r\n              onPageChange(p);\r\n            }}\r\n          />\r\n        </div>\r\n      );\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const { list, total, loading } = this.props.app;\r\n\r\n    const spinning = Boolean(\r\n      loading.sGetComment || loading.sCommentFavor || loading.sReplyFavor\r\n    );\r\n    return (\r\n      <div>\r\n        <Spin spinning={spinning}>\r\n          <div>共 {total} 条评论</div>\r\n          {list.map(item => (\r\n            <CommentBox content={item} key={item.id} commentId={item.id} />\r\n          ))}\r\n          {this.renderPagination()}\r\n        </Spin>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n\r\nCommentList.propTypes = {};\r\n\r\nexport default Comment(CommentList);\r\n"]}
1
+{"version":3,"sources":["../../../src/components/CommentList/index.js"],"names":["CommentList","props","state","app","sGetComment","page","list","total","pageType","limit","isNoMoreComment","onPageChange","onGetMoreBtnClick","length","intl","get","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,uBAWb,KAAKJ,KAAL,CAAWE,GAXE;AAAA,UAEfG,IAFe,cAEfA,IAFe;AAAA,UAGfC,KAHe,cAGfA,KAHe;AAAA,UAIfF,IAJe,cAIfA,IAJe;AAAA,UAKfG,QALe,cAKfA,QALe;AAAA,UAMfC,KANe,cAMfA,KANe;AAAA,UAOfC,eAPe,cAOfA,eAPe;AAAA,UAQfN,WARe,cAQfA,WARe;AAAA,UASfO,YATe,cASfA,YATe;AAAA,UAUfC,iBAVe,cAUfA,iBAVe;;AAYjB,UAAIJ,aAAa,OAAjB,EAA0B;AACxB;AACA,eACE;AAAA;AAAA,YAAK,WAAU,wBAAf,EAAwC,SAASI,iBAAjD;AACE;AAAA;AAAA;AAAA;AAAA;AADF,SADF;AAKD,OAPD,MAOO,IAAIJ,aAAa,MAAjB,EAAyB;AAC9B,YAAI,CAACE,eAAD,IAAoBJ,KAAKO,MAAL,KAAgBN,KAAxC,EAA+C;AAC7C,iBACE;AAAA;AAAA;AACE,yBAAU,wBADZ;AAEE,uBAAS,mBAAM;AACbH,4BAAY,EAAEC,MAAMA,OAAO,CAAf,EAAZ;AACAM,6BAAaN,OAAO,CAApB;AACD;AALH;AAOE;AAAA;AAAA;AAAOS,2CAAKC,GAAL,CAAS,qBAAT;AAAP;AAPF,WADF;AAWD,SAZD,MAYO;AACL,iBAAO,IAAP;AACD;AACF,OAhBM,MAgBA,IAAIP,aAAa,YAAjB,EAA+B;AACpC,eACE;AAAA;AAAA,YAAK,WAAU,yBAAf;AACE;AACE,sBAAUC,KADZ;AAEE,qBAASJ,IAFX;AAGE,mBAAOE,KAHT;AAIE,sBAAU,qBAAK;AACbH,0BAAY,EAAEC,MAAMW,CAAR,EAAZ;AACAL,2BAAaK,CAAb;AACD;AAPH;AADF,SADF;AAaD;AACF;;;6BAEQ;AAAA,wBAC0B,KAAKf,KAAL,CAAWE,GADrC;AAAA,UACCG,IADD,eACCA,IADD;AAAA,UACOC,KADP,eACOA,KADP;AAAA,UACcU,OADd,eACcA,OADd;;;AAGP,UAAMC,WAAWC,QACfF,QAAQb,WAAR,IAAuBa,QAAQG,aAA/B,IAAgDH,QAAQI,WADzC,CAAjB;AAGA,aACE;AAAA;AAAA;AACE;AAAA;AAAA,YAAM,UAAUH,QAAhB;AAEE;AAAA;AAAA;AAAMJ,yCAAKC,GAAL,CAAS,sBAAT,EAAiC,EAAER,YAAF,EAAjC;AAAN,WAFF;AAGGD,eAAKgB,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;;;;EAhFuBC,gB;;AAmF1B1B,YAAY2B,SAAZ,GAAwB,EAAxB;;kBAEe,uBAAQ3B,WAAR,C","file":"index.js","sourcesContent":["import React, { Component } from \"react\";\r\nimport { Spin, Pagination } from \"antd\";\r\nimport intl from \"react-intl-universal\";\r\nimport Comment from \"../../Comment\";\r\nimport CommentBox from \"../CommentBox\";\r\nimport \"./index.css\";\r\n\r\nclass CommentList extends Component {\r\n  constructor(props) {\r\n    super(props);\r\n    this.state = {};\r\n  }\r\n\r\n  componentWillMount() {\r\n    this.props.app.sGetComment({ page: this.props.app.page });\r\n  }\r\n\r\n  renderPagination() {\r\n    const {\r\n      list,\r\n      total,\r\n      page,\r\n      pageType,\r\n      limit,\r\n      isNoMoreComment,\r\n      sGetComment,\r\n      onPageChange,\r\n      onGetMoreBtnClick\r\n    } = this.props.app;\r\n    if (pageType === \"slice\") {\r\n      // 截断多余评论,通过点击查看更多跳转\r\n      return (\r\n        <div className=\"comment-list-show-more\" onClick={onGetMoreBtnClick}>\r\n          <span>查看更多</span>\r\n        </div>\r\n      );\r\n    } else if (pageType === \"more\") {\r\n      if (!isNoMoreComment && list.length !== total) {\r\n        return (\r\n          <div\r\n            className=\"comment-list-show-more\"\r\n            onClick={() => {\r\n              sGetComment({ page: page + 1 });\r\n              onPageChange(page + 1);\r\n            }}\r\n          >\r\n            <span>{intl.get(\"comment.moreComment\")}</span>\r\n          </div>\r\n        );\r\n      } else {\r\n        return null;\r\n      }\r\n    } else if (pageType === \"pagination\") {\r\n      return (\r\n        <div className=\"comment-list-pagination\">\r\n          <Pagination\r\n            pageSize={limit}\r\n            current={page}\r\n            total={total}\r\n            onChange={p => {\r\n              sGetComment({ page: p });\r\n              onPageChange(p);\r\n            }}\r\n          />\r\n        </div>\r\n      );\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const { list, total, loading } = this.props.app;\r\n\r\n    const spinning = Boolean(\r\n      loading.sGetComment || loading.sCommentFavor || loading.sReplyFavor\r\n    );\r\n    return (\r\n      <div>\r\n        <Spin spinning={spinning}>\r\n          {/* <div>共 {total} 条评论</div> */}\r\n          <div>{intl.get(\"comment.totalComment\", { total })}</div>\r\n          {list.map(item => (\r\n            <CommentBox content={item} key={item.id} commentId={item.id} />\r\n          ))}\r\n          {this.renderPagination()}\r\n        </Spin>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n\r\nCommentList.propTypes = {};\r\n\r\nexport default Comment(CommentList);\r\n"]}

+ 24
- 10
lib/components/ContentItem/index.js View File

@@ -48,6 +48,10 @@ var _relativeTime = require("dayjs/plugin/relativeTime");
48 48
 
49 49
 var _relativeTime2 = _interopRequireDefault(_relativeTime);
50 50
 
51
+var _reactIntlUniversal = require("react-intl-universal");
52
+
53
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
54
+
51 55
 var _Comment = require("../../Comment");
52 56
 
53 57
 var _Comment2 = _interopRequireDefault(_Comment);
@@ -79,10 +83,16 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
79 83
 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; }
80 84
 
81 85
 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; }
86
+// import 'dayjs/locale/es';
87
+
82 88
 
83
-_dayjs2.default.locale("zh-cn");
89
+// dayjs.locale("zh-cn");
84 90
 _dayjs2.default.extend(_relativeTime2.default);
85 91
 
92
+var LOCALES = {
93
+  "zh-CN": "zh-cn"
94
+};
95
+
86 96
 var CommentItem = function (_Component) {
87 97
   _inherits(CommentItem, _Component);
88 98
 
@@ -159,6 +169,7 @@ var CommentItem = function (_Component) {
159 169
           showReply = _props.showReply,
160 170
           onShowReply = _props.onShowReply,
161 171
           app = _props.app;
172
+      var locale = this.props.app.locale;
162 173
       var showInput = this.state.showInput;
163 174
 
164 175
 
@@ -201,7 +212,7 @@ var CommentItem = function (_Component) {
201 212
             _react2.default.createElement(
202 213
               "strong",
203 214
               null,
204
-              content.user_name || "游客"
215
+              content.user_name || _reactIntlUniversal2.default.get("comment.tourist")
205 216
             ),
206 217
             _react2.default.createElement(
207 218
               "span",
@@ -212,7 +223,7 @@ var CommentItem = function (_Component) {
212 223
                   placement: "top",
213 224
                   title: (0, _dayjs2.default)(content.created * 1000).format("YYYY-MM-DD HH:mm:ss")
214 225
                 },
215
-                (0, _dayjs2.default)(content.created * 1000).fromNow()
226
+                LOCALES[locale] ? (0, _dayjs2.default)(content.created * 1000).locale(LOCALES[locale]).fromNow() : (0, _dayjs2.default)(content.created * 1000).fromNow()
216 227
               )
217 228
             )
218 229
           ),
@@ -274,15 +285,15 @@ var CommentItem = function (_Component) {
274 285
               _react2.default.createElement(
275 286
                 "a",
276 287
                 { className: "comment-item-bottom-left", onClick: onShowReply },
277
-                content.reply_count,
278
-                " \u6761\u56DE\u590D",
288
+                _reactIntlUniversal2.default.get("reply.totalReply", { total: content.reply_count }),
279 289
                 showReply ? _react2.default.createElement(_icon2.default, { type: "up" }) : _react2.default.createElement(_icon2.default, { type: "down" })
280 290
               )
281 291
             ) : null,
282 292
             app.userId === content.user_id && _react2.default.createElement(
283 293
               _popconfirm2.default,
284 294
               {
285
-                title: "\u786E\u5B9A\u8981\u5220\u9664\u5417?",
295
+                // title="确定要删除吗?"
296
+                title: _reactIntlUniversal2.default.get("popConfirm.title"),
286 297
                 onConfirm: function onConfirm() {
287 298
                   if (replyId) {
288 299
                     app.sDeleteReply(content.id, commentId);
@@ -290,13 +301,14 @@ var CommentItem = function (_Component) {
290 301
                   }
291 302
                   app.sDeleteComment(content.id);
292 303
                 },
293
-                okText: "\u786E\u5B9A",
294
-                cancelText: "\u53D6\u6D88"
304
+                okText: _reactIntlUniversal2.default.get("popConfirm.ok"),
305
+                cancelText: _reactIntlUniversal2.default.get("popConfirm.cancel")
295 306
               },
296 307
               _react2.default.createElement(
297 308
                 "a",
298 309
                 { className: "comment-item-bottom-right" },
299
-                "\xA0 \u5220\u9664"
310
+                "\xA0 ",
311
+                _reactIntlUniversal2.default.get("popConfirm.delete")
300 312
               )
301 313
             ),
302 314
             _react2.default.createElement(
@@ -305,7 +317,8 @@ var CommentItem = function (_Component) {
305 317
                 onClick: this.handleToggleInput,
306 318
                 className: "comment-item-bottom-right"
307 319
               },
308
-              "\xA0 \u56DE\u590D"
320
+              "\xA0 ",
321
+              _reactIntlUniversal2.default.get("comment.reply")
309 322
             ),
310 323
             _react2.default.createElement(
311 324
               "div",
@@ -334,6 +347,7 @@ var CommentItem = function (_Component) {
334 347
           action: action,
335 348
           replyId: replyId,
336 349
           commentId: commentId,
350
+          userId: content.user_id,
337 351
           callback: this.handleToggleInput
338 352
         })
339 353
       );

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


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

@@ -42,6 +42,10 @@ var _shortid = require("shortid");
42 42
 
43 43
 var _shortid2 = _interopRequireDefault(_shortid);
44 44
 
45
+var _reactIntlUniversal = require("react-intl-universal");
46
+
47
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
48
+
45 49
 var _constant = require("../../constant");
46 50
 
47 51
 var _Comment = require("../../Comment");
@@ -173,7 +177,7 @@ var App = function (_React$Component) {
173 177
         _react2.default.createElement(
174 178
           "div",
175 179
           { className: "ant-upload-text" },
176
-          "\u4E0A\u4F20"
180
+          _reactIntlUniversal2.default.get("editor.uploadBtn")
177 181
         )
178 182
       );
179 183
       return _react2.default.createElement(

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


+ 13
- 12
lib/components/Editor/index.js View File

@@ -48,6 +48,10 @@ var _classnames = require("classnames");
48 48
 
49 49
 var _classnames2 = _interopRequireDefault(_classnames);
50 50
 
51
+var _reactIntlUniversal = require("react-intl-universal");
52
+
53
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
54
+
51 55
 var _constant = require("../../constant");
52 56
 
53 57
 var _helper = require("../../helper");
@@ -218,7 +222,8 @@ var Editor = function (_React$Component) {
218 222
           fileList = _state.fileList;
219 223
 
220 224
       if (value.length > maxLength) {
221
-        _message3.default.error("\u5B57\u6570\u4E0D\u5F97\u8D85\u8FC7" + maxLength + "\u5B57");
225
+        // message.error(`字数不得超过${maxLength}字`);
226
+        _message3.default.error(_reactIntlUniversal2.default.get("editor.maxLength", { maxLength: maxLength }));
222 227
         return;
223 228
       }
224 229
       var files = [];
@@ -267,13 +272,11 @@ var Editor = function (_React$Component) {
267 272
 
268 273
       var _props = this.props,
269 274
           value = _props.value,
270
-          placeholder = _props.placeholder,
271 275
           rows = _props.rows,
272 276
           showEmoji = _props.showEmoji,
273 277
           showUpload = _props.showUpload,
274 278
           closeUploadWhenBlur = _props.closeUploadWhenBlur,
275 279
           maxUpload = _props.maxUpload,
276
-          btnSubmitText = _props.btnSubmitText,
277 280
           btnLoading = _props.btnLoading,
278 281
           btnDisabled = _props.btnDisabled,
279 282
           button = _props.button,
@@ -282,6 +285,8 @@ var Editor = function (_React$Component) {
282 285
           maxLength = _props.maxLength,
283 286
           autoFocus = _props.autoFocus;
284 287
 
288
+      var placeholder = this.props.placeholder || _reactIntlUniversal2.default.get("editor.placeholder");
289
+      var btnSubmitText = this.props.btnSubmitText || _reactIntlUniversal2.default.get("editor.SubmitBtn");
285 290
       var handleSubmit = this.handleSubmit;
286 291
       var disabledSubmit = btnDisabled || !this.props.value && !this.state.value && !this.state.fileList.length;
287 292
       var inputValue = value || this.state.value;
@@ -296,11 +301,7 @@ var Editor = function (_React$Component) {
296 301
               "comment-editor-toolbar-error": inputValue.length > maxLength
297 302
             })
298 303
           },
299
-          "\u5DF2\u8F93\u5165 ",
300
-          inputValue.length,
301
-          " / ",
302
-          maxLength,
303
-          " \u5B57"
304
+          "\u3000"
304 305
         ),
305 306
         _react2.default.createElement(
306 307
           "div",
@@ -379,7 +380,7 @@ var Editor = function (_React$Component) {
379 380
                     _react2.default.createElement(
380 381
                       "span",
381 382
                       null,
382
-                      "\u4E0A\u4F20\u56FE\u7247",
383
+                      _reactIntlUniversal2.default.get("editor.uploadTip"),
383 384
                       maxUpload >= 2 ? _react2.default.createElement(
384 385
                         "span",
385 386
                         { style: { color: "#666", fontWeight: 400 } },
@@ -455,16 +456,16 @@ Editor.propTypes = {
455 456
 
456 457
 Editor.defaultProps = {
457 458
   rows: 5,
458
-  placeholder: "说点什么吧...",
459
+  // placeholder: "说点什么吧",
459 460
   showEmoji: true,
460 461
   showUpload: true,
461 462
   closeUploadWhenBlur: false,
462 463
   maxUpload: 1,
463
-  btnSubmitText: "发表",
464
+  // btnSubmitText: "发表",
464 465
   btnLoading: false,
465 466
   btnDisabled: false,
466 467
   showError: true,
467
-  maxLength: 140
468
+  maxLength: 5000
468 469
 };
469 470
 
470 471
 exports.default = Editor;

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


+ 7
- 2
lib/components/ImagePreviewer/ImagePreviewer.js View File

@@ -26,6 +26,10 @@ var _classnames = require("classnames");
26 26
 
27 27
 var _classnames2 = _interopRequireDefault(_classnames);
28 28
 
29
+var _reactIntlUniversal = require("react-intl-universal");
30
+
31
+var _reactIntlUniversal2 = _interopRequireDefault(_reactIntlUniversal);
32
+
29 33
 require("./ImagePreviewer.less");
30 34
 
31 35
 var _helper = require("../../helper");
@@ -161,13 +165,14 @@ var ImagePreviewer = function (_React$Component) {
161 165
             "span",
162 166
             { className: "button", onClick: onFold },
163 167
             _react2.default.createElement(_icon2.default, { type: "to-top" }),
164
-            "\u6536\u8D77"
168
+            _reactIntlUniversal2.default.get("picture.collapse")
165 169
           ),
166 170
           _react2.default.createElement(
167 171
             "span",
168 172
             { className: "button", onClick: this.onOrigin },
169 173
             _react2.default.createElement(_icon2.default, { type: "search" }),
170
-            " \u67E5\u770B\u539F\u56FE"
174
+            " ",
175
+            _reactIntlUniversal2.default.get("picture.viewOriginal")
171 176
           )
172 177
         ),
173 178
         _react2.default.createElement(

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


+ 1
- 0
lib/index.example.js View File

@@ -94,6 +94,7 @@ var Index = function (_Component) {
94 94
           page: this.state.page,
95 95
           onPageChange: this.onPageChange,
96 96
           pageType: "more",
97
+          businessUserId: 4,
97 98
           onError: function onError(msg, _ref2) {
98 99
             var response = _ref2.response;
99 100
 

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


+ 17
- 11
lib/index.js View File

@@ -22,7 +22,7 @@ var Index = function Index(props) {
22 22
   return _react2.default.createElement(
23 23
     _App2.default,
24 24
     _extends({ showAlertComment: true, showAlertReply: true, showAlertFavor: true, showError: true }, props),
25
-    _react2.default.createElement(_App.Editor, { maxUpload: 9, autoFocus: true })
25
+    _react2.default.createElement(_App.Editor, _extends({ maxUpload: 9, autoFocus: true }, props.editorProps))
26 26
   );
27 27
 };
28 28
 
@@ -43,28 +43,34 @@ function renderComment(config) {
43 43
   }
44 44
   if (!config.businessId) {
45 45
     // throw new Error("businessId is required");
46
+    config.businessId = "test";
46 47
     console.warn("没有传入 businessId 参数,默认使用: test");
47 48
   }
48 49
   if (!config.API) {
49 50
     // throw new Error("API is required");
51
+    config.API = "http://api.links123.net/comment/v1";
50 52
     console.warn("没有传入 API 参数,默认使用: http://api.links123.net/comment/v1");
51 53
   }
52
-  var id = config.id,
53
-      _config$type = config.type,
54
-      type = _config$type === undefined ? 1 : _config$type,
55
-      _config$businessId = config.businessId,
56
-      businessId = _config$businessId === undefined ? "test" : _config$businessId,
57
-      _config$API = config.API,
58
-      API = _config$API === undefined ? "http://api.links123.net/comment/v1" : _config$API,
59
-      userId = config.userId;
60 54
 
61
-
62
-  _reactDom2.default.render(_react2.default.createElement(Index, { type: type, businessId: businessId, API: API, userId: userId }), document.getElementById(id));
55
+  _reactDom2.default.render(_react2.default.createElement(Index, config), document.getElementById(config.id));
63 56
   // registerServiceWorker();
64 57
 }
65 58
 
66 59
 window.renderComment = renderComment;
67 60
 
61
+if (process.env.NODE_ENV !== 'production') {
62
+  renderComment({
63
+    id: "root-comment",
64
+    type: 1,
65
+    businessId: "test",
66
+    businessUserId: 4,
67
+    userId: 71299,
68
+    onCountChange: function onCountChange(c) {
69
+      console.log(c);
70
+    }
71
+  });
72
+}
73
+
68 74
 // renderComment({
69 75
 //   id: "root-comment",
70 76
 //   type: 1,

+ 1
- 1
lib/index.js.map View File

@@ -1 +1 @@
1
-{"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;;AAEA;AACA;AACA;AACA;AACA;AACA","file":"index.js","sourcesContent":["import React from \"react\";\r\nimport ReactDOM from \"react-dom\";\r\nimport App, { Editor } from \"./App\";\r\n// import registerServiceWorker from \"./registerServiceWorker\";\r\n\r\nconst Index = props => (\r\n  <App showAlertComment showAlertReply showAlertFavor showError {...props}>\r\n    <Editor maxUpload={9} autoFocus />\r\n  </App>\r\n);\r\n\r\n/**\r\n * 渲染评论组件\r\n * @param {object} config 编辑器配置\r\n *  - {string} id 渲染评论的DOM的 ID\r\n *  - {number} type 评论的 type\r\n *  - {string} businessId 评论的 businessId\r\n *  - {string} API, API 前缀, 默认 http://api.links123.net/comment/v1\r\n */\r\nfunction renderComment(config) {\r\n  if (!config.id) {\r\n    throw new Error(\"id is required\");\r\n  }\r\n  if (!config.type) {\r\n    throw new Error(\"type is required\");\r\n  }\r\n  if (!config.businessId) {\r\n    // throw new Error(\"businessId is required\");\r\n    console.warn(\"没有传入 businessId 参数,默认使用: test\");\r\n  }\r\n  if (!config.API) {\r\n    // throw new Error(\"API is required\");\r\n    console.warn(\r\n      \"没有传入 API 参数,默认使用: http://api.links123.net/comment/v1\"\r\n    );\r\n  }\r\n  const {\r\n    id,\r\n    type = 1,\r\n    businessId = \"test\",\r\n    API = \"http://api.links123.net/comment/v1\",\r\n    userId\r\n  } = config;\r\n\r\n  ReactDOM.render(\r\n    <Index type={type} businessId={businessId} API={API} userId={userId} />,\r\n    document.getElementById(id)\r\n  );\r\n  // registerServiceWorker();\r\n}\r\n\r\nwindow.renderComment = renderComment;\r\n\r\n// renderComment({\r\n//   id: \"root-comment\",\r\n//   type: 1,\r\n//   businessId: \"test\",\r\n//   API: 'http://api.links123.net/comment/v1',\r\n// });\r\n"]}
1
+{"version":3,"sources":["../src/index.js"],"names":["Index","props","editorProps","renderComment","config","id","Error","type","businessId","console","warn","API","ReactDOM","render","document","getElementById","window","process","env","NODE_ENV","businessUserId","userId","onCountChange","log","c"],"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,aAAQ,WAAW,CAAnB,EAAsB,eAAtB,IAAoCA,MAAMC,WAA1C;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;AACAJ,WAAOI,UAAP,GAAoB,MAApB;AACAC,YAAQC,IAAR,CAAa,+BAAb;AACD;AACD,MAAI,CAACN,OAAOO,GAAZ,EAAiB;AACf;AACAP,WAAOO,GAAP,GAAa,oCAAb;AACAF,YAAQC,IAAR,CACE,sDADF;AAGD;;AAEDE,qBAASC,MAAT,CAAgB,8BAAC,KAAD,EAAWT,MAAX,CAAhB,EAAuCU,SAASC,cAAT,CAAwBX,OAAOC,EAA/B,CAAvC;AACA;AACD;;AAEDW,OAAOb,aAAP,GAAuBA,aAAvB;;AAEA,IAAIc,QAAQC,GAAR,CAAYC,QAAZ,KAAyB,YAA7B,EAA2C;AACzChB,gBAAc;AACZE,QAAI,cADQ;AAEZE,UAAM,CAFM;AAGZC,gBAAY,MAHA;AAIZY,oBAAgB,CAJJ;AAKZC,YAAQ,KALI;AAMZC,mBAAe,0BAAK;AAClBb,cAAQc,GAAR,CAAYC,CAAZ;AACD;AARW,GAAd;AAUD;;AAED;AACA;AACA;AACA;AACA;AACA","file":"index.js","sourcesContent":["import React from \"react\";\r\nimport ReactDOM from \"react-dom\";\r\nimport App, { Editor } from \"./App\";\r\n// import registerServiceWorker from \"./registerServiceWorker\";\r\n\r\nconst Index = props => (\r\n  <App showAlertComment showAlertReply showAlertFavor showError {...props}>\r\n    <Editor maxUpload={9} autoFocus {...props.editorProps} />\r\n  </App>\r\n);\r\n\r\n/**\r\n * 渲染评论组件\r\n * @param {object} config 编辑器配置\r\n *  - {string} id 渲染评论的DOM的 ID\r\n *  - {number} type 评论的 type\r\n *  - {string} businessId 评论的 businessId\r\n *  - {string} API, API 前缀, 默认 http://api.links123.net/comment/v1\r\n */\r\nfunction renderComment(config) {\r\n  if (!config.id) {\r\n    throw new Error(\"id is required\");\r\n  }\r\n  if (!config.type) {\r\n    throw new Error(\"type is required\");\r\n  }\r\n  if (!config.businessId) {\r\n    // throw new Error(\"businessId is required\");\r\n    config.businessId = \"test\";\r\n    console.warn(\"没有传入 businessId 参数,默认使用: test\");\r\n  }\r\n  if (!config.API) {\r\n    // throw new Error(\"API is required\");\r\n    config.API = \"http://api.links123.net/comment/v1\";\r\n    console.warn(\r\n      \"没有传入 API 参数,默认使用: http://api.links123.net/comment/v1\"\r\n    );\r\n  }\r\n\r\n  ReactDOM.render(<Index {...config} />, document.getElementById(config.id));\r\n  // registerServiceWorker();\r\n}\r\n\r\nwindow.renderComment = renderComment;\r\n\r\nif (process.env.NODE_ENV !== 'production') {\r\n  renderComment({\r\n    id: \"root-comment\",\r\n    type: 1,\r\n    businessId: \"test\",\r\n    businessUserId: 4,\r\n    userId: 71299,\r\n    onCountChange: c => {\r\n      console.log(c);\r\n    }\r\n  });\r\n}\r\n\r\n// renderComment({\r\n//   id: \"root-comment\",\r\n//   type: 1,\r\n//   businessId: \"test\",\r\n//   API: 'http://api.links123.net/comment/v1',\r\n// });\r\n"]}

+ 43
- 0
lib/lang/en-US.js View File

@@ -0,0 +1,43 @@
1
+"use strict";
2
+
3
+Object.defineProperty(exports, "__esModule", {
4
+  value: true
5
+});
6
+var USdata = {
7
+  "editor.alreadyEntered": "{count} words entered",
8
+  "editor.placeholder": "Say something",
9
+  "editor.maxLength": "Maximum {maxLength} words",
10
+  "editor.SubmitBtn": "Send",
11
+  "editor.uploadTip": "Upload pictures",
12
+  "editor.uploadCount": "(You could upload {count} more)",
13
+  "editor.uploadBtn": "Upload",
14
+
15
+  "comment.tourist": "Visitor",
16
+  "comment.totalComment": "Total {total, plural, =1 {one comment} other {# comments}}",
17
+  "comment.reply": "Reply",
18
+  "comment.moreComment": "More comments",
19
+
20
+  "reply.totalReply": "Total {total, plural, =1 {one reply} other {# replies}}",
21
+  "reply.moreReply": "More replies",
22
+  "reply.collapse": "Fold replies",
23
+
24
+  "picture.collapse": "Fold",
25
+  "picture.viewOriginal": "See the original",
26
+
27
+  "popConfirm.title": "Delete?",
28
+  "popConfirm.ok": "Confirm",
29
+  "popConfirm.cancel": "Cancel",
30
+  "popConfirm.delete": "Delete",
31
+
32
+  "message.noMoreComment": "No more comments",
33
+  "message.noMoreData": "No more data",
34
+  "message.notNull": "It's still empty",
35
+  "message.success": "Comments sent",
36
+  "message.replyNoNull": "It's still empty",
37
+  "message.replySuccess": "Reply sent",
38
+  "message.cancelLickSuccess": "Unliked",
39
+  "message.likeSuccess": "Liked"
40
+};
41
+
42
+exports.default = USdata;
43
+//# sourceMappingURL=en-US.js.map

+ 1
- 0
lib/lang/en-US.js.map View File

@@ -0,0 +1 @@
1
+{"version":3,"sources":["../../src/lang/en-US.js"],"names":["USdata"],"mappings":";;;;;AAAA,IAAMA,SAAS;AACb,2BAAyB,uBADZ;AAEb,wBAAsB,eAFT;AAGb,sBAAoB,2BAHP;AAIb,sBAAoB,MAJP;AAKb,sBAAoB,iBALP;AAMb,wBAAsB,iCANT;AAOb,sBAAoB,QAPP;;AASb,qBAAmB,SATN;AAUb,0BACE,4DAXW;AAYb,mBAAiB,OAZJ;AAab,yBAAuB,eAbV;;AAeb,sBAAoB,yDAfP;AAgBb,qBAAmB,cAhBN;AAiBb,oBAAkB,cAjBL;;AAmBb,sBAAoB,MAnBP;AAoBb,0BAAwB,kBApBX;;AAsBb,sBAAoB,SAtBP;AAuBb,mBAAiB,SAvBJ;AAwBb,uBAAqB,QAxBR;AAyBb,uBAAqB,QAzBR;;AA2Bb,2BAAyB,kBA3BZ;AA4Bb,wBAAsB,cA5BT;AA6Bb,qBAAmB,kBA7BN;AA8Bb,qBAAmB,eA9BN;AA+Bb,yBAAuB,kBA/BV;AAgCb,0BAAwB,YAhCX;AAiCb,+BAA6B,SAjChB;AAkCb,yBAAuB;AAlCV,CAAf;;kBAqCeA,M","file":"en-US.js","sourcesContent":["const USdata = {\r\n  \"editor.alreadyEntered\": \"{count} words entered\",\r\n  \"editor.placeholder\": \"Say something\",\r\n  \"editor.maxLength\": \"Maximum {maxLength} words\",\r\n  \"editor.SubmitBtn\": \"Send\",\r\n  \"editor.uploadTip\": \"Upload pictures\",\r\n  \"editor.uploadCount\": \"(You could upload {count} more)\",\r\n  \"editor.uploadBtn\": \"Upload\",\r\n\r\n  \"comment.tourist\": \"Visitor\",\r\n  \"comment.totalComment\":\r\n    \"Total {total, plural, =1 {one comment} other {# comments}}\",\r\n  \"comment.reply\": \"Reply\",\r\n  \"comment.moreComment\": \"More comments\",\r\n\r\n  \"reply.totalReply\": \"Total {total, plural, =1 {one reply} other {# replies}}\",\r\n  \"reply.moreReply\": \"More replies\",\r\n  \"reply.collapse\": \"Fold replies\",\r\n\r\n  \"picture.collapse\": \"Fold\",\r\n  \"picture.viewOriginal\": \"See the original\",\r\n\r\n  \"popConfirm.title\": \"Delete?\",\r\n  \"popConfirm.ok\": \"Confirm\",\r\n  \"popConfirm.cancel\": \"Cancel\",\r\n  \"popConfirm.delete\": \"Delete\",\r\n\r\n  \"message.noMoreComment\": \"No more comments\",\r\n  \"message.noMoreData\": \"No more data\",\r\n  \"message.notNull\": \"It's still empty\",\r\n  \"message.success\": \"Comments sent\",\r\n  \"message.replyNoNull\": \"It's still empty\",\r\n  \"message.replySuccess\": \"Reply sent\",\r\n  \"message.cancelLickSuccess\": \"Unliked\",\r\n  \"message.likeSuccess\": \"Liked\"\r\n};\r\n\r\nexport default USdata;\r\n"]}

+ 37
- 15
lib/lang/index.js View File

@@ -3,20 +3,42 @@
3 3
 Object.defineProperty(exports, "__esModule", {
4 4
   value: true
5 5
 });
6
-// 语言包
7
-// 英文短语和中文提示的对应
8
-var data = {
9
-  "not found": "没有数据",
10
-  "auth failed": "请先登录",
11
-  "create comment failed": "创建评论失败",
12
-  "comment favor failed": "评论点赞失败",
13
-  "delete comment favor failed": "评论取消点赞失败",
14
-  "get comments failed": "获取评论列表失败",
15
-  "create reply failed": "创建回复失败",
16
-  "reply favor failed": "回复点赞失败",
17
-  "delete reply favor failed": "删除回复点赞失败",
18
-  "get replies failed": "获取回复列表失败"
19
-};
6
+/**
7
+ * 当前支持的语言
8
+ */
9
+var SUPPORT_LOCALES = exports.SUPPORT_LOCALES = [{
10
+  name: "English",
11
+  value: "en-US"
12
+}, {
13
+  name: "简体中文",
14
+  value: "zh-CN"
15
+}];
20 16
 
21
-exports.default = data;
17
+// 服务端返回的英文短语和中文提示的对应
18
+var LOCALES_RESPONSE = exports.LOCALES_RESPONSE = {
19
+  "zh-CN": {
20
+    "not found": "没有数据",
21
+    "auth failed": "请先登录",
22
+    "create comment failed": "评论未发送",
23
+    "comment favor failed": "点赞失败",
24
+    "delete comment favor failed": "取消点赞失败",
25
+    "get comments failed": "评论加载失败",
26
+    "create reply failed": "回复失败",
27
+    "reply favor failed": "点赞失败",
28
+    "delete reply favor failed": "取消点赞失败",
29
+    "get replies failed": "回复加载失败"
30
+  },
31
+  "en-US": {
32
+    "not found": "No data",
33
+    "auth failed": "Please Login",
34
+    "create comment failed": "Comments not sent",
35
+    "comment favor failed": "Liking failed",
36
+    "delete comment favor failed": "Unliking failed",
37
+    "get comments failed": "Comments loading failed",
38
+    "create reply failed": "Replying failed",
39
+    "reply favor failed": "Liking failed",
40
+    "delete reply favor failed": "Unliking failed",
41
+    "get replies failed": "Loading of replies failed"
42
+  }
43
+};
22 44
 //# sourceMappingURL=index.js.map

+ 1
- 1
lib/lang/index.js.map View File

@@ -1 +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":["// 语言包\r\n// 英文短语和中文提示的对应\r\nconst data = {\r\n  \"not found\": \"没有数据\",\r\n  \"auth failed\": \"请先登录\",\r\n  \"create comment failed\": \"创建评论失败\",\r\n  \"comment favor failed\": \"评论点赞失败\",\r\n  \"delete comment favor failed\": \"评论取消点赞失败\",\r\n  \"get comments failed\": \"获取评论列表失败\",\r\n  \"create reply failed\": \"创建回复失败\",\r\n  \"reply favor failed\": \"回复点赞失败\",\r\n  \"delete reply favor failed\": \"删除回复点赞失败\",\r\n  \"get replies failed\": \"获取回复列表失败\"\r\n};\r\n\r\nexport default data;\r\n"]}
1
+{"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,OAHlB;AAIP,4BAAwB,MAJjB;AAKP,mCAA+B,QALxB;AAMP,2BAAuB,QANhB;AAOP,2BAAuB,MAPhB;AAQP,0BAAsB,MARf;AASP,iCAA6B,QATtB;AAUP,0BAAsB;AAVf,GADqB;AAa9B,WAAS;AACP,iBAAa,SADN;AAEP,mBAAe,cAFR;AAGP,6BAAyB,mBAHlB;AAIP,4BAAwB,eAJjB;AAKP,mCAA+B,iBALxB;AAMP,2BAAuB,yBANhB;AAOP,2BAAuB,iBAPhB;AAQP,0BAAsB,eARf;AASP,iCAA6B,iBATtB;AAUP,0BAAsB;AAVf;AAbqB,CAAzB","file":"index.js","sourcesContent":["/**\r\n * 当前支持的语言\r\n */\r\nexport const SUPPORT_LOCALES = [\r\n  {\r\n    name: \"English\",\r\n    value: \"en-US\"\r\n  },\r\n  {\r\n    name: \"简体中文\",\r\n    value: \"zh-CN\"\r\n  }\r\n];\r\n\r\n// 服务端返回的英文短语和中文提示的对应\r\nexport const LOCALES_RESPONSE = {\r\n  \"zh-CN\": {\r\n    \"not found\": \"没有数据\",\r\n    \"auth failed\": \"请先登录\",\r\n    \"create comment failed\": \"评论未发送\",\r\n    \"comment favor failed\": \"点赞失败\",\r\n    \"delete comment favor failed\": \"取消点赞失败\",\r\n    \"get comments failed\": \"评论加载失败\",\r\n    \"create reply failed\": \"回复失败\",\r\n    \"reply favor failed\": \"点赞失败\",\r\n    \"delete reply favor failed\": \"取消点赞失败\",\r\n    \"get replies failed\": \"回复加载失败\"\r\n  },\r\n  \"en-US\": {\r\n    \"not found\": \"No data\",\r\n    \"auth failed\": \"Please Login\",\r\n    \"create comment failed\": \"Comments not sent\",\r\n    \"comment favor failed\": \"Liking failed\",\r\n    \"delete comment favor failed\": \"Unliking failed\",\r\n    \"get comments failed\": \"Comments loading failed\",\r\n    \"create reply failed\": \"Replying failed\",\r\n    \"reply favor failed\": \"Liking failed\",\r\n    \"delete reply favor failed\": \"Unliking failed\",\r\n    \"get replies failed\": \"Loading of replies failed\"\r\n  }\r\n};\r\n"]}

+ 43
- 0
lib/lang/zh-CN.js View File

@@ -0,0 +1,43 @@
1
+"use strict";
2
+
3
+Object.defineProperty(exports, "__esModule", {
4
+  value: true
5
+});
6
+var CNdata = {
7
+  "editor.alreadyEntered": "已输入{count}/{maxLength}字",
8
+  "editor.placeholder": "说点什么吧...",
9
+  "editor.maxLength": "字数上限{maxLength}",
10
+  "editor.SubmitBtn": "发送",
11
+  "editor.uploadTip": "上传图片",
12
+  "editor.uploadCount": "(您还能上传{count}张图片)",
13
+  "editor.uploadBtn": "上传",
14
+
15
+  "comment.tourist": "游客",
16
+  "comment.totalComment": "共{total}条评论",
17
+  "comment.reply": "回复",
18
+  "comment.moreComment": "更多评论",
19
+
20
+  "reply.totalReply": "共{total}条回复",
21
+  "reply.moreReply": "更多回复",
22
+  "reply.collapse": "收起回复",
23
+
24
+  "picture.collapse": "收起",
25
+  "picture.viewOriginal": "查看原图",
26
+
27
+  "popConfirm.title": "确定要删除吗",
28
+  "popConfirm.ok": "确定",
29
+  "popConfirm.cancel": "取消",
30
+  "popConfirm.delete": "删除",
31
+
32
+  "message.noMoreComment": "没有更多评论了",
33
+  "message.noMoreData": "没有更多数据了!",
34
+  "message.notNull": "没写内容呢",
35
+  "message.success": "评论已发送!",
36
+  "message.replyNoNull": "没写内容呢",
37
+  "message.replySuccess": "回复已发送!",
38
+  "message.cancelLickSuccess": "已取消点赞!",
39
+  "message.likeSuccess": "已赞!"
40
+};
41
+
42
+exports.default = CNdata;
43
+//# sourceMappingURL=zh-CN.js.map

+ 1
- 0
lib/lang/zh-CN.js.map View File

@@ -0,0 +1 @@
1
+{"version":3,"sources":["../../src/lang/zh-CN.js"],"names":["CNdata"],"mappings":";;;;;AAAA,IAAMA,SAAS;AACb,2BAAyB,yBADZ;AAEb,wBAAsB,UAFT;AAGb,sBAAoB,iBAHP;AAIb,sBAAoB,IAJP;AAKb,sBAAoB,MALP;AAMb,wBAAsB,mBANT;AAOb,sBAAoB,IAPP;;AASb,qBAAmB,IATN;AAUb,0BAAwB,aAVX;AAWb,mBAAiB,IAXJ;AAYb,yBAAuB,MAZV;;AAcb,sBAAoB,aAdP;AAeb,qBAAmB,MAfN;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,OA5BN;AA6Bb,qBAAmB,QA7BN;AA8Bb,yBAAuB,OA9BV;AA+Bb,0BAAwB,QA/BX;AAgCb,+BAA6B,QAhChB;AAiCb,yBAAuB;AAjCV,CAAf;;kBAoCeA,M","file":"zh-CN.js","sourcesContent":["const CNdata = {\r\n  \"editor.alreadyEntered\": \"已输入{count}/{maxLength}字\",\r\n  \"editor.placeholder\": \"说点什么吧...\",\r\n  \"editor.maxLength\": \"字数上限{maxLength}\",\r\n  \"editor.SubmitBtn\": \"发送\",\r\n  \"editor.uploadTip\": \"上传图片\",\r\n  \"editor.uploadCount\": \"(您还能上传{count}张图片)\",\r\n  \"editor.uploadBtn\": \"上传\",\r\n\r\n  \"comment.tourist\": \"游客\",\r\n  \"comment.totalComment\": \"共{total}条评论\",\r\n  \"comment.reply\": \"回复\",\r\n  \"comment.moreComment\": \"更多评论\",\r\n\r\n  \"reply.totalReply\": \"共{total}条回复\",\r\n  \"reply.moreReply\": \"更多回复\",\r\n  \"reply.collapse\": \"收起回复\",\r\n\r\n  \"picture.collapse\": \"收起\",\r\n  \"picture.viewOriginal\": \"查看原图\",\r\n\r\n  \"popConfirm.title\": \"确定要删除吗\",\r\n  \"popConfirm.ok\": \"确定\",\r\n  \"popConfirm.cancel\": \"取消\",\r\n  \"popConfirm.delete\": \"删除\",\r\n\r\n  \"message.noMoreComment\": \"没有更多评论了\",\r\n  \"message.noMoreData\": \"没有更多数据了!\",\r\n  \"message.notNull\": \"没写内容呢\",\r\n  \"message.success\": \"评论已发送!\",\r\n  \"message.replyNoNull\": \"没写内容呢\",\r\n  \"message.replySuccess\": \"回复已发送!\",\r\n  \"message.cancelLickSuccess\": \"已取消点赞!\",\r\n  \"message.likeSuccess\": \"已赞!\"\r\n};\r\n\r\nexport default CNdata;\r\n"]}

+ 0
- 72
lib/mock.js View File

@@ -1,72 +0,0 @@
1
-'use strict';
2
-
3
-Object.defineProperty(exports, "__esModule", {
4
-  value: true
5
-});
6
-var comments = exports.comments = {
7
-  list: [{
8
-    id: '5b3a4f0973df3e6a32b0a9d2',
9
-    user_id: 0,
10
-    user_name: '',
11
-    user_avatar: '',
12
-    content: 'test[微笑]',
13
-    replies: [{
14
-      id: '5b3c58c473df3e64d8d53afb',
15
-      user_id: 0,
16
-      user_name: '',
17
-      user_avatar: '',
18
-      reply: null,
19
-      content: 'test',
20
-      favor_count: 1,
21
-      favored: false,
22
-      created: 1530681540
23
-    }, {
24
-      id: '5b3c58c473df3e64d8d53afa',
25
-      user_id: 0,
26
-      user_name: '',
27
-      user_avatar: '',
28
-      reply: {
29
-        id: '5b3c58c473df3e64d8d53afb',
30
-        user_id: 0,
31
-        user_name: '',
32
-        user_avatar: '',
33
-        reply: null,
34
-        content: 'test',
35
-        favor_count: 1,
36
-        favored: false,
37
-        created: 1530681540
38
-      },
39
-      content: 'test',
40
-      favor_count: 2,
41
-      favored: false,
42
-      created: 1530681540
43
-    }, {
44
-      id: '5b3c6e4873df3e53f870d912',
45
-      user_id: 0,
46
-      user_name: '',
47
-      user_avatar: '',
48
-      reply: {
49
-        id: '5b3c58c473df3e64d8d53afb',
50
-        user_id: 0,
51
-        user_name: '',
52
-        user_avatar: '',
53
-        reply: null,
54
-        content: 'test',
55
-        favor_count: 1,
56
-        favored: false,
57
-        created: 1530681540
58
-      },
59
-      content: 'test',
60
-      favor_count: 0,
61
-      favored: false,
62
-      created: 1530687048
63
-    }],
64
-    reply_count: 4,
65
-    favor_count: 0,
66
-    favored: false,
67
-    created: 1530547977
68
-  }],
69
-  total: 1,
70
-  page: 1
71
-};
72
-//# sourceMappingURL=mock.js.map

+ 0
- 1
lib/mock.js.map View File

@@ -1 +0,0 @@
1
-{"version":3,"sources":["../src/mock.js"],"names":["comments","list","id","user_id","user_name","user_avatar","content","replies","reply","favor_count","favored","created","reply_count","total","page"],"mappings":";;;;;AAAO,IAAMA,8BAAW;AACtBC,QAAM,CACJ;AACEC,QAAI,0BADN;AAEEC,aAAS,CAFX;AAGEC,eAAW,EAHb;AAIEC,iBAAa,EAJf;AAKEC,aAAS,UALX;AAMEC,aAAS,CACP;AACEL,UAAI,0BADN;AAEEC,eAAS,CAFX;AAGEC,iBAAW,EAHb;AAIEC,mBAAa,EAJf;AAKEG,aAAO,IALT;AAMEF,eAAS,MANX;AAOEG,mBAAa,CAPf;AAQEC,eAAS,KARX;AASEC,eAAS;AATX,KADO,EAYP;AACET,UAAI,0BADN;AAEEC,eAAS,CAFX;AAGEC,iBAAW,EAHb;AAIEC,mBAAa,EAJf;AAKEG,aAAO;AACLN,YAAI,0BADC;AAELC,iBAAS,CAFJ;AAGLC,mBAAW,EAHN;AAILC,qBAAa,EAJR;AAKLG,eAAO,IALF;AAMLF,iBAAS,MANJ;AAOLG,qBAAa,CAPR;AAQLC,iBAAS,KARJ;AASLC,iBAAS;AATJ,OALT;AAgBEL,eAAS,MAhBX;AAiBEG,mBAAa,CAjBf;AAkBEC,eAAS,KAlBX;AAmBEC,eAAS;AAnBX,KAZO,EAiCP;AACET,UAAI,0BADN;AAEEC,eAAS,CAFX;AAGEC,iBAAW,EAHb;AAIEC,mBAAa,EAJf;AAKEG,aAAO;AACLN,YAAI,0BADC;AAELC,iBAAS,CAFJ;AAGLC,mBAAW,EAHN;AAILC,qBAAa,EAJR;AAKLG,eAAO,IALF;AAMLF,iBAAS,MANJ;AAOLG,qBAAa,CAPR;AAQLC,iBAAS,KARJ;AASLC,iBAAS;AATJ,OALT;AAgBEL,eAAS,MAhBX;AAiBEG,mBAAa,CAjBf;AAkBEC,eAAS,KAlBX;AAmBEC,eAAS;AAnBX,KAjCO,CANX;AA6DEC,iBAAa,CA7Df;AA8DEH,iBAAa,CA9Df;AA+DEC,aAAS,KA/DX;AAgEEC,aAAS;AAhEX,GADI,CADgB;AAqEtBE,SAAO,CArEe;AAsEtBC,QAAM;AAtEgB,CAAjB","file":"mock.js","sourcesContent":["export const comments = {\n  list: [\n    {\n      id: '5b3a4f0973df3e6a32b0a9d2',\n      user_id: 0,\n      user_name: '',\n      user_avatar: '',\n      content: 'test[微笑]',\n      replies: [\n        {\n          id: '5b3c58c473df3e64d8d53afb',\n          user_id: 0,\n          user_name: '',\n          user_avatar: '',\n          reply: null,\n          content: 'test',\n          favor_count: 1,\n          favored: false,\n          created: 1530681540,\n        },\n        {\n          id: '5b3c58c473df3e64d8d53afa',\n          user_id: 0,\n          user_name: '',\n          user_avatar: '',\n          reply: {\n            id: '5b3c58c473df3e64d8d53afb',\n            user_id: 0,\n            user_name: '',\n            user_avatar: '',\n            reply: null,\n            content: 'test',\n            favor_count: 1,\n            favored: false,\n            created: 1530681540,\n          },\n          content: 'test',\n          favor_count: 2,\n          favored: false,\n          created: 1530681540,\n        },\n        {\n          id: '5b3c6e4873df3e53f870d912',\n          user_id: 0,\n          user_name: '',\n          user_avatar: '',\n          reply: {\n            id: '5b3c58c473df3e64d8d53afb',\n            user_id: 0,\n            user_name: '',\n            user_avatar: '',\n            reply: null,\n            content: 'test',\n            favor_count: 1,\n            favored: false,\n            created: 1530681540,\n          },\n          content: 'test',\n          favor_count: 0,\n          favored: false,\n          created: 1530687048,\n        },\n      ],\n      reply_count: 4,\n      favor_count: 0,\n      favored: false,\n      created: 1530547977,\n    },\n  ],\n  total: 1,\n  page: 1,\n};\n"]}

+ 2
- 1
package.json View File

@@ -1,6 +1,6 @@
1 1
 {
2 2
   "name": "comment",
3
-  "version": "0.5.14",
3
+  "version": "1.0.2",
4 4
   "main": "lib/App.js",
5 5
   "description": "通用评论",
6 6
   "keywords": [
@@ -20,6 +20,7 @@
20 20
     "prop-types": "^15.6.2",
21 21
     "react": "^16.4.1",
22 22
     "react-dom": "^16.4.1",
23
+    "react-intl-universal": "^1.15.2",
23 24
     "react-scripts": "1.1.4",
24 25
     "shortid": "^2.2.11"
25 26
   },

+ 21
- 0
public/locales/en-US.json View File

@@ -0,0 +1,21 @@
1
+{
2
+  "editor.alreadyEntered": "已输入{count}/140字",
3
+  "editor.placeholder": "say...",
4
+  "editor.SubmitBtn": "Submit",
5
+  "editor.uploadTip": "上传图片",
6
+  "editor.uploadCount": "(您还能上传{count}张图片)",
7
+  "editor.uploadBtn": "upload",
8
+
9
+  "comment.totalComment": "共{total}条评论",
10
+  "comment.reply": "reply",
11
+  "comment.moreComment": "More",
12
+
13
+  "reply.totalReply": "{total}条回复",
14
+  "reply.moreReply": "More",
15
+  "reply.collapse": "收起回复",
16
+
17
+  "popConfirm.title": "Sure?",
18
+  "popConfirm.ok": "Ok",
19
+  "popConfirm.cancel": "Cancel",
20
+  "popConfirm.delete": "Delete"
21
+}

+ 21
- 0
public/locales/zh-CN.json View File

@@ -0,0 +1,21 @@
1
+{
2
+  "editor.alreadyEntered": "已输入{count}/140字",
3
+  "editor.placeholder": "说点什么吧...",
4
+  "editor.SubmitBtn": "发表",
5
+  "editor.uploadTip": "上传图片",
6
+  "editor.uploadCount": "(您还能上传{count}张图片)",
7
+  "editor.uploadBtn": "上传",
8
+
9
+  "comment.totalComment": "共{total}条评论",
10
+  "comment.reply": "回复",
11
+  "comment.moreComment": "查看更多评论",
12
+
13
+  "reply.totalReply": "{total}条回复",
14
+  "reply.moreReply": "查看更多回复",
15
+  "reply.collapse": "收起回复",
16
+
17
+  "popConfirm.title": "确定要删除吗",
18
+  "popConfirm.ok": "确定",
19
+  "popConfirm.cancel": "取消",
20
+  "popConfirm.delete": "删除"
21
+}

+ 91
- 28
src/App.js View File

@@ -2,6 +2,7 @@ import React, { Component } from "react";
2 2
 import PropTypes from "prop-types";
3 3
 import { message } from "antd";
4 4
 import axios from "axios";
5
+import intl from "react-intl-universal";
5 6
 import { ERROR_DEFAULT, LIMIT, COMMENT_TYPE } from "./constant";
6 7
 import { CommentContext } from "./Comment";
7 8
 import { isFunction } from "./helper";
@@ -9,9 +10,15 @@ import CommentInput from "./components/CommentInput";
9 10
 import CommentList from "./components/CommentList";
10 11
 import Editor from "./components/Editor";
11 12
 import RenderText from "./components/RenderText";
12
-import lang from "./lang";
13
+import { SUPPORT_LOCALES, LOCALES_RESPONSE } from "./lang";
14
+import USdata from "./lang/en-US.js";
15
+import CNdata from "./lang/zh-CN.js";
13 16
 import "./App.css";
14
-// import styles from "./App.module.css";
17
+
18
+const LOCALES = {
19
+  "zh-CN": CNdata,
20
+  "en-US": USdata
21
+};
15 22
 
16 23
 class App extends Component {
17 24
   constructor(props) {
@@ -27,7 +34,9 @@ class App extends Component {
27 34
       page: 1,
28 35
       total: 0,
29 36
       // 是否没有更多评论了
30
-      isNoMoreComment: false
37
+      isNoMoreComment: false,
38
+      initDone: false,
39
+      locale: "zh-CN"
31 40
     };
32 41
     this.handleChangeLoading = this.handleChangeLoading.bind(this);
33 42
     this.sCreateComment = this.sCreateComment.bind(this);
@@ -52,7 +61,36 @@ class App extends Component {
52 61
     }
53 62
   }
54 63
 
55
-  componentDidMount() {}
64
+  componentDidMount() {
65
+    this.loadLocales();
66
+  }
67
+
68
+  /**
69
+   * 加载语言包
70
+   * 只能根据url或者传入的props来确定加载哪个语言包
71
+   * 优先级:传入的props > url
72
+   */
73
+  loadLocales() {
74
+    let { locales: currentLocale } = this.props;
75
+    if (!currentLocale) {
76
+      currentLocale = intl.determineLocale({
77
+        urlLocaleKey: "lang"
78
+      });
79
+    }
80
+    currentLocale = SUPPORT_LOCALES.find(item => item.value === currentLocale)
81
+      ? currentLocale
82
+      : "zh-CN";
83
+    intl
84
+      .init({
85
+        currentLocale,
86
+        locales: {
87
+          [currentLocale]: LOCALES[currentLocale]
88
+        }
89
+      })
90
+      .then(() => {
91
+        this.setState({ initDone: true, locale: currentLocale });
92
+      });
93
+  }
56 94
 
57 95
   error(msg, info = {}) {
58 96
     if (this.props.showError) {
@@ -64,13 +102,15 @@ class App extends Component {
64 102
   }
65 103
 
66 104
   errorHandler(error) {
105
+    const { locale } = this.state;
106
+    const localResponse = LOCALES_RESPONSE[locale];
67 107
     if (error.response && error.response.data && error.response.data.msg) {
68
-      this.error(lang[error.response.data.msg] || ERROR_DEFAULT, {
108
+      this.error(localResponse[error.response.data.msg] || ERROR_DEFAULT, {
69 109
         response: error.response
70 110
       });
71 111
       return;
72 112
     }
73
-    this.error(lang[error.message] || ERROR_DEFAULT, {
113
+    this.error(localResponse[error.response.data.msg] || ERROR_DEFAULT, {
74 114
       response: error.response
75 115
     });
76 116
   }
@@ -118,8 +158,9 @@ class App extends Component {
118 158
             page,
119 159
             total
120 160
           });
161
+          this.props.onCountChange(total);
121 162
         } else {
122
-          message.info("没有更多评论了");
163
+          message.info(intl.get("message.noMoreComment"));
123 164
           this.setState({
124 165
             isNoMoreComment: true
125 166
           });
@@ -141,7 +182,7 @@ class App extends Component {
141 182
       .get(`${API}/replies?comment_id=${commentId}&page=${page}&limit=${limit}`)
142 183
       .then(response => {
143 184
         if (!response.data.list) {
144
-          message.info("没有更多数据了!");
185
+          message.info(intl.get("message.noMoreData"));
145 186
         }
146 187
         const list = this.state.list.map(item => {
147 188
           if (item.id === commentId) {
@@ -178,21 +219,22 @@ class App extends Component {
178 219
    * @param {object} {content} comment content
179 220
    */
180 221
   sCreateComment({ content } = {}, cb) {
181
-    if (!content) return this.error("评论内容不能为空 ");
222
+    if (!content) return this.error(intl.get("message.notNull"));
182 223
     this.handleChangeLoading("sCreateComment", true);
183
-    const { API, type, businessId } = this.props;
224
+    const { API, type, businessId, businessUserId } = this.props;
184 225
     this.axios(`${API}/comments`, {
185 226
       method: "post",
186 227
       data: {
187 228
         type,
188 229
         business_id: businessId,
230
+        business_user_id: businessUserId,
189 231
         content
190 232
       },
191 233
       withCredentials: true
192 234
     })
193 235
       .then(response => {
194 236
         if (this.props.showAlertComment) {
195
-          message.success("评论成功!");
237
+          message.success(intl.get("message.success"));
196 238
         }
197 239
         if (isFunction(cb)) cb();
198 240
         // 将数据写入到 list 中
@@ -204,6 +246,7 @@ class App extends Component {
204 246
           isTemporary: true // 临时的数据
205 247
         });
206 248
         this.setState({ list, total: total + 1 });
249
+        this.props.onCountChange(total + 1);
207 250
       })
208 251
       .catch(this.errorHandler)
209 252
       .finally(() => {
@@ -226,6 +269,7 @@ class App extends Component {
226 269
         const res = list.filter(item => item.id !== commentId);
227 270
         this.setState({ list: res, total: total - 1 });
228 271
         this.props.onDelete(COMMENT_TYPE.COMMENT);
272
+        this.props.onCountChange(total - 1);
229 273
       })
230 274
       .catch(this.errorHandler)
231 275
       .finally(() => {
@@ -239,7 +283,7 @@ class App extends Component {
239 283
    * @param {object} data { comment_id, content, [reply_id] }
240 284
    */
241 285
   sCreateReply(data, cb) {
242
-    if (!data.content) return this.error("回复内容不能为空 ");
286
+    if (!data.content) return this.error(intl.get("message.replyNoNull"));
243 287
     this.handleChangeLoading("sCreateReply", true);
244 288
     const { API } = this.props;
245 289
     this.axios(`${API}/replies`, {
@@ -249,7 +293,7 @@ class App extends Component {
249 293
     })
250 294
       .then(response => {
251 295
         if (this.props.showAlertReply) {
252
-          message.success("回复成功!");
296
+          message.success(intl.get("message.replySuccess"));
253 297
         }
254 298
         if (isFunction(cb)) cb();
255 299
         // 将数据写入到 list 中
@@ -318,7 +362,11 @@ class App extends Component {
318 362
     })
319 363
       .then(response => {
320 364
         if (this.props.showAlertFavor) {
321
-          message.success(favored ? "取消点赞成功!" : "点赞成功!");
365
+          message.success(
366
+            favored
367
+              ? intl.get("message.cancelLickSuccess")
368
+              : intl.get("message.likeSuccess")
369
+          );
322 370
         }
323 371
         // 更新 list 中的该项数据的 favored
324 372
         const list = this.state.list.map(item => {
@@ -353,7 +401,11 @@ class App extends Component {
353 401
       withCredentials: true
354 402
     })
355 403
       .then(response => {
356
-        message.success(favored ? "取消点赞成功!" : "点赞成功!");
404
+        message.success(
405
+          favored
406
+            ? intl.get("message.cancelLickSuccess")
407
+            : intl.get("message.likeSuccess")
408
+        );
357 409
         // 更新 list 中的该项数据的 favored
358 410
         const list = this.state.list.map(item => {
359 411
           if (item.id === commentId) {
@@ -414,18 +466,20 @@ class App extends Component {
414 466
     console.log(this.props.isMobile);
415 467
 
416 468
     return (
417
-      <CommentContext.Provider value={value}>
418
-        <div className="comment">
419
-          {this.props.showEditor && (
420
-            <CommentInput content={this.props.children} />
421
-          )}
422
-          {this.props.showList && (
423
-            <div style={{ marginTop: 20 }}>
424
-              <CommentList />
425
-            </div>
426
-          )}
427
-        </div>
428
-      </CommentContext.Provider>
469
+      this.state.initDone && (
470
+        <CommentContext.Provider value={value}>
471
+          <div className="comment">
472
+            {this.props.showEditor && (
473
+              <CommentInput content={this.props.children} />
474
+            )}
475
+            {this.props.showList && (
476
+              <div style={{ marginTop: 20 }}>
477
+                <CommentList />
478
+              </div>
479
+            )}
480
+          </div>
481
+        </CommentContext.Provider>
482
+      )
429 483
     );
430 484
   }
431 485
 }
@@ -433,6 +487,7 @@ class App extends Component {
433 487
 App.propTypes = {
434 488
   type: PropTypes.number.isRequired, // 评论的 type
435 489
   businessId: PropTypes.string.isRequired, // 评论的 business_id
490
+  businessUserId: PropTypes.number,
436 491
   API: PropTypes.string, // 评论的 API 前缀
437 492
   showList: PropTypes.bool, // 是否显示评论列表
438 493
   showEditor: PropTypes.bool, // 是否显示评论输入框
@@ -447,11 +502,18 @@ App.propTypes = {
447 502
   limit: PropTypes.number, // 一次加载评论数量
448 503
   onPageChange: PropTypes.func, // 页码变化回调
449 504
   onGetMoreBtnClick: PropTypes.func, // 点击查看更多按钮回调
505
+<<<<<<< HEAD
450 506
   isMobile: PropTypes.bool,
451 507
   onDelete: PropTypes.func
508
+=======
509
+  onDelete: PropTypes.func,
510
+  locales: PropTypes.string, //  传入的语言环境, en-US/zh-CN
511
+  onCountChange: PropTypes.func // 评论数量变更时的回调
512
+>>>>>>> upstream/master
452 513
 };
453 514
 
454 515
 App.defaultProps = {
516
+  businessUserId: 0,
455 517
   API: "//api.links123.net/comment/v1",
456 518
   showList: true,
457 519
   showEditor: true,
@@ -463,7 +525,8 @@ App.defaultProps = {
463 525
   limit: LIMIT,
464 526
   onGetMoreBtnClick: () => {},
465 527
   onPageChange: page => {},
466
-  onDelete: () => {}
528
+  onDelete: () => {},
529
+  onCountChange: () => {}
467 530
 };
468 531
 
469 532
 export { Editor, RenderText };

+ 3
- 2
src/components/CommentBox/index.js View File

@@ -1,6 +1,7 @@
1 1
 import React, { Component } from "react";
2 2
 import PropTypes from "prop-types";
3 3
 import { Icon } from "antd";
4
+import intl from "react-intl-universal";
4 5
 import Comment from "../../Comment";
5 6
 import ContentItem from "./../ContentItem";
6 7
 import "./index.css";
@@ -66,7 +67,7 @@ class CommentBox extends Component {
66 67
                       className="comment-show-more"
67 68
                       onClick={() => this.handleGetMoreReply(commentId)}
68 69
                     >
69
-                      查看更多回复
70
+                      {intl.get("reply.moreReply")}
70 71
                     </span>
71 72
                   )}
72 73
 
@@ -74,7 +75,7 @@ class CommentBox extends Component {
74 75
                     style={{ float: "right" }}
75 76
                     onClick={this.handleToggleReply}
76 77
                   >
77
-                    <Icon type="up" /> 收起回复
78
+                    <Icon type="up" /> {intl.get("reply.collapse")}
78 79
                   </a>
79 80
                 </div>
80 81
               ];

+ 5
- 3
src/components/CommentInput/index.js View File

@@ -27,7 +27,7 @@ class CommentInput extends Component {
27 27
       value = value.slice(0, -1);
28 28
     }
29 29
 
30
-    const { action, commentId, replyId, callback } = this.props;
30
+    const { action, commentId, replyId, userId, callback } = this.props;
31 31
     if (action === "comment") {
32 32
       this.props.app.sCreateComment(
33 33
         {
@@ -39,7 +39,8 @@ class CommentInput extends Component {
39 39
       this.props.app.sCreateReply(
40 40
         {
41 41
           comment_id: commentId,
42
-          content: value
42
+          content: value,
43
+          business_user_id: userId
43 44
         },
44 45
         () => callback && callback()
45 46
       );
@@ -48,7 +49,8 @@ class CommentInput extends Component {
48 49
         {
49 50
           comment_id: commentId,
50 51
           content: value,
51
-          reply_id: replyId
52
+          reply_id: replyId,
53
+          business_user_id: userId
52 54
         },
53 55
         () => callback && callback()
54 56
       );

+ 4
- 2
src/components/CommentList/index.js View File

@@ -1,5 +1,6 @@
1 1
 import React, { Component } from "react";
2 2
 import { Spin, Pagination } from "antd";
3
+import intl from "react-intl-universal";
3 4
 import Comment from "../../Comment";
4 5
 import CommentBox from "../CommentBox";
5 6
 import "./index.css";
@@ -43,7 +44,7 @@ class CommentList extends Component {
43 44
               onPageChange(page + 1);
44 45
             }}
45 46
           >
46
-            <span>查看更多评论</span>
47
+            <span>{intl.get("comment.moreComment")}</span>
47 48
           </div>
48 49
         );
49 50
       } else {
@@ -75,7 +76,8 @@ class CommentList extends Component {
75 76
     return (
76 77
       <div>
77 78
         <Spin spinning={spinning}>
78
-          <div>共 {total} 条评论</div>
79
+          {/* <div>共 {total} 条评论</div> */}
80
+          <div>{intl.get("comment.totalComment", { total })}</div>
79 81
           {list.map(item => (
80 82
             <CommentBox
81 83
               isMobile={isMobile}

+ 27
- 29
src/components/ContentItem/index.js View File

@@ -3,7 +3,9 @@ import PropTypes from "prop-types";
3 3
 import { Avatar, Icon, Tooltip, Popconfirm } from "antd";
4 4
 import dayjs from "dayjs";
5 5
 import "dayjs/locale/zh-cn";
6
+// import 'dayjs/locale/es';
6 7
 import relativeTime from "dayjs/plugin/relativeTime";
8
+import intl from "react-intl-universal";
7 9
 import Comment from "../../Comment";
8 10
 import CommentInput from "../CommentInput";
9 11
 import avatar from "../../avatar";
@@ -12,9 +14,13 @@ import { IMAGE_SPLIT } from "../../constant";
12 14
 import "./index.css";
13 15
 import ImagePreviewer from "../ImagePreviewer/ImagePreviewer";
14 16
 
15
-dayjs.locale("zh-cn");
17
+// dayjs.locale("zh-cn");
16 18
 dayjs.extend(relativeTime);
17 19
 
20
+const LOCALES = {
21
+  "zh-CN": "zh-cn"
22
+};
23
+
18 24
 class CommentItem extends Component {
19 25
   constructor(props) {
20 26
     super(props);
@@ -79,6 +85,7 @@ class CommentItem extends Component {
79 85
       app
80 86
     } = this.props;
81 87
 
88
+    const { locale } = this.props.app;
82 89
     const { showInput } = this.state;
83 90
 
84 91
     let newContent = content.content;
@@ -138,26 +145,8 @@ class CommentItem extends Component {
138 145
                       );
139 146
                     }
140 147
                     return (
141
-                      <div
142
-                        className="comment-item-image-wrapper"
143
-                        key={index}
144
-                        onClick={() => {
145
-                          let i = index;
146
-                          if (needClear) {
147
-                            if (index > 3) {
148
-                              i -= 1;
149
-                            }
150
-                            if (index > 7) {
151
-                              i -= 1;
152
-                            }
153
-                          }
154
-                          this.showPreviewer(i);
155
-                        }}
156
-                      >
157
-                        <div
158
-                          style={{ backgroundImage: `url(${item})` }}
159
-                          className="comment-img-thumbnail"
160
-                        />
148
+                      <div className="comment-item-image-wrapper" key={index}>
149
+                        <div className="comment-img-divider" />
161 150
                         {/* <img src={item} alt={item} className="comment-img" /> */}
162 151
                       </div>
163 152
                     );
@@ -258,7 +247,7 @@ class CommentItem extends Component {
258 247
             {/* <a href={`/${content.user_id}`}>
259 248
               {content.user_name || "暂无昵称"}
260 249
             </a> */}
261
-            <strong>{content.user_name || "游客"}</strong>
250
+            <strong>{content.user_name || intl.get("comment.tourist")}</strong>
262 251
             <span style={{ marginLeft: 10 }}>
263 252
               <Tooltip
264 253
                 placement="top"
@@ -266,7 +255,11 @@ class CommentItem extends Component {
266 255
                   "YYYY-MM-DD HH:mm:ss"
267 256
                 )}
268 257
               >
269
-                {dayjs(content.created * 1000).fromNow()}
258
+                {LOCALES[locale]
259
+                  ? dayjs(content.created * 1000)
260
+                      .locale(LOCALES[locale])
261
+                      .fromNow()
262
+                  : dayjs(content.created * 1000).fromNow()}
270 263
               </Tooltip>
271 264
             </span>
272 265
           </div>
@@ -330,14 +323,16 @@ class CommentItem extends Component {
330 323
             {content.reply_count ? (
331 324
               <div>
332 325
                 <a className="comment-item-bottom-left" onClick={onShowReply}>
333
-                  {content.reply_count} 条回复
326
+                  {/* {content.reply_count} 条回复 */}
327
+                  {intl.get("reply.totalReply", { total: content.reply_count })}
334 328
                   {showReply ? <Icon type="up" /> : <Icon type="down" />}
335 329
                 </a>
336 330
               </div>
337 331
             ) : null}
338 332
             {app.userId === content.user_id && (
339 333
               <Popconfirm
340
-                title="确定要删除吗?"
334
+                // title="确定要删除吗?"
335
+                title={intl.get("popConfirm.title")}
341 336
                 onConfirm={() => {
342 337
                   if (replyId) {
343 338
                     app.sDeleteReply(content.id, commentId);
@@ -345,17 +340,19 @@ class CommentItem extends Component {
345 340
                   }
346 341
                   app.sDeleteComment(content.id);
347 342
                 }}
348
-                okText="确定"
349
-                cancelText="取消"
343
+                okText={intl.get("popConfirm.ok")}
344
+                cancelText={intl.get("popConfirm.cancel")}
350 345
               >
351
-                <a className="comment-item-bottom-right">&nbsp; 删除</a>
346
+                <a className="comment-item-bottom-right">
347
+                  &nbsp; {intl.get("popConfirm.delete")}
348
+                </a>
352 349
               </Popconfirm>
353 350
             )}
354 351
             <a
355 352
               onClick={this.handleToggleInput}
356 353
               className="comment-item-bottom-right"
357 354
             >
358
-              &nbsp; 回复
355
+              &nbsp; {intl.get("comment.reply")}
359 356
             </a>
360 357
             <div
361 358
               className="comment-item-bottom-right"
@@ -387,6 +384,7 @@ class CommentItem extends Component {
387 384
             action={action}
388 385
             replyId={replyId}
389 386
             commentId={commentId}
387
+            userId={content.user_id}
390 388
             callback={this.handleToggleInput}
391 389
           />
392 390
         )}

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

@@ -2,6 +2,7 @@ import React from "react";
2 2
 import { Upload, Icon, Modal, message } from "antd";
3 3
 import dayjs from "dayjs";
4 4
 import shortid from "shortid";
5
+import intl from "react-intl-universal";
5 6
 import {
6 7
   OSS_ENDPOINT,
7 8
   OSS_BUCKET,
@@ -106,7 +107,7 @@ class App extends React.Component {
106 107
     const uploadButton = (
107 108
       <div>
108 109
         <Icon type="plus" />
109
-        <div className="ant-upload-text">上传</div>
110
+        <div className="ant-upload-text">{intl.get("editor.uploadBtn")}</div>
110 111
       </div>
111 112
     );
112 113
     return (

+ 17
- 8
src/components/Editor/index.js View File

@@ -2,6 +2,7 @@ import React from "react";
2 2
 import PropTypes from "prop-types";
3 3
 import { Icon, Button, Popover, Input, message } from "antd";
4 4
 import classnames from "classnames";
5
+import intl from "react-intl-universal";
5 6
 import { OSS_LINK } from "../../constant";
6 7
 import { isFunction } from "../../helper";
7 8
 import Upload from "./Upload";
@@ -119,7 +120,8 @@ class Editor extends React.Component {
119 120
     const { maxLength } = this.props;
120 121
     let { value, fileMap, fileList } = this.state;
121 122
     if (value.length > maxLength) {
122
-      message.error(`字数不得超过${maxLength}字`);
123
+      // message.error(`字数不得超过${maxLength}字`);
124
+      message.error(intl.get("editor.maxLength", { maxLength }));
123 125
       return;
124 126
     }
125 127
     const files = [];
@@ -166,13 +168,13 @@ class Editor extends React.Component {
166 168
   render() {
167 169
     const {
168 170
       value,
169
-      placeholder,
171
+      // placeholder,
170 172
       rows,
171 173
       showEmoji,
172 174
       showUpload,
173 175
       closeUploadWhenBlur,
174 176
       maxUpload,
175
-      btnSubmitText,
177
+      // btnSubmitText,
176 178
       btnLoading,
177 179
       btnDisabled,
178 180
       button,
@@ -181,6 +183,9 @@ class Editor extends React.Component {
181 183
       maxLength,
182 184
       autoFocus
183 185
     } = this.props;
186
+    let placeholder = this.props.placeholder || intl.get("editor.placeholder");
187
+    let btnSubmitText =
188
+      this.props.btnSubmitText || intl.get("editor.SubmitBtn");
184 189
     const handleSubmit = this.handleSubmit;
185 190
     const disabledSubmit =
186 191
       btnDisabled ||
@@ -194,7 +199,11 @@ class Editor extends React.Component {
194 199
             "comment-editor-toolbar-error": inputValue.length > maxLength
195 200
           })}
196 201
         >
197
-          已输入 {inputValue.length} / {maxLength} 字
202
+           
203
+          {/* {intl.get("editor.alreadyEntered", {
204
+            count: inputValue.length,
205
+            maxLength
206
+          })} */}
198 207
         </div>
199 208
         <div className="comment-editor">
200 209
           <TextArea
@@ -269,7 +278,7 @@ class Editor extends React.Component {
269 278
                   title={
270 279
                     <div style={{ margin: "5px auto" }}>
271 280
                       <span>
272
-                        上传图片
281
+                        {intl.get("editor.uploadTip")}
273 282
                         {maxUpload >= 2 ? (
274 283
                           <span style={{ color: "#666", fontWeight: 400 }}>
275 284
                             (您还能上传
@@ -354,16 +363,16 @@ Editor.propTypes = {
354 363
 
355 364
 Editor.defaultProps = {
356 365
   rows: 5,
357
-  placeholder: "说点什么吧...",
366
+  // placeholder: "说点什么吧",
358 367
   showEmoji: true,
359 368
   showUpload: true,
360 369
   closeUploadWhenBlur: false,
361 370
   maxUpload: 1,
362
-  btnSubmitText: "发表",
371
+  // btnSubmitText: "发表",
363 372
   btnLoading: false,
364 373
   btnDisabled: false,
365 374
   showError: true,
366
-  maxLength: 140
375
+  maxLength: 5000
367 376
 };
368 377
 
369 378
 export default Editor;

+ 3
- 2
src/components/ImagePreviewer/ImagePreviewer.jsx View File

@@ -1,6 +1,7 @@
1 1
 import React from "react";
2 2
 import classnames from "classnames";
3 3
 import { Icon, Spin } from "antd";
4
+import intl from "react-intl-universal";
4 5
 
5 6
 import "./ImagePreviewer.less";
6 7
 // import "./ImagePreviewer.css";
@@ -104,10 +105,10 @@ export default class ImagePreviewer extends React.Component {
104 105
         <div className="toolbar">
105 106
           <span className="button" onClick={onFold}>
106 107
             <Icon type="to-top" />
107
-            收起
108
+            {intl.get("picture.collapse")}
108 109
           </span>
109 110
           <span className="button" onClick={this.onOrigin}>
110
-            <Icon type="search" /> 查看原图
111
+            <Icon type="search" /> {intl.get("picture.viewOriginal")}
111 112
           </span>
112 113
           {/* <span className="button" onClick={this.rotateRight}>
113 114
                         <Icon type="reload" /> 向右旋转

+ 1
- 0
src/index.example.js View File

@@ -53,6 +53,7 @@ class Index extends Component {
53 53
         page={this.state.page}
54 54
         onPageChange={this.onPageChange}
55 55
         pageType="more"
56
+        businessUserId={4}
56 57
         onError={(msg, { response }) => {
57 58
           if (response.status === 401) {
58 59
             console.log("unlogined");

+ 18
- 20
src/index.js View File

@@ -4,15 +4,8 @@ import App, { Editor } from "./App";
4 4
 // import registerServiceWorker from "./registerServiceWorker";
5 5
 
6 6
 const Index = props => (
7
-  <App
8
-    isMobile
9
-    showAlertComment
10
-    showAlertReply
11
-    showAlertFavor
12
-    showError
13
-    {...props}
14
-  >
15
-    <Editor maxUpload={9} autoFocus />
7
+  <App showAlertComment showAlertReply showAlertFavor showError {...props}>
8
+    <Editor maxUpload={9} autoFocus {...props.editorProps} />
16 9
   </App>
17 10
 );
18 11
 
@@ -33,31 +26,36 @@ function renderComment(config) {
33 26
   }
34 27
   if (!config.businessId) {
35 28
     // throw new Error("businessId is required");
29
+    config.businessId = "test";
36 30
     console.warn("没有传入 businessId 参数,默认使用: test");
37 31
   }
38 32
   if (!config.API) {
39 33
     // throw new Error("API is required");
34
+    config.API = "http://api.links123.net/comment/v1";
40 35
     console.warn(
41 36
       "没有传入 API 参数,默认使用: http://api.links123.net/comment/v1"
42 37
     );
43 38
   }
44
-  const {
45
-    id,
46
-    type = 1,
47
-    businessId = "test",
48
-    API = "http://api.links123.net/comment/v1",
49
-    userId
50
-  } = config;
51 39
 
52
-  ReactDOM.render(
53
-    <Index type={type} businessId={businessId} API={API} userId={userId} />,
54
-    document.getElementById(id)
55
-  );
40
+  ReactDOM.render(<Index {...config} />, document.getElementById(config.id));
56 41
   // registerServiceWorker();
57 42
 }
58 43
 
59 44
 window.renderComment = renderComment;
60 45
 
46
+if (process.env.NODE_ENV !== "production") {
47
+  renderComment({
48
+    id: "root-comment",
49
+    type: 1,
50
+    businessId: "test",
51
+    businessUserId: 4,
52
+    userId: 71299,
53
+    onCountChange: c => {
54
+      console.log(c);
55
+    }
56
+  });
57
+}
58
+
61 59
 // renderComment({
62 60
 //   id: "root-comment",
63 61
 //   type: 1,

+ 38
- 0
src/lang/en-US.js View File

@@ -0,0 +1,38 @@
1
+const USdata = {
2
+  "editor.alreadyEntered": "{count} words entered",
3
+  "editor.placeholder": "Say something",
4
+  "editor.maxLength": "Maximum {maxLength} words",
5
+  "editor.SubmitBtn": "Send",
6
+  "editor.uploadTip": "Upload pictures",
7
+  "editor.uploadCount": "(You could upload {count} more)",
8
+  "editor.uploadBtn": "Upload",
9
+
10
+  "comment.tourist": "Visitor",
11
+  "comment.totalComment":
12
+    "Total {total, plural, =1 {one comment} other {# comments}}",
13
+  "comment.reply": "Reply",
14
+  "comment.moreComment": "More comments",
15
+
16
+  "reply.totalReply": "Total {total, plural, =1 {one reply} other {# replies}}",
17
+  "reply.moreReply": "More replies",
18
+  "reply.collapse": "Fold replies",
19
+
20
+  "picture.collapse": "Fold",
21
+  "picture.viewOriginal": "See the original",
22
+
23
+  "popConfirm.title": "Delete?",
24
+  "popConfirm.ok": "Confirm",
25
+  "popConfirm.cancel": "Cancel",
26
+  "popConfirm.delete": "Delete",
27
+
28
+  "message.noMoreComment": "No more comments",
29
+  "message.noMoreData": "No more data",
30
+  "message.notNull": "It's still empty",
31
+  "message.success": "Comments sent",
32
+  "message.replyNoNull": "It's still empty",
33
+  "message.replySuccess": "Reply sent",
34
+  "message.cancelLickSuccess": "Unliked",
35
+  "message.likeSuccess": "Liked"
36
+};
37
+
38
+export default USdata;

+ 40
- 15
src/lang/index.js View File

@@ -1,16 +1,41 @@
1
-// 语言包
2
-// 英文短语和中文提示的对应
3
-const data = {
4
-  "not found": "没有数据",
5
-  "auth failed": "请先登录",
6
-  "create comment failed": "创建评论失败",
7
-  "comment favor failed": "评论点赞失败",
8
-  "delete comment favor failed": "评论取消点赞失败",
9
-  "get comments failed": "获取评论列表失败",
10
-  "create reply failed": "创建回复失败",
11
-  "reply favor failed": "回复点赞失败",
12
-  "delete reply favor failed": "删除回复点赞失败",
13
-  "get replies failed": "获取回复列表失败"
14
-};
1
+/**
2
+ * 当前支持的语言
3
+ */
4
+export const SUPPORT_LOCALES = [
5
+  {
6
+    name: "English",
7
+    value: "en-US"
8
+  },
9
+  {
10
+    name: "简体中文",
11
+    value: "zh-CN"
12
+  }
13
+];
15 14
 
16
-export default data;
15
+// 服务端返回的英文短语和中文提示的对应
16
+export const LOCALES_RESPONSE = {
17
+  "zh-CN": {
18
+    "not found": "没有数据",
19
+    "auth failed": "请先登录",
20
+    "create comment failed": "评论未发送",
21
+    "comment favor failed": "点赞失败",
22
+    "delete comment favor failed": "取消点赞失败",
23
+    "get comments failed": "评论加载失败",
24
+    "create reply failed": "回复失败",
25
+    "reply favor failed": "点赞失败",
26
+    "delete reply favor failed": "取消点赞失败",
27
+    "get replies failed": "回复加载失败"
28
+  },
29
+  "en-US": {
30
+    "not found": "No data",
31
+    "auth failed": "Please Login",
32
+    "create comment failed": "Comments not sent",
33
+    "comment favor failed": "Liking failed",
34
+    "delete comment favor failed": "Unliking failed",
35
+    "get comments failed": "Comments loading failed",
36
+    "create reply failed": "Replying failed",
37
+    "reply favor failed": "Liking failed",
38
+    "delete reply favor failed": "Unliking failed",
39
+    "get replies failed": "Loading of replies failed"
40
+  }
41
+};

+ 37
- 0
src/lang/zh-CN.js View File

@@ -0,0 +1,37 @@
1
+const CNdata = {
2
+  "editor.alreadyEntered": "已输入{count}/{maxLength}字",
3
+  "editor.placeholder": "说点什么吧...",
4
+  "editor.maxLength": "字数上限{maxLength}",
5
+  "editor.SubmitBtn": "发送",
6
+  "editor.uploadTip": "上传图片",
7
+  "editor.uploadCount": "(您还能上传{count}张图片)",
8
+  "editor.uploadBtn": "上传",
9
+
10
+  "comment.tourist": "游客",
11
+  "comment.totalComment": "共{total}条评论",
12
+  "comment.reply": "回复",
13
+  "comment.moreComment": "更多评论",
14
+
15
+  "reply.totalReply": "共{total}条回复",
16
+  "reply.moreReply": "更多回复",
17
+  "reply.collapse": "收起回复",
18
+
19
+  "picture.collapse": "收起",
20
+  "picture.viewOriginal": "查看原图",
21
+
22
+  "popConfirm.title": "确定要删除吗",
23
+  "popConfirm.ok": "确定",
24
+  "popConfirm.cancel": "取消",
25
+  "popConfirm.delete": "删除",
26
+
27
+  "message.noMoreComment": "没有更多评论了",
28
+  "message.noMoreData": "没有更多数据了!",
29
+  "message.notNull": "没写内容呢",
30
+  "message.success": "评论已发送!",
31
+  "message.replyNoNull": "没写内容呢",
32
+  "message.replySuccess": "回复已发送!",
33
+  "message.cancelLickSuccess": "已取消点赞!",
34
+  "message.likeSuccess": "已赞!"
35
+};
36
+
37
+export default CNdata;