feat: 添加用户登录功能并优化本地存储处理

- 在axios.js中设置默认的baseURL为本地API地址
- 在auth.js中添加对localStorage操作的异常处理
- 新增users.js文件，定义用户相关API接口
- 在LoginPage.vue中集成登录API并优化登录流程

+/*
+ * @Date: 2025-03-23 23:45:53
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2025-03-23 23:45:54
+ * @FilePath: /mlaj/src/api/users.js
+ * @Description: 用户相关接口
+ */
+import { fn, fetch } from './fn';
+
+const Api = {
+  USER_LOGIN: '/users/login',
+  USER_REGISTER: '/users/register',
+  USER_INFO: '/users/info',
+}
+
+/**
+ * @description: 用户登录
+ * @param: email 用户邮箱
+ * @param: password 用户密码
+ */
+export const loginAPI = (params) => fn(fetch.post(Api.USER_LOGIN, params));
+
+/**
+ * @description: 用户注册
+ * @param: name 用户名称
+ * @param: email 用户邮箱
+ * @param: password 用户密码
+ */
+export const registerAPI = (params) => fn(fetch.post(Api.USER_REGISTER, params));
+
+/**
+ * @description: 获取用户信息
+ */
+export const getUserInfoAPI = () => fn(fetch.get(Api.USER_INFO));

@@ -47,8 +47,14 @@ export function provideAuth() {
   // 登录函数
   // 登录函数
   const login = (userData) => {
   const login = (userData) => {
     currentUser.value = userData
     currentUser.value = userData
-    localStorage.setItem('currentUser', JSON.stringify(userData))
-    localStorage.setItem('loginTimestamp', Date.now().toString())
+    if (currentUser.value) {
+      try {
+        localStorage.setItem('currentUser', JSON.stringify(userData))
+        localStorage.setItem('loginTimestamp', Date.now().toString())
+      } catch (error) {
+        console.error('Failed to save user data to localStorage:', error)
+      }
+    }
     return true
     return true
   }
   }
 
 

@@ -12,6 +12,7 @@ import qs from 'Qs'
 import { strExist } from '@/utils/tools'
 import { strExist } from '@/utils/tools'
 // import { parseQueryString } from '@/utils/tools'
 // import { parseQueryString } from '@/utils/tools'
 
 
+axios.defaults.baseURL = 'http://localhost:3000/api';
 axios.defaults.params = {
 axios.defaults.params = {
   f: 'good',
   f: 'good',
 };
 };

@@ -114,15 +114,16 @@ import { ref } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { useRoute, useRouter } from 'vue-router'
 import FrostedGlass from '@/components/ui/FrostedGlass.vue'
 import FrostedGlass from '@/components/ui/FrostedGlass.vue'
 import { useAuth } from '@/contexts/auth'
 import { useAuth } from '@/contexts/auth'
-import { useTitle } from '@vueuse/core';
+import { useTitle } from '@vueuse/core'
+import { loginAPI } from '@/api/users'
 const $route = useRoute();
 const $route = useRoute();
 const $router = useRouter();
 const $router = useRouter();
 useTitle($route.meta.title);
 useTitle($route.meta.title);
 const router = useRouter()
 const router = useRouter()
 const { login } = useAuth()
 const { login } = useAuth()
 
 
-const email = ref('')
-const password = ref('')
+const email = ref('user1@example.com')
+const password = ref('password123')
 const error = ref('')
 const error = ref('')
 const loading = ref(false)
 const loading = ref(false)
 
 
@@ -136,13 +137,20 @@ const handleSubmit = async () => {
     error.value = ''
     error.value = ''
     loading.value = true
     loading.value = true
 
 
-    // 使用auth.js中的login函数
-    const success = login({
+    // 调用登录接口
+    const response = await loginAPI({
       email: email.value,
       email: email.value,
-      name: '李玉红',
-      avatar: 'https://cdn.ipadbiz.cn/mlaj/images/user-avatar-1.jpg'
+      password: password.value
     })
     })
 
 
+    if (response.code !== 1) {
+      error.value = response.msg || '登录失败，请检查您的凭据'
+      return
+    }
+
+    // 登录成功，更新auth状态
+    const success = login(response.data)
+
     if (success) {
     if (success) {
       // 如果有重定向参数，登录成功后跳转到对应页面
       // 如果有重定向参数，登录成功后跳转到对应页面
       const redirect = $route.query.redirect
       const redirect = $route.query.redirect