tui

attendance-performance-manager-ui/admin/src/views/attendance/record/hik/list.vue

@@ -121,6 +121,12 @@
         </div>
       </div>
     </el-drawer>
+    <div class="mask" v-if="progress">
+      <el-progress
+        :stroke-width="26"
+        :percentage="percent"
+      ></el-progress>
+    </div>
   </div>
 </template>
 
@@ -220,25 +226,26 @@ export default {
     },
     /** 导出Excel */
     doExport() {
-      if(this.isExport==true) {
-        this.$message.info("考勤数据正在导出中，请勿重复点击！")
+      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;
       }
 
-      let that=this;
-
+      let that = this;
       this.$download(
         "/attendance/record/hik/exportExcel",
         {
@@ -247,10 +254,13 @@ export default {
         { type: "excel" }
       )
         .then(() => {
-          console.log("isExport222:",this.isExport)
-          that.isExport = false})
+          this.percent = 100;
+          this.progress = false;
+          that.isExport = false;
+        })
         .catch((error) => {
           this.isExport = false;
+          this.progress = false;
           this.$message.error(error.message);
         });
     },
@@ -273,7 +283,9 @@ export default {
   data() {
     return {
       showBtn: false,
-      isExport:false,
+      progress: false,
+      isExport: false,
+      percent: 0,
       upload: {
         headers: {
           Authorization: window.sessionStorage.getItem("token") || "",
@@ -373,6 +385,21 @@ export default {
 };
 </script>
 <style scoped lang="scss">
+.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;
+}
 .hisList {
   padding: 15px;
   .list {

attendance-performance-manager-ui/admin/src/views/attendance/record/list.vue

@@ -179,6 +179,12 @@
         <el-button @click="upload.open = false">取 消</el-button>
       </div>
     </el-dialog>
+    <div class="mask" v-if="progress">
+      <el-progress
+        :stroke-width="26"
+        :percentage="percent"
+      ></el-progress>
+    </div>
   </div>
 </template>
 
@@ -333,6 +339,7 @@ export default {
     /** 导出Excel */
     doExport() {
       this.isExport = true;
+      this.progress = true;
       let params = {};
       for (let value of this.config.search) {
         if (this.query[value.name]) {
@@ -342,6 +349,7 @@ export default {
       if (this.selection.length > 0) {
         params["idList"] = this.selection;
       }
+      this.percent = 70;
       if (this.checkList.length > 0) {
         params["properties"] = this.checkList;
       }
@@ -353,10 +361,14 @@ export default {
         { type: "excel" }
       )
         .then(() => {
+          this.percent = 100;
+          this.progress = false;
           this.isExport = false;
           this.checkList = [];
         })
         .catch((error) => {
+          this.progress = false;
+
           this.isExport = false;
           this.$message.error(error.message);
         });
@@ -407,6 +419,8 @@ export default {
   },
   data() {
     return {
+      progress: false,
+      percent: 0,
       upload: {
         // 是否显示弹出层（员工关怀信息导入）
         open: false,
@@ -578,6 +592,21 @@ export default {
 };
 </script>
 <style scoped lang="less">
+.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;
+}
 .totalNum {
   background: rgba(64, 158, 255, 0.2);
   padding: 15px;

attendance-performance-manager-ui/admin/src/views/staff/perform/summary/list.vue

@@ -13,6 +13,9 @@
     </LayoutTable>
 
     <dialog-show ref="dialogform" @ok="getData" />
+    <div class="mask" v-if="progress">
+      <el-progress :stroke-width="26" :percentage="percent"></el-progress>
+    </div>
   </div>
 </template>
 
@@ -31,6 +34,8 @@ export default {
   methods: {
     /** 导出Excel */
     doExport() {
+      this.progress = true;
+      this.percent = 75;
       this.isExport = true;
       this.$download(
         "/staff/perform/summary/exportExcel",
@@ -40,9 +45,14 @@ export default {
         },
         { type: "excel" }
       )
-        .then(() => (this.isExport = false))
+        .then(() => {
+          this.percent = 100;
+          this.progress = false;
+          this.isExport = false;
+        })
         .catch((error) => {
           this.isExport = false;
+          this.progress = false;
           this.$message.error(error.message);
         });
     },
@@ -62,6 +72,8 @@ export default {
   data() {
     return {
       isExport: false,
+      progress: false,
+      percent: 0,
       config: {
         isshowTabPane: true,
         search: [
@@ -167,3 +179,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>