提交异常处理添加导出

src/views/attendance/record/error/list.vue

@@ -9,6 +9,16 @@
         @click="morehandle"
         >批量处理</el-button
       >
+      <el-button
+        slot="table-head-left2"
+        style="margin-left: 10px"
+        icon="el-icon-tickets"
+        size="mini"
+        type="primary"
+        @click="doExport"
+        :disabled="isExport"
+        >导出</el-button
+      >
     </LayoutTable>
     <drawer-show ref="drawerShow" @ok="getData" />
     <!-- 撤销提示 -->
@@ -21,6 +31,9 @@
         <el-button type="primary" @click="resetError">确定</el-button>
       </div>
     </el-dialog>
+    <div class="mask" v-if="progress">
+      <el-progress :stroke-width="26" :percentage="percent"></el-progress>
+    </div>
   </div>
 </template>
 
@@ -36,6 +49,46 @@ export default {
   mixins: [table],
   created() {},
   methods: {
+    /** 导出Excel */
+    doExport() {
+      if (this.isExport == true) {
+        this.$message.info("数据正在导出中，请勿重复点击！");
+        return false;
+      }
+
+      this.isExport = true;
+      this.progress = true;
+      let params = {};
+      for (let value of this.config.search) {
+        if (this.query[value.name]) {
+          params[value.name] = this.query[value.name];
+        }
+      }
+      this.percent = 75;
+
+      if (this.selection.length > 0) {
+        params["idList"] = this.selection;
+      }
+      console.log();
+      let that = this;
+      this.$download(
+        "/attendance/record/error/exportExcel",
+        {
+          ...params,
+        },
+        { type: "excel" }
+      )
+        .then(() => {
+          this.percent = 100;
+          this.progress = false;
+          that.isExport = false;
+        })
+        .catch((error) => {
+          this.isExport = false;
+          this.progress = false;
+          this.$message.error(error.message);
+        });
+    },
     /** 重写新增方法 */
     // toAdd(row) {
     //     this.$refs.dialogform.add(row);
@@ -89,6 +142,9 @@ export default {
   },
   data() {
     return {
+      percent: 0,
+      isExport: false,
+      progress: false,
       config: {
         isshowTabPane: true,
         search: [
@@ -250,3 +306,20 @@ export default {
   },
 };
 </script>
+<style lang="less" scoped>
+.mask {
+  width: 100%;
+  height: 100vh;
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 99;
+  padding: 0 30%;
+  padding-top: 20%;
+  background: rgba(0, 0, 0, 0.6);
+}
+::v-deep .el-progress__text {
+  color: #409eff;
+  font-weight: 600;
+}
+</style>

src/views/attendance/record/list.vue

@@ -525,6 +525,7 @@ export default {
   },
   data() {
     return {
+      isExport: false,
       // 动态新增列表
       addColumn: [],
       progress: false,