Browse Source

fix: 对评论的样式名称做了修改,改为了 `comment-image-preview-container`

node 5 years ago
parent
commit
db8d9e4a48
47 changed files with 370 additions and 308 deletions
  1. 10
    12
      assets/example.html
  2. 0
    0
      assets/example.js
  3. 0
    23
      assets/example/example_multiple.html
  4. 0
    58
      assets/example/example_multiple.js
  5. 0
    26
      assets/example/rerender.html
  6. 0
    2
      assets/static/css/comment.0.5.13.css
  7. 0
    1
      assets/static/css/comment.0.5.13.css.map
  8. 2
    0
      assets/static/css/main.81c08691.css
  9. 1
    0
      assets/static/css/main.81c08691.css.map
  10. 0
    2
      assets/static/js/comment.0.5.13.js
  11. 0
    1
      assets/static/js/comment.0.5.13.js.map
  12. 2
    0
      assets/static/js/main.9d10db91.js
  13. 1
    0
      assets/static/js/main.9d10db91.js.map
  14. 15
    2
      config-overrides.js
  15. 2
    0
      lib/App.js
  16. 1
    1
      lib/App.js.map
  17. 30
    0
      lib/App.module.css
  18. 1
    1
      lib/Comment.js.map
  19. 1
    1
      lib/avatar.js.map
  20. 1
    1
      lib/axios.js.map
  21. 1
    1
      lib/components/CommentBox/index.js.map
  22. 1
    1
      lib/components/CommentInput/index.js.map
  23. 1
    1
      lib/components/CommentList/index.js.map
  24. 1
    1
      lib/components/ContentItem/index.js.map
  25. 4
    2
      lib/components/Editor/Emoji.js
  26. 1
    1
      lib/components/Editor/Emoji.js.map
  27. 1
    1
      lib/components/Editor/Upload.js.map
  28. 9
    3
      lib/components/Editor/index.js
  29. 1
    1
      lib/components/Editor/index.js.map
  30. 7
    2
      lib/components/ImagePreviewer/ImagePreviewer.js
  31. 1
    1
      lib/components/ImagePreviewer/ImagePreviewer.js.map
  32. 1
    1
      lib/components/ImagePreviewer/ImagePreviewer.less
  33. 1
    1
      lib/components/RenderText/index.js.map
  34. 1
    1
      lib/constant.js.map
  35. 1
    1
      lib/helper.js.map
  36. 176
    0
      lib/index.example.js
  37. 1
    0
      lib/index.example.js.map
  38. 40
    150
      lib/index.js
  39. 1
    1
      lib/index.js.map
  40. 1
    1
      lib/lang/index.js.map
  41. 1
    1
      lib/registerServiceWorker.js.map
  42. 6
    1
      package.json
  43. 1
    0
      src/App.js
  44. 30
    0
      src/App.module.css
  45. 7
    3
      src/components/ImagePreviewer/ImagePreviewer.jsx
  46. 1
    1
      src/components/ImagePreviewer/ImagePreviewer.less
  47. 6
    0
      src/index.js

+ 10
- 12
assets/example.html View File

@@ -5,24 +5,22 @@
5 5
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
6 6
   <title>通用评论 demo</title>
7 7
   <meta name="viewport" content="width=device-width, initial-scale=1">
8
-  <link rel="stylesheet" type="text/css" media="screen" href="./static/css/comment.0.5.13.css" />
8
+  <link rel="stylesheet" type="text/css" media="screen" href="./static/css/main.81c08691.css" />
9 9
 </head>
10 10
 <body>
11 11
   <div>
12 12
     <h1>在非 React.js 项目中使用通用评论</h1>
13
-    <p>将其渲染到 id 为 `comment` 的节点上</p>
14
-    <div id="comment"></div>
13
+
14
+    <p>使用多个 businessId</p>
15
+
16
+    <button id="render">渲染评论 bid: test</button>
17
+    <button id="re-render">重新渲染 bid: test1</button>
18
+    <div id="RENDER_ELEMENT_WRAPPER"></div>
19
+
15 20
   </div>
16 21
   
17 22
   <script src="http://gosspublic.alicdn.com/aliyun-oss-sdk.min.js"></script>
18
-  <script type="text/javascript" src="./static/js/comment.0.5.13.js"></script>
19
-  <script type="text/javascript">
20
-    // 调用 renderComment 这个方法,渲染通用评论
21
-    window.renderComment({
22
-      id: 'comment', // 渲染通用评论到 comment 这个节点,id 名称可 自定义
23
-      type: 1, // 评论的 type
24
-      businessId: 'test1' // 评论的 businessId
25
-    })
26
-  </script>
23
+  <script type="text/javascript" src="./static/js/main.9d10db91.js"></script>
24
+  <script type="text/javascript" src="example.js"></script>
27 25
 </body>
28 26
 </html>

