添加校验

src/views/GARDENBASEDATA/index.vue

@@ -345,24 +345,25 @@
     </el-dialog>
 
     <!-- 导入 -->
-    <el-dialog title="企业数据导入" :visible.sync="isImport" :close-on-click-modal="false"  width="35%" append-to-body >
+    <el-dialog title="企业数据导入" :visible.sync="isImport" :close-on-click-modal="false" width="35%" append-to-body>
       <el-form :rules="importRules" :model="formParams" ref="formParams">
         <el-form-item label="保税区" label-width="100px" prop="deptId">
           <el-select v-model="formParams.deptId" placeholder="请选择保税区">
             <el-option v-for="item in bsqList" :key="item.value" :label="item.deptName" :value="item.deptId">
             </el-option>
           </el-select>
-        </el-form-item >
-        <el-form-item label="附件"  label-width="100px" prop="file">
-        <el-upload class="upload-demo"  ref="upload" :file-list="fileList" :limit="1"  :before-upload="uploadFile" drag :auto-upload="false" action="#" multiple>
-          <i class="el-icon-upload"></i>
-          <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
-          
-        </el-upload>
-      </el-form-item>
-      <el-form-item label="下载模板"  label-width="100px" >
-        <el-button  @click="downloadModul">下载模板</el-button>
-      </el-form-item>
+        </el-form-item>
+        <el-form-item label="附件" label-width="100px" prop="file">
+          <el-upload class="upload-demo" ref="upload" :on-change="fileChange" :file-list="fileList" :limit="1" :before-upload="uploadFile" drag
+            :auto-upload="false" action="#" multiple>
+            <i class="el-icon-upload"></i>
+            <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+
+          </el-upload>
+        </el-form-item>
+        <el-form-item label="下载模板" label-width="100px">
+          <el-button @click="downloadModul">下载模板</el-button>
+        </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitUpload">导 入</el-button>
@@ -594,7 +595,7 @@ export default {
           { required: true, message: "业务构成 不能为空", trigger: "blur" },
         ],
       },
-      importRules:{
+      importRules: {
         deptId: [
           { required: true, message: "保税区不能为空", trigger: "blur" },
         ],
@@ -630,13 +631,16 @@ export default {
 
   },
   methods: {
+    fileChange(file){
+      this.formParams.file.push(file) ;
+    },
     // 导入
     uploadFile(file) {
       let formData = new FormData();
       formData.append("file", file);
-      formData.append("deptId",this.formParams.deptId);
-      importGARDENBASEDATA(formData).then(res=>{
-        if(res.code == 200){
+      formData.append("deptId", this.formParams.deptId);
+      importGARDENBASEDATA(formData).then(res => {
+        if (res.code == 200) {
           this.$message.success("导入成功");
           this.isImport = false;
           this.getList();
@@ -644,7 +648,7 @@ export default {
       })
     },
     // 点击文件下载
-    downloadFile(file){
+    downloadFile(file) {
       let ip = process.env.VUE_APP_BASE_IP;
       let path = ip + file.name;
       let name = file.name;
@@ -655,11 +659,15 @@ export default {
     },
     // 确定上传附件
     submitUpload() {
-      this.$refs.upload.submit();
+      this.$refs.formParams.validate(valid => {
+        if (valid) {
+          this.$refs.upload.submit();
+        }
+      });
     },
     // 下载模板
-    downloadModul(){
-      fileDownloadFun().then(res=>{
+    downloadModul() {
+      fileDownloadFun().then(res => {
         let bolb = new Blob([res]);
         saveAs(bolb, "企业基础数据模板.xlsx");
       })
@@ -725,9 +733,9 @@ export default {
         aeoqk: null,
         jcfwwbwhfwcx: null,
       };
-      this.formParams={
-        file:[],
-        deptId:null,
+      this.formParams = {
+        file: [],
+        deptId: null,
       };
       this.resetForm("form");
       this.resetForm("forms");