From 23336d1e4452747a5d82f0d129abd97b62164e18 Mon Sep 17 00:00:00 2001
From: Aresn <admin@aresn.com>
Date: Mon, 3 Jun 2024 14:20:15 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B8=85=E7=A9=BA=E6=90=9C=E7=B4=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/i/library/Header.vue | 20 ++++++++++++++++++--
 pages/library/index.vue         |  2 +-
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/components/i/library/Header.vue b/components/i/library/Header.vue
index 17f022e..b9a1ee4 100644
--- a/components/i/library/Header.vue
+++ b/components/i/library/Header.vue
@@ -28,12 +28,24 @@
                     <div class="flex" v-if="!collect">
                         <UInput
                             name="queryInput"
+                            :ui="{ icon: { trailing: { pointer: '' } } }"
                             v-model="searchQuery"
                             :loading="searchLoading"
                             icon="i-heroicons-magnifying-glass-20-solid"
                             placeholder="搜索你的主题..."
                             size="md"
-                        />
+                        >
+                            <template #trailing>
+                                <UButton
+                                    v-show="searchQuery !== ''"
+                                    color="gray"
+                                    variant="link"
+                                    icon="i-heroicons-x-mark-20-solid"
+                                    :padded="false"
+                                    @click="handleClear"
+                                />
+                            </template>
+                        </UInput>
                     </div>
                 </div>
             </div>
@@ -61,7 +73,7 @@ defineProps({
         default: ''
     }
 })
-const emit = defineEmits(['search'])
+const emit = defineEmits(['search', 'clear'])
 const searchQuery = ref('')
 const searchLoading = ref(false)
 defineShortcuts({
@@ -75,4 +87,8 @@ defineShortcuts({
         }
     }
 })
+function handleClear () {
+    searchQuery.value = ''
+    emit('clear')
+}
 </script>
diff --git a/pages/library/index.vue b/pages/library/index.vue
index c7303a4..4ab86ab 100644
--- a/pages/library/index.vue
+++ b/pages/library/index.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="w-full items-center flex flex-col">
-        <ILibraryHeader @search="handleSearch" />
+        <ILibraryHeader @search="handleSearch" @clear="getThreadData" />
         <div class="container max-w-screen-lg flex flex-col p-6">
             <div class="flex gap-10">
                 <div class="flex flex-col flex-grow">
-- 
GitLab