单应用项目,可以创建很多独立工具类页面 ,不用登录 初始化的页面
zhangchen
2025-07-08 8ed3df9193c0cb06c8be8d246fa749e6a5423609
src/views/deviceWindoes2.vue
@@ -1,7 +1,9 @@
<template>
  <div class="divice">
    <!-- {{数据初始化}} -->
    <div class="youzhiliao" style="height: 100%" v-if="deviceData.患者姓名">
    <el-carousel v-show="deviceData.患者姓名 && pageHeight > 0" height="auto" :autoplay="false" motion-blur :initial-index="0" always="always">
      <el-carousel-item  :style="{ height: pageHeight + 'px'}">
      <div class="youzhiliao" style="height: 100%" >
      <div class="toubu" style="height: 11%">
        <el-row
          v-if="deviceData.患者姓名 !== ''"
@@ -24,22 +26,33 @@
          <span
            class="grid-container"
            @click="initTupiao"
            style="margin-left: 5%; font-size: 350%; height: 100%"
            style="margin-left: 2%; font-size: 200%; height: 100%"
            >{{ deviceData.患者姓名 }}
          </span>
          <span
            class="grid-container"
            v-if="deviceData.年龄 !== null"
            style="margin-left: 5%; font-size: 300%; height: 100%"
            style="margin-left: 2%; font-size: 200%; height: 100%"
            >{{ deviceData.年龄 }}岁</span
          >
          <span
            class="grid-container"
            style="margin-left: 5%; font-size: 300%; height: 100%"
            style="margin-left: 2%; font-size: 200%; height: 100%"
            >{{ deviceData.性别 }}</span
          >
          <span
            class="grid-container"
            style="margin-left: 2%; font-size: 200%; height: 100%"
            >{{ patientSourceAndCode }}</span
          >
          <span
          v-if="deviceData.签到号"
            class="grid-container"
            style="margin-left: 2%; font-size: 200%; height: 100%"
            >{{ deviceData.签到号 }}</span
          >
          <div
            style="
              position: absolute;
@@ -473,12 +486,12 @@
                      height: 75%;
                      text-align: center;
                      font-weight: 600;
                      font-size: 50px;
                      color: #333333;
                      color: #ca7070;
                      overflow-y: auto;
                    "
                  >
                    <el-row style="font-size: 30px">
                    <el-row style="font-size: 20px">
                      <el-col
                        v-for="(row, index) in deviceData.异常检验指标"
                        :span="8"
@@ -512,7 +525,7 @@
                      height: 75%;
                      text-align: center;
                      font-weight: 600;
                      font-size: 50px;
                      font-size: 25px;
                      color: #8079cb;
                    "
                    class="grid-container"
@@ -628,12 +641,12 @@
      <div
        class="mowei"
        style="height: 39%"
        v-if="Number(deviceData.透析状态) > 0"
        v-show="Number(deviceData.透析状态) > 0"
      >
        <el-row style="height: 100%; padding: 0px 20px 10px 20px">
          <!-- 未签到 -->
          <div
            v-if="Number(deviceData.透析状态) < 1"
            v-show="Number(deviceData.透析状态) < 1"
            style="height: 70%; width: 100%"
          >
            <div class="container">
@@ -772,7 +785,7 @@
            </div>
          </div>
          <!-- 已签到 -->
          <div v-else style="height: 80%; width: 100%; padding-right: 0px">
          <div v-show="Number(deviceData.透析状态) >= 1" style="height: 80%; width: 100%; padding-right: 0px">
            <div style="height: 100%">
              <el-row
                style="height: 30%; padding: 0px 0px 10px 0px"
@@ -858,13 +871,14 @@
                        font-size: 50px;
                        color: #333333;
                        color: #ca7070;
                        overflow-y: auto;
                      "
                    >
                      <el-row style="font-size: 30px">
                      <el-row style="font-size: 20px">
                        <el-col
                          v-for="(row, index) in deviceData.异常检验指标"
                          :span="12"
                          style="font-weight: 700"
                          style="font-weight: 700;"
                          :key="index"
                        >
                          {{ getItemName(row?.项目名称) }}
