Cxx0822/blog-press
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat:增加布局组件

Browse Source
This commit is contained in:
Cxx0822
2025-12-15 23:25:25 +08:00
parent 7dfd151119
commit 2bb60d00e8
35 changed files with 194 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
docs/.vitepress/theme/components/ArticleMetadata.vue
View File

@@ -1,10 +1,24 @@
<template>
<div v-if="!page.filePath.includes('index.md')" class="blog-stats">
<p class="content">
<svg t="1724571760788" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6125" width="16" height="16"><path d="M204.8 0h477.866667l273.066666 273.066667v614.4c0 75.093333-61.44 136.533333-136.533333 136.533333H204.8c-75.093333 0-136.533333-61.44-136.533333-136.533333V136.533333C68.266667 61.44 129.706667 0 204.8 0z m307.2 607.573333l68.266667 191.146667c13.653333 27.306667 54.613333 27.306667 61.44 0l102.4-273.066667c6.826667-20.48 0-34.133333-20.48-40.96s-34.133333 0-40.96 13.653334l-68.266667 191.146666-68.266667-191.146666c-13.653333-27.306667-54.613333-27.306667-68.266666 0l-68.266667 191.146666-68.266667-191.146666c-6.826667-13.653333-27.306667-27.306667-47.786666-20.48s-27.306667 27.306667-20.48 47.786666l102.4 273.066667c13.653333 27.306667 54.613333 27.306667 61.44 0l75.093333-191.146667z" fill="#1890FF" p-id="6126"></path><path d="M682.666667 0l273.066666 273.066667h-204.8c-40.96 0-68.266667-27.306667-68.266666-68.266667V0z" fill="#52C41A" p-id="6127"></path></svg>
字数: {{ wordCount }} 字
<svg t="1724572797268" class="icon" viewBox="0 0 1060 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="15031" width="16" height="16"><path d="M556.726857 0.256A493.933714 493.933714 0 0 0 121.929143 258.998857L0 135.021714v350.390857h344.649143L196.205714 334.482286a406.820571 406.820571 0 1 1-15.908571 312.649143H68.937143A505.819429 505.819429 0 1 0 556.726857 0.256z m-79.542857 269.531429v274.907428l249.197714 150.966857 42.422857-70.070857-212.114285-129.389714V269.787429h-79.542857z" fill="#FA8C16" p-id="15032"></path></svg>
时长: {{ readTime }} 分钟
</p>
</div>
</template>
<script lang="ts" setup>
import { computed, ref, onMounted } from 'vue'
import { computed, ref, onMounted, watch } from 'vue'
import { countWord } from '../utils/functions'
import { useData } from 'vitepress'
const wordCount = ref(0)
const imageCount = ref(0)
const { page } = useData()
const wordTime = computed(() => {
return ((wordCount.value / 275) * 60)
})
@@ -23,7 +37,6 @@ const readTime = computed(() => {
return Math.ceil((wordTime.value + imageTime.value) / 60)
})
function analyze() {
document.querySelectorAll('.meta-des').forEach(v => v.remove())
const docDomContainer = window.document.querySelector('#VPContent')
@@ -35,28 +48,25 @@ function analyze() {
wordCount.value = countWord(words)
}
watch(() => page.value.title, () => {
// 路径变化时执行
analyze()
})
onMounted(() => {
// 初始化时执行一次
analyze()
})
</script>
<style scoped>
.blog-stats {
color: var(--vp-c-text-2);
font-size: 15px;
}
<template>
<div class="word">
<p>
<svg t="1724571760788" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6125" width="16" height="16"><path d="M204.8 0h477.866667l273.066666 273.066667v614.4c0 75.093333-61.44 136.533333-136.533333 136.533333H204.8c-75.093333 0-136.533333-61.44-136.533333-136.533333V136.533333C68.266667 61.44 129.706667 0 204.8 0z m307.2 607.573333l68.266667 191.146667c13.653333 27.306667 54.613333 27.306667 61.44 0l102.4-273.066667c6.826667-20.48 0-34.133333-20.48-40.96s-34.133333 0-40.96 13.653334l-68.266667 191.146666-68.266667-191.146666c-13.653333-27.306667-54.613333-27.306667-68.266666 0l-68.266667 191.146666-68.266667-191.146666c-6.826667-13.653333-27.306667-27.306667-47.786666-20.48s-27.306667 27.306667-20.48 47.786666l102.4 273.066667c13.653333 27.306667 54.613333 27.306667 61.44 0l75.093333-191.146667z" fill="#1890FF" p-id="6126"></path><path d="M682.666667 0l273.066666 273.066667h-204.8c-40.96 0-68.266667-27.306667-68.266666-68.266667V0z" fill="#52C41A" p-id="6127"></path></svg>
字数: {{ wordCount }} 字
<svg t="1724572797268" class="icon" viewBox="0 0 1060 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="15031" width="16" height="16"><path d="M556.726857 0.256A493.933714 493.933714 0 0 0 121.929143 258.998857L0 135.021714v350.390857h344.649143L196.205714 334.482286a406.820571 406.820571 0 1 1-15.908571 312.649143H68.937143A505.819429 505.819429 0 1 0 556.726857 0.256z m-79.542857 269.531429v274.907428l249.197714 150.966857 42.422857-70.070857-212.114285-129.389714V269.787429h-79.542857z" fill="#FA8C16" p-id="15032"></path></svg>
时长: {{ readTime }} 分钟
</p>
</div>
</template>
<style>
.word {
color: var(--vp-c-text-2);
font-size: 15px;
.content {
margin-bottom: 5px;
}
.icon {

16
docs/.vitepress/theme/components/MyLayout.vue Normal file
View File

@@ -0,0 +1,16 @@
<script setup lang="ts">
import DefaultTheme from 'vitepress/theme'
import ArticleMetadat from './ArticleMetadata.vue';
</script>
<template>
<DefaultTheme.Layout v-bind="$attrs">
<template #doc-before>
<ArticleMetadat />
</template>
</DefaultTheme.Layout>
</template>
<style scoped>
</style>