1.统计报表查询页面体验优化(个贷)

src/views/statistical/personal/departmentEfficiency.vue

@@ -23,7 +23,9 @@
                         :cell-style="{ 'text-align': 'center' }" style=" width: 100%; float: right;
                       border-left: 1px solid #ebeced;
                       border-right: 1px solid #ebeced;
-                      color: #333333; font-size: 14px;">
+                      color: #333333; font-size: 14px;"
+                      v-loading="loading"
+                      element-loading-text="报表查询中...">
                 <el-table-column label="评估目的" width="150">
                     <template slot-scope="{row}">
                         <span>{{ row.evaluateAim }}</span>
@@ -182,7 +184,7 @@
                     <el-button class="filter-item" round type="info" @click="exportPersonalEfficiencyDetailVO()">导出
                     </el-button>
                 </template>
-                <parentTable ref="table" :data="pageData.records" slot="table" style="width: 100%;" :isBoard=800
+                <parentTable ref="table" :data="pageData.records" v-loading="dialogLoading" element-loading-text="报表查询中..." slot="table" style="width: 100%;" :isBoard=800
                     class="tableFull">
                     <el-table-column label="项目编号" align="center">
                         <template slot-scope="{row}">
@@ -293,7 +295,7 @@ export default {
     data() {
         return {
             dialogVisible: false,
-            listLoading: false,
+            loading: false,
             // 时间
             selectDate: [],
             listQueryByDepartment: {
@@ -349,6 +351,7 @@ export default {
             exportStatus: true,
             depEfficiency: [],
             pageData: { records: [] },
+            dialogLoading: false
         }
     },
     created() {
@@ -394,6 +397,7 @@ export default {
             this.getPersonalDepEfficiencyVO();
         },
         getPersonalDepEfficiencyVO() {
+            this.loading = true;
             if (this.selectDate) {
                 this.listQueryByDepartment.startTime = this.selectDate[0] + ' 00:00:00';
                 this.listQueryByDepartment.endTime = this.selectDate[1] + ' 23:59:59';
@@ -407,6 +411,7 @@ export default {
                         this.exportStatus = true;
                     }
                 }
+                this.loading = false;
             })
         },
         exportPersonalDepEfficiencyVO() {
@@ -427,10 +432,12 @@ export default {
         },
         // 效率详情列表查询
         getPersonalEfficiencyDetailVO() {
+            this.dialogLoading = true;
             this.$api.statistical.getPersonalEfficiencyDetailVO(this.listQueryDetail).then(res => {
                 if (res.code === 200) {
                     this.pageData = res.data;
                 }
+                this.dialogLoading = false;
             })
         },
         // 效率详情列表查询导出

src/views/statistical/personal/evaluateEfficiency.vue

@@ -24,7 +24,9 @@
                         :header-row-style="{ color: '#333333', 'font-size': '14px' }" style=" width: 100%; float: right;
                       border-left: 1px solid #ebeced;
                       border-right: 1px solid #ebeced;
-                      color: #333333; font-size: 14px;">
+                      color: #333333; font-size: 14px;"
+                      v-loading="outwardLoading"
+                      element-loading-text="报表查询中...">
                         <el-table-column label="姓名">
                             <template slot-scope="{row}">
                                 <span>{{ row.userName }}</span>
@@ -69,7 +71,9 @@
                         :header-row-style="{ color: '#333333', 'font-size': '14px' }" style=" width: 100%; float: right;
                       border-left: 1px solid #ebeced;
                       border-right: 1px solid #ebeced;
-                      color: #333333; font-size: 14px;">
+                      color: #333333; font-size: 14px;"
+                      v-loading="inwardLoading"
+                      element-loading-text="报表查询中...">
                         <el-table-column label="姓名">
                             <template slot-scope="{row}">
                                 <span>{{ row.userName }}</span>
@@ -112,7 +116,7 @@
                     <el-button class="filter-item" round type="info" @click="exportPersonalEfficiencyDetailVO()">导出
                     </el-button>
                 </template>
-                <parentTable ref="table" :data="pageData.records" slot="table" style="width: 100%;" :isBoard=800
+                <parentTable ref="table" :data="pageData.records" v-loading="dialogLoading" element-loading-text="报表查询中..." slot="table" style="width: 100%;" :isBoard=800
                     class="tableFull">
                     <el-table-column label="项目编号" align="center">
                         <template slot-scope="{row}">
@@ -290,6 +294,9 @@ export default {
             outwardEfficiency: [],
             perEfficiency: [],
             pageData: { records: [] },
+            outwardLoading: false,
+            inwardLoading: false,
+            dialogLoading: false
         }
     },
     created() {
@@ -343,6 +350,7 @@ export default {
             this.getPersonalOutwardEfficiencyVO();
         },
         getPersonalOutwardEfficiencyVO() {
+            this.outwardLoading = true;
             if (this.selectDate1) {
                 this.listQueryByOutward.startTime = this.selectDate1[0] + ' 00:00:00';
                 this.listQueryByOutward.endTime = this.selectDate1[1] + ' 23:59:59';
@@ -356,6 +364,7 @@ export default {
                         this.exportStatus = true;
                     }
                 }
+                this.outwardLoading = false;
             })
         },
         exportPersonalOutwardEfficiencyVO() {
@@ -386,6 +395,7 @@ export default {
         },
         // 评估人员绩效扣分查询
         getPersonalInwardEfficiencyVO() {
+            this.inwardLoading = true;
             if (this.selectDate2) {
                 this.listQueryByInward.startTime = this.selectDate2[0] + ' 00:00:00';
                 this.listQueryByInward.endTime = this.selectDate2[1] + ' 23:59:59';
@@ -399,6 +409,7 @@ export default {
                         this.exportStatus = true;
                     }
                 }
+                this.inwardLoading = false;
             })
         },
         exportersonalInwardEfficiencyVO() {
@@ -429,10 +440,12 @@ export default {
         },
         // 效率详情列表查询
         getPersonalEfficiencyDetailVO() {
+            this.dialogLoading = true;
             this.$api.statistical.getPersonalEfficiencyDetailVO(this.listQueryDetail).then(res => {
                 if (res.code === 200) {
                     this.pageData = res.data;
                 }
+                this.dialogLoading = false;
             })
         },
         // 效率详情列表查询导出