From 9b54bf93656fae27343bbf5ea8bf5773f0e68c46 Mon Sep 17 00:00:00 2001
From: ramin <49345856+rmnkhd@users.noreply.github.com>
Date: Sun, 20 Aug 2023 14:34:39 +0330
Subject: [PATCH] feat: add go first and go last on VPagination

---
 src/components/data-table/VTable.vue      |  3 +-
 src/components/pagination/VPagination.vue | 49 ++++++++++++++++++-----
 2 files changed, 41 insertions(+), 11 deletions(-)

diff --git a/src/components/data-table/VTable.vue b/src/components/data-table/VTable.vue
index df02e73..a85cac1 100644
--- a/src/components/data-table/VTable.vue
+++ b/src/components/data-table/VTable.vue
@@ -8,6 +8,7 @@
         :model-value="page"
         @update:model-value="updatePage"
         :total="items.length"
+        :itemsPerPage="itemsPerPage"
     />
 </template>
 
@@ -65,9 +66,7 @@ export default {
 
         return {
             updatePage,
-
             paginatedItems,
-
             columns
         };
     }
diff --git a/src/components/pagination/VPagination.vue b/src/components/pagination/VPagination.vue
index 78a9a60..10d977e 100644
--- a/src/components/pagination/VPagination.vue
+++ b/src/components/pagination/VPagination.vue
@@ -1,9 +1,16 @@
 <template>
     <div class="input-group">
+        <button
+            class="btn text-secondary-dark align-items-center d-flex"
+            @click="goFirst"
+        >
+            go first
+        </button>
         <button
             class="btn btn-outline-primary"
             @click="goPrev"
-        >{{ $t('Previous') }}</button>
+        >{{ $t('Previous') }}
+        </button>
 
         <input
             :value="modelValue"
@@ -15,7 +22,14 @@
         <button
             class="btn btn-outline-primary"
             @click="goNext"
-        >{{ $t('Next') }}</button>
+        >{{ $t('Next') }}
+        </button>
+        <button
+            class="btn text-primary  align-items-center d-flex"
+            @click="goLast"
+        >
+            go last
+        </button>
     </div>
 </template>
 
@@ -31,6 +45,10 @@ export default {
         total: {
             type: Number,
             required: true
+        },
+        itemsPerPage: {
+            type: Number,
+            required: true
         }
     },
 
@@ -38,14 +56,17 @@ export default {
 
     setup(props, context) {
         function updateValue(value) {
-            if (value < 1) {
-                value = 1;
-            }
+            if (value > Math.floor(props.total / props.itemsPerPage)) {
+                value = Math.ceil(props.total / props.itemsPerPage)
+            } else {
+                if (value < 1) {
+                    value = 1;
+                }
 
-            if (value > props.total) {
-                value = props.total;
+                if (value > props.total) {
+                    value = props.total;
+                }
             }
-
             context.emit('update:modelValue', value);
         }
 
@@ -57,10 +78,20 @@ export default {
             updateValue(props.modelValue - 1);
         }
 
+        function goFirst() {
+            updateValue(props.modelValue - props.modelValue + 1);
+        }
+
+        function goLast() {
+            updateValue(Math.ceil(props.total / props.itemsPerPage));
+        }
+
         return {
             updateValue,
             goPrev,
-            goNext
+            goNext,
+            goFirst,
+            goLast
         };
     }
 }