优化代码

RuoYi

2024-06-28 6666ce5526b1ed17f5c3906c94620cad586745a5

 src/views/system/user/profile/userAvatar.vue

@@ -73,38 +73,45 @@


//图片裁剪数据

const options = reactive({

  img: userStore.avatar, // 裁剪图片的地址

  autoCrop: true, // 是否默认生成截图框

  autoCropWidth: 200, // 默认生成截图框宽度

  autoCropHeight: 200, // 默认生成截图框高度

  fixedBox: true, // 固定截图框大小 不允许改变

  outputType: "png", // 默认生成截图为PNG格式

  previews: {} //预览数据

  img: userStore.avatar,     // 裁剪图片的地址

  autoCrop: true,            // 是否默认生成截图框

  autoCropWidth: 200,        // 默认生成截图框宽度

  autoCropHeight: 200,       // 默认生成截图框高度

  fixedBox: true,            // 固定截图框大小 不允许改变

  outputType: "png",         // 默认生成截图为PNG格式

  filename: 'avatar',        // 文件名称

  previews: {}               //预览数据

});



/** 编辑头像 */

function editCropper() {

  open.value = true;

}



/** 打开弹出层结束时的回调 */

function modalOpened() {

  visible.value = true;

}



/** 覆盖默认上传行为 */

function requestUpload() {}



/** 向左旋转 */

function rotateLeft() {

  proxy.$refs.cropper.rotateLeft();

}



/** 向右旋转 */

function rotateRight() {

  proxy.$refs.cropper.rotateRight();

}



/** 图片缩放 */

function changeScale(num) {

  num = num || 1;

  proxy.$refs.cropper.changeScale(num);

}



/** 上传预处理 */

function beforeUpload(file) {

  if (file.type.indexOf("image/") == -1) {

@@ -114,14 +121,16 @@
    reader.readAsDataURL(file);

    reader.onload = () => {

      options.img = reader.result;

      options.filename = file.name;

    };

  }

}



/** 上传图片 */

function uploadImg() {

  proxy.$refs.cropper.getCropBlob(data => {

    let formData = new FormData();

    formData.append("avatarfile", data);

    formData.append("avatarfile", data, options.filename);

    uploadAvatar(formData).then(response => {

      open.value = false;

      options.img = import.meta.env.VITE_APP_BASE_API + response.imgUrl;

@@ -131,10 +140,12 @@
    });

  });

}



/** 实时预览 */

function realTime(data) {

  options.previews = data;

}



/** 关闭窗口 */

function closeDialog() {

  options.img = userStore.avatar;