File size: 2,233 Bytes
1b72d7e |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 |
import { useRouter } from 'next/router'
import Link from 'next/link'
import { BlogItem } from './BlogItem'
import { AdSlot } from '@/components/GoogleAdsense'
import { siteConfig } from '@/lib/config'
import CONFIG from '../config'
/**
* 博客列表
* @param {*} props
* @returns
*/
export default function BlogListPage(props) {
const { page = 1, posts, postCount } = props
const router = useRouter()
const totalPage = Math.ceil(postCount / parseInt(siteConfig('POSTS_PER_PAGE')))
const currentPage = +page
// 博客列表嵌入广告
const SIMPLE_POST_AD_ENABLE = siteConfig('SIMPLE_POST_AD_ENABLE', false, CONFIG)
const showPrev = currentPage > 1
const showNext = page < totalPage
const pagePrefix = router.asPath.split('?')[0].replace(/\/page\/[1-9]\d*/, '').replace(/\/$/, '')
return (
<div className="w-full md:pr-8 mb-12">
<div id="posts-wrapper">
{posts?.map((p, index) => (<div key={p.id}>
{SIMPLE_POST_AD_ENABLE && (index + 1) % 3 === 0 && <AdSlot type='in-article' />}
{SIMPLE_POST_AD_ENABLE && (index + 1) === 4 && <AdSlot type='flow' />}
<BlogItem post={p} />
</div>))}
</div>
<div className="flex justify-between text-xs mt-1">
<Link
href={{ pathname: currentPage - 1 === 1 ? `${pagePrefix}/` : `${pagePrefix}/page/${currentPage - 1}`, query: router.query.s ? { s: router.query.s } : {} }}
className={`${showPrev ? 'text-blue-600 border-b border-blue-400 visible ' : ' invisible bg-gray pointer-events-none '} no-underline pb-1 px-3`}>
NEWER POSTS <i className="fa-solid fa-arrow-left"></i>
</Link>
<Link
href={{ pathname: `${pagePrefix}/page/${currentPage + 1}`, query: router.query.s ? { s: router.query.s } : {} }}
className={`${showNext ? 'text-blue-600 border-b border-blue-400 visible' : ' invisible bg-gray pointer-events-none '} no-underline pb-1 px-3`}>
OLDER POSTS <i className="fa-solid fa-arrow-right"></i>
</Link>
</div>
</div>
)
}
|