ID1743-修改完成

zhangchen

2025-07-01 1dafbcf3148590cdf7de8f3694664888109afcda

ID1743-修改完成

 src/components/doctorAdvice/index.vue

@@ -1,5 +1,5 @@
<template>
  <div class="doctor_advice_container" :style="{ height: height + 'px' }">
  <div class="doctor_advice_container" :style="{ height: height }">
    <div class="doctor_advice_list">
      <div
        v-for="(item, index) in drugOrders"
@@ -32,8 +32,8 @@
  props: {
    // 容器的高度
    height: {
      type: Number,
      default: 0,
      type: String,
      default: '100%',
    },
    // 医嘱列表
    list: {

 src/views/a.vue

New file
@@ -0,0 +1,3284 @@
<template>
  <div class="divice">
    <!-- {{数据初始化}} -->
    <div class="youzhiliao" style="height: 100%" v-if="deviceData.患者姓名">
      <div id="toubu" class="toubu" style="height: 11%">
        <el-row
          v-if="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>
      <el-carousel v-if="contentHeight > 0" height="auto" :autoplay="false" motion-blur :initial-index="0" always="always">
        <el-carousel-item :style="{ height: (contentHeight - 10) + 'px' }">
          <div :style="{ height: (contentHeight - 10) + 'px' }">
            <div class="chongjian" style="height: 50%;">
            <el-row :gutter="20" style="height: 100%; padding: 20px 20px 10px 20px">
              <el-col :span="6" style="height: 100%; padding-bottom: 10px">
                <div style="height: 100%">
                  <div
                    :style="{ backgroundImage: `url(${deviceData.患者头像})` }"
                    style="
                      background-size: 100% 100%;
                      border-radius: 5px;
                      /* margin-bottom: 1%; */
                      height: 100%;
                      width: 100%;
                    "
                  ></div>
                </div>
              </el-col>
              <!-- 床旁显示血压计有数据的时候 -->
              <template v-if="床旁血压计.zuihouTime > shishiTime">
                <el-col :span="18" style="height: 100%">
                  <el-row style="height: 50%">
                    <div style="width: 100%; height: 100%; border-radius: 8px">
                      <div
                        class="item"
                        style="background-color: #ffffff; height: 97%"
                      >
                        <div style="height: 25%">
                          <div class="container-cord" style="height: 100%">
                            <img
                              style="width: 25px"
                              referrerpolicy="no-referrer"
                              :src="tsl"
                            />
                            <span class="text-group_3">血压</span>
                          </div>
                        </div>
                        <div
                          style="
                            height: 75%;
                            text-align: center;
                            font-weight: 600;
                            font-size: 65px;
                            color: #70a3dd;
                          "
                          class="grid-container"
                        >
                          {{ 床旁血压计.sbp }} / {{ 床旁血压计.dbp }}
                        </div>
                      </div>
                    </div>
                  </el-row>
                  <el-row style="height: 50%">
                    <div style="width: 100%; height: 100%; border-radius: 8px">
                      <div
                        class="item"
                        style="background-color: #ffffff; height: 97%"
                      >
                        <div style="height: 25%">
                          <div class="container-cord" style="height: 100%">
                            <img
                              style="width: 25px"
                              referrerpolicy="no-referrer"
                              :src="xinlv"
                            />
                            <span class="text-group_3">心率</span>
                          </div>
                        </div>
                        <div
                          style="
                            height: 75%;
                            text-align: center;
                            font-weight: 600;
                            font-size: 65px;
                            color: #70a3dd;
                          "
                          class="grid-container"
                        >
                          {{ 床旁血压计.pulseRate }}
                        </div>
                      </div>
                    </div>
                  </el-row>
                </el-col>
              </template>
              <!-- 未签到 -->
              <template v-else-if="Number(deviceData.透析状态) === 0">
                <el-col :span="18" style="height: 100%">
                  <el-row :gutter="20" style="width: 100%; height: 100%">
                    <el-col :span="14" style="height: 100%">
                      <div class="container-weiqiandao">
                        <div
                          class="item-weiqiandao"
                          style="background: #e5eeff; border-radius: 8px"
                        >
                          <div class="container-cord" style="height: 30px">
                            <img
                              style="width: 25px"
                              referrerpolicy="no-referrer"
                              :src="tsl"
                            />
                            <span class="text-group_3">治疗模式</span>
                          </div>
                          <div
                            class="container-body"
                            style="height: calc(100% - 30px); width: 100%"
                          >
                            <div
                              class="container-body-text"
                              style="color: #3a75b8; font-size: 30px"
                            >
                              <span
                                style="font-size: 30px"
                                v-if="deviceData.透析方案 === 'HDF'"
                              >
                                {{
                                  deviceData?.置换方式 === "前置换" ? "前" : "后"
                                }}</span
                              >
                              {{ deviceData.透析方案 }}
                            </div>
                          </div>
                        </div>
                        <div
                          class="item-weiqiandao"
                          style="background: #f9dede; border-radius: 8px"
                        >
                          <div class="container-cord" style="height: 30px">
                            <img
                              style="width: 25px"
                              referrerpolicy="no-referrer"
                              :src="tsl"
                            />
                            <span class="text-group_3">人工肾</span>
                          </div>
                          <div
                            class="grid-container"
                            style="
                              height: calc(100% - 30px);
                              width: 100%;
                              font-size: 28px;
                            "
                          >
                            <div
                              class="grid-container-text"
                              style="color: #a78718"
                              v-for="(item, index) in deviceData.透析器列表"
                              :style="{
                                fontSize:
                                  deviceData.透析器列表.length > 1
                                    ? '22px'
                                    : '28px',
                              }"
                              :key="index"
                            >
                              <div class="left-div">{{ item.name }}</div>
                              <div class="right-div">
                                {{ item.数量 }}{{ item.单位 }}
                              </div>
                            </div>
                          </div>
                        </div>
                        <div
                          class="item-weiqiandao"
                          style="background: #d9f0e2; border-radius: 8px"
                        >
                          <div class="container-cord" style="height: 30px">
                            <img
                              style="width: 25px"
                              referrerpolicy="no-referrer"
                              :src="tsl"
                            />
                            <span class="text-group_3">一次性循环管路</span>
                          </div>
                          <div
                            class="grid-container"
                            style="
                              height: calc(100% - 30px);
                              width: 100%;
                              font-size: 28px;
                            "
                          >
                            <div
                              class="grid-container-text"
                              style="color: #3ab859"
                              v-for="(item, index) in deviceData.管路列表"
                              :style="{
                                fontSize:
                                  deviceData.管路列表.length > 1 ? '22px' : '28px',
                              }"
                              :key="index"
                            >
                              <div class="left-div">{{ item.name }}</div>
                              <div class="right-div">{{ item.数量 }}支</div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </el-col>
                    <el-col :span="10" style="height: 100%">
                      <div class="container-weiqiandao">
                        <div
                          class="item-weiqiandao"
                          style="background: #f6f5fa; border-radius: 8px"
                        >
                          <div class="container-cord" style="height: 30px">
                            <img
                              style="width: 25px"
                              referrerpolicy="no-referrer"
                              :src="txztimg"
                            />
                            <span class="text-group_3">治疗状态</span>
                          </div>
                          <div
                            class="container-body"
                            style="height: calc(100% - 30px); width: 100%"
                          >
                            <div
                              class="container-body-text"
                              style="color: #333333; font-size: 50px"
                            >
                              {{ txztText }}
                            </div>
                          </div>
                        </div>
                        <div
                          class="item-weiqiandao"
                          style="background: #efe5ff; border-radius: 8px"
                        >
                          <div class="container-cord" style="height: 30px">
                            <img
                              style="width: 25px"
                              referrerpolicy="no-referrer"
                              :src="tsl"
                            />
                            <span class="text-group_3">透析液</span>
                          </div>
                          <div
                            class="grid-container"
                            style="
                              height: calc(100% - 30px);
                              width: 100%;
                              font-size: 28px;
                            "
                          >
                            <div
                              class="grid-container-text"
                              style="color: #3ab859"
                              :style="{
                                fontSize:
                                  deviceData.透析液列表.length > 1
                                    ? '22px'
                                    : '28px',
                              }"
                              v-for="(item, index) in deviceData.透析液列表"
                              :key="index"
                            >
                              <div class="left-div">{{ item.name }}</div>
                              <div class="right-div">
                                {{ item.数量 }}{{ item.单位 }}
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </el-col>
                  </el-row>
                </el-col>
              </template>
              <!-- 治疗中 -->
              <template v-else>
                <el-col :span="18" style="height: 100%">
                  <el-row style="height: 50%; padding-bottom: 10px">
                    <div style="width: 100%; height: 100%; border-radius: 8px">
                      <el-row style="height: 100%" :gutter="10">
                        <el-col class="itemboy" style="height: 100%" :span="7">
                          <div
                            class="item"
                            style="background-color: #ffffff; height: 97%"
                          >
                            <div style="height: 25%">
                              <div class="container-cord" style="height: 100%">
                                <img
                                  style="width: 25px"
                                  referrerpolicy="no-referrer"
                                  :src="zlms"
                                />
                                <span class="text-group_3">治疗模式</span>
                              </div>
                            </div>
                            <div
                              style="
                                height: 75%;
                                text-align: center;
                                font-weight: 600;
                                font-size: 50px;
                                color: #d58e56;
                              "
                              class="grid-container"
                            >
                              <div>
                                <span
                                  style="font-size: 30px"
                                  v-if="deviceData.透析方案 === 'HDF'"
                                >
                                  {{
                                    deviceData?.置换方式 === "前置换" ? "前" : "后"
                                  }}</span
                                >
                                {{ deviceData.透析方案 }}
                              </div>
                            </div>
                          </div>
                        </el-col>
                        <el-col class="itemboy" style="height: 100%" :span="7">
                          <div
                            class="item"
                            style="background-color: #ffffff; height: 97%"
                          >
                            <div style="height: 25%">
                              <div class="container-cord" style="height: 100%">
                                <img
                                  style="width: 25px"
                                  referrerpolicy="no-referrer"
                                  :src="txztimg"
                                />
                                <span class="text-group_3">治疗状态</span>
                              </div>
                            </div>
                            <div
                              style="
                                height: 75%;
                                text-align: center;
                                font-weight: 600;
                                font-size: 50px;
                                color: #70a3dd;
                              "
                              class="grid-container"
                            >
                              {{ txztText }}
                            </div>
                          </div>
                        </el-col>
                        <el-col class="itemboy" style="height: 100%" :span="10">
                          <div
                            class="item"
                            style="background-color: #ffffff; height: 97%"
                          >
                            <div style="height: 25%">
                              <div class="container-cord" style="height: 100%">
                                <img
                                  style="width: 25px"
                                  referrerpolicy="no-referrer"
                                  :src="txq"
                                />
                                <span class="text-group_3">人工肾</span>
                              </div>
                            </div>
                            <div
                              style="
                                height: 85%;
                                font-weight: 600;
                                font-size: 50px;
                                color: #8079cb;
                              "
                              class="scrollable-text"
                            >
                              {{ deviceData.透析器 }}
                            </div>
                          </div>
                        </el-col>
                      </el-row>
                    </div>
                  </el-row>
                  <!-- 签到未签到状态 -->
                  <div
                    class="container"
                    v-if="Number(deviceData.透析状态) < 1"
                    style="height: 50%"
                  >
                    <div class="item" style="background-color: #ffffff">
                      <div style="height: 25%">
                        <div class="container-cord" style="height: 100%">
                          <img
                            style="width: 25px"
                            referrerpolicy="no-referrer"
                            :src="xinlv"
                          />
                          <span class="text-group_3">异常指标</span>
                        </div>
                      </div>
                      <div
                        style="
                          height: 75%;
                          text-align: center;
                          font-weight: 600;
                              color: #333333;
                          color: #ca7070;
                          overflow: hidden;
                          overflow-y: auto;
                        "
                      >
                        <el-row style="font-size: 20px; overflow: hidden;">
                          <el-col
                            v-for="(row, index) in deviceData.异常检验指标"
                            :span="8"
                            style="font-weight: 700"
                            :key="index"
                          >
                            {{ getItemName(row?.项目名称) }}
                            <b
                              v-if="row?.结果标记 === 'g'"
                              style="font-weight: bold"
                              >⬆</b
                            >
                            <b v-else style="font-weight: bold">⬇</b>
                          </el-col>
                        </el-row>
                      </div>
                    </div>
                    <div class="item" style="background-color: #ffffff">
                      <div style="height: 25%">
                        <div class="container-cord" style="height: 100%">
                          <img
                            style="width: 25px"
                            referrerpolicy="no-referrer"
                            :src="tsl"
                          />
                          <span class="text-group_3">处方脱水量</span>
                        </div>
                      </div>
                      <div
                        style="
                          height: 75%;
                          text-align: center;
                          font-weight: 600;
                          font-size: 25px;
                          color: #8079cb;
                        "
                        class="grid-container"
                      >
                        <span v-if="deviceData.处方脱水量">
                          {{ deviceData.处方脱水量 }} L</span
                        >
                      </div>
                    </div>
                  </div>
                  <!-- 透析中状态 -->
                  <div class="container" v-else style="height: 50%">
                    <div class="item" style="background-color: #ffffff">
                      <div style="height: 10%">
                        <div class="container-cord" style="height: 100%">
                          <img
                            style="width: 25px"
                            referrerpolicy="no-referrer"
                            :src="sjjd"
                          />
                          <span class="text-group_3">时间进度</span>
                        </div>
                      </div>
                      <div
                        style="
                          height: 90%;
                          text-align: center;
                          font-weight: 600;
                          font-size: 38px;
                          color: #333333;
                        "
                        class="grid-container"
                      >
                        <div>
                          <span style="color: #303133">{{
                            jgTime4(deviceData.iot_透析时间)
                          }}</span
                          >/<span
                            >{{ deviceData.透析处方的时长_小时 }}:{{
                              deviceData.透析处方的时长_分钟
                            }}</span
                          >
                        </div>
                        <div>
                          <el-progress
                            :text-inside="true"
                            :stroke-width="15"
                            :show-text="false"
                            color="#70A3DD"
                            :percentage="
                              (Number(deviceData.iot_透析时间) /
                                (Number(deviceData.透析处方的时长) * 60)) *
                              100
                            "
                            status="success"
                          />
                        </div>
                      </div>
                    </div>
                    <div class="item" style="background-color: #ffffff">
                      <div style="height: 10%">
                        <div class="container-cord" style="height: 100%">
                          <img
                            style="width: 25px"
                            referrerpolicy="no-referrer"
                            :src="cljd"
                          />
                          <span class="text-group_3">超滤进度</span>
                        </div>
                      </div>
                      <div
                        style="
                          height: 90%;
                          text-align: center;
                          font-weight: 600;
                          font-size: 38px;
                          color: #8079cb;
                        "
                        class="grid-container"
                      >
                        <div>
                          <span style="color: #303133">{{
                            Number(deviceData.iot_当前脱水量).toFixed(1)
                          }}</span
                          >/<span>{{
                            Number(deviceData.iot_脱水目标量).toFixed(1)
                          }}</span
                          ><span style="font-size: 80%"
                            >({{ deviceData.iot_脱水速率 }})</span
                          >
                        </div>
                        <div>
                          <el-progress
                            :text-inside="true"
                            :stroke-width="15"
                            :show-text="false"
                            color="#70CAAE"
                            :percentage="
                              (Number(deviceData.iot_当前脱水量) /
                                Number(deviceData.处方脱水量)) *
                              100
                            "
                          />
                        </div>
                      </div>
                    </div>
                  </div>
                </el-col>
              </template>
            </el-row>
          </div>
          <!-- 治疗中 -->
          <div
            class="mowei"
            style="height: 39%;"
            v-if="Number(deviceData.透析状态) > 0"
          >
            <el-row style="height: 100%; padding: 0px 20px 10px 20px">
              <!-- 未签到 -->
              <div
                v-if="Number(deviceData.透析状态) < 1"
                style="height: 70%; width: 100%"
              >
                <div class="container">
                  <div class="item">
                    <div style="height: 25%">
                      <div class="container-cord" style="height: 100%">
                        <img
                          style="width: 25px"
                          referrerpolicy="no-referrer"
                          :src="tizhong"
                        />
                        <span class="text-group_3">干体重</span>
                      </div>
                    </div>
                    <div
                      style="
                        height: 75%;
                        text-align: center;
                        font-weight: 600;
                        font-size: 50px;
                        color: #333333;
                      "
                      class="grid-container"
                    >
                      {{ Number(deviceData.干体重).toFixed(1) }}
                    </div>
                  </div>
                  <div class="item">
                    <div style="height: 25%">
                      <div class="container-cord" style="height: 100%">
                        <img
                          style="width: 25px"
                          referrerpolicy="no-referrer"
                          :src="tizhong"
                        />
                        <span class="text-group_3">透前称重</span>
                      </div>
                    </div>
                    <div
                      style="
                        height: 75%;
                        text-align: center;
                        font-weight: 600;
                        font-size: 50px;
                        color: #333333;
                      "
                      class="grid-container"
                    >
                      {{ Number(deviceData.透前称重).toFixed(1) }}
                    </div>
                  </div>
                  <div class="item">
                    <div style="height: 25%">
                      <div class="container-cord" style="height: 100%">
                        <img
                          style="width: 25px"
                          referrerpolicy="no-referrer"
                          :src="tizhong"
                        />
                        <span class="text-group_3">上次透后体重</span>
                      </div>
                    </div>
                    <div
                      style="
                        height: 75%;
                        text-align: center;
                        font-weight: 600;
                        font-size: 50px;
                        color: #333333;
                      "
                      class="grid-container"
                    >
                      {{ Number(deviceData.上次透后称重).toFixed(1) }}
                    </div>
                  </div>
                  <div class="item">
                    <div style="height: 25%">
                      <div class="container-cord" style="height: 100%">
                        <img
                          style="width: 25px"
                          referrerpolicy="no-referrer"
                          :src="tizhong"
                        />
                        <span class="text-group_3">体重增长</span>
                      </div>
                    </div>
                    <div
                      style="
                        height: 75%;
                        text-align: center;
                        font-weight: 600;
                        font-size: 50px;
                        color: #333333;
                      "
                      class="grid-container"
                    >
                      <template
                        v-if="
                          deviceData.透前称重 &&
                          deviceData.干体重 &&
                          Number(deviceData.透前称重) > 0
                        "
                      >
                        +{{
                          Number(deviceData.透前称重 - deviceData.干体重).toFixed(1)
                        }}
                      </template>
                    </div>
                  </div>
                  <div class="item">
                    <div style="height: 25%">
                      <div class="container-cord" style="height: 100%">
                        <img
                          style="width: 25px"
                          referrerpolicy="no-referrer"
                          :src="tizhong"
                        />
                        <span class="text-group_3">增长率</span>
                      </div>
                    </div>
                    <div
                      style="
                        height: 75%;
                        text-align: center;
                        font-weight: 600;
                        font-size: 50px;
                        color: #333333;
                      "
                      class="grid-container"
                    >
                      <template v-if="deviceData.透前称重 && deviceData.干体重">
                        {{ deviceData.体重增长率 }}%
                      </template>
                    </div>
                  </div>
                </div>
              </div>
              <!-- 已签到 -->
              <div v-else style="height: 80%; width: 100%; padding-right: 0px">
                <div style="height: 100%">
                  <el-row
                    style="height: 30%; padding: 0px 0px 10px 0px"
                    :gutter="20"
                  >
                    <el-col :span="12">
                      <div
                        class="container-cord"
                        style="
                          height: 100%;
                          padding-left: 20px;
                          background-color: #ffffff;
                          border-radius: 8px;
                        "
                      >
                        <img
                          style="width: 25px"
                          referrerpolicy="no-referrer"
                          :src="tsl"
                        />
                        <span class="text-group_3">平均脱水量：</span>
                        <span
                          style="color: #333333; font-weight: 600; font-size: 25px"
                          >{{ deviceData.最近平均脱水量 }}L</span
                        >
                        <span style="color: #777777; font-size: 25px"> </span>
                      </div>
                    </el-col>
                    <el-col :span="12">
                      <div
                        class="container-cord"
                        style="
                          height: 100%;
                          padding-left: 20px;
                          background-color: #ffffff;
                          border-radius: 8px;
                        "
                      >
                        <img
                          style="width: 25px; margin-right: 10px"
                          referrerpolicy="no-referrer"
                          :src="tsl"
                        />
                        <span class="text-group_3">最大脱水量： </span>
                        <span
                          style="color: #333333; font-weight: 600; font-size: 25px"
                          >{{ deviceData.最近最大脱水量 }}L</span
                        >
                        <span style="color: #777777; font-size: 25px"
                          >({{ deviceData.最近最大脱水量日期 }})</span
                        >
                      </div>
                    </el-col>
                  </el-row>
                  <el-row
                    style="height: 70%; padding: 0px 0px 10px 0px"
                    :gutter="20"
                  >
                    <el-col :span="6" style="height: 100%">
                      <div
                        class="item"
                        style="
                          height: 100%;
                          padding-bottom: 10px;
                          gap: 10px; /* 设置所有方向的间距为10px */
                        "
                      >
                        <div style="height: 25%">
                          <div class="container-cord" style="height: 100%">
                            <img
                              style="width: 25px"
                              referrerpolicy="no-referrer"
                              :src="xinlv"
                            />
                            <span class="text-group_3">异常指标</span>
                          </div>
                        </div>
                        <div
                          style="
                            height: 75%;
                            text-align: center;
                            font-weight: 600;
                            font-size: 50px;
                            color: #333333;
                            color: #ca7070;
                            overflow: hidden;
                            overflow-y: auto;
                          "
                        >
                          <el-row style="font-size: 20px">
                            <el-col
                              v-for="(row, index) in deviceData.异常检验指标"
                              :span="12"
                              style="font-weight: 700"
                              :key="index"
                            >
                              {{ getItemName(row?.项目名称) }}
                              <b
                                v-if="row?.结果标记 === 'g'"
                                style="font-weight: bold"
                                >⬆</b
                              >
                              <b v-else style="font-weight: bold">⬇</b>
                            </el-col>
                          </el-row>
                        </div>
                      </div>
                    </el-col>
                    <el-col :span="18" style="height: 100%; width: 100%">
                      <div
                        class="item"
                        style="
                          height: 100%;
                          padding-bottom: 10px; /* 设置所有方向的间距为10px */
                        "
                      >
                        <div style="height: 100%">
                          <div
                            v-if="Number(deviceData.透析状态) > 1"
                            :ref="'echartsDiv' + deviceData.设备编号"
                            style="height: 97%"
                          ></div>
                        </div>
                      </div>
                    </el-col>
                  </el-row>
                </div>
              </div>
              <!-- 消息提示一直显示最新的消息 -->
              <div
                style="
                  height: 20%;
                  width: 100%;
                  background: #fef0e1;
                  border-radius: 8px;
                  font-size: 30px;
                "
              >
                <div style="height: 100%">
                  <div
                    class="container-cord"
                    style="height: 100%; padding-left: 20px"
                  >
                    <img
                      style="width: 25px"
                      referrerpolicy="no-referrer"
                      src="https://lanhu-oss.lanhuapp.com/SketchPng7d7c4e66d2f3fb56cb7c93cf3b359782ee05a12117f39e9b1836bff686aca428"
                    />

                    <span
                      class="text-group_3"
                      v-if="isinitXy && Number(deviceData.透析状态) >= 1"
                    >
                      最近一次， 高压：{{ 床旁血压计.sbp }}，低压：
                      {{ 床旁血压计.dbp }}， 心率： {{ 床旁血压计.pulseRate }}
                    </span>
                    <span class="text-group_3" v-else>暂无通知消息哦</span>
                  </div>
                </div>
              </div>
            </el-row>
          </div>
          <!-- 未签到 -->
          <div
            class="mowei"
            style="height: 39%"
            v-if="Number(deviceData.透析状态) === 0"
          >
            <el-row gutter="20" style="height: 100%; padding: 10px 20px 20px 20px">
              <el-col :span="12" style="height: 100%">
                <div class="container-weiqiandao" style="height: 100%">
                  <div
                    class="item-weiqiandao"
                    style="background: #ffedd2; border-radius: 8px"
                  >
                    <div class="container-cord" style="height: 30px">
                      <img
                        style="width: 25px"
                        referrerpolicy="no-referrer"
                        :src="tsl"
                      />
                      <span class="text-group_3">抗凝剂</span>
                    </div>
                    <div
                      class="grid-container"
                      style="height: calc(100% - 30px); width: 100%"
                    >
                      <div
                        class="grid-container-text"
                        style="color: #a78718"
                        v-for="(item, index) in deviceData.抗凝剂列表"
                        :style="{
                          fontSize:
                            deviceData.抗凝剂列表.length > 1 ? '22px' : '28px',
                        }"
                        :key="index"
                      >
                        <div class="left-div">{{ item.name }}</div>
                        <div class="right-div">{{ item.数量 }}{{ item.单位 }}</div>
                      </div>
                    </div>
                  </div>
                  <div
                    class="item-weiqiandao"
                    style="background: #ffedd2; border-radius: 8px"
                  >
                    <div class="container-cord" style="height: 30px">
                      <img
                        style="width: 25px"
                        referrerpolicy="no-referrer"
                        :src="tsl"
                      />
                      <span class="text-group_3">穿刺针</span>
                    </div>
                    <div
                      class="grid-container"
                      style="
                        height: calc(100% - 30px);
                        width: 100%;
                        font-size: 25px;
                      "
                    >
                      <div
                        class="grid-container-text"
                        style="color: #a78718"
                        v-for="(item, index) in deviceData.穿刺针列表"
                        :style="{
                          fontSize:
                            deviceData.穿刺针列表.length > 1 ? '22px' : '28px',
                        }"
                        :key="index"
                      >
                        <div class="left-div">{{ item.name }}</div>
                        <div class="right-div">{{ item.数量 }}支</div>
                      </div>
                    </div>
                  </div>
                </div>
              </el-col>
              <el-col :span="12">
                <div class="container-weiqiandao" style="height: 100%">
                  <div
                    class="item-weiqiandao"
                    style="background: #e5eeff; border-radius: 8px"
                  >
                    <div class="container-cord" style="height: 30px">
                      <img
                        style="width: 25px"
                        referrerpolicy="no-referrer"
                        :src="tsl"
                      />
                      <span class="text-group_3">一次性使用透析护理包</span>
                    </div>
                    <div
                      class="grid-container"
                      style="
                        height: calc(100% - 30px);
                        width: 100%;
                        font-size: 28px;
                      "
                    >
                      <div
                        class="grid-container-text"
                        style="color: #1d77bd"
                        v-for="(item, index) in deviceData.护理包列表"
                        :style="{
                          fontSize:
                            deviceData.护理包列表.length > 1 ? '22px' : '28px',
                        }"
                        :key="index"
                      >
                        <div class="left-div">{{ item.name }}</div>
                        <div class="right-div">{{ item.数量 }}{{ item.单位 }}</div>
                      </div>
                    </div>
                  </div>
                  <div
                    class="item-weiqiandao"
                    style="background: #e5eeff; border-radius: 8px"
                  >
                    <div class="container-cord" style="height: 30px">
                      <img
                        style="width: 25px"
                        referrerpolicy="no-referrer"
                        :src="tsl"
                      />
                      <span class="text-group_3">血管通路</span>
                    </div>
                    <div
                      class="grid-container"
                      style="
                        height: calc(100% - 30px);
                        width: 100%;
                        font-size: 28px;
                      "
                    >
                      <div
                        class="grid-container-text"
                        style="color: #1d77bd"
                        v-for="(item, index) in deviceData.血管通路列表"
                        :style="{
                          fontSize:
                            deviceData.血管通路列表.length > 1 ? '22px' : '28px',
                        }"
                        :key="index"
                      >
                        <div class="left-div">{{ item.类型 }}</div>
                        <div class="right-div" style="width: 200px">
                          {{ item.位置 }}
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </el-col>
            </el-row>
          </div>
          </div>
      </el-carousel-item>
      <el-carousel-item :style="{ height: (contentHeight - 10) + 'px' }">
        <DoctorAdvice :height="(contentHeight - 10)" :list="deviceData.透析单医嘱列表" />
      </el-carousel-item>
    </el-carousel>
    </div>
    <div v-else style="height: 100%">
      <div class="toubu" style="height: 11%">
        <el-row
          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>

          <div
            style="
              position: absolute;
              top: 0;
              right: 0;
              display: grid;
              padding: 5px;
              font-size: 300%;
              height: 100%;
            "
          >
            <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>
          </div>
        </el-row>
      </div>
      <template v-if="!ispaiban">
        <div class="chongjian" style="height: 50%">
          <el-row
            :gutter="10"
            style="height: 100%; padding: 10px 20px 0px 20px"
          >
            <el-col :span="7" style="height: 100%" ref="targetDiv">
              <div class="container-weiqiandao" style="height: 100%">
                <div
                  class="item-weiqiandao"
                  style="background: #ffedd2; border-radius: 8px; height: 100%"
                >
                  <div class="container-cord" style="height: 30px">
                    <img
                      style="width: 25px"
                      referrerpolicy="no-referrer"
                      :src="tsl"
                    />
                    <span class="text-group_3">抗凝剂</span>
                  </div>
                  <div
                    class="grid-container"
                    style="height: calc(100% - 30px); width: 100%"
                  >
                    <div class="scrollable-container" style="height: 100%">
                      <ul>
                        <li
                          v-for="(item, index) in 当前客户耗材集合.抗凝剂"
                          :key="index"
                        >
                          {{ item }}
                        </li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="10" style="height: 100%">
              <div class="cont_parent">
                <div
                  class="cont_child"
                  style="background: #e5eeff; border-radius: 8px"
                >
                  <div class="container-cord" style="height: 30px">
                    <img
                      style="width: 25px"
                      referrerpolicy="no-referrer"
                      :src="tsl"
                    />
                    <span class="text-group_3">透析方案</span>
                  </div>
                  <div
                    class="grid-container"
                    style="height: calc(100% - 30px); width: 100%"
                  >
                    <div class="container-body-text" style="color: #3a75b8">
                      <template
                        v-for="(item, index) in 当前客户耗材集合.透析模式"
                        :key="index"
                      >
                        <span> {{ item }}</span
                        ><template
                          v-if="当前客户耗材集合.透析模式.length > index + 1"
                          >,</template
                        >
                      </template>
                    </div>
                  </div>
                </div>
                <div
                  class="cont_child"
                  style="background: #d9f0e2; border-radius: 8px"
                >
                  <div class="container-cord" style="height: 30px">
                    <img
                      style="width: 25px"
                      referrerpolicy="no-referrer"
                      :src="tsl"
                    />
                    <span class="text-group_3">一次性血液透析体外循环管路</span>
                  </div>
                  <div
                    class="grid-container"
                    style="height: calc(100% - 30px); width: 100%"
                  >
                    <div
                      class="scrollable-container"
                      style="height: 100%; color: #3ab859"
                    >
                      <ul>
                        <li
                          v-for="(item, index) in 当前客户耗材集合.管路"
                          :key="index"
                        >
                          {{ item }}
                        </li>
                      </ul>
                    </div>
                  </div>
                </div>
                <div
                  class="cont_child"
                  style="background: #f9dede; border-radius: 8px"
                >
                  <div class="container-cord" style="height: 30px">
                    <img
                      style="width: 25px"
                      referrerpolicy="no-referrer"
                      :src="tsl"
                    />
                    <span class="text-group_3">一次性使用透析护理包</span>
                  </div>
                  <div
                    class="grid-container"
                    style="height: calc(100% - 30px); width: 100%"
                  >
                    <div
                      class="scrollable-container"
                      style="height: 100%; color: #902d2d"
                    >
                      <ul>
                        <li
                          v-for="(item, index) in 当前客户耗材集合.护理包"
                          :key="index"
                        >
                          {{ item }}
                        </li>
                      </ul>
                    </div>
                  </div>
                </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"
                      />
                      <span class="text-group_3">透析方案</span>
                    </div>
                    <div class="grid-container" style="height: calc(100% - 30px);width: 100%;">
                      <div class="container-body-text" style="color: #3A75B8;">
                        <template v-for="(item,index) in 当前客户耗材集合.透析模式" :key="index">
                          <span> {{item}}</span><template v-if="当前客户耗材集合.透析模式.length>index+1">,</template>
                        </template>
                        
                      </div>
                    </div>
                  </div>
                  <div class="item-weiqiandao" style="background: #D9F0E2;border-radius: 8px;height: 100%;">
                    <div class="container-cord" style="height: 30px;">
                      <img style="width: 25px;" referrerpolicy="no-referrer" :src="tsl"
                      />
                      <span class="text-group_3">一次性血液透析体外循环管路</span>
                    </div>
                    <div class="grid-container" style="height: calc(100% - 30px);width: 100%;">
                        <div class="scrollable-container"   style="height: 100%;color: #3AB859;">
                          <ul>
                            <li v-for="(item,index) in 当前客户耗材集合.管路" :key="index">
                              {{item}}
                            </li>
                          
                          </ul>
                        </div>
                    </div>
                  </div>
                  <div class="item-weiqiandao" style="background: #F9DEDE;border-radius: 8px;height: 100%;">
                    <div class="container-cord" style="height: 30px;">
                      <img style="width: 25px;" referrerpolicy="no-referrer" :src="tsl"
                      />
                      <span class="text-group_3">一次性使用透析护理包</span>
                    </div>
                    <div class="grid-container" style="height: calc(100% - 30px);width: 100%;">
                      <div class="scrollable-container"  style="height: 100%;color: #902D2D;">
                          <ul>
                            <li v-for="(item,index) in 当前客户耗材集合.护理包" :key="index">
                              {{item}}
                            </li>
                          
                          </ul>
                        </div>
                    </div>
                  </div>
                </div> -->
            </el-col>
            <el-col :span="7" style="height: 100%">
              <div class="container-weiqiandao" style="height: 100%">
                <div
                  class="item-weiqiandao"
                  style="background: #efe5ff; border-radius: 8px; height: 100%"
                >
                  <div class="container-cord" style="height: 30px">
                    <img
                      style="width: 25px"
                      referrerpolicy="no-referrer"
                      :src="tsl"
                    />
                    <span class="text-group_3">一次性使用内瘘穿刺针</span>
                  </div>
                  <div
                    class="grid-container"
                    style="height: calc(100% - 30px); width: 100%"
                  >
                    <div
                      class="scrollable-container"
                      style="height: 100%; color: #a78718"
                    >
                      <ul>
                        <li
                          v-for="(item, index) in 当前客户耗材集合.穿刺针"
                          :key="index"
                        >
                          {{ item }}
                        </li>
                      </ul>
                    </div>
                  </div>
                </div>
              </div>
            </el-col>
          </el-row>
        </div>
        <div class="mowei" style="height: 39%">
          <el-row
            :gutter="20"
            style="height: 100%; padding: 10px 20px 10px 20px"
          >
            <el-col :span="12" style="height: 100%">
              <div class="container-weiqiandao" style="height: 100%">
                <div
                  class="item-weiqiandao"
                  style="background: #f6f5fa; border-radius: 8px; height: 100%"
                >
                  <div class="container-cord" style="height: 30px">
                    <img
                      style="width: 25px"
                      referrerpolicy="no-referrer"
                      :src="tsl"
                    />
                    <span class="text-group_3">血液透析器</span>
                  </div>
                  <div
                    class="grid-container"
                    style="height: calc(100% - 30px); width: 100%"
                  >
                    <div style="height: 100%; color: #333333; font-weight: 600">
                      <div>
                        <span
                          v-for="(item, index) in 当前客户耗材集合.透析器"
                          :key="index"
                          style="margin-right: 10px"
                        >
                          {{ item
                          }}<template
                            v-if="当前客户耗材集合.透析器.length > index + 1"
                            >,</template
                          >
                        </span>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </el-col>
            <el-col :span="12">
              <div class="container-weiqiandao" style="height: 100%">
                <div
                  class="item-weiqiandao"
                  style="background: #f6f5fa; border-radius: 8px; height: 100%"
                >
                  <div class="container-cord" style="height: 30px">
                    <img
                      style="width: 25px"
                      referrerpolicy="no-referrer"
                      :src="tsl"
                    />
                    <span class="text-group_3">血液透析滤过器</span>
                  </div>
                  <div
                    class="grid-container"
                    style="height: calc(100% - 30px); width: 100%"
                  >
                    <div style="height: 100%; color: #333333; font-weight: 600">
                      <div>
                        <span
                          v-for="(item, index) in 当前客户耗材集合.滤过器"
                          :key="index"
                          style="margin-right: 10px"
                        >
                          {{ item
                          }}<template
                            v-if="当前客户耗材集合.滤过器.length > index + 1"
                            >,</template
                          >
                        </span>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </el-col>
          </el-row>
        </div>
      </template>
      <template v-else>
        <div
          style="
            height: 89%;
            width: 100%;
            background: #fef0e1;
            border-radius: 8px;
            font-size: 100px;
          "
        >
          <div style="height: 100%">
            <div
              class="container-cord"
              style="height: 100%; padding-left: 20px"
            >
              <img
                style="width: 100px"
                referrerpolicy="no-referrer"
                src="https://lanhu-oss.lanhuapp.com/SketchPng7d7c4e66d2f3fb56cb7c93cf3b359782ee05a12117f39e9b1836bff686aca428"
              />
              <span class="text-group_3" style="font-size: 100px"
                >等待患者排班</span
              >
            </div>
          </div>
        </div>
      </template>
    </div>
    <el-dialog
      :show-close="false"
      :close-on-press-escape="false"
      :close-on-click-modal="false"
      title="提示"
      v-model="centerDialogVisible"
      width="500px"
      center
    >
      <span>
        <el-form
          label-position="left"
          label-width="auto"
          style="max-width: 600px"
        >
          <el-space fill>
            <el-alert type="绑定设备" show-icon :closable="false">
              <p>"请输入设备编号后才能使用不然无法定位到数据来源:</p>
              <p>也可以选择二维码图片文件识别</p>
            </el-alert>
            <el-form-item label="设备编号">
              <el-input v-model="deviceCode" />
            </el-form-item>
          </el-space>
        </el-form>
        <div>
          <input
            type="file"
            pattern="选取二维码"
            accept="image/*"
            @change="onFileChange"
          />
        </div>
      </span>
      <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 type="primary" @click="saveSet"> 确认 </el-button>
          <el-button type="success" @click="shuaxin"> 刷新 </el-button>
        </div>
      </template>
    </el-dialog>
    <el-dialog
      v-model="centerDialogVisible2"
      custom-class="custom-dialog"
      :show-close="false"
      width="700"
      center
    >
      <template #header="{ titleId, titleClass }">
        <div class="my-header">
          <h4 style="color: white" :id="titleId" :class="titleClass">
            定时任务设置
          </h4>
        </div>
      </template>
      <span>
        <div style="margin-right: 10px">
          <el-form :model="formInline" size="large" label-width="100px">
            <el-form-item label="时间设定：">
              <el-col :span="10">
                <el-input-number
                  style="width: 100%"
                  v-model="formInline.xiaoshi"
                  :min="0"
                  :max="10"
                />
              </el-col>
              <el-col :span="2" class="text-center">
                <span class="text-gray-500">小时 </span>
              </el-col>
              <el-col :span="10">
                <el-input-number
                  style="width: 100%"
                  v-model="formInline.fenzhong"
                  :min="1"
                  :max="59"
                />
              </el-col>
              <el-col :span="2" class="text-center">
                <span class="text-gray-500">分钟 </span>
              </el-col>
            </el-form-item>

            <el-form-item label="提醒内容：">
              <el-input
                v-if="!formInline.selectOpen"
                v-model="formInline.alertText"
                style="max-width: 600px"
                placeholder="请填写报警内容"
                type="textarea"
                class="input-with-select"
              >
              </el-input>
              <el-select
                v-else
                v-model="formInline.selectType"
                style="width: 100%"
                placeholder="选择内容"
              >
                <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="定型文：">
              <el-switch v-model="formInline.selectOpen" />
            </el-form-item>
          </el-form>
        </div>
      </span>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="centerDialogVisible2 = false">取消</el-button>
          <el-button type="primary" @click="setDingshi"> 确定 </el-button>
        </div>
      </template>
    </el-dialog>
    <el-dialog
      v-model="centerDialogVisible3"
      custom-class="custom-dialog"
      :show-close="false"
      width="800"
      center
    >
      <template #header="{ titleId, titleClass }">
        <div class="my-header">
          <h4 style="color: white" :id="titleId" :class="titleClass">
            定时任务提醒
          </h4>
        </div>
      </template>
      <span>
        <div style="text-align: center; font-size: 35px">
          <h3>{{ 倒计时告警文本 }}</h3>
        </div>
      </span>
      <template #footer>
        <div class="dialog-footer">
          <el-button type="" @click="centerDialogVisible3 = false"
            >取消</el-button
          >
          <el-button type="primary" @click="centerDialogVisible3 = false">
            确定
          </el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>
  <script lang="ts" setup>
