fix(profile): 修复用户信息获取路径错误并更新默认头像

修复了获取用户信息时路径错误的问题，将 `response.data.avatar` 和 `response.data.name` 更新为 `response.data.user.avatar` 和 `response.data.user.name`。同时更新了默认头像的 URL，使用 Vant 提供的默认图片。

fix(profile): 修复用户信息获取路径错误并更新默认头像
修复了获取用户信息时路径错误的问题，将 `response.data.avatar` 和 `response.data.name` 更新为 `response.data.user.avatar` 和 `response.data.user.name`。同时更新了默认头像的 URL，使用 Vant 提供的默认图片。
hookehuyr
Commit dbbce0973672d0dbb05de57d22d87f5efde7a32f dbbce097 1 parent e21d4d8a
Showing 7 changed files with 75 additions and 84 deletions
.env
src/router/guards.js
src/views/auth/LoginPage.vue
src/views/profile/ProfilePage.vue
src/views/profile/SettingsPage.vue
src/views/profile/settings/AvatarSettingPage.vue
src/views/profile/settings/UsernameSettingPage.vue
--- a/.env
View file @dbbce09
+++ b/.env
View file @dbbce09
@@ -11,7 +11,7 @@ VITE_PROXY_PREFIX = /srv/
 VITE_OUTDIR = mlaj
 # 是否开启调试
-VITE_CONSOLE = 0
+VITE_CONSOLE = 1
 # appID相关
 VITE_APPID=微信appID
--- a/src/router/guards.js
View file @dbbce09
+++ b/src/router/guards.js
View file @dbbce09
 /*
  * @Date: 2025-03-20 20:36:36
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2025-03-26 11:21:05
+ * @LastEditTime: 2025-03-26 12:34:44
  * @FilePath: /mlaj/src/router/guards.js
  * @Description: 路由守卫逻辑
  */
