From 34a06794f92c0a51b1ded8bca75576de088f8abe Mon Sep 17 00:00:00 2001
From: zzc <1761997216@qq.com>
Date: Fri, 30 Jan 2026 18:50:33 +0800
Subject: [PATCH] fix: my info

---
 api/auth.js            |   8 +++
 pages/mine/profile.vue | 138 ++++++++++++++++++++++++++++++++++-------
 2 files changed, 124 insertions(+), 22 deletions(-)

diff --git a/api/auth.js b/api/auth.js
index 66c84d4..edfb612 100644
--- a/api/auth.js
+++ b/api/auth.js
@@ -14,3 +14,11 @@ export const getUserInfo = async () => {
     method: "GET",
   });
 };
+
+export const updateUserInfo = async (body) => {
+  return request({
+    url: "/api/user/info",
+    method: "PUT",
+    data: body,
+  });
+};
diff --git a/pages/mine/profile.vue b/pages/mine/profile.vue
index 252a3ac..797f841 100644
--- a/pages/mine/profile.vue
+++ b/pages/mine/profile.vue
@@ -21,7 +21,10 @@
         <view class="avatar-wrapper" @click="handleAvatarClick">
           <image
             class="avatar"
-            :src="userInfo.avatarUrl || 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0'"
+            :src="
+              userInfo.avatarUrl ||
+              'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0'
+            "
             mode="aspectFill"
           />
           <view class="camera-badge">
@@ -34,30 +37,30 @@
       <!-- Info List -->
       <view class="info-card">
         <view class="info-item" @click="handleEditName">
-          <text class="label">名字 / 昵称</text>
+          <text class="label">昵称</text>
           <view class="value-box">
-            <text class="value">{{ userInfo.nickName || "微信用户" }}</text>
+            <text class="value">{{ form.nickName || "微信用户" }}</text>
             <uni-icons type="right" size="14" color="#ccc" />
           </view>
         </view>
-        <view class="info-item">
+        <view class="info-item" @click="handleEditGender">
           <text class="label">性别</text>
           <view class="value-box">
-            <text class="value">男</text>
+            <text class="value">{{ genderText }}</text>
             <uni-icons type="right" size="14" color="#ccc" />
           </view>
         </view>
         <view class="info-item" @click="handleEditManifesto">
           <text class="label">新春宣言</text>
           <view class="value-box">
-            <text class="value red-text">万事如意，岁岁平安</text>
+            <text class="value red-text">{{ form.bio || "点击选择" }}</text>
             <uni-icons type="compose" size="16" color="#ccc" />
           </view>
         </view>
       </view>
 
       <!-- Account Binding -->
-      <view class="section-header">
+      <!-- <view class="section-header">
         <text class="section-title">账号绑定</text>
       </view>
       <view class="info-card">
@@ -73,7 +76,7 @@
             <text class="value">WX_CN_2026</text>
           </view>
         </view>
-      </view>
+      </view> -->
 
       <!-- Trophy Decoration -->
       <view class="trophy-decoration">
@@ -91,16 +94,44 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
+import { ref, computed, watch } from "vue";
 import { storeToRefs } from "pinia";
-import { getBavBarHeight, getStatusBarHeight as getStatus } from "@/utils/system";
+import {
+  getBavBarHeight,
+  getStatusBarHeight as getStatus,
+} from "@/utils/system";
 import { useUserStore } from "@/stores/user";
+import { updateUserInfo } from "@/api/auth.js";
 
 const navBarHeight = getBavBarHeight();
 const statusBarHeight = getStatus();
 const userStore = useUserStore();
 const { userInfo } = storeToRefs(userStore);
 
