优化裁剪上传

src/components/Cropper/src/CropperModal.vue

@@ -207,17 +207,26 @@
       let scaleX = 1;
       let scaleY = 1;
 
+      /**
+       * 定义模态
+       */
       const [modalRegister, { openModal, closeModal, setSubLoading }] = useModal({
         title: props.title,
         width: 800,
       });
 
+      /**
+       * 显示弹窗
+       */
       function showModal() {
         openModal();
       }
-      function handleHttpUpload(){
-      }
-      // 上传图片
+      function handleHttpUpload() {}
+
+      /**
+       * 上传图片
+       * @param file 文件
+       */
       function beforeUpload(file) {
         const reader = new FileReader();
         reader.readAsDataURL(file);
@@ -248,21 +257,25 @@
         cropper?.value?.[event]?.(arg);
       }
 
+      /**
+       * 执行上传
+       */
       async function handleOk() {
         if (!src.value) {
           setSubLoading(false);
           return ElMessage.error('请先上传图片');
         }
         const uploadApi = props.uploadApi;
-        const name = props.name
+        const name = props.name;
         const file = base64ToFile(previewSource.value, filename);
-        //接口上传
+        // 文件上传
         if (uploadApi && isFunction(uploadApi)) {
+          // 本地接口上传
           try {
             setSubLoading(true);
-            const formData = new FormData()
-            formData.append('file',file)
-            formData.append('name',name)
+            const formData = new FormData();
+            formData.append('file', file);
+            formData.append('name', name);
             const result = await uploadApi(formData);
             emit('uploadSuccess', result);
             closeModal();
@@ -270,10 +283,15 @@
             setSubLoading(false);
           }
         } else {
-          //oss上传
-          actionFiles(file)
+          // OSS上传
+          actionFiles(file);
         }
       }
+
+      /**
+       * 上传阿里云OSS
+       * @param fileChild 参数
+       */
       const actionFiles = async (fileChild) => {
         const configData = await getOssConfig();
         let date = new Date();
@@ -329,9 +347,13 @@
           setSubLoading(false);
         }
       };
+
+      /**
+       * 执行关闭
+       */
       function handleClose() {
-        src.value =''
-        previewSource.value=''
+        src.value = '';
+        previewSource.value = '';
       }
 
       return {
@@ -346,7 +368,7 @@
         handleReady,
         handlerToolbar,
         handleOk,
-        handleClose
+        handleClose,
       };
     },
   });

src/views/system/user/edit.vue

@@ -157,7 +157,8 @@
           class="flex-1"
           :rules="[
             { required: true, message: '请输入手机号码', trigger: 'blur' },
-            { validator: rule.validatePhone, trigger: 'blur' }]"
+            { validator: rule.validatePhone, trigger: 'blur' },
+          ]"
         >
           <el-input v-model="formData.mobile" placeholder="请输入手机号码" clearable />
         </el-form-item>