From 28f8533d0aab2622ac8a169337586b0e28f88f0f Mon Sep 17 00:00:00 2001
From: Ran_Chen <1908198662@qq.com>
Date: Mon, 31 Mar 2025 15:34:26 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B8=85=E9=99=A4=E6=9C=AC=E5=9C=B0token?=
 =?UTF-8?q?=E7=BC=93=E5=AD=98=EF=BC=8C=E5=AE=8C=E6=88=90=E5=89=8D=E7=AB=AF?=
 =?UTF-8?q?=E9=80=80=E5=87=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 main/manager-web/src/apis/api.js              |  2 +-
 main/manager-web/src/components/HeaderBar.vue | 23 +++++++++++++++--
 main/manager-web/src/store/index.js           | 25 ++++++++++++++++---
 3 files changed, 44 insertions(+), 6 deletions(-)

diff --git a/main/manager-web/src/apis/api.js b/main/manager-web/src/apis/api.js
index 2f789925..60ce4d12 100755
--- a/main/manager-web/src/apis/api.js
+++ b/main/manager-web/src/apis/api.js
@@ -7,7 +7,7 @@ import admin from './module/admin.js'
  * 如果你想调用8002端口，就用'/xiaozhi-esp32-api/api/v1'，请与vue.config.js的devServer配置相结合，方便跨域请求
  *
  */
-const DEV_API_SERVICE = 'https://apifoxmock.com/m1/5931378-5618560-default'
+const DEV_API_SERVICE = 'https://2662r3426b.vicp.fun/xiaozhi-esp32-api'
 // 8002开发完成完成后使用这个
 // const DEV_API_SERVICE = '/xiaozhi-esp32-api'
 
diff --git a/main/manager-web/src/components/HeaderBar.vue b/main/manager-web/src/components/HeaderBar.vue
index cfd3f60f..0828d201 100644
--- a/main/manager-web/src/components/HeaderBar.vue
+++ b/main/manager-web/src/components/HeaderBar.vue
@@ -43,7 +43,7 @@
           <el-dropdown-menu slot="dropdown">
             <el-dropdown-item icon="el-icon-plus" @click.native="">个人中心</el-dropdown-item>
             <el-dropdown-item icon="el-icon-circle-plus" @click.native="showChangePasswordDialog">修改密码</el-dropdown-item>
-            <el-dropdown-item icon="el-icon-circle-plus-outline" @click.native="">退出登录</el-dropdown-item>
+            <el-dropdown-item icon="el-icon-circle-plus-outline" @click.native="handleLogout">退出登录</el-dropdown-item>
           </el-dropdown-menu>
         </el-dropdown>
       </div>
@@ -57,6 +57,8 @@
 <script>
 import userApi from '@/apis/module/user';
 import ChangePasswordDialog from './ChangePasswordDialog.vue'; // 引入修改密码弹窗组件
+import { mapActions } from 'vuex'; // 导入 mapActions
+
 
 export default {
   name: 'HeaderBar',
@@ -118,7 +120,24 @@ export default {
     // 显示修改密码弹窗
     showChangePasswordDialog() {
       this.isChangePasswordDialogVisible = true;
-    }
+    },
+    // 退出登录
+    async handleLogout() {
+      try {
+        // 调用 Vuex 的 logout action
+        await this.logout();
+
+        this.$message.success('退出登录成功');
+
+        this.$router.push('/login');
+      } catch (error) {
+        console.error('退出登录失败:', error);
+        this.$message.error('退出登录失败，请重试');
+      }
+    },
+
+    // 使用 mapActions 引入 Vuex 的 logout action
+    ...mapActions(['logout'])
   }
 }
 </script>
diff --git a/main/manager-web/src/store/index.js b/main/manager-web/src/store/index.js
index 0f810894..c781243e 100644
--- a/main/manager-web/src/store/index.js
+++ b/main/manager-web/src/store/index.js
@@ -6,7 +6,8 @@ Vue.use(Vuex)
 
 export default new Vuex.Store({
   state: {
-    token: ''
+    token: '',
+    userInfo: {} // 添加用户信息存储
   },
   getters: {
     getToken(state) {
@@ -14,16 +15,34 @@ export default new Vuex.Store({
         state.token = localStorage.getItem('token')
       }
       return state.token
+    },
+    getUserInfo(state) {
+      return state.userInfo
     }
   },
   mutations: {
     setToken(state, token) {
       state.token = token
-      localStorage.token = token
+      localStorage.setItem('token', token)
+    },
+    setUserInfo(state, userInfo) {
+      state.userInfo = userInfo
+    },
+    clearAuth(state) {
+      state.token = ''
+      state.userInfo = {}
+      localStorage.removeItem('token')
     }
   },
   actions: {
+    // 添加 logout action
+    logout({ commit }) {
+      return new Promise((resolve) => {
+        commit('clearAuth')
+        resolve()
+      })
+    }
   },
   modules: {
   }
-})
+})
\ No newline at end of file