优化列表页过滤栏

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 {