日期查询

src/views/Department-entry/Medical-examination-vehicle.vue

@@ -20,7 +20,13 @@
               >
                 同步
               </el-button>
-              <el-button type="success" size="small" @click="handleRefresh" :icon="Refresh">
+              <el-button 
+                type="success" 
+                size="small" 
+                @click="handleRefresh" 
+                :icon="Refresh"
+                :loading="loading"
+              >
                 刷新列表
               </el-button>
             </div>
@@ -29,23 +35,48 @@
 
         <!-- 添加检查状态筛选 -->
         <div class="status-filter">
-          <el-radio-group v-model="statusFilter" @change="handleStatusFilterChange">
+          <el-radio-group 
+            v-model="statusFilter" 
+            @change="handleStatusFilterChange"
+            :disabled="loading"
+          >
             <el-radio label="0">待检查</el-radio>
             <el-radio label="1">已检查</el-radio>
             <el-radio label="2">已打印</el-radio>
           </el-radio-group>
         </div>
 
+        <!-- 添加日期选择器 -->
+        <div class="date-picker-container" v-if="statusFilter === '2'">
+          <el-date-picker
+            v-model="dateRange"
+            type="daterange"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            value-format="YYYY-MM-DD"
+            @change="handleDateRangeChange"
+            size="small"
+            style="width: 100%"
+            :disabled="loading"
+          />
+        </div>
+
         <!-- 简化体检编号搜索框 -->
         <div class="search-box medical-sn-search">
           <input
             v-model="searchQuery"
             placeholder="请输入姓名/体检编号/身份证"
             @keydown.enter="handleLocalSearch"
+            :disabled="loading"
           />
         </div>
       </div>
       <div class="list-content">
+        <div v-if="loading" class="loading-container">
+          <el-skeleton :rows="5" animated />
+        </div>
+        <template v-else>
           <div
             v-for="patient in filteredPatients"
             :key="patient.id"
@@ -62,6 +93,7 @@
             </div>
             <!--<span class="card-id">{{ patient.cardId }}</span>-->
           </div>
+        </template>
         <!-- 将分页组件移到list-content外部底部 -->
         <div class="pagination-container">
           <el-pagination
@@ -416,13 +448,14 @@ import { PatientitemsApi } from '@/api/inspect/inspectpatientitems'
 import { getUserProfile } from '@/api/system/user/profile'
 import ExamImages from './Exam_images.vue'
 import { ArrowDown, Refresh, RefreshRight } from '@element-plus/icons-vue'
-import All from './All.vue' // 导入All组件用于超声、心电图等
+import All from './All.vue'
-import { PacsDataApi } from '@/api/inspect/inspectpacsdata' // 导入PacsDataApi
+import { PacsDataApi } from '@/api/inspect/inspectpacsdata'
-import { getStrDictOptions } from '@/utils/dict' //导入字典
+import { getStrDictOptions } from '@/utils/dict'
-import Summary from './summary.vue' // 导入Summary组件用于汇总页面
+import Summary from './summary.vue'
 import TemplateDrawer from './Drawer-Template.vue'
 import { updateItemsAnalyse } from '@/api/summary'
-import { DoctorApi } from '@/api/inspect/inspectdoctor' // 添加导入语句
+import { DoctorApi } from '@/api/inspect/inspectdoctor'
+import { debounce } from 'lodash-es' // 添加lodash-es的debounce
 
 const dialogTitle = ref('体检报告')
 const { t } = useI18n() // 国际化
@@ -562,12 +595,22 @@ const handleLocalSearch = async () => {
 
     // 获取搜索结果
     const res = await PatientApi.getPatientInfoByMedicalSn(searchQuery.value)
-    // 根据返回的数据结构调整处理逻辑
+    
+    // 检查返回的数据
     if (res) {
-      // 检查返回的是单个对象还是列表
+      if (Array.isArray(res)) {
         patients.value = res
         total.value = res.length
+      } else if (res.list && Array.isArray(res.list)) {
+        patients.value = res.list
+        total.value = res.total || res.list.length
       } else {
+        console.warn('搜索返回的数据格式不符合预期:', res)
+        patients.value = []
+        total.value = 0
+      }
+    } else {
+      console.warn('搜索返回的数据为空')
       patients.value = []
       total.value = 0
     }
@@ -575,8 +618,16 @@ const handleLocalSearch = async () => {
     loading.close()
   } catch (error) {
     console.error('搜索患者失败:', error)
-    ElMessage.error('搜索患者失败')
+    if (error.response) {
-    loading.close()
+      console.error('服务器响应错误:', error.response)
+      ElMessage.error(`搜索失败: ${error.response.status} ${error.response.statusText}`)
+    } else if (error.request) {
+      console.error('请求错误:', error.request)
+      ElMessage.error('网络请求失败，请检查网络连接')
+    } else {
+      console.error('其他错误:', error.message)
+      ElMessage.error('搜索失败: ' + error.message)
+    }
   }
 }
 
