관리자 페이지네이션 계산 테스트 추가
This commit is contained in:
@@ -1,4 +1,6 @@
|
||||
<script setup>
|
||||
import { buildAdminPaginationItems, clampAdminPage } from '~/lib/admin-pagination.js'
|
||||
|
||||
const props = defineProps({
|
||||
/** 현재 페이지 */
|
||||
page: {
|
||||
@@ -23,45 +25,10 @@ const emit = defineEmits(['update:page'])
|
||||
const totalPageCount = computed(() => Math.max(1, Number(props.pageCount) || 1))
|
||||
|
||||
/** @type {import('vue').ComputedRef<number>} */
|
||||
const currentPage = computed(() => Math.min(Math.max(Number(props.page) || 1, 1), totalPageCount.value))
|
||||
const currentPage = computed(() => clampAdminPage(props.page, totalPageCount.value))
|
||||
|
||||
/** @type {import('vue').ComputedRef<Array<number|string>>} */
|
||||
const paginationItems = computed(() => {
|
||||
const total = totalPageCount.value
|
||||
const current = currentPage.value
|
||||
|
||||
if (total <= 7) {
|
||||
return Array.from({ length: total }, (_, index) => index + 1)
|
||||
}
|
||||
|
||||
const pages = new Set([1, total, current - 1, current, current + 1])
|
||||
|
||||
if (current <= 4) {
|
||||
pages.add(2)
|
||||
pages.add(3)
|
||||
pages.add(4)
|
||||
pages.add(5)
|
||||
}
|
||||
|
||||
if (current >= total - 3) {
|
||||
pages.add(total - 4)
|
||||
pages.add(total - 3)
|
||||
pages.add(total - 2)
|
||||
pages.add(total - 1)
|
||||
}
|
||||
|
||||
const orderedPages = [...pages].filter((page) => page >= 1 && page <= total).sort((left, right) => left - right)
|
||||
return orderedPages.reduce((items, page, index) => {
|
||||
const previousPage = orderedPages[index - 1]
|
||||
|
||||
if (previousPage && page - previousPage > 1) {
|
||||
items.push(`ellipsis-${previousPage}-${page}`)
|
||||
}
|
||||
|
||||
items.push(page)
|
||||
return items
|
||||
}, [])
|
||||
})
|
||||
const paginationItems = computed(() => buildAdminPaginationItems(currentPage.value, totalPageCount.value))
|
||||
|
||||
/**
|
||||
* 페이지 변경을 요청한다.
|
||||
@@ -69,7 +36,7 @@ const paginationItems = computed(() => {
|
||||
* @returns {void}
|
||||
*/
|
||||
const updatePage = (page) => {
|
||||
emit('update:page', Math.min(Math.max(Number(page) || 1, 1), totalPageCount.value))
|
||||
emit('update:page', clampAdminPage(page, totalPageCount.value))
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user