配置文件整体重构

This commit is contained in:
tangly1024
2025-01-05 12:41:00 +08:00
parent 2831d2fb0c
commit 11eb466e96
30 changed files with 684 additions and 622 deletions

View File

@@ -6,13 +6,13 @@ const CategoryGroup = props => {
const { currentCategory, categoryOptions } = props
const { locale } = useGlobal()
if (!categoryOptions || categoryOptions.length === 0) return <></>
const categoryCount = siteConfig('PREVIEW_CATEGORY_COUNT')
const categoryCount = siteConfig('MOVIE_PREVIEW_CATEGORY_COUNT')
const categories = categoryOptions.slice(0, categoryCount)
return (
<>
<div>
<h2 className="text-2xl dark:text-white">{locale.COMMON.CATEGORY}</h2>
<div id="category-list" className="dark:border-gray-600 flex flex-col">
<h2 className='text-2xl dark:text-white'>{locale.COMMON.CATEGORY}</h2>
<div id='category-list' className='dark:border-gray-600 flex flex-col'>
{categories.map(category => {
const selected = currentCategory === category.name
return (
@@ -25,8 +25,7 @@ const CategoryGroup = props => {
? 'hover:text-white dark:hover:text-white bg-gray-600 text-white '
: 'dark:text-green-400 text-gray-500 hover:text-white hover:bg-gray-500 dark:hover:text-white') +
' w-full items-center duration-300 px-2 cursor-pointer py-1 font-light'
}
>
}>
<i
className={`${selected ? 'text-white fa-folder-open ' : 'text-gray-500 fa-folder '} mr-2 fas`}
/>

View File

@@ -9,6 +9,7 @@ const CONFIG = {
MOVIE_MENU_SEARCH: true, // 显示搜索
MOVIE_HOME_BACKGROUND: false, // 首页是否显示背景图, 默认关闭
MOVIE_PREVIEW_CATEGORY_COUNT: 16, // 首页最多展示的分类数量0为不限制
MOVIE_ARTICLE_RECOMMEND: true, // 推荐关联内容在文章底部
MOVIE_VIDEO_COMBINE: true, // 聚合视频开启后一篇文章内的多个含caption的视频会被合并到文章开头并展示分集按钮
MOVIE_VIDEO_COMBINE_SHOW_PAGE_FORCE: false, // 即使只有一集也显示集数切换按钮

View File

@@ -3,28 +3,34 @@ import Link from 'next/link'
const CategoryGroup = ({ currentCategory, categories }) => {
if (!categories || categories.length === 0) return <></>
const categoryCount = siteConfig('PREVIEW_CATEGORY_COUNT')
const categoryCount = siteConfig('NEXT_PREVIEW_CATEGORY_COUNT')
const categoryOptions = categories.slice(0, categoryCount)
return <>
<div id='category-list' className='dark:border-gray-600 flex flex-wrap'>
{categoryOptions.map(category => {
const selected = currentCategory === category.name
return (
<Link
key={category.name}
href={`/category/${category.name}`}
passHref
className={(selected
? 'hover:text-white dark:hover:text-white bg-gray-600 text-white '
: 'dark:text-gray-400 text-gray-500 hover:text-white hover:bg-gray-500 dark:hover:text-white') +
' text-sm w-full items-center duration-300 px-2 cursor-pointer py-1 font-light'}>
<i className={`${selected ? 'text-white fa-folder-open ' : 'text-gray-500 fa-folder '} mr-2 fas`} />{category.name}({category.count})
</Link>
);
})}
</div>
</>;
return (
<>
<div id='category-list' className='dark:border-gray-600 flex flex-wrap'>
{categoryOptions.map(category => {
const selected = currentCategory === category.name
return (
<Link
key={category.name}
href={`/category/${category.name}`}
passHref
className={
(selected
? 'hover:text-white dark:hover:text-white bg-gray-600 text-white '
: 'dark:text-gray-400 text-gray-500 hover:text-white hover:bg-gray-500 dark:hover:text-white') +
' text-sm w-full items-center duration-300 px-2 cursor-pointer py-1 font-light'
}>
<i
className={`${selected ? 'text-white fa-folder-open ' : 'text-gray-500 fa-folder '} mr-2 fas`}
/>
{category.name}({category.count})
</Link>
)
})}
</div>
</>
)
}
export default CategoryGroup

View File

@@ -11,16 +11,14 @@ import TagItemMini from './TagItemMini'
const TagGroups = ({ tags, currentTag }) => {
if (!tags || tags.length === 0) return <></>
const tagsCount = siteConfig('PREVIEW_TAG_COUNT')
const tagsCount = siteConfig('NEXT_PREVIEW_TAG_COUNT')
const tagOptions = tags.slice(0, tagsCount)
return (
<div id='tags-group' className='dark:border-gray-600 w-66 space-y-2'>
{
tagOptions.map(tag => {
const selected = tag.name === currentTag
return <TagItemMini key={tag.name} tag={tag} selected={selected} />
})
}
{tagOptions.map(tag => {
const selected = tag.name === currentTag
return <TagItemMini key={tag.name} tag={tag} selected={selected} />
})}
</div>
)
}

View File

@@ -1,7 +1,11 @@
const CONFIG = {
NEXT_HOME_BANNER: true, // 首页是否显示大图及标语 [true,false]
NEXT_HOME_BANNER_STRINGS: ['Hi我是一个程序员', 'Hi我是一个打工人', 'Hi我是一个干饭人', '欢迎来到我的博客🎉'], // 首页大图标语文字
NEXT_HOME_BANNER_STRINGS: [
'Hi我是一个程序员',
'Hi我是一个打工人',
'Hi我是一个干饭人',
'欢迎来到我的博客🎉'
], // 首页大图标语文字
NEXT_NAV_TYPE: 'normal', // ['fixed','autoCollapse','normal'] 分别是固定屏幕顶部并始终显示、固定屏幕顶部且滚动时隐藏,不固定屏幕顶部
@@ -9,6 +13,8 @@ const CONFIG = {
NEXT_POST_LIST_PREVIEW: true, // 显示文章预览
NEXT_POST_LIST_SUMMARY: false, // 显示用户自定义摘要,有预览时优先只展示预览
NEXT_PREVIEW_TAG_COUNT: 16, // 首页最多展示的标签数量0为不限制
NEXT_PREVIEW_CATEGORY_COUNT: 16, // 首页最多展示的分类数量0为不限制
NEXT_POST_HEADER_IMAGE_VISIBLE: false, // 文章详情页是否显示封面图
// 右侧组件
@@ -33,7 +39,6 @@ const CONFIG = {
NEXT_ARTICLE_RELATE_POSTS: true, // 相关文章推荐
NEXT_ARTICLE_COPYRIGHT: true, // 文章版权声明
NEXT_ARTICLE_INFO: true // 显示文章信息
}
export default CONFIG

View File

@@ -10,7 +10,7 @@ export const BlogListPage = props => {
const POSTS_PER_PAGE = siteConfig('POSTS_PER_PAGE', null, NOTION_CONFIG)
const totalPage = Math.ceil(postCount / POSTS_PER_PAGE)
const showPageCover = siteConfig('MOVIE_POST_LIST_COVER', null, CONFIG)
const showPageCover = siteConfig('PHOTO_POST_LIST_COVER', null, CONFIG)
if (!posts || posts.length === 0) {
return null
}

View File

@@ -46,7 +46,7 @@ export const BlogListScroll = props => {
}
}, 500)
)
const showPageCover = siteConfig('MOVIE_POST_LIST_COVER', null, CONFIG)
const showPageCover = siteConfig('PHOTO_POST_LIST_COVER', null, CONFIG)
useEffect(() => {
window.addEventListener('scroll', scrollTrigger)

View File

@@ -13,7 +13,7 @@ export default function BlogRecommend(props) {
const { recommendPosts, siteInfo } = props
const { locale } = useGlobal()
if (
!siteConfig('MOVIE_ARTICLE_RECOMMEND', null, CONFIG) ||
!siteConfig('PHOTO_ARTICLE_RECOMMEND', null, CONFIG) ||
!recommendPosts ||
recommendPosts.length === 0
) {

View File

@@ -6,13 +6,13 @@ const CategoryGroup = props => {
const { currentCategory, categoryOptions } = props
const { locale } = useGlobal()
if (!categoryOptions || categoryOptions.length === 0) return <></>
const categoryCount = siteConfig('PREVIEW_CATEGORY_COUNT')
const categoryCount = siteConfig('PHOTO_PREVIEW_CATEGORY_COUNT')
const categories = categoryOptions.slice(0, categoryCount)
return (
<>
<div>
<h2 className="text-2xl dark:text-white">{locale.COMMON.CATEGORY}</h2>
<div id="category-list" className="dark:border-gray-600 flex flex-col">
<h2 className='text-2xl dark:text-white'>{locale.COMMON.CATEGORY}</h2>
<div id='category-list' className='dark:border-gray-600 flex flex-col'>
{categories.map(category => {
const selected = currentCategory === category.name
return (
@@ -25,8 +25,7 @@ const CategoryGroup = props => {
? 'hover:text-white dark:hover:text-white bg-gray-600 text-white '
: 'dark:text-green-400 text-gray-500 hover:text-white hover:bg-gray-500 dark:hover:text-white') +
' w-full items-center duration-300 px-2 cursor-pointer py-1 font-light'
}
>
}>
<i
className={`${selected ? 'text-white fa-folder-open ' : 'text-gray-500 fa-folder '} mr-2 fas`}
/>

View File

@@ -8,7 +8,7 @@ import { useGlobal } from '@/lib/global'
*/
export const HomeBackgroundImage = props => {
const { siteInfo } = useGlobal()
const background = siteConfig('MOVIE_HOME_BACKGROUND')
const background = siteConfig('PHOTO_HOME_BACKGROUND')
if (!background) {
return null
}

View File

@@ -29,21 +29,21 @@ export default function MenuHierarchical(props) {
icon: 'fa-solid fa-house',
name: locale.NAV.INDEX,
href: '/',
show: siteConfig('MOVIE_MENU_INDEX', null, CONFIG)
show: siteConfig('PHOTO_MENU_INDEX', null, CONFIG)
},
{
id: 2,
icon: 'fas fa-search',
name: locale.NAV.SEARCH,
href: '/search',
show: siteConfig('MOVIE_MENU_SEARCH', null, CONFIG)
show: siteConfig('PHOTO_MENU_SEARCH', null, CONFIG)
},
{
id: 3,
icon: 'fas fa-archive',
name: locale.NAV.ARCHIVE,
href: '/archive',
show: siteConfig('MOVIE_MENU_ARCHIVE', null, CONFIG)
show: siteConfig('PHOTO_MENU_ARCHIVE', null, CONFIG)
}
]

View File

@@ -3,16 +3,17 @@
*/
const CONFIG = {
// 菜单配置
MOVIE_MENU_CATEGORY: true, // 显示分类
MOVIE_MENU_TAG: true, // 显示标签
MOVIE_MENU_ARCHIVE: true, // 显示归档
MOVIE_MENU_SEARCH: true, // 显示搜索
MOVIE_HOME_BACKGROUND: false, // 首页是否显示背景图, 默认关闭
PHOTO_MENU_CATEGORY: true, // 显示分类
PHOTO_MENU_TAG: true, // 显示标签
PHOTO_MENU_ARCHIVE: true, // 显示归档
PHOTO_MENU_SEARCH: true, // 显示搜索
PHOTO_HOME_BACKGROUND: false, // 首页是否显示背景图, 默认关闭
MOVIE_ARTICLE_RECOMMEND: true, // 推荐关联内容在文章底部
MOVIE_VIDEO_COMBINE: true, // 聚合视频开启后一篇文章内的多个含caption的视频会被合并到文章开头并展示分集按钮
MOVIE_VIDEO_COMBINE_SHOW_PAGE_FORCE: false, // 即使只有一集也显示集数切换按钮
PHOTO_ARTICLE_RECOMMEND: true, // 推荐关联内容在文章底部
PHOTO_VIDEO_COMBINE: true, // 聚合视频开启后一篇文章内的多个含caption的视频会被合并到文章开头并展示分集按钮
PHOTO_VIDEO_COMBINE_SHOW_PAGE_FORCE: false, // 即使只有一集也显示集数切换按钮
PHOTO_PREVIEW_CATEGORY_COUNT: 16, // 首页最多展示的分类数量0为不限制
MOVIE_POST_LIST_COVER: true // 列表显示文章封面
PHOTO_POST_LIST_COVER: true // 列表显示文章封面
}
export default CONFIG

View File

@@ -58,7 +58,7 @@ const LayoutBase = props => {
// 首页背景图
const headerSlot =
router.route === '/' &&
siteConfig('MOVIE_HOME_BACKGROUND', null, CONFIG) ? (
siteConfig('PHOTO_HOME_BACKGROUND', null, CONFIG) ? (
<HomeBackgroundImage />
) : null
@@ -157,7 +157,9 @@ const LayoutSlug = props => {
// 用js 实现将页面中的多个视频聚合为一个分集的视频
function combineVideo() {
// 找到 id 为 notion-article 的元素
const notionArticle = document.querySelector('#article-wrapper #notion-article')
const notionArticle = document.querySelector(
'#article-wrapper #notion-article'
)
if (!notionArticle) return // 如果找不到对应的元素,则退出函数
// 找到所有的 .notion-asset-wrapper 元素
@@ -267,7 +269,7 @@ const LayoutSlug = props => {
// 显示分集按钮 大于1集才显示 ;或者用户 要求强制显示
if (
figCaptionWrapper.children.length > 1 ||
siteConfig('MOVIE_VIDEO_COMBINE_SHOW_PAGE_FORCE', false, CONFIG)
siteConfig('PHOTO_VIDEO_COMBINE_SHOW_PAGE_FORCE', false, CONFIG)
) {
videoWrapper.appendChild(figCaptionWrapper)
}
@@ -289,19 +291,18 @@ const LayoutSlug = props => {
// 404
if (!post) {
setTimeout(
() => {
if (isBrowser) {
const article = document.querySelector('#article-wrapper #notion-article')
if (!article) {
router.push('/404').then(() => {
console.warn('找不到页面', router.asPath)
})
}
setTimeout(() => {
if (isBrowser) {
const article = document.querySelector(
'#article-wrapper #notion-article'
)
if (!article) {
router.push('/404').then(() => {
console.warn('找不到页面', router.asPath)
})
}
},
waiting404
)
}
}, waiting404)
}
return () => {
// 获取所有 class="video-wrapper" 的元素
@@ -316,23 +317,25 @@ const LayoutSlug = props => {
return (
<>
{!lock ? post && (
<div
id='article-wrapper'
className='px-2 max-w-5xl 2xl:max-w-[70%] mx-auto'>
{/* 标题 */}
<ArticleHeader post={post} />
{/* 页面元素 */}
<NotionPage post={post} />
{/* 文章页脚 */}
<ArticleFooter post={post} />
{/* 推荐 */}
<BlogRecommend {...props} />
{/* 分享栏目 */}
<ShareBar post={post} />
{/* 评论区 */}
<Comment frontMatter={post} />
</div>
{!lock ? (
post && (
<div
id='article-wrapper'
className='px-2 max-w-5xl 2xl:max-w-[70%] mx-auto'>
{/* 标题 */}
<ArticleHeader post={post} />
{/* 页面元素 */}
<NotionPage post={post} />
{/* 文章页脚 */}
<ArticleFooter post={post} />
{/* 推荐 */}
<BlogRecommend {...props} />
{/* 分享栏目 */}
<ShareBar post={post} />
{/* 评论区 */}
<Comment frontMatter={post} />
</div>
)
) : (
<ArticleLock validPassword={validPassword} />
)}