Mobile working with new sort

ayanova/src/components/data-table.vue

@@ -178,9 +178,9 @@
           </template>
         </v-data-table>
       </template>
-      <!-- MOBILE TABLE VIEW about to be removed -->
+      <!-- MOBILE TABLE VIEW -->
       <template v-else>
-        <v-data-iterator
+        <v-data-table
           :headers="headers"
           :items="records"
           v-model="selected"
@@ -201,22 +201,7 @@
           class="elevation-1"
           data-cy="datatable"
         >
-          <template v-slot:header="props">
-            <!-- Mimic the full width data table select all toggle :no-data-text="$ay.t('NoData')"-->
-            <div
-              id="divSelectAll"
-              @click="props.toggleSelectAll(!props.everyItem)"
-              class="pl-2 pt-2"
-            >
-              <v-icon v-if="!props.someItems" large>$ayiSquare</v-icon>
-              <v-icon v-if="props.someItems && !props.everyItem" large
-                >$ayiMinus-square</v-icon
-              >
-              <v-icon v-if="props.everyItem" large>$ayiCheckSquare</v-icon>
-            </div>
-          </template>
-
-          <template v-slot:default="{ items }">
+          <template v-slot:body="{ items }">
             <v-row>
               <v-col
                 v-for="item in items"
@@ -358,7 +343,7 @@
               </v-col>
             </v-row>
           </template>
-        </v-data-iterator>
+        </v-data-table>
       </template>
     </v-card>
   </div>