优化排队报表导出报错

portal-manager-ui/admin/src/App.vue

@@ -8,6 +8,10 @@
           </keep-alive> -->
       </a-config-provider>
     </a-spin>
+    <!-- 导出进度条 -->
+    <div class="export" v-if="progressFile.show">
+      <a-progress :percent="progressFile.percent" status="active" />
+    </div>
   </div>
 </template>
 
@@ -22,6 +26,10 @@ export default {
       loadingProps: {
         spinning: false,
       },
+      progressFile:{
+        show:false,
+        percent:1
+      }
     };
   },
   beforeCreate() {
@@ -62,4 +70,13 @@ export default {
   display: flex;
   // flex-direction: column;
 }
+.export{
+  position: fixed;
+  left: 50%;
+  top: 50%;
+  transform: translate(-50%);
+  z-index: 99;
+  width: 300px;
+  height: 150px;
+}
 </style>

portal-manager-ui/admin/src/views/dataAdmin/components/queueCall/queueRecord.vue

@@ -2,7 +2,7 @@
   <div class="queueRecord-Container">
     <div class="header_box">
       <div>
-        <a-button :loading="btnLoading" type="primary" class="addclass"  @click="handleExportTable">
+        <a-button :loading="btnLoading" type="primary" class="addclass" @click="handleExportTable">
           <span>{{ tableSelectedRows.length ? "导出" : "导出全部" }}</span>
         </a-button>
         <b>取号次数：<i>{{ tablePagination.total }}</i> 次</b>
@@ -27,7 +27,7 @@
           <a-input v-model="searchForm.flownum" placeholder="请输入排队编号搜索" @pressEnter="handleSearch">
             <a-icon slot="prefix" type="search" />
           </a-input>
-          <a-button type="primary" class="addclass"  @click="handleSearch">搜索</a-button>
+          <a-button type="primary" class="addclass" @click="handleSearch">搜索</a-button>
           <a-button @click="resetBtn">重置</a-button>
         </a-space>
       </span>
@@ -125,6 +125,8 @@ import {
   getWorkmananalyse,
 } from "@/api/dataAdmin";
 import { export2Excel } from "@/utils/js/exportExcel";
+import { loading } from "@jiaminghi/data-view";
+let ExcelDate = []
 export default {
   name: "PortalAdminVueQueueRecord",
   mixins: [table],
@@ -432,27 +434,76 @@ export default {
             }
           });
         });
-      } else {
-        data = this.$_.cloneDeep(
-          await this.getQueueDataArr({ page: 1, size: -1 })
+
+        export2Excel(
+          this.tHeader,
+          this.filterVal,
+          data,
+          "排队记录报表" + this.$moment().format("YYYYMMDDHHmmss")
         );
-        if (!data.length) return;
-        for (let item of data) {
-          Object.keys(obj).forEach((key) => {
-            if (item.style == key) {
-              item.style = obj[key];
-            }
-          });
-        }
+        this.btnLoading = false;
+      } else {
+        ExcelDate = []
+        await this.dataSection(1, 1000, () => {
+          if (!ExcelDate.length) return;
+          for (let item of ExcelDate) {
+            Object.keys(obj).forEach((key) => {
+              if (item.style == key) {
+                item.style = obj[key];
+              }
+            });
+          }
+          export2Excel(
+            this.tHeader,
+            this.filterVal,
+            ExcelDate,
+            "排队记录报表" + this.$moment().format("YYYYMMDDHHmmss")
+          );
+          this.btnLoading = false;
+          // alert(11)
+        })
+        // return
+        // data = this.$_.cloneDeep(
+        //   await this.getQueueDataArr({ page: 1, size: -1 })
+        // );
+        // if (!data.length) return;
+        // for (let item of data) {
+        //   Object.keys(obj).forEach((key) => {
+        //     if (item.style == key) {
+        //       item.style = obj[key];
+        //     }
+        //   });
+        // }
       }
-      export2Excel(
-        this.tHeader,
-        this.filterVal,
-        data,
-        "排队记录报表" + this.$moment().format("YYYYMMDDHHmmss")
-      );
-      this.btnLoading = false;
+
+
     },
+    // 数据切片
+    async dataSection(page, size = 100, fn) {
+      let res = await getQueueData({
+        page: page || 1,
+        size: size,
+        ...this.searchForm,
+      });
+      if (res.code == 1) {
+        let { data, total } = res.data;
+        ExcelDate = ExcelDate.concat(data || [])
+        // app.vue loading
+        this.$app.progressFile.show = true
+        this.$app.progressFile.percent = parseInt((ExcelDate.length / total) * 100)
+
+        if (ExcelDate.length >= total || data.length == 0) {
+          fn()
+          this.$app.progressFile.show = false
+          this.$app.progressFile.percent = 1
+          return
+        }
+        setTimeout(() => {
+          let index = parseInt(page || 1) + 1
+          this.dataSection(index, size, fn)
+        });
+      }
+    }
   },
 };
 </script>