some state change

2 years ago · 900681a626
7 changed files with 117 additions and 57 deletions
--- a/index.html
+++ b/index.html
@ -2,7 +2,10 @@
 <html lang="en">
  <head>
    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
+    />
    <title>消毒机</title>
  </head>
  <body>
--- a/src/components/LiquidHandle.vue
+++ b/src/components/LiquidHandle.vue
@ -42,26 +42,52 @@
        开始排液
      </div>
    </div>
-    <!-- <div class="add_liquid">
+    <div
+      class="add_liquid"
+      v-if="operatorStore.replenishingFluidsWorkState == 1 && tabType == 1"
+    >
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        xmlns:xlink="http://www.w3.org/1999/xlink"
+        fill="none"
+        version="1.1"
+        width="29.999204635620117"
+        height="29.999876022338867"
+        viewBox="0 0 29.999204635620117 29.999876022338867"
+      >
+        <g>
+          <path
+            d="M14.9997,0C6.7157,0,0,6.71555,0,14.9997C0,23.2839,6.7157,29.9999,14.9997,29.9999C19.1418,29.9999,22.8916,28.3208,25.606,25.6063C28.3204,22.8918,29.9992,19.1417,29.9992,14.9997C29.9992,6.7157,23.2838,0,14.9997,0ZM11.0395,23.4572L11.0395,6.54144L23.6346,14.9997L11.0395,23.4573L11.0395,23.4572Z"
+            fill="#FF9A2D"
+            fill-opacity="1"
+          />
+        </g>
+      </svg>
+      <p class="text">正在加液...</p>
+    </div>
+    <div
+      class="add_liquid"
+      v-if="operatorStore.drainingWorkState == 1 && tabType == 2"
+    >
      <svg
        xmlns="http://www.w3.org/2000/svg"
        xmlns:xlink="http://www.w3.org/1999/xlink"
        fill="none"
        version="1.1"
-        width="30"
-        height="30"
-        viewBox="0 0 30 30"
+        width="29.999204635620117"
+        height="29.999876022338867"
+        viewBox="0 0 29.999204635620117 29.999876022338867"
      >
        <g>
          <path
-            d="M15.0171,0Q18.13,0,20.8495,1.1748Q23.569,2.3496,25.6043,4.39274Q27.6397,6.43587,28.8198,9.16005Q30,11.8842,30,14.983Q30,18.0817,28.8198,20.8229Q27.6397,23.5641,25.6043,25.6073Q23.569,27.6504,20.8495,28.8252Q18.13,30,15.0171,30Q11.9042,30,9.16762,28.8252Q6.43101,27.6504,4.39567,25.6073Q2.36032,23.5641,1.18016,20.8229Q-0.00000305839,18.0817,0,14.983Q0.00000305839,11.8842,1.18016,9.16004Q2.36032,6.43587,4.39567,4.39274Q6.43102,2.3496,9.16762,1.1748Q11.9042,-5.07417e-7,15.0171,0ZM24.4242,12.1226Q25.0399,11.5096,25.0741,10.6073Q25.1083,9.70488,24.4926,9.09194Q23.8769,8.479,22.9875,8.49603Q22.0981,8.51305,21.4823,9.12599L11.8358,18.7287L8.51767,15.4597Q7.90194,14.8468,7.01254,14.8297Q6.12315,14.8127,5.50741,15.4257Q4.89168,16.0386,4.87457,16.8729Q4.85747,17.7072,5.4732,18.3201L10.2281,23.0874Q10.8438,23.7003,11.8358,23.6833Q12.8278,23.6663,13.4436,23.0533L13.3067,23.1896L24.4242,12.1226Z"
-            fill="#81FC50"
+            d="M14.9997,0C6.7157,0,0,6.71555,0,14.9997C0,23.2839,6.7157,29.9999,14.9997,29.9999C19.1418,29.9999,22.8916,28.3208,25.606,25.6063C28.3204,22.8918,29.9992,19.1417,29.9992,14.9997C29.9992,6.7157,23.2838,0,14.9997,0ZM11.0395,23.4572L11.0395,6.54144L23.6346,14.9997L11.0395,23.4573L11.0395,23.4572Z"
+            fill="#FF9A2D"
            fill-opacity="1"
          />
        </g>
      </svg>
-      <p class="text">{{ tabType == 1 ? '加液完成' : '排液完成' }}</p>
-    </div> -->
+      <p class="text">正在排液...</p>
+    </div>
    <div class="chart">
      <div
        class="liquid_column"
@ -87,7 +113,7 @@

 <script setup>
 import LiquidModal from './dialogs/LiquidModal.vue'
