Fix Bug #544: AI修复

openhis-ui-vue3/src/views/outpatient/triage/TriageQueue.vue

@@ -1,36 +1,43 @@
 <template>
   <div class="triage-queue-container">
-    <el-card class="header-card">
-      <el-form :inline="true" class="query-form">
-        <el-form-item label="历史队列查询">
+    <el-card class="filter-card" shadow="never">
+      <el-form :inline="true" :model="queryParams" class="demo-form-inline">
+        <el-form-item label="排队状态">
+          <el-select v-model="queryParams.status" placeholder="全部状态" clearable style="width: 140px;">
+            <el-option label="候诊" value="WAITING" />
+            <el-option label="就诊中" value="IN_PROGRESS" />
+            <el-option label="完诊" value="COMPLETED" />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="排队时间">
           <el-date-picker
-            v-model="dateRange"
+            v-model="queryParams.dateRange"
             type="daterange"
             range-separator="至"
             start-placeholder="开始日期"
             end-placeholder="结束日期"
-            format="YYYY-MM-DD"
             value-format="YYYY-MM-DD"
-            class="date-range-picker"
+            style="width: 260px;"
           />
         </el-form-item>
         <el-form-item>
-          <el-button type="primary" @click="handleQuery" class="query-btn">查询</el-button>
+          <el-button type="primary" @click="handleQuery">查询</el-button>
+          <el-button @click="resetQuery">重置</el-button>
         </el-form-item>
       </el-form>
     </el-card>
 
-    <el-card class="table-card">
-      <el-table :data="queueList" style="width: 100%" class="queue-table" v-loading="loading">
-        <el-table-column prop="queue_no" label="排队号" width="100" />
-        <el-table-column prop="patient_name" label="患者姓名" />
-        <el-table-column prop="status" label="状态" width="100">
+    <el-card class="table-card" shadow="never" style="margin-top: 16px;">
+      <el-table :data="queueList" border v-loading="loading" style="width: 100%">
+        <el-table-column prop="visit_no" label="就诊号" width="120" />
+        <el-table-column prop="patient_name" label="患者姓名" width="120" />
+        <el-table-column prop="status" label="排队状态" width="100">
           <template #default="{ row }">
-            <el-tag :type="getStatusType(row.status)">{{ row.status }}</el-tag>
+            <el-tag :type="getStatusType(row.status)">{{ formatStatus(row.status) }}</el-tag>
           </template>
         </el-table-column>
-        <el-table-column prop="triage_time" label="分诊时间" width="180" />
-        <el-table-column prop="dept_name" label="科室" />
+        <el-table-column prop="queue_time" label="排队时间" width="180" />
+        <el-table-column prop="triage_nurse" label="分诊护士" width="120" />
       </el-table>
     </el-card>
   </div>
@@ -38,46 +45,76 @@
 
 <script setup>
 import { ref, onMounted } from 'vue';
-import { ElMessage } from 'element-plus';
 import axios from 'axios';
+import { ElMessage } from 'element-plus';
+
+// 默认当天时间
+const getDefaultDateRange = () => {
+  const today = new Date();
+  const yyyy = today.getFullYear();
+  const mm = String(today.getMonth() + 1).padStart(2, '0');
+  const dd = String(today.getDate()).padStart(2, '0');
+  const todayStr = `${yyyy}-${mm}-${dd}`;
+  return [todayStr, todayStr];
+};
+
+const queryParams = ref({
+  status: '',
+  dateRange: getDefaultDateRange()
+});
 
-const dateRange = ref([]);
 const queueList = ref([]);
 const loading = ref(false);
 
-const fetchQueueData = async () => {
+const handleQuery = async () => {
   loading.value = true;
   try {
-    const [start, end] = dateRange.value || [];
-    const res = await axios.get('/api/outpatient/triage/queue', {
-      params: { startDate: start, endDate: end }
+    const [start, end] = queryParams.value.dateRange || [];
+    const res = await axios.get('/api/triage/queue/list', {
+      params: {
+        deptId: 1, // 实际应从路由或上下文获取
+        status: queryParams.value.status || null,
+        startTime: start ? `${start} 00:00:00` : null,
+        endTime: end ? `${end} 23:59:59` : null
+      }
     });
-    queueList.value = res.data.data || [];
-  } catch (err) {
-    ElMessage.error('获取队列数据失败');
+    queueList.value = res.data || [];
+  } catch (error) {
+    ElMessage.error('查询队列失败');
   } finally {
     loading.value = false;
   }
 };
 
-const handleQuery = () => {
-  fetchQueueData();
+const resetQuery = () => {
+  queryParams.value.status = '';
+  queryParams.value.dateRange = getDefaultDateRange();
+  handleQuery();
+};
+
+const formatStatus = (status) => {
+  const map = { WAITING: '候诊', IN_PROGRESS: '就诊中', COMPLETED: '完诊' };
+  return map[status] || status;
 };
 
 const getStatusType = (status) => {
-  const map = { '候诊': 'info', '就诊中': 'warning', '完诊': 'success' };
-  return map[status] || 'info';
+  if (status === 'COMPLETED') return 'success';
+  if (status === 'IN_PROGRESS') return 'warning';
+  return 'info';
 };
 
 onMounted(() => {
-  const today = new Date().toISOString().slice(0, 10);
-  dateRange.value = [today, today];
-  fetchQueueData();
+  handleQuery();
 });
 </script>
 
 <style scoped>
-.triage-queue-container { padding: 20px; }
-.header-card { margin-bottom: 16px; }
-.query-form { display: flex; align-items: center; }
+.triage-queue-container {
+  padding: 16px;
+  background-color: #f5f7fa;
+  min-height: 100vh;
+}
+.filter-card {
+  margin-bottom: 16px;
+}
 </style>