chenjinliang
/
transmit_draw_bar_disinfection_front_end
forked from maochaoying/transmit_draw_bar_disinfection_front_end
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

输入框被激活时全选输入框内容

master
sige 1 year ago
parent
7e472169bd
commit
55fb16250f
6 changed files with 194 additions and 454 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 156
      src/components/AddPreSetting.vue
  2. 89
      src/components/MyInput.vue
  3. 232
      src/components/Setting/components/Device.vue
  4. 13
      src/components/Test.vue
  5. 156
      src/components/UpdatePreSetting.vue
  6. 2
      src/main.js

156
src/components/AddPreSetting.vue
View File

@ -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">
@ -128,56 +100,6 @@
@blur="addLiquidConfigValShow = false"
/>
<van-number-keyboard
v-model="sprayLiquidConfigVal"
@input="val => handleInput(val, 2)"
:title="sprayLiquidConfigVal"
:show="sprayLiquidConfigValShow"
theme="custom"
@close="setSprayLiquidVal"
close-button-text="配置"
@blur="sprayLiquidConfigValShow = false"
/>
<van-number-keyboard
v-model="stoped_gs"
@input="val => handleInput(val, 3)"
:title="stoped_gs"
:show="stoped_gsShow"
theme="custom"
@close="setStopedGsVal"
close-button-text="配置"
@blur="stoped_gsShow = false"
/>
<van-number-keyboard
v-model="continued_gs"
@input="val => handleInput(val, 4)"
:title="continued_gs"
@close="setcontinuedGsVal"
:show="continued_gsShow"
theme="custom"
close-button-text="配置"
@blur="continued_gsShow = false"
/>
<van-number-keyboard
v-model="stoped_satur"
@input="val => handleInput(val, 5)"
:title="stoped_satur"
@close="setstopedSaturVal"
:show="stoped_saturShow"
theme="custom"
close-button-text="配置"
@blur="stoped_saturShow = false"
/>
<van-number-keyboard
v-model="continued_satur"
@input="val => handleInput(val, 6)"
:title="continued_satur"
@close="setContinuedSaturVal"
:show="continued_saturShow"
theme="custom"
close-button-text="配置"
@blur="continued_saturShow = false"
/>
<van-number-keyboard
v-model="max_humidity"
@input="val => handleInput(val, 7)"
:title="max_humidity"
@ -197,26 +119,6 @@
:show="pre_heat_time_sShow"
@blur="pre_heat_time_sShow = false"
/>
<van-number-keyboard
@input="val => handleInput(val, 9)"
theme="custom"
close-button-text="配置"
@close="setstoped_humiVal"
v-model="stoped_humi"
:title="stoped_humi"
:show="stoped_humiShow"
@blur="stoped_humiShow = false"
/>
<van-number-keyboard
theme="custom"
@input="val => handleInput(val, 10)"
close-button-text="配置"
@close="setcontinued_humiVal"
v-model="continued_humi"
:title="continued_humi"
:show="continued_humiShow"
@blur="continued_humiShow = false"
/>
<LogPicker
v-if="logVisible"
:hiddenLogVisible="hiddenLogVisible"
@ -813,7 +715,7 @@ onMounted(() => {
align-items: center;
justify-content: center;
}
.field_font {
:deep(.field_font) {
font-size: 26px;
width: 180px;
}

89
src/components/MyInput.vue
View File

@ -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>

232
src/components/Setting/components/Device.vue
View File

@ -10,253 +10,103 @@
<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
v-model="addLiquidConfigVal"
:title="addLiquidConfigVal"
:show="addLiquidConfigValShow"
@input="val => handleInput(val, 1)"
theme="custom"
close-button-text="配置"
@close="setAddliquidVal"
@blur="addLiquidConfigValShow = false"
/>
<van-number-keyboard
v-model="sprayLiquidConfigVal"
@input="val => handleInput(val, 2)"
:title="sprayLiquidConfigVal"
:show="sprayLiquidConfigValShow"
theme="custom"
@close="setSprayLiquidVal"
close-button-text="配置"
@blur="sprayLiquidConfigValShow = false"
/>
<van-number-keyboard
v-model="stoped_gs"
@input="val => handleInput(val, 3)"
:title="stoped_gs"
:show="stoped_gsShow"
theme="custom"
@close="setStopedGsVal"
close-button-text="配置"
@blur="stoped_gsShow = false"
/>
<van-number-keyboard
v-model="continued_gs"
@input="val => handleInput(val, 4)"
:title="continued_gs"
@close="setcontinuedGsVal"
:show="continued_gsShow"
theme="custom"
close-button-text="配置"
@blur="continued_gsShow = false"
/>
<van-number-keyboard
v-model="stoped_satur"
@input="val => handleInput(val, 5)"
:title="stoped_satur"
@close="setstopedSaturVal"
:show="stoped_saturShow"
theme="custom"
close-button-text="配置"
@blur="stoped_saturShow = false"
/>
<van-number-keyboard
v-model="continued_satur"
@input="val => handleInput(val, 6)"
:title="continued_satur"
@close="setContinuedSaturVal"
:show="continued_saturShow"
theme="custom"
close-button-text="配置"
@blur="continued_saturShow = false"
/>
<van-number-keyboard
v-model="max_humidity"
@input="val => handleInput(val, 7)"
:title="max_humidity"
@close="setMaxHumidityVal"
:show="max_humidityShow"
theme="custom"
close-button-text="配置"
@blur="max_humidityShow = false"
/>
<van-number-keyboard
theme="custom"
close-button-text="配置"
@input="val => handleInput(val, 8)"
@close="setHeat_timeVal"
v-model="pre_heat_time_s"
:title="pre_heat_time_s"
:show="pre_heat_time_sShow"
@blur="pre_heat_time_sShow = false"
/>
<van-number-keyboard
@input="val => handleInput(val, 9)"
theme="custom"
close-button-text="配置"
@close="setstoped_humiVal"
v-model="stoped_humi"
:title="stoped_humi"
:show="stoped_humiShow"
@blur="stoped_humiShow = false"
/>
<van-number-keyboard
theme="custom"
@input="val => handleInput(val, 10)"
close-button-text="配置"
@close="setcontinued_humiVal"
v-model="continued_humi"
:title="continued_humi"
:show="continued_humiShow"
@blur="continued_humiShow = false"
/>
<van-number-keyboard
theme="custom"
@input="val => handleInput(val, 11)"
close-button-text="配置"
@close="setProportionalValveDefaultValue"
v-model="proportionalValveDefaultValue"
:title="proportionalValveDefaultValue"
:show="proportionalValveDefaultValueShow"
@blur="proportionalValveDefaultValueShow = false"
/>
</div>
</template>
@ -886,7 +736,7 @@ const setSprayLiquidVal = () => {
color: #000000;
display: flex;
align-items: center;
.field_font {
:deep(.field_font) {
font-size: 26px;
width: 180px;
}

13
src/components/Test.vue
View File

@ -4,14 +4,9 @@
<div class="common_set switch_wrap">
<p class="title">喷液泵</p>
<div class="num">
<van-field
type="number"
v-model="sprayLiquidPumpGPMValue"
:clickable="true"
readonly
@click.stop="hideAllKeyboards(3)"
class="add_liquid_input"
/>
<my-input type="number" class="add_liquid_input"
v-model:value="sprayLiquidPumpGPMValue"
></my-input>
<p>g/min</p>
</div>
<div class="btn_wrap">
@ -485,7 +480,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;

156
src/components/UpdatePreSetting.vue
View File

@ -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">
@ -128,56 +100,6 @@
@blur="addLiquidConfigValShow = false"
/>
<van-number-keyboard
v-model="sprayLiquidConfigVal"
@input="val => handleInput(val, 2)"
:title="sprayLiquidConfigVal"
:show="sprayLiquidConfigValShow"
theme="custom"
@close="setSprayLiquidVal"
close-button-text="确定"
@blur="sprayLiquidConfigValShow = false"
/>
<van-number-keyboard
v-model="stoped_gs"
@input="val => handleInput(val, 3)"
:title="stoped_gs"
:show="stoped_gsShow"
theme="custom"
@close="setStopedGsVal"
close-button-text="确定"
@blur="stoped_gsShow = false"
/>
<van-number-keyboard
v-model="continued_gs"
@input="val => handleInput(val, 4)"
:title="continued_gs"
@close="setcontinuedGsVal"
:show="continued_gsShow"
theme="custom"
close-button-text="确定"
@blur="continued_gsShow = false"
/>
<van-number-keyboard
v-model="stoped_satur"
@input="val => handleInput(val, 5)"
:title="stoped_satur"
@close="setstopedSaturVal"
:show="stoped_saturShow"
theme="custom"
close-button-text="确定"
@blur="stoped_saturShow = false"
/>
<van-number-keyboard
v-model="continued_satur"
@input="val => handleInput(val, 6)"
:title="continued_satur"
@close="setContinuedSaturVal"
:show="continued_saturShow"
theme="custom"
close-button-text="确定"
@blur="continued_saturShow = false"
/>
<van-number-keyboard
v-model="max_humidity"
@input="val => handleInput(val, 7)"
:title="max_humidity"
@ -197,26 +119,6 @@
:show="pre_heat_time_sShow"
@blur="pre_heat_time_sShow = false"
/>
<van-number-keyboard
@input="val => handleInput(val, 9)"
theme="custom"
close-button-text="确定"
@close="setstoped_humiVal"
v-model="stoped_humi"
:title="stoped_humi"
:show="stoped_humiShow"
@blur="stoped_humiShow = false"
/>
<van-number-keyboard
theme="custom"
@input="val => handleInput(val, 10)"
close-button-text="确定"
@close="setcontinued_humiVal"
v-model="continued_humi"
:title="continued_humi"
:show="continued_humiShow"
@blur="continued_humiShow = false"
/>
<LogPicker
v-if="logVisible"
:hiddenLogVisible="hiddenLogVisible"
@ -874,7 +776,7 @@ onMounted(() => {
align-items: center;
justify-content: center;
}
.field_font {
:deep(.field_font) {
font-size: 26px;
width: 180px;
}

2
src/main.js
View File

@ -23,6 +23,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)
@ -42,4 +43,5 @@ createApp(App)
.use(Toast)
.use(Slider)
.use(store)
.component('my-input', MyInput)
.mount('#app')
Write Preview
Loading…
Cancel
Save