assets/example/rerender.js → assets/example.js View File


+ 0
- 23
assets/example/example_multiple.html View File

@@ -1,23 +0,0 @@
1
-<!DOCTYPE html>
2
-<html>
3
-<head>
4
-  <meta charset="utf-8" />
5
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
6
-  <title>通用评论 demo</title>
7
-  <meta name="viewport" content="width=device-width, initial-scale=1">
8
-  <link rel="stylesheet" type="text/css" media="screen" href="../static/css/comment.0.5.13.css" />
9
-</head>
10
-<body>
11
-  <div>
12
-    <h1>在非 React.js 项目中使用通用评论</h1>
13
-    <p>使用多个 bisunessId</p>
14
-
15
-    <button id="render">渲染评论 bid: test</button>
16
-    <button id="re-render">重新渲染 bid: test1</button>
17
-
18
-    <div id="comment"></div>
19
-  </div>
20
-
21
-  <script type="text/javascript" src="./example_multiple.js"></script>
22
-</body>
23
-</html>

+ 0
- 58
assets/example/example_multiple.js View File

@@ -1,58 +0,0 @@
1
-var COMMENT_URL = '../static/js/comment.0.5.13.js';
2
-var RENDER_ELEMENT_COMMENT = 'comment'; // 渲染评论的标签的 ID
3
-
4
-/**
5
- * 异步加载 js 文件
6
- * @param {string} url 需要加载的 js 文件地址
7
- * @param {function} callback js 文件加载后的回调
8
- */
9
-function loadScript(url, callback){
10
-  var script = document.createElement("script")
11
-  script.type = "text/javascript";
12
-
13
-  if (script.readyState){  //IE
14
-      script.onreadystatechange = function(){
15
-          if (script.readyState == "loaded" ||
16
-                  script.readyState == "complete"){
17
-              script.onreadystatechange = null;
18
-              callback();
19
-          }
20
-      };
21
-  } else {  //Others
22
-      script.onload = function(){
23
-          callback();
24
-      };
25
-  }
26
-
27
-  script.src = url;
28
-  document.getElementsByTagName("head")[0].appendChild(script);
29
-}
30
-
31
-
32
-/**
33
- * 渲染评论组件搭配指定的节点
34
- * @param {string} id element id
35
- * @param {string} type 评论的 type
36
- * @param {string} businessId 评论的 businessId
37
- */
38
-function render(id, type, businessId) {
39
-  loadScript(COMMENT_URL, function() {
40
-    window.renderComment({
41
-      id: id,
42
-      type: type,
43
-      businessId: businessId
44
-    })
45
-  })
46
-}
47
-
48
-
49
-document.getElementById('render').addEventListener('click', function() {
50
-  render(RENDER_ELEMENT_COMMENT, 1, 'test');
51
-})
52
-
53
-document.getElementById('re-render').addEventListener('click', function() {
54
-  render(RENDER_ELEMENT_COMMENT, 1, 'test1');
55
-})
56
-
57
-
58
-

+ 0
- 26
assets/example/rerender.html View File

@@ -1,26 +0,0 @@
1
-<!DOCTYPE html>
2
-<html>
3
-<head>
4
-  <meta charset="utf-8" />
5
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
6
-  <title>通用评论 demo</title>
7
-  <meta name="viewport" content="width=device-width, initial-scale=1">
8
-  <link rel="stylesheet" type="text/css" media="screen" href="../static/css/comment.0.5.13.css" />
9
-</head>
10
-<body>
11
-  <div>
12
-    <h1>在非 React.js 项目中使用通用评论</h1>
13
-
14
-    <p>使用多个 businessId</p>
15
-
16
-    <button id="render">渲染评论 bid: test</button>
17
-    <button id="re-render">重新渲染 bid: test1</button>
18
-    <div id="RENDER_ELEMENT_WRAPPER"></div>
19
-
20
-  </div>
21
-  
22
-  <script src="http://gosspublic.alicdn.com/aliyun-oss-sdk.min.js"></script>
23
-  <script type="text/javascript" src="../static/js/comment.0.5.13.js"></script>
24
-  <script type="text/javascript" src="rerender.js"></script>
25
-</body>
26
-</html>

+ 0
- 2
assets/static/css/comment.0.5.13.css
File diff suppressed because it is too large
View File


+ 0
- 1
assets/static/css/comment.0.5.13.css.map
File diff suppressed because it is too large
View File


+ 2
- 0
assets/static/css/main.81c08691.css
File diff suppressed because it is too large
View File


+ 1
- 0
assets/static/css/main.81c08691.css.map
File diff suppressed because it is too large
View File


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


+ 0
- 1
assets/static/js/comment.0.5.13.js.map
File diff suppressed because it is too large
View File


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


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


+ 15
- 2
config-overrides.js View File

