feat: 修复退出登录登录信息未失效

apps/web/src/pages/home/index.tsx

@@ -10,6 +10,7 @@ import { useState } from 'react';
 import Logo from '@assets/images/logo.svg?react';
 import { Link, Outlet } from 'react-router';
 import { useGlobalStore } from '../../stores/global';
+import { loginService } from '@pages/login/service';
 
 function Home() {
   const [collapsed, setCollapsed] = useState(false);
@@ -56,18 +57,20 @@ function Home() {
         <Layout.Header className="h-14 border-b-gray-100 border-b-[1px]">
           <div className="flex items-center justify-end px-4 h-full">
             <Dropdown
-              trigger={'click'}
               droplist={
                 <Menu className="px-3">
-                  <Menu.Item key="1">
+                  <Menu.Item key="1" onClick={loginService.logout}>
                     <IconExport />
                     <span className="ml-2">退出登录</span>
                   </Menu.Item>
                 </Menu>
               }
             >
-              <div className="p-2 rounded-xl cursor-pointer flex items-center hover:bg-[rgba(0,0,0,0.03)]">
-                <Avatar size={28}>
+              <div className="p-2 rounded-xl cursor-pointer flex items-center hover:bg-gray-100">
+                <Avatar
+                  size={28}
+                  className="border-gray-300 border-[1px] border-solid"
+                >
                   <img
                     alt="avatar"
                     src={globalStore.user?.avatar_url.replace('https', 'http')}

apps/web/src/pages/login/service.ts

@@ -1,7 +1,8 @@
 import { net } from '@shared';
-import type { AuthURLResponse } from './types';
+import type { AuthURLResponse, AuthLoginResponse } from './types';
 import type { NavigateFunction } from 'react-router';
-import { Notification } from '@arco-design/web-react';
+import { Message, Notification } from '@arco-design/web-react';
+import { useGlobalStore } from '../../stores/global';
 
 class LoginService {
   async getAuthUrl() {
@@ -18,7 +19,7 @@ class LoginService {
   }
 
   async login(authCode: string, navigate: NavigateFunction) {
-    const { data, code } = await net.request<AuthURLResponse>({
+    const { data, code } = await net.request<AuthLoginResponse>({
       method: 'POST',
       url: '/api/auth/login',
       data: {
@@ -26,14 +27,25 @@ class LoginService {
       },
     });
     if (code === 0) {
-      localStorage.setItem('user', JSON.stringify(data));
+      useGlobalStore.getState().setUser(data);
       navigate('/');
       Notification.success({
         title: '提示',
-        content: '登录成功'
+        content: '登录成功',
       });
     }
   }
+
+  async logout() {
+    const { code } = await net.request<AuthURLResponse>({
+      method: 'GET',
+      url: '/api/auth/logout',
+    });
+    if (code === 0) {
+      Message.success('登出成功');
+      window.location.href = '/login';
+    }
+  }
 }
 
 export const loginService = new LoginService();

apps/web/src/pages/login/types.ts

@@ -1,5 +1,15 @@
 import type { APIResponse } from '@shared';
 
+export interface User {
+  id: string;
+  username: string;
+  email: string;
+  avatar_url: string;
+  active: boolean;
+}
+
 export type AuthURLResponse = APIResponse<{
   url: string;
-}>
+}>;
+
+export type AuthLoginResponse = APIResponse<User>;

apps/web/src/stores/global.tsx

@@ -11,11 +11,13 @@ interface User {
 
 interface GlobalStore {
   user: User | null;
+  setUser: (user: User) => void;
   refreshUser: () => Promise<void>;
 }
 
 export const useGlobalStore = create<GlobalStore>((set) => ({
   user: null,
+  setUser: (user: User) => set({ user }),
   async refreshUser() {
     const { data } = await net.request<APIResponse<User>>({
       method: 'GET',