@@ -887,10 +901,10 @@
                      padding-bottom: 10px; /* 设置所有方向的间距为10px */
                    "
                  >
                    <div style="height: 100%">
                    <div v-show="Number(deviceData.透析状态) > 1" class="zcc_test" style="height: 100%">
                      <div
                        v-if="Number(deviceData.透析状态) > 1"
                        :ref="'echartsDiv' + deviceData.设备编号"
                        :class="'echartsDiv-' + deviceData.设备编号"
                        style="height: 97%"
                      ></div>
                    </div>
@@ -919,7 +933,7 @@
                  referrerpolicy="no-referrer"
                  src="https://lanhu-oss.lanhuapp.com/SketchPng7d7c4e66d2f3fb56cb7c93cf3b359782ee05a12117f39e9b1836bff686aca428"
                />
                <span
                  class="text-group_3"
                  v-if="isinitXy && Number(deviceData.透析状态) >= 1"
@@ -937,7 +951,7 @@
      <div
        class="mowei"
        style="height: 39%"
        v-if="Number(deviceData.透析状态) === 0"
        v-show="Number(deviceData.透析状态) === 0"
      >
        <el-row gutter="20" style="height: 100%; padding: 10px 20px 20px 20px">
          <el-col :span="12" style="height: 100%">
@@ -1089,7 +1103,101 @@
        </el-row>
      </div>
    </div>
    <div v-else style="height: 100%">
      </el-carousel-item>
      <el-carousel-item :style="{ height: pageHeight + 'px'}">
        <div class="toubu" style="height: 11%">
        <el-row
          v-show="deviceData.患者姓名 !== ''"
          style="
            font-weight: 900;
            color: #ffffff;
            width: 100%;
            height: 100%;
            line-height: 100%;
            padding: 20px;
            position: relative;
          "
        >
          <span
            class="grid-container"
            style="font-size: 300%; height: 100%"
            v-if="deviceData.设备名称 !== null"
            >{{ deviceData.设备名称 }}
          </span>
          <span
            class="grid-container"
            @click="initTupiao"
            style="margin-left: 2%; font-size: 200%; height: 100%"
            >{{ deviceData.患者姓名 }}
          </span>
          <span
            class="grid-container"
            v-if="deviceData.年龄 !== null"
            style="margin-left: 2%; font-size: 200%; height: 100%"
            >{{ deviceData.年龄 }}岁</span
          >
          <span
            class="grid-container"
            style="margin-left: 2%; font-size: 200%; height: 100%"
            >{{ deviceData.性别 }}</span
          >
          <span
            class="grid-container"
            style="margin-left: 2%; font-size: 200%; height: 100%"
            >{{ patientSourceAndCode }}</span
          >
          <span
          v-if="deviceData.签到号"
            class="grid-container"
            style="margin-left: 2%; font-size: 200%; height: 100%"
            >{{ deviceData.签到号 }}</span
          >
          <div
            style="
              position: absolute;
              top: 0;
              right: 0;
              display: flex;
              align-items: center;
              justify-content: flex-end;
              padding: 5px;
              height: 100%;
            "
          >
            <div
              class="grid-container"
              style="display: flex; align-items: center; padding-right: 20px"
            >
              <span
                style="
                  display: inline-block;
                  margin-right: 15px;
                  font-size: 30px;
                  color: #f56c6c;
                "
                >{{ 倒计时显示 }}</span
              >
              <span style="display: inline-block; margin-right: 15px">
                <img @click="dingshiShow" :src="dingshi" alt="Image 1" />
              </span>
              <span style="display: inline-block">
                <img
                  @click="centerDialogVisible = true"
                  :src="shezhi"
                  alt="Image 2"
                />
              </span>
            </div>
          </div>
        </el-row>
      </div>
        <DoctorAdvice :height="'89%'" :list="deviceData.透析单医嘱列表" />
      </el-carousel-item>
    </el-carousel>
    <div v-show="!deviceData.患者姓名" style="height: 100%">
      <div class="toubu" style="height: 11%">
        <el-row
          style="
@@ -1108,7 +1216,7 @@
            v-if="deviceData.设备名称 !== null"
            >{{ deviceData.设备名称 }}
          </span>
          <div
            style="
              position: absolute;
@@ -1145,7 +1253,7 @@
                  "
                  >{{ 倒计时显示 }}</span
                >
                <span style="display: inline-block; margin-right: 15px">
                  <img @click="dingshiShow" :src="dingshi" alt="Image 1" />
                </span>
