Refactor paging latest comments

src/api/comment.js

@@ -4,18 +4,12 @@ const baseUrl = '/api/admin/posts/comments'
 
 const commentApi = {}
 
-commentApi.listLatest = () => {
+commentApi.listLatest = (top, status) => {
   return service({
     url: `${baseUrl}/latest`,
-    method: 'get'
-  })
-}
-
-commentApi.listLatestByStatus = (top) => {
-  return service({
-    url: `${baseUrl}/latest/AUDITING`,
     params: {
-      top: top
+      top: top,
+      status: status
     },
     method: 'get'
   })

src/components/Tools/HeaderComment.vue

@@ -12,7 +12,10 @@
     <template slot="content">
       <a-spin :spinning="loadding">
         <a-list :dataSource="comments">
-          <a-list-item slot="renderItem" slot-scope="item">
+          <a-list-item
+            slot="renderItem"
+            slot-scope="item"
+          >
             <a-list-item-meta>
               <a-avatar
                 style="background-color: white"
@@ -21,7 +24,10 @@
                 size="large"
               />
               <template slot="title">
-                <a :href="item.authorUrl" target="_blank">{{ item.author }}</a>：<span v-html="item.content"></span>
+                <a
+                  :href="item.authorUrl"
+                  target="_blank"
+                >{{ item.author }}</a>：<span v-html="item.content"></span>
               </template>
               <template slot="description">
                 {{ item.createTime | timeAgo }}
@@ -31,8 +37,14 @@
         </a-list>
       </a-spin>
     </template>
-    <span @click="fetchComment" class="header-comment">
+    <span
-      <a-badge dot v-if="comments.length>0">
+      @click="fetchComment"
+      class="header-comment"
+    >
+      <a-badge
+        dot
+        v-if="comments.length > 0"
+      >
         <a-icon type="bell" />
       </a-badge>
       <a-badge v-else>
@@ -67,7 +79,7 @@ export default {
       this.visible = !this.visible
     },
     getComment() {
-      commentApi.listLatestByStatus(5).then(response => {
+      commentApi.listLatest(5, 'AUDITING').then(response => {
         this.comments = response.data.data
         this.loadding = false
       })

src/views/dashboard/Dashboard.vue

@@ -14,7 +14,10 @@
           title="文章"
           :number="countsData.postCount"
         >
-          <router-link :to="{ name:'PostList' }" slot="action">
+          <router-link
+            :to="{ name:'PostList' }"
+            slot="action"
+          >
             <a-icon type="link" />
           </router-link>
         </analysis-card>
@@ -32,7 +35,10 @@
           title="评论"
           :number="countsData.commentCount"
         >
-          <router-link :to="{ name:'Comments' }" slot="action">
+          <router-link
+            :to="{ name:'Comments' }"
+            slot="action"
+          >
             <a-icon type="link" />
           </router-link>
         </analysis-card>
@@ -50,7 +56,10 @@
           title="附件"
           :number="countsData.attachmentCount"
         >
-          <router-link :to="{ name:'Attachments' }" slot="action">
+          <router-link
+            :to="{ name:'Attachments' }"
+            slot="action"
+          >
             <a-icon type="link" />
           </router-link>
         </analysis-card>
@@ -68,8 +77,12 @@
           title="成立天数"
           :number="countsData.establishDays"
         >
-          <a-tooltip :title="'已成立'+countsData.establishDays+'天了'" slot="action">
+          <a-tooltip
-            <a href="javascript:void(0);"><a-icon type="info-circle-o" /></a>
+            :title="'已成立'+countsData.establishDays+'天了'"
+            slot="action"
+          >
+            <a href="javascript:void(0);">
+              <a-icon type="info-circle-o" /></a>
           </a-tooltip>
         </analysis-card>
       </a-col>
@@ -194,7 +207,7 @@ export default {
       commentColumns,
       commentData: [],
       logData: [],
-      countsData: null
+      countsData: {}
     }
   },
   created() {