From e284a9ad0fb86e304105724a5b789de4f9ec8527 Mon Sep 17 00:00:00 2001
From: sige <sige@sige.com>
Date: Tue, 21 May 2024 21:47:48 +0800
Subject: [PATCH] =?UTF-8?q?=E8=BE=93=E5=85=A5=E6=A1=86=E6=BF=80=E6=B4=BB?=
 =?UTF-8?q?=E6=97=B6=E5=85=A8=E9=80=89=E5=86=85=E5=AE=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env                                         |   4 +-
 publish.ps1                                  |  10 +--
 src/components/AddPreSetting.vue             |  86 +++++++------------
 src/components/LiquidHandle.vue              |  12 +--
 src/components/MyInput.vue                   |  89 +++++++++++++++++++
 src/components/Setting/components/Device.vue | 122 +++++++++------------------
 src/components/Test.vue                      |  11 +--
 src/components/UpdatePreSetting.vue          |  86 +++++++------------
 src/main.js                                  |   2 +
 9 files changed, 204 insertions(+), 218 deletions(-)
 create mode 100644 src/components/MyInput.vue

diff --git a/.env b/.env
index 5bd684a..53e7bd7 100644
--- a/.env
+++ b/.env
@@ -1,2 +1,2 @@
-VITE_BASE_WS1_URL=ws://192.168.8.10:19001/
-VITE_BASE_WS2_URL=ws://192.168.8.10:19002/
\ No newline at end of file
+VITE_BASE_WS1_URL=ws://192.168.8.12:19001/
+VITE_BASE_WS2_URL=ws://192.168.8.12:19002/
\ No newline at end of file
diff --git a/publish.ps1 b/publish.ps1
index 22fd9c8..3dde00a 100644
--- a/publish.ps1
+++ b/publish.ps1
@@ -6,15 +6,15 @@ Rename-Item -Path ./dist -NewName $now
 # compress dist to app.zip
 Compress-Archive -Path ./$now -DestinationPath ./app.zip -Force
 # upload app.zip to server
-scp app.zip root@192.168.8.10:/frontend/
+scp app.zip root@192.168.8.12:/frontend/
 # unzip app.zip
-ssh root:zwsd@192.168.8.10 "cd /frontend && unzip app.zip"
+ssh root:zwsd@192.168.8.12 "cd /frontend && unzip app.zip"
 # remove old link
-ssh root:zwsd@192.168.8.10 "cd /frontend && rm -f dist"
+ssh root:zwsd@192.168.8.12 "cd /frontend && rm -f dist"
 # create link
-ssh root:zwsd@192.168.8.10 "cd /frontend && ln -s /frontend/$now /frontend/dist"
+ssh root:zwsd@192.168.8.12 "cd /frontend && ln -s /frontend/$now /frontend/dist"
 # remove app.zip
-ssh root:zwsd@192.168.8.10 "cd /frontend && rm -f app.zip"
+ssh root:zwsd@192.168.8.12 "cd /frontend && rm -f app.zip"
 Remove-Item -Path ./app.zip
 # remove folder
 Remove-Item -Path ./$now -Recurse
diff --git a/src/components/AddPreSetting.vue b/src/components/AddPreSetting.vue
index db56ca5..e5ef66d 100644
--- a/src/components/AddPreSetting.vue
+++ b/src/components/AddPreSetting.vue
@@ -3,99 +3,71 @@
     <div class="row_wrap">
       <p class="title">注射蠕动泵速率(g/min)</p>
       <p class="num">
-        <van-field
-          class="field_font"
-          type="number"
-          v-model="sprayLiquidConfigVal"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="sprayLiquidConfigVal"
           :formatter="formatter7"
-          readonly
-          @click.stop="hideClickKey(2)"
-        />
+          @done="setSprayLiquidVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒停止过氧化氢浓度(ppm)</p>
       <p class="num">
-        <van-field
-          type="number"
-          class="field_font"
-          v-model="stoped_gs"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="stoped_gs"
           :formatter="formatter1"
-          readonly
-          @click.stop="hideClickKey(3)"
-        />
+          @done="setStopedGsVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒继续过氧化氢浓度(ppm)</p>
       <p class="num">
-        <van-field
-          class="field_font"
-          type="number"
-          v-model="continued_gs"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="continued_gs"
           :formatter="formatter2"
-          readonly
-          @click.stop="hideClickKey(4)"
-        />
+          @done="setcontinuedGsVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒停止相对湿度(%RH)</p>
       <p class="num">
-        <van-field
-          class="field_font"
-          type="number"
-          v-model="stoped_humi"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="stoped_humi"
           :formatter="formatter9"
-          readonly
-          @click.stop="hideClickKey(9)"
-        />
+          @done="setstoped_humiVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒继续相对湿度(%RH)</p>
       <p class="num">