-import { useDeviceStore, useWebSocketStore } from '@/store'
+import { useDeviceStore, useWebSocketStore, useOperatorStore } from '@/store'
 import { ref } from 'vue'
 import { storeToRefs } from 'pinia'
 import {
@ -97,6 +123,7 @@ import {
 } from '@/mock/command'

 const numberKeyboardShow = ref(false)
+const operatorStore = useOperatorStore()

 const props = defineProps({
  tabType: {
@ -247,7 +274,7 @@ const { disinfectantCapacity } = storeToRefs(deviceStore)
      font-weight: normal;
      line-height: normal;
      letter-spacing: 0.06em;
-      color: #81fc50;
+      color: #ff9a2d;
    }
  }
  .chart {
--- a/src/components/Operator.vue
+++ b/src/components/Operator.vue
@ -49,7 +49,7 @@
        开始消毒
      </div>
      <div class="progress">
-        <p class="title">剩余时间</p>
+        <p class="title">预计剩余时间</p>
        <!-- <div class="tube">
          <div
            class="pro"
@ -62,8 +62,8 @@
        <div class="time">
          {{
            operatorStore.estimatedRemainingTimeS == 0
-              ? `${operatorStore.estimatedRemainingTimeS} S`
-              : '已结束'
+              ? '已结束'
+              : `${operatorStore.estimatedRemainingTimeS} S`
          }}
        </div>
      </div>
--- a/src/pages/Home.vue
+++ b/src/pages/Home.vue
@ -144,7 +144,6 @@
    <div class="other_info">
      <p>IP {{ settingStore.deviceIp }}</p>
      <p class="time">{{ nowTime }}</p>
-    </div>
      <div class="log_out_btn" @click="handleLogout">
        <svg
          xmlns="http://www.w3.org/2000/svg"
@ -174,6 +173,8 @@
          </g>
        </svg>
      </div>
+    </div>
+
    <!-- <van-overlay :show="settingStore.initLoading">
      <div class="wrapper" @click.stop>
        <div class="block">
@ -347,23 +348,24 @@ const handleLogout = () => {
    letter-spacing: 0.06em;
    color: #ffffff;
    padding: 0 30px;
-    .time {
-      width: 156px;
-      white-space: nowrap;
-    }
-  }
+    position: relative;
    .log_out_btn {
      width: 123px;
      height: 45px;
      border-radius: 23px;
-    opacity: 1;
      display: flex;
      align-items: center;
      justify-content: center;
      background: #064b81;
-    right: 248px;
-    bottom: 22px;
+      right: 276px;
+      top: -17px;
      position: absolute;
+      z-index: 1;
+    }
+    .time {
+      width: 156px;
+      white-space: nowrap;
+    }
  }
 }
 .wrapper {
--- a/src/store/modules/operator.js
+++ b/src/store/modules/operator.js
@ -8,10 +8,18 @@ export const useOperatorStore = defineStore({
      disinfectStatus: false,
      estimatedRemainingTimeS: 0,
      disinfection_id: '',
+      drainingWorkState: 0,
+      replenishingFluidsWorkState: 0,
    }
  },
  // actions
  actions: {
+    updateDrainingWorkState(drainingWorkState) {
+      this.drainingWorkState = drainingWorkState
+    },
+    updateReplenishingFluidsWorkState(replenishingFluidsWorkState) {
+      this.replenishingFluidsWorkState = replenishingFluidsWorkState
+    },
    updateDisinfectionId(disinfection_id) {
      this.disinfection_id = disinfection_id
    },
--- a/src/store/modules/websocket.js
+++ b/src/store/modules/websocket.js
@ -41,12 +41,14 @@ export const useWebSocketStore = defineStore({
            // 初始化完毕
            const { state } = JSON.parse(ev.data)
            const {
-              workState,
+              disinfectionWorkState,
              estimatedRemainingTimeS,
              disinfection_id,
              isLogin,
              permissionLevel,
              sensor_data,
+              drainingWorkState,
+              replenishingFluidsWorkState,
            } = state || {}
            if (!isLogin) {
              window.location.href = 'http://127.0.0.1/#/login'
@ -71,7 +73,10 @@ export const useWebSocketStore = defineStore({
              waterImmersionSensor1,
              waterImmersionSensor2,
            } = sensor_data
-
+            operatorStore.updateDrainingWorkState(drainingWorkState)
+            operatorStore.updateReplenishingFluidsWorkState(
+              replenishingFluidsWorkState,
+            )
            testStore.updateWaterImmersionSensor1(
              waterImmersionSensor1 == 0 ? false : true,
            )
@ -98,7 +103,9 @@ export const useWebSocketStore = defineStore({

            userStore.updatePermission(permissionLevel)
            settingStore.updateInitLoading()
-            operatorStore.updateDisinfectStatus(workState == 0 ? false : true)
+            operatorStore.updateDisinfectStatus(
+              disinfectionWorkState == 0 ? false : true,
+            )
            operatorStore.updateEstimatedRemainingTimeS(estimatedRemainingTimeS)
            operatorStore.updateDisinfectionId(disinfection_id)
            // 将sensor_data中的数据更新到store中
--- a/src/style.scss
+++ b/src/style.scss
@ -10,9 +10,22 @@ body {
  user-select: none; /* Standard */
 }

+body {
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
 .van-cell {
  .van-field__control {
    text-align: center;
  }
  background: none;
 }
+
+.key_wrap {
+  z-index: 999;
+}