From 69abbd8e3ed494a1dbe0397f746891c6246c0624 Mon Sep 17 00:00:00 2001 From: tangly1024 Date: Tue, 11 Jan 2022 10:25:29 +0800 Subject: [PATCH 01/30] =?UTF-8?q?feature:=20=E4=BC=98=E5=8C=96=E9=A1=B5?= =?UTF-8?q?=E9=9D=A2=E4=BD=93=E7=A7=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pages/about.js | 8 ++++---- pages/article/[slug].js | 3 --- pages/search.js | 2 +- pages/tag/index.js | 7 +++---- 4 files changed, 8 insertions(+), 12 deletions(-) diff --git a/pages/about.js b/pages/about.js index 28a93342..0ccfeae3 100644 --- a/pages/about.js +++ b/pages/about.js @@ -21,7 +21,7 @@ import React from 'react' * @param {*} param0 * @returns */ -const About = ({ post, blockMap, tags, prev, next, allPosts, categories }) => { +const About = ({ post, blockMap, tags, prev, next, postCount, categories }) => { if (!post) { return } @@ -39,10 +39,10 @@ const About = ({ post, blockMap, tags, prev, next, allPosts, categories }) => { meta={meta} tags={tags} post={post} - totalPosts={allPosts} + postCount={postCount} categories={categories} > - + ) } @@ -69,7 +69,7 @@ export async function getStaticProps () { const next = allPosts.slice(index + 1, index + 2)[0] ?? allPosts[0] return { - props: { post, blockMap, tags, prev, next, allPosts, categories, postCount, latestPosts }, + props: { post, blockMap, tags, prev, next, categories, postCount, latestPosts }, revalidate: 1 } } diff --git a/pages/article/[slug].js b/pages/article/[slug].js index 8f055522..0a5c4bbb 100644 --- a/pages/article/[slug].js +++ b/pages/article/[slug].js @@ -16,7 +16,6 @@ const Slug = ({ tags, prev, next, - allPosts, recommendPosts, categories, postCount, @@ -39,7 +38,6 @@ const Slug = ({ post={post} postCount={postCount} latestPosts={latestPosts} - totalPosts={allPosts} categories={categories} > { +const Search = ({ posts, tags, categories, postCount }) => { let filteredPosts = [] const searchKey = getSearchKey() if (searchKey) { diff --git a/pages/tag/index.js b/pages/tag/index.js index 54405469..6977f37d 100644 --- a/pages/tag/index.js +++ b/pages/tag/index.js @@ -7,14 +7,14 @@ import { faTags } from '@fortawesome/free-solid-svg-icons' import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import React from 'react' -export default function Tag ({ tags, allPosts, categories, postCount, latestPosts }) { +export default function Tag ({ tags, categories, postCount, latestPosts }) { const { locale } = useGlobal() const meta = { title: `${locale.COMMON.TAGS} | ${BLOG.title}`, description: BLOG.description, type: 'website' } - return + return
{locale.COMMON.TAGS}:
@@ -28,12 +28,11 @@ export default function Tag ({ tags, allPosts, categories, postCount, latestPost export async function getStaticProps () { const from = 'tag-index-props' - const { allPosts, categories, tags, postCount, latestPosts } = await getGlobalNotionData({ from, includePage: true, tagsCount: 0 }) + const { categories, tags, postCount, latestPosts } = await getGlobalNotionData({ from, includePage: true, tagsCount: 0 }) return { props: { tags, - posts: allPosts, categories, postCount, latestPosts From c2906083c3c49e75c076dcbbdb3c4f90b86311af Mon Sep 17 00:00:00 2001 From: tangly1024 Date: Tue, 11 Jan 2022 10:51:05 +0800 Subject: [PATCH 02/30] =?UTF-8?q?bugfix:=20=E4=BF=AE=E5=A4=8D=E6=90=9C?= =?UTF-8?q?=E7=B4=A2=E8=83=8C=E6=99=AF=E9=81=AE=E7=BD=A9=E6=97=A0=E6=B3=95?= =?UTF-8?q?=E7=82=B9=E5=87=BB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/SearchDrawer.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/components/SearchDrawer.js b/components/SearchDrawer.js index d21dc3b4..da417f52 100644 --- a/components/SearchDrawer.js +++ b/components/SearchDrawer.js @@ -13,6 +13,7 @@ const SearchDrawer = ({ cRef }) => { } }) const hidden = () => { + console.log('点击') searchDrawer?.current?.classList?.add('hidden') } Router.events.on('routeChangeComplete', (...args) => { @@ -20,14 +21,14 @@ const SearchDrawer = ({ cRef }) => { }) return (
-
+
{/* 背景蒙版 */} -
+
) } From c70836a6a3e3ea302ed3fcf1b7abc3909c13c431 Mon Sep 17 00:00:00 2001 From: tangly1024 Date: Tue, 11 Jan 2022 10:57:37 +0800 Subject: [PATCH 03/30] feature: TopNav switchMenuShow --- components/TopNav.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/components/TopNav.js b/components/TopNav.js index 20fe43d8..021e7f23 100644 --- a/components/TopNav.js +++ b/components/TopNav.js @@ -43,6 +43,11 @@ const TopNav = ({ tags, currentTag, post, slot, categories, currentCategory, aut BLOG.autoCollapsedNavBar && window.removeEventListener('scroll', scrollTrigger) } }, []) + + const switchMenuShow = () => { + drawer?.current?.handleSwitchSideDrawerVisible() + } + return (
{/* 侧面抽屉 */} @@ -53,7 +58,7 @@ const TopNav = ({ tags, currentTag, post, slot, categories, currentCategory, aut
{/* 左侧LOGO 标题 */}
-
{ drawer.current.handleSwitchSideDrawerVisible() }} +
From 9e6707149d1ae7c72ff031f5c24b6e91539fb213 Mon Sep 17 00:00:00 2001 From: tangly1024 Date: Tue, 11 Jan 2022 13:44:30 +0800 Subject: [PATCH 04/30] =?UTF-8?q?feature:=20collapse=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/Analytics.js | 8 +++---- components/BlogPostListScroll.js | 4 ++-- components/Collapse.js | 38 ++++++++++++++++++++++++++++++++ components/MenuButtonGroup.js | 17 ++++++++------ components/SearchDrawer.js | 1 - components/SideAreaLeft.js | 6 ++--- components/TopNav.js | 33 +++++++++++++++------------ layouts/BaseLayout.js | 2 +- 8 files changed, 77 insertions(+), 32 deletions(-) create mode 100644 components/Collapse.js diff --git a/components/Analytics.js b/components/Analytics.js index fbd23538..c7655654 100644 --- a/components/Analytics.js +++ b/components/Analytics.js @@ -13,10 +13,10 @@ export default function Analytics ({ postCount }) {
{postCount}{locale.COMMON.POSTS} - {/* */} - {/* | {locale.COMMON.VISITORS} */} - - | {locale.COMMON.VIEWS} + + | {locale.COMMON.VISITORS} + {/* + | {locale.COMMON.VIEWS} */}
} diff --git a/components/BlogPostListScroll.js b/components/BlogPostListScroll.js index 07fd9be1..1c378bfa 100644 --- a/components/BlogPostListScroll.js +++ b/components/BlogPostListScroll.js @@ -55,7 +55,7 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = BLOG.home return
{/* 文章列表 */} -
+
{postsToShow.map(post => ( ))} @@ -65,7 +65,7 @@ const BlogPostListScroll = ({ posts = [], currentSearch, showSummary = BLOG.home
{ handleGetMore() }} - className='w-full my-4 py-4 text-center cursor-pointer glassmorphism shadow-xl rounded-xl dark:text-gray-200' + className='w-full my-4 py-4 text-center cursor-pointer glassmorphism shadow-xl rounded-xl dark:text-gray-200' > {hasMore ? locale.COMMON.MORE : `${locale.COMMON.NO_MORE} 😰`}
diff --git a/components/Collapse.js b/components/Collapse.js new file mode 100644 index 00000000..baca44cc --- /dev/null +++ b/components/Collapse.js @@ -0,0 +1,38 @@ +import React, { useEffect, useRef } from 'react' + +const Collapse = props => { + const collapseRef = useRef(null) + const collapseSection = element => { + const sectionHeight = element.scrollHeight + requestAnimationFrame(function () { + element.style.height = sectionHeight + 'px' + requestAnimationFrame(function () { + element.style.height = 0 + 'px' + }) + }) + } + const expandSection = element => { + const sectionHeight = element.scrollHeight + element.style.height = sectionHeight + 'px' + const clearTime = setTimeout(() => { + element.style.height = 'auto' + }, 400) + clearTimeout(clearTime) + } + useEffect(() => { + const element = collapseRef.current + if (props.isOpen) { + expandSection(element) + } else { + collapseSection(element) + } + }, [props.isOpen]) + return ( +
+ {props.children} +
+ ) +} +Collapse.defaultProps = { isOpen: false } + +export default Collapse diff --git a/components/MenuButtonGroup.js b/components/MenuButtonGroup.js index eda4cfdf..38df8131 100644 --- a/components/MenuButtonGroup.js +++ b/components/MenuButtonGroup.js @@ -6,27 +6,30 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { faArchive, faHome, faTag, faTh, faUser } from '@fortawesome/free-solid-svg-icons' import BLOG from 'blog.config' -const MenuButtonGroup = ({ allowCollapse = false }) => { +const MenuButtonGroup = ({ allowCollapse = false, postCount }) => { const { locale } = useGlobal() const router = useRouter() + const archiveSlot =
{postCount}
+ const links = [ { id: 0, icon: faHome, name: locale.NAV.INDEX, to: '/' || '/', show: true }, - { id: 1, icon: faArchive, name: locale.NAV.ARCHIVE, to: '/archive', show: BLOG.menu.showArchive }, - { id: 2, icon: faTh, name: locale.COMMON.CATEGORY, to: '/category', show: BLOG.menu.showCategory }, - { id: 3, icon: faTag, name: locale.COMMON.TAGS, to: '/tag', show: BLOG.menu.showTag }, + { id: 1, icon: faTh, name: locale.COMMON.CATEGORY, to: '/category', show: BLOG.menu.showCategory }, + { id: 2, icon: faTag, name: locale.COMMON.TAGS, to: '/tag', show: BLOG.menu.showTag }, + { id: 3, icon: faArchive, name: locale.NAV.ARCHIVE, to: '/archive', slot: archiveSlot, show: BLOG.menu.showArchive }, { id: 4, icon: faUser, name: locale.NAV.ABOUT, to: '/about', show: BLOG.menu.showAbout } ] - return