-        <van-field
-          class="field_font"
-          type="number"
-          v-model="continued_humi"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="continued_humi"
           :formatter="formatter10"
-          readonly
-          @click.stop="hideClickKey(10)"
-        />
+          @done="setcontinued_humiVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒停止过氧化氢相对饱和度(%RS)</p>
       <p class="num">
-        <van-field
-          class="field_font"
-          type="number"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="stoped_satur"
           :formatter="formatter3"
-          v-model="stoped_satur"
-          :clickable="true"
-          readonly
-          @click.stop="hideClickKey(5)"
-        />
+          @done="setstopedSaturVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒继续过氧化氢相对饱和度(%RS)</p>
       <p class="num">
-        <van-field
-          type="number"
-          class="field_font"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="continued_satur"
           :formatter="formatter4"
-          v-model="continued_satur"
-          :clickable="true"
-          readonly
-          @click.stop="hideClickKey(6)"
-        />
+          @done="setContinuedSaturVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap" @click="showLogPicker">
@@ -813,7 +785,7 @@ onMounted(() => {
         align-items: center;
         justify-content: center;
       }
-      .field_font {
+      :deep(.field_font) {
         font-size: 26px;
         width: 180px;
       }
diff --git a/src/components/LiquidHandle.vue b/src/components/LiquidHandle.vue
index 6c9516e..21c992a 100644
--- a/src/components/LiquidHandle.vue
+++ b/src/components/LiquidHandle.vue
@@ -76,14 +76,10 @@
     </div>
     <div class="right_container">
       <div class="add_liquid_wrap" v-if="tabType == 1">
-        <van-field
-          type="number"
-          v-model="addLiquidVal"
-          readonly
+        <my-input type="number" class="add_liquid_input"
+          v-model:value="addLiquidVal"
           :formatter="formatter"
-          @click.stop="handleClickInput"
-          class="add_liquid_input"
-        />
+        ></my-input>
       </div>
       <div class="push_liquid_wrap" v-if="tabType == 2">
         <p class="num">
@@ -345,7 +341,7 @@ const handleClickInput = () => {
     .mb {
       margin-bottom: 18px;
     }
-    .add_liquid_wrap {
+    :deep(.add_liquid_wrap) {
       position: relative;
       width: 340px;
       height: 221px;
diff --git a/src/components/MyInput.vue b/src/components/MyInput.vue
new file mode 100644
index 0000000..c018056
--- /dev/null
+++ b/src/components/MyInput.vue
@@ -0,0 +1,89 @@
+<template>
+  <van-field
+    ref="input"
+    v-model="value"
+    readonly
+    :formatter="props.formatter"
+    :class="props.class"
+    :type="props.type"
+    @click.stop="actionInputClick"
+  ></van-field>
+
+  <template v-if="keyboardVisible">
+    <van-number-keyboard v-if="'number' === props.type" 
+      v-model="value" 
+      :show="true" 
+      :title="value"
+      :theme="props.theme"
+      :close-button-text="props.closeText"
+      @input="actionKeyBoardInput" 
+      @blur="actionKeyBoardBlur"
+      @close="actionKeyBoardClose"
+    ></van-number-keyboard>
+  </template>
+</template>
+<script setup>
+import { nextTick, ref, watch } from 'vue';
+/** @var {Function} */
+const emits = defineEmits(['update:value','done']);
+/** @var {Object} */
+const props = defineProps({
+    // 格式化函数
+    formatter : { type: Function, default: value => value},
+    // 类名
+    class : { type: String, default: ''},
+    // 类型
+    type : { type: String, default: 'text'},
+    // 取值
+    value : { type: String, default: ''},
+    // 主题
+    theme : { type: String, default: ''},
+    // 关闭按钮文本
+    closeText : { type: String, default: ''},
+});
+/** @var {String} */
+const value = ref(props.value);
+/** @var {Boolean} */
+const keyboardVisible = ref(false);
+/** @var {Boolean} */
+const isFirstClick = ref(true);
+/** @var {Component} */
+const input = ref(null);
+/** @var {String} */
+let originValue = null;
+// 监听外部值变化
+watch(() => props.value, (val) => value.value = val);
+
+// 输入框点击
+async function actionInputClick() {
+    originValue = props.value;
+    isFirstClick.value = true;
+    keyboardVisible.value = true;
+    await nextTick();
+    input.value.$el.querySelector('input').select();
+    input.value.$el.querySelector('input').focus();
+}
+
+// 键盘输入
+function actionKeyBoardInput(val) {
+    if (isFirstClick.value) {
+        setTimeout(() => value.value = val + '');
+        isFirstClick.value = false
+    }
+}
+
+// 键盘失焦
+function actionKeyBoardBlur() {
+    actionKeyBoardClose();
+}
+
+// 键盘关闭
+function actionKeyBoardClose() {
+    keyboardVisible.value = false;
+    window.getSelection().removeAllRanges();
+    emits('update:value', value.value);
+    if (`${originValue}` !== value.value) {
+        emits('done');
+    }
+}
+</script>
\ No newline at end of file
diff --git a/src/components/Setting/components/Device.vue b/src/components/Setting/components/Device.vue
index b5d2027..c98d180 100644
--- a/src/components/Setting/components/Device.vue
+++ b/src/components/Setting/components/Device.vue
@@ -10,141 +10,101 @@
     <div class="row_wrap">
       <p class="title">注射蠕动泵速率(g/min)</p>
       <p class="num">
-        <van-field
-          type="number"
-          class="field_font"
-          v-model="sprayLiquidConfigVal"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="sprayLiquidConfigVal"
           :formatter="formatter7"
-          readonly
-          @click.stop="hideClickKey(2)"
-        />
+          @done="setSprayLiquidVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒停止过氧化氢浓度(ppm)</p>
       <p class="num">
-        <van-field
-          type="number"
-          class="field_font"
-          v-model="stoped_gs"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="stoped_gs"
           :formatter="formatter1"
-          readonly
-          @click.stop="hideClickKey(3)"
-        />
+          @done="setStopedGsVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒继续过氧化氢浓度(ppm)</p>
       <p class="num">
-        <van-field
-          type="number"
-          class="field_font"
-          v-model="continued_gs"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="continued_gs"
           :formatter="formatter2"
-          readonly
-          @click.stop="hideClickKey(4)"
-        />
+          @done="setcontinuedGsVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒停止相对湿度(%RH)</p>
       <p class="num">
-        <van-field
-          class="field_font"
-          type="number"
-          v-model="stoped_humi"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="stoped_humi"
           :formatter="formatter9"
-          readonly
-          @click.stop="hideClickKey(9)"
-        />
+          @done="setstoped_humiVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒继续相对湿度(%RH)</p>
       <p class="num">
-        <van-field
-          class="field_font"
-          type="number"
-          v-model="continued_humi"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="continued_humi"
           :formatter="formatter10"
-          readonly
-          @click.stop="hideClickKey(10)"
-        />
+          @done="setcontinued_humiVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒停止过氧化氢相对饱和度(%RS)</p>
       <p class="num">
-        <van-field
-          class="field_font"
-          type="number"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="stoped_satur"
           :formatter="formatter3"
-          v-model="stoped_satur"
-          :clickable="true"
-          readonly
-          @click.stop="hideClickKey(5)"
-        />
+          @done="setstopedSaturVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒继续过氧化氢相对饱和度(%RS)</p>
       <p class="num">
-        <van-field
-          class="field_font"
-          type="number"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="continued_satur"
           :formatter="formatter4"
-          v-model="continued_satur"
-          :clickable="true"
-          readonly
-          @click.stop="hideClickKey(6)"
-        />
+          @done="setContinuedSaturVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">正负压默认开合比例</p>
       <p class="num">
-        <van-field
-          class="field_font"
-          type="number"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="proportionalValveDefaultValue"
           :formatter="formatter11"
-          v-model="proportionalValveDefaultValue"
-          :clickable="true"
-          readonly
-          @click.stop="hideClickKey(11)"
-        />
+          @done="setProportionalValveDefaultValue"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap" v-if="[0, 5].includes(operatorStore.disinfectStatus)">
       <p class="title">允许消毒最大湿度(%RH)</p>
       <p class="num">
-        <van-field
-          class="field_font"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="max_humidity"
           :formatter="formatter5"
-          type="number"
-          v-model="max_humidity"
-          :clickable="true"
-          readonly
-          @click.stop="hideClickKey(7)"
-        />
+          @done="setMaxHumidityVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap" v-if="[0, 5].includes(operatorStore.disinfectStatus)">
       <p class="title">预热时间(s)</p>
       <p class="num">
-        <van-field
-          class="field_font"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="pre_heat_time_s"
           :formatter="formatter8"
-          type="number"
-          v-model="pre_heat_time_s"
-          :clickable="true"
-          readonly
-          @click.stop="hideClickKey(8)"
-        />
+          @done="setHeat_timeVal"
+        ></my-input>
       </p>
     </div>
     <van-number-keyboard
@@ -886,7 +846,7 @@ const setSprayLiquidVal = () => {
       color: #000000;
       display: flex;
       align-items: center;
-      .field_font {
+      :deep(.field_font) {
         font-size: 26px;
         width: 180px;
       }
diff --git a/src/components/Test.vue b/src/components/Test.vue
index 819f425..ea8a319 100644
--- a/src/components/Test.vue
+++ b/src/components/Test.vue
@@ -62,14 +62,9 @@
     <div class="common_set switch_wrap">
       <p class="title">注射蠕动泵</p>
       <div class="num">
-        <van-field
-          type="number"
+        <my-input type="number" class="add_liquid_input" theme="custom" close-text="配置"
+          v-model:value="addLiquidVal2"
           :formatter="formatter7"
-          v-model="addLiquidVal2"
-          :clickable="true"
-          readonly
-          @click.stop="hideAllKeyboards(3)"
-          class="add_liquid_input"
         />
         <p>g/min</p>
       </div>
@@ -664,7 +659,7 @@ const changeChannel = flag => {
       display: flex;
       align-items: center;
       margin-right: 4px;
-      .add_liquid_input {
+      :deep(.add_liquid_input) {
         width: 40px;
         margin-right: 2px;
         text-align: right;
diff --git a/src/components/UpdatePreSetting.vue b/src/components/UpdatePreSetting.vue
index 1671870..26e0cfe 100644
--- a/src/components/UpdatePreSetting.vue
+++ b/src/components/UpdatePreSetting.vue
@@ -3,99 +3,71 @@
     <div class="row_wrap">
       <p class="title">消毒停止过氧化氢浓度(ppm)</p>
       <p class="num">
-        <van-field
-          class="field_font"
-          type="number"
-          v-model="stoped_gs"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="stoped_gs"
           :formatter="formatter1"
-          readonly
-          @click.stop="hideClickKey(3)"
-        />
+          @done="setStopedGsVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒继续过氧化氢浓度(ppm)</p>
       <p class="num">
-        <van-field
-          type="number"
-          class="field_font"
-          v-model="continued_gs"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="continued_gs"
           :formatter="formatter2"
-          readonly
-          @click.stop="hideClickKey(4)"
-        />
+          @done="setcontinuedGsVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒停止相对湿度(%RH)</p>
       <p class="num">
-        <van-field
-          type="number"
-          class="field_font"
-          v-model="stoped_humi"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="stoped_humi"
           :formatter="formatter9"
-          readonly
-          @click.stop="hideClickKey(9)"
-        />
+          @done="setstoped_humiVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒继续相对湿度(%RH)</p>
       <p class="num">
-        <van-field
-          type="number"
-          class="field_font"
-          v-model="continued_humi"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="continued_humi"
           :formatter="formatter10"
-          readonly
-          @click.stop="hideClickKey(10)"
-        />
+          @done="setcontinued_humiVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒停止过氧化氢相对饱和度(%RS)</p>
       <p class="num">
-        <van-field
-          type="number"
-          class="field_font"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="stoped_satur"
           :formatter="formatter3"
-          v-model="stoped_satur"
-          :clickable="true"
-          readonly
-          @click.stop="hideClickKey(5)"
-        />
+          @done="setstopedSaturVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">消毒继续过氧化氢相对饱和度(%RS)</p>
       <p class="num">
-        <van-field
-          type="number"
-          class="field_font"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="continued_satur"
           :formatter="formatter4"
-          v-model="continued_satur"
-          :clickable="true"
-          readonly
-          @click.stop="hideClickKey(6)"
-        />
+          @done="setContinuedSaturVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap">
       <p class="title">注射蠕动泵速率(g/min)</p>
       <p class="num">
-        <van-field
-          type="number"
-          class="field_font"
-          v-model="sprayLiquidConfigVal"
-          :clickable="true"
+        <my-input type="number" class="field_font" theme="custom" close-text="配置"
+          v-model:value="sprayLiquidConfigVal"
           :formatter="formatter7"
-          readonly
-          @click.stop="hideClickKey(2)"
-        />
+          @done="setSprayLiquidVal"
+        ></my-input>
       </p>
     </div>
     <div class="row_wrap" @click="showLogPicker">
@@ -874,7 +846,7 @@ onMounted(() => {
         align-items: center;
         justify-content: center;
       }
-      .field_font {
+      :deep(.field_font) {
         font-size: 26px;
         width: 180px;
       }
diff --git a/src/main.js b/src/main.js
index 014578a..2f46bcb 100644
--- a/src/main.js
+++ b/src/main.js
@@ -22,6 +22,7 @@ import '@vant/touch-emulator'
 import 'vant/lib/index.css'
 import '@/assets/css/reset.css'
 import './style.scss'
+import MyInput from 'cpns/MyInput.vue'
 
 createApp(App)
   .use(router)
@@ -40,4 +41,5 @@ createApp(App)
   .use(ElementPlus)
   .use(Toast)
   .use(store)
+  .component('my-input', MyInput)
   .mount('#app')