matrix-spray-web/src/components/home/Environment/index.vue

<script setup lang="ts">
import FtDialog from 'components/common/FTDialog/index.vue'
import { ElMessageBox } from 'element-plus'
import { FtMessage } from 'libs/message'
import { sendControl } from 'libs/utils'
import { useSystemStore } from 'stores/useSystemStore'
import { ref } from 'vue'

const emits = defineEmits(['ok', 'cancel'])
const systemStore = useSystemStore() // 使用 systemStore
const humidity = ref(systemStore.targetHumidity)
const slideTemperature = ref(systemStore.targetSlideTemperature)
const nozzleTemperature = ref(systemStore.targetNozzleTemperature)
const slideStartRef = ref()
const nozzleStartRef = ref()
const dehumidifierStartRef = ref()
const slideStart = () => {
  if (!systemStore.systemSensor.slideTemperature) {
    FtMessage.error('未检测到当前温度')
    return
  }
  if (!slideTemperature.value) {
    FtMessage.error('请输入目标温度')
    return
  }
  if (slideTemperature.value > 100 || slideTemperature.value < 0) {
    FtMessage.error('温度参数有误')
    return
  }
  if (slideTemperature.value <= systemStore.systemSensor.slideTemperature) {
    FtMessage.info('当前不需要加热')
    return
  }
  ElMessageBox.confirm('载玻台即将开始加热', '提示', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    showCancelButton: true,
    showClose: false,
  })
    .then(async () => {
      slideStartRef.value.setLoading(true)
      const params = {
        cmdCode: 'slide_plat_heat_start',
        cmdId: '',
        params: {
          temperature: slideTemperature.value,
        },
      }
      await sendControl(params)
      systemStore.updateSlideTemperature(slideTemperature.value)
      slideStartRef.value.setLoading(false)
    })
    .catch(() => {
      FtMessage.error('取消加热')
    })
}
const nozzleStart = () => {
  if (!systemStore.systemSensor.nozzleTemperature) {
    FtMessage.error('未检测到当前温度')
    return
  }
  if (!nozzleTemperature.value) {
    FtMessage.error('请输入目标温度')
    return
  }
  if (nozzleTemperature.value > 100 || nozzleTemperature.value < 0) {
    FtMessage.error('温度参数有误')
    return
  }
  if (nozzleTemperature.value <= systemStore.systemSensor.nozzleTemperature) {
    FtMessage.info('当前不需要加热')
    return
  }
  ElMessageBox.confirm('即将开始加热', '提示', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    showCancelButton: true,
    showClose: false,
  })
    .then(async () => {
      nozzleStartRef.value.setLoading(true)
      const params = {
        cmdCode: 'nozzle_heat_start',
        cmdId: '',
        params: {
          temperature: nozzleTemperature.value,
        },
      }
      await sendControl(params)
      systemStore.updateTargetNozzleTemperature(nozzleTemperature.value)
      nozzleStartRef.value.setLoading(false)
    })
    .catch(() => {
      FtMessage.error('取消加热')
    })
}
const dehumidifierStart = () => {
  if (!systemStore.systemSensor.humidity) {
    FtMessage.error('未检测到当前湿度')
    return
  }
  if (!humidity.value) {
    FtMessage.error('请输入目标湿度')
    return
  }
  if (humidity.value > 100 || humidity.value < 0) {
    FtMessage.error('湿度参数有误')
    return
  }
  if (humidity.value >= systemStore.systemSensor.humidity) {
    FtMessage.info('当前不需要除湿')
    return
  }
  ElMessageBox.confirm('即将开始除湿,请确认关闭注射泵门和玻片托盘出口门', '提示', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    showCancelButton: true,
    showClose: false,
  })
    .then(async () => {
      dehumidifierStartRef.value.setLoading(true)
      const params = {
        cmdCode: 'dehumidifier_start',
        cmdId: '',
        params: {
          humidity: humidity.value,
        },
      }
      await sendControl(params)
      systemStore.updateTargetHumidity(humidity.value)
      dehumidifierStartRef.value.setLoading(false)
    })
    .catch(() => {
      FtMessage.error('取消除湿')
    })
}
const dehumidifierStop = async () => {
  const params = {
    cmdCode: 'dehumidifier_stop',
    cmdId: '',
  }
  await sendControl(params)
}
const slideStop = async () => {
  const params = {
    cmdCode: 'slide_plat_heat_stop',
    cmdId: '',
  }
  await sendControl(params)
}
const nozzleStop = async () => {
  const params = {
    cmdCode: 'nozzle_heat_stop',
    cmdId: '',
  }
  await sendControl(params)
}
const onClose = async () => {
  emits('cancel')
}
</script>

