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.
 
 
 
 
 

447 lines
12 KiB

<script setup lang="ts">
import { FtMessage } from 'libs/message'
import { sendControl } from 'libs/utils'
import { reactive } from 'vue'
const form = reactive({
x: {
current: undefined,
position: undefined,
speed: undefined,
direction: 'forward',
},
y: {
current: undefined,
position: undefined,
speed: undefined,
direction: 'forward',
},
z: {
current: undefined,
position: undefined,
speed: undefined,
direction: 'forward',
},
direction: 'forward',
speed: undefined,
voltage: undefined,
})
const motorMove = async (device: 'x' | 'y' | 'z') => {
if (!form[device].position || !form[device].speed) {
FtMessage.error('请补全参数')
return
}
const params = {
cmdCode: { x: 'motor_x_to_position', y: 'motor_y_to_position', z: 'motor_z_to_position' }[device],
cmdId: '',
params: form[device],
}
await sendControl(params, 'debug')
}
const motorStop = async (device: 'x' | 'y' | 'z') => {
const params = {
cmdCode: { x: 'motor_x_stop', y: 'motor_y_stop', z: 'motor_z_stop' }[device],
cmdId: '',
params: form[device],
}
await sendControl(params, 'debug')
}
const motorToHome = async (device: 'x' | 'y' | 'z') => {
const params = {
cmdCode: { x: 'motor_x_origin', y: 'motor_y_origin', z: 'motor_z_origin' }[device],
cmdId: '',
params: form[device],
}
await sendControl(params, 'debug')
}
const threeWayValveOpenSyringePipeline = async () => {
const params = {
cmdCode: 'three_way_valve_open_syringe_pipeline',
cmdId: '',
}
await sendControl(params, 'debug')
}
const threeWayValveOpenNozzlePipeline = async () => {
const params = {
cmdCode: 'three_way_valve_open_nozzle_pipeline',
cmdId: '',
}
await sendControl(params, 'debug')
}
const threeWayValveCloseAll = async () => {
const params = {
cmdCode: 'three_way_valve_close_all',
cmdId: '',
}
await sendControl(params, 'debug')
}
const lightingPanelOpen = async () => {
const params = {
cmdCode: 'lighting_panel_open',
cmdId: '',
}
await sendControl(params, 'debug')
}
const lightingPanelClose = async () => {
const params = {
cmdCode: 'lighting_panel_close',
cmdId: '',
}
await sendControl(params, 'debug')
}
const washValveOpen = async () => {
const params = {
cmdCode: 'wash_valve_open',
cmdId: '',
}
await sendControl(params, 'debug')
}
const washValveClose = async () => {
const params = {
cmdCode: 'wash_valve_close',
cmdId: '',
}
await sendControl(params, 'debug')
}
const nozzleValveOpen = async () => {
const params = {
cmdCode: 'nozzle_valve_open',
cmdId: '',
}
await sendControl(params, 'debug')
}
const nozzleValveClose = async () => {
const params = {
cmdCode: 'nozzle_valve_close',
cmdId: '',
}
await sendControl(params, 'debug')
}
const dehumidifierValveOpen = async () => {
const params = {
cmdCode: 'dehumidifier_valve_open',
cmdId: '',
}
await sendControl(params, 'debug')
}
const dehumidifierValveClose = async () => {
const params = {
cmdCode: 'dehumidifier_valve_close',
cmdId: '',
}
await sendControl(params, 'debug')
}
const syringePumpInjectionVolumeSet = async () => {
if (!form.speed) {
FtMessage.error('请输入注射泵速度')
return
}
const params = {
cmdCode: 'syringe_pump_start',
cmdId: '',
params: {
direction: form.direction,
speed: form.speed,
},
}
await sendControl(params, 'debug')
}
const syringePumpStop = async () => {
const params = {
cmdCode: 'syringe_pump_stop',
cmdId: '',
}
await sendControl(params, 'debug')
}
const highVoltageOpen = async () => {
if (!form.voltage) {
FtMessage.error('请输入电压值')
return
}
if (form.voltage > 6000) {
FtMessage.error('电压值最大为6000V')
return
}
const params = {
cmdCode: 'high_voltage_open',
cmdId: '',
params: {
voltage: form.voltage,
},
}
await sendControl(params, 'debug')
}
const highVoltageClose = async () => {
const params = {
cmdCode: 'high_voltage_close',
cmdId: '',
}
await sendControl(params, 'debug')
}
</script>
<template>
<div>
<el-card>
<el-form label-width="auto" label-suffix=":">
<el-form-item label="X轴">
<div style="display: flex; align-items: center;margin: 5px 0">
<div style="margin: 0 5px">
<span>移动</span>
<el-input v-model="form.x.position" style="width: 100px" type="number" />
<span>mm</span>
</div>
<div style="margin: 0 5px">
<span>速度</span>
<el-input v-model="form.x.speed" style="width: 100px" type="number" />
<span>mm/s</span>
</div>
<el-radio-group v-model="form.x.direction" style="margin: 10px">
<div style="display: flex">
<el-radio value="forward">
前进
</el-radio>
<el-radio value="backward">
后退
</el-radio>
</div>
</el-radio-group>
<ft-button type="primary" :click-handle="() => motorMove('x')">
执行
</ft-button>
<ft-button type="primary" :click-handle="() => motorStop('x')">
停止
</ft-button>
<ft-button :click-handle="() => motorToHome('x')">
回原点
</ft-button>
</div>
</el-form-item>
<el-form-item label="Y轴">
<div style="display: flex; align-items: center;margin: 5px 0">
<div style="margin: 0 5px">
<span>移动</span>
<el-input v-model="form.y.position" style="width: 100px" type="number" />
<span>mm</span>
</div>
<div style="margin: 0 5px">
<span>速度</span>
<el-input v-model="form.y.speed" style="width: 100px" type="number" />
<span>mm/s</span>
</div>
<el-radio-group v-model="form.y.direction" style="margin: 10px">
<div style="display: flex">
<el-radio value="forward">
前进
</el-radio>
<el-radio value="backward">
后退
</el-radio>
</div>
</el-radio-group>
<ft-button type="primary" :click-handle="() => motorMove('y')">
执行
</ft-button>
<ft-button type="primary" :click-handle="() => motorStop('y')">
停止
</ft-button>
<ft-button :click-handle="() => motorToHome('y')">
回原点
</ft-button>
</div>
</el-form-item>
<el-form-item label="Z轴">
<div style="display: flex; align-items: center;margin: 5px 0">
<div style="margin: 0 5px">
<span>移动</span>
<el-input v-model="form.z.position" style="width: 100px" type="number" />
<span>mm</span>
</div>
<div style="margin: 0 5px">
<span>速度</span>
<el-input v-model="form.z.speed" style="width: 100px" type="number" />
<span>mm/s</span>
</div>
<el-radio-group v-model="form.z.direction" style="margin: 10px">
<div style="display: flex">
<el-radio value="forward">
前进
</el-radio>
<el-radio value="backward">
后退
</el-radio>
</div>
</el-radio-group>
<ft-button type="primary" :click-handle="() => motorMove('z')">
执行
</ft-button>
<ft-button type="primary" :click-handle="() => motorStop('z')">
停止
</ft-button>
<ft-button :click-handle="() => motorToHome('z')">
回原点
</ft-button>
</div>
</el-form-item>
</el-form>
</el-card>
<el-card>
<el-form label-width="auto" label-suffix=":">
<el-form-item label="注射泵">
<div style="display: flex; align-items: center; margin: 5px 0">
<el-input v-model="form.speed" type="number" style="width: 100px;" />
<span>ul/min</span>
<el-radio-group v-model="form.direction" style="margin: 10px">
<div style="display: flex">
<el-radio value="forward">
前进
</el-radio>
<el-radio value="backward">
后退
</el-radio>
</div>
</el-radio-group>
<ft-button type="primary" style="margin-left: 10px" :click-handle="syringePumpInjectionVolumeSet">
开始
</ft-button>
<ft-button :click-handle="syringePumpStop">
停止
</ft-button>
</div>
</el-form-item>
<el-form-item label="电压控制器">
<div style="display: flex; align-items: center; margin: 5px 0">
<el-input v-model="form.voltage" type="number" style="width: 100px;" />
<span>V</span>
<ft-button type="primary" style="margin-left: 10px" :click-handle="highVoltageOpen">
开启
</ft-button>
<ft-button :click-handle="highVoltageClose">
关闭
</ft-button>
</div>
</el-form-item>
</el-form>
</el-card>
<el-row :gutter="20">
<el-col :span="12">
<el-card style="display: flex;justify-content: center">
<ft-button type="primary" :click-handle="lightingPanelOpen">
开启照明灯
</ft-button>
<ft-button :click-handle="lightingPanelClose">
关闭照明灯
</ft-button>
<div style="margin-top: 10px;display: flex;justify-content: center">
<ft-button type="primary" :click-handle="threeWayValveOpenSyringePipeline">
打开喷嘴管路
</ft-button>
<ft-button type="primary" :click-handle="threeWayValveOpenNozzlePipeline">
打开注射器管路
</ft-button>
<ft-button :click-handle="threeWayValveCloseAll">
全部关闭
</ft-button>
</div>
</el-card>
</el-col>
<el-col :span="12">
<el-card style="display: flex;justify-content: center">
<ft-button type="primary" :click-handle="washValveOpen">
打开清洗阀
</ft-button>
<ft-button type="primary" :click-handle="nozzleValveOpen">
打开喷嘴阀
</ft-button>
<ft-button type="primary" :click-handle="dehumidifierValveOpen">
打开除湿阀
</ft-button>
<div style="margin-top: 10px;display: flex;justify-content: center">
<ft-button :click-handle="washValveClose">
关闭清洗阀
</ft-button>
<ft-button :click-handle="nozzleValveClose">
关闭喷嘴阀
</ft-button>
<ft-button :click-handle="dehumidifierValveClose">
关闭除湿阀
</ft-button>
</div>
</el-card>
</el-col>
</el-row>
</div>
</template>
<style scoped lang="scss">
.el-card {
margin: 30px 0;
border-radius: 20px;
color: var(--el-color-primary);
}
:deep(.el-card__body) {
padding: 50px;
}
.card-header {
display: flex;
align-items: center;
}
.num-box {
margin: 0 20px;
width: 50px;
height: 50px;
border-radius: 50%;
background: var(--el-color-primary);
font-size: 30px;
color: #ffffff;
display: flex;
justify-content: center;
align-items: center;
}
.button-footer {
display: flex;
justify-content: flex-end;
margin: 50px;
}
.hint-text {
display: flex;
height: 400px;
flex-direction: column;
justify-content: center;
align-items: center;
font-size: 50px;
color: var(--el-color-primary);
}
.num-text {
color: var(--el-color-primary);
font-weight: 900;
font-size: 70px;
}
:deep(.el-form-item) {
--font-size: 40px;
margin-bottom: 10px
}
.el-input {
margin: 0 15px
}
</style>