55 lines
1.6 KiB
JavaScript
55 lines
1.6 KiB
JavaScript
import SmartLink from '@/components/SmartLink'
|
|
import { useRouter } from 'next/router'
|
|
import { useGlobal } from '@/lib/global'
|
|
|
|
/**
|
|
* 簡易翻頁外掛
|
|
* @param page 當前頁碼
|
|
* @param totalPage 是否有下一頁
|
|
* @returns {JSX.Element}
|
|
* @constructor
|
|
*/
|
|
const PaginationSimple = ({ page, totalPage }) => {
|
|
const { locale } = useGlobal()
|
|
const router = useRouter()
|
|
const currentPage = +page
|
|
const showNext = currentPage < totalPage
|
|
const pagePrefix = router.asPath.replace(/\/page\/[1-9]\d*/, '').replace(/\/$/, '')
|
|
|
|
return (
|
|
<div className="my-10 flex justify-between font-medium text-black dark:text-gray-100 space-x-2">
|
|
<SmartLink
|
|
href={{
|
|
pathname:
|
|
currentPage === 2
|
|
? `${pagePrefix}/`
|
|
: `${pagePrefix}/page/${currentPage - 1}`,
|
|
query: router.query.s ? { s: router.query.s } : {}
|
|
}}
|
|
passHref
|
|
rel="prev"
|
|
className={`${
|
|
currentPage === 1 ? 'invisible' : 'block'
|
|
} text-center w-full duration-200 px-4 py-2 hover:border-green-500 border-b-2 hover:font-bold`}>
|
|
←{locale.PAGINATION.PREV}
|
|
|
|
</SmartLink>
|
|
<SmartLink
|
|
href={{
|
|
pathname: `${pagePrefix}/page/${currentPage + 1}`,
|
|
query: router.query.s ? { s: router.query.s } : {}
|
|
}}
|
|
passHref
|
|
rel="next"
|
|
className={`${
|
|
+showNext ? 'block' : 'invisible'
|
|
} text-center w-full duration-200 px-4 py-2 hover:border-green-500 border-b-2 hover:font-bold`}>
|
|
|
|
{locale.PAGINATION.NEXT}→
|
|
</SmartLink>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default PaginationSimple
|