单应用项目,可以创建很多独立工具类页面 ,不用登录 初始化的页面
gx
chenyc
2025-02-12 d70ce4e79119242635e3173f37a39bb75f843cfd
gx
1个文件已添加
1个文件已修改
117 ■■■■ 已修改文件
src/img/maibo2.png 补丁 | 查看 | 原始文档 | blame | 历史
src/views/Home.vue 117 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/img/maibo2.png
src/views/Home.vue
@@ -93,6 +93,38 @@
          </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;">&#x2191;</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;">&#x2193;</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;" >&hearts;</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 }"
@@ -171,7 +203,7 @@
                    <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%"
@@ -182,7 +214,7 @@
                    <span style="color: #303133">{{
                      Number(deviceData.iot_当前脱水量).toFixed(1)
                    }}</span
                    >/<span style="font-size: 90%">{{
                      >/<span>{{
                      Number(deviceData.处方脱水量).toFixed(1)
                    }}</span>
                  </span>
@@ -200,7 +232,7 @@
                    <span style="color: #303133">{{
                      jgTime4(deviceData.iot_透析时间)
                    }}</span
                    >/<span style="color: #606266"
                      >/<span
                      >{{ deviceData.透析处方的时长_小时 }}:{{
                        deviceData.透析处方的时长_分钟
                      }}</span
@@ -220,12 +252,15 @@
            </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%"
@@ -329,7 +364,7 @@
      </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}}
@@ -338,14 +373,14 @@
            </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">
@@ -357,6 +392,7 @@
        <el-alert title="患者治疗过程中掉压验证,请注意!" type="warning"  show-icon /> -->
    </el-row>
      </template>
    </div>
    <div
      v-else
@@ -468,6 +504,7 @@
    </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"
@@ -501,10 +538,10 @@
</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";
@@ -520,6 +557,8 @@
const readyState = ref({ key: 0, value: "正在链接中" });
const deviceCode=ref('')
const shishiTime=ref(new Date())
//有没有推送过血压如果有 就一直会显示血压数据
const isinitXy=ref(false)
const 床旁血压计=ref({
  date_time:'',
  sbp:'',
@@ -699,12 +738,25 @@
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.透析状态;
});
@@ -808,6 +860,7 @@
  backgroundSize: "cover", // 根据需要调整
  backgroundPosition: "center", // 根据需要调整
};
watch(
  () => txzt.value,
  () => {
@@ -914,8 +967,9 @@
                  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,
@@ -923,6 +977,9 @@
                      dbp:dataBody?.床旁血压结果?.dbp,
                      zuihouTime:date
                    }
                    setTimeout(()=>{
                      initTupiao()
                    },500)
                  }else if(dataBody.推送类型==='中央监控大屏信息'){
                    console.log(Date.now() + 'DEV')
                    if(dataBody?.透析状态){
@@ -951,6 +1008,21 @@
            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')
@@ -1124,7 +1196,8 @@
          proxy.$refs["echartsDiv" + deviceData.value.设备编号]
        );
        const option = {
          backgroundColor: textcolor.value,
          backgroundColor: 床旁血压计.value.zuihouTime>shishiTime.value?'#ffffff':textcolor.value,
          // backgroundColor: textcolor.value,
          tooltip: {
            trigger: "axis",
          },
@@ -1168,7 +1241,7 @@
        );
        const option = {
          backgroundColor: textcolor.value,
          backgroundColor: 床旁血压计.value.zuihouTime>shishiTime.value?'#ffffff':textcolor.value,
          tooltip: {
            trigger: "axis",
          },
@@ -1464,15 +1537,15 @@
.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 {