105 lines
3.3 KiB
Vue
105 lines
3.3 KiB
Vue
<template>
|
||
<div class="appointment-container">
|
||
<!-- 状态筛选栏 -->
|
||
<el-card class="search-card" shadow="never">
|
||
<el-form :inline="true" :model="queryParams" class="status-filter">
|
||
<el-form-item label="状态筛选">
|
||
<el-select v-model="queryParams.status" placeholder="请选择状态" clearable style="width: 150px;">
|
||
<el-option label="待约" :value="1" />
|
||
<el-option label="已预约" :value="2" />
|
||
<el-option label="已取消" :value="3" />
|
||
<!-- 修复 Bug #570：彻底移除“已锁定”选项，恢复标准预约状态字典 -->
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button type="primary" @click="handleSearch">查询</el-button>
|
||
<el-button @click="handleReset">重置</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
</el-card>
|
||
|
||
<!-- 号源列表 -->
|
||
<el-card class="table-card" shadow="never" style="margin-top: 16px;">
|
||
<el-table :data="tableData" border stripe v-loading="loading">
|
||
<el-table-column prop="slotNo" label="号源编号" width="120" />
|
||
<el-table-column prop="doctorName" label="医生" width="120" />
|
||
<el-table-column prop="deptName" label="科室" width="120" />
|
||
<el-table-column prop="scheduleDate" label="排班日期" width="140" />
|
||
<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 label="操作" width="120">
|
||
<template #default="{ row }">
|
||
<el-button
|
||
v-if="row.status === 1"
|
||
type="primary"
|
||
size="small"
|
||
@click="handleBook(row)"
|
||
>预约</el-button>
|
||
<span v-else class="text-muted">已处理</span>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
</el-card>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, reactive, onMounted } from 'vue'
|
||
import { ElMessage } from 'element-plus'
|
||
import { getSlotList, bookSlot } from '@/api/outpatient'
|
||
|
||
const loading = ref(false)
|
||
const queryParams = reactive({ status: null })
|
||
const tableData = ref([])
|
||
|
||
const handleSearch = async () => {
|
||
loading.value = true
|
||
try {
|
||
const res = await getSlotList(queryParams)
|
||
tableData.value = res.data || []
|
||
} finally {
|
||
loading.value = false
|
||
}
|
||
}
|
||
|
||
const handleReset = () => {
|
||
queryParams.status = null
|
||
handleSearch()
|
||
}
|
||
|
||
const handleBook = async (row) => {
|
||
try {
|
||
await bookSlot({ slotId: row.id })
|
||
ElMessage.success('预约成功')
|
||
handleSearch()
|
||
} catch (err) {
|
||
ElMessage.error(err.message || '预约失败')
|
||
}
|
||
}
|
||
|
||
// 修复 Bug #570：统一状态映射逻辑，移除“已锁定”分支，确保前后端状态语义一致
|
||
const getStatusText = (status) => {
|
||
const map = { 1: '待约', 2: '已预约', 3: '已取消' }
|
||
return map[status] || '未知'
|
||
}
|
||
|
||
const getStatusType = (status) => {
|
||
const map = { 1: 'info', 2: 'success', 3: 'danger' }
|
||
return map[status] || 'info'
|
||
}
|
||
|
||
onMounted(() => {
|
||
handleSearch()
|
||
})
|
||
</script>
|
||
|
||
<style scoped>
|
||
.appointment-container { padding: 16px; }
|
||
.text-muted { color: #909399; font-size: 12px; }
|
||
</style>
|