vertumnus/primevue-mirror
1
0
Fork 0
mirror of https://github.com/primefaces/primevue.git synced 2025-05-09 00:42:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

Components update v.3.21.0

Browse source
This commit is contained in:
Bahadır Sofuoğlu 2022-12-08 14:04:25 +03:00
parent 18497d55b1
commit defd6ff6e2
242 changed files with 28022 additions and 17523 deletions
Download patch file Download diff file Expand all files Collapse all files

26
components/dataviewlayoutoptions/DataViewLayoutOptions.vue
View file

@ -1,9 +1,9 @@
<template>
<div class="p-dataview-layout-options p-selectbutton p-buttonset">
<button :class="buttonListClass" @click="changeLayout('list')" type="button">
<div class="p-dataview-layout-options p-selectbutton p-buttonset" role="group">
<button :aria-label="listViewAriaLabel" :class="buttonListClass" @click="changeLayout('list')" type="button" :aria-pressed="isListButtonPressed">
<i class="pi pi-bars"></i>
</button>
<button :class="buttonGridClass" @click="changeLayout('grid')" type="button">
<button :aria-label="gridViewAriaLabel" :class="buttonGridClass" @click="changeLayout('grid')" type="button" :aria-pressed="isGridButtonPressed">
<i class="pi pi-th-large"></i>
</button>
</div>
@ -16,9 +16,23 @@ export default {
props: {
modelValue: String
},
data() {
return {
isListButtonPressed: false,
isGridButtonPressed: false
};
},
methods: {
changeLayout(layout) {
this.$emit('update:modelValue', layout);
if (layout === 'list') {
this.isListButtonPressed = true;
this.isGridButtonPressed = false;
} else if (layout === 'grid') {
this.isGridButtonPressed = true;
this.isListButtonPressed = false;
}
}
},
computed: {
@ -27,6 +41,12 @@ export default {
},
buttonGridClass() {
return ['p-button p-button-icon-only', { 'p-highlight': this.modelValue === 'grid' }];
},
listViewAriaLabel() {
return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.listView : undefined;
},
gridViewAriaLabel() {
return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.gridView : undefined;
}
}
};