From 15ee64ca0f48a0bc40eb51577786f73e516b8133 Mon Sep 17 00:00:00 2001 From: "tangly1024.com" Date: Tue, 28 May 2024 11:52:57 +0800 Subject: [PATCH 1/4] =?UTF-8?q?=E5=8F=B3=E9=94=AE=E8=8F=9C=E5=8D=95?= =?UTF-8?q?=E6=97=A0=E7=94=A8=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- components/CustomContextMenu.js | 37 ++++++++++++++++++++++++++------- 1 file changed, 30 insertions(+), 7 deletions(-) diff --git a/components/CustomContextMenu.js b/components/CustomContextMenu.js index 229d830f884..74fafbe8a83 100644 --- a/components/CustomContextMenu.js +++ b/components/CustomContextMenu.js @@ -56,6 +56,9 @@ export default function CustomContextMenu(props) { setShow(true) } + /** + * 鼠标点击事件 + */ const handleClick = event => { if (menuRef.current && !menuRef.current.contains(event.target)) { setShow(false) @@ -140,6 +143,26 @@ export default function CustomContextMenu(props) { htmlElement.classList?.add(newStatus ? 'dark' : 'light') } + // 一些配置变量 + const CUSTOM_RIGHT_CLICK_CONTEXT_MENU_RANDOM_POST = siteConfig( + 'CUSTOM_RIGHT_CLICK_CONTEXT_MENU_RANDOM_POST' + ) + const CUSTOM_RIGHT_CLICK_CONTEXT_MENU_CATEGORY = siteConfig( + 'CUSTOM_RIGHT_CLICK_CONTEXT_MENU_CATEGORY' + ) + const CUSTOM_RIGHT_CLICK_CONTEXT_MENU_TAG = siteConfig( + 'CUSTOM_RIGHT_CLICK_CONTEXT_MENU_TAG' + ) + const CAN_COPY = siteConfig('CAN_COPY') + const CUSTOM_RIGHT_CLICK_CONTEXT_MENU_SHARE_LINK = siteConfig( + 'CUSTOM_RIGHT_CLICK_CONTEXT_MENU_SHARE_LINK' + ) + const CUSTOM_RIGHT_CLICK_CONTEXT_MENU_DARK_MODE = siteConfig( + 'CUSTOM_RIGHT_CLICK_CONTEXT_MENU_DARK_MODE' + ) + const CUSTOM_RIGHT_CLICK_CONTEXT_MENU_THEME_SWITCH = siteConfig( + 'CUSTOM_RIGHT_CLICK_CONTEXT_MENU_THEME_SWITCH' + ) return (
- {siteConfig('CUSTOM_RIGHT_CLICK_CONTEXT_MENU_RANDOM_POST') && ( + {CUSTOM_RIGHT_CLICK_CONTEXT_MENU_RANDOM_POST && (
)} - {siteConfig('CUSTOM_RIGHT_CLICK_CONTEXT_MENU_CATEGORY') && ( + {CUSTOM_RIGHT_CLICK_CONTEXT_MENU_CATEGORY && ( )} - {siteConfig('CUSTOM_RIGHT_CLICK_CONTEXT_MENU_TAG') && ( + {CUSTOM_RIGHT_CLICK_CONTEXT_MENU_TAG && ( - {siteConfig('CAN_COPY') && ( + {CAN_COPY && (
)} - {siteConfig('CUSTOM_RIGHT_CLICK_CONTEXT_MENU_SHARE_LINK') && ( + {CUSTOM_RIGHT_CLICK_CONTEXT_MENU_SHARE_LINK && (
)} - {siteConfig('CUSTOM_RIGHT_CLICK_CONTEXT_MENU_DARK_MODE') && ( + {CUSTOM_RIGHT_CLICK_CONTEXT_MENU_DARK_MODE && (
)} - {siteConfig('CUSTOM_RIGHT_CLICK_CONTEXT_MENU_THEME_SWITCH') && ( + {CUSTOM_RIGHT_CLICK_CONTEXT_MENU_THEME_SWITCH && (
Date: Tue, 28 May 2024 11:53:30 +0800 Subject: [PATCH 2/4] =?UTF-8?q?heo=E4=B8=BB=E9=A2=98=E7=95=8C=E9=9D=A2?= =?UTF-8?q?=E5=AF=B9=E7=A7=B0=E6=80=A7=E5=BE=AE=E8=B0=83?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- themes/heo/components/PaginationNumber.js | 55 +++++----- themes/heo/components/SideRight.js | 76 +++++++------- themes/heo/index.js | 2 +- themes/next/components/PaginationNumber.js | 113 +++++++++++---------- themes/theme.js | 25 +++-- 5 files changed, 142 insertions(+), 129 deletions(-) diff --git a/themes/heo/components/PaginationNumber.js b/themes/heo/components/PaginationNumber.js index 54c1bf34ae0..5110064ecce 100644 --- a/themes/heo/components/PaginationNumber.js +++ b/themes/heo/components/PaginationNumber.js @@ -44,7 +44,7 @@ const PaginationNumber = ({ page, totalPage }) => { return ( <> {/* pc端分页按钮 */} -
+
{/* 上一页 */} { : `${pagePrefix}/page/${currentPage - 1}`, query: router.query.s ? { s: router.query.s } : {} }} - rel="prev" - className={`${currentPage === 1 ? 'invisible' : 'block'}`} - > -
- -
+ rel='prev' + className={`${currentPage === 1 ? 'invisible' : 'block'}`}> +
+ +
{locale.PAGINATION.PREV}
{/* 分页 */} -
+
{pages} {/* 跳转页码 */} -
+
+ className='w-0 group-hover:w-20 group-hover:px-3 transition-all duration-200 bg-gray-100 border-none outline-none h-full rounded-lg' + onInput={handleInputChange}>
+ className='cursor-pointer hover:bg-indigo-600 dark:bg-[#1e1e1e] dark:hover:bg-yellow-600 hover:text-white px-4 py-2 group-hover:px-2 group-hover:mx-1 group-hover:rounded bg-white'>
@@ -91,12 +88,11 @@ const PaginationNumber = ({ page, totalPage }) => { pathname: `${pagePrefix}/page/${currentPage + 1}`, query: router.query.s ? { s: router.query.s } : {} }} - rel="next" - className={`${+showNext ? 'block' : 'invisible'} `} - > -
- -
+ rel='next' + className={`${+showNext ? 'block' : 'invisible'} `}> +
+ +
{locale.PAGINATION.NEXT}
@@ -105,7 +101,7 @@ const PaginationNumber = ({ page, totalPage }) => { {/* 移动端分页 */} -
+
{/* 上一页 */} { : `${pagePrefix}/page/${currentPage - 1}`, query: router.query.s ? { s: router.query.s } : {} }} - rel="prev" - className={`${showPrev ? 'block' : 'hidden'} dark:text-white relative w-full flex-1 h-14 flex items-center transition-all duration-200 justify-center py-2 px-2 bg-white dark:bg-[#1e1e1e] border rounded-xl cursor-pointer`} - > + rel='prev' + className={`${showPrev ? 'block' : 'hidden'} dark:text-white relative w-full flex-1 h-14 flex items-center transition-all duration-200 justify-center py-2 px-2 bg-white dark:bg-[#1e1e1e] border rounded-xl cursor-pointer`}> {locale.PAGINATION.PREV} - {showPrev && showNext &&
} + {showPrev && showNext &&
} {/* 下一页 */} { pathname: `${pagePrefix}/page/${currentPage + 1}`, query: router.query.s ? { s: router.query.s } : {} }} - rel="next" - className={`${+showNext ? 'block' : 'hidden'} dark:text-white relative w-full flex-1 h-14 flex items-center transition-all duration-200 justify-center py-2 px-2 bg-white dark:bg-[#1e1e1e] border rounded-xl cursor-pointer`} - > + rel='next' + className={`${+showNext ? 'block' : 'hidden'} dark:text-white relative w-full flex-1 h-14 flex items-center transition-all duration-200 justify-center py-2 px-2 bg-white dark:bg-[#1e1e1e] border rounded-xl cursor-pointer`}> {locale.PAGINATION.NEXT}
@@ -161,8 +155,7 @@ function getPageElement(page, currentPage, pagePrefix) { ? 'bg-indigo-600 dark:bg-yellow-600 text-white ' : 'dark:bg-[#1e1e1e] bg-white') + ' hover:border-indigo-600 dark:hover:bg-yellow-600 dark:border-gray-600 px-4 border py-2 rounded-lg drop-shadow-sm duration-200 transition-colors' - } - > + }> {page} ) @@ -195,7 +188,7 @@ function generatePages(pagePrefix, page, currentPage, totalPage) { } if (startPage > 2) { pages.push( -
+
...{' '}
) diff --git a/themes/heo/components/SideRight.js b/themes/heo/components/SideRight.js index 775b9b7687a..1fcf96394a4 100644 --- a/themes/heo/components/SideRight.js +++ b/themes/heo/components/SideRight.js @@ -1,12 +1,12 @@ +import Live2D from '@/components/Live2D' +import dynamic from 'next/dynamic' +import { AnalyticsCard } from './AnalyticsCard' import Card from './Card' -import TagGroups from './TagGroups' import Catalog from './Catalog' import { InfoCard } from './InfoCard' -import dynamic from 'next/dynamic' -import Live2D from '@/components/Live2D' -import { AnalyticsCard } from './AnalyticsCard' -import TouchMeCard from './TouchMeCard' import LatestPostsGroupMini from './LatestPostsGroupMini' +import TagGroups from './TagGroups' +import TouchMeCard from './TouchMeCard' const FaceBookPage = dynamic( () => { @@ -27,46 +27,46 @@ const FaceBookPage = dynamic( * @returns */ export default function SideRight(props) { - const { - post, tagOptions, - currentTag, rightAreaSlot - } = props - - return ( -
+ const { post, tagOptions, currentTag, rightAreaSlot } = props - + // 只摘取标签的前60个，防止右侧过长 + const sortedTags = tagOptions.slice(0, 60) -
- - {/* 文章页显示目录 */} - {post && post.toc && post.toc.length > 0 && ( - - - - )} + return ( +
+ - {/* 联系交流群 */} - +
+ {/* 文章页显示目录 */} + {post && post.toc && post.toc.length > 0 && ( + + + + )} - {/* 最新文章列表 */} - + {/* 联系交流群 */} + - {rightAreaSlot} + {/* 最新文章列表 */} + - - + {rightAreaSlot} - {/* 标签和成绩 */} - - -
- - -
+ + -
+ {/* 标签和成绩 */} + + +
+ + +
+
) } diff --git a/themes/heo/index.js b/themes/heo/index.js index f772593948b..bd2fb42bdaf 100644 --- a/themes/heo/index.js +++ b/themes/heo/index.js @@ -56,7 +56,7 @@ const LayoutBase = props => { const router = useRouter() const headerSlot = ( -
+
{/* 顶部导航 */}
diff --git a/themes/next/components/PaginationNumber.js b/themes/next/components/PaginationNumber.js index 808dd217c63..af72c797da3 100644 --- a/themes/next/components/PaginationNumber.js +++ b/themes/next/components/PaginationNumber.js @@ -12,74 +12,75 @@ const PaginationNumber = ({ page, totalPage }) => { const router = useRouter() const currentPage = +page const showNext = currentPage !== totalPage - const pagePrefix = router.asPath.split('?')[0].replace(/\/page\/[1-9]\d*/, '').replace(/\/$/, '') + const pagePrefix = router.asPath + .split('?')[0] + .replace(/\/page\/[1-9]\d*/, '') + .replace(/\/$/, '') const pages = generatePages(pagePrefix, page, currentPage, totalPage) return (
- {/* 上一页 */} - - - + data-aos='fade-down' + data-aos-duration='300' + data-aos-once='false' + data-aos-anchor-placement='top-bottom' + className='mt-5 py-3 flex justify-center items-end font-medium text-black hover:shadow-xl duration-200 transition-all bg-white dark:bg-hexo-black-gray dark:text-gray-300 shadow space-x-2'> + {/* 上一页 */} + + + - {pages} + {pages} - {/* 下一页 */} - - - + {/* 下一页 */} + + +
) } function getPageElement(pagePrefix, page, currentPage) { return ( - ( - {page} - - ) + ) } function generatePages(pagePrefix, page, currentPage, totalPage) { @@ -100,7 +101,11 @@ function generatePages(pagePrefix, page, currentPage, totalPage) { startPage = totalPage - dynamicGroupCount } if (startPage > 2) { - pages.push(
...
) + pages.push( +
+ ...{' '} +
+ ) } for (let i = 0; i < dynamicGroupCount; i++) { @@ -110,7 +115,11 @@ function generatePages(pagePrefix, page, currentPage, totalPage) { } if (startPage + dynamicGroupCount < totalPage) { - pages.push(
...
) + pages.push( +
+ ...{' '} +
+ ) } pages.push(getPageElement(pagePrefix, totalPage, page)) diff --git a/themes/theme.js b/themes/theme.js index 3b89d92ac0f..1c04e335715 100644 --- a/themes/theme.js +++ b/themes/theme.js @@ -14,7 +14,11 @@ export const { THEMES = [] } = getConfig().publicRuntimeConfig */ export const getGlobalLayoutByTheme = themeQuery => { if (themeQuery !== BLOG.THEME) { - return dynamic(() => import(`@/themes/${themeQuery}`).then(m => m[getLayoutNameByPath(-1)]), { ssr: true }) + return dynamic( + () => + import(`@/themes/${themeQuery}`).then(m => m[getLayoutNameByPath(-1)]), + { ssr: true } + ) } else { return ThemeComponents[getLayoutNameByPath('-1')] } @@ -36,7 +40,8 @@ export const getLayoutByTheme = ({ router, theme }) => { checkThemeDOM() }, 500) - const components = m[getLayoutNameByPath(router.pathname, router.asPath)] + const components = + m[getLayoutNameByPath(router.pathname, router.asPath)] if (components) { return components } else { @@ -49,7 +54,8 @@ export const getLayoutByTheme = ({ router, theme }) => { setTimeout(() => { checkThemeDOM() }, 100) - const components = ThemeComponents[getLayoutNameByPath(router.pathname, router.asPath)] + const components = + ThemeComponents[getLayoutNameByPath(router.pathname, router.asPath)] if (components) { return components } else { @@ -102,7 +108,7 @@ export const initDarkMode = (updateDarkMode, defaultDarkMode) => { const userDarkMode = loadDarkModeFromLocalStorage() if (userDarkMode) { newDarkMode = userDarkMode === 'dark' || userDarkMode === 'true' - saveDarkModeToLocalStorage(newDarkMode) //用户手动的才保存 + saveDarkModeToLocalStorage(newDarkMode) // 用户手动的才保存 } // 如果站点强制设置默认深色，则优先级改过用 @@ -117,7 +123,9 @@ export const initDarkMode = (updateDarkMode, defaultDarkMode) => { } updateDarkMode(newDarkMode) - document.getElementsByTagName('html')[0].setAttribute('class', newDarkMode ? 'dark' : 'light') + document + .getElementsByTagName('html')[0] + .setAttribute('class', newDarkMode ? 'dark' : 'light') } /** @@ -131,11 +139,14 @@ export function isPreferDark() { if (BLOG.APPEARANCE === 'auto') { // 系统深色模式或时间是夜间时，强行置为夜间模式 const date = new Date() - const prefersDarkMode = window.matchMedia('(prefers-color-scheme: dark)').matches + const prefersDarkMode = window.matchMedia( + '(prefers-color-scheme: dark)' + ).matches return ( prefersDarkMode || (BLOG.APPEARANCE_DARK_TIME && - (date.getHours() >= BLOG.APPEARANCE_DARK_TIME[0] || date.getHours() < BLOG.APPEARANCE_DARK_TIME[1])) + (date.getHours() >= BLOG.APPEARANCE_DARK_TIME[0] || + date.getHours() < BLOG.APPEARANCE_DARK_TIME[1])) ) } return false From 1614a6ed03c6f9b136be6b23d1370acea3ba3a9e Mon Sep 17 00:00:00 2001 From: "tangly1024.com" Date: Tue, 28 May 2024 11:53:56 +0800 Subject: [PATCH 3/4] =?UTF-8?q?=E6=94=AF=E6=8C=81=E8=AE=A9=E6=A0=87?= =?UTF-8?q?=E7=AD=BE=E6=8C=89=E7=85=A7=E6=96=87=E7=AB=A0=E6=95=B0=E9=87=8F?= =?UTF-8?q?=E5=80=92=E5=BA=8F=E6=8E=92=E5=88=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- blog.config.js | 1 + lib/db/getSiteData.js | 20 ++++++++++++++------ lib/notion/getAllCategories.js | 12 +++++++++--- lib/notion/getAllTags.js | 25 ++++++++++++++++++++----- 4 files changed, 44 insertions(+), 14 deletions(-) diff --git a/blog.config.js b/blog.config.js index 7c5faf6c93b..12663fcfe84 100644 --- a/blog.config.js +++ b/blog.config.js @@ -13,6 +13,7 @@ const BLOG = { APPEARANCE: process.env.NEXT_PUBLIC_APPEARANCE || 'light', // ['light', 'dark', 'auto'], // light 日间模式 ， dark夜间模式， auto根据时间和主题自动夜间模式 APPEARANCE_DARK_TIME: process.env.NEXT_PUBLIC_APPEARANCE_DARK_TIME || [18, 6], // 夜间模式起至时间，false时关闭根据时间自动切换夜间模式 + TAG_SORT_BY_COUNT: true, // 标签是否按照文章数量倒序排列，文章多的标签排在前。 IS_TAG_COLOR_DISTINGUISHED: process.env.NEXT_PUBLIC_IS_TAG_COLOR_DISTINGUISHED === 'true' || true, // 对于名称相同的tag是否区分tag的颜色 diff --git a/lib/db/getSiteData.js b/lib/db/getSiteData.js index 6bbe4bc9cfa..fb916374f11 100755 --- a/lib/db/getSiteData.js +++ b/lib/db/getSiteData.js @@ -5,7 +5,7 @@ import getAllPageIds from '@/lib/notion/getAllPageIds' import { getAllTags } from '@/lib/notion/getAllTags' import { getConfigMapFromConfigPage } from '@/lib/notion/getNotionConfig' import getPageProperties, { - adjustPageProperties + adjustPageProperties } from '@/lib/notion/getPageProperties' import { fetchInBatches, getPage } from '@/lib/notion/getPostBlocks' import { compressImage, mapImgUrl } from '@/lib/notion/mapImage' @@ -77,15 +77,17 @@ export async function getNotionPageData({ pageId, from }) { } // 返回给前端的数据做处理 - return compressData(deepClone(data)) + return handleDataBeforeReturn(deepClone(data)) } /** - * 减少返回给前端的数据 - * 并脱敏 + * 返回给浏览器前端的数据处理 + * 适当脱敏 + * 减少体积 + * 其它处理 * @param {*} db */ -function compressData(db) { +function handleDataBeforeReturn(db) { // 清理多余数据 delete db.block delete db.schema @@ -545,11 +547,17 @@ async function getDataBaseInfoByNotionAPI({ pageId, from }) { ) })?.[0] ) + // 所有分类 const categoryOptions = getAllCategories({ allPages, categoryOptions: getCategoryOptions(schema) }) - const tagOptions = getAllTags({ allPages, tagOptions: getTagOptions(schema) }) + // 所有标签 + const tagOptions = getAllTags({ + allPages, + tagOptions: getTagOptions(schema), + NOTION_CONFIG + }) // 旧的菜单 const customNav = getCustomNav({ allPages: collectionData.filter( diff --git a/lib/notion/getAllCategories.js b/lib/notion/getAllCategories.js index 97c8ab3a2eb..c7e66ba2252 100644 --- a/lib/notion/getAllCategories.js +++ b/lib/notion/getAllCategories.js @@ -4,7 +4,7 @@ import { isIterable } from '../utils' * 获取所有文章的标签 * @param allPosts * @param sliceCount 默认截取数量为12，若为0则返回全部 - * @param tagOptions tags的下拉选项 + * @param categoryOptions categories的下拉选项 * @returns {Promise<{}|*[]>} */ @@ -13,8 +13,14 @@ import { isIterable } from '../utils' * @param allPosts * @returns {Promise<{}|*[]>} */ -export function getAllCategories({ allPages, categoryOptions, sliceCount = 0 }) { - const allPosts = allPages?.filter(page => page.type === 'Post' && page.status === 'Published') +export function getAllCategories({ + allPages, + categoryOptions, + sliceCount = 0 +}) { + const allPosts = allPages?.filter( + page => page.type === 'Post' && page.status === 'Published' + ) if (!allPosts || !categoryOptions) { return [] } diff --git a/lib/notion/getAllTags.js b/lib/notion/getAllTags.js index 4c7559b9d64..cac8dac75e9 100644 --- a/lib/notion/getAllTags.js +++ b/lib/notion/getAllTags.js @@ -1,5 +1,5 @@ +import { siteConfig } from '../config' import { isIterable } from '../utils' -import BLOG from '@/blog.config' /** * 获取所有文章的标签 @@ -8,8 +8,15 @@ import BLOG from '@/blog.config' * @param tagOptions tags的下拉选项 * @returns {Promise<{}|*[]>} */ -export function getAllTags({ allPages, sliceCount = 0, tagOptions }) { - const allPosts = allPages?.filter(page => page.type === 'Post' && page.status === 'Published') +export function getAllTags({ + allPages, + sliceCount = 0, + tagOptions, + NOTION_CONFIG +}) { + const allPosts = allPages?.filter( + page => page.type === 'Post' && page.status === 'Published' + ) if (!allPosts || !tagOptions) { return [] @@ -27,7 +34,12 @@ export function getAllTags({ allPages, sliceCount = 0, tagOptions }) { }) const list = [] - const { IS_TAG_COLOR_DISTINGUISHED } = BLOG + const IS_TAG_COLOR_DISTINGUISHED = siteConfig( + 'IS_TAG_COLOR_DISTINGUISHED', + false, + NOTION_CONFIG + ) + const TAG_SORT_BY_COUNT = siteConfig('TAG_SORT_BY_COUNT', true, NOTION_CONFIG) if (isIterable(tagOptions)) { if (!IS_TAG_COLOR_DISTINGUISHED) { // 如果不区分颜色, 那么不同颜色相同名称的tag当做同一种tag @@ -52,7 +64,10 @@ export function getAllTags({ allPages, sliceCount = 0, tagOptions }) { } // 按照数量排序 - // list.sort((a, b) => b.count - a.count) + if (TAG_SORT_BY_COUNT) { + list.sort((a, b) => b.count - a.count) + } + if (sliceCount && sliceCount > 0) { return list.slice(0, sliceCount) } else { From c24f9a03caac8834c3a1c3d0af4243da4b187357 Mon Sep 17 00:00:00 2001 From: "tangly1024.com" Date: Tue, 28 May 2024 12:29:25 +0800 Subject: [PATCH 4/4] fixp --- themes/heo/components/SideRight.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/themes/heo/components/SideRight.js b/themes/heo/components/SideRight.js index 1fcf96394a4..996c50dea4d 100644 --- a/themes/heo/components/SideRight.js +++ b/themes/heo/components/SideRight.js @@ -30,7 +30,7 @@ export default function SideRight(props) { const { post, tagOptions, currentTag, rightAreaSlot } = props // 只摘取标签的前60个，防止右侧过长 - const sortedTags = tagOptions.slice(0, 60) + const sortedTags = tagOptions?.slice(0, 60) || [] return (