@@ -1295,7 +1403,7 @@
                </div>
              </div>
              <!-- <div class="container-weiqiandao" >
                  <div class="item-weiqiandao" style="background: #E5EEFF;border-radius: 8px;height: 100%;">
                    <div class="container-cord" style="height: 30px;">
                      <img style="width: 25px;" referrerpolicy="no-referrer" :src="tsl"
@@ -1531,8 +1639,8 @@
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="centerDialogVisible = false">取消</el-button>
          <el-button @click="test">测试播报</el-button>
          <el-button @click="toggleAlarm">测试报警</el-button>
          <!-- <el-button @click="test">测试播报</el-button> -->
          <!-- <el-button @click="toggleAlarm">测试报警</el-button> -->
          <el-button type="primary" @click="saveSet"> 确认 </el-button>
          <el-button type="success" @click="shuaxin"> 刷新 </el-button>
        </div>
@@ -1579,7 +1687,7 @@
                <span class="text-gray-500">分钟 </span>
              </el-col>
            </el-form-item>
            <el-form-item label="提醒内容:">
              <el-input
                v-if="!formInline.selectOpen"
@@ -1599,6 +1707,9 @@
                <el-option label="测血压" value="测血压" />
                <el-option label="开超滤" value="开超滤" />
                <el-option label="给药" value="给药" />
                <el-option label="调电导度" value="调电导度" />
                <el-option label="调血流量" value="调血流量" />
                <el-option label="冲管" value="冲管" />
              </el-select>
            </el-form-item>
            <el-form-item label="定型文:">
