cloudroam
10 天以前 05316275ee6f1623cc022a3cb4967a440c105a6b
add:编辑资料
已修改2个文件
196 ■■■■■ 文件已修改
sub-pages/mine/index.vue 9 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
sub-pages/mine/profile-edit.vue 187 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
sub-pages/mine/index.vue
@@ -46,8 +46,8 @@
            </view> -->
          </view>
          <view class="action-buttons">
<!--            <up-button text="编辑资料" size="mini" type="info" plain hairline @click="navigateTo('/sub-pages/mine/profile-edit')"-->
<!--              :custom-style="{ backgroundColor: 'transparent', borderColor: '#B1ABA9' }" />-->
            <up-button text="编辑资料" size="mini" type="info" plain hairline @click="navigateTo('/sub-pages/mine/profile-edit')"
              :custom-style="{ backgroundColor: 'transparent', borderColor: '#B1ABA9' }" />
<!--            <up-icon name="setting" size="40rpx" @click="navigateTo('/sub-pages/mine/settings')" />-->
          </view>
        </view>
@@ -168,7 +168,10 @@
onShow(() => {
  getLocation()
  if (userStore.hasLogin) {
    fetchList();
    // 强制刷新用户信息
    userStore.getCurrentInfo().then(() => {
      fetchList();
    });
  }else {
    // 用户未登录,清空列表
    likeList.value = [];
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>