【ID1000403】模式管理-添加模式，文件类型限制

flossom-ui/src/views/system/mode/index.vue

@@ -216,8 +216,9 @@
             list-type="picture-card"
             :on-preview="handlePreviewFile"
             :on-success="handleBannerFileSuccess"
-            :before-upload="beforeBannerUpload"
-            :on-remove="handleRemoveBanner">
+            :before-upload="limitImageFileType"
+            :on-remove="handleRemoveBanner"
+            accept=".jpeg,.jpg,.png,.svg">
             <i class="el-icon-plus"></i>
             <div slot="tip" class="el-upload__tip">只能上传jpg/png图片</div>
           </el-upload>
@@ -229,16 +230,16 @@
           <el-upload
             class="upload-demo"
             :action="upload.url"
-            :before-upload="limitUploadFileType"
+            :before-upload="limitVideFileType()"
             :on-preview="handlePreview"
             :on-remove="handleRemove"
             :on-success="handleFileSuccess"
             :headers="upload.headers"
             :file-list="fileList"
-            accept=".mp4,.avi,.mov,.wmv"
+            accept=".mp4,.avi,.mov,.rmvb,.rm,.flv,.3gp"
           >
             <el-button size="small" type="primary">点击上传</el-button>
-            <div slot="tip" class="el-upload__tip">只能上传视频文件(mp4，avi，mov，wmv格式)，且不超过50M</div>
+            <div slot="tip" class="el-upload__tip">只能上传视频文件，且不超过50M</div>
           </el-upload>
         </el-form-item>
         <el-form-item v-if="form.instrumentType == 2" label="弹出视频窗" prop="openSource"  label-width="100px">
@@ -725,19 +726,39 @@ export default {
     handlePreview(file) {
       console.log(file);
     },
-    limitUploadFileType(file) {
-      const type = ['video/mp4','video/avi','video/mov','video/rmvb','video/rm','video/flv','video/3gp']
-      const isVideo = type.includes(file.type)
+    limitImageFileType(file) {
+      const imageType = ['image/jpeg', 'image/jpg', 'image/png', 'image/svg']
+      let isVideo = imageType.includes(file.type)
+      // 检验文件格式
+      if (!isVideo) {
+        this.$message.error(`图片格式错误!`)
+        return false
+      }
+      // 校检文件大小
+      let fileSize = 5;
+      if (fileSize) {
+        let isLt = file.size / 1024 / 1024 < fileSize
+        if (!isLt) {
+          this.$message.error(`上传文件大小不能超过 ${fileSize} MB!`)
+          return false
+        }
+      }
+      return true;
+
+    },
+    limitVideFileType(file) {
+      const videoType = ['video/mp4','video/avi','video/mov','video/rmvb','video/rm','video/flv','video/3gp']
+      let isVideo = videoType.includes(file.type)
       // 检验文件格式
       if (!isVideo) {
         this.$message.error(`视频格式错误!`)
         return false
       }
       // 校检文件大小
-      const fileSize = 50;
-      const isLt = file.size / 1024 / 1024 < fileSize
+      let fileSize = 50;
+      let isLt = file.size / 1024 / 1024 < fileSize
       if (!isLt) {
-        this.$message.error(`上传文件大小不能超过 ${this.fileSize} MB!`)
+        this.$message.error(`上传文件大小不能超过 ${fileSize} MB!`)
         return false
       }
       return true
@@ -767,8 +788,6 @@ export default {
       this.dialogImageUrl = file.url;
       this.dialogVisible = true;
     },
-    beforeBannerUpload(){
-    },
     // 展示弹出弹窗
     showOpenSource(){
       this.openSourceOpen = true;