u

code/link56/link56-frontend-new/src/layout/components/header.vue

@@ -1,15 +1,10 @@
 <script lang="ts" setup>
 import { useRoute, useRouter } from 'vue-router'
-
-const props = defineProps({
-  isLogined: {
-    type: Boolean,
-    default: false,
-  },
-})
+import { useUserStore } from '@/store/user'
 
 const route = useRoute()
 const router = useRouter()
+const userStore = useUserStore()
 
 const menuList = [
   { name: '首页', path: '/' },
@@ -22,6 +17,12 @@ const menuList = [
 function navigateTo(path: string) {
   router.push(path)
 }
+
+function exitLogin() {
+  userStore.clearUserInfo()
+
+  navigateTo('/auth/login')
+}
 </script>
 
 <template>
@@ -43,22 +44,24 @@ function navigateTo(path: string) {
       <div class="action">
         <i-tdesign:search class="action-item" />
 
-        <i-tdesign:notification v-if="props.isLogined" class="action-item" />
+        <i-tdesign:notification v-if="userStore.isLogined" class="action-item" />
 
-        <template v-if="props.isLogined">
+        <template v-if="userStore.isLogined">
           <el-divider direction="vertical" />
 
           <el-dropdown>
             <div class="user">
-              <el-avatar :size="32" src="https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png" />
+              <el-avatar :size="32" :src="userStore.userInfo.avatar" />
               <span class="name">
-                远通G3
+                {{ userStore.userInfo.name }}
               </span>
             </div>
             <template #dropdown>
               <el-dropdown-menu>
                 <el-dropdown-item>个人中心</el-dropdown-item>
-                <el-dropdown-item>退出登录</el-dropdown-item>
+                <el-dropdown-item @click="exitLogin()">
+                  退出登录
+                </el-dropdown-item>
               </el-dropdown-menu>
             </template>
           </el-dropdown>