Complate post and sheet control.

src/api/post.js

@@ -42,6 +42,20 @@ postApi.update = (postId, postToUpdate) => {
   })
 }
 
+postApi.updateStatus = (postId, status) => {
+  return service({
+    url: `${baseUrl}/${postId}/${status}`,
+    method: 'put'
+  })
+}
+
+postApi.delete = postId => {
+  return service({
+    url: `${baseUrl}/${postId}`,
+    method: 'delete'
+  })
+}
+
 postApi.postStatus = {
   PUBLISHED: {
     color: 'green',

src/api/sheet.js

@@ -34,6 +34,20 @@ sheetApi.update = (sheetId, sheetToUpdate) => {
   })
 }
 
+sheetApi.updateStatus = (sheetId, status) => {
+  return service({
+    url: `${baseUrl}/${sheetId}/${status}`,
+    method: 'put'
+  })
+}
+
+sheetApi.delete = sheetId => {
+  return service({
+    url: `${baseUrl}/${sheetId}`,
+    method: 'delete'
+  })
+}
+
 sheetApi.sheetStatus = {
   PUBLISHED: {
     color: 'green',

src/views/post/PostList.vue

@@ -143,22 +143,37 @@
               @click="onEditClick(post)"
               v-if="post.status === 'PUBLISHED' || post.status === 'DRAFT'"
             >编辑</a>
-            <a
+            <a-popconfirm
-              href="javascript:;"
+              :title="'你确定要发布【' + post.title + '】文章？'"
-              @click="onEditClick(post)"
+              @confirm="onEditStatusClick(post.id,'PUBLISHED')"
-              v-if="post.status === 'RECYCLE'"
+              okText="确定"
-            >还原</a>
+              cancelText="取消"
-            <a-divider type="vertical" />
-            <a
-              href="javascript:;"
-              @click="deletePost(post.id)"
-              v-if="post.status === 'PUBLISHED' || post.status === 'DRAFT'"
-            >回收站</a>
-            <a
-              href="javascript:;"
-              @click="deletePost(post.id)"
               v-else-if="post.status === 'RECYCLE'"
-            >删除</a>
+            >
+              <a href="javascript:;">还原</a>
+            </a-popconfirm>
+
+            <a-divider type="vertical" />
+
+            <a-popconfirm
+              :title="'你确定要将【' + post.title + '】文章移到回收站？'"
+              @confirm="onEditStatusClick(post.id,'RECYCLE')"
+              okText="确定"
+              cancelText="取消"
+              v-if="post.status === 'PUBLISHED' || post.status === 'DRAFT'"
+            >
+              <a href="javascript:;">回收站</a>
+            </a-popconfirm>
+
+            <a-popconfirm
+              :title="'你确定要永久删除【' + post.title + '】文章？'"
+              @confirm="onDeleteClick(post.id)"
+              okText="确定"
+              cancelText="取消"
+              v-else-if="post.status === 'RECYCLE'"
+            >
+              <a href="javascript:;">删除</a>
+            </a-popconfirm>
           </span>
         </a-table>
         <a-row
@@ -309,6 +324,18 @@ export default {
       this.queryParam.categoryId = null
       this.queryParam.status = null
       this.loadPosts()
+    },
+    onEditStatusClick(postId, status) {
+      postApi.updateStatus(postId, status).then(response => {
+        this.$message.success('操作成功！')
+        this.loadPosts()
+      })
+    },
+    onDeleteClick(postId) {
+      postApi.delete(postId).then(response => {
+        this.$message.success('删除成功！')
+        this.loadPosts()
+      })
     }
   }
 }

src/views/sheet/SheetList.vue

@@ -104,20 +104,45 @@
                     @click="onEditClick(sheet)"
                     v-if="sheet.status === 'PUBLISHED' || sheet.status === 'DRAFT'"
                   >编辑</a>
-                  <a
+
-                    href="javascript:;"
+                  <a-popconfirm
-                    @click="onEditClick(sheet)"
+                    :title="'你确定要发布【' + sheet.title + '】？'"
-                    v-if="sheet.status === 'RECYCLE'"
+                    @confirm="onEditStatusClick(sheet.id,'PUBLISHED')"
-                  >还原</a>
+                    okText="确定"
-                  <a-divider type="vertical" />
+                    cancelText="取消"
-                  <a
-                    href="javascript:;"
-                    v-if="sheet.status === 'PUBLISHED' || sheet.status === 'DRAFT'"
-                  >回收站</a>
-                  <a
-                    href="javascript:;"
                     v-else-if="sheet.status === 'RECYCLE'"
+                  >
+                    <a
+                      href="javascript:;"
+                    >还原</a>
+                  </a-popconfirm>
+
+                  <a-divider type="vertical" />
+
+                  <a-popconfirm
+                    :title="'你确定要将【' + sheet.title + '】页面移到回收站？'"
+                    @confirm="onEditStatusClick(sheet.id,'RECYCLE')"
+                    okText="确定"
+                    cancelText="取消"
+                    v-if="sheet.status === 'PUBLISHED' || sheet.status === 'DRAFT'"
+                  >
+                    <a
+                      href="javascript:;"
+                    >回收站</a>
+                  </a-popconfirm>
+
+                  <a-popconfirm
+                    :title="'你确定要永久删除【' + sheet.title + '】页面？'"
+                    @confirm="onDeleteClick(sheet.id)"
+                    okText="确定"
+                    cancelText="取消"
+                    v-else-if="sheet.status === 'RECYCLE'"
+                  >
+                    <a
+                      href="javascript:;"
                     >删除</a>
+                  </a-popconfirm>
+
                 </span>
               </a-table>
             </a-tab-pane>
@@ -225,6 +250,18 @@ export default {
     onEditClick(sheet) {
       this.$router.push({ name: 'SheetEdit', query: { sheetId: sheet.id } })
     },
+    onEditStatusClick(sheetId, status) {
+      sheetApi.updateStatus(sheetId, status).then(response => {
+        this.$message.success('操作成功！')
+        this.loadSheets()
+      })
+    },
+    onDeleteClick(sheetId) {
+      sheetApi.delete(sheetId).then(response => {
+        this.$message.success('删除成功！')
+        this.loadSheets()
+      })
+    },
     viewPage(id) {
       this.$message.success('查看' + id)
     }