@@ -1665,8 +1776,14 @@
import cljd from "../img/cljd.png";
import tizhong from "../img/tizhong.png";
import { EventSourcePolyfill } from "event-source-polyfill";
import alertbaojin from '../assets/alert.wav'
import alertbaojin from "../assets/alert.wav";
import cxybaojing from "../assets/cxy.mp3";
import gybaojing from "../assets/gy.mp3";
import kclbaojing from "../assets/kcl.mp3";
import tdddbaojing from "../assets/tzddd.mp3";
import tzxllbaojing from "../assets/tzxll.mp3";
import cgbaojing from "../assets/cg.mp3";
import {
  computed,
  getCurrentInstance,
@@ -1676,31 +1793,91 @@
  watch,
  onUnmounted,
  onBeforeUnmount,
  nextTick,
} from "vue";
import { Local } from "../utils/storage";
import * as echarts from "echarts";
import { jgTime4 } from "../utils/formatTime";
import { setTimeoutAlert } from "../utils/httpApi";
import DoctorAdvice from '../components/doctorAdvice/index.vue';
// 创建 Audio 对象,指向 public 目录下的音频文件
const alarmSound = new Audio(alertbaojin)
const alarmSound = new Audio(alertbaojin); //一般报警声音
const alarmSoundCXY = new Audio(cxybaojing); //测血压报警
alarmSoundCXY.loop = true; // 循环播放
const alarmSoundGY = new Audio(gybaojing); //给药报警
alarmSoundGY.loop = true; // 循环播放
const alarmSoundKCL = new Audio(kclbaojing); //开超滤报警
alarmSoundKCL.loop = true; // 循环播放
const alarmSoundTZDDD = new Audio(tdddbaojing); //调整电导度
alarmSoundTZDDD.loop = true; // 循环播放
const alarmSoundTZxll = new Audio(tzxllbaojing); //调整电导度
alarmSoundTZxll.loop = true; // 循环播放
const alarmSoundCG = new Audio(cgbaojing); //冲管
alarmSoundCG.loop = true; // 循环播放
// 控制播放状态的变量
const isPlaying = ref(false)
const isPlaying = ref(false);
// 切换播放/暂停的方法
const toggleAlarm = () => {
  console.log('-------------')
  console.log('看看是打开还是暂停')
  if (isPlaying.value) {
    alarmSound.pause()
    if (倒计时告警文本.value === "测血压") {
      alarmSoundCXY.pause();
    } else if (倒计时告警文本.value === "冲管") {
      alarmSoundCG.pause();
    } else if (倒计时告警文本.value === "开超滤") {
      alarmSoundKCL.pause();
    } else if (倒计时告警文本.value === "给药") {
      alarmSoundGY.pause();
    } else if (倒计时告警文本.value === "调电导度") {
      alarmSoundTZDDD.pause();
    } else if (倒计时告警文本.value === "调血流量") {
      alarmSoundTZxll.pause();
    } else {
      alarmSound.pause();
    }
  } else {
    alarmSound.currentTime = 0 // 从头开始播放
    alarmSound.play().catch((err) => {
      console.error('播放失败:', err)
    })
    if (倒计时告警文本.value === "测血压") {
      alarmSoundCXY.currentTime = 0; // 从头开始
      alarmSoundCXY.play().catch((err) => {
        console.error("播放失败:", err);
      });
    } else if (倒计时告警文本.value === "冲管") {
      alarmSoundCG.currentTime = 0; // 从头开始
      alarmSoundCG.play().catch((err) => {
        console.error("播放失败:", err);
      });
    } else if (倒计时告警文本.value === "开超滤") {
      alarmSoundKCL.currentTime = 0; // 从头开始
      alarmSoundKCL.play().catch((err) => {
        console.error("播放失败:", err);
      });
    } else if (倒计时告警文本.value === "给药") {
      alarmSoundGY.currentTime = 0; // 从头开始
      alarmSoundGY.play().catch((err) => {
        console.error("播放失败:", err);
      });
    } else if (倒计时告警文本.value === "调电导度") {
      alarmSoundTZDDD.currentTime = 0; // 从头开始
      alarmSoundTZDDD.play().catch((err) => {
        console.error("播放失败:", err);
      });
    } else if (倒计时告警文本.value === "调血流量") {
      alarmSoundTZxll.currentTime = 0; // 从头开始
      alarmSoundTZxll.play().catch((err) => {
        console.error("播放失败:", err);
      });
    } else {
      alarmSound.currentTime = 0; // 从头开始播放
      alarmSound.play().catch((err) => {
        console.error("播放失败:", err);
      });
    }
  }
  isPlaying.value = !isPlaying.value
}
// 语音播报
import Speech from "speak-tts";
const speech = ref(null);
  isPlaying.value = !isPlaying.value;
};
const { proxy } = getCurrentInstance() as any;
// 在需要使用的组件中引入
import { ChatDotSquare } from "@element-plus/icons-vue";
@@ -1713,6 +1890,10 @@
// sse状态
const readyState = ref({ key: 0, value: "正在链接中" });
// 血压的echart实例
let bloodPressureEchart: echarts.ECharts | null = null
let observer;
const deviceCode = ref("");
const shishiTime = ref(new Date());
//有没有推送过血压如果有 就一直会显示血压数据
@@ -1731,9 +1912,13 @@
  selectType: "",
  selectOpen: false,
});
const 当前客户耗材集合 = ref({});
const deviceData = ref({
  患者来源: null,
  患者门诊住院号: '',
  签到号: '',
  透析单医嘱列表: [],
  iot_传输时间: "2025-01-10 19:15:24",
  iot_当前脱水量: 2.04,
  iot_脱水目标量: 3.3,
@@ -1908,6 +2093,7 @@
const wd = ref("");
const ls = ref("");
const ddd = ref("");
const pageHeight = ref(0);
const isShowXY = computed(() => {
  if (床旁血压计.value.zuihouTime > shishiTime.value) {
    return true;
@@ -1915,12 +2101,25 @@
    return false;
  }
});
const patientSourceAndCode = computed(() => {
  let res = '';
  if (deviceData.value.患者来源 === null) {
    return ''
  } else {
    res = deviceData.value.患者来源 === 1 ? '住院号:' : '门诊号:';
    res += deviceData.value.患者门诊住院号;
  }
  return res;
})
watch(
  () => isShowXY.value,
  () => {
    if (床旁血压计.value.zuihouTime > shishiTime.value) {
    } else {
      setTimeout(() => {
        console.log("初始化血压图表222222");
        initTupiao();
      }, 500);
    }
@@ -1946,7 +2145,6 @@
};
// 保存定时任务
const setDingshi = () => {
  console.log("--------------------");
  console.log(formInline.value);
  console.log(deviceCode.value);
@@ -1957,7 +2155,7 @@
  } else {
    alertText = formInline.value.alertText;
  }
  if (alertText==='') {
  if (alertText === "") {
    ElMessage.warning("设置报警消息不能为空");
    return true;
  }
@@ -1970,14 +2168,14 @@
    if (res.data === "OK") {
      倒计时.value = minutes * 60;
      centerDialogVisible2.value = false;
      倒计时告警文本.value = alertText
      倒计时告警文本.value = alertText;
    } else {
      ElMessage.warning(res.message);
    }
  });
  // centerDialogVisible2.value=false
};
// 状态颜色
const zhuangtaiColor = computed(() => {
  const list = deviceData.value.设备状态列表;
@@ -2036,7 +2234,7 @@
      }
    });
  }
  return zhuantaiStr;
});
const isbaioji = computed(() => {
@@ -2077,7 +2275,7 @@
  backgroundSize: "cover", // 根据需要调整
  backgroundPosition: "center", // 根据需要调整
};
watch(
  () => txzt.value,
  () => {
@@ -2124,36 +2322,67 @@
  let hours = Math.floor(totalSeconds / 3600);
  let minutes = Math.floor((totalSeconds % 3600) / 60);
  let seconds = totalSeconds % 60;
  // 补零函数
  const pad = (num) => String(num).padStart(2, "0");
  return `${pad(hours)}:${pad(minutes)}:${pad(seconds)}`;
};
const 倒计时 = ref(-100);
const 倒计时显示 = ref("00:00:00");
const 倒计时告警文本 = ref("");
// 定时器回调函数
const updateTime = () => {
  倒计时.value--;
  if (倒计时.value > 0) {
    倒计时显示.value = formatSecondsToTime(倒计时.value);
    倒计时.value--;
  } else if(倒计时.value!==-100) {
  } else if (倒计时.value > -5) {
    倒计时显示.value = "";
    // 只有没触发的时候才触发他
    if(centerDialogVisible3.value===false){
      centerDialogVisible3.value = true;
      关闭弹框警告();
      // 播报警告文本(倒计时告警文本.value);
      toggleAlarm()
    }
  }else{
     if (centerDialogVisible3.value === false) {
       centerDialogVisible3.value = true;
       关闭弹框警告();
      //  toggleAlarm();
     }
  } else {
    倒计时显示.value = "";
  }
};
let intervalId = null;
watch(()=>centerDialogVisible3.value,()=>{
  if(centerDialogVisible3.value===false){
    alarmSound.pause();
    alarmSoundCXY.pause();
    alarmSoundKCL.pause();
    alarmSoundGY.pause();
    alarmSoundTZDDD.pause();
    alarmSoundTZxll.pause();
    alarmSoundCG.pause();
  }else{
    if (倒计时告警文本.value === "测血压") {
      alarmSoundCXY.play();
    }
    else if (倒计时告警文本.value === "冲管") {
      alarmSoundCG.play();
    }
    else if (倒计时告警文本.value === "开超滤") {
      alarmSoundKCL.play();
    }
    else if (倒计时告警文本.value === "给药") {
      alarmSoundGY.play();
    }
    else if (倒计时告警文本.value === "调电导度") {
      alarmSoundTZDDD.play();
    }
    else if (倒计时告警文本.value === "调血流量") {
      alarmSoundTZxll.play();
    }
    else {
      alarmSound.play();
    }
  }
})
onMounted(() => {
  let devcieCode = Local.get("devcieCode");
  if (devcieCode) {
@@ -2163,12 +2392,9 @@
    centerDialogVisible.value = true;
  }
  intervalId = setInterval(updateTime, 1000);
  speech.value = new Speech();
  speech.value?.setLanguage("zh-CN");
  speech.value?.init().then(() => {
    console.log("语音初 始化成功");
    // test()
  });
  const height = window.innerHeight;
  pageHeight.value = height;
});
// 在组件卸载前清除定时器,防止内存泄漏
onBeforeUnmount(() => {
@@ -2176,7 +2402,7 @@
    clearInterval(intervalId);
  }
});
const saveSet = () => {
  if (deviceCode.value) {
    centerDialogVisible.value = false;
@@ -2187,7 +2413,7 @@
    ElMessage.warning("请先输入设备编号");
  }
};
/**
 * 刷新页面
 */
@@ -2197,10 +2423,10 @@
const onFileChange = async (event: Event) => {
  const inputElement = event.target as HTMLInputElement;
  if (!inputElement.files || inputElement.files.length === 0) return;
  const file = inputElement.files[0];
  const reader = new FileReader();
  reader.onload = async (e) => {
    if (e.target && typeof e.target.result === "string") {
      try {
@@ -2228,7 +2454,7 @@
      }
    }
  };
  reader.readAsDataURL(file);
};
const shaoma = () => {};
@@ -2238,6 +2464,7 @@
    console.log(deviceData.value.设备名称, "子组件变量");
    setTimeout(() => {
      if (!xiaoduzhuangti.value) {
        console.log("初始化血压图表111111");
        initTupiao();
      }
    }, 500);
@@ -2249,7 +2476,7 @@
  // http://testbs.ihemodialysis.com/sse/sseEvent
  // const test='http://testbs.ihemodialysis.com/sse/sseEvent/'
  数据初始化.value = true;
  const test = "https://backend.ihemodialysis.com/sse/sseEvent/";
  const test = import.meta.env.VITE_SSE_BASE_URL;
  const stateArr = [
    { key: 0, value: "正在链接中" },
    { key: 1, value: "已经链接并且可以通讯" },
@@ -2286,12 +2513,15 @@
          if (dataBody.倒计时?.提醒文本) {
            倒计时.value = dataBody.倒计时?.设定提醒倒计时;
            console.log("设置了倒计时值", 倒计时.value);
            if (倒计时.value <= 0 && 倒计时.value >= -60&& centerDialogVisible3.value===false) {
            if (
              倒计时.value <= 0 &&
              倒计时.value >= -60 &&
              centerDialogVisible3.value === false
            ) {
              centerDialogVisible3.value = true;
              倒计时告警文本.value = dataBody.倒计时?.提醒文本;
              关闭弹框警告();
              播报警告文本(倒计时告警文本.value);
              toggleAlarm()
              // toggleAlarm();
            } else if (倒计时.value <= -60) {
              centerDialogVisible3.value = false;
            }
@@ -2308,6 +2538,7 @@
              zuihouTime: date,
            };
            setTimeout(() => {
        console.log("初始化血压图表444444");
              initTupiao();
            }, 500);
          } else if (dataBody.推送类型 === "中央监控大屏信息") {
@@ -2316,6 +2547,21 @@
            console.log(Date.now() + "DEV");
            if (dataBody?.透析状态) {
              deviceData.value = dataBody?.透析状态;
              if ('透析单医嘱列表' in dataBody.透析状态 && dataBody.透析状态?.透析单医嘱列表) {
                deviceData.value.透析单医嘱列表 = dataBody.透析状态.透析单医嘱列表;
              } else {
                deviceData.value.透析单医嘱列表 = []
              }
              if ('患者来源' in dataBody.透析状态) {
                deviceData.value.患者来源 = dataBody.透析状态.患者来源;
              } else {
                deviceData.value.患者来源 = null
              }
              if ('患者门诊住院号' in dataBody.透析状态) {
                deviceData.value.患者门诊住院号 = dataBody.透析状态.患者门诊住院号;
              } else {
                deviceData.value.患者门诊住院号 = ''
              }
            } else {
              deviceData.value.设备名称 = dataBody.IOT信息.床号;
              deviceData.value.患者姓名 = "";
@@ -2323,9 +2569,9 @@
                当前客户耗材集合.value = dataBody?.使用耗材字典;
              }
            }
            deviceData.value.设备变化 = Date.now() + "DEV";
            deviceData.value.属性历史列表 = dataBody?.IOT信息?.属性历史列表;
            console.log(deviceData.value.设备变化);
            deviceData.value.设备状态列表 = dataBody.IOT信息.状态列表;
@@ -2349,6 +2595,8 @@
  };
  isinitXy.value = true;
  setTimeout(() => {
        console.log("初始化血压图表333333");
    initTupiao();
  }, 500);
};
@@ -2356,56 +2604,9 @@
  setTimeout(function () {
    console.log("30秒已过,关闭报警设置弹框。");
    centerDialogVisible3.value = false;
    toggleAlarm()
    倒计时.value=-100
    倒计时.value = -100;
  }, 30000); // 30000 毫秒 = 30 秒
};
const 播报警告文本 = (tex) => {
  if (centerDialogVisible3.value) {
    console.log(centerDialogVisible3.value,'播报')
    speech.value
      .speak({
        text: tex,
        listeners: {
          //开始播放
          onstart: () => {
            console.log("开始播报");
          },
          //判断播放是否完毕
          onend: () => {
            console.log("播报完成");
          },
          //恢复播放
          onresume: () => {
            console.log("Resume utterance");
          },
        },
      })
      .then(() => {
        播报警告文本(tex);
      });
  }
};
const test=()=>{
  speech.value
      .speak({
        text: '你好,我现在在测试播报内容',
        listeners: {
          //开始播放
          onstart: () => {
            console.log("开始播报");
          },
          //判断播放是否完毕
          onend: () => {
            console.log("播报完成");
          },
          //恢复播放
          onresume: () => {
            console.log("Resume utterance");
          },
        },
      })
}
//初始化
const sourceInit = () => {
  console.log("初始化see");
@@ -2422,6 +2623,20 @@
onBeforeMount(() => {
  closeSource();
});
const renderEcharts = (options: any) => {
  const boxes = document.querySelectorAll(`.echartsDiv-${deviceData.value.设备编号}`);
  boxes.forEach(box => {
    if ((box as HTMLElement).dataset.initialized === 'true') return;
    const chart = echarts.init(box as HTMLElement);
    chart.setOption(options);
    (box as HTMLElement).dataset.initialized = 'true';
  });
}
const initTupiao = () => {
  if (deviceData.value.患者姓名 !== "") {
    const seriesData = [
@@ -2452,7 +2667,7 @@
          ],
        },
      },
      {
        name: "",
        type: "line",
@@ -2566,7 +2781,7 @@
            label: { fontSize: 20, color: "#409EFF" },
          });
          seriesData[2].markPoint.data.push({
            name: "上机血压",
            name: "上机压",
            value: e.脉搏,
            xAxis: index,
            yAxis: e.脉搏,
@@ -2580,9 +2795,14 @@
        xAxisData.push(1);
      }
      try {
        const myChart = echarts.init(
          proxy.$refs["echartsDiv" + deviceData.value.设备编号]
        );
        // console.log('proxy.$refs["echartsDiv" + deviceData.value.设备编号]: ', proxy.$refs["echartsDiv" + deviceData.value.设备编号])
        // if (!bloodPressureEchart) {
        //     bloodPressureEchart = echarts.init(
        //     proxy.$refs["echartsDiv" + deviceData.value.设备编号]
        //   );
        // }
        // console.log('bloodPressureEchart: ', bloodPressureEchart)
        const option = {
          // backgroundColor: 床旁血压计.value.zuihouTime>shishiTime.value?'#ffffff':textcolor.value,
          backgroundColor: "#ffffff",
@@ -2619,16 +2839,44 @@
          },
          series: seriesData,
        };
        myChart.setOption(option);
        // console.log("渲染设备", deviceData.value.设备编号, option);
        // console.log('deviceData.透析状态1: ', Number(deviceData.value.透析状态));
        // nextTick(() => {
        //     bloodPressureEchart.setOption(option);
        //     bloodPressureEchart.resize();
        //     setTimeout(() => {
        //     // 方法1:检查容器内是否有canvas元素
        //     const canvas = bloodPressureEchart.getDom().querySelector('canvas');
        //     console.log('canvas: ', canvas);
        //     if (!canvas) {
        //       console.error('图表渲染失败:未生成canvas元素');
        //       return;
        //     }
        //     // 方法2:检查canvas的宽高
        //     if (canvas.width === 0 || canvas.height === 0) {
        //       console.error('图表渲染失败:canvas宽高为0');
        //       return;
        //     }
        //     // 方法3:检查图表实例的宽高
        //     if (bloodPressureEchart.getWidth() === 0 || bloodPressureEchart.getHeight() === 0) {
        //       console.error('图表渲染失败:图表实例宽高为0');
        //       return;
        //     }}, 1000);
        // });
        renderEcharts(option);
      } catch (e) {
        console.log("图标渲染异常异常");
        console.log("图标渲染异常异常:", e);
      }
    } else {
      try {
        const myChart = echarts.init(
          proxy.$refs["echartsDiv" + deviceData.value.设备编号]
        );
        // if (!bloodPressureEchart) {
        //     // @ts-ignore
        //   bloodPressureEchart = echarts.init(
        //     proxy.$refs["echartsDiv" + deviceData.value.设备编号]
        //   );
        // }
        const option = {
          backgroundColor:
            床旁血压计.value.zuihouTime > shishiTime.value
@@ -2662,11 +2910,18 @@
          },
          series: [],
        };
        myChart.setOption(option);
        // console.log('deviceData.透析状态2: ', Number(deviceData.value.透析状态));
        // // bloodPressureEchart.setOption(option);
        // nextTick(() => {
        //   // bloodPressureEchart.setOption(option);
        //     bloodPressureEchart.setOption(option);
        // });
        renderEcharts(option);
      } catch (e) {
        console.log(
          "异常",
          proxy.$refs["echartsDiv" + deviceData.value.设备编号]
          proxy.$refs["echartsDiv" + deviceData.value.设备编号],
          e
        );
      }
    }
