diff --git a/src/components/PaginationComponent.vue b/src/components/PaginationComponent.vue
new file mode 100644
index 00000000..f400d95c
--- /dev/null
+++ b/src/components/PaginationComponent.vue
@@ -0,0 +1,25 @@
+<script setup lang="ts">
+const currentPage = defineModel<number>('currentPage', { default: 1 });
+const maxPage = defineModel<number>('maxPage', { default: 1 });
+
+withDefaults(
+  defineProps<{
+    fetchData?: (...args: unknown[]) => void;
+  }>(),
+  {},
+);
+</script>
+
+<template>
+  <q-pagination
+    claess="pagination"
+    v-model="currentPage"
+    :max="maxPage"
+    direction-links
+    active-color="primary"
+    gutter="sm"
+    @update:model-value="fetchData"
+  />
+</template>
+
+<style scoped></style>