primevue-mirror/components/lib/paginator/RowsPerPageDropdown.vue

41 lines
1.0 KiB
Vue
Raw Normal View History

2022-09-06 12:03:37 +00:00
<template>
2023-05-08 09:35:25 +00:00
<RPPDropdown :modelValue="rows" :options="rowsOptions" optionLabel="label" optionValue="value" @update:modelValue="onChange($event)" class="p-paginator-rpp-options" :disabled="disabled" :pt="ptm('RPPDropdown')"></RPPDropdown>
2022-09-06 12:03:37 +00:00
</template>
<script>
2023-05-08 09:35:25 +00:00
import BaseComponent from 'primevue/basecomponent';
2022-09-06 12:03:37 +00:00
import Dropdown from 'primevue/dropdown';
export default {
name: 'RowsPerPageDropdown',
2023-05-08 09:35:25 +00:00
extends: BaseComponent,
2022-09-06 12:03:37 +00:00
emits: ['rows-change'],
props: {
options: Array,
rows: Number,
disabled: Boolean
},
methods: {
onChange(value) {
this.$emit('rows-change', value);
}
},
computed: {
rowsOptions() {
let opts = [];
2022-09-14 11:26:01 +00:00
2022-09-06 12:03:37 +00:00
if (this.options) {
2022-09-14 11:26:01 +00:00
for (let i = 0; i < this.options.length; i++) {
opts.push({ label: String(this.options[i]), value: this.options[i] });
2022-09-06 12:03:37 +00:00
}
}
2022-09-14 11:26:01 +00:00
2022-09-06 12:03:37 +00:00
return opts;
}
},
components: {
2022-09-14 11:26:01 +00:00
RPPDropdown: Dropdown
2022-09-06 12:03:37 +00:00
}
2022-09-14 11:26:01 +00:00
};
2022-09-06 12:03:37 +00:00
</script>