From 7394e5e60ec25ede11d1ef88358454da8f9c7390 Mon Sep 17 00:00:00 2001
From: chenyc <501753378@qq.com>
Date: 星期二, 14 十一月 2023 18:28:51 +0800
Subject: [PATCH] 增加通讯

---
 src/views/home/index.vue | 1389 ++++++++++++++++++++++++++++++++++----------------------
 1 files changed, 838 insertions(+), 551 deletions(-)

diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index df3de9d..e293f87 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -1,567 +1,854 @@
-<script lang="ts">
+<template>
+  <div class="homeclass">
+    <div class="page" v-if="!dialogVisible">
+        <el-row style="height: 11.3%;">
+        </el-row>
+        <el-row style="height: 50%;margin-bottom: 2%;" :gutter="20">
+          <el-col :span="7"  style="height: 100%;">
+            <el-row style="height: 65%;background: rgba(243, 247, 243, 0.3);border-radius: 8px;">
+              <el-col :span="11">
+                <el-image style="width: 100%; height:100%;border-radius: ;" 
+                :src="patientInfo.patientAvatarIcon" fit="cover" />
+              </el-col>
+              <el-col :span="13" style="width: 100%; height: 85%;">
+                <div style="width: 100%; height: 20%;">
+                    <div  style="width: 50%;height: 100%;text-align:center; background: #DFB144;border-radius: 0px 8px 0px 50px;color: aliceblue; font-size: 2rem;float:right">
+                       <template v-if="patientInfo.patientGender===0">男</template>
+                       <template v-else>女</template>
+                    </div>
+                </div>
+                <div style="width: 100%; height: 20%;" >
+                    <div style="font-size: 2rem; color: #FFFFFF;margin-left: 0.5rem;" >
+                      {{timeShidaun}}
+                    </div>
+                </div>
+                <div style="width: 100%; height: 30%;" >
+                    <div style="font-size: 2.5rem; color: #FFFFFF;margin-left: 0.5rem;">{{ patientInfo.name }}</div>
+                </div>
+                <div style="width: 100%; height: 20%;">
+                    <div style="font-size: 1.5rem;  color: #FFFFFF;margin-left: 0.5rem;">透析号:{{ patientInfo.hemoCode }}</div>
+                </div>
+                <div v-if="is_ce_wen" style="width: 100%; height: 20%;">
+                    <div style="font-size: 1.5rem;  color: #FFFFFF;margin-left: 0.5rem;">
+                      体温:<span v-if="dangqian_wendu>30">{{dangqian_wendu}}°C</span>
+                      <span v-else>      /</span>
+                    </div>
+                </div> 
+              </el-col>
+            </el-row> 
+            <el-row style="height: 30%;background: rgba(243, 247, 243, 0.3);border-radius: 8px; margin-top: 5%; font-size: 2rem;">
+      
+              <div style="height: 25%; line-height: 100%; width: 100%;color: #FFFFFF; "   >
+                <div v-if="patientInfo.isAfterMed===0"   style="width: 200px; font-size: 2rem; text-align: center; height: 63px; line-height: 63px;background: #2CAAFD;border-radius: 0px 8px 0px 50px;float:right">
+                  签到时间
+                </div>
+                <div v-if="patientInfo.isAfterMed===1"   style="width: 200px; font-size: 2rem; text-align: center; height: 63px; line-height: 63px;background: #2CAAFD;border-radius: 0px 8px 0px 50px;float:right">
+                  下次透析时间
+                </div>
+              </div>
+              <div v-if="patientInfo.isAfterMed===0" style="height: 75%; line-height: 100%; width: 100%;color: #FFFFFF; padding-top: 35px; padding-left: 20px; ">
+                  <div >{{date}}</div>
+              </div>
+              <div v-else style="height: 75%; line-height: 100%; width: 100%;color: #FFFFFF; padding-top: 35px; padding-left: 20px; ">
+                  <div v-if="patientInfo.nextRecordDate!==''&&patientInfo.nextRecordDate!==null">{{patientInfo.nextRecordDate.substring(0,11)}}</div>
+              </div>
+            </el-row>
+          </el-col>
+          <el-col :span="10" style="height: 100%;">
+            <div style="width: 100%; height: 100%;position: relative;">
+                <div style="position: absolute;width: 100px; height: 100%;color: #FFFFFF; background-color: #41B593;font-size: 2rem;text-align: center;">
+                  <div style="width: 100%; height:25%;margin-top: 2rem;">透</div>
+
+                  <div v-if="patientInfo.isAfterMed===0" style="width: 100%; height:25%;">前</div>
+                  <div v-if="patientInfo.isAfterMed===1" style="width: 100%; height:25%;">后</div>
+
+                  <div style="width: 100%; height:25%;" v-if="configData.deviceType==='体重秤'"> 称
+                  </div>
+                  <div style="width: 100%; height:25%;" v-if="configData.deviceType==='体重秤'">重</div>
+                  <div style="width: 100%; height:25%;" v-if="configData.deviceType==='血压计'"> 血
+                  </div>
+                  <div style="width: 100%; height:25%;" v-if="configData.deviceType==='血压计'">压</div>
+                </div>
+                <div style="margin-left:100px; height:100%; line-height: 100%; color: #FFFFFF; background: rgba(243, 247, 243, 0.3);font-size: 8rem; font-weight: 900;">
+                  <div v-if="configData.deviceType==='体重秤'" class="textjuzhong">
+                    {{ weightInfo.result }}
+                  </div>    
+                  <div v-if="configData.deviceType==='血压计'"  style="height: 100%; width: 100%;font-size: 7rem;" >
+                    <!-- <div style=" height:100%;" class="textjuzhong">
+                      {{ Number(gao_ya) }}<br/> {{ Number(di_ya) }}
+                    </div> -->
+                    <div style=" height:50%;" class="textjuzhong">
+                      {{ Number(gao_ya) }}
+                      <span  style="font-size: 1rem; line-height: 1rem; margin-top: 5rem;">
+                        mmHg
+                      </span>
+                    </div>
+                    <div style=" height:50%;" class="textjuzhong">
+                      {{ Number(di_ya) }}
+                      <span  style="font-size: 1rem; line-height: 1rem; margin-top: 5rem;">
+                        mmHg
+                      </span>
+                    </div>
+                  </div> 
+                </div>
+            </div>
+          </el-col>
+          <el-col :span="7">
+            <div style="height: 48%; border-radius: 8px;">
+              <div style="height: 25%;">
+                <div class="textjuzhong" v-if="patientInfo.isAfterMed===0" style="background: #41B593; font-size: 2rem; color: #FFFFFF;">
+                    <template v-if="configData.deviceType==='体重秤'">上次透后体重(kg)</template>
+                    <template v-if="configData.deviceType==='血压计'">上次透后血压</template>
+                </div>
+                <div class="textjuzhong" v-if="patientInfo.isAfterMed===1" style="background: #41B593; font-size: 2rem; color: #FFFFFF;">
+                    
+                    <template v-if="configData.deviceType==='体重秤'">体重减少(kg)</template>
+                    <template v-if="configData.deviceType==='血压计'">透前血压</template>
+                </div>
+              </div>
+              <div style="height: 75%;">
+                <div class="textjuzhong" v-if="patientInfo.isAfterMed===0" style="background: rgba(243, 247, 243, 0.3); font-size: 6rem; font-weight: 800; color: #41B593;">
+                  <template v-if="configData.deviceType==='体重秤'"> {{patientInfo.lastTimeAfterWeight}}</template>
+                  <template v-if="configData.deviceType==='血压计'">{{patientInfo.lastTimeAfterBP}}</template>
+                </div>
+                <div class="textjuzhong" v-if="patientInfo.isAfterMed===1" style="background: rgba(243, 247, 243, 0.3); font-size: 6rem; font-weight: 800; color: #41B593;">
+                  <template v-if="configData.deviceType==='体重秤'">{{tzjs}}</template>
+                  <template v-if="configData.deviceType==='血压计'">{{patientInfo.preBP}}</template>
+                </div>
+              </div>
+            </div>
+            <div style="height: 48%; margin-top: 4%;">
+              <div style="height: 25%;">
+                <div class="textjuzhong" style="background: #65AAF6; font-size: 2rem; color: #FFFFFF;">
+                  <template v-if="configData.deviceType==='体重秤'&&patientInfo.isAfterMed===0">目标脱水量(L)</template>
+                  <template v-if="configData.deviceType==='体重秤'&&patientInfo.isAfterMed===1">实际超滤量(L)</template>
+                  <template v-if="configData.deviceType==='血压计'">透前脉搏(次/分)</template>
+                  
+                </div>
+              </div>
+              <div style="height: 75%;">
+                <div class="textjuzhong" style="background: rgba(243, 247, 243, 0.3); font-size: 6rem; font-weight: 800; color: #65AAF6;">
+                  <template v-if="configData.deviceType==='体重秤'&&patientInfo.isAfterMed===0">{{aimTSL}}</template>
+                  <template v-if="configData.deviceType==='体重秤'&&patientInfo.isAfterMed===1">{{patientInfo.actuallyClliang}}</template>
+                  <template v-if="configData.deviceType==='血压计'">{{mai_bu}}</template>
+                </div>
+              </div>
+            </div>
+          </el-col>
+        </el-row>
+        <el-row style="height: 30%;" :gutter="20">
+          <el-col :span="7" style="height: 100%;">
+              <div style="height: 25%;">
+                <div class="textjuzhong" style="background: #DFB144; font-size: 2rem; color: #FFFFFF;">
+                  机位/床位号
+                </div>
+              </div>
+              <div style="height: 75%;">
+                <div class="textjuzhong" style="background: rgba(243, 247, 243, 0.3); font-size: 6rem; font-weight: 800; color: #DFB144;">
+                  {{ patientInfo.deviceNo }}
+                </div>
+              </div>
+          </el-col>
+          <el-col :span="17">
+            <div style="height: 25%;">
+                <div class="textjuzhong" style="background: #DFB144; font-size: 2rem; color: #FFFFFF;">
+                  治疗信息
+                </div>
+              </div>
+              <div style="height: 75%;">
+                <div style="background: rgba(243, 247, 243, 0.3); height: 100%; width: 100%; font-size: 2.5rem; line-height: 4.5rem; font-weight: 800; color: #FFFFFF; text-align: center;padding-top: 1rem;">
+                  <span style="font-size: 4rem; color:#DFB144 ; " >干体重  {{patientInfo.pureWeight}}kg</span>
+                  <br>
+                  <span > 透析器:{{patientInfo.txq}}</span>
+                  <span > 治疗模式:{{patientInfo.medMethod}}</span>
+                  <span > 灌流器:{{patientInfo.glq}}</span>
+                </div>
+              </div>
+          </el-col>
+        </el-row>
+    </div>
+    <div class="wrapp">
+        <div class="toupu" style="height: 11.3%;">
+          <el-row style="100%">
+            <el-col :span="12" >
+              <img class="image_1" @click="guyanbi"  referrerpolicy="no-referrer" src="@/assets/logo.png" />
+            </el-col>
+            <el-col :span="12" >
+              <el-row>
+                <el-col   :span="24" style="text-align: right; line-height: 67px;padding-right: 0px; font-size: 40px;font-weight: 400;color: #EB6F1C;">
+                  <div v-if="!dialogVisible">{{clockNum}}S</div>
+                  <el-input   v-else  v-model="inputCode" ref="inputRef" id="inputCode"  style="width: 200px; height: 40px;ime-mode:active"  @change="inputChabge"
+                    placeholder="请输入患者卡号或扫描条码" />
+                </el-col>
+              </el-row>
+            </el-col>
+          </el-row>
+        </div>
+        <div class="rWrapp">
+          <video id="myVideo" preload="preload" autoplay loop muted />
+          <div style="text-align: center; font-size: 2rem; color: bisque;margin-top: 1rem;">请将脸部对准摄像头</div>
+        </div>
+        <div v-if="imgSrc" class="img_bg_camera" style="margin-top: 200px;">
+          <p>效果预览</p>
+          <img :src="imgSrc"  class="tx_img" />
+        </div>
+        <div style="margin-top: 0px; z-index: -1;position:absolute;" >
+          <canvas ref="myCanvas" id="myCanvas" class="myCanvas" width="200" height="200" ></canvas>
+        </div>
+        <div class="footer" style="text-align: right;">
+          <div class="fanhuikey" v-if="!dialogVisible" @click="fuxuan">
+           返回
+          </div>
+        </div>
+    </div>
+    <!-- <el-dialog title="提示" v-model="netLink" width="30%">
+      <span>无法链接到网络!</span>
+    </el-dialog> -->
+  </div>
+</template>
+<script setup 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 Speech from 'speak-tts'
+import { reactive,computed, toRefs, onMounted, watch, ref } from "vue"
+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'
-
-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 AudioRef4=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 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)
-                    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,
-            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,
-            () => {
-                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()
-
-                }else{
-                  if(patientInfo.value.name===''){
-                    AudioRef4.value.play();
-                  }
-                  
-                }
-            }
-        )
-        watch(
-            () => weightInfo.value.result,
-            () => {
-                settime()
-                console.log("体重变化了",weightInfo.value)
-                // 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)).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) {
-                        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(
-            () => dkqInfo.value.resultTime,
-            () => {
-              console.log(dkqInfo.value,'读卡器')
-                if (dkqInfo.value.result !== ''&&dkqInfo.value.result !== undefined) {
-                  const code=dkqInfo.value.result.split(",")[0]
-                  console.log('获取读卡器的code',code)
-                  sendPationCode(code)
-                }
-            }
-        )
-        watch(() => viewNumber,
-            () => {
-                state.clockNum = viewNumber.value
-            }
-        )
-        const inputChabge = () => {
-            sendPationCode(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())
-            state.haodu=(document.documentElement.clientHeight-180)/2+'px'
-
-            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), guyanbi,isLink, netLink, weightInfo, patientInfo, xyjInfo, inputRef, AudioRef0, AudioRef, AudioRef4, AudioRef2, AudioRef3, inputChabge
-        }
+import { confingInfoStore } from '@/stores/StoresConfing'
+import {base64toFile} from '@/samples/faceApi'
+import{initPort} from '@/samples/portApi'
+import{initPort as oumulongHbp9030 } from '@/samples/deviceApi/oumulong-HBP-9030'
+import{initPort as  TM2655VP} from '@/samples/deviceApi/TM2655VP'
+import{initPort as zhiRongT605 } from '@/samples/deviceApi/zhiRongT605'
+import{initPort as taiHengM523 } from '@/samples/deviceApi/taiHengM523'
+import{initPort as XK3190A12 } from '@/samples/deviceApi/XK3190A12'
+// 读取体重文件
+import{toDataTz,todatatzs } from '@/samples/deviceApi/seca101'
+import { ElLoading, ElMessage } from 'element-plus'
+import { el } from 'element-plus/es/locale'
+let trackerTask: any = null;
+// 标识用的画布
+const myCanvas = ref<HTMLCanvasElement | null>(null);
+let imgSrc:'';
+const msg = ref<string>("没识别到人脸...");
+// 实例人脸检查器
+const myTracker: any = new tracking.ObjectTracker("face");
+myTracker.setInitialScale(4);
+myTracker.setStepSize(2);
+myTracker.setEdgesDensity(0.1);
+// 监听人脸检查器
+myTracker.on("track", (event: tracking.TrackEvent) => {
+  const context = myCanvas.value?.getContext("2d") as CanvasRenderingContext2D;
+  if (myCanvas.value) {
+    context.clearRect(0, 0, myCanvas.value.width, myCanvas.value.height);
+  }
+  if (event.data.length === 0) {
+    msg.value = "没识别到人脸...";
+  } else if(event.data.length === 1) {
+    trackerTask.stop();
+    msg.value = "检测到人脸";
+    const myCanvas = document.getElementById("myCanvas");// 
+    const thisContext = myCanvas?.getContext("2d");
+    const myVideo = document.querySelector("#myVideo") as HTMLVideoElement;
+    thisContext.drawImage(myVideo, 0,0, 250, 200);
+    imgSrc = myCanvas?.toDataURL('image/png');
+    // 转文件
+    // 识别框显示才能到传阿里云识别
+    if(dialogVisible.value){
+      base64toFile(imgSrc)
     }
+    setTimeout(() => {
+      // console.log(configData.value.face_push+'秒跑一次人脸识别')
+      trackerTask.run();
+    }, configData.value.face_push*1000);
+    // @ts-ignore
+    if (typeof window.stream === "object") {
+      myVideo.srcObject = null;
+      // @ts-ignore
+      window.stream.getTracks().forEach((track) => track.stop());
+    }
+  }
+});
+
+let timer: any = 0
+const date=ref('')
+const timeShidaun=ref('')
+// 语音播报
+const speech = ref(null)
+const sockte = sockteStore()
+const inputRef = ref()
+// 临时患者code
+let patientCodeLs = ''
+// 临时血压
+let patientCodeLsXy = ''
+// 测温是否开启
+const is_ce_wen=ref()
+const isUseFaceRecogService = ref(false)
+const fasongNum=ref(0)
+const caozuo=ref(0)// 点击10下才能关闭
+const dialogVisible=ref(true)
+const inputCode=ref("")
+const clockNum=ref(60)
+const timerNum=ref(0)//定时器数
+const aimTSL=ref('')// 目标脱水量,
+const gao_ya=ref("")//高压
+const di_ya=ref("")//低压
+const  mai_bu=ref("")//脉搏,
+
+const tzjs=computed(()=>{
+  if(weightInfo.value.result!=='0'&&weightInfo.value.result!==undefined&&weightInfo.value.result!==null){
+    return (patientInfo.value.preWeight-Number(weightInfo.value.result)).toFixed(1)
+  }else{
+    return ''
+  }
+ 
+})
+
+const configData=computed(()=>{
+  return confingInfoStore().confingInfo
+})
+const isLink = computed(() => {
+  return !sockte.isLink
+})
+
+// 网络链接
+const netLink = computed(() => {
+  if(!sockte.netLink){
+    ipcRenderer.invoke('logger', '网络已经断开')
+  }else{
+    ipcRenderer.invoke('logger', '网络已经恢复')
+   
+  }
+  return !sockte.netLink
+})
+watch(netLink,()=>{
+  if(!netLink.value){
+    ElMessage.success('网络已经连接')
+  }else{
+    ElMessage.warning('网络已断开,等待重连')
+  }
+})
+
+// 体重
+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 dangqian_wendu=computed(()=>{
+  return sockte.wendu
+})
+// 计数
+const viewNumber = computed(() => {
+  return patientInfoStore().viewNumber
+})
+const settime = () => {
+  clockNum.value = patientInfoStore().viewNumber
 }
+//发送消除某些状态
+const fuxuan=()=>{
+  console.log('返回---')
+  const datetimeCON = patientInfoStore().patientInfo.datetime
+  // 获取是否是一台主机连2个设备
+  const islinkDouble=confingInfoStore().confingInfo.islinkDouble
+  // 如果不是就马上清空
+  if(!islinkDouble){
+    patientInfoStore().setpatientInfo({
+      id: 0,
+      code: '',
+      name: '',
+      patientAvatarIcon: '',
+      deviceCode: '',
+      hemoCode: '',
+      pureWeight: '',
+      datetime: datetimeCON
+    })
+    sockteStore().setweightSockte({
+        type: '体重秤',
+        deviceName: '',
+        result: '0',
+        resultTime: '',
+        state: 2
+    })
+    sockteStore().setxyjSockte({
+      type: '血压计',
+      deviceName: '',
+      result: '',
+      resultTime: '',
+      state: 2
+    })
+    sockteStore().setfaceSockte({
+      type: '人脸识别',
+      deviceName: '',
+      result: '',
+      resultTime: '',
+      state: 2
+      })
+    clockNum.value = patientInfoStore().viewNumber
+    aimTSL.value = ''
+    gao_ya.value = ''
+    di_ya.value = ''
+    mai_bu.value = ''
+  }
+  if (isUseFaceRecogService.value) {
+    console.log('开启人脸识别')
+    dialogVisible.value = true
+  }else{
+    console.log('关闭人脸识别')
+    dialogVisible.value = false
+  }
+
+}
+// 监控患者信息变化
+watch(
+  () => patientInfo.value.datetime,
+  () => {
+    patientCodeLs = ''
+    patientCodeLsXy = ''
+    aimTSL.value = ''
+      // 定时数秒器
+   
+    if (patientInfo.value.id !== 0 && patientInfo.value.name !== '' && patientInfo.value.isScheduled === 1) {
+      settime()
+      // 人脸识别成功后 1查看是否开启测温
+      // console.log(`患者信息识别成功:${patientInfo.value.name}`)
+      ipcRenderer.invoke('logger', `患者信息识别成功:${patientInfo.value.name}`)
+      let str = `${patientInfo.value.name}识别成功。床号:${patientInfo.value.deviceNo}`
+      dialogVisible.value = false
+      speech.value?.speak({ text: str }).then(() => {
+      })
+
+      sockteStore().setweightSockte({
+        type: "体重秤",
+        state: 2,
+        deviceName: "",
+        result: "0",
+        resultTime: ""
+      })
+      sockteStore().setxyjSockte({
+        type: "血压计",
+        state: 2,
+        deviceName: "",
+        result: "",
+        resultTime: ""
+      })
+     
+     
+      
+
+    }
+    // 没有找到患者
+    else if (patientInfo.value.name === '') {
+      ipcRenderer.invoke('logger', '接收到的患者为空')
+      // console.log('接收到的患者为空')
+      if (isUseFaceRecogService.value) {
+        dialogVisible.value = true
+      }
+      return
+    }
+    // 没有排班
+    else if (patientInfo.value.isScheduled === 0) {
+      settime()
+      ipcRenderer.invoke('logger', `患者没有排班:${patientInfo.value.name}`)
+      // console.log( `患者没有排班:${patientInfo.value.name}`)
+      //关闭人脸弹框
+      dialogVisible.value = false
+      speech.value?.speak({ text: `${patientInfo.value.name}今日没有排班,不能自助签到` }).then(() => {
+        // console.log("播报完成...")
+      })
+      sockteStore().setweightSockte({
+        type: "体重秤",
+        state: 2,
+        deviceName: "",
+        result: "0",
+        resultTime: ""
+      })
+      sockteStore().setxyjSockte({
+        type: "血压计",
+        state: 2,
+        deviceName: "",
+        result: "",
+        resultTime: ""
+      })
+      return
+    }
+  }
+);
+// 体重发生了变化
+watch(
+  () => weightInfo.value.resultTime,
+  async () => {
+    // 体重不能0
+    if (weightInfo.value.result !== "0"&&patientInfo.value.code!=='') {
+        ipcRenderer.invoke('logger', `体重变化了:${weightInfo.value.result}`)
+        console.log(`体重变化了:${weightInfo.value.result}`)
+        // 发送结果到sockte服务
+        const mode = {
+          patientCode: patientInfo.value.code,
+          weight: weightInfo.value.result,
+          bloodPressure: ''
+        }
+        if (patientCodeLs !== mode.patientCode) {
+          settime()
+          // 定时数秒器
+          const tt = mode.weight.replace('.', '点')
+          speech.value?.speak({ text: `称重完成,${tt}千克` }).then(() => {
+            console.log("播报完成...")
+          })
+          patientCodeLs = mode.patientCode
+          fasongNum.value=0
+          ipcRenderer.invoke('logger', `开始发送结果到服务器:患者:${patientInfo.value.name},体重结果:${weightInfo.value.result}`)
+          console.log(`开始发送结果到服务器:患者:${patientInfo.value.name},体重结果:${weightInfo.value.result}`)
+          sundModeTz()
+        }
+        else {
+            // 临时患者code=当前患者code
+            patientCodeLs = mode.patientCode
+          }
+        // 计算目标脱水量
+        if (Number(weightInfo.value.result) > 0 && Number(patientInfo.value.pureWeight) !== 0&&patientInfo.value.isAfterMed===0) {
+          aimTSL.value = (Number(weightInfo.value.result) - Number(patientInfo.value.pureWeight)- Number(patientInfo.value.clothesWeight)).toFixed(2)
+        }else if(Number(patientInfo.value.pureWeight) !== 0&&patientInfo.value.isAfterMed===1 && patientInfo.value.preWeight>10){
+          aimTSL.value = (Number(patientInfo.value.preWeight)- Number(patientInfo.value.pureWeight) - Number(patientInfo.value.clothesWeight)).toFixed(2)
+        }
+      }else if(patientInfo.value.code===''&&weightInfo.value.result !== "0"){
+        speech.value?.speak({ text: "没有识别的患者,请先验证患者" }).then(() => {
+          // console.log("播报完成...")
+        })
+      }
+  }
+);
+// 血压发送了变化
+watch(
+  () => xyjInfo.value.resultTime,
+  async () => {
+    if (xyjInfo.value.result !== '') {
+      ipcRenderer.invoke('logger', `血压发生变化了:${weightInfo.value.result}`)
+      console.log(`血压发生变化了:${weightInfo.value.result}`)
+      const list = xyjInfo.value.result.split(',')
+      if (list.length === 3) {
+        gao_ya.value = list[0]
+        di_ya.value = list[1]
+        mai_bu.value = list[2]
+      }
+      // 患者信息为空
+      if (patientInfo.value.id === 0) {
+        speech.value?.speak({ text: "没有识别的患者,请先验证患者" }).then(() => {
+          // console.log("播报完成...")
+        })
+        // 有患者信息
+      } else {
+        speech.value?.speak({ text: `收缩压:${gao_ya.value},舒张压:${di_ya.value},脉搏:${mai_bu.value}` }).then(() => {
+          // console.log("播报完成...")
+        })
+        const mode = {
+          patientCode: patientInfo.value.code,
+          weight: '',
+          bloodPressure: xyjInfo.value.result
+        }
+        fasongNum.value=0
+        // console.log(`开始发送结果到服务器:患者:${patientInfo.value.name},血压结果:${mode.bloodPressure}`)
+        ipcRenderer.invoke('logger', `开始发送结果到服务器:患者:${patientInfo.value.name},血压结果:${mode.bloodPressure}`)
+        // 定时数秒器
+        settime()
+        sundModeXyj()
+      }
+    } else {
+      gao_ya.value = ""
+      di_ya.value = ""
+      mai_bu.value = ""
+    }
+  }
+);
+const sundModeTz= ()=>{
+  const mode = {
+    patientCode: patientInfo.value.code,
+    weight: weightInfo.value.result,
+    bloodPressure: ''
+  }
+  if(dangqian_wendu.value>30){
+    mode.temperature=dangqian_wendu.value
+  }
+  fasongNum.value++
+  ipcRenderer.invoke('logger', `患者结果上传,第${fasongNum.value}次`)
+  ipcRenderer.invoke('logger', '参数:'+JSON.stringify(mode))
+  updatePatient(mode).then(re=>{
+    ElMessage.success('结果发送成功')
+    ipcRenderer.invoke('logger', '结果上传成功')
+    clockNum.value = Number(configData.value.timeJg/1000)
+    return false
+  }).catch(re=>{
+    ElMessage('结果发送失败')
+    console.log('结果发送失败')
+    ipcRenderer.invoke('logger', `结果发送失败:第${fasongNum.value}次,3秒后重新发送`)
+    if(fasongNum.value<3){
+      setTimeout(sundModeTz,5000);
+    }
+    else{
+      ipcRenderer.invoke('logger', '3次结果上传都失败放弃本次请求')
+      return false
+    }
+  })
+}
+const sundModeXyj= ()=>{
+  const mode = {
+    patientCode: patientInfo.value.code,
+    weight: '',
+    bloodPressure: xyjInfo.value.result
+  }
+  if(dangqian_wendu.value>30){
+    mode.temperature=dangqian_wendu.value
+  }
+  fasongNum.value++
+  ipcRenderer.invoke('logger', `患者结果上传,第${fasongNum.value}次`)
+  ipcRenderer.invoke('logger', '参数:'+JSON.stringify(mode))
+  updatePatient(mode).then(re=>{
+    ElMessage.success('结果发送成功')
+    ipcRenderer.invoke('logger', '结果上传成功')
+    // 倒计时结果显示
+    clockNum.value = Number(configData.value.timeJg/1000)
+    return false
+  }).catch(re=>{
+    ElMessage('结果发送失败')
+    console.log('结果发送失败')
+    ipcRenderer.invoke('logger', `结果发送失败:第${fasongNum.value}次,3秒后重新发送`)
+    if(fasongNum.value<3){
+      setTimeout(sundModeXyj,5000);
+    }
+    else{
+      ipcRenderer.invoke('logger', '3次结果上传都失败放弃本次请求')
+      return false
+    }
+  })
+}
+//读卡器变化
+watch(
+  () => dkqInfo.value.resultTime,
+  () => {
+    dialogVisible.value = 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)
+    }
+  }
+);
+// 患者code 发生变化 从人脸识别得来
+watch(
+  ()=>faceInfo.value.result,
+  ()=>{
+    if(faceInfo.value.result!==''){
+      console.log(`获取人脸识别code=${faceInfo.value.result},发送到服务请求患者信息`)
+      sendPationCodeApi(faceInfo.value.result)
+    }
+  }
+)
+watch(() => viewNumber,
+  () => {
+    clockNum.value = viewNumber.value
+  }
+);
+// 文本框点击事件
+const inputChabge = () => {
+  console.log(inputCode.value.substring(0,4)==='1553')
+  // 更具沅江肾病医院的二维码匹配
+  if(inputCode.value.substring(0,4)==='1553'){
+    const list=inputCode.value.split(':')
+    console.log(list)
+    sendPationCodeApi(list[1])
+    setTimeout(function () {
+      inputCode.value = ''
+    }, 5000)
+  }else{
+    sendPationCodeApi(inputCode.value)
+    setTimeout(function () {
+      inputCode.value = ''
+    }, 5000)
+  }
+ 
+  
+}
+// 点击10下关闭程序
+const guyanbi = () => {
+  caozuo.value++
+  if (caozuo.value > 10) {
+    ipcRenderer.send('winClose')
+  }
+}
+onMounted(() => {
+  console.log(0%5)
+  console.log('页面初始化', os.hostname())
+  setTimeout(()=>{
+    console.log('8秒后执行')
+    console.log('打印设置文件')
+    console.log(configData.value)
+    is_ce_wen.value=configData.value.Is_ce_wen
+    if(is_ce_wen.value){
+      initPort(configData.value.portPath,configData.value.baudRate)
+    }
+    // 是否开启血压计联机
+    if(configData.value.Is_xyj){
+      if(configData.value.xyj_type==='TM2655'){
+        TM2655VP(configData.value.xueyanjiPortPath,configData.value.xueyanjiBaudRate)
+      }else{
+        oumulongHbp9030(configData.value.xueyanjiPortPath,configData.value.xueyanjiBaudRate)
+      } 
+    }
+    // 是否开启志荣体重秤联机
+    if(configData.value.Is_tzc){
+      //台衡M523
+      if(configData.value.tzc_type==='taiHengM523'){
+        taiHengM523(configData.value.tzcPortPath,configData.value.tzcBaudRate)
+      }
+      // seca101读取文件
+      else if(configData.value.tzc_type==='seca101'){
+        console.log('体重是读取文件')
+      }// 耀华XK3190-A12 
+      else if(configData.value.tzc_type==='XK3190-A12'){
+        XK3190A12(configData.value.tzcPortPath,configData.value.tzcBaudRate)
+      }
+      else{
+        zhiRongT605(configData.value.tzcPortPath,configData.value.tzcBaudRate)
+      }
+    }
+    // 是否开启脸识别
+    isUseFaceRecogService.value = configData.value.isUseFaceRecogService
+    console.log('人脸识别',isUseFaceRecogService.value)
+    if (isUseFaceRecogService.value) {
+      console.log('开启人脸识别')
+      trackerTask = tracking.track("#myVideo", myTracker, { camera: true });
+      dialogVisible.value = true
+    }else{
+      console.log('关闭人脸识别')
+      dialogVisible.value = false
+    }
+    clockNum.value = patientInfoStore().viewNumber
+    setInterval(function () {
+      clockNum.value--
+      if(clockNum.value===0){
+        fuxuan()
+      }
+      
+      date.value=formatDate(new Date(),'YYYY-mm-dd HH:MM')
+      if(Number(date.value.substring(11,13))<12){
+        timeShidaun.value='上午好!'
+      }else if(Number(date.value.substring(11,13))<18){
+        timeShidaun.value='下午好!'
+      }else {
+        timeShidaun.value='晚上好!'
+      }
+      // 验证人脸识别已经通过但是还没有体重数据主动获取数据
+      if(patientInfo.value.name!==''&&weightInfo.value.result==='0'&&configData.value.Is_tzc){
+        console.log('主动获取体重')
+        todatatzs(patientInfo.value.datetime)
+      }
+      inputRef.value.focus();
+
+    }, 1000)
+    speech.value = new Speech();
+    speech.value?.setLanguage('zh-CN')
+    speech.value?.init().then(() => {
+      console.log('语音初始化成功')
+    })
+  },8000)
+})
+
+
 </script>
