make sure to use filtered selected keys

This commit is contained in:
taehoon 2019-04-06 14:00:39 -04:00
parent ecff6acf2d
commit 10ecc2c816
2 changed files with 11 additions and 5 deletions

View file

@ -22,11 +22,17 @@ const SelectableList = {
}
},
computed: {
allKeys () {
return this.items.map(this.getKey)
},
filteredSelected () {
return this.allKeys.filter(key => this.selected.indexOf(key) !== -1)
},
allSelected () {
return !this.items.find(item => !this.isSelected(item))
return this.filteredSelected.length === this.items.length
},
noneSelected () {
return !this.items.find(item => this.isSelected(item))
return this.filteredSelected.length === 0
},
someSelected () {
return !this.allSelected && !this.noneSelected
@ -34,7 +40,7 @@ const SelectableList = {
},
methods: {
isSelected (item) {
return this.selected.indexOf(this.getKey(item)) !== -1
return this.filteredSelected.indexOf(this.getKey(item)) !== -1
},
toggle (checked, item) {
const key = this.getKey(item)
@ -49,7 +55,7 @@ const SelectableList = {
},
toggleAll (value) {
if (value) {
this.selected = this.items.map(this.getKey)
this.selected = this.allKeys.slice(0)
} else {
this.selected = []
}

View file

@ -5,7 +5,7 @@
<Checkbox :checked="allSelected" @change="toggleAll" :indeterminate="someSelected">{{ $t('selectable_list.select_all') }}</Checkbox>
</div>
<div class="selectable-list-header-actions">
<slot name="header" :selected="selected" />
<slot name="header" :selected="filteredSelected" />
</div>
</div>
<List :items="items" :getKey="getKey">