fix bug

src/layout/top.vue

@@ -16,17 +16,17 @@
           <div class='flex-child-average flex-justify-end flex padding-right '>
             <div class='padding flex flex-align-center'>
               <el-avatar class='mr-10' :size="30" src="https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png" />
-              <el-dropdown>
-                <span class="el-dropdown-link">
-                  第五季
+              <el-dropdown @command='dropDown'>
+                <span class="flex flex-center">
+                  {{user.info.user_name}}
                   <el-icon class="el-icon--right">
                     <arrow-down />
                   </el-icon>
                 </span>
                 <template #dropdown>
                   <el-dropdown-menu>
-                    <el-dropdown-item>个人中心</el-dropdown-item>
-                    <el-dropdown-item>退出登录</el-dropdown-item>
+                    <el-dropdown-item command='info'>个人中心</el-dropdown-item>
+                    <el-dropdown-item command='logout'>退出登录</el-dropdown-item>
                   </el-dropdown-menu>
                 </template>
               </el-dropdown>
@@ -38,17 +38,30 @@
 
 <script>
 import navStore from '../store/nav.js'
+import { useStore } from '../store/user.js'
 
 export default {
   name: 'top',
   setup () {
     const nav = navStore()
-    return { nav }
+    const user = useStore()
+    return { nav, user }
   },
   created () {
     this.nav.$subscribe((res) => {
       console.log(res.events.target)
     })
+  },
+  methods: {
+    dropDown (res) {
+      if (res === 'info') {
+        this.$message.success('个人中心')
+      } else if (res === 'logout') {
+        this.nav.cleanMenu()
+        this.$message.success('退出登录')
+        this.$router.replace('/login')
+      }
+    }
   }
 }
 </script>

src/page/login.vue

@@ -50,7 +50,7 @@
               </el-form-item>
               <el-form-item>
                 <div class='flex flex-align-center flex-justify-between full-width'>
-                  <el-checkbox :checked='true'>记住我</el-checkbox>
+                  <div></div>
                   <el-link type='primary'  :underline='false' class='font-12'>忘记密码?</el-link>
                 </div>
               </el-form-item>
@@ -86,8 +86,14 @@
 
 <script>
 import md5 from 'js-md5'
+import { useStore } from '@/store/user.js'
+import { setToken } from '../utils/auth.js'
 export default {
   name: 'login',
+  setup () {
+    const user = useStore()
+    return { user }
+  },
   data () {
     return {
       flag: false,
@@ -129,6 +135,9 @@ export default {
               this.$message.error(res.error_description)
               this.init()
             } else {
+              // 保存信息
+              this.user.setUserInfo(res)
+              setToken(res.access_token)
               this.$router.replace('/')
             }
           })

src/router/index.js

@@ -12,9 +12,10 @@ const router = createRouter({
 })
 
 router.beforeEach((to, from, next) => {
-  // console.log(generatedRoutes)
-  const nav = navStore()
-  nav.updateMenu(to)
+  if (to.path !== '/login') {
+    const nav = navStore()
+    nav.updateMenu(to)
+  }
   if (to.matched.length) {
     next()
   } else {

src/store/user.js

@@ -1,10 +1,16 @@
 import { defineStore } from 'pinia'
 
-const useCounterStore = defineStore('user', {
+export const useStore = defineStore('useStore', {
   persist: true, // 持久化
   state: () => ({
     info: {}
-  })
+  }),
+  actions: {
+    /**
+     * 设置用户信息
+     */
+    setUserInfo (info) {
+      this.info = info
+    }
+  }
 })
-
-export default useCounterStore

src/views/home/index.vue

@@ -12,17 +12,15 @@
 </route>
 
 <script>
-import useCounterStore from '../../store/user.js'
+import { useStore } from '../../store/user.js'
 import tokenStore from '../../store/token.js'
-import { setToken } from '../../utils/auth.js'
 export default {
   setup () {
-    const store = useCounterStore()
+    const store = useStore()
     const token = tokenStore()
     return { store, token }
   },
   created () {
-    setToken('asfddas129rq34-rda')
   },
   methods: {
     push () {

src/views/setting/index.vue

@@ -17,14 +17,9 @@
 </route>
 
 <script>
-import useCounterStore from '../../store/user.js'
 
 export default {
   name: 'index',
-  setup () {
-    const user = useCounterStore()
-    return { user }
-  },
   data () {
     return {
       list: [],
@@ -36,9 +31,7 @@ export default {
   },
   methods: {
     init () {
-      this.user.info = { user: '123', name: 'holle' }
       this.data = this.$route.query
-      this.user.$dispose()
       this.$api.login.sendSMS({ current: 1, size: 200 }).then((res) => {
         if (res.code === 200) {
           this.list = res.data.records