mirror of
https://gitee.com/xiongmao1988/rax-medical.git
synced 2025-08-24 04:54:58 +08:00
错误修复
This commit is contained in:
yy
parent
134d202f67
commit
63ccb81c9b
|
|
@ -50,7 +50,7 @@ if (token) {
|
|||
router.addRoute({
|
||||
name: "root",
|
||||
path: "/",
|
||||
redirect: "/home"
|
||||
redirect: "/remote-manage"
|
||||
})
|
||||
} else {
|
||||
router.addRoute({
|
||||
|
|
|
|||
|
|
@ -36,7 +36,7 @@
|
|||
</el-button>
|
||||
<el-dropdown trigger="click" @command="userCommand">
|
||||
<span class="el-dropdown-link">
|
||||
{{ userInfo.name }}
|
||||
{{ userInfo?.name }}
|
||||
<el-icon class="el-icon--right">
|
||||
<arrow-down/>
|
||||
</el-icon>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="chart-dom-box">
|
||||
<div ref="chartDom" style="width: 100%; height: 100%"></div>
|
||||
</div>
|
||||
<div class="chart-dom-box">
|
||||
<div ref="chartDom" style="width: 100%; height: 100%"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
|
|
@ -12,12 +12,12 @@ import {useRemoteWsStore} from "@/stores/remote-ws-store";
|
|||
|
||||
const chartDom = ref();
|
||||
const props = withDefaults(defineProps<{
|
||||
names: string[]
|
||||
names: string[]
|
||||
}>(), {
|
||||
names: ['BIS', 'HR']
|
||||
names: ['BIS', 'HR']
|
||||
});
|
||||
defineExpose({
|
||||
updateChartData
|
||||
updateChartData
|
||||
});
|
||||
const emit = defineEmits(["exceptionEvent"]);
|
||||
let chart: any;
|
||||
|
|
@ -29,191 +29,196 @@ let currentNode: any;
|
|||
const remoteWsStore = useRemoteWsStore();
|
||||
|
||||
onMounted(() => {
|
||||
chartInit();
|
||||
chartInit();
|
||||
});
|
||||
|
||||
function updateChartData(data: any) {
|
||||
if (data) {
|
||||
if (currentNode && currentNode.Time == data.Time) {
|
||||
if (currentNode && currentNode.Time == data[0].Time) {
|
||||
return;
|
||||
} else {
|
||||
currentNode = data;
|
||||
currentNode = data[0];
|
||||
}
|
||||
xData.shift();
|
||||
xData.push(dateFormater("HH:mm:ss", data.Time ? data.Time - 8 * 60 * 60 * 1000 : ''));
|
||||
series.forEach(serie => {
|
||||
serie.data.shift();
|
||||
serie.data.push(data[serie.name]);
|
||||
if (data[serie.name + '_except']) {
|
||||
emit("exceptionEvent", remoteWsStore.exceptionMsg[serie.name + '_except']);
|
||||
for (let i = data.length - 1; i >= 0; i--) {
|
||||
const item = data[i]
|
||||
if (xData.indexOf(dateFormater("HH:mm:ss", item.Time)) == -1) {
|
||||
xData.shift();
|
||||
xData.push(dateFormater("HH:mm:ss", item.Time));
|
||||
series.forEach((serie: any) => {
|
||||
serie.data.shift();
|
||||
serie.data.push(item[serie.name]);
|
||||
if (item[serie.name + '_except']) {
|
||||
emit("exceptionEvent", remoteWsStore.exceptionMsg[serie.name + '_except']);
|
||||
}
|
||||
})
|
||||
chart.setOption({
|
||||
xAxis: {
|
||||
data: xData,
|
||||
},
|
||||
series,
|
||||
})
|
||||
}
|
||||
})
|
||||
chart.setOption({
|
||||
xAxis: {
|
||||
data: xData,
|
||||
},
|
||||
series,
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function chartInit() {
|
||||
chart = echarts.init(chartDom.value as HTMLElement);
|
||||
chart.clear();
|
||||
getSeries();
|
||||
getXData();
|
||||
getLegendData();
|
||||
const option: any = {
|
||||
color: colors,
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
formatter: (params: any) => {
|
||||
let str = '';
|
||||
str += params[0].axisValue;
|
||||
str += '<br>';
|
||||
props.names.forEach((item, index) => {
|
||||
str += params[index].marker;
|
||||
str += params[index].seriesName + ' ';
|
||||
switch (item) {
|
||||
case 'BIS':
|
||||
str += `脑电双频指数<麻醉深度>：${params[index].value}`;
|
||||
break;
|
||||
case 'HR':
|
||||
str += `心率：${params[index].value} 次/分`;
|
||||
break;
|
||||
case 'SBP':
|
||||
str += `收缩压：${params[index].value} mmHg`;
|
||||
break;
|
||||
case 'DBP':
|
||||
str += `舒张压：${params[index].value} mmHg`;
|
||||
break;
|
||||
case 'SPO2':
|
||||
str += `体温：${params[index].value}`;
|
||||
break;
|
||||
case 'TEMP':
|
||||
str += `氧饱和度：${params[index].value}`;
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
str += index === 0 ? '<br>' : '';
|
||||
});
|
||||
return str;
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
type: 'plain',
|
||||
show: true,
|
||||
top: 0,
|
||||
right: 15,
|
||||
itemGap: 30,
|
||||
itemWidth: 20,
|
||||
itemHeight: 3,
|
||||
icon: 'rect',
|
||||
textStyle: {
|
||||
fontSize: 16,
|
||||
fontWeight: 600,
|
||||
lineHeight: 30,
|
||||
},
|
||||
formatter: (params: string) => {
|
||||
const index = props.names.findIndex((item) => item === params);
|
||||
let str = params + ' ';
|
||||
switch (params) {
|
||||
case 'BIS':
|
||||
str += `${series[index].data[series[index].data.length - 1]}`;
|
||||
break;
|
||||
case 'HR':
|
||||
str += `${series[index].data[series[index].data.length - 1]} 次/分`;
|
||||
break;
|
||||
case 'SBP':
|
||||
str += `${series[index].data[series[index].data.length - 1]} mmHg`;
|
||||
break;
|
||||
case 'DBP':
|
||||
str += `${series[index].data[series[index].data.length - 1]} mmHg`;
|
||||
break;
|
||||
case 'SPO2':
|
||||
str += `${series[index].data[series[index].data.length - 1]}`;
|
||||
break;
|
||||
case 'TEMP':
|
||||
str += `${series[index].data[series[index].data.length - 1]}`;
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
return str;
|
||||
},
|
||||
data: legendData
|
||||
},
|
||||
grid: {
|
||||
left: 5,
|
||||
right: 25,
|
||||
bottom: 5,
|
||||
top: 40,
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
show: true,
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: [],
|
||||
axisLine: {lineStyle: {color: '#006080'}}
|
||||
},
|
||||
yAxis: {
|
||||
show: true,
|
||||
type: 'value',
|
||||
axisLabel: {
|
||||
formatter: `{value} ${props.names[0] === 'BIS' ? '次/分' : props.names[0] === 'SBP' ? 'mmHg' : ''}`
|
||||
},
|
||||
axisLine: {show: true, lineStyle: {color: '#006080'}},
|
||||
splitLine: {lineStyle: {color: '#C0C4CC', width: 1, type: 'dashed'}},
|
||||
},
|
||||
series,
|
||||
};
|
||||
if (props.names[0] !== 'BIS'
|
||||
) {
|
||||
option.yAxis.max = (value: any) => value.max + 20;
|
||||
}
|
||||
chart.setOption(option);
|
||||
chart.resize();
|
||||
window.addEventListener('resize', () => {
|
||||
chart.resize();
|
||||
});
|
||||
chart = echarts.init(chartDom.value as HTMLElement);
|
||||
chart.clear();
|
||||
getSeries();
|
||||
getXData();
|
||||
getLegendData();
|
||||
const option: any = {
|
||||
color: colors,
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
formatter: (params: any) => {
|
||||
let str = '';
|
||||
str += params[0].axisValue;
|
||||
str += '<br>';
|
||||
props.names.forEach((item, index) => {
|
||||
str += params[index].marker;
|
||||
str += params[index].seriesName + ' ';
|
||||
switch (item) {
|
||||
case 'BIS':
|
||||
str += `脑电双频指数<麻醉深度>：${params[index].value}`;
|
||||
break;
|
||||
case 'HR':
|
||||
str += `心率：${params[index].value} 次/分`;
|
||||
break;
|
||||
case 'SBP':
|
||||
str += `收缩压：${params[index].value} mmHg`;
|
||||
break;
|
||||
case 'DBP':
|
||||
str += `舒张压：${params[index].value} mmHg`;
|
||||
break;
|
||||
case 'SPO2':
|
||||
str += `体温：${params[index].value}`;
|
||||
break;
|
||||
case 'TEMP':
|
||||
str += `氧饱和度：${params[index].value}`;
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
str += index === 0 ? '<br>' : '';
|
||||
});
|
||||
return str;
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
type: 'plain',
|
||||
show: true,
|
||||
top: 0,
|
||||
right: 15,
|
||||
itemGap: 30,
|
||||
itemWidth: 20,
|
||||
itemHeight: 3,
|
||||
icon: 'rect',
|
||||
textStyle: {
|
||||
fontSize: 16,
|
||||
fontWeight: 600,
|
||||
lineHeight: 30,
|
||||
},
|
||||
formatter: (params: string) => {
|
||||
const index = props.names.findIndex((item) => item === params);
|
||||
let str = params + ' ';
|
||||
switch (params) {
|
||||
case 'BIS':
|
||||
str += `${series[index].data[series[index].data.length - 1]}`;
|
||||
break;
|
||||
case 'HR':
|
||||
str += `${series[index].data[series[index].data.length - 1]} 次/分`;
|
||||
break;
|
||||
case 'SBP':
|
||||
str += `${series[index].data[series[index].data.length - 1]} mmHg`;
|
||||
break;
|
||||
case 'DBP':
|
||||
str += `${series[index].data[series[index].data.length - 1]} mmHg`;
|
||||
break;
|
||||
case 'SPO2':
|
||||
str += `${series[index].data[series[index].data.length - 1]}`;
|
||||
break;
|
||||
case 'TEMP':
|
||||
str += `${series[index].data[series[index].data.length - 1]}`;
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
return str;
|
||||
},
|
||||
data: legendData
|
||||
},
|
||||
grid: {
|
||||
left: 5,
|
||||
right: 25,
|
||||
bottom: 5,
|
||||
top: 40,
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
show: true,
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
data: [],
|
||||
axisLine: {lineStyle: {color: '#006080'}}
|
||||
},
|
||||
yAxis: {
|
||||
show: true,
|
||||
type: 'value',
|
||||
axisLabel: {
|
||||
formatter: `{value} ${props.names[0] === 'BIS' ? '次/分' : props.names[0] === 'SBP' ? 'mmHg' : ''}`
|
||||
},
|
||||
axisLine: {show: true, lineStyle: {color: '#006080'}},
|
||||
splitLine: {lineStyle: {color: '#C0C4CC', width: 1, type: 'dashed'}},
|
||||
},
|
||||
series,
|
||||
};
|
||||
if (props.names[0] !== 'BIS'
|
||||
) {
|
||||
option.yAxis.max = (value: any) => value.max + 20;
|
||||
}
|
||||
chart.setOption(option);
|
||||
chart.resize();
|
||||
window.addEventListener('resize', () => {
|
||||
chart.resize();
|
||||
});
|
||||
}
|
||||
|
||||
function getSeries() {
|
||||
props.names.forEach(name => {
|
||||
const serie = {
|
||||
name,
|
||||
type: 'line',
|
||||
symbol: 'none',
|
||||
smooth: true,
|
||||
data: [] as number[],
|
||||
};
|
||||
for (let i = 0; i < 10; i++) {
|
||||
serie.data.push(0);
|
||||
}
|
||||
series.push(serie)
|
||||
});
|
||||
props.names.forEach(name => {
|
||||
const serie = {
|
||||
name,
|
||||
type: 'line',
|
||||
symbol: 'none',
|
||||
smooth: true,
|
||||
data: [] as number[],
|
||||
};
|
||||
for (let i = 0; i < 10; i++) {
|
||||
serie.data.push(0);
|
||||
}
|
||||
series.push(serie)
|
||||
});
|
||||
}
|
||||
|
||||
function getXData() {
|
||||
for (let i = 0; i < 10; i++) {
|
||||
xData.push(0);
|
||||
}
|
||||
for (let i = 0; i < 10; i++) {
|
||||
xData.push(0);
|
||||
}
|
||||
}
|
||||
|
||||
function getLegendData() {
|
||||
props.names.forEach((name, index) => {
|
||||
legendData.push({
|
||||
name,
|
||||
textStyle: {color: colors[index]},
|
||||
});
|
||||
});
|
||||
props.names.forEach((name, index) => {
|
||||
legendData.push({
|
||||
name,
|
||||
textStyle: {color: colors[index]},
|
||||
});
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.chart-dom-box {
|
||||
position: relative;
|
||||
position: relative;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -140,7 +140,9 @@ onMounted(() => {
|
|||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
remoteWsStore.unsubscribeVital(remoteItem.value.patient, remoteItem.value.patientId, remoteItem.value.date, currentIndex);
|
||||
if (remoteItem.value) {
|
||||
remoteWsStore.unsubscribeVital(remoteItem.value.patient, remoteItem.value.patientId, remoteItem.value.date, currentIndex);
|
||||
}
|
||||
})
|
||||
|
||||
function showData(i: any) {
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user