<template>
  <FtDialog visible title="喷涂环境设置" width="70%">
    <div style="padding: 10px;">
      <div style="display: flex; align-items: center; margin: 10px 0;font-size: 15px;justify-content: center;">
        <div style="display: flex; align-items: center; width: 20%; margin-right: 30px">
          <span>当前湿度</span>
          <span class="num-text">{{ systemStore.systemSensor.humidity }}</span>
          <span>%RH</span>
        </div>
        <div style="display: flex; align-items: center; width: 30%; margin-right: 30px">
          <span>目标湿度</span>
          <el-input v-model="humidity" type="number" style="width: 100px; margin: 0 10px" />
          <span>%RH</span>
        </div>
        <ft-button ref="dehumidifierStartRef" type="primary" :click-handle="dehumidifierStart">
          开始除湿
        </ft-button>
        <ft-button :click-handle="dehumidifierStop" :disabled="!systemStore.systemStatus.dehumidifierRunning">
          停止除湿
        </ft-button>
      </div>
      <div style="display: flex; align-items: center; margin-top: 10px;font-size: 15px;justify-content: center;">
        <div style="display: flex; align-items: center; width:20%; margin-right: 30px">
          <span>载玻台温度</span>
          <span class="num-text">{{ systemStore.systemSensor.slideTemperature }}</span>
          <span>℃</span>
        </div>
        <div style="display: flex; align-items: center; width: 30%; margin-right: 30px">
          <span>目标温度</span>
          <el-input v-model="slideTemperature" type="number" style="width: 100px; margin: 0 10px" />
          <span>℃</span>
        </div>
        <ft-button ref="slideStartRef" type="primary" :click-handle="slideStart">
          开始加热
        </ft-button>
        <ft-button :click-handle="slideStop" :disabled="!systemStore.systemStatus.slidePlatHeating">
          停止加热
        </ft-button>
      </div>
      <div style="display: flex; align-items: center; margin-top: 10px;font-size: 15px;justify-content: center;">
        <div style="display: flex; align-items: center; width: 20%; margin-right: 30px">
          <span>喷头温度</span>
          <span class="num-text">{{ systemStore.systemSensor.nozzleTemperature }}</span>
          <span>℃</span>
        </div>
        <div style="display: flex; align-items: center; width: 30%; margin-right: 30px">
          <span>目标温度</span>
          <el-input v-model="nozzleTemperature" type="number" style="width: 100px; margin: 0 10px" />
          <span>℃</span>
        </div>
        <ft-button ref="nozzleStartRef" type="primary" :click-handle="nozzleStart">
          开始加热
        </ft-button>
        <ft-button :click-handle="nozzleStop" :disabled="!systemStore.systemStatus.nozzleHeating">
          停止加热
        </ft-button>
      </div>
    </div>
    <template #footer>
      <FtButton type="default" :click-handle="onClose">
        关闭
      </FtButton>
    </template>
  </FtDialog>
</template>

<style scoped lang="scss">
.num-text {
  color: var(--el-color-primary);
  font-weight: 900;
  font-size: 70px;
}
</style>