feat:上传头像

张含笑

2025-10-25 9f168cc0d9c3f4991af1a06806554de9706a02e3

feat:上传头像

 src/subPackages/userDetail/infos/index.vue

@@ -1,7 +1,7 @@
<template>
    <view class="container">
        <div class="avatarBox">
            <u-avatar :src="userInfo.avatar" size="114" mode="aspectFill" />
            <u-avatar @click="uploadAvatar" :src="userInfo.avatar" size="114" mode="aspectFill" />
        </div>
        <view class="detailBox">
            <div class="orderRow">
@@ -32,11 +32,13 @@
</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";
    const userInfo = ref({
        id: '',
        avatar: '',
@@ -95,6 +97,78 @@
    const reset = () => {
        getUserInfoData();
    };

    const {VITE_API_BASE_URL} = getEnvObj()
    function uploadUtil(options) {
      const {formData, file, url} = options
	 
      return new Promise((resolve, reject) => {
        let accessToken = useUserStore()?.$state?.userInfo?.access_token;
	   
        uni.uploadFile({
          url: `${VITE_API_BASE_URL}${url}`,
          name: 'file',
          header: {'Blade-Auth': 'bearer ' + accessToken},
          file,
          formData,
          success: (res) => {
            const resData = JSON.parse(res.data)
            if (resData.code === 200 || resData.code === 0) {
              resolve(res)
            } else {
              showToast(resData.message)
			   
              reject(res)
            }
          },
          fail: (err) => {
            reject(err)
          }
        });
      })
    }
    const uploadAvatar = () => {
      uni.chooseImage({
        count: 1, 
        success: (res) => {
          const tempFilePaths = res.tempFiles[0];
          // 显示加载中
          uni.showLoading({
            title: '上传中...'
          });
	     
          // 上传文件
          uploadUtil({
            file: tempFilePaths,
            formData: {
              fileName: tempFilePaths.name, 
              sn: 'avatar_upload' 
            },
            url: '/blade-resource/oss/endpoint/put-file'
          }).then(res => {
            const resData = JSON.parse(res.data);
            if (resData.code === 200 || resData.code === 0) {
              // 更新头像显示
              userInfo.value.avatar = resData.data.link || resData.data.url;
              uni.hideLoading();
              uni.showToast({
                title: '头像上传成功',
                icon: 'success'
              });
            } else {
              throw new Error(resData.message || '上传失败');
			  
            }
          }).catch(err => {
            uni.hideLoading();
            uni.showToast({
              title: err.message || '上传失败',
              icon: 'none'
            });
          });
        }
      });
    }
    const submit = () => {
        if (!validatePhone() || !validateEmail()) return
        userInfo.value.name = userInfo.value.realName;