Forráskód Böngészése

feat(manholeCover): 更新案件列表搜索功能

- 将单一搜索框拆分为案件编号和设备位置两个独立搜索框
- 添加设备位置搜索图标并调整样式布局
- 新增 searchEquipmentLocation 响应式变量管理设备位置搜索状态
- 修改 loadCases 函数适配新的搜索参数结构
- 优化搜索输入框宽度配置提升界面体验
nahida 4 napja
szülő
commit
31c94061d0

+ 27 - 6
src/views/subSystem/manholeCover/caseHandling/circulation.vue

@@ -24,9 +24,28 @@
 
     <div class="flex gap-5">
       <div class="w-[380px] flex flex-col overflow-hidden rounded-[20px] bg-white" v-loading="loading">
-        <div class="flex justify-between border-b border-[#e9ecef] px-4 py-4 font-600">
+        <div class="flex items-center justify-between gap-3 border-b border-[#e9ecef] px-4 py-4 font-600">
           <span>案件列表</span>
-          <el-input v-model="searchKeyword" placeholder="搜索案件编号/设备位置" :prefix-icon="Search" clearable size="small" class="w-[180px]" @keyup.enter="loadCases" />
+          <div class="flex items-center gap-2">
+            <el-input
+              v-model="searchCaseNo"
+              placeholder="案件编号"
+              :prefix-icon="Search"
+              clearable
+              size="small"
+              class="w-[140px]"
+              @keyup.enter="loadCases"
+            />
+            <el-input
+              v-model="searchEquipmentLocation"
+              placeholder="设备位置描述"
+              :prefix-icon="Location"
+              clearable
+              size="small"
+              class="w-[140px]"
+              @keyup.enter="loadCases"
+            />
+          </div>
         </div>
         <div class="flex-1 overflow-y-auto p-3">
           <div
@@ -126,7 +145,8 @@ import {getManholeCaseDetail, getManholeCasePage} from '@/api/pipeNetwork/basic'
 const cases = ref([])
 const loading = ref(false)
 const detailLoading = ref(false)
-const searchKeyword = ref('')
+const searchCaseNo = ref('')
+const searchEquipmentLocation = ref('')
 const statusFilter = ref('')
 const currentPage = ref(1)
 const pageSize = 5
@@ -242,12 +262,13 @@ const completedCount = computed(() => cases.value.filter(item => item.statusKey
 async function loadCases() {
   loading.value = true
   try {
-    const keyword = searchKeyword.value.trim()
+    const caseNo = searchCaseNo.value.trim()
+    const equipmentLocation = searchEquipmentLocation.value.trim()
     const res = await getManholeCasePage({
       pageNum: 1,
       pageSize: 200,
-      caseNo: keyword || undefined,
-      equipmentLocation: keyword || undefined
+      caseNo: caseNo || undefined,
+      equipmentLocation: equipmentLocation || undefined
     })
     const records = Array.isArray(res?.data?.records) ? res.data.records : []
     cases.value = records.map(item => normalizeCase(item))