Files
sshecret/packages/sshecret-frontend/src/composables/usePagination.ts

47 lines
1.1 KiB
TypeScript

import { ref, computed } from 'vue'
import type { Ref } from 'vue'
export function usePagination(totalItems: number | Ref<number>, itemsPerPage = 20) {
const pageNum = ref(1)
const total = computed(() => {
return typeof totalItems === 'number' ? totalItems : totalItems.value
})
const offset = computed(() => (pageNum.value - 1) * itemsPerPage)
const firstResult = computed(() => (total.value === 0 ? 0 : offset.value + 1))
const lastResult = computed(() => {
const last = offset.value + itemsPerPage
return last > total.value ? total.value : last
})
const totalPages = computed(() => Math.ceil(total.value / itemsPerPage))
function goToPage(page: number) {
if (page < 1) pageNum.value = 1
else if (page > totalPages.value) pageNum.value = totalPages.value
else pageNum.value = page
}
function nextPage() {
goToPage(pageNum.value + 1)
}
function prevPage() {
goToPage(pageNum.value - 1)
}
return {
pageNum,
offset,
firstResult,
lastResult,
total,
totalPages,
goToPage,
nextPage,
prevPage,
}
}