121 lines
3.6 KiB
Vue
121 lines
3.6 KiB
Vue
<template>
|
|
<div class="triage-queue-container">
|
|
<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="queryParams.dateRange"
|
|
type="daterange"
|
|
range-separator="至"
|
|
start-placeholder="开始日期"
|
|
end-placeholder="结束日期"
|
|
value-format="YYYY-MM-DD"
|
|
style="width: 260px;"
|
|
/>
|
|
</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-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)">{{ formatStatus(row.status) }}</el-tag>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="queue_time" label="排队时间" width="180" />
|
|
<el-table-column prop="triage_nurse" label="分诊护士" width="120" />
|
|
</el-table>
|
|
</el-card>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, onMounted } from 'vue';
|
|
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 queueList = ref([]);
|
|
const loading = ref(false);
|
|
|
|
const handleQuery = async () => {
|
|
loading.value = true;
|
|
try {
|
|
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 || [];
|
|
} catch (error) {
|
|
ElMessage.error('查询队列失败');
|
|
} finally {
|
|
loading.value = false;
|
|
}
|
|
};
|
|
|
|
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) => {
|
|
if (status === 'COMPLETED') return 'success';
|
|
if (status === 'IN_PROGRESS') return 'warning';
|
|
return 'info';
|
|
};
|
|
|
|
onMounted(() => {
|
|
handleQuery();
|
|
});
|
|
</script>
|
|
|
|
<style scoped>
|
|
.triage-queue-container {
|
|
padding: 16px;
|
|
background-color: #f5f7fa;
|
|
min-height: 100vh;
|
|
}
|
|
.filter-card {
|
|
margin-bottom: 16px;
|
|
}
|
|
</style>
|