From b9363f6f37bc4f58655b9001cdfdcb701900b465 Mon Sep 17 00:00:00 2001
From: jingrow <support@jingrow.com>
Date: Sat, 25 Oct 2025 23:05:26 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E5=88=97=E8=A1=A8=E9=A1=B5?=
 =?UTF-8?q?=E8=BF=87=E6=BB=A4=E6=A0=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/core/components/FilterBar.vue         | 26 ++++++++++++++-----
 1 file changed, 19 insertions(+), 7 deletions(-)

diff --git a/apps/jingrow/frontend/src/core/components/FilterBar.vue b/apps/jingrow/frontend/src/core/components/FilterBar.vue
index 83f89ab..0f1b9a0 100644
--- a/apps/jingrow/frontend/src/core/components/FilterBar.vue
+++ b/apps/jingrow/frontend/src/core/components/FilterBar.vue
@@ -21,7 +21,8 @@
               :placeholder="getFieldPlaceholder(field)"
               clearable
               size="small"
-              @input="onFilterChange"
+              @blur="onFilterChange"
+              @update:value="onInputChange"
             />
           </div>
           
@@ -34,6 +35,7 @@
               clearable
               size="small"
               @update:value="onFilterChange"
+              @clear="onFilterChange"
             />
           </div>
           
@@ -47,6 +49,7 @@
               clearable
               size="small"
               @update:value="onFilterChange"
+              @clear="onFilterChange"
             />
           </div>
           
@@ -62,6 +65,7 @@
               clearable
               size="small"
               @update:value="onFilterChange"
+              @clear="onFilterChange"
             />
           </div>
           
@@ -72,7 +76,8 @@
               :placeholder="getFieldPlaceholder(field)"
               clearable
               size="small"
-              @update:value="onFilterChange"
+              @blur="onFilterChange"
+              @update:value="onInputChange"
             />
           </div>
           
@@ -84,6 +89,7 @@
               clearable
               size="small"
               @update:value="onFilterChange"
+              @clear="onFilterChange"
             />
           </div>
           
@@ -94,7 +100,8 @@
               :placeholder="getFieldPlaceholder(field)"
               clearable
               size="small"
-              @input="onFilterChange"
+              @blur="onFilterChange"
+              @update:value="onInputChange"
             />
           </div>
         </div>
@@ -247,6 +254,14 @@ function onFilterChange() {
   emit('filter-change', { ...filters.value })
 }
 
+// 输入框值变化处理（用于清除按钮）
+function onInputChange(value: any) {
+  // 如果值被清空（null, undefined, 空字符串），立即触发过滤
+  if (value === null || value === undefined || value === '') {
+    onFilterChange()
+  }
+}
+
 // 清除所有过滤条件
 function clearAllFilters() {
   filters.value = {}
@@ -313,8 +328,6 @@ watch(() => props.modelValue, (newValue) => {
   display: flex;
   align-items: center;
   padding: 4px 8px;
-  background: #f9fafb;
-  border: 1px solid #e5e7eb;
   border-radius: 4px;
   transition: all 0.2s ease;
   min-width: 0;
@@ -322,11 +335,10 @@ watch(() => props.modelValue, (newValue) => {
 
 .filter-item.has-value {
   background: #f0f9ff;
-  border-color: #3b82f6;
 }
 
 .filter-item:hover {
-  border-color: #cbd5e1;
+  background: #f3f4f6;
 }
 
 .filter-input {