文件上传

ah-jjzhgd-web/src/views/basic/project/index.vue

@@ -216,6 +216,7 @@
             :limit="imageUploadLimit"
             :file-list="imageList"
             :on-change="handleImageChange"
+            :accept="'image/jpeg, image/png, image/jpg'"
           >
             <i slot="default" class="el-icon-plus" />
             <div slot="file" slot-scope="{file}">
@@ -244,6 +245,7 @@
             :file-list="imageList2"
             :limit="imageUploadLimit2"
             :on-change="handleImageChange2"
+            :accept="'image/jpeg, image/png, image/jpg'"
           >
             <i slot="default" class="el-icon-plus" />
             <div slot="file" slot-scope="{file}">

ah-jjzhgd-web/src/views/man-car/staff/index.vue

@@ -140,6 +140,9 @@
             :limit="imageUploadLimit"
             :file-list="imageList"
             :on-change="handleImageChange"
+            :before-upload="beforeAvatarUpload"
+            :accept="'image/jpeg, image/png, image/jpg'"
+            :on-exceed="handleExceed"
           >
             <i slot="default" class="el-icon-plus" />
             <div slot="file" slot-scope="{file}">
@@ -156,6 +159,7 @@
                 </span>
               </span>
             </div>
+            <div style="color:red" slot="tip" class="el-upload__tip">最多上传1张图片，且只能是JPG/PNG/JPEG格式</div>
           </el-upload>
         </el-form-item>
       </el-form>
@@ -299,6 +303,9 @@ export default {
     this.getHelmetSelect()
   },
   methods: {
+    handleExceed(files, fileList) {
+      this.$message.error(`最多只能上传 1 张图片`);
+    },
     getHelmetSelect() {
       getHelmetList().then(res => {
         this.options = res.data.map(item => {
@@ -489,6 +496,18 @@ export default {
       this.imageList = fileList
       this.handleValidateField('dataForm', 'imageList')
     },
+    beforeAvatarUpload(file){
+      const isJPG = file.type === 'image/jpeg';
+        const isLt2M = file.size / 1024 / 1024 < 2;
+
+        if (!isJPG) {
+          this.$message.error('上传头像图片只能是 JPG 格式!');
+        }
+        if (!isLt2M) {
+          this.$message.error('上传头像图片大小不能超过 2MB!');
+        }
+        return isJPG && isLt2M;
+    },
     handleRemoveImageItem(file) {
       if (!file?.hasOwnProperty('raw')) {
         this.delFiles.push(file.name)