添加隐藏空数据功能

back/src/views/modules/abilityStatistics/index.vue

@@ -140,9 +140,12 @@
            <span v-if='this.choseId===0' :class="[departmentId===4?'departmentStyle':'']"  @click="handleChose(4)">
                 能力使用明细
             </span> -->
-            <span v-if="detailFlag" class="detail-button" @click="goToDetail()">
+            <template v-if="detailFlag">
+              <el-checkbox v-model="checked" @change='chagneCheckbox' style="position: absolute;right: 150px;margin-top: -15px;">隐藏空数据</el-checkbox>
+              <span class="detail-button" @click="goToDetail()">
                 明细
               </span>
+            </template>
             <span v-else class="detail-button" @click="goToBack()"> 返回 </span>
           </div>
           <div class="line-style"></div>
@@ -287,6 +290,7 @@ import AbilityDetail from './components/abilityDetails'
 import applicationResources from './applicationResources.vue'
 import ComponentUsed from './componentUsed.vue'
 import qs from 'qs'
+import Template from '../devtools/template.vue'
 // import { mapState } from 'vuex'
 // const props = defineProps({
 //   processDefinitionName: { type: String, default: null },
@@ -297,9 +301,10 @@ import qs from 'qs'
 //   showType: { type: String, default: null },
 // })
 export default {
-  components: { componentServices, applicationResources, ComponentUsed, AbilityDetail },
+  components: { componentServices, applicationResources, ComponentUsed, AbilityDetail, Template },
   data () {
     return {
+      checked: false,
       departmentSelects: [],
       exportExcel: CONFIGITEM.configData[CONFIGITEM.version].apiURL + '/census/center/export',
       exportExcelCondition: '',
@@ -391,6 +396,7 @@ export default {
         { name: '会议室', value: 6 }
       ],
       tableData: [],
+      tableDataClone: [],
       tableData2: [
         {
           approveStatus: '',
@@ -456,6 +462,15 @@ export default {
     // ...mapState(['departmentSelects'])
   },
   methods: {
+    chagneCheckbox () {
+      if (this.checked) {
+        this.tableData = this.tableDataClone.filter(val => val.count !== 0)
+        this.total = this.tableData.length
+      } else {
+        this.tableData = this.tableDataClone
+        this.total = this.tableData.length
+      }
+    },
     closeModal () {
       this.detailsVisible = false
     },
@@ -550,6 +565,7 @@ export default {
               parseInt(result[i].hys)
           }
           this.tableData = res.data.data
+          this.tableDataClone = res.data.data
           this.total = res.data.data.total
           this.exportExcelCondition = qs.stringify({
             approveStatus: this.status,
@@ -614,6 +630,7 @@ export default {
               parseInt(result[i].hys)
           }
           this.tableData = res.data.data
+          this.tableDataClone = res.data.data
           this.total = res.data.data.total
           this.exportExcelCondition = qs.stringify({
             approveStatus: this.status,
@@ -694,6 +711,7 @@ export default {
         .then((res) => {
           console.log('111111', this.tableData, res.data.data)
           this.tableData = res.data.data
+          this.tableDataClone = res.data.data
           this.total = res.data.data.total
           this.exportExcelCondition = qs.stringify({
             approveStatus: this.status,
@@ -731,6 +749,7 @@ export default {
         })
         .then((res) => {
           this.tableData = res.data.data
+          this.tableDataClone = res.data.data
           this.total = res.data.data.total
           this.exportExcelCondition = qs.stringify({
             approveStatus: this.status,
@@ -838,6 +857,7 @@ export default {
     //   },
     // 选择发布or使用表格
     handleChose (index) {
+      this.checked = false
       this.departmentId = index
       if (index === 1) {
         if (this.choseId === 0) {
@@ -910,6 +930,7 @@ export default {
     },
     // 返回按钮
     goToBack () {
+      this.checked = false
       // departmentId 1，3  2，4 两个值共同判断
       this.detailFlag = !this.detailFlag
       if (this.departmentId === 3) {