From 245efaa0449d03ec8db1faca6827d5e68b548316 Mon Sep 17 00:00:00 2001
From: chenyincheng <501753378@qq.com>
Date: 星期一, 20 三月 2023 22:42:50 +0800
Subject: [PATCH] 45

---
 src/views/home/index.vue |  922 +++++++++++++++++++++++++++++++++++++-------------------
 1 files changed, 604 insertions(+), 318 deletions(-)

diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 4c6f35a..b04fdec 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -1,343 +1,629 @@
 <script lang="ts">
 import { userInfoStore } from '@/stores/userInfo'
 import { sockteStore } from '@/stores/sockteInfo'
+import { ipcRenderer } from 'electron'
 import { patientInfoStore } from '@/stores/patient'
+import { updatePatient } from '@/api/user/index'
 import os from "os"
-import { reactive,computed, toRefs,onMounted ,ref,watch} from "vue"
-import{sendPationCode,sendPationSet} from '../../samples/sockteStomp'
-import {formatDate} from '@/utils/formatTime'
+import Speech from 'speak-tts'
+import { reactive, computed, toRefs, onMounted, ref, watch } from "vue"
+import { sendPationCode, sendPationSet } from '../../samples/sockteStomp'
+import { sendPationCodeApi } from '../../samples/httpApi'
+import { formatDate } from '@/utils/formatTime'
+import state1 from '@/assets/state1.png'
+import state2 from '@/assets/state2.png'
+import state3 from '@/assets/state3.png'
+import logo from '@/assets/LOGO.png'
+import step6 from '@/assets/mp3/step6.mp3'
+import step5 from '@/assets/mp3/step5.mp3'
+import step4 from '@/assets/mp3/step4.mp3'
+import step3 from '@/assets/mp3/step3.mp3'
+import step2 from '@/assets/mp3/step2.mp3'
+import step1 from '@/assets/mp3/step1.mp3'
+import step7 from '@/assets/mp3/chongfuchengzhong.mp3'
+import login from '@/views/login/index.vue'
+import { confingInfoStore } from '@/stores/StoresConfing'
+import { ElMessage } from 'element-plus'
 
