You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
513 lines
14 KiB
513 lines
14 KiB
<template>
|
|
<div class="test_container">
|
|
<div class="common_set switch_wrap">
|
|
<p class="title">加液蠕动泵</p>
|
|
<div class="num">
|
|
<van-field
|
|
type="number"
|
|
v-model="addLiquidVal"
|
|
:clickable="true"
|
|
:formatter="formatter6"
|
|
readonly
|
|
@touchstart.stop="hideAllKeyboards(1)"
|
|
class="add_liquid_input"
|
|
/>
|
|
<p>RPM</p>
|
|
</div>
|
|
<div class="num">
|
|
<van-field
|
|
type="number"
|
|
v-model="addLiquidPower"
|
|
:clickable="true"
|
|
readonly
|
|
:formatter="formatter"
|
|
@touchstart.stop="hideAllKeyboards(2)"
|
|
class="add_liquid_input"
|
|
/>
|
|
<p>P</p>
|
|
</div>
|
|
<div class="btn_wrap">
|
|
<div class="open" @click="setAddLiquidConfig(1)">打开</div>
|
|
<div
|
|
class="open"
|
|
@click="setAddLiquidConfig(3)"
|
|
style="margin-right: 0"
|
|
>
|
|
关闭
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="common_set switch_wrap">
|
|
<p class="title">喷液蠕动泵</p>
|
|
<div class="num">
|
|
<van-field
|
|
type="number"
|
|
:formatter="formatter7"
|
|
v-model="addLiquidVal2"
|
|
:clickable="true"
|
|
readonly
|
|
@touchstart.stop="hideAllKeyboards(3)"
|
|
class="add_liquid_input"
|
|
/>
|
|
<p>RPM</p>
|
|
</div>
|
|
<div class="num">
|
|
<van-field
|
|
type="number"
|
|
:formatter="formatter"
|
|
v-model="addLiquidPower2"
|
|
:clickable="true"
|
|
readonly
|
|
@touchstart.stop="hideAllKeyboards(4)"
|
|
class="add_liquid_input"
|
|
/>
|
|
<p>P</p>
|
|
</div>
|
|
<div class="btn_wrap">
|
|
<div class="open" @click="setAddLiquidConfig(2)">打开</div>
|
|
<div
|
|
class="open"
|
|
@click="setAddLiquidConfig(4)"
|
|
style="margin-right: 0"
|
|
>
|
|
关闭
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="common_set switch_wrap">
|
|
<p class="title">空压机</p>
|
|
<p class="num">{{ testStore?.airCompressorObj?.currentVal }} A</p>
|
|
<div class="btn_wrap">
|
|
<div
|
|
:class="testStore.airCompressor ? 'close' : 'open'"
|
|
@click="changeAirStatus(1)"
|
|
>
|
|
打开
|
|
</div>
|
|
<div
|
|
:class="!testStore.airCompressor ? 'close' : 'open'"
|
|
@click="changeAirStatus(2)"
|
|
>
|
|
关闭
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="common_set switch_wrap">
|
|
<p class="title">风机</p>
|
|
<p class="num">{{ testStore?.airBlowerObj?.currentVal }} A</p>
|
|
<div class="btn_wrap">
|
|
<div
|
|
:class="testStore.draughtFan ? 'close' : 'open'"
|
|
@click="changeDraughtStatus(1)"
|
|
>
|
|
打开
|
|
</div>
|
|
<div
|
|
:class="!testStore.draughtFan ? 'close' : 'open'"
|
|
@click="changeDraughtStatus(2)"
|
|
>
|
|
关闭
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="common_set switch_wrap">
|
|
<p class="title">加热片</p>
|
|
<p class="num">{{ testStore?.heatingStripObj?.currentVal }} A</p>
|
|
<div class="btn_wrap">
|
|
<div
|
|
:class="testStore.heatingStrip ? 'close' : 'open'"
|
|
@click="changeHeatingStatus(1)"
|
|
>
|
|
打开
|
|
</div>
|
|
<div
|
|
:class="!testStore.heatingStrip ? 'close' : 'open'"
|
|
@click="changeHeatingStatus(2)"
|
|
>
|
|
关闭
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="common_set update_wrap">
|
|
<p class="title">水浸1</p>
|
|
<p class="num">{{ testStore.waterImmersionSensor1 ? '有水' : '没水' }}</p>
|
|
<div class="btn_wrap" @click="handleUpdate">更新读取水浸状态</div>
|
|
</div>
|
|
<div class="common_set update_wrap">
|
|
<p class="title">水浸2</p>
|
|
<p class="num">{{ testStore.waterImmersionSensor2 ? '有水' : '没水' }}</p>
|
|
<div class="btn_wrap" @click="handleUpdate">更新读取水浸状态</div>
|
|
</div>
|
|
<div class="common_set update_wrap">
|
|
<p class="title">液位</p>
|
|
<p class="num">{{ deviceStore.disinfectantCapacity }} kPa/100g</p>
|
|
<div class="btn_wrap" @click="handleUpdate">更新读取液位状态</div>
|
|
</div>
|
|
<div class="common_set info_wrap">
|
|
<p class="title">仓内</p>
|
|
<p class="info">温度 {{ deviceStore.binTemperature }} ℃</p>
|
|
<p class="info">湿度 {{ deviceStore.binHumidity }} ℃</p>
|
|
<p class="info">过氧化氢浓度 {{ deviceStore.binHP }} PPM</p>
|
|
</div>
|
|
<div class="common_set info_wrap">
|
|
<p class="title">环境1</p>
|
|
<p class="info">温度 {{ deviceStore.envirTemperature1 }} ℃</p>
|
|
<p class="info">湿度 {{ deviceStore.envirHumidity1 }} ℃</p>
|
|
<p class="info">过氧化氢浓度 {{ deviceStore.envirHP1 }} PPM</p>
|
|
</div>
|
|
<div class="common_set info_wrap">
|
|
<p class="title">环境2</p>
|
|
<p class="info">温度 {{ deviceStore.envirTemperature2 }} ℃</p>
|
|
<p class="info">湿度 {{ deviceStore.envirHumidity2 }} ℃</p>
|
|
<p class="info">过氧化氢浓度 {{ deviceStore.envirHP2 }} PPM</p>
|
|
</div>
|
|
<van-number-keyboard
|
|
v-model="addLiquidVal"
|
|
:show="numberKeyboardShowVal"
|
|
@blur="numberKeyboardShowVal = false"
|
|
/>
|
|
<van-number-keyboard
|
|
v-model="addLiquidPower"
|
|
:show="numberKeyboardShowPower"
|
|
@blur="numberKeyboardShowPower = false"
|
|
/>
|
|
<van-number-keyboard
|
|
v-model="addLiquidVal2"
|
|
:show="numberKeyboardShowVal2"
|
|
@blur="numberKeyboardShowVal2 = false"
|
|
/>
|
|
<van-number-keyboard
|
|
v-model="addLiquidPower2"
|
|
:show="numberKeyboardShowPower2"
|
|
@blur="numberKeyboardShowPower2 = false"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref } from 'vue'
|
|
import {
|
|
useTestStore,
|
|
useDeviceStore,
|
|
useWebSocketStore,
|
|
useSettingStore,
|
|
} from '@/store'
|
|
import {
|
|
someAirSwitchJSON,
|
|
liquidpumpctrlJSON,
|
|
getStateJSON,
|
|
addLiquidCtrlJSON,
|
|
} from '@/mock/command'
|
|
|
|
const testStore = useTestStore()
|
|
const deviceStore = useDeviceStore()
|
|
const websocketStore = useWebSocketStore()
|
|
const settingStore = useSettingStore()
|
|
|
|
const addLiquidVal = ref(settingStore.addLiquidConfigVal)
|
|
const addLiquidPower = ref(25)
|
|
const numberKeyboardShowVal = ref(false)
|
|
const numberKeyboardShowPower = ref(false)
|
|
|
|
const addLiquidVal2 = ref(settingStore.sprayLiquidConfigVal)
|
|
const addLiquidPower2 = ref(25)
|
|
const numberKeyboardShowVal2 = ref(false)
|
|
const numberKeyboardShowPower2 = ref(false)
|
|
|
|
const formatter = value => {
|
|
if (parseInt(value) > 31) {
|
|
return '31'
|
|
}
|
|
return value
|
|
}
|
|
|
|
const formatter6 = value => {
|
|
let arr = settingStore.allSettingList.filter(
|
|
item => item.name == 'drainage_pump_speed',
|
|
)
|
|
if (arr && arr.length > 0) {
|
|
if (parseInt(value) > arr[0].val_upper_limit) {
|
|
return arr[0].val_upper_limit + ''
|
|
}
|
|
if (parseInt(value) < arr[0].val_lower_limit) {
|
|
return arr[0].val_lower_limit + ''
|
|
}
|
|
}
|
|
return value
|
|
}
|
|
|
|
const formatter7 = value => {
|
|
let arr = settingStore.allSettingList.filter(
|
|
item => item.name == 'injection_pump_speed',
|
|
)
|
|
if (arr && arr.length > 0) {
|
|
if (parseInt(value) > arr[0].val_upper_limit) {
|
|
return arr[0].val_upper_limit + ''
|
|
}
|
|
if (parseInt(value) < arr[0].val_lower_limit) {
|
|
return arr[0].val_lower_limit + ''
|
|
}
|
|
}
|
|
return value
|
|
}
|
|
|
|
const hideAllKeyboards = flag => {
|
|
if (flag == 1) {
|
|
numberKeyboardShowVal.value = true
|
|
numberKeyboardShowPower.value = false
|
|
numberKeyboardShowVal2.value = false
|
|
numberKeyboardShowPower2.value = false
|
|
}
|
|
if (flag == 2) {
|
|
numberKeyboardShowPower.value = true
|
|
numberKeyboardShowVal.value = false
|
|
numberKeyboardShowVal2.value = false
|
|
numberKeyboardShowPower2.value = false
|
|
}
|
|
if (flag == 3) {
|
|
numberKeyboardShowVal2.value = true
|
|
numberKeyboardShowPower.value = false
|
|
numberKeyboardShowVal.value = false
|
|
numberKeyboardShowPower2.value = false
|
|
}
|
|
if (flag == 4) {
|
|
numberKeyboardShowPower2.value = true
|
|
numberKeyboardShowPower.value = false
|
|
numberKeyboardShowVal2.value = false
|
|
numberKeyboardShowVal.value = false
|
|
}
|
|
}
|
|
|
|
const setAddLiquidConfig = flag => {
|
|
if (flag == 1) {
|
|
websocketStore.sendCommandMsg(
|
|
addLiquidCtrlJSON(1, addLiquidVal.value, addLiquidPower.value),
|
|
)
|
|
} else if (flag == 2) {
|
|
websocketStore.sendCommandMsg(
|
|
addLiquidCtrlJSON(2, addLiquidVal2.value, addLiquidPower2.value),
|
|
)
|
|
} else if (flag == 3) {
|
|
websocketStore.sendCommandMsg(addLiquidCtrlJSON(1, 0, addLiquidPower.value))
|
|
} else {
|
|
websocketStore.sendCommandMsg(
|
|
addLiquidCtrlJSON(2, 0, addLiquidPower2.value),
|
|
)
|
|
}
|
|
}
|
|
|
|
const handleUpdate = () => {
|
|
websocketStore.sendCommandMsg(getStateJSON)
|
|
}
|
|
|
|
const changeFeedingStatus = flag => {
|
|
if (flag == 1) {
|
|
if (!testStore.feedingPeristalticPumpStatus) {
|
|
// 发送打开指令
|
|
websocketStore.sendCommandMsg(
|
|
liquidpumpctrlJSON(1, settingStore.addLiquidConfigVal),
|
|
)
|
|
testStore.updateFeedingPeristalticPumpStatus(true)
|
|
}
|
|
} else {
|
|
if (testStore.feedingPeristalticPumpStatus) {
|
|
websocketStore.sendCommandMsg(liquidpumpctrlJSON(1, 0))
|
|
testStore.updateFeedingPeristalticPumpStatus(false)
|
|
}
|
|
}
|
|
}
|
|
|
|
const changeSprayStatus = flag => {
|
|
if (flag == 1) {
|
|
if (!testStore.sprayPeristalticPump) {
|
|
websocketStore.sendCommandMsg(
|
|
liquidpumpctrlJSON(2, settingStore.sprayLiquidConfigVal),
|
|
)
|
|
testStore.updateSprayPeristalticPump(true)
|
|
}
|
|
} else {
|
|
if (testStore.sprayPeristalticPump) {
|
|
websocketStore.sendCommandMsg(liquidpumpctrlJSON(2, 0))
|
|
testStore.updateSprayPeristalticPump(false)
|
|
}
|
|
}
|
|
}
|
|
|
|
const changeHeatingStatus = flag => {
|
|
if (flag == 1) {
|
|
if (!testStore.heatingStrip) {
|
|
websocketStore.sendCommandMsg(someAirSwitchJSON(4, 1))
|
|
websocketStore.sendCommandMsg(someAirSwitchJSON(5, 1))
|
|
testStore.updateHeatingStrip(true)
|
|
}
|
|
} else {
|
|
if (testStore.heatingStrip) {
|
|
websocketStore.sendCommandMsg(someAirSwitchJSON(4, 0))
|
|
websocketStore.sendCommandMsg(someAirSwitchJSON(5, 0))
|
|
testStore.updateHeatingStrip(false)
|
|
}
|
|
}
|
|
}
|
|
|
|
const changeAirStatus = flag => {
|
|
if (flag == 1) {
|
|
if (!testStore.airCompressor) {
|
|
websocketStore.sendCommandMsg(someAirSwitchJSON(0, 1))
|
|
websocketStore.sendCommandMsg(someAirSwitchJSON(1, 1))
|
|
testStore.updateAirCompressor(true)
|
|
}
|
|
} else {
|
|
if (testStore.airCompressor) {
|
|
websocketStore.sendCommandMsg(someAirSwitchJSON(0, 0))
|
|
websocketStore.sendCommandMsg(someAirSwitchJSON(1, 0))
|
|
testStore.updateAirCompressor(false)
|
|
}
|
|
}
|
|
}
|
|
|
|
const changeDraughtStatus = flag => {
|
|
if (flag == 1) {
|
|
if (!testStore.draughtFan) {
|
|
websocketStore.sendCommandMsg(someAirSwitchJSON(2, 1))
|
|
websocketStore.sendCommandMsg(someAirSwitchJSON(3, 1))
|
|
testStore.updateDraughtFan(true)
|
|
}
|
|
} else {
|
|
if (testStore.draughtFan) {
|
|
websocketStore.sendCommandMsg(someAirSwitchJSON(2, 0))
|
|
websocketStore.sendCommandMsg(someAirSwitchJSON(3, 0))
|
|
testStore.updateDraughtFan(false)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.test_container {
|
|
margin-bottom: 30px;
|
|
height: 580px;
|
|
overflow: scroll;
|
|
box-sizing: border-box;
|
|
background: #ffffff;
|
|
border-radius: 16px;
|
|
padding: 20px;
|
|
display: grid;
|
|
row-gap: 20px;
|
|
column-gap: 20px;
|
|
grid-template-columns: repeat(2, 1fr);
|
|
grid-template-rows: repeat(5, 1fr);
|
|
.common_set {
|
|
width: 580px;
|
|
height: 80px;
|
|
box-sizing: border-box;
|
|
border-radius: 14px;
|
|
background: #f6f6f6;
|
|
display: flex;
|
|
align-items: center;
|
|
.title {
|
|
font-family: Source Han Sans CN;
|
|
font-size: 20px;
|
|
font-weight: 500;
|
|
letter-spacing: 0.06em;
|
|
color: #000000;
|
|
width: 106px;
|
|
}
|
|
.num {
|
|
font-family: Source Han Sans CN;
|
|
font-size: 13px;
|
|
font-weight: 500;
|
|
letter-spacing: 0.1em;
|
|
color: #000000;
|
|
display: flex;
|
|
align-items: center;
|
|
margin-right: 4px;
|
|
.add_liquid_input {
|
|
width: 40px;
|
|
margin-right: 2px;
|
|
text-align: right;
|
|
height: 24px;
|
|
padding: 0;
|
|
color: #0e0e0e;
|
|
font-family: Source Han Sans CN;
|
|
font-weight: 500;
|
|
font-size: 14;
|
|
}
|
|
}
|
|
}
|
|
.switch_wrap {
|
|
padding: 0 17px 0 40px;
|
|
justify-content: space-between;
|
|
.btn_wrap {
|
|
display: flex;
|
|
align-items: center;
|
|
.open {
|
|
margin-right: 10px;
|
|
width: 87px;
|
|
height: 45px;
|
|
border-radius: 23px;
|
|
background: #06518b;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-family: Source Han Sans CN;
|
|
font-size: 14px;
|
|
font-weight: 500;
|
|
letter-spacing: 0.1em;
|
|
color: #ffffff;
|
|
}
|
|
.close {
|
|
width: 87px;
|
|
height: 45px;
|
|
border-radius: 23px;
|
|
background: #ffffff;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-family: Source Han Sans CN;
|
|
font-size: 14px;
|
|
font-weight: 500;
|
|
letter-spacing: 0.1em;
|
|
color: #d8d8d8;
|
|
}
|
|
}
|
|
}
|
|
.update_wrap {
|
|
padding: 0 17px 0 40px;
|
|
justify-content: space-between;
|
|
.btn_wrap {
|
|
width: 184px;
|
|
height: 45px;
|
|
border-radius: 23px;
|
|
background: #06518b;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-family: Source Han Sans CN;
|
|
font-size: 14px;
|
|
font-weight: 500;
|
|
letter-spacing: 0.1em;
|
|
color: #ffffff;
|
|
}
|
|
}
|
|
.info_wrap {
|
|
padding: 0 32px 0 40px;
|
|
justify-content: space-between;
|
|
.title {
|
|
font-family: Source Han Sans CN;
|
|
font-size: 20px;
|
|
font-weight: 500;
|
|
letter-spacing: 0.06em;
|
|
color: #000000;
|
|
width: 57px;
|
|
white-space: nowrap;
|
|
}
|
|
.info {
|
|
font-family: Source Han Sans CN;
|
|
font-size: 14px;
|
|
font-weight: 500;
|
|
letter-spacing: 0.1em;
|
|
color: #06518b;
|
|
}
|
|
}
|
|
}
|
|
</style>
|