@@ -33,7 +33,7 @@ export const checkWxAuth = async () => {
       const { code, data } = await getAuthInfoAPI();
       if (code && !data.openid_has) {
         // 直接在这里处理授权跳转
-        let raw_url = encodeURIComponent(location.origin + location.pathname + $route.query.href); // 未授权的地址
+        let raw_url = encodeURIComponent(location.origin + location.pathname + location.href); // 未授权的地址
         const short_url = `/srv/?f=behalo&a=openid&res=${raw_url}`;
         location.href = short_url;
--- a/src/views/auth/LoginPage.vue
View file @dbbce09
+++ b/src/views/auth/LoginPage.vue
View file @dbbce09
 <template>
-  <div class="min-h-screen flex flex-col bg-gradient-to-br from-green-50 via-teal-50 to-blue-50 py-12 px-4 sm:px-6 lg:px-8">
+  <div
+    class="min-h-screen flex flex-col bg-gradient-to-br from-green-50 via-teal-50 to-blue-50 py-12 px-4 sm:px-6 lg:px-8"
+  >
     <div class="sm:mx-auto sm:w-full sm:max-w-md">
       <h1 class="text-center text-3xl font-bold text-gray-800 mb-2">亲子学院</h1>
       <h2 class="text-center text-xl font-medium text-gray-600">欢迎回来</h2>
@@ -7,7 +9,10 @@
     <div class="mt-8 sm:mx-auto sm:w-full sm:max-w-md">
       <FrostedGlass class="py-8 px-6 rounded-lg">
-        <div v-if="error" class="mb-4 bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded-md">
+        <div
+          v-if="error"
+          class="mb-4 bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded-md"
+        >
           {{ error }}
         </div>
@@ -44,7 +49,10 @@
           <div class="flex justify-end">
             <div class="text-sm">
-              <router-link to="/forgotPwd" class="font-medium text-green-600 hover:text-green-500">
+              <router-link
+                to="/forgotPwd"
+                class="font-medium text-green-600 hover:text-green-500"
+              >
                 忘记密码?
               </router-link>
             </div>
@@ -57,7 +65,7 @@
               class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-gradient-to-r from-green-500 to-green-600 hover:from-green-600 hover:to-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500"
               :class="{ 'opacity-70 cursor-not-allowed': loading }"
             >
-              {{ loading ? '登录中...' : '登 录' }}
+              {{ loading ? "登录中..." : "登 录" }}
             </button>
           </div>
         </form>
@@ -99,7 +107,10 @@
         <div class="text-center mt-6">
           <p class="text-sm text-gray-600">
             还没有账号?
-            <router-link to="/register" class="font-medium text-green-600 hover:text-green-500">
+            <router-link
+              to="/register"
+              class="font-medium text-green-600 hover:text-green-500"
+            >
               立即注册
             </router-link>
           </p>
@@ -110,92 +121,64 @@
 </template>
 <script setup>
-import { ref } from 'vue'
+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 { loginAPI } from '@/api/users'
+import { loginAPI, getUserInfoAPI } from "@/api/users";
-
+import { useTitle } from "@vueuse/core";
-import { useTitle } from '@vueuse/core'
 const $route = useRoute();
 useTitle($route.meta.title);
-const router = useRouter()
+const router = useRouter();
-const { login } = useAuth()
+const { login } = useAuth();
-const mobile = ref('')
+const mobile = ref("");
-const password = ref('')
+const password = ref("");
-const error = ref('')
+const error = ref("");
-const loading = ref(false)
+const loading = ref(false);
 // 原登录逻辑
-// const handleSubmit = async () => {
-//   if (!mobile.value || !password.value) {
-//     error.value = '请填写所有字段'
-//     return
-//   }
-
-//   try {
-//     error.value = ''
-//     loading.value = true
-
-//     // 调用登录接口
-//     const response = await loginAPI({
-//       mobile: mobile.value,
-//       password: password.value
-//     })
-
-//     if (response.code !== 1) {
-//       error.value = response.msg || '登录失败，请检查您的凭据'
-//       return
-//     }
-
-//     // 登录成功，更新auth状态
-//     const success = login(response.data)
-
-//     if (success) {
-//       // 如果有重定向参数，登录成功后跳转到对应页面
-//       const redirect = $route.query.redirect
-//       router.push(redirect || '/')
-//     } else {
-//       error.value = '登录失败，请检查您的凭据'
-//     }
-
-// 临时登录逻辑 - 支持任意输入
 const handleSubmit = async () => {
   if (!mobile.value || !password.value) {
-    error.value = '请填写所有字段'
+    error.value = "请填写所有字段";
-    return
+    return;
   }
   try {
-    error.value = ''
+    error.value = "";
-    loading.value = true
+    loading.value = true;
-    // 构造默认用户数据
+    // 调用登录接口
-    const mockUserData = {
+    const response = await loginAPI({
-      id: 1,
-      name: '测试用户',
       mobile: mobile.value,
-      avatar: 'https://cdn.ipadbiz.cn/mlaj/images/user-avatar-2.jpg',
+      password: password.value,
-      checkInDays: 3,
+    });
-      completedCourses: 12
+
+    if (response.code !== 1) {
+      error.value = response.msg || "登录失败，请检查您的凭据";
+      return;
     }
-    // 模拟登录成功
+    const { code, data } = await getUserInfoAPI();
-    const success = login(mockUserData)
+    if (code) {
+      // 登录成功，更新auth状态
+      const success = login(data.user);
       if (success) {
-      const redirect = $route.query.redirect
+        // 如果有重定向参数，登录成功后跳转到对应页面
-      router.push(redirect || '/')
+        const redirect = $route.query.redirect;
+        router.push(redirect || "/");
       } else {
-      error.value = '登录失败，请检查您的凭据'
+        error.value = "登录失败，请检查您的凭据";
       }
+    }
+
   } catch (err) {
-    console.error('Login error:', err)
+    console.error("Login error:", err);
-    error.value = '登录时发生错误'
+    error.value = "登录时发生错误";
   } finally {
-    loading.value = false
+    loading.value = false;
   }
-}
+};
 </script>
--- a/src/views/profile/ProfilePage.vue
View file @dbbce09
+++ b/src/views/profile/ProfilePage.vue
View file @dbbce09
@@ -13,7 +13,7 @@
             class="w-24 h-24 rounded-full overflow-hidden border-4 border-white shadow-lg mb-4"
           >
             <img
-              :src="profile.avatar || '/assets/images/user-avatar-1.jpg'"
+              :src="profile.avatar || 'https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg'"
               :alt="profile.name"
               class="w-full h-full object-cover"
               @error="handleImageError"
@@ -211,14 +211,22 @@ import MenuItem from "@/components/ui/MenuItem.vue";
 import { useAuth } from "@/contexts/auth";
 import { userProfile, checkInTypes } from "@/utils/mockData";
 import CheckInDialog from "@/components/ui/CheckInDialog.vue";
+import { getUserInfoAPI } from "@/api/users";
+import { showToast } from "vant";
 import { useTitle } from "@vueuse/core";
 const router = useRouter();
 const $route = useRoute();
 useTitle($route.meta.title);
-const { currentUser, logout } = useAuth();
+const { logout } = useAuth();
-const profile = ref(userProfile);
+const profile = ref({});
+onMounted(async () => {
+  const { code, data } = await getUserInfoAPI();
+  if (code) {
+    profile.value = data.user;
+  }
+})
 const showCheckInDialog = ref(false);
 // 处理打卡成功
@@ -249,7 +257,7 @@ const handleMenuClick = (path) => {
 // Handle image error
 const handleImageError = (e) => {
   e.target.onerror = null;
-  e.target.src = "/assets/images/user-avatar-1.jpg";
+  e.target.src = "https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg";
 };
 // Handle check-in type click
--- a/src/views/profile/SettingsPage.vue
View file @dbbce09
+++ b/src/views/profile/SettingsPage.vue
View file @dbbce09
 <!--
  * @Date: 2025-03-24 13:04:21
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2025-03-25 09:56:14
+ * @LastEditTime: 2025-03-26 13:03:11
  * @FilePath: /mlaj/src/views/profile/SettingsPage.vue
  * @Description: 用户设置页面
 -->
@@ -95,8 +95,8 @@ onMounted(async () => {
   try {
     const response = await getUserInfoAPI();
     if (response.data) {
-      userAvatar.value = response.data.avatar;
+      userAvatar.value = response.data.user.avatar;
-      username.value = response.data.name;
+      username.value = response.data.user.name;
     }
   } catch (error) {
     console.error('获取用户信息失败:', error);
--- a/src/views/profile/settings/AvatarSettingPage.vue
View file @dbbce09
+++ b/src/views/profile/settings/AvatarSettingPage.vue
View file @dbbce09
@@ -70,7 +70,7 @@ onMounted(async () => {
   try {
     const response = await getUserInfoAPI();
     if (response.data) {
-      userAvatar.value = response.data.avatar;
+      userAvatar.value = response.data.user.avatar;
     }
   } catch (error) {
     console.error("获取用户信息失败:", error);
--- a/src/views/profile/settings/UsernameSettingPage.vue
View file @dbbce09
+++ b/src/views/profile/settings/UsernameSettingPage.vue
View file @dbbce09
 <!--
  * @Date: 2025-03-24 13:04:21
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2025-03-24 13:46:15
+ * @LastEditTime: 2025-03-26 13:03:27
  * @FilePath: /mlaj/src/views/profile/settings/UsernameSettingPage.vue
  * @Description: 修改用户名页面
 -->
@@ -57,7 +57,7 @@ onMounted(async () => {
   try {
     const response = await getUserInfoAPI();
     if (response.data) {
-      username.value = response.data.name;
+      username.value = response.data.user.name;
     }
   } catch (error) {
     console.error('获取用户信息失败:', error);