import {
  BrowserMultiFormatReader,
  NotFoundException,
  ChecksumException,
  FormatException,
} from "@zxing/library";
import TQS88 from "../img/TQS88.png";
import shezhi from "../img/shezhi.png";
import dingshi from "../img/dingshi.png";
import xinlv from "../img/xinlv.png";
import tsl from "../img/tsl.png";
import zlms from "../img/zlms.png";
import txztimg from "../img/txzt.png";
import txq from "../img/txq.png";
import sjjd from "../img/sjjd.png";
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 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,
  onBeforeMount,
  onMounted,
  ref,
  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 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 isHeightSet = ref(false);
// 控制播放状态的变量
const isPlaying = ref(false);
// 切换播放/暂停的方法
const toggleAlarm = () => {
  console.log('-------------')
  console.log('看看是打开还是暂停')
  if (isPlaying.value) {
    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 {
    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;
};
const { proxy } = getCurrentInstance() as any;
// 在需要使用的组件中引入
import { ChatDotSquare } from "@element-plus/icons-vue";
const ispaiban = ref(false);
import { ElLoading, ElMessage } from "element-plus";
// 连接服务器
const source = ref<EventSourcePolyfill | null>(null);
//接收到的sse数据
const sseData = ref({});
// sse状态
const readyState = ref({ key: 0, value: "正在链接中" });

const deviceCode = ref("");
const shishiTime = ref(new Date());
//有没有推送过血压如果有 就一直会显示血压数据
const isinitXy = ref(false);
const 床旁血压计 = ref({
  date_time: "",
  sbp: "178",
  pulseRate: "11",
  dbp: "111",
  zuihouTime: new Date(),
});
const formInline = ref({
  xiaoshi: 0,
  fenzhong: 5,
  alertText: "",
  selectType: "",
  selectOpen: false,
});

const 当前客户耗材集合 = ref({});
const deviceData = ref({
  患者来源: null,
  患者门诊住院号: '',
  签到号: '',
  透析单医嘱列表: [],
  iot_传输时间: "2025-01-10 19:15:24",
  iot_当前脱水量: 2.04,
  iot_脱水目标量: 3.3,
  iot_脱水速率: 0.82,
  iot_跨膜压: 40,
  iot_透析时间: 149,
  iot_静脉压: 86,
  上次透后称重: 72.5,
  体重增加: 3.1,
  体重增长率: 4.5,
  分区编号: "109195231931115eZmM",
  处方脱水量: 3.3,
  实时脱水量: 1.65,
  干体重: 69.5,
  年龄: 59,
  异常检验指标: [],
  性别: "男",
  患者头像:
    "http://dhimg.leon056.com/hemodialysis/face/PAT9090070832211PyVq/face-IMG_20240413_112705.jpg-202404131127536157.jpg",
  患者姓名: "",
  患者编号: "PAT9090070832211PyVq",
  患者透析号: "0207",
  最后一条血压: 116,
  此次脱水量: 6.1,
  监测血压是否低于百分之30: false,
  监测血压是否高于百分之30: false,
  监测记录列表: [
    {
      伸缩压: "152",
      脉搏: "66",
      舒张压: "76",
    },
    {
      伸缩压: "133",
      脉搏: "67",
      舒张压: "72",
    },
    {
      伸缩压: "116",
      脉搏: "79",
      舒张压: "63",
    },
  ],
  第一条血压: 152,
  脉搏列表: "66,67,79",
  血压低值列表: "76,72,63",
  血压高值列表: "152,133,116",
  设备分区类型: 0,
  设备号: "23",
  设备名称: "页面初始化中，请耐心等待！",
  设备序列号: "B97AP002",
  设备状态列表: [],
  设备编号: "DEVICE9195233509924hOHL",
  超滤速度过快: null,
  跨膜压列表: "2753,33,37",
  跨膜压是否大于200: false,
  透前称重: 75.6,
  透前脉搏: 77,
  透前血压_伸缩压: 136,
  透前血压_舒张压: 57,
  透析单编号: "9347151058555cAjJ",
  透析器: "B-17AHF",
  透析处方的时长: 4,
  透析处方的时长_分钟: "00",
  透析处方的时长_小时: "4",
  透析开始时间: "2025-01-10 16:44:00",
  透析方案: "HD",
  透析状态: "1.0",
  透析结束时间: "2025-01-10 20:44:00",
  设备变化: "1736508117033DEV",
  属性历史列表: [
    {
      属性列表: [
        {
          identifier: "D",
          identifierText: "血液流速",
          time2: 1736507724242,
          time: 1736507724242,
          finalText: "00240",
          isShow: 1,
        },
        {
          identifier: "F",
          identifierText: "透析液温度",
          time2: 1736507724242,
          time: 1736507724242,
          finalText: "036.4",
          isShow: 1,
        },
        {
          identifier: "G",
          identifierText: "透析液电导度",
          time2: 1736507724242,
          time: 1736507724242,
          finalText: "013.8",
          isShow: 1,
        },
      ],
      查询时间: "2025-01-10 19:17:57",
    },
    {
      属性列表: [
        {
          identifier: "D",
          identifierText: "血液流速",
          time2: 1736507538186,
          time: 1736507538186,
          finalText: "00240",
          isShow: 1,
        },
        {
          identifier: "F",
          identifierText: "透析液温度",
          time2: 1736507538186,
          time: 1736507538186,
          finalText: "036.5",
          isShow: 1,
        },
        {
          identifier: "G",
          identifierText: "透析液电导度",
          time2: 1736507538186,
          time: 1736507538186,
          finalText: "013.7",
          isShow: 1,
        },
      ],
      查询时间: "2025-01-10 19:12:59",
    },
    {
      属性列表: [
        {
          identifier: "D",
          identifierText: "血液流速",
          time2: 1736507290239,
          time: 1736507290239,
          finalText: "00240",
          isShow: 1,
        },
        {
          identifier: "F",
          identifierText: "透析液温度",
          time2: 1736507290239,
          time: 1736507290239,
          finalText: "036.5",
          isShow: 1,
        },
        {
          identifier: "G",
          identifierText: "透析液电导度",
          time2: 1736507290239,
          time: 1736507290239,
          finalText: "013.8",
          isShow: 1,
        },
      ],
      查询时间: "2025-01-10 19:08:00",
    },
  ],
});
// 告警提示
// 识别窗口
const video = ref<HTMLVideoElement | null>(null);
// 识别数据流
let stream: MediaStream | null = null;
const centerDialogVisible2 = ref(false);
const centerDialogVisible3 = ref(false);
const centerDialogVisible = ref(false);
const background = ref("");
const txztText = ref("");
const textcolor = ref("");
const wd = ref("");
const ls = ref("");
const ddd = ref("");
const contentHeight = ref(0); // 中间内容的高度
const isShowXY = computed(() => {
  if (床旁血压计.value.zuihouTime > shishiTime.value) {
    return true;
  } else {
    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 {
            nextTick(() => {
              setTimeout(() => {
                initTupiao();
              }, 500);
            });
    }
  }
);
const txzt: any = computed(() => {
  return deviceData.value.透析状态;
});
// 是否是消毒类型和待机
const xiaoduzhuangti = computed(() => {
  return false;
});
// 打开定时任务设置
const dingshiShow = () => {
  formInline.value = {
    xiaoshi: 0,
    fenzhong: 5,
    alertText: "",
    selectType: "",
    selectOpen: false,
  };
  centerDialogVisible2.value = true;
};
// 保存定时任务
const setDingshi = () => {
  console.log("--------------------");
  console.log(formInline.value);
  console.log(deviceCode.value);
  const minutes = formInline.value.xiaoshi * 60 + formInline.value.fenzhong;
  let alertText = "";
  if (formInline.value.selectOpen) {
    alertText = formInline.value.selectType;
  } else {
    alertText = formInline.value.alertText;
  }
  if (alertText === "") {
    ElMessage.warning("设置报警消息不能为空");
    return true;
  }
  setTimeoutAlert({
    deviceCode: deviceCode.value,
    minutes: minutes,
    alertText: alertText,
  }).then((res) => {
    console.log(res.data);
    if (res.data === "OK") {
      倒计时.value = minutes * 60;
      centerDialogVisible2.value = false;
      倒计时告警文本.value = alertText;
    } else {
      ElMessage.warning(res.message);
    }
  });
  // centerDialogVisible2.value=false
};

// 状态颜色
const zhuangtaiColor = computed(() => {
  const list = deviceData.value.设备状态列表;
  let colorStr = "#13CE66";
  if (list && list.length > 0) {
    // 默认显示第一状态颜色
    // colorStr=list[0].状态颜色
    // 消毒状态优先级高
    const x = list.findIndex((e) => {
      return e.状态类型 === "透析机消毒" || e.状态类型 === "在线";
    });
    if (x !== 0) {
      colorStr = list[0].状态颜色;
    }
  }
  return colorStr;
});
// 没有报警就返回空字符传
const noBaoji = computed(() => {
  const list = deviceData.value.设备状态列表;
  let zhuantaiStr = "";
  let jinggaoStr = "";
  if (list && list.length > 0) {
    list.forEach((el: any) => {
      if (el.是否为警告标记 === 1) {
        if (jinggaoStr !== "") {
          jinggaoStr += "/" + el.状态名称;
        } else {
          jinggaoStr += el.状态名称;
        }
      } else {
        zhuantaiStr += el.状态名称;
      }
    });
  }
  return jinggaoStr;
});
// 状态返回
const zhuangtaiStr = computed(() => {
  const list = deviceData.value.设备状态列表;
  let zhuantaiStr = "";
  if (list && list.length > 0) {
    list.forEach((el: any) => {
      if (
        el.是否为警告标记 === 1 ||
        el.状态类型 === "透析机消毒" ||
        el.状态类型 === "在线"
      ) {
        //去掉待机和消毒状态显示
      } else {
        if (zhuantaiStr !== "") {
          zhuantaiStr += "/" + el.状态名称;
        } else {
          zhuantaiStr += el.状态名称;
        }
      }
    });
  }

  return zhuantaiStr;
});
const isbaioji = computed(() => {
  const list = deviceData.value.设备状态列表;
  if (
    (deviceData.value.监测血压是否低于百分之30 ||
      deviceData.value.跨膜压是否大于200 ||
      deviceData.value.监测血压是否高于百分之30) &&
    deviceData.value.透析状态 === "2.0"
  ) {
    return true;
  } else {
    return false;
  }
});
// 透前血压告警
const tqXygj = computed(() => {
  if (
    deviceData.value.透前血压_伸缩压 > 160 ||
    deviceData.value.透前血压_伸缩压 < 90
  ) {
    return true;
  } else {
    return false;
  }
});
// 透前脉搏告警
const tqMbgj = computed(() => {
  if (deviceData.value.透前脉搏 > 90) {
    return true;
  } else {
    return false;
  }
});
// 设置内联样式对象
const backgroundStyle = {
  backgroundImage: `url(${TQS88})`,
  backgroundSize: "cover", // 根据需要调整
  backgroundPosition: "center", // 根据需要调整
};

watch(
  () => txzt.value,
  () => {
    if (txzt.value === "0.0") {
      txztText.value = "未签";
      textcolor.value = "#FAFAFA";
      background.value = "#606266";
    } else if (txzt.value === "1.0") {
      // 蓝色
      textcolor.value = "#faecd8";
      background.value = "#E6A23C";
      txztText.value = "已签";
    } else if (txzt.value === "2.0") {
      // 绿色
      // textcolor.value = '#D9F5E2';
      // background.value='#67C23A'
      textcolor.value = "#ECF5FF";
      background.value = "#409EFF";
      txztText.value = "透中";
    } else if (txzt.value === "2.5") {
      //
      textcolor.value = "#fde2e2";
      background.value = "#fab6b6";
      txztText.value = "结束";
    } else if (txzt.value === "3.0") {
      // 已经结束
      textcolor.value = "#FFECD0";
      background.value = "#E6A23C";
      txztText.value = "检查";
    } else if (txzt.value === "4.0") {
      // yij
      textcolor.value = "#FFECD0";
      background.value = "#E6A23C";
      txztText.value = "归档";
    }
  },
  {
    immediate: true,
    deep: true,
  }
);
const formatSecondsToTime = (totalSeconds) => {
  // 向下取整
  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);
  } else if (倒计时.value > -5) {
    倒计时显示.value = "";
    // 只有没触发的时候才触发他
     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) {
    deviceCode.value = devcieCode;
    sourceInit();
  } else {
    centerDialogVisible.value = true;
  }
  intervalId = setInterval(updateTime, 1000);
  const width = window.innerWidth;
const height = window.innerHeight;

console.log('可视区域宽度:', width);
console.log('可视区域高度:', height);

});
// 在组件卸载前清除定时器，防止内存泄漏
onBeforeUnmount(() => {
  if (intervalId) {
    clearInterval(intervalId);
  }
});

