Fix Bug #544: AI修复

openhis-ui-vue3/src/views/triage/QueueManagement.vue

@@ -1,80 +1,122 @@
 <template>
   <div class="queue-management-container">
-    <el-form :inline="true" :model="queryParams" class="search-form">
-      <el-form-item label="日期范围">
-        <el-date-picker
-          v-model="dateRange"
-          type="daterange"
-          range-separator="至"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-          value-format="YYYY-MM-DD"
-          @change="handleDateChange"
-        />
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" @click="handleQuery">查询</el-button>
-      </el-form-item>
-    </el-form>
+    <el-card class="search-card">
+      <el-form :inline="true" :model="queryParams" class="search-form">
+        <el-form-item label="查询日期">
+          <el-date-picker
+            v-model="queryParams.dateRange"
+            type="daterange"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            value-format="YYYY-MM-DD"
+            @change="handleDateChange"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="handleQuery">查询</el-button>
+          <el-button @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
 
-    <el-table :data="queueList" border style="width: 100%">
-      <el-table-column prop="patientName" label="患者姓名" />
-      <el-table-column prop="status" label="排队状态">
-        <template #default="{ row }">
-          <el-tag :type="getStatusType(row.status)">{{ row.status }}</el-tag>
-        </template>
-      </el-table-column>
-      <el-table-column prop="queueTime" label="排队时间" />
-    </el-table>
+    <el-card class="table-card">
+      <el-table :data="queueList" v-loading="loading" border stripe>
+        <el-table-column prop="queueNo" label="排队号" width="100" />
+        <el-table-column prop="patientName" label="患者姓名" width="120" />
+        <el-table-column prop="status" label="状态" width="100">
+          <template #default="{ row }">
+            <el-tag :type="getStatusType(row.status)">{{ getStatusText(row.status) }}</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column prop="createTime" label="入队时间" width="180" />
+        <el-table-column prop="updateTime" label="状态更新时间" width="180" />
+        <el-table-column label="操作" fixed="right">
+          <template #default="{ row }">
+            <el-button link type="primary" @click="viewDetail(row)">详情</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination
+        v-model:current-page="queryParams.pageNum"
+        v-model:page-size="queryParams.pageSize"
+        :total="total"
+        layout="total, sizes, prev, pager, next"
+        @size-change="handleQuery"
+        @current-change="handleQuery"
+      />
+    </el-card>
   </div>
 </template>
 
 <script setup>
-import { ref, onMounted } from 'vue'
-import { getQueueList } from '@/api/triage'
+import { ref, onMounted } from 'vue';
+import { getQueueList } from '@/api/triage';
+import dayjs from 'dayjs';
 
-const queryParams = ref({ deptId: 1, startDate: null, endDate: null })
-const dateRange = ref([])
-const queueList = ref([])
+const loading = ref(false);
+const queueList = ref([]);
+const total = ref(0);
 
-// 修复 Bug #544：默认加载当天时间范围
-const initDefaultDate = () => {
-  const today = new Date()
-  const start = new Date(today.getFullYear(), today.getMonth(), today.getDate())
-  const end = new Date(today.getFullYear(), today.getMonth(), today.getDate(), 23, 59, 59)
-  queryParams.value.startDate = start
-  queryParams.value.endDate = end
-  dateRange.value = [start.toISOString().split('T')[0], end.toISOString().split('T')[0]]
-}
+const queryParams = ref({
+  dateRange: [dayjs().format('YYYY-MM-DD'), dayjs().format('YYYY-MM-DD')],
+  pageNum: 1,
+  pageSize: 20
+});
 
 const handleDateChange = (val) => {
-  if (val && val.length === 2) {
-    queryParams.value.startDate = new Date(val[0])
-    queryParams.value.endDate = new Date(val[1] + ' 23:59:59')
-  } else {
-    queryParams.value.startDate = null
-    queryParams.value.endDate = null
-  }
-}
+  queryParams.value.dateRange = val;
+};
 
-const handleQuery = async () => {
-  const res = await getQueueList(queryParams.value)
-  queueList.value = res.data || []
-}
+const handleQuery = () => {
+  queryParams.value.pageNum = 1;
+  fetchQueueList();
+};
+
+const resetQuery = () => {
+  queryParams.value.dateRange = [dayjs().format('YYYY-MM-DD'), dayjs().format('YYYY-MM-DD')];
+  handleQuery();
+};
+
+const fetchQueueList = async () => {
+  loading.value = true;
+  try {
+    const [start, end] = queryParams.value.dateRange || [];
+    const res = await getQueueList({
+      pageNum: queryParams.value.pageNum,
+      pageSize: queryParams.value.pageSize,
+      startDate: start ? `${start} 00:00:00` : null,
+      endDate: end ? `${end} 23:59:59` : null
+    });
+    queueList.value = res.data.records || [];
+    total.value = res.data.total || 0;
+  } finally {
+    loading.value = false;
+  }
+};
+
+const getStatusText = (status) => {
+  const map = { 0: '待诊', 1: '就诊中', 2: '过号', 3: '完诊' };
+  return map[status] || '未知';
+};
 
 const getStatusType = (status) => {
-  if (status === '完诊') return 'success'
-  if (status === '就诊中') return 'warning'
-  return 'info'
-}
+  const map = { 0: 'info', 1: 'warning', 2: 'danger', 3: 'success' };
+  return map[status] || 'info';
+};
+
+const viewDetail = (row) => {
+  // 预留详情跳转逻辑
+  console.log('查看队列详情:', row);
+};
 
 onMounted(() => {
-  initDefaultDate()
-  handleQuery()
-})
+  fetchQueueList();
+});
 </script>
 
 <style scoped>
 .queue-management-container { padding: 20px; }
-.search-form { margin-bottom: 20px; }
+.search-card { margin-bottom: 20px; }
+.table-card { margin-bottom: 20px; }
 </style>