选择上下管道

src/components/Operator.vue

@@ -494,7 +494,12 @@ import AirSwitchConfig from 'cpns/info/AirSwitchConfig'
 import DisinfectantLiquidInfo from 'cpns/info/DisinfectantLiquidInfo'
 import EnvironmentInfo from 'cpns/info/EnvironmentInfo'
 import { ref, watch, onMounted, onUnmounted } from 'vue'
-import { useOperatorStore, useWebSocketStore, useSettingStore } from '@/store'
+import {
+  useOperatorStore,
+  useWebSocketStore,
+  useSettingStore,
+  useSealStore,
+} from '@/store'
 import { startDisinfectionJSON, getStateJSON } from '@/mock/command'
 import { showSuccessToast, showFailToast } from 'vant'
 import { time_To_hhmmss } from '@/utils'
@@ -502,6 +507,7 @@ import { time_To_hhmmss } from '@/utils'
 const operatorStore = useOperatorStore()
 const webSocketStore = useWebSocketStore()
 const settingStore = useSettingStore()
+const sealStore = useSealStore()
 const disinfectWarnVisible = ref(false)
 
 const preVisible = ref(false)
@@ -610,6 +616,8 @@ const realStart = () => {
         parseInt(logVal.value),
         parseInt(roomSize.value),
         parseInt(envirVal.value),
+        sealStore.airInletProportionalValue,
+        sealStore.airOutletProportionalValue,
       ),
     )
     props.changeShowOperator(false)

src/components/info/AirSwitchConfig.vue

@@ -27,7 +27,7 @@
           @click="changeTab('1')"
         >
           <p class="text">上管道</p>
-          <div class="percent">10%</div>
+          <div class="percent">{{ topText }}</div>
           <img :src="activeTab == 1 ? A2 : A1" class="icon" alt="" />
         </div>
         <div
@@ -35,11 +35,30 @@
           @click="changeTab('2')"
         >
           <p class="text">下管道</p>
-          <div class="percent">10%</div>
+          <div class="percent">{{ bottomText }}</div>
           <img :src="activeTab == 2 ? A2 : A1" class="icon" alt="" />
         </div>
       </div>
-      <div class="right_container"></div>
+      <div class="right_container">
+        <van-picker
+          v-if="activeTab == 1"
+          :columns="columns"
+          :show-toolbar="false"
+          visible-option-num="3"
+          option-height="42"
+          v-model="selectedValuesTop"
+          @change="topChange"
+        />
+        <van-picker
+          v-if="activeTab == 2"
+          :columns="columns"
+          :show-toolbar="false"
+          visible-option-num="3"
+          option-height="42"
+          @change="bottomChange"
+          v-model="selectedValuesBottom"
+        />
+      </div>
     </div>
   </div>
 </template>
@@ -47,13 +66,42 @@
 <script setup>
 import A1 from '@/assets/img/air/1.png'
 import A2 from '@/assets/img/air/2.png'
+import { useSealStore } from '@/store'
 import { ref } from 'vue'
 
 const activeTab = ref('1')
+const sealStore = useSealStore()
 
 const changeTab = tab => {
   activeTab.value = tab
 }
+const topText = ref('0%')
+const bottomText = ref('0%')
+const topChange = ({ selectedOptions, selectedValues }) => {
+  topText.value = selectedOptions[0].text
+  sealStore.updateAirInletProportionalValue(parseInt(selectedValues[0]) * 10)
+}
+const bottomChange = ({ selectedOptions, selectedValues }) => {
+  bottomText.value = selectedOptions[0].text
+  sealStore.updateAirOutletProportionalValue(parseInt(selectedValues[0]) * 10)
+}
+
+const columns = ref([
+  { text: '0%', value: '0' },
+  { text: '10%', value: '1' },
+  { text: '20%', value: '2' },
+  { text: '30%', value: '3' },
+  { text: '40%', value: '4' },
+  { text: '50%', value: '5' },
+  { text: '60%', value: '6' },
+  { text: '70%', value: '7' },
+  { text: '80%', value: '8' },
+  { text: '90%', value: '9' },
+  { text: '100%', value: '10' },
+])
+
+const selectedValuesTop = ref(['0'])
+const selectedValuesBottom = ref(['0'])
 </script>
 
 <style lang="scss" scoped>
@@ -135,7 +183,11 @@ const changeTab = tab => {
       border-radius: 6px;
       box-sizing: border-box;
       background: #fff;
+      overflow: hidden;
     }
   }
 }
+.van-ellipsis {
+  font-size: 26px;
+}
 </style>

src/mock/command.js

@@ -33,13 +33,21 @@ export const shutdownJSON = {
 }
 
 // 开始消毒
-export const startDisinfectionJSON = (loglevel, roomVolume, envirVal) => {
+export const startDisinfectionJSON = (
+  loglevel,
+  roomVolume,
+  envirVal,
+  airInletProportionalValve,
+  airOutletProportionalValve,
+) => {
   return {
     command: 'startDisinfection',
     messageId: 'startDisinfection',
     loglevel,
     roomVolume,
     envirVal,
+    airInletProportionalValve,
+    airOutletProportionalValve,
   }
 }
 

src/store/modules/seal.js

@@ -8,10 +8,18 @@ export const useSealStore = defineStore({
       currentAirPressure: 0,
       isStartTest: false,
       oldAirPressure: null,
+      airInletProportionalValue: 0,
+      airOutletProportionalValue: 0,
     }
   },
   // actions
   actions: {
+    updateAirInletProportionalValue(airInletProportionalValue) {
+      this.airInletProportionalValue = airInletProportionalValue
+    },
+    updateAirOutletProportionalValue(airOutletProportionalValue) {
+      this.airOutletProportionalValue = airOutletProportionalValue
+    },
     updateCurrentAirPressure(currentAirPressure) {
       this.currentAirPressure = currentAirPressure
     },