优化 头部便签管理点击区域；

补充注释；

src/pages/FolderPage.vue

@@ -29,12 +29,14 @@
 
 <script setup>
 import { ref, computed, onMounted } from 'vue'
+import { useRouter } from 'vue-router'
 import { useAppStore } from '../stores/useAppStore'
 import { search, closeCircle } from 'ionicons/icons'
 import FolderManage from '../components/FolderManage.vue'
 import Header from '../components/Header.vue'
 
 const store = useAppStore()
+const router = useRouter()
 
 // 加载初始数据
 onMounted(() => {
@@ -44,7 +46,8 @@ onMounted(() => {
 const searchQuery = ref('')
 const selectedFolder = ref('all')
 
-// Calculate note count for each folder
+// 计算每个文件夹中的便签数量
+// 遍历所有自定义文件夹，统计每个文件夹中的便签数量
 const foldersWithCount = computed(() => {
   return store.folders.map(folder => {
     const noteCount = store.notes.filter(note => note.folderId === folder.id).length
@@ -55,13 +58,17 @@ const foldersWithCount = computed(() => {
   })
 })
 
-// Add default folders at the beginning
+// 添加默认文件夹（全部便签、加星便签、回收站）到列表开头
+// 计算全部便签数量
 const allNotesCount = computed(() => store.notes.length)
+// 计算加星便签数量
 const starredNotesCount = computed(() => store.notes.filter(note => note.isStarred).length)
-// Assuming we have a way to track deleted notes in the future
+// 回收站便签数量（暂未实现完整功能）
 const trashNotesCount = 0
+// 归档便签数量（暂未实现完整功能）
 const archiveCount = 0
 
+// 合并默认文件夹和自定义文件夹
 const foldersWithAllNotes = computed(() => {
   return [
     { id: 'all', name: '全部便签', noteCount: allNotesCount.value, createdAt: new Date() },
@@ -74,26 +81,28 @@ const foldersWithAllNotes = computed(() => {
 const handleFolderPress = folderId => {
   // 更新选中的文件夹状态
   selectedFolder.value = folderId
-  // 在实际应用中，这里会将选中的文件夹传递回NoteListScreen
-  // 通过导航参数传递选中的文件夹ID
-  window.location.hash = `#/notes?folder=${folderId}`
+  // 使用vue-router导航回便签列表页面，并传递文件夹参数
+  router.push(`/notes?folder=${folderId}`)
 }
 
+// 处理添加文件夹按钮点击事件
+// 在完整实现中，这里会打开文件夹创建对话框
 const handleAddFolder = () => {
-  // In a full implementation, this would open a folder creation dialog
   console.log('Add folder pressed')
 }
 
+// 处理搜索功能
+// 在完整实现中，这里会根据搜索关键词过滤文件夹
 const handleSearch = () => {
-  // In a full implementation, this would filter folders based on searchQuery
   console.log('Search for:', searchQuery.value)
 }
 
 const handleBackPress = () => {
-  window.history.back()
+  router.back()
 }
 
-// Filter folders based on search query
+// 根据搜索关键词过滤文件夹
+// 将文件夹名称转换为小写进行模糊匹配
 const filteredFolders = computed(() => {
   return foldersWithAllNotes.value.filter(folder => folder.name.toLowerCase().includes(searchQuery.value.toLowerCase()))
 })