ayanova/src/components/data-table.vue

@@ -1,7 +1,6 @@
 <template>
   <div>
     <gz-error :error-box-message="formState.errorBoxMessage"></gz-error>
-
     <gz-data-table-filter
       :data-list-key="dataListKey"
       :active-filter-id="activeFilterId"
@@ -113,6 +112,7 @@
           :no-data-text="$ay.t('NoData')"
           class="elevation-1"
           data-cy="datatable"
+          @toggle-select-all="selectAll"
         >
           <!-- HEADER FILTERS: https://stackoverflow.com/a/58718975/8939 -->
           <template v-for="h in headers" v-slot:[`header.${h.value}`]>
@@ -320,6 +320,7 @@
           class="elevation-1"
           data-cy="datatable"
           :no-data-text="$ay.t('NoData')"
+          @toggle-select-all="selectAll"
         >
           <template v-slot:body="{ items }">
             <v-row>
@@ -675,6 +676,7 @@ export default {
     async filter(item) {
       const res = await this.$refs.dataTableFilter.open(item);
       if (res && res.refresh == true) {
+        this.selected = []; //remove any selections
         //New filter, need to go back to the first page
         this.dataTablePagingOptions.page = 1;
         this.getDataFromApi();
@@ -688,6 +690,7 @@ export default {
       return clr;
     },
     async clearFilter(reloadData) {
+      this.selected = [];
       //Reset back to DEFAULT filter
       setActiveFilter(this); //will not trigger refresh yet
 
@@ -794,9 +797,14 @@ export default {
         )
       };
     },
+    selectAll(event) {
+      //deselect all, fixes an issue where a deep selection not visible is not cleared otherwise
+      if (event.value == false) {
+        this.selected = [];
+      }
+    },
     handleSelectChange() {
       //SINGLESELECT MODE?
-      //due to making own template for items need to handle singleselect which only affects if select all checkbox at top is visible when making own item template
       if (this.singleSelect) {
         this.selected.splice(0, this.selected.length - 1);
       }
@@ -817,6 +825,7 @@ export default {
       });
     },
     selectedFilterChanged: async function() {
+      this.selected = [];
       await this.getDataFromApi();
     },
     gridCellButtonClick(key, i, ot) {