个人信息修改昵称

src/pagesMember/profile/profile.vue

@@ -22,7 +22,7 @@
         </view>
         <view class="form-item">
           <text class="label">昵称</text>
-          <input class="input" type="text" placeholder="请填写昵称" :value="profile?.nickname" />
+          <input class="input" type="text" placeholder="请填写昵称" v-model="profile.nickname" />
         </view>
         <view class="form-item">
           <text class="label">性别</text>
@@ -66,7 +66,7 @@
         </view>
       </view>
       <!-- 提交按钮 -->
-      <button class="form-button">保 存</button>
+      <button class="form-button" @tap="onSubmit">保 存</button>
     </view>
   </view>
 </template>
@@ -75,13 +75,13 @@
 import { onLoad } from '@dcloudio/uni-app'
 import { ref } from 'vue'
 import type { Gender, ProfileDetail } from '@/types/member'
-import { getMemberProfileAPI } from '@/services/profile'
+import { getMemberProfileAPI, putMemberProfileAPI } from '@/services/profile'
 
 // 获取屏幕边界到安全区域距离
 const { safeAreaInsets } = uni.getSystemInfoSync()
 
-// 获取个人信息
-const profile = ref<ProfileDetail>()
+// 获取个人信息，修改个人信息需提供初始值
+const profile = ref({} as ProfileDetail)
 const getMemberProfileData = async () => {
   const res = await getMemberProfileAPI()
   profile.value = res.result
@@ -120,6 +120,17 @@ const onAvatarChange = () => {
   })
 }
 
+const onSubmit = async () => {
+  //修改个人信息
+  const res = await putMemberProfileAPI({
+    nickname: profile.value.nickname,
+  })
+  // 成功提示
+  uni.showToast({
+    icon: 'success',
+    title: '保存成功',
+  })
+}
 onLoad(() => {
   getMemberProfileData()
 })

src/services/profile.ts

@@ -1,4 +1,4 @@
-import type { ProfileDetail } from '@/types/member'
+import type { ProfileDetail, ProfileParams } from '@/types/member'
 import { http } from '@/utils/http'
 
 /**
@@ -10,3 +10,15 @@ export const getMemberProfileAPI = () => {
     url: '/member/profile',
   })
 }
+
+/**
+ * 修改个人信息
+ * @param data 请求体参数
+ */
+export const putMemberProfileAPI = (data: ProfileParams) => {
+  return http<ProfileDetail>({
+    method: 'PUT',
+    url: '/member/profile',
+    data,
+  })
+}

src/types/member.d.ts

@@ -31,3 +31,16 @@ export type ProfileDetail = BaseProfile & {
 }
 /** 性别 */
 export type Gender = '女' | '男'
+
+/** 个人信息 修改请求体参数 */
+export type ProfileParams = Pick<
+  ProfileDetail,
+  'nickname' | 'gender' | 'birthday' | 'profession'
+> & {
+  /** 省份编码 */
+  provinceCode?: string
+  /** 城市编码 */
+  cityCode?: string
+  /** 区/县编码 */
+  countyCode?: string
+}