hexo:封装统计卡

This commit is contained in:
tangly1024
2022-03-17 13:28:35 +08:00
parent 14882b5afd
commit 83fd240101
3 changed files with 36 additions and 30 deletions

View File

@@ -45,9 +45,9 @@ const LayoutBase = (props) => {
{headerSlot}
<main id='wrapper' className='flex w-full justify-center py-8 min-h-screen'>
<main id='wrapper' className='w-full justify-center py-8 min-h-screen'>
<div id='container-inner' className='pt-14 w-full mx-auto flex justify-between space-x-4 max-w-7xl'>
<div id='container-inner' className='pt-14 w-full mx-auto lg:flex justify-between space-x-4 max-w-7xl'>
<div className='flex-grow w-full'>{children}</div>
<SideRight {...props}/>
</div>

View File

@@ -0,0 +1,30 @@
import Card from './Card'
export function AnalyticsCard (props) {
const { postCount } = props
return <Card>
<div className='ml-2 mb-3 font-sans'>
<i className='fas fa-chart-area' /> 统计
</div>
<div className='text-xs font-sans font-light justify-center mx-7'>
<div className='inline'>
<div className='flex justify-between'>
<div>文章数:</div>
<div>{postCount}</div>
</div>
</div>
<div className='hidden busuanzi_container_page_pv ml-2'>
<div className='flex justify-between'>
<div>访问量:</div>
<div className='busuanzi_value_page_pv' />
</div>
</div>
<div className='hidden busuanzi_container_site_uv ml-2'>
<div className='flex justify-between'>
<div>访客数:</div>
<div className='busuanzi_value_site_uv' />
</div>
</div>
</div>
</Card>
}

View File

@@ -4,11 +4,11 @@ import LatestPostsGroup from './LatestPostsGroup'
import TagGroups from './TagGroups'
import Catalog from './Catalog'
import { InfoCard } from './InfoCard'
import { AnalyticsCard } from './AnalyticsCard'
export default function SideRight (props) {
const {
post,
postCount,
currentCategory,
categories,
latestPosts,
@@ -19,33 +19,9 @@ export default function SideRight (props) {
} = props
return (
<div className={'w-80 space-y-4 hidden lg:block'}>
<div className={'w-80 space-y-4'}>
<InfoCard {...props}/>
<Card>
<div className='ml-2 mb-3 font-sans'>
<i className='fas fa-chart-area' /> 统计
</div>
<div className='text-xs font-sans font-light justify-center mx-7'>
<div className='inline'>
<div className='flex justify-between'>
<div>文章数:</div>
<div>{postCount}</div>
</div>
</div>
<div className='hidden busuanzi_container_page_pv ml-2'>
<div className='flex justify-between'>
<div>访问量:</div>
<div className='busuanzi_value_page_pv' />
</div>
</div>
<div className='hidden busuanzi_container_site_uv ml-2'>
<div className='flex justify-between'>
<div>访客数:</div>
<div className='busuanzi_value_site_uv' />
</div>
</div>
</div>
</Card>
<AnalyticsCard {...props}/>
{showCategory && (
<Card>
@@ -68,7 +44,7 @@ export default function SideRight (props) {
</Card>}
{post && post.toc && (
<Card className='sticky top-12'>
<Card className='sticky top-20'>
<Catalog toc={post.toc} />
</Card>
)}