导入

src/api/system/file/index.js

@@ -82,3 +82,21 @@ export async function getFileList (data) {
   }
   return Promise.reject(new Error(res.data.message));
 }
+/**
+ * 导入文件 批量
+ * @param file 文件
+ */
+ export async function importBatch (data) {
+  const formData = new FormData();
+  data.multiPartFiles.forEach((item, index) => {
+    formData.append(`multiPartFiles`, item);
+  });
+  const res = await request.post(
+    `/qms/file/importBatch`,
+    formData
+  );
+  if (res.data.code === '0') {
+    return res.data;
+  }
+  return Promise.reject(new Error(res.data.message));
+}

src/components/upload/import-dialog.vue

@@ -0,0 +1,120 @@
+<template>
+  <!-- 上传 -->
+  <el-dialog title="导入文件上传" :visible.sync="dialogVisible" width="40%">
+    <el-form label-width="110px" class="zw-criterion">
+      <el-form-item label="选择文件">
+        <el-upload
+          class="avatar-uploader"
+          action="#"
+          :show-file-list="false"
+          :http-request="handlSuccess"
+          :before-upload="beforeUpload"
+        >
+          <el-button icon="el-icon-plus" size="small" type="primary"
+            >文件上传</el-button
+          >
+          <div slot="tip" class="el-upload__tip"
+            >只能上传excel文件，或批量上传打包成zip、rar压缩文件，单文件不超过10mb</div
+          >
+        </el-upload>
+      </el-form-item>
+      <el-form-item label="上传列表">
+        <div class="imgs-box">
+          <p v-for="(item, index) in attaments" :key="index" class="imgs-p">
+            <span> {{ item.name }}</span>
+            <el-link @click="delFileList(index)" type="primary">删除</el-link>
+          </p>
+        </div>
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button size="small" @click="dialogVisible = false">关 闭</el-button>
+      <el-button size="small" @click="upload" type="primary">上 传</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+  import { importBatch } from '@/api/system/file/index.js';
+
+  export default {
+    props: {
+      // eslint-disable-next-line vue/require-prop-type-constructor
+      defModule: ''
+    },
+    //注册组件
+    data() {
+      return {
+        showViewer: false, // 显示查看器
+        dialogVisible: false,
+        uploadShow: false,
+        module: '',
+        attaments: [], //上传文件
+        file: ''
+      };
+    },
+    created() {},
+    methods: {
+      open() {
+        this.attaments = [];
+        this.module = '';
+        this.dialogVisible = true;
+      },
+      //删除附件
+      delFileList(index) {
+        this.attaments.splice(index, 1);
+      },
+      //上传限制
+      beforeUpload(file) {
+        const isLt10M = file.size / 1024 / 1024 < 10;
+        if (!isLt10M) {
+          this.$message.error('导入单文件大小不能超过 10MB!');
+        }
+        return isLt10M;
+      },
+      //图片上传
+      handlSuccess(param) {
+        this.file = param.file;
+        this.attaments.push(param.file);
+      },
+      // 文件上传
+      async upload() {
+        if (this.attaments.length == 0) {
+          return this.$message.warning('文件不能为空！');
+        }
+        this.module = this.$props.defModule;
+
+        await importBatch({
+          module: this.module,
+          multiPartFiles: this.attaments
+        });
+        this.$message.success('操作成功！');
+        this.dialogVisible = false;
+        this.$emit('success');
+      }
+    }
+  };
+</script>
+
+<style lang="scss">
+  .zw-table-header {
+    float: right;
+  }
+
+  .imgs-box .imgs-p {
+    height: 30px;
+    background: #f0f3f3;
+    line-height: 30px;
+    width: 372px;
+    margin-bottom: 5px;
+    padding: 0 10px;
+    display: flex;
+    justify-content: space-between;
+  }
+  .zw-criterion-normal {
+    padding: 20px 0 0 0;
+  }
+  .el-main {
+    overflow: hidden;
+  }
+</style>

src/views/inspectionProject/index.vue

@@ -14,6 +14,8 @@
           >
             添加
           </el-button>
+          <el-button type="primary" size="mini" icon="el-icon-upload2" plain @click="uploadFile">导入</el-button>
+
         </template>
 
         <!-- 操作列 -->
@@ -41,6 +43,8 @@
       </ele-pro-table>
     </el-card>
     <edit ref="edit" @done="done"></edit>
+    <importDialog :defModule="moudleName" ref="importDialogRef" @success="reload" />
+
   </div>
 </template>
 <script>
@@ -48,11 +52,13 @@ import search from './components/search.vue';
 import edit from './components/edit.vue';
 import { getList, removeItem } from '@/api/inspectionProject';
 import dictMixins from '@/mixins/dictMixins';
+import importDialog from "@/components/upload/import-dialog.vue";
+
 export default {
   mixins: [dictMixins],
   components: {
     search,
-    edit
+    edit,importDialog
   },
   data() {
     return {
@@ -148,6 +154,9 @@ export default {
         })
         .catch((e) => {});
     },
+    uploadFile () {
+      this.$refs.importDialogRef.open();
+    },
     done() {
       this.$refs.search.search();
     }