| | |
| | | </span> |
| | | </div> |
| | | </el-row> |
| | | <template v-if="床旁血压计.zuihouTime>shishiTime"> |
| | | <el-row style="height: 80%; background-color: #ffffff"> |
| | | <el-col :span="8" style="font-weight: bold; color: black; "> |
| | | <div style="height: 30%; text-align: right;" class="grid-container"> |
| | | <p><b style="font-size: 200%;color: red;">↑</b><b style="font-size:800%">178</b></p> |
| | | </div> |
| | | <div style="height: 30%; text-align: right; " class="grid-container"> |
| | | <p><b style="font-size: 200%;color: red;">↓</b><b style="font-size:800%">88</b></p> |
| | | </div> |
| | | <div style="height: 33%; text-align: right;" class="grid-container"> |
| | | <div> |
| | | <!-- <el-image style="width: 50px; height: 50px;" :src="maibo"></el-image> 2 --> |
| | | <p><b style="font-size: 300%;color: red;" >♥</b><b style="font-size:800%">78</b></p> |
| | | </div> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="4"></el-col> |
| | | <el-col :span="12"> |
| | | <!-- 展示血压记录图 --> |
| | | <div |
| | | v-if="Number(deviceData.透析状态) > 1" |
| | | :ref="'echartsDiv' + deviceData.设备编号" |
| | | style="height: 80%;width: 100%;" |
| | | > |
| | | </div> |
| | | <div style="height: 20%;text-align: center;" class="grid-container"> |
| | | {{床旁血压计.date_time}} |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | </template> |
| | | <template v-else> |
| | | <el-row |
| | | v-if="deviceData.患者姓名 !== ''" |
| | | :style="{ backgroundColor: textcolor }" |
| | |
| | | <span style="color: #303133">{{ |
| | | Number(deviceData.iot_当前脱水量).toFixed(1) |
| | | }}</span |
| | | >/<span style="font-size: 90%">{{ |
| | | >/<span>{{ |
| | | Number(deviceData.iot_脱水目标量).toFixed(1) |
| | | }}</span |
| | | ><span style="font-size: 80%" |
| | |
| | | <span style="color: #303133">{{ |
| | | Number(deviceData.iot_当前脱水量).toFixed(1) |
| | | }}</span |
| | | >/<span style="font-size: 90%">{{ |
| | | >/<span>{{ |
| | | Number(deviceData.处方脱水量).toFixed(1) |
| | | }}</span> |
| | | </span> |
| | |
| | | <span style="color: #303133">{{ |
| | | jgTime4(deviceData.iot_透析时间) |
| | | }}</span |
| | | >/<span style="color: #606266" |
| | | >/<span |
| | | >{{ deviceData.透析处方的时长_小时 }}:{{ |
| | | deviceData.透析处方的时长_分钟 |
| | | }}</span |
| | |
| | | </el-row> |
| | | </div> |
| | | </el-col> |
| | | |
| | | <el-col :span="12"> |
| | | <!-- 展示血压记录图 --> |
| | | <div |
| | | v-if="Number(deviceData.透析状态) > 1" |
| | | :ref="'echartsDiv' + deviceData.设备编号" |
| | | style="height: 97%" |
| | | ></div> |
| | | > |
| | | </div> |
| | | <div |
| | | v-if="Number(deviceData.透析状态) === 1" |
| | | style="text-align: right; height: 100%" |
| | |
| | | </el-row> |
| | | <el-row style="height: 20%;background-color: #ffffff; "> |
| | | |
| | | <div v-if="床旁血压计.zuihouTime>shishiTime" style="color: cornflowerblue;height: 20%; width: 100%;" class="grid-container"> |
| | | <div v-if="isinitXy" style="color: cornflowerblue;height: 20%; width: 100%;" class="grid-container"> |
| | | <div style="text-align: center;width: 100%; color: #909399;"> |
| | | <!-- {{isShowXY}} --> |
| | | <!-- {{床旁血压计.zuihouTime}} / {{shishiTime}} |
| | |
| | | </div> |
| | | |
| | | </div> |
| | | <div v-if="床旁血压计.zuihouTime>shishiTime" style="font-size: 300%; color: cornflowerblue;height: 80%; width: 100%;" class="grid-container"> |
| | | <div v-if="isinitXy" style="font-size: 300%; color: cornflowerblue;height: 80%; width: 100%;" class="grid-container"> |
| | | |
| | | <div style="text-align: center;width: 100%;" class="flash-text"> |
| | | 高压:{{床旁血压计.sbp}},低压: {{床旁血压计.dbp}}, 心率: {{床旁血压计.pulseRate}} |
| | | </div> |
| | | |
| | | </div> |
| | | <div v-else style="font-size: 200%;height: 100%;text-align: center; color: #909399;padding: 5px;" class="grid-container"> |
| | | <div v-else style="font-size: 200%;height: 100%;text-align: center;padding: 5px; font-weight: 1000;" class="grid-container"> |
| | | 透析器:{{deviceData.透析器}} |
| | | </div> |
| | | <!-- <div style="font-size: 300%; color: red;height: 100%;" class="grid-container"> |
| | |
| | | <el-alert title="患者治疗过程中掉压验证,请注意!" type="warning" show-icon /> --> |
| | | |
| | | </el-row> |
| | | </template> |
| | | </div> |
| | | <div |
| | | v-else |
| | |
| | | </div> |
| | | <!-- 设置按钮 --> |
| | | <button id="settingsButton" class="fixed-bottom-right" @click="centerDialogVisible=true">⚙️</button> |
| | | <!-- <button id="settingsButton" class="fixed-bottom-right" @click="showxuye">⚙️</button> --> |
| | | <el-dialog |
| | | :show-close="false" |
| | | :close-on-press-escape="false" |
| | |
| | | </template> |
| | | <script lang="ts" setup> |
| | | import TQS88 from "../img/TQS88.png"; |
| | | import maibo from '../img/maibo.png' |
| | | import maibo from '../img/maibo2.png' |
| | | import xueya from '../img/xueya.png' |
| | | import {EventSourcePolyfill} from 'event-source-polyfill'; |
| | | import { computed, getCurrentInstance, onBeforeMount, onMounted, ref, watch } from "vue"; |
| | | import { computed, getCurrentInstance, onBeforeMount, onMounted, ref, watch, watchEffect } from "vue"; |
| | | import { Local } from '../utils/storage'; |
| | | import * as echarts from "echarts"; |
| | | import { jgTime4 } from "../utils/formatTime"; |
| | |
| | | const readyState = ref({ key: 0, value: "正在链接中" }); |
| | | const deviceCode=ref('') |
| | | const shishiTime=ref(new Date()) |
| | | //有没有推送过血压如果有 就一直会显示血压数据 |
| | | const isinitXy=ref(false) |
| | | const 床旁血压计=ref({ |
| | | date_time:'', |
| | | sbp:'', |
| | |
| | | const ls = ref(""); |
| | | const ddd = ref(""); |
| | | const isShowXY=computed(()=>{ |
| | | if(床旁血压计.value.zuihouTime>new Date()){ |
| | | if(床旁血压计.value.zuihouTime>shishiTime.value){ |
| | | return true |
| | | }else{ |
| | | return false |
| | | } |
| | | }) |
| | | watch(() =>isShowXY.value, |
| | | ()=>{ |
| | | if(床旁血压计.value.zuihouTime>shishiTime.value){ |
| | | |
| | | }else{ |
| | | setTimeout(()=>{ |
| | | initTupiao() |
| | | },500) |
| | | |
| | | |
| | | } |
| | | } |
| | | ) |
| | | const txzt: any = computed(() => { |
| | | return deviceData.value.透析状态; |
| | | }); |
| | |
| | | backgroundSize: "cover", // 根据需要调整 |
| | | backgroundPosition: "center", // 根据需要调整 |
| | | }; |
| | | |
| | | watch( |
| | | () => txzt.value, |
| | | () => { |
| | |
| | | console.log(dataBody) |
| | | console.log(dataBody) |
| | | if(dataBody.推送类型==='床旁血压计'){ |
| | | isinitXy.value=true |
| | | let date = new Date(); |
| | | date.setMinutes(date.getMinutes() + 1); |
| | | date.setMinutes(date.getMinutes() + 0.1); |
| | | 床旁血压计.value={ |
| | | date_time:dataBody?.床旁血压结果?.measureTime, |
| | | sbp:dataBody?.床旁血压结果?.sbp, |
| | |
| | | dbp:dataBody?.床旁血压结果?.dbp, |
| | | zuihouTime:date |
| | | } |
| | | setTimeout(()=>{ |
| | | initTupiao() |
| | | },500) |
| | | }else if(dataBody.推送类型==='中央监控大屏信息'){ |
| | | console.log(Date.now() + 'DEV') |
| | | if(dataBody?.透析状态){ |
| | |
| | | console.log(error); |
| | | } |
| | | }; |
| | | const showxuye=()=>{ |
| | | let date = new Date(); |
| | | date.setMinutes(date.getMinutes() + 0.1); |
| | | 床旁血压计.value={ |
| | | date_time:'2023-32-3232', |
| | | sbp:'117', |
| | | pulseRate:'77', |
| | | dbp:'99', |
| | | zuihouTime:date |
| | | } |
| | | isinitXy.value=true |
| | | setTimeout(()=>{ |
| | | initTupiao() |
| | | },500) |
| | | } |
| | | //初始化 |
| | | const sourceInit = () => { |
| | | console.log('初始化see') |
| | |
| | | proxy.$refs["echartsDiv" + deviceData.value.设备编号] |
| | | ); |
| | | const option = { |
| | | backgroundColor: textcolor.value, |
| | | backgroundColor: 床旁血压计.value.zuihouTime>shishiTime.value?'#ffffff':textcolor.value, |
| | | // backgroundColor: textcolor.value, |
| | | tooltip: { |
| | | trigger: "axis", |
| | | }, |
| | |
| | | ); |
| | | |
| | | const option = { |
| | | backgroundColor: textcolor.value, |
| | | backgroundColor: 床旁血压计.value.zuihouTime>shishiTime.value?'#ffffff':textcolor.value, |
| | | tooltip: { |
| | | trigger: "axis", |
| | | }, |
| | |
| | | .fixed-bottom-right:hover { |
| | | background-color: #0056b3; |
| | | } |
| | | /* 定义闪现动画的关键帧 */ |
| | | @keyframes flash { |
| | | 0%, 100% { |
| | | opacity: 1; /* 开始和结束时完全可见 */ |
| | | } |
| | | 50% { |
| | | opacity: 0; /* 中间时刻完全透明 */ |
| | | } |
| | | } |
| | | // /* 定义闪现动画的关键帧 */ |
| | | // @keyframes flash { |
| | | // 0%, 100% { |
| | | // opacity: 1; /* 开始和结束时完全可见 */ |
| | | // } |
| | | // 50% { |
| | | // opacity: 0; /* 中间时刻完全透明 */ |
| | | // } |
| | | // } |
| | | |
| | | /* 应用动画到 div */ |
| | | .flash-text { |