const saveSet = () => {
  if (deviceCode.value) {
    centerDialogVisible.value = false;
    Local.set("devcieCode", deviceCode.value);
    sourceInit();
    window.location.reload();
  } else {
    ElMessage.warning("请先输入设备编号");
  }
};

/**
 * 刷新页面
 */
const shuaxin = () => {
  window.location.reload();
};
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 {
        const codeReader = new BrowserMultiFormatReader();
        const result = await codeReader.decodeFromImage(
          undefined,
          e.target.result,
          { tryHarder: true }
        );
        // const result = await codeReader.decodeFromImage(undefined, e.target.result);
        deviceCode.value = result.text;
        ElMessage.success("识别成功");
      } catch (err) {
        console.error("Error details:", err);
        if (err instanceof NotFoundException) {
          ElMessage.error("未找到二维码");
        } else if (err instanceof ChecksumException) {
          ElMessage.error("校验错误");
        } else if (err instanceof FormatException) {
          ElMessage.error("格式错误");
        } else {
          ElMessage.error("识别错误请重新识别");
          console.error(err);
        }
      }
    }
  };

  reader.readAsDataURL(file);
};
const shaoma = () => {};
watch(
  () => deviceData.value.设备变化,
  () => {
    console.log(deviceData.value.设备名称, "子组件变量");
    setTimeout(() => {
      if (!xiaoduzhuangti.value) {
        initTupiao();
      }
    }, 1000);
  }
);

