增加注销登录功能&播放错误自动跳下一首

package.json

@@ -1,6 +1,6 @@
 {
   "name": "player",
-  "version": "1.0.22",
+  "version": "1.0.23",
   "author": "sunzongzheng <[email protected]>",
   "description": "An electron-vue project",
   "license": "CC0-1.0",

src/renderer/store/modules/playlist.js

@@ -16,6 +16,7 @@ export default {
         let data = await Vue.http.get('/playlist')
         commit('update', data)
       } catch (e) {
+        commit('update', [])
         console.warn(e)
       }
     },

src/renderer/store/modules/user.js

@@ -6,20 +6,25 @@ export default {
     info: null
   },
   mutations: {
-    update (state, val) {
+    update(state, val) {
       state.info = val
       // 初始化歌单
       Vue.store.dispatch('playlist/init')
     }
   },
   actions: {
-    async init ({commit}) {
+    async init({commit}) {
       try {
         const data = await Vue.http.get('/user')
         commit('update', data)
       } catch (e) {
         console.warn(e)
       }
+    },
+    logout({commit}) {
+      commit('update', null)
+      Vue.store.commit('token/clear')
+      Vue.$message.success('退出成功')
     }
   }
 }

src/renderer/view/main/components/leftMenu/avatar.vue

@@ -1,6 +1,13 @@
 <template>
     <div :class="s.app" @click="onClick">
-        <img :src="info | avatar">
+        <el-popover popper-class="avatarPopover"
+                    :disabled="!info"
+                    ref="popover1"
+                    placement="bottom"
+                    trigger="hover">
+            <span @click="logout">退出账号</span>
+        </el-popover>
+        <img :src="info | avatar" v-popover:popover1>
         <span :class="s.nickname">{{info | nickname}}</span>
     </div>
 </template>
@@ -16,13 +23,17 @@
       nickname: (info) => info ? info.nickname : '登录'
     },
     methods: {
-      onClick () {
+      onClick() {
         // 已登录
         if (this.info) {
 
         } else { // 未登录
           this.$ipc.send('login')
         }
+      },
+      // 退出
+      logout() {
+        this.$store.dispatch('user/logout')
       }
     }
   }
@@ -63,4 +74,16 @@
             width: 180px;
         }
     }
+</style>
+<style lang="scss">
+    .avatarPopover {
+        -webkit-app-region: no-drag;
+        span {
+            font-size: 12px;
+            cursor: pointer;
+            &:hover {
+                color: #26B36C;
+            }
+        }
+    }
 </style>

src/renderer/view/main/components/player/components/playInfo/index.vue

@@ -40,6 +40,9 @@
                preload="true"
                @timeupdate="timeupdate"
                @ended="$store.dispatch('c_playlist/next')"
+               @abort="$store.dispatch('c_playlist/next')"
+               @stalled="$store.dispatch('c_playlist/next')"
+               @error="$store.dispatch('c_playlist/next')"
         ></audio>
     </div>
 </template>

src/renderer/view/rank/index.vue

@@ -37,7 +37,7 @@
     methods: {
       async getList() {
         try {
-          for (let i = 0; i < 16; i++) {
+          for (let i = 0; i < 21; i++) {
             const {data} = await this.$api.getTopList(i.toString())
             this.list.push(data)
           }