feat(client): add recent comment widget

walinejs · Dec 6, 2020 · 1f43c13 · 1f43c13
1 parent c2ca659
commit 1f43c13
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 2 deletions.
diff --git a/packages/client/src/index.js b/packages/client/src/index.js
@@ -3,9 +3,10 @@ import ReactDOM from 'react-dom';
 import App from './App';
 import Context from './context';
 import Visitor from './utils/visitor';
-import { fetchCount } from './utils/fetch';
+import { fetchCount, fetchRecent } from './utils/fetch';
 import mathML from './utils/mathml';
 import './index.css';
+import './recent.css';
 import './math.css';
 
 export default function Waline({
@@ -82,3 +83,26 @@ export default function Waline({
 };
 
 Waline.version = VERSION;
+Waline.Widget = {
+  RecentComments({el, serverURL, count}) {
+    //评论列表展示
+    const root = document.querySelector(el);
+    if(!root) {
+      return Promise.resolve();
+    }
+
+    return fetchRecent({serverURL, count}).then(comments => {
+      if(!comments.length) {
+        return comments;
+      }
+      root.innerHTML = `
+      <ul class="waline-widget-list">
+      ${comments.map(cmt => 
+        `<li class="waline-widget-item"><a href="${cmt.url}">${cmt.nick}</a>：${cmt.comment}</li>`
+      ).join('')}
+      </ul>`;
+
+      return comments;
+    });
+  }
+};
diff --git a/packages/client/src/recent.css b/packages/client/src/recent.css
@@ -0,0 +1,3 @@
+.waline-widget-item p {
+  display: inline;
+}
diff --git a/packages/client/src/utils/fetch.js b/packages/client/src/utils/fetch.js
@@ -3,6 +3,11 @@ export function fetchCount({serverURL, path}) {
   return fetch(url).then(resp => resp.text());
 }
 
+export function fetchRecent({serverURL, count}) {
+  const url = `${serverURL}/comment?type=recent&count=${count}`;
+  return fetch(url).then(resp => resp.json());
+}
+
 export function fetchList({serverURL, path, page, pageSize}) {
   const url = `${serverURL}/comment?path=${encodeURIComponent(path)}&pageSize=${pageSize}&page=${page}`;
   return fetch(url).then(resp => resp.json());

diff --git a/packages/server/src/controller/comment.js b/packages/server/src/controller/comment.js
@@ -62,7 +62,7 @@ module.exports = class extends BaseRest {
           limit: count
         });
 
-        return this.json(comments.map(({ip, ...cmt}) => cmt));
+        return this.json(await Promise.all(comments.map(formatCmt)));
       }
 
       case 'count': {