作品集管理页面增加删除功能

pages/portfolio/manager/_portfolio_id.vue

@@ -26,12 +26,17 @@
       <el-col>
         <el-col style="text-align: right;">
           <el-col>
-            <el-link rel="nofollow" @click="onRouter('post-portfolio',portfolio.idPortfolio)" :underline="false" class="text-default"
+            <el-link rel="nofollow" @click="onRouter('post-portfolio',portfolio.idPortfolio)" :underline="false"
+                     class="text-default"
                      style="margin-right: 1rem;">编辑
             </el-link>
-            <el-link rel="nofollow" @click="showBindArticleDialog(portfolio.idPortfolio)" :underline="false" class="text-default"
+            <el-link rel="nofollow" @click="showBindArticleDialog(portfolio.idPortfolio)" :underline="false"
+                     class="text-default"
                      style="margin-right: 1rem;">添加文章
             </el-link>
+            <el-link rel="nofollow" @click="handleDel" :underline="false"
+                     type="danger" style="margin-right: 1rem;">删除作品集
+            </el-link>
           </el-col>
         </el-col>
         <el-col>
@@ -55,66 +60,104 @@
 </template>
 
 <script>
-  import {mapState} from 'vuex';
+import {mapState} from 'vuex';
-  import PortfolioManagerList from "~/components/common/portfolio/manager/list";
+import PortfolioManagerList from "~/components/common/portfolio/manager/list";
 
-  export default {
+export default {
-    name: "PortfolioManager",
+  name: "PortfolioManager",
-    components: {
+  components: {
-      PortfolioManagerList
+    PortfolioManagerList
-    },
+  },
-    validate({params, store}) {
+  validate({params, store}) {
-      return params.portfolio_id && !isNaN(Number(params.portfolio_id))
+    return params.portfolio_id && !isNaN(Number(params.portfolio_id))
-    },
+  },
-    fetch() {
+  fetch() {
-      let {store, params, error} = this.$nuxt.context
+    let {store, params, error} = this.$nuxt.context
-      return Promise.all([
+    return Promise.all([
-        store
+      store
-          .dispatch('portfolio/fetchDetail', params)
+        .dispatch('portfolio/fetchDetail', params)
-          .catch(err => error({statusCode: 404}))
+        .catch(err => error({statusCode: 404}))
-      ])
+    ])
-    },
+  },
-    computed: {
+  computed: {
-      ...mapState({
+    ...mapState({
-        portfolio: state => state.portfolio.detail.data
+      portfolio: state => state.portfolio.detail.data
-      }),
+    }),
-      isAuthor() {
+    isAuthor() {
-        let account = this.$store.state.auth.user?.nickname;
+      let account = this.$store.state.auth.user?.nickname;
-        if (account) {
+      if (account) {
-          if (account === this.portfolio.portfolioAuthorName) {
+        if (account === this.portfolio.portfolioAuthorName) {
-            return true;
+          return true;
-          }
         }
-        return false;
       }
+      return false;
     },
-    methods: {
+    idPortfolio() {
-      onRouter(name, data) {
+      return this.$route.params.portfolio_id ? this.$route.params.portfolio_id : 0
-        if (name === 'article') {
+    }
-          this.$router.push({
+  },
-            path: data
+  methods: {
-          })
+    onRouter(name, data) {
-        } else if (name === 'user') {
+      if (name === 'article') {
-          this.$router.push(
-            {
-              path: '/user/' + data
-            }
-          )
-        } else {
-          this.$router.push(
-            {
-              path: '/portfolio/post/' + data
-            }
-          )
-        }
-      },
-      showBindArticleDialog(idPortfolio) {
         this.$router.push({
-          path: `/portfolio/manager/bind/${idPortfolio}`
+          path: data
-        });
+        })
+      } else if (name === 'user') {
+        this.$router.push(
+          {
+            path: '/user/' + data
+          }
+        )
+      } else {
+        this.$router.push(
+          {
+            path: '/portfolio/post/' + data
+          }
+        )
       }
+    },
+    showBindArticleDialog(idPortfolio) {
+      this.$router.push({
+        path: `/portfolio/manager/bind/${idPortfolio}`
+      });
+    },
+    handleDel() {
+      let _ts = this;
+      _ts.$confirm(`确定删除【${_ts.portfolio.portfolioTitle}】该作品集合集吗?`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        console.log(_ts.portfolio.articleNumber)
+        if (Number(_ts.portfolio.articleNumber) === 0) {
+          _ts.$axios.$delete('/api/portfolio/delete', {
+            params: {
+              idPortfolio: _ts.idPortfolio
+            }
+          }).then(function (res) {
+            if (res) {
+              _ts.$set(_ts, 'notificationFlag', false);
+              _ts.$router.push({
+                path: '/user/' + _ts.$store.state.auth.user?.account
+              })
+            }
+          })
+        } else {
+          _ts.$message({
+            type: 'error',
+            message: '请先删除文章'
+          });
+        }
+
+      }).catch(() => {
+        _ts.$message({
+          type: 'info',
+          message: '已取消'
+        });
+      });
     }
   }
+}
 </script>
 
 <style scoped>