feat(VDataTableHeaders): add support for select all

vuetifyjs · Apr 28, 2024 · 1d206d5 · 1d206d5
1 parent 9c70f65
commit 1d206d5
Showing 1 changed file with 6 additions and 0 deletions.
diff --git a/packages/vuetify/src/components/VDataTable/VDataTableHeaders.tsx b/packages/vuetify/src/components/VDataTable/VDataTableHeaders.tsx
@@ -226,6 +226,10 @@ export const VDataTableHeaders = genericComponent<VDataTableHeadersSlots>()({
         return columns.value.filter(column => column?.sortable)
       })
 
+      const appendIcon = computed(() => {
+        return allSelected.value ? '$checkboxOn' : someSelected.value ? '$checkboxIndeterminate' : '$checkboxOff'
+      })
+
       return (
         <VDataTableColumn
           tag="th"
@@ -246,6 +250,8 @@ export const VDataTableHeaders = genericComponent<VDataTableHeadersSlots>()({
               multiple={ props.multiSort }
               variant="underlined"
               onClick:clear={ () => sortBy.value = [] }
+              appendIcon={ appendIcon.value }
+              onClick:append={ () => selectAll(!allSelected.value) }
             >
               {{
                 ...slots,