From 05316275ee6f1623cc022a3cb4967a440c105a6b Mon Sep 17 00:00:00 2001
From: cloudroam <cloudroam>
Date: 星期二, 29 七月 2025 16:43:42 +0800
Subject: [PATCH] add：编辑资料
---
sub-pages/mine/profile-edit.vue | 187 ++++++++++++++++++++++++++++++----------------
1 files changed, 122 insertions(+), 65 deletions(-)
diff --git a/sub-pages/mine/profile-edit.vue b/sub-pages/mine/profile-edit.vue
index bc49ab5..5280e41 100644
--- a/sub-pages/mine/profile-edit.vue
+++ b/sub-pages/mine/profile-edit.vue
@@ -1,33 +1,21 @@
<template>
<view class="edit-profile">
<view class="avatar-box">
- <up-avatar :src="form.avatar" size="80" @click="onChangeAvatar" />
+ <up-avatar :src="form.cover" size="80" @click="onChangeAvatar" />
</view>
<up-cell-group :border="false" :customStyle="cellGroupStyle">
- <up-cell title="名字" isLink @click="editField('nickname')">
+ <up-cell title="名字" isLink @click="editField('名称')">
<template #value>
- <view class="cell-value">{{ form.nickname }}</view>
- </template>
- </up-cell>
- <up-cell title="小红书号" isLink @click="editField('xhsId')">
- <template #value>
- <view class="cell-value">{{ form.xhsId }}</view>
- </template>
- </up-cell>
- <up-cell title="背景图" isLink @click="editField('backgroundImg')">
- <template #value>
- <view class="cell-value">
- <image class="bg-img" :src="form.backgroundImg" mode="aspectFill" @click="onChangeBackground" />
- </view>
+ <view class="cell-value">{{ form.name }}</view>
</template>
</up-cell>
</up-cell-group>
<up-cell-group :border="false" :customStyle="cellGroupStyle">
- <up-cell title="简介" isLink @click="editField('intro')">
+ <up-cell title="简介" isLink @click="editField('简介')">
<template #value>
- <view class="cell-value">{{ form.intro }}</view>
+ <view class="cell-value">{{ form.description }}</view>
</template>
</up-cell>
</up-cell-group>
@@ -35,27 +23,12 @@
<up-cell-group :border="false" :customStyle="cellGroupStyle">
<up-cell title="性别" isLink @click="selectGender">
<template #value>
- <view class="cell-value">{{ form.gender }}</view>
- </template>
- </up-cell>
- <up-cell title="生日" isLink @click="selectBirthday">
- <template #value>
- <view class="cell-value">{{ form.birthday }}</view>
+ <view class="cell-value">{{ form.gender || '未选择' }}</view>
</template>
</up-cell>
<up-cell title="地区" isLink @click="selectRegion">
<template #value>
- <view class="cell-value">{{ form.region }}</view>
- </template>
- </up-cell>
- <up-cell title="职业" isLink @click="selectJob">
- <template #value>
- <view class="cell-value">{{ form.job }}</view>
- </template>
- </up-cell>
- <up-cell title="学校" isLink @click="editField('school')">
- <template #value>
- <view class="cell-value">{{ form.school }}</view>
+ <view class="cell-value">{{ form.address }}</view>
</template>
</up-cell>
</up-cell-group>
@@ -67,60 +40,144 @@
</template>
<script setup lang="ts">
-import { ref } from 'vue';
+import { ref,onMounted } from 'vue';
import { useGlobal } from '@/composables/useGlobal'
+import { useUserStore } from '@/store/user'
const { $http, $message, $store } = useGlobal()
const cellGroupStyle = 'background-color: #ffffff; margin-bottom: 20rpx; border-radius: 16rpx;'
-
+const userStore = useUserStore()
const form = ref({
- avatar: 'https://cdn.uviewui.com/uview/album/1.jpg',
- nickname: '小红薯6786F040',
- xhsId: '95619601810',
- backgroundImg: 'https://smart-manager-new.tos-cn-beijing.volces.com/sms/avatar/avatar.png',
- intro: '介绍一下自己',
- gender: '女',
- birthday: '选择生日',
- region: '选择所在的地区',
- job: '选择职业',
- school: '选择学校'
+ id: '',
+ cover: '',
+ name: '',
+ description: '',
+ gender: '',
+ address: '',
});
-const onPreview = () => {
- $message.showToast('预览功能暂未实现');
-};
const onChangeAvatar = () => {
- $message.showToast('更换头像');
+ uni.chooseImage({
+ count: 1,
+ success: (res) => {
+ form.value.cover = res.tempFilePaths[0];
+ }
+ });
};
-const onChangeBackground = () => {
- $message.showToast('更换背景图');
-};
-
+// const editField = (field: string) => {
+// uni.showModal({
+// title: `编辑${field}`,
+// content: '',
+// placeholderText: `请输入${field}`,
+// editable: true,
+// success: (res) => {
+// if (res.confirm && res.content) {
+// form.value[field] = res.content;
+// }
+// },
+// });
+// };
const editField = (field: string) => {
- $message.showToast(`编辑字段: ${field}`);
+ // 创建字段映射关系
+ const fieldMap: Record<string, keyof typeof form.value> = {
+ '名称': 'name',
+ '简介': 'description'
+ };
+
+ const fieldName = fieldMap[field];
+ if (!fieldName) {
+ $message.showToast('不支持的字段');
+ return;
+ }
+
+ uni.showModal({
+ title: `编辑${field}`,
+ content: form.value[fieldName], // 显示当前值
+ placeholderText: `请输入${field}`,
+ editable: true,
+ success: (res) => {
+ if (res.confirm && res.content) {
+ form.value[fieldName] = res.content;
+ }
+ },
+ });
};
+
const selectGender = () => {
- $message.showToast('选择性别');
+ uni.showActionSheet({
+ itemList: ['男', '女'],
+ success: (res) => {
+ form.value.gender = res.tapIndex === 0 ? '男' : '女';
+ }
+ });
};
-const selectBirthday = () => {
- $message.showToast('选择生日');
-};
+
const selectRegion = () => {
- $message.showToast('选择地区');
+ uni.chooseLocation({
+ success: (res) => {
+ form.value.address = res.address;
+ }
+ });
};
-const selectJob = () => {
- $message.showToast('选择职业');
+
+const onSave = async () => {
+ try {
+ // 构造请求体，排除 id 字段
+ const updatedUserInfo = {
+ id: form.value.id,
+ cover: form.value.cover,
+ description: form.value.description,
+ name: form.value.name,
+ gender: form.value.gender,
+ address: form.value.address,
+ };
+ // 调用后端 API 更新用户信息
+ const {code, data} = await $http.request('post', '/api/customer/addOrUpdate', {
+ data: updatedUserInfo
+ });
+
+ if (code === 0) {
+ $message.showToast('资料已保存');
+
+ // 更新 store 中的用户信息
+ await userStore.getCurrentInfo();
+ } else {
+ $message.showToast('保存失败：' + (data?.msg || '未知错误'));
+ }
+ } catch (error) {
+ console.error('保存用户信息失败', error)
+ $message.showToast('保存用户信息失败')
+ }
};
-const onSave = () => {
- $message.showToast('资料已保存');
-};
+
+onMounted(async () => {
+ // 正确获取store实例
+ if (!userStore.userInfo) {
+ await userStore.getCurrentInfo();
+ }
+ const userInfo = userStore.userInfo?.customerDTO;
+ console.log("开始处理用户数据")
+ if (userInfo) {
+ form.value = {
+ id: userInfo.id,
+ cover: userInfo.cover || 'https://cdn.uviewui.com/uview/album/1.jpg',
+ name: userInfo.name || '影游四方',
+ description: userInfo.description || '介绍一下自己',
+ gender: userInfo.gender || '女',
+ address: userInfo.address || '选择所在的地区'
+ };
+ }
+
+})
+
+
</script>
<style lang="scss" scoped>
--
Gitblit v1.9.3