添加根目录显示在导航栏

app/components/ContentDirectory.vue

@@ -0,0 +1,52 @@
+<template>
+  <div>
+    <h3 class="text-xs font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-3 px-1">
+      文档目录
+    </h3>
+    
+    <UContentNavigation 
+      :navigation="directoryNavigation" 
+      highlight 
+      color="primary"
+      variant="pill"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import type { ContentNavigationItem } from '@nuxt/content'
+
+// 获取导航数据
+const navigation = inject<Ref<ContentNavigationItem[]>>('navigation')
+
+// 处理导航数据，只显示一级目录和根目录文件
+const directoryNavigation = computed(() => {
+  if (!navigation?.value) return []
+  
+  return navigation.value.map(item => {
+    // 如果是根目录文件（没有 children），直接返回
+    if (!item.children || item.children.length === 0) {
+      return {
+        title: item.title,
+        path: item.path,
+        icon: (item.icon as string) || 'i-lucide-file-text',
+        active: Boolean(item.active)
+      }
+    }
+    
+    // 如果是一级目录，只保留目录本身，不显示子项
+    return {
+      title: item.title,
+      path: item.path,
+      icon: (item.icon as string) || 'i-lucide-folder',
+      active: Boolean(item.active),
+      // 不包含 children，这样就不会展开显示子项
+      children: []
+    }
+  }).filter(item => item.title && item.path) // 过滤掉空项
+})
+
+// 调试信息
+// console.log('ContentDirectory: Navigation data:', navigation.value)
+// console.log('ContentDirectory: Processed navigation:', directoryNavigation.value)
+</script>