diff --git a/src/store/userStore.ts b/src/store/userStore.ts
index d28381c..831c270 100644
--- a/src/store/userStore.ts
+++ b/src/store/userStore.ts
@@ -9,7 +9,7 @@ export const userStore = defineStore('user', () => {
   const refreshToken = ref('');
   const role = ref('');
   const username = ref('');
-  const userId = ref<number | null>(null);
+  const id = ref<number | null>(null);
 
   // 计算属性，用于快速判断用户是否登录
   const isLoggedIn = computed(() => !!accessToken.value);
@@ -29,13 +29,14 @@ export const userStore = defineStore('user', () => {
   async function login(usernameParam: string, password: string) {
     try {
       const { access_token, refresh_token } = await authService.login(usernameParam, password);
-      const decoded = jwtDecode<{ sub: string; role: string; username: string }>(access_token);
+      const decoded = jwtDecode<{ sub: string; role: string; username: string; id: string }>(access_token);
       setTokens({ access_token, refresh_token });
       setRole(decoded.role);
       username.value = decoded.username;
-      userId.value = parseInt(decoded.sub);
+      id.value = parseInt(decoded.id);
     } catch (error) {
       console.error('Login failed:', error);
+      throw error;
     }
   }
 
@@ -45,7 +46,7 @@ export const userStore = defineStore('user', () => {
     refreshToken.value = '';
     role.value = '';
     username.value = '';
-    userId.value = null;
+    id.value = null;
   }
 
   // 刷新访问令牌的方法，调用 authService.refreshToken 获取新令牌并设置状态
@@ -58,5 +59,5 @@ export const userStore = defineStore('user', () => {
     }
   }
 
-  return { accessToken, refreshTokenToken: refreshToken, role, username, userId, isLoggedIn, login, logout, refreshTokenMethod };
+  return { accessToken, refreshTokenToken: refreshToken, role, username, userId: id, isLoggedIn, login, logout, refreshTokenMethod };
 });
\ No newline at end of file
diff --git a/src/views/LoginPage.vue b/src/views/LoginPage.vue
index 89ce027..062d984 100644
--- a/src/views/LoginPage.vue
+++ b/src/views/LoginPage.vue
@@ -17,6 +17,7 @@
 
 <script lang="ts" setup>
 import { ref } from 'vue'
+import type { Ref } from 'vue'
 import { useRouter } from 'vue-router'
 import { userStore } from '@/store/userStore'
 import { ElMessage } from 'element-plus'
@@ -37,10 +38,13 @@ const form = ref<LoginForm>({
 const handleLogin = async () => {
   try {
     const { username, password } = form.value
+    if (!username || !password) {
+      throw new Error('用户名和密码不能为空')
+    }
     await store.login(username, password)
     router.push({ name: 'manage' })
-  } catch (error) {
-    ElMessage.error('登录失败，请检查用户名和密码')
+  } catch (error: any) {
+    ElMessage.error(error.message || '登录失败，请检查用户名和密码')
   }
 }
 </script>