+const form = ref({
+  nickName: "",
+  gender: 1, // 1: 男, 2: 女
+  bio: "",
+});
+
+const genderText = computed(() => {
+  if (form.value.gender === 1) return "男";
+  if (form.value.gender === 2) return "女";
+  return "未知";
+});
+
+watch(
+  userInfo,
+  (newVal) => {
+    if (newVal) {
+      form.value.nickName = newVal.nickName || "";
+      form.value.gender = newVal.gender || 1;
+      form.value.bio = newVal.bio || "万事如意，岁岁平安";
+    }
+  },
+  { immediate: true, deep: true },
+);
+
 const goBack = () => {
   uni.navigateBack();
 };
@@ -113,22 +144,85 @@ const handleAvatarClick = () => {
 };
 
 const handleEditName = () => {
-  uni.showToast({ title: "修改昵称功能开发中", icon: "none" });
+  uni.showModal({
+    title: "修改昵称",
+    editable: true,
+    placeholderText: "请输入昵称(最多5个字)",
+    content: form.value.nickName,
+    success: (res) => {
+      if (res.confirm) {
+        if (res.content.length > 5) {
+          uni.showToast({ title: "昵称最多5个字", icon: "none" });
+          return;
+        }
+        form.value.nickName = res.content;
+      }
+    },
+  });
 };
 
+const handleEditGender = () => {
+  uni.showActionSheet({
+    itemList: ["男", "女"],
+    success: (res) => {
+      form.value.gender = res.tapIndex + 1;
+    },
+  });
+};
+
+const manifestoOptions = [
+  "万事如意，岁岁平安",
+  "龙马精神，财运亨通",
+  "心想事成，大吉大利",
+  "身体健康，阖家幸福",
+  "吉星高照，福寿安康",
+];
+
 const handleEditManifesto = () => {
-  uni.showToast({ title: "修改宣言功能开发中", icon: "none" });
+  uni.showActionSheet({
+    itemList: manifestoOptions,
+    success: (res) => {
+      form.value.bio = manifestoOptions[res.tapIndex];
+    },
+  });
 };
 
-const handleSave = () => {
-  uni.showLoading({ title: "保存中..." });
-  setTimeout(() => {
+const handleSave = async () => {
+  if (!form.value.nickName) {
+    uni.showToast({ title: "请输入昵称", icon: "none" });
+    return;
+  }
+
+  uni.showLoading({ title: "保存中...", mask: true });
+  try {
+    const res = await updateUserInfo({
+      nickname: form.value.nickName, // Prompt said "nickname" lowercase, I used "nickName" in ref but need to check param name.
+      // Prompt: "请求参数分别是nickname gender bio"
+      // Wait, prompt said "nickname", usually it is nickName in Uni-app userInfo.
+      // But I will follow prompt "nickname".
+      gender: form.value.gender,
+      bio: form.value.bio,
+    });
+
+    // Check result
+    if (res && res.success) {
+      await userStore.fetchUserInfo();
+      uni.hideLoading();
+      uni.showToast({ title: "保存成功", icon: "success" });
+    } else {
+      uni.hideLoading();
+      // If res is not success but request didn't fail, maybe backend returns something else?
+      // Assuming request wrapper handles non-200 business codes by rejecting,
+      // so here we might just have data.
+      // If prompt says "returns { success: true }", then checking res.success is correct.
+      // If it fails, request throws error usually.
+    }
+  } catch (e) {
     uni.hideLoading();
-    uni.showToast({ title: "保存成功", icon: "success" });
-    setTimeout(() => {
-      uni.navigateBack();
-    }, 1500);
-  }, 1000);
+    // Error is handled by request usually if showError is true.
+    // But we can show toast too.
+    console.error(e);
+  }
 };
 </script>
 
@@ -255,7 +349,7 @@ const handleSave = () => {
   color: #333;
   margin-right: 10rpx;
   font-weight: 500;
-  
+
   &.red-text {
     color: #ff3b30;
   }
@@ -305,7 +399,7 @@ const handleSave = () => {
   font-weight: bold;
   border: none;
   box-shadow: 0 10rpx 20rpx rgba(211, 47, 47, 0.2);
-  
+
   &:active {
     opacity: 0.9;
   }