update 修改页面代码 去除ele的引入以及vue的类型声明

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

@@ -29,7 +29,9 @@
           <el-upload action="#" :http-request="requestUpload" :show-file-list="false" :before-upload="beforeUpload">
             <el-button>
               选择
-              <el-icon class="el-icon--right"><Upload /></el-icon>
+              <el-icon class="el-icon--right">
+                <Upload />
+              </el-icon>
             </el-button>
           </el-upload>
         </el-col>
@@ -58,18 +60,17 @@ import "vue-cropper/dist/index.css";
 import { VueCropper } from "vue-cropper";
 import { uploadAvatar } from "@/api/system/user";
 import useUserStore from "@/store/modules/user";
-import { ComponentInternalInstance } from "vue";
 
 interface Options {
-    img: string | ArrayBuffer | null // 裁剪图片的地址
-    autoCrop: boolean // 是否默认生成截图框
-    autoCropWidth: number // 默认生成截图框宽度
-    autoCropHeight: number // 默认生成截图框高度
-    fixedBox: boolean // 固定截图框大小 不允许改变
-    fileName: string
-    previews: any // 预览数据
-    outputType: string
-    visible: boolean
+  img: string | ArrayBuffer | null; // 裁剪图片的地址
+  autoCrop: boolean; // 是否默认生成截图框
+  autoCropWidth: number; // 默认生成截图框宽度
+  autoCropHeight: number; // 默认生成截图框高度
+  fixedBox: boolean; // 固定截图框大小 不允许改变
+  fileName: string;
+  previews: any; // 预览数据
+  outputType: string;
+  visible: boolean;
 }
 
 
@@ -83,75 +84,76 @@ const title = ref("修改头像");
 const cropper = ref<any>({});
 //图片裁剪数据
 const options = reactive<Options>({
-    img: userStore.avatar,
-    autoCrop: true,
-    autoCropWidth: 200,
-    autoCropHeight: 200,
-    fixedBox: true,
-    outputType: "png",
-    fileName: '',
-    previews: {},
-    visible: false
+  img: userStore.avatar,
+  autoCrop: true,
+  autoCropWidth: 200,
+  autoCropHeight: 200,
+  fixedBox: true,
+  outputType: "png",
+  fileName: "",
+  previews: {},
+  visible: false
 });
 
 /** 编辑头像 */
 const editCropper = () => {
-    open.value = true;
-}
+  open.value = true;
+};
 /** 打开弹出层结束时的回调 */
 const modalOpened = () => {
-    visible.value = true;
-}
+  visible.value = true;
+};
 /** 覆盖默认上传行为 */
-const requestUpload = (): any => {}
+const requestUpload = (): any => {
+};
 /** 向左旋转 */
 const rotateLeft = () => {
-    cropper.value.rotateLeft();
-}
+  cropper.value.rotateLeft();
+};
 /** 向右旋转 */
 const rotateRight = () => {
-    cropper.value.rotateRight();
-}
+  cropper.value.rotateRight();
+};
 /** 图片缩放 */
 const changeScale = (num: number) => {
-    num = num || 1;
-    cropper.value.changeScale(num);
-}
+  num = num || 1;
+  cropper.value.changeScale(num);
+};
 /** 上传预处理 */
 const beforeUpload = (file: any) => {
-    if (file.type.indexOf("image/") == -1) {
-        proxy?.$modal.msgError("文件格式错误，请上传图片类型,如：JPG，PNG后缀的文件。");
-    } else {
-        const reader = new FileReader();
-        reader.readAsDataURL(file);
-        reader.onload = () => {
-            options.img = reader.result;
-            options.fileName = file.name;
-        };
-    }
-}
+  if (file.type.indexOf("image/") == -1) {
+    proxy?.$modal.msgError("文件格式错误，请上传图片类型,如：JPG，PNG后缀的文件。");
+  } else {
+    const reader = new FileReader();
+    reader.readAsDataURL(file);
+    reader.onload = () => {
+      options.img = reader.result;
+      options.fileName = file.name;
+    };
+  }
+};
 /** 上传图片 */
 const uploadImg = async () => {
-    cropper.value.getCropBlob(async (data: any) => {
-        let formData = new FormData();
-        formData.append("avatarfile", data, options.fileName);
-        const res = await uploadAvatar(formData);
-        open.value = false;
-        options.img = res.data.imgUrl;
-        userStore.avatar = options.img as string;
-        proxy?.$modal.msgSuccess("修改成功");
-        visible.value = false;
-    });
-}
+  cropper.value.getCropBlob(async (data: any) => {
+    let formData = new FormData();
+    formData.append("avatarfile", data, options.fileName);
+    const res = await uploadAvatar(formData);
+    open.value = false;
+    options.img = res.data.imgUrl;
+    userStore.avatar = options.img as string
+    proxy?.$modal.msgSuccess("修改成功");
+    visible.value = false;
+  });
+};
 /** 实时预览 */
 const realTime = (data: any) => {
-    options.previews = data;
-}
+  options.previews = data;
+};
 /** 关闭窗口 */
 const closeDialog = () => {
-    options.img = userStore.avatar;
-    options.visible = false;
-}
+  options.img = userStore.avatar;
+  options.visible = false;
+};
 </script>
 
 <style lang="scss" scoped>