福利人员添加导入

src/views/modules/plugins/change/changewelfare.vue

@@ -56,9 +56,37 @@
 <!--        <div class="resi-row-btn">-->
 <!--          <el-button type="warning" size="small" class="diy-button&#45;&#45;add" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>-->
 <!--        </div>-->
+          <div class="exportBtn">
         <div class="resi-row-btn">
-          <el-button type="warning" size="small" class="diy-button--reset" @click="exportHandle()">{{ $t('export') }}</el-button>
+            <el-button style="margin-left: 10px"
+                       class="diy-button--export"
+                       size="small"
+                       @click="handleExportModule()">下载模板</el-button>
+            <el-upload :headers="$getElUploadHeaders()"
+                       style=""
+                       ref="upload"
+                       :multiple="false"
+                       :show-file-list="false"
+                       :before-upload="
+            (file) => {
+              beforeUpload(file);
+            }
+          "
+                       action=""
+                       accept=".xls,.xlsx"
+                       :http-request="
+            () => {
+              uploadFile();
+            }
+          ">
+                <el-button style="margin-left: 10px"
+                           size="small"
+                           class="diy-button--delete">导入</el-button>
+            </el-upload>
+            <el-button type="warning" size="small" class="diy-button--reset" @click="exportHandle()">{{ $t('export') }}</el-button>
         </div>
+
+          </div>
       <el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%">
         <!--<el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>-->
         <el-table-column label="序号"
@@ -180,6 +208,108 @@ export default {
         }
     },
     methods: {
+        handleExportModule () {
+            let title = "福利人员模板";
+            let url = "/epmetuser/changeWelfare/exporttemplate";
+
+            let params = {};
+
+            app.ajax.exportFilePost(
+                url,
+                params,
+                (data, rspMsg) => {
+                    this.download(data, title + ".xls");
+                },
+                (rspMsg, data) => {
+                    this.$message.error(rspMsg);
+                }
+            );
+        },
+        // 下载文件
+        download (data, fileName) {
+            if (!data) {
+                return;
+            }
+
+            var csvData = new Blob([data]);
+
+            if (window.navigator && window.navigator.msSaveOrOpenBlob) {
+                window.navigator.msSaveOrOpenBlob(csvData, fileName);
+            }
+            // for Non-IE (chrome, firefox etc.)
+            else {
+                var a = document.createElement("a");
+                document.body.appendChild(a);
+                a.style = "display: none";
+                var url = window.URL.createObjectURL(csvData);
+                a.href = url;
+                a.download = fileName;
+                a.click();
+                a.remove();
+                window.URL.revokeObjectURL(url);
+            }
+        },
+        // 上传文件之前的钩子
+        beforeUpload (file) {
+            this.files = file;
+
+            const isText = file.type === "application/vnd.ms-excel";
+            const isTextComputer =
+                file.type ===
+                "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
+
+            if (!isText && !isTextComputer) {
+                this.$message.error("请选择正确格式的文件");
+                this.files = null;
+                this.fileName = "";
+                return false;
+            } else {
+                this.fileName = file.name;
+                return true;
+            }
+        },
+        async uploadFile () {
+            if (this.fileName == "") {
+                this.$message.warning("请选择要上传的文件！");
+                return false;
+            }
+
+            this.$message({
+                showClose: true,
+                message: "导入中，请到系统管理-导入记录中查看进度",
+                duration: 0,
+            });
+
+            //清空上传列表
+            this.$refs["upload"].clearFiles();
+            let url = "";
+
+            let fileFormData = new FormData();
+            fileFormData.append("file", this.files); //filename是键，file是值，就是要传的文件，test.zip是要传的文件名
+
+            url = "/epmetuser/changeWelfare/pointImport";
+
+            window.app.ajax.post2(
+                url,
+                fileFormData,
+                (data, rspMsg) => {
+                    if (data.code === 0 && data.msg == "success") {
+                        // this.$message.success('导入成功')
+                    } else {
+                        // this.$message({
+                        //   showClose: true,
+                        //   message: rspMsg,
+                        //   duration: 0,
+                        //   type: "error"
+                        // })
+                        // this.$message.error(rspMsg)
+                    }
+                    this.loadTable();
+                },
+                (rspMsg, data) => { },
+                { headers: { "Content-Type": "multipart/form-data" } }
+            );
+        },
       exportHandle () {
         const url = this.mixinViewModuleOptions.exportURL
         this.$http({
@@ -275,6 +405,11 @@ export default {
 <style lang="scss" scoped>
   @import "@/assets/scss/buttonstyle.scss";
 
+  .exportBtn {
+      display: flex;
+      align-items: center;
+  }
+
   .resi-container .resi-card-table {
     ::v-deep .el-table th {
       color: #fff;