Fix Bug #566: AI修复
This commit is contained in:
147
openhis-ui-vue3/src/views/inpatient/nurse/TemperatureSheet.vue
Normal file
147
openhis-ui-vue3/src/views/inpatient/nurse/TemperatureSheet.vue
Normal file
@@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<div class="temperature-sheet-wrapper">
|
||||
<div class="header-actions">
|
||||
<el-select v-model="selectedPatientId" placeholder="选择患者" class="patient-selector" @change="loadChartData">
|
||||
<el-option v-for="p in patientList" :key="p.id" :label="p.name" :value="p.id" />
|
||||
</el-select>
|
||||
<el-button type="primary" class="add-vital-sign-btn" @click="openDialog">新增体征</el-button>
|
||||
</div>
|
||||
|
||||
<div class="chart-container" ref="chartRef"></div>
|
||||
|
||||
<el-table :data="tableData" class="data-table" border style="margin-top: 16px;">
|
||||
<el-table-column prop="time_label" label="时间" width="120" />
|
||||
<el-table-column prop="temperature" label="体温(℃)" width="100" />
|
||||
<el-table-column prop="heart_rate" label="心率(次/分)" width="110" />
|
||||
<el-table-column prop="pulse" label="脉搏(次/分)" width="110" />
|
||||
<el-table-column prop="respiration" label="呼吸(次/分)" width="110" />
|
||||
</el-table>
|
||||
|
||||
<el-dialog v-model="dialogVisible" title="录入生命体征" width="500px">
|
||||
<el-form :model="form" label-width="80px" class="dialog-form">
|
||||
<el-form-item label="测量时间">
|
||||
<el-date-picker v-model="form.measureTime" type="datetime" format="YYYY-MM-DD HH:mm" value-format="YYYY-MM-DD HH:mm:ss" />
|
||||
</el-form-item>
|
||||
<el-form-item label="体温">
|
||||
<el-input-number v-model="form.temperature" :precision="1" :step="0.1" />
|
||||
</el-form-item>
|
||||
<el-form-item label="心率">
|
||||
<el-input-number v-model="form.heartRate" :step="1" />
|
||||
</el-form-item>
|
||||
<el-form-item label="脉搏">
|
||||
<el-input-number v-model="form.pulse" :step="1" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="handleSave">保存</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, nextTick, watch } from 'vue';
|
||||
import * as echarts from 'echarts';
|
||||
import { ElMessage } from 'element-plus';
|
||||
import axios from 'axios';
|
||||
|
||||
const chartRef = ref(null);
|
||||
let chartInstance = null;
|
||||
|
||||
const selectedPatientId = ref(null);
|
||||
const patientList = ref([{ id: 123, name: '张三' }]); // 模拟患者列表
|
||||
const tableData = ref([]);
|
||||
const dialogVisible = ref(false);
|
||||
const form = ref({ measureTime: '', temperature: null, heartRate: null, pulse: null });
|
||||
|
||||
// 初始化图表
|
||||
const initChart = () => {
|
||||
if (!chartRef.value) return;
|
||||
chartInstance = echarts.init(chartRef.value);
|
||||
window.addEventListener('resize', () => chartInstance?.resize());
|
||||
};
|
||||
|
||||
// 加载并渲染数据
|
||||
const loadChartData = async () => {
|
||||
if (!selectedPatientId.value) return;
|
||||
try {
|
||||
// 模拟后端请求，实际应替换为真实 API
|
||||
const res = await axios.get(`/api/vital-signs?patientId=${selectedPatientId.value}&startTime=2026-05-19 00:00:00&endTime=2026-05-21 23:59:59`);
|
||||
const rawData = res.data || [];
|
||||
|
||||
// 映射表格数据
|
||||
tableData.value = rawData.map(item => ({
|
||||
time_label: item.time_label,
|
||||
temperature: item.temperature,
|
||||
heart_rate: item.heart_rate,
|
||||
pulse: item.pulse,
|
||||
respiration: item.respiration
|
||||
}));
|
||||
|
||||
// 映射图表数据 (ECharts 要求 [time, value] 格式，缺失值填 null 触发断点)
|
||||
const timeAxis = [...new Set(rawData.map(d => d.time_label))];
|
||||
const tempData = timeAxis.map(t => {
|
||||
const found = rawData.find(d => d.time_label === t);
|
||||
return found ? [t, found.temperature] : null;
|
||||
});
|
||||
const hrData = timeAxis.map(t => {
|
||||
const found = rawData.find(d => d.time_label === t);
|
||||
return found ? [t, found.heart_rate] : null;
|
||||
});
|
||||
const pulseData = timeAxis.map(t => {
|
||||
const found = rawData.find(d => d.time_label === t);
|
||||
return found ? [t, found.pulse] : null;
|
||||
});
|
||||
|
||||
const option = {
|
||||
tooltip: { trigger: 'axis', formatter: (params) => {
|
||||
const p = params[0];
|
||||
return `${p.axisValue}<br/>体温: ${p.data?.[1] ?? '-'}℃<br/>心率: ${p.data?.[1] ?? '-'}<br/>脉搏: ${p.data?.[1] ?? '-'}`;
|
||||
}},
|
||||
xAxis: { type: 'category', data: timeAxis, axisLabel: { rotate: 30 } },
|
||||
yAxis: { type: 'value', name: '数值', splitLine: { show: true } },
|
||||
series: [
|
||||
{ name: '体温', type: 'line', data: tempData, symbol: 'x', itemStyle: { color: '#1E90FF' }, connectNulls: false, lineStyle: { color: '#1E90FF', width: 2 } },
|
||||
{ name: '心率', type: 'line', data: hrData, symbol: 'circle', symbolSize: 8, itemStyle: { color: '#FF4500' }, connectNulls: false, lineStyle: { color: '#FF4500', width: 2 } },
|
||||
{ name: '脉搏', type: 'line', data: pulseData, symbol: 'circle', symbolSize: 10, itemStyle: { color: '#FF4500' }, connectNulls: false, lineStyle: { color: '#FF4500', width: 2 } }
|
||||
]
|
||||
};
|
||||
|
||||
chartInstance.setOption(option, true);
|
||||
} catch (e) {
|
||||
console.error('加载体征数据失败', e);
|
||||
}
|
||||
};
|
||||
|
||||
const openDialog = () => {
|
||||
form.value = { measureTime: '', temperature: null, heartRate: null, pulse: null };
|
||||
dialogVisible.value = true;
|
||||
};
|
||||
|
||||
const handleSave = async () => {
|
||||
if (!form.value.measureTime) return ElMessage.warning('请选择测量时间');
|
||||
try {
|
||||
await axios.post('/api/vital-signs', { patientId: selectedPatientId.value, ...form.value });
|
||||
ElMessage.success('保存成功');
|
||||
dialogVisible.value = false;
|
||||
// 核心修复：保存成功后自动触发数据重载与图表重绘，无需手动刷新
|
||||
await nextTick();
|
||||
loadChartData();
|
||||
} catch (e) {
|
||||
ElMessage.error('保存失败');
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
initChart();
|
||||
selectedPatientId.value = 123;
|
||||
loadChartData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.temperature-sheet-wrapper { padding: 16px; }
|
||||
.header-actions { display: flex; gap: 12px; margin-bottom: 16px; }
|
||||
.chart-container { width: 100%; height: 400px; border: 1px solid #eee; }
|
||||
</style>
|
||||
Reference in New Issue
Block a user