修改博文

app/components/blog/BlogLists.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 // 定义组件参数类型
 interface Props {
-  perPage?: number  // 每页显示的文章数，默认 12
+  perPage?: number // 每页显示的文章数，默认 12
   maxPages?: number // 最大页数，默认 15
 }
 
@@ -15,7 +15,7 @@ const props = withDefaults(defineProps<Props>(), {
 const currentPage = ref(1)
 
 // 获取所有博客文章
-const { data: allArticles, pending } = await useAsyncData('blog-all-articles', () => {
+const { data: allArticles } = await useAsyncData('blog-all-articles', () => {
   return queryCollection('blog')
     .select('path', 'title', 'description', 'img', 'date')
     .where('path', 'NOT LIKE', '%navigation%')
@@ -25,13 +25,13 @@ const { data: allArticles, pending } = await useAsyncData('blog-all-articles', (
 // 按时间排序的文章列表
 const sortedArticles = computed(() => {
   if (!allArticles.value) return []
-  
+
   return [...allArticles.value].sort((a, b) => {
     // 如果没有日期，排在最后
     if (!a.date && !b.date) return 0
     if (!a.date) return 1
     if (!b.date) return -1
-    
+
     // 按日期降序排列（最新的在前面）
     const dateA = new Date(a.date)
     const dateB = new Date(b.date)
@@ -49,10 +49,10 @@ const totalPages = computed(() => {
 // 计算当前页显示的文章
 const paginatedArticles = computed(() => {
   if (!sortedArticles.value) return []
-  
+
   const startIndex = (currentPage.value - 1) * props.perPage
   const endIndex = startIndex + props.perPage
-  
+
   return sortedArticles.value.slice(startIndex, endIndex)
 })
 
@@ -81,7 +81,7 @@ const getCategoryFromPath = (path: string) => {
 // 转换文章数据为 UBlogPosts 需要的格式
 const blogPosts = computed(() => {
   if (!paginatedArticles.value) return []
-  
+
   return paginatedArticles.value.map(article => ({
     title: article.title || '未命名文章',
     description: article.description || '',
@@ -119,9 +119,12 @@ watch(sortedArticles, () => {
       <!-- 有文章时显示内容 -->
       <div v-if="sortedArticles && sortedArticles.length > 0">
         <div class="">
-          <UBlogPosts orientation="vertical" :posts="blogPosts" />
+          <UBlogPosts
+            orientation="vertical"
+            :posts="blogPosts"
+          />
         </div>
-        
+
         <!-- 分页控件 -->
         <div class="flex justify-center pt-8 border-t border-gray-200 dark:border-gray-700">
           <div class="pt-6">
@@ -143,4 +146,3 @@ watch(sortedArticles, () => {
     </div>
   </div>
 </template>
-