87 lines
5.6 KiB
Vue
87 lines
5.6 KiB
Vue
<template>
|
|
<div class="assessment-form">
|
|
<div class="type-select">
|
|
<div v-for="type in assessmentTypes" :key="type.key" class="type-card" :class="{ active: selectedType === type.key }" @click="selectedType = type.key">
|
|
<div class="type-icon">{{ type.icon }}</div><div class="type-name">{{ type.name }}</div>
|
|
</div>
|
|
</div>
|
|
<div v-if="selectedType" class="form-content">
|
|
<div v-for="(item, idx) in currentItems" :key="idx" class="form-item">
|
|
<div class="item-label">{{ item.label }}</div>
|
|
<div class="item-options">
|
|
<span v-for="opt in item.options" :key="opt.value" class="option" :class="{ selected: formData[item.key] === opt.value }" @click="formData[item.key] = opt.value">{{ opt.label }} ({{ opt.score }}分)</span>
|
|
</div>
|
|
</div>
|
|
<div class="score-result"><div class="total-score">总分: {{ totalScore }}</div><div class="risk-level" :class="riskLevel">{{ riskLevelText }}</div></div>
|
|
<button class="submit-btn" @click="submit" :disabled="submitting">{{ submitting ? '提交中...' : '提交评估' }}</button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, computed } from 'vue'
|
|
import { useRoute } from 'vue-router'
|
|
import { ElMessage } from 'element-plus'
|
|
import { nursingApi } from '../api'
|
|
|
|
const route = useRoute()
|
|
const selectedType = ref('')
|
|
const submitting = ref(false)
|
|
const formData = ref({})
|
|
|
|
const assessmentTypes = [
|
|
{ key: 'Braden', name: '压疮评估', icon: '🩹', items: [
|
|
{ key: 'sensory', label: '感知能力', options: [{ label: '完全受限', value: 1, score: 1 }, { label: '严重受限', value: 2, score: 2 }, { label: '轻度受限', value: 3, score: 3 }, { label: '未受损', value: 4, score: 4 }] },
|
|
{ key: 'moisture', label: '皮肤潮湿', options: [{ label: '持续潮湿', value: 1, score: 1 }, { label: '经常潮湿', value: 2, score: 2 }, { label: '偶尔潮湿', value: 3, score: 3 }, { label: '很少潮湿', value: 4, score: 4 }] },
|
|
{ key: 'activity', label: '活动能力', options: [{ label: '卧床', value: 1, score: 1 }, { label: '轮椅', value: 2, score: 2 }, { label: '偶尔步行', value: 3, score: 3 }, { label: '经常步行', value: 4, score: 4 }] }
|
|
]},
|
|
{ key: 'Morse', name: '跌倒评估', icon: '⚠️', items: [
|
|
{ key: 'history', label: '跌倒史', options: [{ label: '无', value: 0, score: 0 }, { label: '有', value: 25, score: 25 }] },
|
|
{ key: 'diagnosis', label: '诊断', options: [{ label: '无', value: 0, score: 0 }, { label: '有', value: 15, score: 15 }] },
|
|
{ key: 'ambulation', label: '行走辅助', options: [{ label: '无需', value: 0, score: 0 }, { label: '拐杖', value: 15, score: 15 }, { label: '扶墙', value: 30, score: 30 }] }
|
|
]},
|
|
{ key: 'NRS2002', name: '营养筛查', icon: '🍎', items: [
|
|
{ key: 'bmi', label: 'BMI', options: [{ label: '≥20.5', value: 0, score: 0 }, { label: '18.5-20.5', value: 1, score: 1 }, { label: '<18.5', value: 2, score: 2 }] },
|
|
{ key: 'weightLoss', label: '体重下降', options: [{ label: '无', value: 0, score: 0 }, { label: '<5%', value: 1, score: 1 }, { label: '>5%', value: 2, score: 2 }] },
|
|
{ key: 'intake', label: '饮食摄入', options: [{ label: '正常', value: 0, score: 0 }, { label: '减少', value: 1, score: 1 }, { label: '极少', value: 2, score: 2 }] }
|
|
]}
|
|
]
|
|
|
|
const currentItems = computed(() => assessmentTypes.find(t => t.key === selectedType.value)?.items || [])
|
|
const totalScore = computed(() => currentItems.value.reduce((sum, item) => sum + (formData.value[item.key] || 0), 0))
|
|
const riskLevel = computed(() => {
|
|
if (selectedType.value === 'Braden') return totalScore.value <= 12 ? 'HIGH' : totalScore.value <= 14 ? 'MEDIUM' : 'LOW'
|
|
if (selectedType.value === 'Morse') return totalScore.value >= 45 ? 'HIGH' : totalScore.value >= 25 ? 'MEDIUM' : 'LOW'
|
|
return totalScore.value >= 3 ? 'HIGH' : totalScore.value >= 2 ? 'MEDIUM' : 'LOW'
|
|
})
|
|
const riskLevelText = computed(() => ({ HIGH: '高风险', MEDIUM: '中风险', LOW: '低风险' }[riskLevel.value]))
|
|
|
|
const submit = async () => {
|
|
submitting.value = true
|
|
try {
|
|
await nursingApi.submitAssessment({ patientId: route.params.patientId, assessmentType: selectedType.value, totalScore: totalScore.value, riskLevel: riskLevel.value, detail: JSON.stringify(formData.value) })
|
|
ElMessage.success('评估提交成功')
|
|
} catch (e) { ElMessage.error('提交失败') } finally { submitting.value = false }
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.type-select { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px; }
|
|
.type-card { background: #fff; border-radius: 8px; padding: 14px; text-align: center; border: 2px solid transparent; cursor: pointer; }
|
|
.type-card.active { border-color: #1890ff; background: #e6f7ff; }
|
|
.type-icon { font-size: 26px; }
|
|
.type-name { font-size: 13px; margin-top: 4px; }
|
|
.form-content { background: #fff; border-radius: 8px; padding: 14px; }
|
|
.form-item { margin-bottom: 14px; }
|
|
.item-label { font-weight: 600; margin-bottom: 8px; font-size: 14px; }
|
|
.item-options { display: flex; flex-wrap: wrap; gap: 8px; }
|
|
.option { padding: 8px 12px; background: #f0f0f0; border-radius: 6px; font-size: 13px; cursor: pointer; }
|
|
.option.selected { background: #1890ff; color: #fff; }
|
|
.score-result { text-align: center; padding: 14px 0; border-top: 1px solid #eee; margin-top: 10px; }
|
|
.total-score { font-size: 22px; font-weight: 600; }
|
|
.risk-level { font-size: 15px; margin-top: 4px; }
|
|
.risk-HIGH { color: #f5222d; } .risk-MEDIUM { color: #fa8c16; } .risk-LOW { color: #52c41a; }
|
|
.submit-btn { width: 100%; padding: 14px; background: #1890ff; color: #fff; border: none; border-radius: 8px; font-size: 16px; margin-top: 10px; }
|
|
.submit-btn:disabled { background: #91d5ff; }
|
|
</style>
|