- export default {
-        setup() {
-            let  timer:any=0
-            const user = userInfoStore()
-            const sockte= sockteStore()
-            const inputRef=ref()
-            const AudioRef0=ref()
-            const AudioRef=ref()
-            const AudioRef2=ref()
-            const AudioRef3=ref()
-            const isLink= computed(()=>{
-                return !sockte.isLink
-            }) 
-            const netLink= computed(()=>{
-                return !sockte.netLink
-            })
-            const weightInfo= computed(()=>{
-                return sockte.weightSockte
-            })
-            const xyjInfo= computed(()=>{
-                return sockte.xyjSockte
-            })
-            const patientInfo=computed(()=>{
-                return patientInfoStore().patientInfo
-            })
-            const viewNumber=computed(()=>{
-                return patientInfoStore().viewNumber
-            })
+export default {
+  name: 'hoem',
+  components: { login },
+  setup() {
+    let timer: any = 0
+    const loginRef = ref();
+    const speech = ref(null)
+    const user = userInfoStore()
+    const sockte = sockteStore()
+    const inputRef = ref()
+    let patientCodeLs = ''
+    let patientCodeLsXy = ''
+    const isUseFaceRecogService = ref(false)
+    const isLink = computed(() => {
+      return !sockte.isLink
+    })
+    const netLink = computed(() => {
+      return !sockte.netLink
+    })
+    const weightInfo = computed(() => {
+      return sockte.weightSockte
+    })
+    const faceInfo = computed(() => {
+      return sockte.faceInfoSockte
+    })
+    const xyjInfo = computed(() => {
+      return sockte.xyjSockte
+    })
+    const dkqInfo = computed(() => {
+      return sockte.dkqSockte
+    })
+    const patientInfo = computed(() => {
+      return patientInfoStore().patientInfo
+    })
+    const viewNumber = computed(() => {
+      return patientInfoStore().viewNumber
+    })
 
-            const settime=()=>{
-                // 计数倒计时
-                state.clockNum=patientInfoStore().viewNumber
-                // 清除定时器
-                clearInterval(state.timerNum)
-                console.log('------------------')
-                timer= setInterval(() => {
-                    if (state.clockNum > 0) {
-                        state.clockNum--
-                    }
-                    else {
-                        clearInterval(timer)
-                        patientInfoStore().setpatientInfo({
-                            id:0,
-                            code:'',
-                            name:'',
-                            patientAvatarIcon:'',
-                            deviceCode:'',
-                            hemoCode:'',
-                            pureWeight:''
-                        })
-                        state.clockNum = patientInfoStore().viewNumber
-                    }
-                }, 1000)
-                // 记录定时器
-                state.timerNum=timer
-                console.log(timer)
-            }
-            const state=reactive({
-                dialogVisible:false,
-                isActive:false,
-                inputCode:"",
-                Newdate:"",
-                clockNum:60,
-                timerNum:0,//定时器数
-                aimTSL:0,// 目标脱水量,
-                gao_ya:"",//高压
-                di_ya:"",//低压
-                mai_bu:""//脉搏
-            })
-            watch(
-                ()=>patientInfo.value.id,
-                ()=>{
-                    console.log('患者变化了',patientInfo)
-                    if(patientInfo.value.id!==0)
-                    {
-                        AudioRef.value.play();
-                        sockteStore().setweightSockte({
-                            type:"体重秤",
-                            state:2,
-                            deviceName:"",
-                            result:"0",
-                            resultTime:""
-                        })
-                        sockteStore().setxyjSockte({
-                            type:"血压计",
-                            state:2,
-                            deviceName:"",
-                            result:"",
-                            resultTime:""
-                        })
-                        settime()
-                       
-                    }
-                }
-            )
-            watch(
-                ()=>weightInfo.value.resultTime,
-                ()=>{
-                    settime()
-                    console.log("体重变化了")
-                    // AudioRef2.value.play()
-                    if(patientInfo.value.id===0){
-                        AudioRef0.value.play()
-                    }
-                    else{
-                        AudioRef2.value.play()
-                        // 发送结果到sockte服务
-                        const mode={
-                            patientCode:patientInfo.value.code,
-                            weight:weightInfo.value.result,
-                            bloodPressure:''
-
-                        }
-                        console.log('发送患者结果',mode)
-                        sendPationSet(mode)
-                        // 计算目标脱水量
-                        if(Number(weightInfo.value.result)>0&&Number(patientInfo.value.pureWeight)!==0){
-                            state.aimTSL=Number(weightInfo.value.result)-Number(patientInfo.value.pureWeight)
-                        }
-                    }
-                }
-            )
-            watch(
-                ()=>xyjInfo.value.resultTime,
-                ()=>{
-                    if(xyjInfo.value.result!==''){
-                        const list=xyjInfo.value.result.split(',')
-                        if(list.length===3){ 
-                            state.gao_ya=list[0]
-                            state.di_ya=list[1]
-                            state.mai_bu=list[2]
-                        }
-                        if(patientInfo.value.id===0){
-                            AudioRef0.value.play()
-                            settime()
-                        }else{
-                            AudioRef3.value.play()
-                            settime()
-                            const mode={
-                                patientCode:patientInfo.value.code,
-                                weight:weightInfo.value.result,
-                                bloodPressure:xyjInfo.value.result
-
-                            }
-                            console.log('发送患者结果',mode)
-                            sendPationSet(mode)
-                        }    
-                    }else{
-                        state.gao_ya=""
-                        state.di_ya=""
-                        state.mai_bu=""
-                    }
-                }
-            )
-            watch(()=>viewNumber,
-                ()=>{
-                    state.clockNum=viewNumber.value
-                }
-            )
-            const inputChabge=()=>{
-                sendPationCode(state.inputCode)
-                setTimeout(function(){
-                    state.inputCode=''
-                },1000)
-            }
-            onMounted(() => {
-                console.log('页面初始化',os.hostname())
-                state.clockNum=patientInfoStore().viewNumber
-                setTimeout(function(){
-                    console.log('7秒后操作')
-                    inputRef.value.focus();
-                },7000)
-                setInterval(function(){
-                    state.Newdate=formatDate(new Date(),"YYYY-mm-dd HH:MM:SS")
-                },1000)
-            })
-            return{ ...toRefs(state),isLink,netLink,weightInfo,patientInfo,xyjInfo,inputRef,AudioRef0,AudioRef,AudioRef2,AudioRef3,inputChabge
-            }
+    const settime = () => {
+      // 计数倒计时
+      state.clockNum = patientInfoStore().viewNumber
+      // 清除定时器
+      clearInterval(state.timerNum)
+      console.log('------------------')
+      timer = setInterval(() => {
+        if (state.clockNum > 0) {
+          state.clockNum--
         }
+        else {
+          clearInterval(timer)
+          const datetimeCON = patientInfoStore().patientInfo.datetime
+          patientInfoStore().setpatientInfo({
+            id: 0,
+            code: '',
+            name: '',
+            patientAvatarIcon: '',
+            deviceCode: '',
+            hemoCode: '',
+            pureWeight: '',
+            datetime: datetimeCON
+          })
+          state.clockNum = patientInfoStore().viewNumber
+          sockteStore().setweightSockte({
+            type: '体重秤',
+            deviceName: '',
+            result: '',
+            resultTime: '',
+            state: 2
+          })
+          sockteStore().setxyjSockte({
+            type: '血压计',
+            deviceName: '',
+            result: '',
+            resultTime: '',
+            state: 2
+          })
+          state.aimTSL = ''
+          state.gao_ya = ''
+          state.di_ya = ''
+          state.mai_bu = ''
+        }
+      }, 1000)
+      // 记录定时器
+      state.timerNum = timer
+      console.log(timer)
     }
+    const state = reactive({
+      caozuo: 0,// 点击10下才能关闭
+      logo: logo,
+      step5: step5,
+      step4: step4,
+      step3: step3,
+      step7: step7,
+      step2: step2,
+      step1: step1,
+      step6: step6,
+      state1: state1,
+      state2: state2,
+      state3: state3,
+      dialogVisible: false,
+      isActive: false,
+      inputCode: "",
+      Newdate: "",
+      clockNum: 60,
+      timerNum: 0,//定时器数
+      aimTSL: '',// 目标脱水量,
+      gao_ya: "",//高压
+      di_ya: "",//低压
+      mai_bu: "",//脉搏,
+      haodu: "0px",
+    })
+    watch(
+      () => patientInfo.value.datetime,
+      () => {
+        console.log('患者信息变化', patientInfo.value)
+        patientCodeLs = ''
+        patientCodeLsXy = ''
+        console.log(patientCodeLs, '患者codec初始化')
+        state.aimTSL = ''
+        sockteStore().setweightSockte({
+          type: "体重秤",
+          state: 2,
+          deviceName: "",
+          result: "0",
+          resultTime: ""
+        })
+        sockteStore().setxyjSockte({
+          type: "血压计",
+          state: 2,
+          deviceName: "",
+          result: "",
+          resultTime: ""
+        })
+        settime()
+        if (patientInfo.value.id !== 0 && patientInfo.value.name !== '' && patientInfo.value.isScheduled === 1) {
+          let str = `${patientInfo.value.name}识别成功。`
+          speech.value?.speak({ text: str }).then(() => {
+            console.log("播报完成...")
+          })
+
+        }
+        // 没有找到患者
+        else if (patientInfo.value.name === '') {
+          // speech.value?.speak({ text: "没有找到患者,请重新刷卡" }).then(() => {
+          //   console.log("播报完成...")
+          // })
+          if (isUseFaceRecogService.value) {
+            state.dialogVisible = true
+          }
+          return
+        }
+        // 没有排班
+        else if (patientInfo.value.isScheduled === 0) {
+          speech.value?.speak({ text: `${patientInfo.value.name}今日没有排班,不能自助签到` }).then(() => {
+            console.log("播报完成...")
+          })
+          if (isUseFaceRecogService.value) {
+            state.dialogVisible = true
+          }
+          return
+        }
+      }
+    );
+    watch(
+      () => weightInfo.value.resultTime,
+      () => {
+        console.log("体重变化了", weightInfo.value)
+        if (patientInfo.value.id === 0) {
+          speech.value?.speak({ text: "没有识别的患者,请先验证患者" }).then(() => {
+            console.log("播报完成...")
+          })
+        }
+        if (weightInfo.value.result !== "0") {
+            // 发送结果到sockte服务
+            const mode = {
+              patientCode: patientInfo.value.code,
+              weight: weightInfo.value.result,
+              bloodPressure: ''
+
+            }
+            console.log('发送患者结果,前提是患者code 不能重复', mode)
+            if (patientCodeLs !== mode.patientCode) {
+              const tt = mode.weight.replace('.', '点')
+              console.log('发送患者结果', tt)
+              speech.value?.speak({ text: `称重完成,${tt}kg` }).then(() => {
+                console.log("播报完成...")
+              })
+              // api上传
+              updatePatient(mode).then(re => {
+                console.log(re)
+              }).catch(() => {
+                ElMessage.error('结果上报出错,请联系后台管理员')
+              })
+              // sendPationSet(mode)
+              patientCodeLs = mode.patientCode
+            }
+            else {
+              // console.log(`patientCodeLs===${patientCodeLs} ,mode.patCode${mode.patientCode}`)
+              // speech.value?.speak({ text: "不能重复称重,请先刷卡然后再称重" }).then(() => {
+              //   console.log("播报完成...")
+              // })
+            }
+            // 计算目标脱水量
+            if (Number(weightInfo.value.result) > 0 && Number(patientInfo.value.pureWeight) !== 0) {
+              state.aimTSL = (Number(weightInfo.value.result) - Number(patientInfo.value.pureWeight)- Number(patientInfo.value.clothesWeight)).toFixed(2)
+            }
+          }
+      }
+    );
+    watch(
+      () => xyjInfo.value.resultTime,
+      () => {
+        if (xyjInfo.value.result !== '') {
+          const list = xyjInfo.value.result.split(',')
+          if (list.length === 3) {
+            state.gao_ya = list[0]
+            state.di_ya = list[1]
+            state.mai_bu = list[2]
+          }
+          if (patientInfo.value.id === 0) {
+            speech.value?.speak({ text: "没有识别的患者,请先验证患者" }).then(() => {
+              console.log("播报完成...")
+            })
+          } else {
+            const mode = {
+              patientCode: patientInfo.value.code,
+              weight: '',
+              bloodPressure: xyjInfo.value.result
+
+            }
+            console.log('发送患者结果', mode)
+            if (patientCodeLsXy === mode.patientCode) {
+              speech.value?.speak({ text: '不能重复测量血压,请重新识别患者再测量血压' }).then(() => {
+                console.log("播报完成...")
+              })
+              console.log('如果是重复提交 就不要上传到api')
+              return false
+            } else {
+              updatePatient(mode).then(re => {
+                speech.value?.speak({ text: `收缩压:${state.gao_ya},舒张压:${state.di_ya},脉搏:${state.mai_bu}` }).then(() => {
+                  console.log("播报完成...")
+                })
+                patientCodeLsXy = mode.patientCode
+                console.log(re)
+              })
+              sendPationSet(mode)
+            }
+          }
+        } else {
+          state.gao_ya = ""
+          state.di_ya = ""
+          state.mai_bu = ""
+        }
+      }
+    );
+    watch(
+      () => dkqInfo.value.resultTime,
+      () => {
+        state.dialogVisible = false
+        console.log(dkqInfo.value, '读卡器')
+        if (dkqInfo.value.result !== '' && dkqInfo.value.result !== undefined) {
+          const code = dkqInfo.value.result.split(",")[0]
+          console.log('获取读卡器的code', code)
+          sendPationCodeApi(code)
+        }
+      }
+    );
+    watch(
+      ()=>faceInfo.value.result,
+      ()=>{
+        console.log('页面收到了人脸识别')
+        sendPationCodeApi(faceInfo.value.result)
+        // console.log(faceInfo.value.result)
+      }
+    )
+    watch(() => viewNumber,
+      () => {
+        state.clockNum = viewNumber.value
+      }
+    );
+    const inputChabge = () => {
+      sendPationCodeApi(state.inputCode)
+      setTimeout(function () {
+        state.inputCode = ''
+      }, 1000)
+    }
+    const guyanbi = () => {
+      state.caozuo++
+      if (state.caozuo > 10) {
+        ipcRenderer.send('winClose')
+      }
+      console.log(state.caozuo)
+    }
+    onMounted(() => {
+      console.log('页面初始化', os.hostname())
+      console.log('页面初始化读取配置文件', confingInfoStore().confingInfo)
+      // 是否开启脸识别
+      isUseFaceRecogService.value = confingInfoStore().confingInfo.isUseFaceRecogService
+      if (isUseFaceRecogService.value) {
+        state.dialogVisible = true
+      }
+      state.haodu = (document.documentElement.clientHeight - 180) / 2 + 'px'
+      state.clockNum = patientInfoStore().viewNumber
+      setInterval(function () {
+        inputRef.value.focus();
+      }, 1000)
+      speech.value = new Speech();
+      speech.value?.setLanguage('zh-CN')
+      speech.value?.init().then(() => {
+        console.log('语音初始化成功')
+      })
+
+    })
+    return {
+      ...toRefs(state), guyanbi, loginRef, isLink, netLink, weightInfo, patientInfo, xyjInfo, inputRef, inputChabge
+    }
+  }
+}
 </script>
 <template>
-    <div class="home">
-        <!-- 提醒刷卡 -->
-        <audio src="https://dhcdn.leon056.com/hemo/autoselfsign/step1.mp3" ref="AudioRef0" id="eventAudio"></audio>
-        <!-- 患者信息读取成功 -->
-        <audio src="https://dhcdn.leon056.com/hemo/autoselfsign/step2.mp3" ref="AudioRef" id="eventAudio"></audio>
-        <!-- 体重结果回传成功 -->
-        <audio src="https://dhcdn.leon056.com/hemo/autoselfsign/step3.mp3" ref="AudioRef2" id="eventAudio"></audio>
-        <!-- 血压结果回传成功 -->
-        <audio src="https://dhcdn.leon056.com/hemo/autoselfsign/step4.mp3" ref="AudioRef3" id="eventAudio"></audio>
-        <el-dialog
-            title="提示"
-            v-model="netLink"
-            width="30%">
-            <span>无法链接到网络!</span>
-        </el-dialog>
-        <el-dialog
-            title="提示"
-            v-model="isLink"
-            width="30%">
-            <span>sockte连接失败正在重连。。。。。。</span>
-        </el-dialog>
-        <el-row>
-            <el-col :span="12">
-                <div class="tale">
-                    <img class="imgss" alt="Vue logo" src="@/assets/logo.png" />
-                </div>
-            </el-col>
-            <el-col :span="6">
-                <!-- <div> sockte连接状态{{isLink}}</div>
-                <div> 网络连接状态{{netLink}}</div> -->
-                <el-input id="inputCode" @change="inputChabge" v-model="inputCode" ref="inputRef" placeholder="" />
-
-            </el-col>
-            <el-col :span="6">
-                <div class="datess">
-                    {{clockNum}}
-                </div>
-            </el-col>
-        </el-row>
-        <div class="grid-container">
-            <div class="grid-item">
-                <el-avatar
-                    shape="square"
-                    :size="100"
-                    fit="cover"
-                    :src="patientInfo.patientAvatarIcon"
-                />
-                <div class="zsf">{{patientInfo.name}}</div>
-            </div>
-            <div class="grid-item">
-                <div class="lableText">当前时间:</div>
-                <div class="conText">{{Newdate}}</div>
-            </div>
-            <div class="grid-item">
-                <div class="lableText">透析号:</div>
-                <div class="conText">{{patientInfo.hemoCode}}</div>
-            </div>
-            <div class="grid-item">
-                <div class="lableText">机号:</div>
-                <div class="conText">{{patientInfo.deviceCode}}</div>
-            </div>
-            <div class="grid-item">
-                <div class="lableText">序号:</div>
-                <div class="conText">0</div>
-            </div>
-            <div class="grid-item">
-                <div class="lableText">干体重(kg):</div>
-                <div class="conText">{{patientInfo.pureWeight}}</div>
-            </div>
-            <div class="grid-item" >
-                <div>
-                    <div class="lableText" v-if="weightInfo.state===2">透前称重(kg):</div>
-                    <div class="lableText" v-if="weightInfo.state===1" style="color:red">体重秤通讯服务正常运行但未联通设备</div>
-                    <div class="lableText" v-if="weightInfo.state===0" style="color:red">体重秤通讯服务不正常 </div>
-                    <div class="conText">{{weightInfo.result}}</div>
-                </div>
-            </div>
-            <div class="grid-item">
-                <div class="lableText">目标脱水量:</div>
-                <div class="conText">{{aimTSL}}</div>
-            </div>
-            <div class="grid-item">
-                <div class="lableText" v-if="xyjInfo.state===2">血压:</div>
-                <div class="lableText" v-if="xyjInfo.state===1" style="color:red">血压通讯服务正常运行但未联通设备</div>
-                <div class="lableText" v-if="xyjInfo.state===0" style="color:red">血压通讯服务不正常 </div>
-                <div class="conText">{{gao_ya}}/{{di_ya}}</div>
-            </div>
-        </div>
+  <div>
+    <div class="pagehome">
+      <el-dialog v-model="dialogVisible" width="80%" center :show-close="false">
+        <template>
+          <div class="my-header">
+            <h4>人脸识别中。。。</h4>
+          </div>
+        </template>
+        <login ref="loginRef" />
+      </el-dialog>
     </div>
+    <el-dialog title="提示" v-model="netLink" width="30%">
+      <span>无法链接到网络!</span>
+    </el-dialog>
+    <el-row class="header">
+      <el-col :span="8">
+        <img class="image_1" referrerpolicy="no-referrer" :src="logo" />
+        <div class="inpu">
+          <el-input v-model="inputCode" ref="inputRef" id="inputCode" class="inputCode" @change="inputChabge"
+            placeholder="请输入患者卡号或扫描条码" />
+        </div>
+      </el-col>
+      <el-col :span="8" class="titleText">
+        <span class="text_1" @click="guyanbi">自助签到</span> <span class="text_2"></span>
+      </el-col>
+      <el-col :span="8" class="inputcla">
+        {{ clockNum }}
+      </el-col>
+    </el-row>
+    <el-row :gutter="20">
+      <el-col :span="12">
+        <div class="divcol" :style="{ height: haodu }">
+          <el-row style="width: 100%; height: 100%">
+            <el-col :span="8" class="imgclass">
+              <el-image style="width: 100%; height: 85%" :src="patientInfo.patientAvatarIcon" fit="cover" />
+            </el-col>
+            <el-col :span="15" class="userinfo">
+              <el-row>
+                <el-col :span="12">
+                  <div class="lableclass">
+                    姓名:
+                  </div>
+                </el-col>
+                <el-col :span="12">
+                  <div class="textclass">
+                    {{ patientInfo.name }}
+                  </div>
+                </el-col>
+
+              </el-row>
+              <el-row style="margin-top: 10%;">
+                <el-col :span="12">
+                  <div class="lableclass">
+                    透析号:
+                  </div>
+                </el-col>
+                <el-col :span="12">
+                  <div class="textclass">
+                    {{ patientInfo.hemoCode }}
+                  </div>
+                </el-col>
+              </el-row>
+            </el-col>
+          </el-row>
+        </div>
+      </el-col>
+      <el-col :span="12">
+        <div class="divcol" :style="{ height: haodu }">
+          <el-row class="titleHand">
+            <el-col :span="12">
+              <div class="tilaft">
+                血压(mmHg):
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="tiregth">
+                <img class="image_3" v-if="xyjInfo.state === 2" referrerpolicy="no-referrer" :src="state1" />
+                <img class="image_3" v-if="xyjInfo.state === 1" referrerpolicy="no-referrer" :src="state2" />
+                <img class="image_3" v-if="xyjInfo.state === 0" referrerpolicy="no-referrer" :src="state3" />
+              </div>
+            </el-col>
+          </el-row>
+          <el-row class="divbody">
+            <div class="bodeText">
+              {{ Number(gao_ya) }}/{{ Number(di_ya) }}
+              <br />{{ Number(mai_bu) }}
+            </div>
+          </el-row>
+        </div>
+      </el-col>
+    </el-row>
+    <el-row style="margin-top: 20px;" :gutter="20">
+      <el-col :span="12">
+        <div class="divcol" :style="{ height: haodu }">
+          <el-row class="rowdiv">
+            <el-col :span="12">
+              <div class="lableclass">
+                衣物重(kg):
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="textclass">
+                {{ patientInfo.clothesWeight }}
+              </div>
+            </el-col>
+          </el-row>
+          <el-row class="rowdiv">
+            <el-col :span="12">
+              <div class="lableclass">
+                干体重(kg):
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="textclass">
+                {{ patientInfo.pureWeight }}
+              </div>
+            </el-col>
+          </el-row>
+          <el-row class="rowdiv">
+            <el-col :span="12">
+              <div class="lableclass">
+                目标脱水量(L):
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="textclass">
+                {{ aimTSL }}
+              </div>
+            </el-col>
+          </el-row>
+        </div>
+      </el-col>
+      <el-col :span="12">
+        <div class="divcol" :style="{ height: haodu }">
+          <el-row class="titleHand">
+            <el-col :span="12">
+              <div class="tilaft">
+                透前体重(kg):
+              </div>
+            </el-col>
+            <el-col :span="12">
+              <div class="tiregth">
+                <img v-if="weightInfo.state === 2" class="image_4" referrerpolicy="no-referrer" :src="state1" />
+                <img v-if="weightInfo.state === 1" class="image_4" referrerpolicy="no-referrer" :src="state2" />
+                <img v-if="weightInfo.state === 0" class="image_4" referrerpolicy="no-referrer" :src="state3" />
+              </div>
+            </el-col>
+          </el-row>
+          <el-row class="divbody">
+            <div class="bodeText">
+              {{ weightInfo.result }}
+            </div>
+          </el-row>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+
 </template>
-<style>
+<style lang="less"  scoped>
 body {
-    background: #f3f7fb;
+  background: #F3F6FE;
+  padding: 0;
+
 }
-.coldev {
-    height: 200px;
-    background: #ffff;
+
+.inpu {
+  margin-top: 20px;
 }
-.grid-container {
-    display: grid;
-    grid-template-columns: 33% 33% 33%;
-    grid-gap: 20px;
-    background: #f3f7fb;
-    padding: 10px;
+
+.header {
+  height: 40px;
+  background: #FFFFFF;
+  box-shadow: 1px 3px 5px 0px #E9E9E9;
+  margin-bottom: 10px;
 }
-.grid-container > div {
-    background: #ffffff;
-    height: 150px;
-    text-align: center;
-    border-radius: 10px;
-    padding: 10px;
+
+.inputcla {
+  padding-top: 5px;
+  text-align: right;
+  font-size: 27px;
+  font-family: PingFangSC-Medium, PingFang SC;
+  font-weight: 500;
+  color: #FF7472;
+
 }
-.lableText {
-    text-align: left;
-    /* height: 50px; */
-    /* line-height: 50px; */
-    padding-top: 30px;
-    font-size: 13pt;
+
+.titleText {
+  text-align: center;
+  color: red;
+  font-size: 2rem;
+  height: 40px;
+  line-height: 40px;
+
 }
-.conText {
-    height: 50px;
-    line-height: 50px;
-    padding-top: 30px;
-    color: #769aff;
-    font-size: 20pt;
+
+.divcol {
+  box-shadow: 1px 2px 4px 0px rgba(201, 223, 246, 0.5);
+  background-color: rgba(255, 255, 255, 1);
+  border-radius: 20px;
+  height: 426px;
+  padding-left: 1.5rem;
+  padding-top: 5%;
+  padding-right: 0.5rem;
+  background: #FFFFFF;
 }
-.imgss {
-    height: 30px;
+
+.rowdiv {
+  /* background: #769AFF; */
+  font-size: 300%;
+  height: 15%;
+  margin-top: 5%;
 }
-.tale {
-    height: 30px;
-    line-height: 50px;
-    /* text-align: center; */
+
+.titleHand {
+  /* background: #769AFF; */
+  height: 15%;
 }
-.zsf {
-    font-size: 18pt;
-    margin-top: 15pt;
-    color: #769aff;
+
+.tilaft {
+  text-align: left;
+  font-size: 300%;
+  font-family: AlibabaPuHuiTi-Regular, AlibabaPuHuiTi;
+  font-weight: 400;
+  color: #333333;
+  line-height: 42px;
+  letter-spacing: 1px;
 }
-.active{
-    background: #c1c2c6;
-    color: black;
+
+.tiregth {
+  text-align: right;
+  padding-left: 5px;
 }
-.datess{
-    text-align: right;
-    padding-right: 20px;
-    height: 30px;
-    line-height: 30px;
-    color: red;
-    font-weight: 1000;
+
+.divbody {
+  height: 70%;
+  width: 100%;
+  display: table;
 }
-</style>
\ No newline at end of file
+
+.bodeText {
+  display: table-cell;
+  vertical-align: middle;
+  width: 100%;
+  text-align: center;
+  font-size: 700%;
+  font-family: DINAlternate-Bold, DINAlternate;
+  font-weight: bold;
+  color: #769AFF;
+  /* line-height: 100%; */
+}
+
+.imgclass {
+  /* background: red; */
+  height: 100%;
+  /* padding-top: 5%; */
+  /* padding-top: ; */
+}
+
+.userinfo {
+  padding-top: 6%;
+  /* background: #769AFF; */
+  font-size: 300%;
+  text-align: right;
+}
+
+.lableclass {
+  text-align: right;
+  font-weight: 400;
+  color: #777777;
+  /* background: #769AFF; */
+
+}
+
+.textclass {
+  text-align: left;
+  font-family: AlibabaPuHuiTi-Medium, AlibabaPuHuiTi;
+  font-weight: 500;
+  color: #769AFF;
+
+}
+</style>

--
Gitblit v1.8.0