From ae495ef9ab0e55c0a8e4624e526fbedc8f05876a Mon Sep 17 00:00:00 2001
From: ivan <ivan@qq.com>
Date: Sun, 8 Feb 2026 14:25:20 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=EF=BC=9A=E7=99=BB=E5=BD=95?=
 =?UTF-8?q?=E4=BF=A1=E6=81=AF=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue         | 22 +++++++++++++---
 src/stores/user.ts  | 63 +++++++++++++++++++++++++++++++++++++++++++++
 src/views/Login.vue | 13 +++++++---
 3 files changed, 92 insertions(+), 6 deletions(-)
 create mode 100644 src/stores/user.ts

diff --git a/src/App.vue b/src/App.vue
index 7fa2940..f03cc83 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,8 +1,10 @@
 <script setup lang="ts">
 import { computed } from 'vue'
 import { useRoute } from 'vue-router'
+import { useUserStore } from './stores/user'
 
 const route = useRoute()
+const userStore = useUserStore()
 
 const currentRoute = computed(() => {
   return route.path
@@ -14,9 +16,23 @@ const currentRoute = computed(() => {
     <v-app-bar color="primary" dark>
       <v-app-bar-title>PolyMarket</v-app-bar-title>
       <v-spacer></v-spacer>
-      <v-btn text to="/" :class="{ active: currentRoute === '/' }"> Home </v-btn>
-      <v-btn text to="/trade" :class="{ active: currentRoute === '/trade' }"> Trade </v-btn>
-      <v-btn text to="/login" :class="{ active: currentRoute === '/login' }"> Login </v-btn>
+      <v-btn v-if="!userStore.isLoggedIn" text to="/login" :class="{ active: currentRoute === '/login' }">
+        Login
+      </v-btn>
+      <v-menu v-else location="bottom" :close-on-content-click="false">
+        <template #activator="{ props }">
+          <v-btn v-bind="props" icon variant="text" class="avatar-btn">
+            <v-avatar size="36" color="primary">
+              <v-img v-if="userStore.avatarUrl" :src="userStore.avatarUrl" cover alt="avatar" />
+              <v-icon v-else>mdi-account</v-icon>
+            </v-avatar>
+          </v-btn>
+        </template>
+        <v-list density="compact">
+          <v-list-item :title="userStore.user?.nickName || userStore.user?.userName || 'User'" disabled />
+          <v-list-item title="退出登录" @click="userStore.logout()" />
+        </v-list>
+      </v-menu>
     </v-app-bar>
     <v-main>
       <router-view />
diff --git a/src/stores/user.ts b/src/stores/user.ts
new file mode 100644
index 0000000..5bf9ac7
--- /dev/null
+++ b/src/stores/user.ts
@@ -0,0 +1,63 @@
+import { ref, computed } from 'vue'
+import { defineStore } from 'pinia'
+
+export interface UserInfo {
+  headerImg?: string
+  nickName?: string
+  userName?: string
+  [key: string]: unknown
+}
+
+const STORAGE_KEY = 'poly-user'
+
+function loadStored(): { token: string; user: UserInfo } | null {
+  try {
+    const raw = localStorage.getItem(STORAGE_KEY)
+    if (!raw) return null
+    return JSON.parse(raw) as { token: string; user: UserInfo }
+  } catch {
+    return null
+  }
+}
+
+function saveToStorage(token: string, user: UserInfo) {
+  try {
+    localStorage.setItem(STORAGE_KEY, JSON.stringify({ token, user }))
+  } catch {
+    //
+  }
+}
+
+function clearStorage() {
+  try {
+    localStorage.removeItem(STORAGE_KEY)
+  } catch {
+    //
+  }
+}
+
+export const useUserStore = defineStore('user', () => {
+  const stored = loadStored()
+  const token = ref<string>(stored?.token ?? '')
+  const user = ref<UserInfo | null>(stored?.user ?? null)
+
+  const isLoggedIn = computed(() => !!token.value && !!user.value)
+  const avatarUrl = computed(() => user.value?.headerImg ?? '')
+
+  function setUser(loginData: { token?: string; user?: UserInfo }) {
+    const t = loginData.token ?? ''
+    const u = loginData.user ?? null
+    token.value = t
+    user.value = u
+    if (t && u) saveToStorage(t, u)
+    else clearStorage()
+  }
+
+  function logout() {
+    token.value = ''
+    user.value = null
+    clearStorage()
+  }
+
+  return { token, user, isLoggedIn, avatarUrl, setUser, logout }
+})
diff --git a/src/views/Login.vue b/src/views/Login.vue
index 89e4323..169e7aa 100644
--- a/src/views/Login.vue
+++ b/src/views/Login.vue
@@ -66,8 +66,10 @@ import { ref } from 'vue'
 import { useRouter } from 'vue-router'
 import { BrowserProvider } from 'ethers'
 import { SiweMessage } from 'siwe'
+import { useUserStore } from '../stores/user'
 
 const router = useRouter()
+const userStore = useUserStore()
 const email = ref('')
 const password = ref('')
 const isConnecting = ref(false)
@@ -127,7 +129,7 @@ const connectWithWallet = async () => {
     const provider = new BrowserProvider(window.ethereum)
     const signer = await provider.getSigner()
     const nonce = new Date().getTime().toString()
-    
+
     const siwe = new SiweMessage({
       scheme,
       domain,
@@ -185,8 +187,13 @@ const connectWithWallet = async () => {
     const loginData = await loginResponse.json()
     console.log('Login API response:', loginData)
 
-    // For demo purposes, we'll just navigate to the home page
-    // In a real application, you would store the token or session data here
+    if (loginData.code === 0 && loginData.data) {
+      userStore.setUser({
+        token: loginData.data.token,
+        user: loginData.data.user ?? null,
+      })
+    }
+
     router.push('/')
   } catch (error: any) {
     console.error('Error connecting to wallet:', error)