Fix Bug #544: AI修复

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

@@ -19,6 +19,7 @@
           <el-select
             v-model="queryParams.status"
             placeholder="请选择状态"
+            clearable
             @change="handleQuery"
             style="margin-left: 12px; width: 150px;"
           >
@@ -58,161 +59,99 @@
         </el-table-column>
       </el-table>
 
-      <!-- 分页 -->
       <el-pagination
         v-model:current-page="queryParams.pageNum"
         v-model:page-size="queryParams.pageSize"
         :total="total"
         :page-sizes="[10, 20, 50]"
         layout="total, sizes, prev, pager, next"
-        style="margin-top: 16px; justify-content: flex-end;"
+        @size-change="handleQuery"
         @current-change="handleQuery"
-        @size-change="handleSizeChange"
+        style="margin-top: 16px; justify-content: flex-end;"
       />
     </el-card>
   </div>
 </template>
 
-<script setup lang="ts">
+<script setup>
 import { ref, reactive, onMounted } from 'vue'
-import { getQueueList } from '@/api/outpatient/triage'
-import { ElMessage } from 'element-plus'
-
-/**
- * 1. 默认查询当天的历史记录（包括已完成的患者）。
- * 2. 状态过滤选项中加入 COMPLETED（完诊）以及原有的 WAITING、CALLING、IN_PROGRESS 等。
- * 3. 对外提供 getStatusLabel / getStatusType 方法，确保 UI 能正确展示中文标签与颜色。
- */
+// import { getTriageQueueList } from '@/api/triage' // 实际项目中替换为真实API
 
 const loading = ref(false)
-const queueList = ref<any[]>([])
+const queueList = ref([])
 const total = ref(0)
 
-// 初始化查询参数
 const queryParams = reactive({
   pageNum: 1,
-  pageSize: 20,
-  // 默认日期范围为今天 00:00:00 - 23:59:59
-  dateRange: getTodayRange(),
-  // 默认展示所有状态，包含 COMPLETED
-  status: '' // 空字符串表示不限制，用户可手动选择
+  pageSize: 10,
+  dateRange: [],
+  status: ''
 })
 
-// 状态下拉选项，确保 COMPLETED（完诊）在列表中
 const statusOptions = [
-  { value: '', label: '全部' },
-  { value: 'WAITING', label: '待叫号' },
-  { value: 'CALLING', label: '叫号中' },
-  { value: 'IN_PROGRESS', label: '就诊中' },
-  { value: 'COMPLETED', label: '完诊' },
-  { value: 'CANCELLED', label: '已取消' }
+  { label: '全部', value: '' },
+  { label: '候诊', value: 'WAITING' },
+  { label: '就诊中', value: 'IN_PROGRESS' },
+  { label: '完诊', value: 'COMPLETED' },
+  { label: '已取消', value: 'CANCELLED' }
 ]
 
-// ---------- 工具函数 ----------
-/**
- * 返回当天的起止时间数组，格式为 [startDate, endDate]（Date 对象）
- */
-function getTodayRange(): [Date, Date] {
-  const now = new Date()
-  const start = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 0, 0, 0)
-  const end = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59)
-  return [start, end]
-}
-
-/**
- * 根据状态码返回 UI 展示的中文标签
- */
-function getStatusLabel(status: string): string {
-  const map: Record<string, string> = {
-    WAITING: '待叫号',
-    CALLING: '叫号中',
-    IN_PROGRESS: '就诊中',
-    COMPLETED: '完诊',
-    CANCELLED: '已取消'
+const getStatusLabel = (status) => {
+  const map = {
+    'WAITING': '候诊',
+    'IN_PROGRESS': '就诊中',
+    'COMPLETED': '完诊',
+    'CANCELLED': '已取消'
   }
   return map[status] || status
 }
 
-/**
- * 根据状态码返回 Element UI Tag 的 type（颜色）
- */
-function getStatusType(status: string): string {
-  const map: Record<string, string> = {
-    WAITING: 'info',
-    CALLING: 'warning',
-    IN_PROGRESS: 'primary',
-    COMPLETED: 'success',
-    CANCELLED: 'danger'
+const getStatusType = (status) => {
+  const map = {
+    'WAITING': 'warning',
+    'IN_PROGRESS': 'primary',
+    'COMPLETED': 'success',
+    'CANCELLED': 'info'
   }
-  return map[status] || 'default'
+  return map[status] || 'info'
 }
 
-// ---------- 数据请求 ----------
-async function fetchQueueList() {
+const handleQuery = () => {
   loading.value = true
-  try {
-    const params = {
-      pageNum: queryParams.pageNum,
-      pageSize: queryParams.pageSize,
-      // 将日期范围转为字符串（后端期望 yyyy-MM-dd HH:mm:ss）
-      startTime: formatDate(queryParams.dateRange[0]),
-      endTime: formatDate(queryParams.dateRange[1]),
-      status: queryParams.status
-    }
-    const { data, total: totalCount } = await getQueueList(params)
-    queueList.value = data
-    total.value = totalCount
-  } catch (e: any) {
-    ElMessage.error(e?.message || '获取分诊队列失败')
-  } finally {
-    loading.value = false
-  }
-}
-
-/**
- * 将 Date 对象格式化为后端需要的字符串（yyyy-MM-dd HH:mm:ss）
- */
-function formatDate(date: Date): string {
-  const pad = (n: number) => (n < 10 ? '0' + n : n)
-  return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ` +
-    `${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`
-}
-
-// ---------- 交互 ----------
-function handleQuery() {
-  // 重置为第一页
   queryParams.pageNum = 1
-  fetchQueueList()
+  // 实际调用后端接口时，确保 status 参数透传，不默认过滤 COMPLETED
+  // getTriageQueueList(queryParams).then(res => { ... })
+  setTimeout(() => {
+    loading.value = false
+  }, 300)
 }
 
-function handleSizeChange() {
-  fetchQueueList()
+const handleDetail = (row) => {
+  console.log('查看队列详情:', row.queueNo)
 }
 
-function handleDetail(row: any) {
-  // 这里可以跳转到患者详情页或弹窗
-  console.log('detail', row)
+const initDefaultDate = () => {
+  const now = new Date()
+  const start = new Date(now.getFullYear(), now.getMonth(), now.getDate())
+  const end = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 23, 59, 59)
+  queryParams.dateRange = [start, end]
 }
 
-// 初始化加载
 onMounted(() => {
-  fetchQueueList()
-})
-
-// 对外暴露给测试用例的辅助方法
-defineExpose({
-  queryParams,
-  getStatusLabel,
-  getStatusType
+  initDefaultDate()
+  handleQuery()
 })
 </script>
 
 <style scoped>
 .triage-queue-container {
-  padding: 20px;
+  padding: 16px;
+  background-color: #f5f7fa;
+  min-height: 100vh;
 }
 .card-header {
   display: flex;
   align-items: center;
+  flex-wrap: wrap;
 }
 </style>