diff --git a/src/components/mdTable/mdTablePagination.vue b/src/components/mdTable/mdTablePagination.vue index 1302c8c..205ba4f 100644 --- a/src/components/mdTable/mdTablePagination.vue +++ b/src/components/mdTable/mdTablePagination.vue @@ -6,13 +6,13 @@ {{ amount }} - {{ (currentSize - currentSize + 1) * currentPage }}-{{ currentSize }} {{ mdSeparator }} {{ mdTotal }} + {{ ((currentPage - 1) * currentSize) + 1 }}-{{ subTotal }} {{ mdSeparator }} {{ totalItems }} - + keyboard_arrow_left - + keyboard_arrow_right @@ -45,6 +45,7 @@ }, data() { return { + subTotal: 0, currentSize: parseInt(this.mdSize, 10), currentPage: parseInt(this.mdPage, 10), totalItems: !isNaN(this.mdTotal) && Number.MAX_SAFE_INTEGER @@ -58,6 +59,9 @@ methods: { emitPaginationEvent() { if (this.canFireEvents) { + const sub = this.currentPage * this.currentSize; + + this.subTotal = sub > this.mdTotal ? this.mdTotal : sub; this.$emit('pagination', { size: this.currentSize, page: this.currentPage @@ -70,8 +74,16 @@ this.emitPaginationEvent(); } }, - changePage() { + previousPage() { if (this.canFireEvents) { + this.currentPage--; + this.$emit('page', this.currentPage); + this.emitPaginationEvent(); + } + }, + nextPage() { + if (this.canFireEvents) { + this.currentPage++; this.$emit('page', this.currentPage); this.emitPaginationEvent(); } @@ -79,6 +91,7 @@ }, mounted() { this.$nextTick(() => { + this.subTotal = this.currentPage * this.currentSize; this.mdPageOptions = this.mdPageOptions || [10, 25, 50, 100]; this.currentSize = this.mdPageOptions[0]; this.canFireEvents = true;