watch(() => deviceData.value.患者姓名, (newVal: string, oldVal: string) => {
  console.log("患者姓名变化:", newVal)

  if (newVal && oldVal !== newVal) {
    isHeightSet.value = false // 重置标识
    contentHeight.value = 0;  // 清空高度，强制更新 el-carousel

    setTimeout(() => {
      if (isHeightSet.value) return // 如果已设置过就不重复执行

      const windowHeight = window.innerHeight
      const toubu = document.getElementById('toubu')
      const toubuHeight = toubu ? toubu.offsetHeight : 0

      const newHeight = windowHeight - toubuHeight

      if (newHeight !== contentHeight.value) {
        contentHeight.value = newHeight
        console.log("更新 contentHeight.value: ", contentHeight.value)
      }

      isHeightSet.value = true
    }, 500)
  }
})

const 数据初始化 = ref(false);
//创建链接对象
const creatSource = () => {
  // http://testbs.ihemodialysis.com/sse/sseEvent
  // const test='http://testbs.ihemodialysis.com/sse/sseEvent/'
  数据初始化.value = true;
  const test = import.meta.env.VITE_SSE_BASE_URL;
  const stateArr = [
    { key: 0, value: "正在链接中" },
    { key: 1, value: "已经链接并且可以通讯" },
    { key: 2, value: "连接已关闭或者没有链接成功" },
  ];
  try {
    source.value = new EventSourcePolyfill(`${test}${deviceCode.value}`, {
      heartbeatTimeout: 60000,
    });
    source.value.onopen = (e) => {
      console.log("链接成功");
      ElMessage.success("链接服务成功");
      readyState.value = stateArr[source.value?.readyState ?? 0];
      console.log(e);
    };
    source.value.onerror = (e) => {
      console.log(e, "异常情况-----");
      ElMessage.warning("链接服务失败，请耐心等待重连。。");
      readyState.value = stateArr[source.value?.readyState ?? 0];
    };
    source.value.onmessage = (e) => {
      console.log("收到消息", e.data);
      shishiTime.value = new Date();
      if (e.data) {
        const msg = e.data;
        let dif = msg.indexOf("event:message");
        let beng = msg.indexOf("{");
        let end = msg.length - 1;
        if (beng !== -1 && end !== -1 && dif !== -1) {
          const datax = msg.slice(beng, end + 1);
          const dataBody = JSON.parse(datax);
          console.log(dataBody);
          console.log(dataBody);
          if (dataBody.倒计时?.提醒文本) {
            倒计时.value = dataBody.倒计时?.设定提醒倒计时;
            console.log("设置了倒计时值", 倒计时.value);
            if (
              倒计时.value <= 0 &&
              倒计时.value >= -60 &&
              centerDialogVisible3.value === false
            ) {
              centerDialogVisible3.value = true;
              倒计时告警文本.value = dataBody.倒计时?.提醒文本;
              关闭弹框警告();
              // toggleAlarm();
            } else if (倒计时.value <= -60) {
              centerDialogVisible3.value = false;
            }
          }
          if (dataBody.推送类型 === "床旁血压计") {
            isinitXy.value = true;
            let date = new Date();
            date.setMinutes(date.getMinutes() + 5);
            床旁血压计.value = {
              date_time: dataBody?.床旁血压结果?.measureTime,
              sbp: dataBody?.床旁血压结果?.sbp,
              pulseRate: dataBody?.床旁血压结果?.pulseRate,
              dbp: dataBody?.床旁血压结果?.dbp,
              zuihouTime: date,
            };

            nextTick(() => {
              setTimeout(() => {
                initTupiao();
              }, 500);
            });

          } else if (dataBody.推送类型 === "中央监控大屏信息") {
            数据初始化.value = false;
            // loading.close()
            console.log(Date.now() + "DEV");
            if (dataBody?.透析状态) {
              deviceData.value = dataBody?.透析状态;
              if ('透析单医嘱列表' in 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.患者姓名 = "";
              if (dataBody?.使用耗材字典) {
                当前客户耗材集合.value = dataBody?.使用耗材字典;
              }
            }

            deviceData.value.设备变化 = Date.now() + "DEV";

            deviceData.value.属性历史列表 = dataBody?.IOT信息?.属性历史列表;
            console.log(deviceData.value.设备变化);
            deviceData.value.设备状态列表 = dataBody.IOT信息.状态列表;
          }
        }
      }
    };
  } catch (error) {
    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 关闭弹框警告 = () => {
  setTimeout(function () {
    console.log("30秒已过，关闭报警设置弹框。");
    centerDialogVisible3.value = false;
    倒计时.value = -100;
  }, 30000); // 30000 毫秒 = 30 秒
};
//初始化
const sourceInit = () => {
  console.log("初始化see");
  if (!source.value || source.value.readyState === 2) {
    creatSource();
  }
};
//  关闭 WebSocket
const closeSource = () => {
  console.log("断开");
  source.value?.close();
};
// 取消订阅
onBeforeMount(() => {
  closeSource();
});
const initTupiao = () => {
  if (deviceData.value.患者姓名 !== "") {
    const seriesData = [
      {
        name: "11",
        type: "line",
        symbol: "triangle",
        symbolSize: 10,
        symbolRotate: 180,
        data: [],
        lineStyle: {
          width: 5, // 设置线条宽度为5
          color: "red",
        },
        itemStyle: {
          borderWidth: 5,
          borderColor: "red",
          color: "red",
        },
        markPoint: {
          data: [],
        },
        markLine: {
          symbol: "none",
          lineStyle: { color: "#409EFF", width: 3 },
          data: [
            { name: "y90", yAxis: 90, label: { show: false }, symbol: "none" },
          ],
        },
      },

      {
        name: "",
        type: "line",
        symbol: "triangle",
        symbolSize: 10,
        data: [],
        lineStyle: {
          color: "#409EFF",
          width: 5, // 设置线条宽度为5
        },
        itemStyle: {
          borderWidth: 5,
          borderColor: "#409EFF",
          color: "#409EFF",
        },
        markPoint: {
          data: [],
        },
        markLine: {
          symbol: "none",
          lineStyle: { color: "#F56C6C", width: 3 },
          data: [
            {
              name: "y140",
              yAxis: 140,
              label: { show: false },
              symbol: "none",
            },
          ],
        },
      },
      {
        name: "",
        type: "line",
        symbolSize: 10,
        data: [],
        lineStyle: {
          color: "#D940FF",
          width: 5, // 设置线条宽度为5
        },
        itemStyle: {
          borderWidth: 5,
          borderColor: "#D940FF",
          color: "#D940FF",
        },
        markPoint: {
          data: [],
        },
      },
    ];
    const xAxisData = [];
    if (Number(deviceData.value.透析状态) >= 2) {
      // alert(111)
      deviceData.value.监测记录列表.forEach((e, index) => {
        seriesData[0].data.push(e.伸缩压);
        seriesData[1].data.push(e.舒张压);
        seriesData[2].data.push(e.脉搏);
        xAxisData.push(index);
        if (index == 0) {
          let y = Number(e.伸缩压) + 20;
          let y2 = Number(e.舒张压) + 20;
          seriesData[0].markPoint.data.push({
            name: "上机血压",
            value: e.伸缩压,
            xAxis: 0,
            yAxis: e.伸缩压,
            symbolSize: 0,
            symbolOffset: [0, 20],
            label: { fontSize: 20, color: "red" },
          });
          seriesData[1].markPoint.data.push({
            name: "上机血压",
            value: e.舒张压,
            xAxis: 0,
            yAxis: e.舒张压,
            symbolSize: 0,
            symbolOffset: [15, 15],
            label: { fontSize: 20, color: "#409EFF" },
          });
          seriesData[2].markPoint.data.push({
            name: "上机血压",
            value: e.脉搏,
            xAxis: 0,
            yAxis: e.脉搏,
            symbolSize: 0,
            symbolOffset: [10, -10],
            label: { fontSize: 20, color: "#D940FF" },
          });
        } else if (
          deviceData.value.监测记录列表.length > 1 &&
          index === deviceData.value.监测记录列表.length - 1
        ) {
          let y = Number(e.伸缩压) + 20;
          let y2 = Number(e.舒张压) + 20;
          seriesData[0].markPoint.data.push({
            name: "上机血压",
            value: e.伸缩压,
            xAxis: index,
            yAxis: e.伸缩压,
            symbolSize: 0,
            symbolOffset: [-15, -15],
            label: { fontSize: 20, color: "red" },
          });
          seriesData[1].markPoint.data.push({
            name: "上机血压",
            value: e.舒张压,
            xAxis: index,
            yAxis: e.舒张压,
            symbolSize: 0,
            symbolOffset: [-15, 15],
            label: { fontSize: 20, color: "#409EFF" },
          });
          seriesData[2].markPoint.data.push({
            name: "上机压",
            value: e.脉搏,
            xAxis: index,
            yAxis: e.脉搏,
            symbolSize: 0,
            symbolOffset: [0, -10],
            label: { fontSize: 20, color: "#D940FF" },
          });
        }
      });
      if (deviceData.value.监测记录列表.length === 1) {
        xAxisData.push(1);
      }
      try {
        let myChart = null;

        if (proxy.$refs["echartsDiv" + deviceData.value.设备编号]) {
          myChart = echarts.init(
            proxy.$refs["echartsDiv" + deviceData.value.设备编号]
          );
        }

        const option = {
          // backgroundColor: 床旁血压计.value.zuihouTime>shishiTime.value?'#ffffff':textcolor.value,
          backgroundColor: "#ffffff",
          tooltip: {
            trigger: "axis",
          },
          toolbox: {
            show: false,
          },
          grid: {
            left: 20,
            top: 0,
            bottom: 0,
          },
          xAxis: {
            type: "category",
            // 标记做右往左排列
            boundaryGap: false,
            data: xAxisData,
            axisTick: {
              show: true, // 显示 X 轴刻度
            },
          },
          yAxis: {
            show: false,
            name: "",
            type: "value",
            min: 20,
            max: 220,
            interval: 20, // 指定刻度间隔,
            splitLine: {
              show: false,
            },
          },
          series: seriesData,
        };
        if (myChart) {
          myChart.setOption(option);
        }
      } catch (e) {
        console.log("图标渲染异常异常");
      }
    } else {
      try {
        let myChart = null;

        if (proxy.$refs["echartsDiv" + deviceData.value.设备编号]) {
          myChart = echarts.init(
            proxy.$refs["echartsDiv" + deviceData.value.设备编号]
          );
        }


        const option = {
          backgroundColor:
            床旁血压计.value.zuihouTime > shishiTime.value
              ? "#ffffff"
              : textcolor.value,
          tooltip: {
            trigger: "axis",
          },
          toolbox: {
            show: false,
          },
          grid: {
            left: 5,
            top: 0,
            bottom: 0,
          },
          xAxis: {
            type: "category",
            boundaryGap: false,
            data: [1, 2, 3, 4],
          },
          yAxis: {
            name: "",
            type: "value",
            min: 20,
            max: 220,
            interval: 20, // 指定刻度间隔,
            splitLine: {
              show: false,
            },
          },
          series: [],
        };
        if (myChart) {
          myChart.setOption(option);
        }
      } catch (e) {
        console.log("图表渲染异常异常: ", e);
        console.log(
          "异常",
          proxy.$refs["echartsDiv" + deviceData.value.设备编号]
        );
      }
    }
  } else if (deviceData.value.患者姓名 === "") {
    const tbdata1 = [];
    const tbdata2 = [];
    const tbdata3 = [];
    if (deviceData.value.属性历史列表) {
      deviceData.value.属性历史列表.forEach((e, index) => {
        // 温度
        const wdMode = e.属性列表.find((l) => {
          return l.identifierText === "透析液温度";
        });
        if (wdMode) {
          tbdata1.push(Number(wdMode?.finalText));
          wd.value = Number(wdMode?.finalText);
        }

        // 血液流速
        const xymode = e.属性列表.find((l) => {
          return l.identifierText === "血液流速";
        });
        if (xymode) {
          tbdata2.push(Number(xymode?.finalText));
          ls.value = Number(xymode?.finalText);
        }

        // 电导度
        const dddMode = e.属性列表.find((l) => {
          return l.identifierText === "透析液电导度";
        });
        if (dddMode) {
          tbdata3.push(Number(dddMode?.finalText));
          ddd.value = Number(dddMode?.finalText);
        }
      });
    }
    try {
      console.log("渲染设备");
      let myChart1 = null;
      let myChart2 = null;
      let myChart3 = null;

      if (proxy.$refs["echartsDivwd" + deviceData.value.设备编号]) {
        myChart1 = echarts.init(
          proxy.$refs["echartsDivwd" + deviceData.value.设备编号]
        );
      }

      if (proxy.$refs["echartsDivls" + deviceData.value.设备编号]) {
          myChart2 = echarts.init(
            proxy.$refs["echartsDivls" + deviceData.value.设备编号]
          );
      }

      if (proxy.$refs["echartsDivddd" + deviceData.value.设备编号]) {
        myChart3 = echarts.init(
          proxy.$refs["echartsDivddd" + deviceData.value.设备编号]
        );
      }

      const option1 = {
        // backgroundColor: textcolor.value,
        tooltip: {
          trigger: "axis",
        },
        toolbox: {
          show: false,
        },
        grid: {
          left: 8,
          top: 100,
          bottom: 0,
        },
        xAxis: {
          show: true, // 隐藏X轴
          type: "category",
          // 标记做右往左排列
          boundaryGap: false,
          data: [1, 2, 3],
          axisTick: {
            show: false, // 显示 X 轴刻度
          },
        },
        yAxis: {
          type: "value",
          splitLine: {
            show: false,
          },
        },
        series: [
          {
            data: tbdata1,
            type: "line",
            lineStyle: {
              width: 10, // 设置线条宽度为5
              color: "red",
            },
          },
        ],
      };
      const option2 = {
        // backgroundColor: textcolor.value,
        tooltip: {
          trigger: "axis",
        },
        toolbox: {
          show: false,
        },
        grid: {
          left: 8,
          top: 100,
          bottom: 0,
        },
        xAxis: {
          show: false, // 隐藏X轴
          type: "category",
          // 标记做右往左排列
          boundaryGap: false,
          data: [1, 2, 3],
          axisTick: {
            show: false, // 显示 X 轴刻度
          },
        },
        yAxis: {
          type: "value",
          min: -10,
          splitLine: {
            show: false,
          },
        },
        series: [
          {
            data: tbdata2,
            type: "line",
            lineStyle: {
              width: 10, // 设置线条宽度为5
              color: "#409EFF",
            },
          },
        ],
      };
      const option3 = {
        // backgroundColor: textcolor.value,
        tooltip: {
          trigger: "axis",
        },
        toolbox: {
          show: false,
        },
        grid: {
          left: 8,
          top: 100,
          bottom: 0,
        },
        xAxis: {
          show: false, // 隐藏X轴
          type: "category",
          // 标记做右往左排列
          boundaryGap: false,
          data: [1, 2, 3],
          axisTick: {
            show: false, // 显示 X 轴刻度
          },
        },
        yAxis: {
          type: "value",
          min: -10,
          splitLine: {
            show: false,
          },
        },
        series: [
          {
            data: tbdata3,
            type: "line",
            lineStyle: {
              width: 10, // 设置线条宽度为5
              color: "#E6A23C",
            },
          },
        ],
      };
      if (myChart1) {
        myChart1.setOption(option1);
      }
      if (myChart2) {
        myChart2.setOption(option2);
      }
      if (myChart3) {
        myChart3.setOption(option3);
      }
    } catch (e) {
      console.log("图标渲染异常异常");
    }

    console.log(deviceData.value);
  }
};
const getItemName = (name: string) => {
  if (name) {
    if (name === "血红蛋白测定") {
      return "Hgb ";
    } else if (name === "铁蛋白") {
      return "Fer ";
    } else if (name === "白蛋白") {
      return "Alb ";
    } else if (name === "血清铁蛋白") {
      return "SF ";
    } else if (name === "钙") {
      return "Ga ";
    } else if (name === "钾") {
      return "K ";
    } else if (name === "无机磷") {
      return "pi ";
    } else if (name === "甲状旁腺激素") {
      return "PTH ";
    } else {
      return name;
    }
  } else {
    return "";
  }
};
</script>
<style lang="less" scoped>
.divice {
  background: #dae5ec;
  font-size: 100%;
  border-radius: 4px;
  border: solid 1px;
  width: 100%;
  height: 100%;
  border: 1px solid coral;
  user-select: none;
  .toubu {
    // padding-left: 20px;
    width: 100%;
    background: #70a3dd;
    border-radius: 4px 0px 16px 16px;
  }
  .chongjian {
    .container {
      height: 100%;
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      width: 100%;
      gap: 10px; /* 设置所有方向的间距为10px */
    }
    .item {
      border: 1px solid #ccc;
      background-color: #ffffff;
      padding: 20px;
      box-sizing: border-box;
      border-radius: 8px;
      margin-bottom: 10px;
    }
  }
  .mowei {
    .container {
      height: 100%;
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      width: 100%;
      gap: 10px; /* 设置所有方向的间距为10px */
    }
    .item {
      border: 1px solid #ccc;
      background-color: #ffffff;
      padding: 20px;
      box-sizing: border-box;
      border-radius: 8px;
      margin-bottom: 10px;
    }
  }
}
/* 定义闪烁动画 */
@keyframes blink {
  0% {
    border: 4px solid red;
  }
  50% {
    border: 4px solid Transparent;
  }
  100% {
    border: 4px solid red;
    // 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%;
}
@keyframes blink2 {
  0% {
    background: red;
  }
  50% {
    background: Transparent;
  }
  100% {
    background: red;
    // border-bottom:8px solid red ;
  }
}
.blink2 {
  animation: blink2 2s infinite; /* 每秒闪烁一次，无限次数 */
  width: 100%;
  height: 100%;
}
.grid-container {
  display: grid;
  align-items: center; /* 垂直居中 */
  height: 100vh; /* 根据需要调整高度 */
}

.centered-text {
  font-weight: 600;
  /* 其他样式 */
}
.container-cord {
  display: flex;
  align-items: center; /* 垂直居中对齐 */
  // border: 1px solid #ccc;
  // padding: 10px;
  .image {
    margin-right: 10px; /* 图片和文字之间的间距 */
  }
  .text-group_3 {
    margin-left: 10px;
    font-family: PingFangSC, PingFang SC;
    font-weight: 600;
    font-size: 16px;
  }
}
.container-weiqiandao {
  display: flex;
  flex-direction: column;
  height: 100%;
  gap: 10px; /* 调整这个值来设置间隔 */
}

.item-weiqiandao {
  flex: 1; /* 确保每个子 div 占据相同的高度 */
  background-color: lightblue; /* 可以根据需要调整背景颜色 */
  padding: 10px; /* 添加内边距以美化显示 */
}
.container-body {
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center; /* 垂直居中 */
  // padding: 10px;
}
.container-body-text {
  text-align: center; /* 文本水平居中 */
  white-space: nowrap; /* 防止文本换行 */
  overflow: hidden; /* 隐藏溢出内容 */
  text-overflow: ellipsis; /* 使用省略号表示被隐藏的文本 */
  width: 100%; /* 确保宽度为父容器的100% */
  font-weight: 600;
  font-size: 50px;
  color: #d58e56;
}
.grid-container-text {
  display: flex;
  width: 100%; /* 容器宽度可以根据需要调整 */
  padding-left: 10px;
}
.left-div {
  flex-grow: 1; /* 自适应宽度，占满剩余空间 */
  white-space: nowrap; /* 防止文字自动换行 */
  overflow: hidden; /* 隐藏超出容器宽度的内容 */
  text-overflow: ellipsis; /* 当文本溢出时显示省略号 */
  width: 100%; /* 设置一个具体的宽度或确保有继承宽度 */
  font-weight: 600;
}

.right-div {
  width: 50px; /* 固定宽度 */
  font-size: 16px;
  display: flex;
  justify-content: center; /* 水平居中 */
  align-items: center; /* 垂直居中 */
}
/* 设置你的div占据整个高度，并在需要时显示滚动条 */
.scrollable-container {
  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;
  overflow-y: auto; /* 当内容超出时显示垂直滚动条 */
  box-sizing: border-box; /* 确保 padding 和 border 不增加实际高度 */
}
.scrollable-text {
  white-space: nowrap;
  overflow-x: auto;
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  // border: 1px solid #e4e4e4;
  // font-size: 16px;
}
.custom-dialog {
  border-radius: 10px;
}

.my-header {
  background-color: #ff6b6b; /* 标题背景颜色 */
  color: white; /* 标题文字颜色 */
  font-size: 18px; /* 标题字体大小 */
  padding-top: 1px; /* 内边距 */
  padding-bottom: 1px; /* 内边距 */
  text-align: center; /* 文字居中 */
  border-top-left-radius: 10px; /* 左上角圆角 */
  border-top-right-radius: 10px; /* 右上角圆角 */
}
.el-dialog {
  padding: 0;
  padding-bottom: 10px;
}
</style>

 src/views/deviceWindoes2.vue

@@ -1,8 +1,10 @@
<template>
  <div class="divice">
    <!-- {{数据初始化}} -->
    <div class="youzhiliao" style="height: 100%" v-if="deviceData.患者姓名">
      <div id="toubu" class="toubu" style="height: 11%">
    <el-carousel v-if="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.患者姓名 !== ''"
          style="
@@ -90,10 +92,7 @@
          </div>
        </el-row>
      </div>
      <el-carousel v-if="contentHeight > 0" height="auto" :autoplay="false" motion-blur :initial-index="0" always="always">
        <el-carousel-item :style="{ height: (contentHeight - 10) + 'px' }">
          <div :style="{ height: (contentHeight - 10) + 'px' }">
            <div class="chongjian" style="height: 50%;">
      <div class="chongjian" style="height: 50%">
            <el-row :gutter="20" style="height: 100%; padding: 20px 20px 10px 20px">
              <el-col :span="6" style="height: 100%; padding-bottom: 10px">
                <div style="height: 100%">
@@ -489,11 +488,10 @@
                          font-weight: 600;
                              color: #333333;
                          color: #ca7070;
                          overflow: hidden;
                          overflow-y: auto;
                        "
                      >
                        <el-row style="font-size: 20px; overflow: hidden;">
                    <el-row style="font-size: 20px">
                          <el-col
                            v-for="(row, index) in deviceData.异常检验指标"
                            :span="8"
@@ -642,7 +640,7 @@
          <!-- 治疗中 -->
          <div
            class="mowei"
            style="height: 39%;"
        style="height: 39%"
            v-if="Number(deviceData.透析状态) > 0"
          >
            <el-row style="height: 100%; padding: 0px 20px 10px 20px">
@@ -873,7 +871,6 @@
                            font-size: 50px;
                            color: #333333;
                            color: #ca7070;
                            overflow: hidden;
                            overflow-y: auto;
                          "
                        >
@@ -881,7 +878,7 @@
                            <el-col
                              v-for="(row, index) in deviceData.异常检验指标"
                              :span="12"
                              style="font-weight: 700"
                          style="font-weight: 700;"
                              :key="index"
                            >
                              {{ getItemName(row?.项目名称) }}
@@ -1107,11 +1104,99 @@
          </div>
          </div>
      </el-carousel-item>
      <el-carousel-item :style="{ height: (contentHeight - 10) + 'px' }">
        <DoctorAdvice :height="(contentHeight - 10)" :list="deviceData.透析单医嘱列表" />
      <el-carousel-item :style="{ height: pageHeight + 'px'}">
        <div class="toubu" style="height: 11%">
        <el-row
          v-if="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>

    <div v-else style="height: 100%">
      <div class="toubu" style="height: 11%">
        <el-row
@@ -1708,14 +1793,12 @@
  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 alarmSoundCXY = new Audio(cxybaojing); //测血压报警
@@ -1731,7 +1814,6 @@
const alarmSoundCG = new Audio(cgbaojing); //冲管
alarmSoundCG.loop = true; // 循环播放

const isHeightSet = ref(false);
// 控制播放状态的变量
const isPlaying = ref(false);
// 切换播放/暂停的方法
@@ -2006,7 +2088,7 @@
const wd = ref("");
const ls = ref("");
const ddd = ref("");
const contentHeight = ref(0); // 中间内容的高度
const pageHeight = ref(0);
const isShowXY = computed(() => {
  if (床旁血压计.value.zuihouTime > shishiTime.value) {
    return true;
@@ -2031,11 +2113,9 @@
  () => {
    if (床旁血压计.value.zuihouTime > shishiTime.value) {
    } else {
            nextTick(() => {
              setTimeout(() => {
                initTupiao();
              }, 500);
            });
    }
  }
);
@@ -2306,12 +2386,8 @@
    centerDialogVisible.value = true;
  }
  intervalId = setInterval(updateTime, 1000);
  const width = window.innerWidth;
const height = window.innerHeight;

console.log('可视区域宽度:', width);
console.log('可视区域高度:', height);

  pageHeight.value = height;
});
// 在组件卸载前清除定时器，防止内存泄漏
onBeforeUnmount(() => {
@@ -2383,43 +2459,16 @@
      if (!xiaoduzhuangti.value) {
        initTupiao();
      }
    }, 1000);
    }, 500);
  }
);