@@ -2685,7 +2940,7 @@
          tbdata1.push(Number(wdMode?.finalText));
          wd.value = Number(wdMode?.finalText);
        }
        // 血液流速
        const xymode = e.属性列表.find((l) => {
          return l.identifierText === "血液流速";
@@ -2694,7 +2949,7 @@
          tbdata2.push(Number(xymode?.finalText));
          ls.value = Number(xymode?.finalText);
        }
        // 电导度
        const dddMode = e.属性列表.find((l) => {
          return l.identifierText === "透析液电导度";
@@ -2844,10 +3099,12 @@
    } catch (e) {
      console.log("图标渲染异常异常");
    }
    console.log(deviceData.value);
  }
};
const getItemName = (name: string) => {
  if (name) {
    if (name === "血红蛋白测定") {
@@ -2883,6 +3140,7 @@
  width: 100%;
  height: 100%;
  border: 1px solid coral;
  user-select: none;
  .toubu {
    // padding-left: 20px;
    width: 100%;
@@ -2937,17 +3195,17 @@
    // border-bottom:8px solid red ;
  }
}
/* 应用闪烁动画 */
.blink {
  // float: left; /* 让div浮动到左边 */
  width: 100%;
  height: 100%;
  animation: blink 2s infinite; /* 每秒闪烁一次,无限次数 */
  //   border-left:5px solid red ;
  //   border-right:5px solid red ;
  //   background: red;
  cursor: pointer;
  //  margin-bottom: 100%;
@@ -2974,7 +3232,7 @@
  align-items: center; /* 垂直居中 */
  height: 100vh; /* 根据需要调整高度 */
}
.centered-text {
  font-weight: 600;
  /* 其他样式 */
@@ -3000,7 +3258,7 @@
  height: 100%;
  gap: 10px; /* 调整这个值来设置间隔 */
}
.item-weiqiandao {
  flex: 1; /* 确保每个子 div 占据相同的高度 */
  background-color: lightblue; /* 可以根据需要调整背景颜色 */
@@ -3035,7 +3293,7 @@
  width: 100%; /* 设置一个具体的宽度或确保有继承宽度 */
  font-weight: 600;
}
.right-div {
  width: 50px; /* 固定宽度 */
  font-size: 16px;
@@ -3048,27 +3306,27 @@
  height: 100%;
  overflow-y: auto; /* 当内容超出容器高度时,垂直方向上显示滚动条 */
}
/* 可选:给ul设置一些样式 */
.scrollable-container ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.scrollable-container li {
  // padding: 4px;
  font-weight: 600;
  // border-bottom: 1px solid #ddd;
}
.cont_parent {
  height: 100%;
  display: grid;
  grid-template-rows: repeat(3, 1fr); /* 将容器划分为3行,每行占1份 */
  gap: 5px; /* 子元素之间的间隙(可选) */
}
.cont_child {
  border: 1px solid #ccc;
  padding: 10px;
@@ -3087,7 +3345,7 @@
.custom-dialog {
  border-radius: 10px;
}
.my-header {
  background-color: #ff6b6b; /* 标题背景颜色 */
  color: white; /* 标题文字颜色 */
@@ -3102,4 +3360,4 @@
  padding: 0;
  padding-bottom: 10px;
}
</style>
</style>