diff --git a/src/components/BulkActionBar.vue b/src/components/BulkActionBar.vue
index 7ebf339..c431246 100644
--- a/src/components/BulkActionBar.vue
+++ b/src/components/BulkActionBar.vue
@@ -2,7 +2,8 @@
+ :class="[someEmailsSelected ? 'partial-check' : '']"
+ @click="bulkSelect" />
@@ -17,10 +18,18 @@
let allEmailsSelected = computed(() => numberSelected.value === numberEmails)
let someEmailsSelected = computed(() => {
return numberSelected.value > 0 && numberSelected.value < numberEmails
- })
+ })
+ let bulkSelect = function(){
+ if(allEmailsSelected.value) {
+ emailSelection.clear()
+ } else {
+ emailSelection.addMultiple(props.emails)
+ }
+ }
return {
allEmailsSelected,
- someEmailsSelected
+ someEmailsSelected,
+ bulkSelect
}
},
props: {
diff --git a/src/components/MailTable.vue b/src/components/MailTable.vue
index e935e2a..1a4da1d 100644
--- a/src/components/MailTable.vue
+++ b/src/components/MailTable.vue
@@ -8,7 +8,7 @@
+ :checked="emailSelection.emails.has(email)" />
|
{{email.from}} |
diff --git a/src/composables/use-email-selection.js b/src/composables/use-email-selection.js
index 8991155..c9bde45 100644
--- a/src/composables/use-email-selection.js
+++ b/src/composables/use-email-selection.js
@@ -10,10 +10,20 @@ export const useEmailSelection = function(){
emails.add(email)
}
}
+ let clear = () => {
+ emails.clear()
+ }
+ let addMultiple = (newEmails) => {
+ newEmails.forEach((email) => {
+ emails.add(email)
+ })
+ }
return {
emails,
- toggle
+ toggle,
+ clear,
+ addMultiple
}
}
|