watch(() => deviceData.value.患者姓名, (newVal: string, oldVal: string) => {
  console.log("患者姓名变化:", newVal)

  if (newVal && oldVal !== newVal) {
    isHeightSet.value = false // 重置标识
    contentHeight.value = 0;  // 清空高度，强制更新 el-carousel

    setTimeout(() => {
      if (isHeightSet.value) return // 如果已设置过就不重复执行

      const windowHeight = window.innerHeight
      const toubu = document.getElementById('toubu')
      const toubuHeight = toubu ? toubu.offsetHeight : 0

      const newHeight = windowHeight - toubuHeight

      if (newHeight !== contentHeight.value) {
        contentHeight.value = newHeight
        console.log("更新 contentHeight.value: ", contentHeight.value)
      }

      isHeightSet.value = true
    }, 500)
  }
})

const 数据初始化 = ref(false);
//创建链接对象
const creatSource = () => {
  // http://testbs.ihemodialysis.com/sse/sseEvent
  // const test='http://testbs.ihemodialysis.com/sse/sseEvent/'
  数据初始化.value = true;
  const test = import.meta.env.VITE_SSE_BASE_URL;
  const test = "https://backend.ihemodialysis.com/sse/sseEvent/";
  const stateArr = [
    { key: 0, value: "正在链接中" },
    { key: 1, value: "已经链接并且可以通讯" },
@@ -2480,13 +2529,9 @@
              dbp: dataBody?.床旁血压结果?.dbp,
              zuihouTime: date,
            };

            nextTick(() => {
              setTimeout(() => {
                initTupiao();
              }, 500);
            });

          } else if (dataBody.推送类型 === "中央监控大屏信息") {
            数据初始化.value = false;
            // loading.close()
@@ -2725,14 +2770,9 @@
        xAxisData.push(1);
      }
      try {
        let myChart = null;

        if (proxy.$refs["echartsDiv" + deviceData.value.设备编号]) {
          myChart = echarts.init(
        const myChart = echarts.init(
            proxy.$refs["echartsDiv" + deviceData.value.设备编号]
          );
        }

        const option = {
          // backgroundColor: 床旁血压计.value.zuihouTime>shishiTime.value?'#ffffff':textcolor.value,
          backgroundColor: "#ffffff",
@@ -2769,22 +2809,15 @@
          },
          series: seriesData,
        };
        if (myChart) {
          myChart.setOption(option);
        }
      } catch (e) {
        console.log("图标渲染异常异常");
      }
    } else {
      try {
        let myChart = null;

        if (proxy.$refs["echartsDiv" + deviceData.value.设备编号]) {
          myChart = echarts.init(
        const myChart = echarts.init(
            proxy.$refs["echartsDiv" + deviceData.value.设备编号]
          );
        }


        const option = {
          backgroundColor:
@@ -2819,11 +2852,8 @@
          },
          series: [],
        };
        if (myChart) {
          myChart.setOption(option);
        }
      } catch (e) {
        console.log("图表渲染异常异常: ", e);
        console.log(
          "异常",
          proxy.$refs["echartsDiv" + deviceData.value.设备编号]
@@ -2831,6 +2861,7 @@
      }
    }
  } else if (deviceData.value.患者姓名 === "") {
    console.log("2222");
    const tbdata1 = [];
    const tbdata2 = [];
    const tbdata3 = [];
@@ -2866,28 +2897,15 @@
    }
    try {
      console.log("渲染设备");
      let myChart1 = null;
      let myChart2 = null;
      let myChart3 = null;

      if (proxy.$refs["echartsDivwd" + deviceData.value.设备编号]) {
        myChart1 = echarts.init(
      const myChart1 = echarts.init(
          proxy.$refs["echartsDivwd" + deviceData.value.设备编号]
        );
      }

      if (proxy.$refs["echartsDivls" + deviceData.value.设备编号]) {
          myChart2 = echarts.init(
      const myChart2 = echarts.init(
            proxy.$refs["echartsDivls" + deviceData.value.设备编号]
          );
      }

      if (proxy.$refs["echartsDivddd" + deviceData.value.设备编号]) {
        myChart3 = echarts.init(
      const myChart3 = echarts.init(
          proxy.$refs["echartsDivddd" + deviceData.value.设备编号]
        );
      }

      const option1 = {
        // backgroundColor: textcolor.value,
        tooltip: {
@@ -3010,15 +3028,9 @@
          },
        ],
      };
      if (myChart1) {
        myChart1.setOption(option1);
      }
      if (myChart2) {
        myChart2.setOption(option2);
      }
      if (myChart3) {
        myChart3.setOption(option3);
      }
    } catch (e) {
      console.log("图标渲染异常异常");
    }