listelere ve tablar ileri-geri gidildiğinde kaldığı yere dönüyor.

src/components/global/DataTablePagination.vue

@@ -29,10 +29,13 @@
   </div>
 </template>
 <script setup lang="ts">
-  import { ref, computed } from 'vue'
+  import { ref, onBeforeMount, watch } from 'vue'
   import type { Ref } from 'vue'
   import { useGlobalStore } from '@/stores/globalStore'
   import { useValidationStore } from '@/stores/validationStore'
+  import { useRouter, useRoute } from 'vue-router'
+  const router = useRouter()
+  const route = useRoute()
 
   const globalStore = useGlobalStore()
   const validationStore = useValidationStore()
@@ -45,9 +48,11 @@
 
   export interface Props {
     pagination: IPagination
+    isUseRoute?: boolean
   }
 
   const props = withDefaults(defineProps<Props>(), {
+    isUseRoute: false
   })
 
   const emit = defineEmits(['update:pagination'])
@@ -66,6 +71,14 @@
       if (Number(pageNumber.value) < totalPage()) pageNumber.value++
     }
     localPagination.value.pageNumber = pageNumber.value
+    if (props.isUseRoute) {
+      router.push({
+        query: {
+          ...route.query,
+          pageNumber: pageNumber.value
+        }
+      })
+    }
     emit('update:pagination', localPagination.value)
   }
 
@@ -76,7 +89,7 @@
       (e.target as HTMLInputElement).value = String(totalPage())
     pageNumber.value = Number((e.target as HTMLInputElement).value)
 
-    if((e as KeyboardEvent).key === 'Enter') getPage()
+    if ((e as KeyboardEvent).key === 'Enter') getPage()
   }
   const PageNumberFocus = (e: Event) => {
     ;(e.target as HTMLInputElement).select()
@@ -85,4 +98,22 @@
     localPagination.value.pageNumber = pageNumber.value
     emit('update:pagination', localPagination.value)
   }
+  const SetPageNumber = () => {
+    if (props.isUseRoute) {
+      if (route.query.pageNumber !== undefined && route.query.pageNumber !== '') {
+        localPagination.value.pageNumber = pageNumber.value = Number(
+          route.query.pageNumber
+        )
+      }
+    }
+  }
+  onBeforeMount(() => {
+    SetPageNumber()
+  })
+  watch(
+    () => route.query.pageNumber,
+    () => {
+      SetPageNumber()
+    }
+  )
 </script>