@@ -1,6 +1,19 @@
1
-const { injectBabelPlugin } = require('react-app-rewired');
1
+const { injectBabelPlugin, compose } = require('react-app-rewired');
2
+const rewireCssModules = require('react-app-rewire-css-modules');
3
+const rewireLess = require('react-app-rewire-less');
4
+
5
+
6
+module.exports = compose(
7
+  rewireCssModules,
8
+)
2 9
 
3 10
 module.exports = function override(config, env) {
11
+
12
+  const rewires = compose(
13
+    // rewireCssModules,
14
+    rewireLess
15
+  );
16
+
4 17
   config = injectBabelPlugin(['import', { libraryName: 'antd', libraryDirectory: 'es', style: 'css' }], config);
5
-  return config;
18
+  return rewires(config, env);
6 19
 };

+ 2
- 0
lib/App.js View File

@@ -63,6 +63,8 @@ function _possibleConstructorReturn(self, call) { if (!self) { throw new Referen
63 63
 
64 64
 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 65
 
66
+// import styles from "./App.module.css";
67
+
66 68
 var App = function (_Component) {
67 69
   _inherits(App, _Component);
68 70
 

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


+ 30
- 0
lib/App.module.css View File

@@ -0,0 +1,30 @@
1
+.comment {
2
+  width: 100%;
3
+  padding: 10px;
4
+  margin-bottom: 100px;
5
+}
6
+
7
+.comment .ant-spin-nested-loading > div > .ant-spin .ant-spin-dot {
8
+  position: fixed;
9
+  top: 45%;
10
+}
11
+
12
+.comment-header-tag {
13
+  border: 1px solid #cecece;
14
+  border-radius: 0;
15
+  color: #666;
16
+}
17
+
18
+.comment-header-tip {
19
+  color: #5198eb;
20
+  margin-right: 15px;
21
+  margin-left: 5px;
22
+}
23
+
24
+.comment-header-text {
25
+  color: #666;
26
+}
27
+
28
+.comment-img {
29
+  max-width: 100%;
30
+}

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

@@ -1 +1 @@
1
-{"version":3,"sources":["../src/Comment.js"],"names":["Comment","CommentContext","React","createContext","Component","props","app"],"mappings":";;;;;;;;;QAKgBA,O,GAAAA,O;;AALhB;;;;;;AAEA,IAAMC,iBAAiBC,gBAAMC,aAAN,EAAvB;;AAEA;AACO,SAASH,OAAT,CAAiBI,SAAjB,EAA4B;AACjC;AACA,SAAO,UAASC,KAAT,EAAgB;AACrB;AACA;AACA,WACE;AAAC,oBAAD,CAAgB,QAAhB;AAAA;AACG;AAAA,eAAO,8BAAC,SAAD,eAAeA,KAAf,IAAsB,KAAKC,GAA3B,IAAP;AAAA;AADH,KADF;AAKD,GARD;AASD;;QAEQL,c,GAAAA,c;kBAEMD,O","file":"Comment.js","sourcesContent":["import React from \"react\";\r\n\r\nconst CommentContext = React.createContext();\r\n\r\n// This function takes a component...\r\nexport function Comment(Component) {\r\n  // ...and returns another component...\r\n  return function(props) {\r\n    // ... and renders the wrapped component with the context theme!\r\n    // Notice that we pass through any additional props as well\r\n    return (\r\n      <CommentContext.Consumer>\r\n        {app => <Component {...props} app={app} />}\r\n      </CommentContext.Consumer>\r\n    );\r\n  };\r\n}\r\n\r\nexport { CommentContext };\r\n\r\nexport default Comment;\r\n"]}
1
+{"version":3,"sources":["../src/Comment.js"],"names":["Comment","CommentContext","React","createContext","Component","props","app"],"mappings":";;;;;;;;;QAKgBA,O,GAAAA,O;;AALhB;;;;;;AAEA,IAAMC,iBAAiBC,gBAAMC,aAAN,EAAvB;;AAEA;AACO,SAASH,OAAT,CAAiBI,SAAjB,EAA4B;AACjC;AACA,SAAO,UAASC,KAAT,EAAgB;AACrB;AACA;AACA,WACE;AAAC,oBAAD,CAAgB,QAAhB;AAAA;AACG;AAAA,eAAO,8BAAC,SAAD,eAAeA,KAAf,IAAsB,KAAKC,GAA3B,IAAP;AAAA;AADH,KADF;AAKD,GARD;AASD;;QAEQL,c,GAAAA,c;kBAEMD,O","file":"Comment.js","sourcesContent":["import React from \"react\";\n\nconst CommentContext = React.createContext();\n\n// This function takes a component...\nexport function Comment(Component) {\n  // ...and returns another component...\n  return function(props) {\n    // ... and renders the wrapped component with the context theme!\n    // Notice that we pass through any additional props as well\n    return (\n      <CommentContext.Consumer>\n        {app => <Component {...props} app={app} />}\n      </CommentContext.Consumer>\n    );\n  };\n}\n\nexport { CommentContext };\n\nexport default Comment;\n"]}

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


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

@@ -1 +1 @@
1
-{"version":3,"sources":["../src/axios.js"],"names":["axios","defaults","withCredentials","headers","common"],"mappings":";;;;;;AAAA;;;;;;AAEAA,gBAAMC,QAAN,CAAeC,eAAf,GAAiC,IAAjC;AACAF,gBAAMC,QAAN,CAAeE,OAAf,CAAuBC,MAAvB,CAA8B,eAA9B,IAAiD,SAAjD;;kBAEeJ,e","file":"axios.js","sourcesContent":["import axios from \"axios\";\r\n\r\naxios.defaults.withCredentials = true;\r\naxios.defaults.headers.common[\"Authorization\"] = \"Bearer \";\r\n\r\nexport default axios;\r\n"]}
1
+{"version":3,"sources":["../src/axios.js"],"names":["axios","defaults","withCredentials","headers","common"],"mappings":";;;;;;AAAA;;;;;;AAEAA,gBAAMC,QAAN,CAAeC,eAAf,GAAiC,IAAjC;AACAF,gBAAMC,QAAN,CAAeE,OAAf,CAAuBC,MAAvB,CAA8B,eAA9B,IAAiD,SAAjD;;kBAEeJ,e","file":"axios.js","sourcesContent":["import axios from \"axios\";\n\naxios.defaults.withCredentials = true;\naxios.defaults.headers.common[\"Authorization\"] = \"Bearer \";\n\nexport default axios;\n"]}

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


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


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

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


+ 4
- 2
lib/components/Editor/Emoji.js View File

@@ -80,9 +80,11 @@ var Emoji = function (_React$Component) {
80 80
       }
81 81
       return _react2.default.createElement(
82 82
         _carousel2.default,
83
-        { ref: function ref(node) {
83
+        {
84
+          ref: function ref(node) {
84 85
             _this2.carousel = node;
85
-          } },
86
+          }
87
+        },
86 88
         content.map(function (page, index) {
87 89
           return _react2.default.createElement(
88 90
             "div",

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

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

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


+ 9
- 3
lib/components/Editor/index.js View File

@@ -328,10 +328,16 @@ var Editor = function (_React$Component) {
328 328
                   autoAdjustOverflow: false,
329 329
                   content: _react2.default.createElement(
330 330
                     "div",
331
-                    { style: { width: 240 }, onWheel: this.handleEmojiScroll },
332
-                    _react2.default.createElement(_Emoji2.default, { onClick: this.handleClickEmoji, ref: function ref(node) {
331
+                    {
332
+                      style: { width: 240 },
333
+                      onWheel: this.handleEmojiScroll
334
+                    },
335
+                    _react2.default.createElement(_Emoji2.default, {
336
+                      onClick: this.handleClickEmoji,
337
+                      ref: function ref(node) {
333 338
                         _this3.emoji = node;
334
-                      } })
339
+                      }
340
+                    })
335 341
                   ),
336 342
                   overlayClassName: "comment-emoji-popover"
337 343
                 },

+ 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,7 +26,7 @@ var _classnames = require("classnames");
26 26
 
27 27
 var _classnames2 = _interopRequireDefault(_classnames);
28 28
 
29
-require("./ImagePreviewer.css");
29
+require("./ImagePreviewer.less");
30 30
 
31 31
 var _helper = require("../../helper");
32 32
 
@@ -37,6 +37,11 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
37 37
 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; }
38 38
 
39 39
 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; }
40
+// import "./ImagePreviewer.css";
41
+// import styles from "./ImagePreviewer.module.css";
42
+
43
+
44
+// import styles from "./ImagePreviewer.module.less";
40 45
 
41 46
 var ImagePreviewer = function (_React$Component) {
42 47
   _inherits(ImagePreviewer, _React$Component);
@@ -148,7 +153,7 @@ var ImagePreviewer = function (_React$Component) {
148 153
 
149 154
       return _react2.default.createElement(
150 155
         "div",
151
-        { className: "container" },
156
+        { className: "comment-image-preview-container" },
152 157
         _react2.default.createElement(
153 158
           "div",
154 159
           { className: "toolbar" },

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


+ 1
- 1
lib/components/ImagePreviewer/ImagePreviewer.less View File

@@ -1,4 +1,4 @@
1
-.container {
1
+.comment-image-preview-container {
2 2
   .toolbar {
3 3
     border-bottom: 1px solid #f2f2f2;
4 4
     margin: 0 5px;

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

@@ -1 +1 @@
1
-{"version":3,"sources":["../../../src/components/RenderText/index.js"],"names":["App","__html","text"],"mappings":";;;;;;AAAA;;;;AACA;;;;AAEA,IAAMA,MAAM,SAANA,GAAM;AAAA,SACV;AACE,eAAU,sBADZ;AAEE,6BAAyB;AACvBC,cAAQ,2BAAcC,IAAd;AADe;AAF3B,IADU;AAAA,CAAZ;;kBASeF,G","file":"index.js","sourcesContent":["import React from \"react\";\r\nimport { renderContent } from \"../../helper\";\r\n\r\nconst App = text => (\r\n  <div\r\n    className=\"comment-item-content\"\r\n    dangerouslySetInnerHTML={{\r\n      __html: renderContent(text)\r\n    }}\r\n  />\r\n);\r\n\r\nexport default App;\r\n"]}
1
+{"version":3,"sources":["../../../src/components/RenderText/index.js"],"names":["App","__html","text"],"mappings":";;;;;;AAAA;;;;AACA;;;;AAEA,IAAMA,MAAM,SAANA,GAAM;AAAA,SACV;AACE,eAAU,sBADZ;AAEE,6BAAyB;AACvBC,cAAQ,2BAAcC,IAAd;AADe;AAF3B,IADU;AAAA,CAAZ;;kBASeF,G","file":"index.js","sourcesContent":["import React from \"react\";\nimport { renderContent } from \"../../helper\";\n\nconst App = text => (\n  <div\n    className=\"comment-item-content\"\n    dangerouslySetInnerHTML={{\n      __html: renderContent(text)\n    }}\n  />\n);\n\nexport default App;\n"]}

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

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

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


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

@@ -0,0 +1,176 @@
1
+"use strict";
2
+
3
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
4
+
5
+var _react = require("react");
6
+
7
+var _react2 = _interopRequireDefault(_react);
8
+
9
+var _reactDom = require("react-dom");
10
+
11
+var _reactDom2 = _interopRequireDefault(_reactDom);
12
+
13
+var _App = require("./App");
14
+
15
+var _App2 = _interopRequireDefault(_App);
16
+
17
+var _registerServiceWorker = require("./registerServiceWorker");
18
+
19
+var _registerServiceWorker2 = _interopRequireDefault(_registerServiceWorker);
20
+
21
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
22
+
23
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
24
+
25
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
26
+
27
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
28
+// e.g.
29
+// import { Button, Icon } from "antd";
30
+// import App, { Editor, RenderText } from "./App";
31
+
32
+
33
+var Index = function (_Component) {
34
+  _inherits(Index, _Component);
35
+
36
+  function Index(props) {
37
+    _classCallCheck(this, Index);
38
+
39
+    var _this = _possibleConstructorReturn(this, (Index.__proto__ || Object.getPrototypeOf(Index)).call(this, props));
40
+
41
+    _this.state = {
42
+      page: 1,
43
+      value: ""
44
+    };
45
+    _this.onPageChange = _this.onPageChange.bind(_this);
46
+    _this.handleChangeValue = _this.handleChangeValue.bind(_this);
47
+    _this.handleChangeSubmit = _this.handleChangeSubmit.bind(_this);
48
+    return _this;
49
+  }
50
+
51
+  _createClass(Index, [{
52
+    key: "onPageChange",
53
+    value: function onPageChange(page) {
54
+      this.setState({
55
+        page: page
56
+      });
57
+    }
58
+  }, {
59
+    key: "handleChangeValue",
60
+    value: function handleChangeValue(value) {
61
+      this.setState({ value: value });
62
+      console.log("handleChangeValue value: ", value);
63
+    }
64
+  }, {
65
+    key: "handleChangeSubmit",
66
+    value: function handleChangeSubmit(_ref) {
67
+      var _this2 = this;
68
+
69
+      var text = _ref.text,
70
+          files = _ref.files;
71
+
72
+      this.setState({ loading: true }, function () {
73
+        setTimeout(function () {
74
+          _this2.setState({ loading: false });
75
+        }, 2000);
76
+      });
77
+      console.log("submit text: ", text);
78
+      console.log("submit files: ", files);
79
+    }
80
+  }, {
81
+    key: "render",
82
+    value: function render() {
83
+      // 最简单的用法
84
+      return _react2.default.createElement(
85
+        _App2.default,
86
+        {
87
+          type: 1,
88
+          businessId: "test",
89
+          showAlertComment: true,
90
+          showAlertReply: true,
91
+          showAlertFavor: true,
92
+          showError: false,
93
+          userId: 71299,
94
+          page: this.state.page,
95
+          onPageChange: this.onPageChange,
96
+          pageType: "more",
97
+          onError: function onError(msg, _ref2) {
98
+            var response = _ref2.response;
99
+
100
+            if (response.status === 401) {
101
+              console.log("unlogined");
102
+            }
103
+            console.log("-----------" + msg);
104
+          }
105
+        },
106
+        _react2.default.createElement(_App.Editor, {
107
+          maxUpload: 9,
108
+          autoFocus: true,
109
+          beforeSubmit: function beforeSubmit() {
110
+            return new Promise(function (resolve) {
111
+              resolve(true);
112
+            });
113
+          },
114
+          onCommentSuccess: function onCommentSuccess() {
115
+            console.log("succ");
116
+          },
117
+          showError: false,
118
+          onError: function onError(msg, _ref3) {
119
+            var response = _ref3.response;
120
+
121
+            if (response.status === 401) {
122
+              console.log("unlogined");
123
+            }
124
+            console.log("-----------" + msg);
125
+          }
126
+        })
127
+      );
128
+
129
+      // e.g.
130
+      // 复杂的用户法
131
+      // const props = {
132
+      //   type: 1,
133
+      //   businessId: "1",
134
+      //   API: "http://api.links123.net/comment/v1",
135
+      //   showList: true
136
+      // };
137
+
138
+      // const editorProps = {
139
+      //   showEmoji: true,
140
+      //   placeholder: "说点什么吧",
141
+      //   rows: 5,
142
+      //   btnLoading: this.state.loading,
143
+      //   btnDisable: this.state.loading,
144
+      //   btnSubmitText: "提交",
145
+      //   value: this.state.value,
146
+      //   onChange: v => this.handleChangeValue(v),
147
+      //   onSubmit: v => this.handleChangeSubmit(v),
148
+      //   button: (
149
+      //     <Button
150
+      //       type="primary"
151
+      //       ghost
152
+      //       // onClick={() => console.log('click btn: ', this.state.value)}
153
+      //     >
154
+      //       自定义按钮
155
+      //     </Button>
156
+      //   ),
157
+      //   emojiToolIcon: <Icon type="smile" style={{ fontSize: 23 }} />,
158
+      //   imageToolIcon: (
159
+      //     <Icon type="cloud-upload-o" style={{ fontSize: 25, marginLeft: 10 }} />
160
+      //   )
161
+      // };
162
+
163
+      // return (
164
+      //   <App {...props}>
165
+      //     <Editor {...editorProps} />
166
+      //   </App>
167
+      // );
168
+    }
169
+  }]);
170
+
171
+  return Index;
172
+}(_react.Component);
173
+
174
+_reactDom2.default.render(_react2.default.createElement(Index, null), document.getElementById("root-comment"));
175
+(0, _registerServiceWorker2.default)();
176
+//# sourceMappingURL=index.example.js.map

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


+ 40
- 150
lib/index.js View File

@@ -1,6 +1,6 @@
1 1
 "use strict";
2 2
 
3
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
3
+var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
4 4
 
5 5
 var _react = require("react");
6 6
 
@@ -20,157 +20,47 @@ var _registerServiceWorker2 = _interopRequireDefault(_registerServiceWorker);
20 20
 
21 21
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
22 22
 
23
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
24
-
25
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
26
-
27
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
28
-// e.g.
29
-// import { Button, Icon } from "antd";
30
-// import App, { Editor, RenderText } from "./App";
31
-
32
-
33
-var Index = function (_Component) {
34
-  _inherits(Index, _Component);
23
+var Index = function Index(props) {
24
+  return _react2.default.createElement(
25
+    _App2.default,
26
+    _extends({ showAlertComment: true, showAlertReply: true, showAlertFavor: true, showError: true }, props),
27
+    _react2.default.createElement(_App.Editor, { maxUpload: 9, autoFocus: true })
28
+  );
29
+};
30
+
31
+/**
32
+ * 渲染评论组件
33
+ * @param {object} config 编辑器配置
34
+ *  - {string} id 渲染评论的DOM的 ID
35
+ *  - {number} type 评论的 type
36
+ *  - {string} businessId 评论的 businessId
37
+ */
38
+function renderComment(config) {
39
+  if (!config.id) {
40
+    throw new Error("id is required");
41
+  }
42
+  if (!config.id) {
43
+    throw new Error("type is required");
44
+  }
45
+  if (!config.id) {
46
+    throw new Error("businessId is required");
47
+  }
48
+  var id = config.id,
49
+      _config$type = config.type,
50
+      type = _config$type === undefined ? 1 : _config$type,
51
+      _config$businessId = config.businessId,
52
+      businessId = _config$businessId === undefined ? "test" : _config$businessId;
35 53
 
36
-  function Index(props) {
37
-    _classCallCheck(this, Index);
38 54
 
39
-    var _this = _possibleConstructorReturn(this, (Index.__proto__ || Object.getPrototypeOf(Index)).call(this, props));
55
+  _reactDom2.default.render(_react2.default.createElement(Index, { type: type, businessId: businessId }), document.getElementById(id));
56
+  // registerServiceWorker();
57
+}
40 58
 
41
-    _this.state = {
42
-      page: 1,
43
-      value: ""
44
-    };
45
-    _this.onPageChange = _this.onPageChange.bind(_this);
46
-    _this.handleChangeValue = _this.handleChangeValue.bind(_this);
47
-    _this.handleChangeSubmit = _this.handleChangeSubmit.bind(_this);
48
-    return _this;
49
-  }
59
+window.renderComment = renderComment;
50 60
 
51
-  _createClass(Index, [{
52
-    key: "onPageChange",
53
-    value: function onPageChange(page) {
54
-      this.setState({
55
-        page: page
56
-      });
57
-    }
58
-  }, {
59
-    key: "handleChangeValue",
60
-    value: function handleChangeValue(value) {
61
-      this.setState({ value: value });
62
-      console.log("handleChangeValue value: ", value);
63
-    }
64
-  }, {
65
-    key: "handleChangeSubmit",
66
-    value: function handleChangeSubmit(_ref) {
67
-      var _this2 = this;
68
-
69
-      var text = _ref.text,
70
-          files = _ref.files;
71
-
72
-      this.setState({ loading: true }, function () {
73
-        setTimeout(function () {
74
-          _this2.setState({ loading: false });
75
-        }, 2000);
76
-      });
77
-      console.log("submit text: ", text);
78
-      console.log("submit files: ", files);
79
-    }
80
-  }, {
81
-    key: "render",
82
-    value: function render() {
83
-      // 最简单的用法
84
-      return _react2.default.createElement(
85
-        _App2.default,
86
-        {
87
-          type: 1,
88
-          businessId: "test",
89
-          showAlertComment: true,
90
-          showAlertReply: true,
91
-          showAlertFavor: true,
92
-          showError: false,
93
-          userId: 71299,
94
-          page: this.state.page,
95
-          onPageChange: this.onPageChange,
96
-          pageType: "more",
97
-          onError: function onError(msg, _ref2) {
98
-            var response = _ref2.response;
99
-
100
-            if (response.status === 401) {
101
-              console.log("unlogined");
102
-            }
103
-            console.log("-----------" + msg);
104
-          }
105
-        },
106
-        _react2.default.createElement(_App.Editor, {
107
-          maxUpload: 9,
108
-          autoFocus: true,
109
-          beforeSubmit: function beforeSubmit() {
110
-            return new Promise(function (resolve) {
111
-              resolve(true);
112
-            });
113
-          },
114
-          onCommentSuccess: function onCommentSuccess() {
115
-            console.log("succ");
116
-          },
117
-          showError: false,
118
-          onError: function onError(msg, _ref3) {
119
-            var response = _ref3.response;
120
-
121
-            if (response.status === 401) {
122
-              console.log("unlogined");
123
-            }
124
-            console.log("-----------" + msg);
125
-          }
126
-        })
127
-      );
128
-
129
-      // e.g.
130
-      // 复杂的用户法
131
-      // const props = {
132
-      //   type: 1,
133
-      //   businessId: "1",
134
-      //   API: "http://api.links123.net/comment/v1",
135
-      //   showList: true
136
-      // };
137
-
138
-      // const editorProps = {
139
-      //   showEmoji: true,
140
-      //   placeholder: "说点什么吧",
141
-      //   rows: 5,
142
-      //   btnLoading: this.state.loading,
143
-      //   btnDisable: this.state.loading,
144
-      //   btnSubmitText: "提交",
145
-      //   value: this.state.value,
146
-      //   onChange: v => this.handleChangeValue(v),
147
-      //   onSubmit: v => this.handleChangeSubmit(v),
148
-      //   button: (
149
-      //     <Button
150
-      //       type="primary"
151
-      //       ghost
152
-      //       // onClick={() => console.log('click btn: ', this.state.value)}
153
-      //     >
154
-      //       自定义按钮
155
-      //     </Button>
156
-      //   ),
157
-      //   emojiToolIcon: <Icon type="smile" style={{ fontSize: 23 }} />,
158
-      //   imageToolIcon: (
159
-      //     <Icon type="cloud-upload-o" style={{ fontSize: 25, marginLeft: 10 }} />
160
-      //   )
161
-      // };
162
-
163
-      // return (
164
-      //   <App {...props}>
165
-      //     <Editor {...editorProps} />
166
-      //   </App>
167
-      // );
168
-    }
169
-  }]);
170
-
171
-  return Index;
172
-}(_react.Component);
173
-
174
-_reactDom2.default.render(_react2.default.createElement(Index, null), document.getElementById("root-comment"));
175
-(0, _registerServiceWorker2.default)();
61
+// renderComment({
62
+//   id: "root-comment",
63
+//   type: 1,
64
+//   businessId: "test"
65
+// });
176 66
 //# sourceMappingURL=index.js.map

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


+ 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":["data"],"mappings":";;;;;AAAA;AACA;AACA,IAAMA,OAAO;AACX,eAAa,MADF;AAEX,iBAAe,MAFJ;AAGX,2BAAyB,QAHd;AAIX,0BAAwB,QAJb;AAKX,iCAA+B,UALpB;AAMX,yBAAuB,UANZ;AAOX,yBAAuB,QAPZ;AAQX,wBAAsB,QARX;AASX,+BAA6B,UATlB;AAUX,wBAAsB;AAVX,CAAb;;kBAaeA,I","file":"index.js","sourcesContent":["// 语言包\n// 英文短语和中文提示的对应\nconst data = {\n  \"not found\": \"没有数据\",\n  \"auth failed\": \"请先登录\",\n  \"create comment failed\": \"创建评论失败\",\n  \"comment favor failed\": \"评论点赞失败\",\n  \"delete comment favor failed\": \"评论取消点赞失败\",\n  \"get comments failed\": \"获取评论列表失败\",\n  \"create reply failed\": \"创建回复失败\",\n  \"reply favor failed\": \"回复点赞失败\",\n  \"delete reply favor failed\": \"删除回复点赞失败\",\n  \"get replies failed\": \"获取回复列表失败\"\n};\n\nexport default data;\n"]}

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


+ 6
- 1
package.json View File

@@ -46,8 +46,13 @@
46 46
     "babel-preset-react": "^6.24.1",
47 47
     "husky": "^0.14.3",
48 48
     "lint-staged": "^7.2.0",
49
+    "node-sass": "^4.9.4",
49 50
     "prettier": "^1.13.7",
50
-    "react-app-rewired": "^1.5.2"
51
+    "react-app-rewire-css-modules": "codebandits/react-app-rewire-css-modules",
52
+    "react-app-rewire-less": "^2.1.3",
53
+    "react-app-rewire-less-modules": "^1.3.0",
54
+    "react-app-rewired": "^1.5.2",
55
+    "sass-loader": "^7.1.0"
51 56
   },
52 57
   "license": "MIT"
53 58
 }

+ 1
- 0
src/App.js View File

@@ -11,6 +11,7 @@ import Editor from "./components/Editor";
11 11
 import RenderText from "./components/RenderText";
12 12
 import lang from "./lang";
13 13
 import "./App.css";
14
+// import styles from "./App.module.css";
14 15
 
15 16
 class App extends Component {
16 17
   constructor(props) {

+ 30
- 0
src/App.module.css View File

@@ -0,0 +1,30 @@
1
+.comment {
2
+  width: 100%;
3
+  padding: 10px;
4
+  margin-bottom: 100px;
5
+}
6
+
7
+.comment .ant-spin-nested-loading > div > .ant-spin .ant-spin-dot {
8
+  position: fixed;
9
+  top: 45%;
10
+}
11
+
12
+.comment-header-tag {
13
+  border: 1px solid #cecece;
14
+  border-radius: 0;
15
+  color: #666;
16
+}
17
+
18
+.comment-header-tip {
19
+  color: #5198eb;
20
+  margin-right: 15px;
21
+  margin-left: 5px;
22
+}
23
+
24
+.comment-header-text {
25
+  color: #666;
26
+}
27
+
28
+.comment-img {
29
+  max-width: 100%;
30
+}

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

@@ -2,8 +2,11 @@ import React from "react";
2 2
 import classnames from "classnames";
3 3
 import { Icon, Spin } from "antd";
4 4
 
5
-import "./ImagePreviewer.css";
5
+import "./ImagePreviewer.less";
6
+// import "./ImagePreviewer.css";
7
+// import styles from "./ImagePreviewer.module.css";
6 8
 import { addImageProcess } from "../../helper";
9
+// import styles from "./ImagePreviewer.module.less";
7 10
 
8 11
 export default class ImagePreviewer extends React.Component {
9 12
   constructor(props) {
@@ -97,10 +100,11 @@ export default class ImagePreviewer extends React.Component {
97 100
     const { list, onFold } = this.props;
98 101
     const { cIndex } = this.state;
99 102
     return (
100
-      <div className="container">
103
+      <div className="comment-image-preview-container">
101 104
         <div className="toolbar">
102 105
           <span className="button" onClick={onFold}>
103
-            <Icon type="to-top" />收起
106
+            <Icon type="to-top" />
107
+            收起
104 108
           </span>
105 109
           <span className="button" onClick={this.onOrigin}>
106 110
             <Icon type="search" /> 查看原图

+ 1
- 1
src/components/ImagePreviewer/ImagePreviewer.less View File

@@ -1,4 +1,4 @@
1
-.container {
1
+.comment-image-preview-container {
2 2
   .toolbar {
3 3
     border-bottom: 1px solid #f2f2f2;
4 4
     margin: 0 5px;

+ 6
- 0
src/index.js View File

@@ -36,3 +36,9 @@ function renderComment(config) {
36 36
 }
37 37
 
38 38
 window.renderComment = renderComment;
39
+
40
+// renderComment({
41
+//   id: "root-comment",
42
+//   type: 1,
43
+//   businessId: "test"
44
+// });