罗广辉
2026-05-15 e3c2cd23253f3501be7d31e03955fbb6f4aa3556
src/subPackages/userDetail/infos/index.vue
@@ -1,6 +1,7 @@
<template>
   <view class="container">
      <div class="avatarBox">
         <u-avatar @click="uploadAvatar" :src="userInfo.avatar" size="114" mode="aspectFill" />
      </div>
      <view class="detailBox">
@@ -28,24 +29,28 @@
      </view>
      <view class="btngroup">
         <u-button color="#AEAEAE" class="custom-style" shape="circle" @click="reset">重置</u-button>
         <u-button color="#1D6FE9" class="custom-style" shape="circle" @click="submit">提交</u-button>
      <u-button
        :color="submitLoading ? '#AEAEAE' : '#1D6FE9'"
        class="custom-style"
        shape="circle"
        text="提交"
        :loading="submitLoading"
        loading-text="提交中"
        loading-mode="circle"
        :loading-size="13"
        @click="submit"
      />
      </view>
   </view>
</template>
<script setup>
   import {
      getEnvObj,
      getWebViewUrl
   } from "@/utils/index.js";
   import {
      getUserInfo,
      updateInfo,
      updatePassword
   } from '@/api/user/index.js';
   import {
      useUserStore
   } from "@/store/index.js";
import {getEnvObj} from "@/utils/index.js";
import {getUserInfo, updateInfo} from '@/api/user/index.js';
import {useUserStore} from "@/store/index.js";
import {ref} from "vue";
import {onShow} from "@dcloudio/uni-app";
   const userInfo = ref({
      id: '',
      avatar: '',
@@ -55,13 +60,14 @@
      email: '',
      deptName: '',
   });
const submitLoading = ref(false);
   // 校验手机号
   const validatePhone = () => {
      const phone = userInfo.value.phone
      if (!phone) return true
      const phoneRegex = /^1[3-9]\d{9}$/
      if (!phoneRegex.test(phone)) {
         uni.showToast({
            title: '请输入正确的手机号码',
            icon: 'none',
@@ -71,6 +77,7 @@
      }
      return true
   }
   // 校验邮箱
   const validateEmail = () => {
      if (!userInfo.value.email) return true
@@ -86,6 +93,7 @@
      }
      return true
   }
   const getUserInfoData = () => {
      getUserInfo().then(res => {
         const user = res.data.data;
@@ -109,16 +117,12 @@
      VITE_API_BASE_URL
   } = getEnvObj()
// 头像上传到服务器
   function uploadUtil(options) {
      const {
         formData,
         filePath,
         url
      } = options;
  const {formData, filePath, url} = options;
  uni.showLoading({title: '上传中...'})
      return new Promise((resolve, reject) => {
         let accessToken = useUserStore()?.$state?.userInfo?.access_token;
         uni.uploadFile({
            url: `${VITE_API_BASE_URL}${url}`,
            name: 'file',
@@ -132,42 +136,21 @@
               if (resData.code === 200 || resData.code === 0) {
                  resolve(res)
               } else {
                  showToast(resData.message)
          uni.showToast(resData.message)
                  reject(res)
               }
            },
            fail: (err) => {
               reject(err)
      },
      complete: () => {
        uni.hideLoading()
            }
         });
      })
   }
   const uploadAvatar = () => {
      uni.chooseImage({
         count: 1,
         success: (res) => {
            const tempFile = res.tempFiles[0]; // 获取文件对象
            const filePath = tempFile.path || tempFile.tempFilePath;
            if (!filePath) {
               uni.showToast({
                  title: '获取文件路径失败',
                  icon: 'none'
               });
               return;
            }
            let fileName = tempFile.name;
            if (!fileName) {
               const pathWithoutProtocol = filePath.replace(/^file:\/\//, '');
               fileName = pathWithoutProtocol.split('/').pop() || 'unknown.png';
            }
         
            // 显示加载中
            uni.showLoading({
               title: '上传中...'
            });
            // 上传文件
const handleUploadResult = (filePath, fileName) => {
            uploadUtil({
               filePath: filePath, 
               formData: {
@@ -180,36 +163,70 @@
               if (resData.code === 200 || resData.code === 0) {
                  // 更新头像显示
                  userInfo.value.avatar = resData.data.link || resData.data.url;
                  uni.hideLoading();
                  uni.showToast({
                     title: '头像上传成功',
                     icon: 'success'
                  });
      uni.showToast({title: '头像上传成功', icon: 'success'});
               } else {
                  throw new Error(resData.message || '上传失败');
               }
            }).catch(err => {
               uni.hideLoading();
               uni.showToast({
                  title: err.message || '上传失败',
                  icon: 'none'
    uni.showToast({title: err.message || '上传失败', icon: 'none'});
               });
            });
};
// 上传头像功能
const uploadAvatar = () => {
  // #ifdef MP-WEIXIN
  uni.chooseMedia({
    count: 1,
    mediaType: ['image'],
    sourceType: ['album', 'camera'],
    maxDuration: 30,
    camera: 'back',
    success(res) {
      const filePath = res.tempFiles[0].tempFilePath;
      handleUploadResult(filePath, filePath);
    }
  })
  // #endif
  // #ifndef MP-WEIXIN
  uni.chooseImage({
    count: 1,
    success: (res) => {
      const tempFile = res.tempFiles[0]; // 获取文件对象
      const filePath = tempFile.path || tempFile.tempFilePath;
      if (!filePath) {
        uni.showToast({title: '获取文件路径失败', icon: 'none'});
        return;
      }
      let fileName = tempFile.name;
      if (!fileName) {
        const pathWithoutProtocol = filePath.replace(/^file:\/\//, '');
        fileName = pathWithoutProtocol.split('/').pop() || 'unknown.png';
      }
      // 上传文件
      handleUploadResult(filePath, fileName);
         }
      });
  // #endif
   }
   const submit = () => {
  if (submitLoading.value) return
      if (!validatePhone() || !validateEmail()) return
  submitLoading.value = true
      userInfo.value.name = userInfo.value.realName;
      updateInfo(userInfo.value).then(res => {
         if (res.data.code === 200) {
            uni.showToast({
               title: '修改信息成功',
               icon: 'none',
               duration: 2000
        duration: 1500
            });
               getUserInfoData()
      setTimeout(() => {
        uni.switchTab({
          url: '/pages/user/index'
        });
      }, 1500);
      return
         } else {
            uni.showToast({
@@ -219,9 +236,11 @@
            });
               getUserInfoData()
         }
    submitLoading.value = false
  }).catch(() => {
    getUserInfoData()
    submitLoading.value = false
      });
   };
   onShow(async () => {
      getUserInfoData()
@@ -236,6 +255,7 @@
      flex-direction: column;
      align-items: center;
   }
   .avatarBox {
      width: 228rpx;
      height: 228rpx;
@@ -300,6 +320,7 @@
      width: 276rpx;
      height: 76rpx;
   }
   :deep(.u-button){
      width: 276rpx !important;
      height: 76rpx !important;