@@ -596,11 +647,25 @@ const getPatientList = async () => {
 
     const res = await PatientApi.getPatientPage(params)
 
-    if (res.list && res.list.length > 0) {
+    if (res) {
+      // 检查返回的数据结构
+      if (Array.isArray(res.list)) {
         patients.value = res.list
         originalPatients.value = res.list
-      total.value = res.total
+        total.value = res.total || res.list.length
+      } else if (Array.isArray(res)) {
+        // 如果直接返回数组
+        patients.value = res
+        originalPatients.value = res
+        total.value = res.length
       } else {
+        console.warn('返回的数据格式不符合预期:', res)
+        patients.value = []
+        originalPatients.value = []
+        total.value = 0
+      }
+    } else {
+      console.warn('返回的数据为空')
       patients.value = []
       originalPatients.value = []
       total.value = 0
@@ -609,7 +674,17 @@ const getPatientList = async () => {
     loading.close()
   } catch (error) {
     console.error('获取患者列表出错:', error)
-    ElMessage.error('获取患者列表失败')
+    // 检查错误类型
+    if (error.response) {
+      console.error('服务器响应错误:', error.response)
+      ElMessage.error(`服务器错误: ${error.response.status} ${error.response.statusText}`)
+    } else if (error.request) {
+      console.error('请求错误:', error.request)
+      ElMessage.error('网络请求失败，请检查网络连接')
+    } else {
+      console.error('其他错误:', error.message)
+      ElMessage.error('获取患者列表失败: ' + error.message)
+    }
   }
 }
 
@@ -1387,8 +1462,9 @@ const handleRefresh = async (e) => {
       biochemical: { summary: '' }
     }
 
-    // 清空搜索栏
+    // 清空搜索栏和日期范围
     searchQuery.value = ''
+    dateRange.value = []
 
     // 重置状态筛选
     statusFilter.value = '0'
@@ -2054,37 +2130,56 @@ const filteredPatients = computed(() => {
   return result
 })
 
-// 添加状态筛选变化处理函数
+// 添加加载状态
-const handleStatusFilterChange = async (value) => {
+const loading = ref(false)
-  statusFilter.value = value
-  // 重置选中的患者
-  selectedPatient.value = null // 清空选中的患者
-  searchQuery.value = '' // 清空搜索词
-  pageNo.value = 1 // 重置页码为第一页
 
+// 添加防抖处理的状态切换函数
+const debouncedStatusChange = debounce(async (value) => {
   try {
+    loading.value = true
     const params = {
-      pageNo: pageNo.value,
+      pageNo: 1, // 重置为第一页
       pageSize: pageSize.value,
       isprint: null
     }
 
     // 根据不同的状态值设置不同的查询参数
     if (value === '2') {
-      // 已打印状态，查询 isprint 为 1 的数据
       params.isprint = 1
     } else {
-      // 其他状态，使用 status 字段查询
       params.status = value
     }
 
-    const res = await PatientApi.getPatientPage(params)
+    // 添加超时处理
+    const timeoutPromise = new Promise((_, reject) => {
+      setTimeout(() => reject(new Error('请求超时')), 10000) // 10秒超时
+    })
+
+    const fetchPromise = PatientApi.getPatientPage(params)
+    
+    const res = await Promise.race([fetchPromise, timeoutPromise])
+    
     patients.value = res.list
     total.value = res.total
+    selectedPatient.value = null
+    searchQuery.value = ''
+    dateRange.value = []
   } catch (error) {
     console.error('获取患者列表失败:', error)
+    if (error.message === '请求超时') {
+      ElMessage.error('请求超时，请稍后重试')
+    } else {
       ElMessage.error('获取患者列表失败')
     }
+  } finally {
+    loading.value = false
+  }
+}, 300) // 300ms的防抖延迟
+
+// 修改状态筛选变化处理函数
+const handleStatusFilterChange = (value) => {
+  statusFilter.value = value
+  debouncedStatusChange(value)
 }
 
 // 添加检查是否已完成的响应式引用
@@ -2384,6 +2479,36 @@ const getDoctorList = async () => {
     ElMessage.error('获取医生列表失败')
   }
 }
+
+// 添加日期范围选择相关的响应式引用
+const dateRange = ref([])
+
+// 添加日期范围变化处理函数
+const handleDateRangeChange = async (val) => {
+  try {
+    const params = {
+      pageNo: pageNo.value,
+      pageSize: pageSize.value,
+      isprint: 1 // 保持已打印状态
+    }
+
+    // 只有在有日期范围时才添加日期条件
+    if (val && val.length === 2) {
+      const [startDate, endDate] = val
+      params.printTimeRange = [
+        startDate ? `${startDate} 00:00:00` : null,
+        endDate ? `${endDate} 23:59:59` : null
+      ]
+    }
+
+    const res = await PatientApi.getPatientPage(params)
+    patients.value = res.list
+    total.value = res.total
+  } catch (error) {
+    console.error('按日期获取患者列表失败:', error)
+    ElMessage.error('获取患者列表失败')
+  }
+}
 </script>
 
 <style scoped>
@@ -3459,4 +3584,49 @@ const getDoctorList = async () => {
 .save-btn-container .el-button {
   margin-left: 0; /* 重置按钮的左边距 */
 }
+
+/* 添加日期选择器容器样式 */
+.date-picker-container {
+  padding: 10px 15px;
+  border-bottom: 1px solid #e6e6e6;
+}
+
+/* 修改日期选择器样式 */
+:deep(.el-date-editor.el-input) {
+  width: 100%;
+}
+
+:deep(.el-date-editor .el-range-separator) {
+  padding: 0 5px;
+}
+
+:deep(.el-date-editor .el-range-input) {
+  width: 40%;
+}
+
+/* 添加加载状态样式 */
+.loading-container {
+  padding: 20px;
+}
+
+:deep(.el-skeleton) {
+  width: 100%;
+}
+
+:deep(.el-skeleton__item) {
+  margin-bottom: 10px;
+}
+
+/* 添加禁用状态样式 */
+:deep(.el-radio-group.is-disabled) {
+  opacity: 0.7;
+}
+
+:deep(.el-date-picker.is-disabled) {
+  opacity: 0.7;
+}
+
+:deep(.el-input.is-disabled) {
+  opacity: 0.7;
+}
 </style>