loading效果添加

src/views/exam/exam-plan-kj-hz-normal.vue

@@ -93,6 +93,7 @@
                   @click="exportYjData"
                   type="primary"
                   icon="md-document"
+                  :loading="exportYjDataLoading"
                   >导出阅卷数据</Button
                 >
               </FormItem>
@@ -389,6 +390,7 @@ export default {
           },
         },
       ],
+      exportYjDataLoading: false,
     };
   },
   methods: {
@@ -587,6 +589,8 @@ export default {
         });
         return false;
       }
+      if (this.exportYjDataLoading) return;
+      this.exportYjDataLoading = true;
       let url =
         baseUrl +
         "/system/kj/hz/owexport?examCode=" +
@@ -598,24 +602,30 @@ export default {
         url: url, // 请求地址
         data: {}, // 参数
         responseType: "blob", // 表明返回服务器返回的数据类型
-      }).then((res) => {
-        // 处理返回的文件流
-        let content = res.data;
-        let blob = new Blob([content]);
-        let fileName = "阅卷数据.zip";
-        if ("download" in document.createElement("a")) {
-          let elink = document.createElement("a");
-          elink.download = fileName;
-          elink.style.display = "none";
-          elink.href = URL.createObjectURL(blob);
-          document.body.appendChild(elink);
-          elink.click();
-          URL.revokeObjectURL(elink.href); // 释放URL 对象
-          document.body.removeChild(elink);
-        } else {
-          navigator.msSaveBlob(blob, fileName);
-        }
-      });
+        timeout: 30 * 60 * 1000,
+      })
+        .then((res) => {
+          this.exportYjDataLoading = false;
+          // 处理返回的文件流
+          let content = res.data;
+          let blob = new Blob([content]);
+          let fileName = "阅卷数据.zip";
+          if ("download" in document.createElement("a")) {
+            let elink = document.createElement("a");
+            elink.download = fileName;
+            elink.style.display = "none";
+            elink.href = URL.createObjectURL(blob);
+            document.body.appendChild(elink);
+            elink.click();
+            URL.revokeObjectURL(elink.href); // 释放URL 对象
+            document.body.removeChild(elink);
+          } else {
+            navigator.msSaveBlob(blob, fileName);
+          }
+        })
+        .catch(() => {
+          this.exportYjDataLoading = false;
+        });
     },
   },
   created() {

src/views/exam/exam-plan.vue

@@ -428,6 +428,7 @@ export default {
                     {
                       props: {
                         type: "text",
+                        loading: params.row.loading,
                       },
                       style: {
                         padding: "0 10px",
@@ -444,7 +445,7 @@ export default {
                         {
                           props: {
                             size: "22",
-                            type: "md-arrow-down",
+                            type: params.row.loading ? "" : "md-arrow-down",
                           },
                         },
                         ""
@@ -583,6 +584,8 @@ export default {
       });
     },
     toDownload(row) {
+      if (row.loading) return;
+      row.loading = true;
       axios
         .post(
           "/system/examPlan/exam_student_export",
@@ -592,8 +595,12 @@ export default {
           { responseType: "blob" }
         )
         .then((response) => {
+          row.loading = false;
           const filename = `${row.name}-考生数据.xlsx`;
           this.donwloadBlob(new Blob([response.data]), filename);
+        })
+        .catch(() => {
+          row.loading = false;
         });
     },
     donwloadBlob(data, filename) {
@@ -627,7 +634,11 @@ export default {
       axios.post("/system/examPlan/pageQuery", this.query).then((response) => {
         let data = response.data.data;
         if (data) {
-          this.list = data.content || [];
+          const list = data.content || [];
+          this.list = list.map((item) => {
+            item.loading = false;
+            return item;
+          });
           this.query.totalElements = data.totalElements;
           this.query.totalPages = data.totalPages;
           this.$refs.table.selectAll(false);