-<template>
-    <div class="pagehome">
-         <!-- 提醒刷卡 -->
-        <audio src="https://dhcdn.leon056.com/hemo/autoselfsign/step1.mp3" ref="AudioRef0" id="eventAudio2"></audio>
-        <!-- 患者信息读取成功 -->
-        <audio src="https://dhcdn.leon056.com/hemo/autoselfsign/step2.mp3" ref="AudioRef" id="eventAudio2"></audio>
-        <!-- 体重结果回传成功 -->
-        <audio src="https://dhcdn.leon056.com/hemo/autoselfsign/step3.mp3" ref="AudioRef2" id="eventAudio3"></audio>
-        <!-- 血压结果回传成功 -->
-        <audio src="https://dhcdn.leon056.com/hemo/autoselfsign/step4.mp3" ref="AudioRef3" id="eventAudio4"></audio>
-        <!-- 没有找到患者 -->
-        <audio src="https://dhcdn.leon056.com/hemo/autoselfsign/step5.mp3" ref="AudioRef4" id="eventAudio5"></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 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">
-                {{ gao_ya }}/{{ di_ya }}
-              </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">
-                机号:
-                </div>
-              </el-col>
-              <el-col :span="12">
-                <div class="textclass">
-                  {{patientInfo.deviceCode}}
-                </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  scoped>
-body{
-  background: #F3F6FE;
-  padding: 0;
-
-}
-.inpu{
-  margin-top: 20px;
-}
-.header{
-  height: 40px;
-  background: #FFFFFF;
-  box-shadow: 1px 3px 5px 0px #E9E9E9;
-  margin-bottom: 10px;
-}
-.inputcla{
-  padding-top: 5px;
-  text-align: right;
-  font-size: 27px;
-  font-family: PingFangSC-Medium, PingFang SC;
-  font-weight: 500;
-  color: #FF7472;
-
-}
-.titleText{
-  text-align: center;
-  color: red;
-  font-size: 2rem;
-  height: 40px;
-  line-height: 40px;
-  
-}
-
-.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;
-}
-.rowdiv{
-  /* background: #769AFF; */
-  font-size: 300%;
-  height: 15%;
-  margin-top: 5%;
-}
-.titleHand{
-  /* background: #769AFF; */
-  height: 15%;
-}
-.tilaft{
-  text-align: left;
-  font-size: 300%;
-  font-family: AlibabaPuHuiTi-Regular, AlibabaPuHuiTi;
-  font-weight: 400;
-  color: #333333;
-  line-height: 42px;
-  letter-spacing: 1px;
-}
-.tiregth{
-  text-align: right;
-  padding-left: 5px;
-}
-.divbody{
-  height: 70%;
-  width: 100%;
-  display:table;
-}
-.bodeText{
-  display:table-cell; 
-  vertical-align:middle;
-  width: 100%;
-  text-align: center;
-  font-size: 800%;
-  font-family: DINAlternate-Bold, DINAlternate;
-  font-weight: bold;
-  color: #769AFF;
-  /* line-height: 100%; */
-}
-.imgclass{
-  /* background: red; */
+<style src="./index.css" />
+<style lang="less" scoped>
+.wrapp {
   height: 100%;
-  /* padding-top: 5%; */
-  /* padding-top: ; */
+  background-size: 100% 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  border-radius: 2px;
+  .rWrapp {
+    width: 500px;
+    height: 500px;
+    margin: auto;
+    // margin-top: 30px;
+    position: relative;
+    .myCanvas {
+      position: absolute;
+      top: 0;
+      left: 0;
+      border-radius: 50%;
+      width: 100%;
+      height: 100%;
+    }
+    #myVideo {
+      width: 100%;
+      height: 100%;
+      border-radius: 50%;
+      object-fit: cover;
+    }
+  }
+  .status {
+    //margin-top: 100px;
+    text-align: center;
+  }
+  .img_bg_camera{
+    position: absolute;
+    top: -500px;
+    
+    z-index: -999;
+  }
 }
