feat: implement cross-table search and debounced dynamic search for borrow and return records

inventory-web/src/views/outbound/index.vue

@@ -4,10 +4,11 @@
       <el-input
           v-model="listQuery.keyword"
           placeholder="单号/姓名/SKU/名称/规格"
-          style="width: 200px;"
+          style="width: 250px;"
           class="filter-item"
           clearable
-          @keyup.enter="fetchData"
+          @input="debouncedSearch"
+          @clear="handleClearSearch"
       />
       <el-date-picker
           v-model="listQuery.dateRange"
@@ -118,13 +119,36 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, reactive } from 'vue'
+import { ref, onMounted, reactive, onBeforeUnmount } from 'vue'
 import { getOutboundList } from '@/api/outbound'
 import { Picture } from '@element-plus/icons-vue'
 import { useUserStore } from '@/stores/user'
 
 const userStore = useUserStore()
 
+// 防抖定时器
+let debounceTimer: ReturnType<typeof setTimeout> | null = null
+
+// 防抖搜索函数
+const debouncedSearch = () => {
+  if (debounceTimer) {
+    clearTimeout(debounceTimer)
+  }
+  debounceTimer = setTimeout(() => {
+    listQuery.page = 1
+    fetchData()
+  }, 500)
+}
+
+// 清空搜索时立即触发查询
+const handleClearSearch = () => {
+  if (debounceTimer) {
+    clearTimeout(debounceTimer)
+  }
+  listQuery.page = 1
+  fetchData()
+}
+
 // 列与权限Code的映射关系（数据库中的code）
 const permissionMap: Record<string, string> = {
   outbound_no: 'outbound_list:outbound_no',
@@ -213,6 +237,14 @@ const getTagType = (type: string) => {
 onMounted(() => {
   fetchData()
 })
+
+// 组件销毁前清理定时器，防止内存泄漏
+onBeforeUnmount(() => {
+  if (debounceTimer) {
+    clearTimeout(debounceTimer)
+    debounceTimer = null
+  }
+})
 </script>
 
 <style scoped>