单应用项目,可以创建很多独立工具类页面 ,不用登录 初始化的页面
gx
chenyc
2025-04-29 27504f29f00df1a77f022a0796c61ad6ade4a36c
gx
2个文件已修改
167 ■■■■■ 已修改文件
src/style.css 3 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/deviceWindoes2.vue 164 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/style.css
@@ -39,3 +39,6 @@
    background-color: #f9f9f9;
  }
}
.el-loading-spinner .el-loading-text {
  font-size: 16px; /* 修改为你需要的字体大小 */
}
src/views/deviceWindoes2.vue
@@ -1,5 +1,6 @@
<template>
    <div class="divice">
      <!-- {{数据初始化}} -->
      <div class="youzhiliao" style="height: 100%;" v-if="deviceData.患者姓名">
        <div class="toubu" style="height: 11%;">
            <el-row
@@ -832,7 +833,7 @@
  // 在需要使用的组件中引入
  import { ChatDotSquare } from '@element-plus/icons-vue';
  const ispaiban=ref(false)
  import { ElMessage } from "element-plus";
  import { ElLoading, ElMessage } from "element-plus";
  // 连接服务器
  const source = ref<EventSourcePolyfill | null>(null);
  //接收到的sse数据
@@ -901,7 +902,7 @@
    血压高值列表: "152,133,116",
    设备分区类型: 0,
    设备号: "23",
    设备名称: "24",
    设备名称: "页面初始化中,请耐心等待!",
    设备序列号: "B97AP002",
    设备状态列表: [
    ],
@@ -1255,83 +1256,103 @@
      }, 500);
    }
  );
  const 数据初始化=ref(false)
  //创建链接对象
  const creatSource = () => {
    // http://testbs.ihemodialysis.com/sse/sseEvent
    // const test='http://testbs.ihemodialysis.com/sse/sseEvent/'
    const test='https://backend.ihemodialysis.com/sse/sseEvent/'
          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('链接成功')
              readyState.value = stateArr[source.value?.readyState ?? 0];
              console.log(e)
          };
          source.value.onerror = (e) => {
              console.log(e,'异常情况-----')
              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.推送类型==='床旁血压计'){
                      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
                      }
                      setTimeout(()=>{
                        initTupiao()
                      },500)
                    }else if(dataBody.推送类型==='中央监控大屏信息'){
                      console.log(Date.now() + 'DEV')
                      if(dataBody?.透析状态){
                        deviceData.value=dataBody?.透析状态
                      }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信息.状态列表
                    }
    数据初始化.value=true
      const loading = ElLoading.service({
        lock: true,
        text: '数据初始化中。。。',
        background: 'rgba(0, 0, 0, 0.7)',
        svg:`<path class="path" d="
          M 30 15
          L 28 17
          M 25.61 25.61
          A 15 15, 0, 0, 1, 15 30
          A 15 15, 0, 1, 1, 27.99 7.5
          L 15 15
        " style="stroke-width: 4px; fill: rgba(0, 0, 0, 0)"/>
        `
      })
      const test='https://backend.ihemodialysis.com/sse/sseEvent/'
      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.推送类型==='床旁血压计'){
                  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
                  }
                  setTimeout(()=>{
                    initTupiao()
                  },500)
                }else if(dataBody.推送类型==='中央监控大屏信息'){
                  数据初始化.value=false
                  loading.close()
                  console.log(Date.now() + 'DEV')
                  if(dataBody?.透析状态){
                    deviceData.value=dataBody?.透析状态
                  }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);
          }
      };
      } catch (error) {
          console.log(error);
      }
  };
  const showxuye=()=>{
    let date = new Date();
    date.setMinutes(date.getMinutes() + 0.1);
@@ -1818,6 +1839,7 @@
  }
  </script>
<style lang="less" scoped>
  .divice{
    background: #DAE5EC;
    font-size: 100%;