-.userinfo{
-  padding-top: 6%;
-  /* background: #769AFF; */
-  font-size: 300%;
+.footer{
+  height: 100px;
+  width: 100%;
+  line-height: 100px;
+  font-size: 2rem;
+  color: beige;
+  // background-color: #922d2d;
+  position: fixed;
+  bottom: 20px;
   text-align: right;
 }
-.lableclass{
-  text-align: right;
-  font-weight: 400;
-  color: #777777;
-  /* background: #769AFF; */
-
+.toupu{
+  height: 100px;
+  width: 100%;
+  line-height: 100px;
+  font-size: 2rem;
+  color: beige;
+  // background-color: #ddd;
+  position: fixed;
+  top: 10px;
 }
-.textclass{
-  text-align: left;
-  font-family: AlibabaPuHuiTi-Medium, AlibabaPuHuiTi;
-  font-weight: 500;
-  color: #769AFF;
-  
+.fanhuikey{
+  text-align: center;
+  background: rgba(101,170,246,0.7);
+  height: 100px;
+  line-height: 100px;
+  width: 100px;
+  line-height: 100px;
+  font-size: 2rem;
+  color: beige;
+  border-radius: 50px 0px 0px 50px;
+  position: fixed;
+  right: 0;
 }
-
-
-
+  :v-deep .el-input__inner {background-color: transparent !important;}
 </style>
+

--
Gitblit v1.8.0