71 lines
3.4 KiB
Vue
71 lines
3.4 KiB
Vue
<template>
|
|
<div class="task-list">
|
|
<div class="filter-bar">
|
|
<select v-model="filterType" class="filter-select" @change="loadTasks"><option value="">全部</option><option value="医嘱执行">医嘱执行</option><option value="生命体征">生命体征</option></select>
|
|
<button class="refresh-btn" @click="loadTasks">刷新</button>
|
|
</div>
|
|
<div v-if="loading" class="loading">加载中...</div>
|
|
<div v-for="task in filteredTasks" :key="task.id" class="task-card" @touchstart="swipeStart" @touchend="swipeEnd($event, task)">
|
|
<div class="task-info">
|
|
<div class="task-header"><span class="task-patient">{{ task.patientName || '患者' }}</span><span class="bed">{{ task.bedNo || '' }}</span></div>
|
|
<div class="task-content">{{ task.adviceName || task.orderName || '医嘱任务' }}</div>
|
|
<div class="task-meta"><span class="task-type">{{ task.adviceType || task.orderType || '医嘱' }}</span><span class="task-time">{{ task.createTime || '' }}</span></div>
|
|
</div>
|
|
</div>
|
|
<div v-if="!loading && filteredTasks.length === 0" class="empty">暂无任务</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, onMounted, computed } from 'vue'
|
|
import { ElMessageBox, ElMessage } from 'element-plus'
|
|
import { nursingApi } from '../api'
|
|
|
|
const tasks = ref([])
|
|
const loading = ref(false)
|
|
const filterType = ref('')
|
|
const filteredTasks = computed(() => filterType.value ? tasks.value.filter(t => (t.adviceType || '').includes(filterType.value)) : tasks.value)
|
|
|
|
const loadTasks = async () => {
|
|
loading.value = true
|
|
try {
|
|
const userInfo = JSON.parse(localStorage.getItem('userInfo') || '{}')
|
|
const nurseId = userInfo.practitionerId || userInfo.userId
|
|
if (!nurseId) { ElMessage.warning('未获取到用户信息'); return }
|
|
const res = await nursingApi.getTasks({ nurseId: nurseId, pageNum: 1, pageSize: 50 })
|
|
if (res.code === 200) { tasks.value = res.data?.records || res.data?.rows || [] }
|
|
} catch (e) { ElMessage.error('加载失败') } finally { loading.value = false }
|
|
}
|
|
|
|
let startX = 0
|
|
const swipeStart = (e) => { startX = e.touches[0].clientX }
|
|
const swipeEnd = async (e, task) => {
|
|
const diff = startX - e.changedTouches[0].clientX
|
|
if (diff > 80) {
|
|
try {
|
|
await ElMessageBox.confirm('确认完成此任务？', '提示')
|
|
await nursingApi.completeTask(task.id, { result: '完成' })
|
|
ElMessage.success('任务已完成')
|
|
loadTasks()
|
|
} catch {}
|
|
}
|
|
}
|
|
|
|
onMounted(loadTasks)
|
|
</script>
|
|
|
|
<style scoped>
|
|
.filter-bar { display: flex; gap: 8px; padding: 8px 0; }
|
|
.filter-select { flex: 1; padding: 8px; border: 1px solid #ddd; border-radius: 6px; font-size: 14px; background: #fff; }
|
|
.refresh-btn { padding: 8px 16px; background: #1890ff; color: #fff; border: none; border-radius: 6px; }
|
|
.loading { text-align: center; padding: 20px; color: #999; }
|
|
.task-card { background: #fff; border-radius: 8px; padding: 12px; margin-bottom: 8px; display: flex; justify-content: space-between; align-items: center; box-shadow: 0 1px 3px rgba(0,0,0,0.08); }
|
|
.task-header { display: flex; align-items: center; gap: 8px; }
|
|
.task-patient { font-weight: 600; font-size: 15px; }
|
|
.bed { color: #1890ff; font-size: 13px; }
|
|
.task-content { color: #666; font-size: 13px; margin: 4px 0; }
|
|
.task-meta { display: flex; gap: 12px; font-size: 12px; color: #999; }
|
|
.task-type { background: #e6f7ff; color: #1890ff; padding: 2px 8px; border-radius: 4px; }
|
|
.empty { text-align: center; padding: 40px; color: #999; }
|
|
</style>
|