diff --git a/pages/category/[category].js b/pages/category/[category]/index.js similarity index 64% rename from pages/category/[category].js rename to pages/category/[category]/index.js index 6082c336..a6c4f1af 100644 --- a/pages/category/[category].js +++ b/pages/category/[category]/index.js @@ -2,7 +2,13 @@ import { getGlobalNotionData } from '@/lib/notion/getNotionData' import React from 'react' import { useGlobal } from '@/lib/global' import * as ThemeMap from '@/themes' +import BLOG from '@/blog.config' +/** + * 分类页 + * @param {*} props + * @returns + */ export default function Category(props) { const { theme } = useGlobal() const ThemeComponents = ThemeMap[theme] @@ -26,12 +32,23 @@ export default function Category(props) { export async function getStaticProps({ params: { category } }) { const from = 'category-props' let props = await getGlobalNotionData({ from }) - const { allPages } = props - const allPosts = allPages.filter(page => page.type === 'Post' && page.status === 'Published') - const posts = allPosts.filter( - post => post && post.category && post.category.includes(category) - ) - props = { ...props, posts, category } + + // 过滤状态 + props.posts = props.allPages.filter(page => page.type === 'Post' && page.status === 'Published') + // 处理过滤 + props.posts = props.posts.filter(post => post && post.category && post.category.includes(category)) + // 处理文章页数 + props.postCount = props.posts.length + // 处理分页 + if (BLOG.POST_LIST_STYLE === 'scroll') { + // 滚动列表 给前端返回所有数据 + } else if (BLOG.POST_LIST_STYLE === 'page') { + props.posts = props.posts?.slice(0, BLOG.POSTS_PER_PAGE - 1) + } + + delete props.allPages + + props = { ...props, category } return { props, diff --git a/pages/category/[category]/page/[page].js b/pages/category/[category]/page/[page].js new file mode 100644 index 00000000..04f11a20 --- /dev/null +++ b/pages/category/[category]/page/[page].js @@ -0,0 +1,65 @@ +import { getGlobalNotionData } from '@/lib/notion/getNotionData' +import React from 'react' +import { useGlobal } from '@/lib/global' +import * as ThemeMap from '@/themes' +import BLOG from '@/blog.config' + +/** + * 分类页 + * @param {*} props + * @returns + */ +export default function Category(props) { + const { theme } = useGlobal() + const ThemeComponents = ThemeMap[theme] + const { siteInfo, posts } = props + const { locale } = useGlobal() + if (!posts) { + return + } + const meta = { + title: `${props.category} | ${locale.COMMON.CATEGORY} | ${ + siteInfo?.title || '' + }`, + description: siteInfo?.description, + slug: 'category/' + props.category, + image: siteInfo?.pageCover, + type: 'website' + } + return +} + +export async function getStaticProps({ params: { category, page } }) { + const from = 'category-page-props' + let props = await getGlobalNotionData({ from }) + + // 过滤状态 + props.posts = props.allPages.filter(page => page.type === 'Post' && page.status === 'Published') + // 过滤类型 + props.posts = props.posts.filter(post => post && post.category && post.category.includes(category)) + // 处理文章页数 + props.postCount = props.posts.length + // 处理分页 + props.posts = props.posts.slice(BLOG.POSTS_PER_PAGE * (page - 1), BLOG.POSTS_PER_PAGE * page - 1) + + delete props.allPages + props.page = page + + props = { ...props, category, page } + + return { + props, + revalidate: 1 + } +} + +export async function getStaticPaths() { + const from = 'category-paths' + const { categories } = await getGlobalNotionData({ from }) + return { + paths: Object.keys(categories).map(category => ({ + params: { category: categories[category]?.name, page: '1' } + })), + fallback: true + } +} diff --git a/pages/category/index.js b/pages/category/index.js index 13f95eee..9d13411a 100644 --- a/pages/category/index.js +++ b/pages/category/index.js @@ -3,6 +3,11 @@ import React from 'react' import { useGlobal } from '@/lib/global' import * as ThemeMap from '@/themes' +/** + * 分类首页 + * @param {*} props + * @returns + */ export default function Category(props) { const { theme } = useGlobal() const ThemeComponents = ThemeMap[theme] diff --git a/pages/feed.js b/pages/feed/index.js similarity index 100% rename from pages/feed.js rename to pages/feed/index.js diff --git a/pages/index.js b/pages/index.js index 335c8bc4..067b9a32 100644 --- a/pages/index.js +++ b/pages/index.js @@ -12,8 +12,8 @@ const Index = props => { export async function getStaticProps() { const from = 'index' const props = await getGlobalNotionData({ from }) - const { allPages, siteInfo } = props - const allPosts = allPages.filter(page => page.type === 'Post' && page.status === 'Published') + const { siteInfo } = props + props.posts = props.allPages.filter(page => page.type === 'Post' && page.status === 'Published') const meta = { title: `${siteInfo?.title} | ${siteInfo?.description}`, description: siteInfo?.description, @@ -21,12 +21,11 @@ export async function getStaticProps() { slug: '', type: 'website' } - // 处理分页 if (BLOG.POST_LIST_STYLE === 'scroll') { - props.posts = Array.from(allPosts) + // 滚动列表默认给前端返回所有数据 } else if (BLOG.POST_LIST_STYLE === 'page') { - props.posts = allPosts?.slice(0, BLOG.POSTS_PER_PAGE) + props.posts = props.posts?.slice(0, BLOG.POSTS_PER_PAGE) } // 预览文章内容 diff --git a/pages/page/[page].js b/pages/page/[page].js index 0a0c19a7..3162250b 100644 --- a/pages/page/[page].js +++ b/pages/page/[page].js @@ -37,11 +37,11 @@ export async function getStaticPaths() { export async function getStaticProps({ params: { page } }) { const from = `page-${page}` const props = await getGlobalNotionData({ from }) - props.page = page const { allPages } = props const allPosts = allPages.filter(page => page.type === 'Post' && page.status === 'Published') // 处理分页 props.posts = allPosts.slice(BLOG.POSTS_PER_PAGE * (page - 1), BLOG.POSTS_PER_PAGE * page) + props.page = page // 处理预览 if (BLOG.POST_LIST_PREVIEW === 'true') { diff --git a/pages/tag/[tag].js b/pages/tag/[tag]/index.js similarity index 67% rename from pages/tag/[tag].js rename to pages/tag/[tag]/index.js index 875a8768..ea9f9000 100644 --- a/pages/tag/[tag].js +++ b/pages/tag/[tag]/index.js @@ -1,6 +1,7 @@ import { useGlobal } from '@/lib/global' import { getGlobalNotionData } from '@/lib/notion/getNotionData' import * as ThemeMap from '@/themes' +import BLOG from '@/blog.config' const Tag = props => { const { theme } = useGlobal() @@ -23,16 +24,25 @@ const Tag = props => { } export async function getStaticProps({ params: { tag } }) { - const props = await getGlobalNotionData({ - from: 'tag-props', - includePage: false, - tagsCount: 0 - }) - const { allPages } = props - const allPosts = allPages.filter(page => page.type === 'Post' && page.status === 'Published') - props.posts = allPosts.filter( - post => post && post.tags && post.tags.includes(tag) - ) + const from = 'tag-props' + const props = await getGlobalNotionData({ from }) + + // 过滤状态 + props.posts = props.allPages.filter(page => page.type === 'Post' && page.status === 'Published') + + // 处理标签 + props.posts = props.posts.filter(post => post && post.tags && post.tags.includes(tag)) + + // 处理文章页数 + props.postCount = props.posts.length + + // 处理分页 + if (BLOG.POST_LIST_STYLE === 'scroll') { + // 滚动列表 给前端返回所有数据 + } else if (BLOG.POST_LIST_STYLE === 'page') { + props.posts = props.posts?.slice(0, BLOG.POSTS_PER_PAGE - 1) + } + props.tag = tag return { props, diff --git a/pages/tag/[tag]/page/[page].js b/pages/tag/[tag]/page/[page].js new file mode 100644 index 00000000..e053e018 --- /dev/null +++ b/pages/tag/[tag]/page/[page].js @@ -0,0 +1,63 @@ +import { useGlobal } from '@/lib/global' +import { getGlobalNotionData } from '@/lib/notion/getNotionData' +import * as ThemeMap from '@/themes' +import BLOG from '@/blog.config' + +const Tag = props => { + const { theme } = useGlobal() + const ThemeComponents = ThemeMap[theme] + const { locale } = useGlobal() + const { tag, siteInfo, posts } = props + + if (!posts) { + return + } + + const meta = { + title: `${tag} | ${locale.COMMON.TAGS} | ${siteInfo?.title}`, + description: siteInfo?.description, + image: siteInfo?.pageCover, + slug: 'tag/' + tag, + type: 'website' + } + return +} + +export async function getStaticProps({ params: { tag, page } }) { + const from = 'tag-page-props' + const props = await getGlobalNotionData({ from }) + // 过滤状态 + props.posts = props.allPages.filter(page => page.type === 'Post' && page.status === 'Published') + // 过滤标签 + props.posts = props.posts.filter(post => post && post.tags && post.tags.includes(tag)) + // 处理文章页数 + props.postCount = props.posts.length + // 处理分页 + props.posts = props.posts.slice(BLOG.POSTS_PER_PAGE * (page - 1), BLOG.POSTS_PER_PAGE * page - 1) + + props.tag = tag + props.page = page + + return { + props, + revalidate: 1 + } +} + +export async function getStaticPaths() { + const from = 'tag-static-path' + const { tags } = await getGlobalNotionData({ from }) + const tagNames = [] + tags.forEach(tag => { + tagNames.push(tag.name) + }) + + return { + paths: Object.keys(tagNames).map(index => ({ + params: { tag: tagNames[index], page: '1' } + })), + fallback: true + } +} + +export default Tag diff --git a/pages/tag/index.js b/pages/tag/index.js index 1ceb0f07..ba8c534c 100644 --- a/pages/tag/index.js +++ b/pages/tag/index.js @@ -3,6 +3,11 @@ import React from 'react' import { useGlobal } from '@/lib/global' import * as ThemeMap from '@/themes' +/** + * 标签首页 + * @param {*} props + * @returns + */ const TagIndex = props => { const { theme } = useGlobal() const ThemeComponents = ThemeMap[theme] diff --git a/themes/hexo/LayoutCategory.js b/themes/hexo/LayoutCategory.js index c9c0c244..a13a33a3 100644 --- a/themes/hexo/LayoutCategory.js +++ b/themes/hexo/LayoutCategory.js @@ -1,13 +1,15 @@ import BlogPostListScroll from './components/BlogPostListScroll' +import BlogPostListPage from './components/BlogPostListPage' import LayoutBase from './LayoutBase' +import BLOG from '@/blog.config' export const LayoutCategory = props => { - const { tags, posts, category } = props + const { category } = props return
{category}
- + {BLOG.POST_LIST_STYLE === 'page' ? : } } diff --git a/themes/hexo/LayoutTag.js b/themes/hexo/LayoutTag.js index 34eb7181..75c308e5 100644 --- a/themes/hexo/LayoutTag.js +++ b/themes/hexo/LayoutTag.js @@ -3,49 +3,19 @@ import BlogPostListScroll from './components/BlogPostListScroll' import BlogPostListPage from './components/BlogPostListPage' import LayoutBase from './LayoutBase' import TagItemMini from '../next/components/TagItemMini' -// import PaginationNumber from './PaginationNumber' -import BlogPostListEmpty from './BlogPostListEmpty' import React from 'react' -import { getListByPage, getQueryVariable } from '@/lib/utils' export const LayoutTag = (props) => { const currentTag = props.tags.find((t) => { return t.name === props.tag }) - // const totalPage = Math.ceil(props.postCount / BLOG.POSTS_PER_PAGE) - // const showPagination = props.postCount >= BLOG.POSTS_PER_PAGE - - const [page, updatePage] = React.useState(1) - - const postsPerPage = BLOG.POSTS_PER_PAGE - - const postsToShow = getListByPage(props.posts, page, postsPerPage) - - React.useEffect(() => { - const qp = getQueryVariable('page') - console.log('分页', qp) - if (qp) { - updatePage(qp) - } - }) - - props.headerSlot =
- -
- - // 空文章处理 - if (!props.postToShow || props.postToShow.length === 0) { - return - } - return {currentTag && ( -
- -
- ) - } - {BLOG.POST_LIST_STYLE === 'page' ? : } - +
+ +
+ )} + {BLOG.POST_LIST_STYLE === 'page' ? : } + } diff --git a/themes/hexo/components/BlogPostListPage.js b/themes/hexo/components/BlogPostListPage.js index 4964f024..3662aee9 100644 --- a/themes/hexo/components/BlogPostListPage.js +++ b/themes/hexo/components/BlogPostListPage.js @@ -14,8 +14,7 @@ import BlogPostListEmpty from './BlogPostListEmpty' const BlogPostListPage = ({ page = 1, posts = [], postCount }) => { const totalPage = Math.ceil(postCount / BLOG.POSTS_PER_PAGE) const showPagination = postCount >= BLOG.POSTS_PER_PAGE - - if (!posts || posts.length === 0) { + if (!posts || posts.length === 0 || page > totalPage) { return } else { return ( diff --git a/themes/hexo/components/BlogPostListScroll.js b/themes/hexo/components/BlogPostListScroll.js index 89a89d0d..828e58aa 100644 --- a/themes/hexo/components/BlogPostListScroll.js +++ b/themes/hexo/components/BlogPostListScroll.js @@ -63,9 +63,7 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = CONFIG_HE
-
{ - handleGetMore() - }} +
{ handleGetMore() }} className='w-full my-4 py-4 text-center cursor-pointer rounded-xl dark:text-gray-200' > {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE}`}
diff --git a/themes/hexo/components/PaginationNumber.js b/themes/hexo/components/PaginationNumber.js index 5435a440..96207d43 100644 --- a/themes/hexo/components/PaginationNumber.js +++ b/themes/hexo/components/PaginationNumber.js @@ -1,4 +1,3 @@ -import BLOG from '@/blog.config' import Link from 'next/link' import { useRouter } from 'next/router' @@ -13,76 +12,66 @@ const PaginationNumber = ({ page, totalPage }) => { const router = useRouter() const currentPage = +page const showNext = page < totalPage - const pages = generatePages(page, currentPage, totalPage) + const pagePrefix = router.asPath.replace(/\/page\/[1-9]\d*/, '').replace(/\/$/, '') + const pages = generatePages(pagePrefix, page, currentPage, totalPage) return ( -
- {/* 上一页 */} - - - +
+ {/* 上一页 */} + + + - {pages} + {pages} - {/* 下一页 */} - - - -
) } -function getPageElement(page, currentPage) { +function getPageElement(page, currentPage, pagePrefix) { return ( - - - {page} - - + + + {page} + + ) } -function generatePages(page, currentPage, totalPage) { +function generatePages(pagePrefix, page, currentPage, totalPage) { const pages = [] const groupCount = 7 // 最多显示页签数 if (totalPage <= groupCount) { for (let i = 1; i <= totalPage; i++) { - pages.push(getPageElement(i, page)) + pages.push(getPageElement(i, page, pagePrefix)) } } else { - pages.push(getPageElement(1, page)) + pages.push(getPageElement(1, page, pagePrefix)) const dynamicGroupCount = groupCount - 2 let startPage = currentPage - 2 if (startPage <= 1) { @@ -97,7 +86,7 @@ function generatePages(page, currentPage, totalPage) { for (let i = 0; i < dynamicGroupCount; i++) { if (startPage + i < totalPage) { - pages.push(getPageElement(startPage + i, page)) + pages.push(getPageElement(startPage + i, page, pagePrefix)) } } @@ -105,7 +94,7 @@ function generatePages(page, currentPage, totalPage) { pages.push(
...
) } - pages.push(getPageElement(totalPage, page)) + pages.push(getPageElement(totalPage, page, pagePrefix)) } return pages }