搜索栏组件更名；

优化 便签列表页布局调整；

src/pages/NoteEditorPage.vue

@@ -12,28 +12,8 @@
 
       <!-- 富文本编辑器 -->
       <div class="editor-container">
-        <RichTextEditor 
-          ref="editorRef" 
-          :modelValue="content" 
-          @update:modelValue="handleContentChange"
-          class="rich-text-editor" />
+        <RichTextEditor ref="editorRef" :modelValue="content" @update:modelValue="handleContentChange" class="rich-text-editor" />
       </div>
-
-      <ion-alert
-        :is-open="showAlert"
-        @didDismiss="() => setShowAlert(false)"
-        header="未保存的更改"
-        message="您有未保存的更改，确定要丢弃吗？"
-        :buttons="[
-          {
-            text: '取消',
-            role: 'cancel',
-          },
-          {
-            text: '丢弃',
-            handler: () => window.history.back(),
-          },
-        ]"></ion-alert>
     </div>
   </ion-page>
 </template>
@@ -63,7 +43,7 @@ const editorRef = ref(null)
 
 // 设置便签内容的函数
 // 用于在编辑器中加载指定便签的内容
-const setNoteContent = async (noteId) => {
+const setNoteContent = async noteId => {
   // 确保store数据已加载，如果便签列表为空则先加载数据
   if (store.notes.length === 0) {
     await store.loadData()
@@ -104,19 +84,27 @@ onMounted(async () => {
 })
 
 // 监听noteId变化，确保在编辑器准备好后设置内容
-watch(noteId, async (newNoteId) => {
+watch(
+  noteId,
+  async newNoteId => {
     console.log('Note ID changed:', newNoteId)
     if (newNoteId) {
       await setNoteContent(newNoteId)
     }
-}, { immediate: true })
+  },
+  { immediate: true }
+)
 
 // 监听store变化，确保在store加载后设置内容
-watch(() => store.notes, async (newNotes) => {
+watch(
+  () => store.notes,
+  async newNotes => {
     if (noteId.value && newNotes.length > 0) {
       await setNoteContent(noteId.value)
     }
-}, { immediate: true })
+  },
+  { immediate: true }
+)
 
 // 检查是否正在编辑现有便签
 // 如果noteId存在则表示是编辑模式，否则是新建模式
@@ -135,11 +123,15 @@ onMounted(() => {
 })
 
 // 监听store变化，确保在store加载后设置内容
-watch(() => store.notes, async (newNotes) => {
+watch(
+  () => store.notes,
+  async newNotes => {
     if (noteId.value && newNotes.length > 0) {
       await setNoteContent(noteId.value)
     }
-}, { immediate: true })
+  },
+  { immediate: true }
+)
 const showAlert = ref(false)
 
 // 防抖函数
@@ -154,14 +146,14 @@ const debounce = (func, delay) => {
 
 // 防抖处理内容变化
 // 延迟300ms更新内容，避免用户输入时频繁触发更新
-const debouncedHandleContentChange = debounce((newContent) => {
+const debouncedHandleContentChange = debounce(newContent => {
   content.value = newContent
   console.log('Content updated:', newContent)
 }, 300)
 
 // 监听编辑器内容变化
 // 当编辑器内容发生变化时调用此函数
-const handleContentChange = (newContent) => {
+const handleContentChange = newContent => {
   console.log('Editor content changed:', newContent)
   debouncedHandleContentChange(newContent)
 }

src/pages/NoteListPage.vue

@@ -14,7 +14,7 @@
           slot="fixed" />
           
         <!-- 悬浮文件夹列表 - 使用绝对定位实现 -->
-        <div v-if="isFolderExpanded" class="folder-list">
+        <div v-if="isFolderExpanded" class="folder-list" slot="fixed">
           <FolderManage
             :allCount="allNotesCount"
             :starredCount="starredNotesCount"
@@ -26,7 +26,7 @@
             :onTrashClick="handleTrashNotesClick" />
         </div>
         <!-- 点击外部区域收起文件夹列表的覆盖层 -->
-        <div v-if="isFolderExpanded" @click="() => setIsFolderExpanded(false)" class="folder-overlay"></div>
+        <div v-if="isFolderExpanded" @click="() => setIsFolderExpanded(false)" class="folder-overlay" slot="fixed"></div>
         <div class="search-container">
           <SearchBar v-model="searchQuery" @search="handleSearch" @clear="handleClearSearch" @focus="handleSearchFocus" @blur="handleSearchBlur" />
         </div>
@@ -58,7 +58,7 @@ import { useAppStore } from '../stores/useAppStore'
 import NoteItem from '../components/NoteItem.vue'
 import Header from '../components/Header.vue'
 import FolderManage from '../components/FolderManage.vue'
-import SearchBar from '../components/SearchBar.vue'
+import SearchBar from '../components/Search.vue'
 import { formatNoteListDate } from '../utils/dateUtils'
 import { IonContent, IonPage } from '@ionic/vue'