53 lines
1.3 KiB
Vue
53 lines
1.3 KiB
Vue
<template>
|
|
<div class="queue-list">
|
|
<el-table :data="queueList" style="width: 100%" v-loading="loading">
|
|
<el-table-column prop="id" label="序号" width="80"/>
|
|
<el-table-column prop="status" label="状态"/>
|
|
<el-table-column prop="createTime" label="挂号时间"/>
|
|
<!-- 其它列 -->
|
|
</el-table>
|
|
<el-pagination
|
|
v-if="total > pageSize"
|
|
background
|
|
layout="prev, pager, next, jumper"
|
|
:current-page="pageNum"
|
|
:page-size="pageSize"
|
|
:total="total"
|
|
@current-change="handlePageChange" />
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, onMounted, watch } from 'vue'
|
|
import { getQueueOrders } from '@/api/outpatient'
|
|
|
|
const props = defineProps({
|
|
patientId: { type: [String, Number], required: true }
|
|
})
|
|
|
|
const queueList = ref([])
|
|
const loading = ref(false)
|
|
const pageNum = ref(1)
|
|
const pageSize = ref(20)
|
|
const total = ref(0)
|
|
|
|
const fetchQueue = async () => {
|
|
loading.value = true
|
|
try {
|
|
const res = await getQueueOrders(props.patientId, pageNum.value, pageSize.value)
|
|
queueList.value = res.data
|
|
total.value = res.total || queueList.value.length
|
|
} finally {
|
|
loading.value = false
|
|
}
|
|
}
|
|
|
|
const handlePageChange = (newPage) => {
|
|
pageNum.value = newPage
|
|
fetchQueue()
|
|
}
|
|
|
|
onMounted(fetchQueue)
|
|
watch(() => props.patientId, fetchQueue)
|
|
</script>
|