Browse Source

fix:喷涂路径绘制

master
guoapeng 5 months ago
parent
commit
beab50f747
  1. 2
      src/apis/system.ts
  2. 10
      src/components/common/FTButton/index.vue
  3. 14
      src/components/common/FTStream/index.vue
  4. 39
      src/components/home/Check/index.vue
  5. 16
      src/libs/socket.ts
  6. 1
      src/libs/utils.ts
  7. 3
      src/stores/useSystemStore.ts
  8. 48
      src/views/debug/index.vue
  9. 4
      src/views/main/index.vue
  10. 57
      src/views/spray/index.vue
  11. 14
      src/views/spraySet/index.vue
  12. 4
      vite.config.ts

2
src/apis/system.ts

@ -11,4 +11,4 @@ export const control = (params: any) => http.post('/function', params)
export const debugControl = (params: any) => http.post('/function/debug', params)
export const getDeviceStatus = () => http.get('/device-status/')
export const getDeviceSelfTest = () => http.get('/device_self_test/')
export const getDeviceSelfTest = () => http.get('/self-test/')

10
src/components/common/FTButton/index.vue

@ -14,22 +14,22 @@ const props = defineProps({
type: Boolean,
default: false,
},
onClick: {
clickHandle: {
type: Function,
required: false,
default: () => Promise<any>,
},
})
const isLoading = ref(false)
async function handleClick() {
if (!props.onClick || isLoading.value)
console.log(props.clickHandle)
if (!props.clickHandle || isLoading.value)
return
console.log(32452353)
isLoading.value = true // loading
try {
await props.onClick() //
await props.clickHandle() //
}
finally {
isLoading.value = false // loading

14
src/components/common/FTStream/index.vue

@ -12,7 +12,7 @@ defineProps({
const systemStore = useSystemStore()
const title = computed(() => {
return cmdNameMap[systemStore.systemList[0]?.cmdCode] || systemStore.systemList[0]?.cmdCode
return cmdNameMap[systemStore.systemList[0]?.cmdCode as keyof typeof cmdNameMap] || systemStore.systemList[0]?.cmdCode
})
const maskBodyRef = ref<HTMLElement | null>(null)
@ -20,6 +20,7 @@ const maskRef = ref<HTMLElement | null>(null)
const maskHeaderRef = ref<HTMLElement | null>(null)
const statusMap = {
fail: 'danger',
error: 'danger',
success: 'success',
finish: 'primary',
@ -90,8 +91,15 @@ const handleMouseUp = () => {
<teleport to="body">
<!-- 使用 transition 组件包裹 mask 元素 -->
<transition name="mask-fade">
<div v-if="visible && systemStore.isDebug" ref="maskRef" class="mask" @mousedown="handleMouseDown" @touchstart="handleMouseDown">
<div ref="maskHeaderRef" class="mask-header">
<div
v-if="visible && systemStore.isDebug"
ref="maskRef"
class="mask"
>
<div
ref="maskHeaderRef" class="mask-header" @mousedown="handleMouseDown"
@touchstart="handleMouseDown"
>
<p>{{ title }}</p>
<el-icon @click="systemStore.updateStreamVisible(false)">
<Close />

39
src/components/home/Check/index.vue

@ -20,13 +20,13 @@ const okHandle = () => {
}
const list = ['x轴是否在原点', 'y轴是否在原点', 'z轴是否在原点']
const status = ref<any>({})
onMounted(async () => {
let num = 0
await nextTick(() => {
buttonCloseRef.value.setLoading(true)
})
const res = await getDeviceSelfTest()
console.log(res)
status.value = await getDeviceSelfTest()
const interval = async () => {
if (num < list.length) {
@ -38,28 +38,38 @@ onMounted(async () => {
await interval()
buttonCloseRef.value.setLoading(false)
closeVisible.value = false
socket.init(receiveMessage, 'cmd_response')
})
const receiveMessage = (data: any) => {
if (data.cmdId === cmdId && data.status === 'success') {
for (let i = 0; i < checkList.value.length; i++) {
checkList.value[i].result = 'padding'
setTimeout(() => {
checkList.value[i].result = 'success'
}, 500)
}
buttonRef.value.setLoading(false)
closeVisible.value = true
}
}
const cancel = () => {
emits('cancel')
}
let cmdId = ''
const motorXYZOrigin = async () => {
buttonRef.value.setLoading(true)
const cmdId = Date.now().toString()
cmdId = Date.now().toString()
const params = {
cmdCode: 'device_self_test',
cmdId,
params: {},
}
socket.init((data: any) => {
console.log(data)
if (data.cmdId === cmdId && data.status === 'success') {
buttonRef.value.setLoading(false)
closeVisible.value = true
}
}, 'cmd_response')
await sendControl(params, 'debug')
await sendControl(params)
}
const checkList = ref<any>([])
@ -89,14 +99,13 @@ const addTextToCheckList = async (text: string, id: number) => {
// result 'success' 'failed'
const itemIndex = checkList.value.findIndex(item => item.id === id)
if (itemIndex !== -1) {
//
setTimeout(() => {
checkList.value[itemIndex].result = 'failed'
checkList.value[itemIndex].result = status.value[['xAxisAtOrigin', 'yAxisAtOrigin', 'zAxisAtOrigin'][itemIndex]] ? 'success' : 'failed'
resolve() // Promise
}, Math.random() * 500) //
}, Math.random() * 200) //
}
}
}, Math.random() * 200) //
}, Math.random() * 100) //
})
}
</script>

16
src/libs/socket.ts

@ -21,7 +21,7 @@ interface socket {
reconnect_number: number
reconnect_timer: any
reconnect_interval: number
receiveMessageCallBackObj: any
receiveMessageCallBackObj: { [key: string]: any[] }
initCallBacks: any
// eslint-disable-next-line ts/no-unsafe-function-type
receiveMessage: Function
@ -76,17 +76,23 @@ export const socket: socket = {
// 接收消息的方法
receiveMessage: (e: any) => {
const message = JSON.parse(e.data)
const fn = socket.receiveMessageCallBackObj[message.type]
if (fn) {
const callbacks = socket.receiveMessageCallBackObj[message.type]
if (callbacks) {
callbacks.forEach((fn) => {
fn(message.data)
})
}
else {
console.error('请注册当前类型的回调函数', message)
}
},
// 修改 registerCallback 方法
registerCallback: (fn: any, type: any) => {
// 接收消息的回调
socket.receiveMessageCallBackObj[type] = fn
if (!socket.receiveMessageCallBackObj[type]) {
socket.receiveMessageCallBackObj[type] = []
}
socket.receiveMessageCallBackObj[type].push(fn)
},
init: async (

1
src/libs/utils.ts

@ -64,6 +64,7 @@ export const sendControl = async (params: any, type?: string) => {
systemStore.pushSystemList(data)
}, 'cmd_debug')
socket.init((data: any) => {
console.log('system', data)
systemStore.pushSystemList(data)
}, 'cmd_response')
await (type === 'debug' ? debugControl(params) : control(params))

3
src/stores/useSystemStore.ts

@ -16,7 +16,7 @@ export const useSystemStore = defineStore('system', {
systemSensor: {
humidity: 0,
},
isDebug: false,
isDebug: true,
streamVisible: false,
systemList: [{ cmdCode: '' }],
}),
@ -35,7 +35,6 @@ export const useSystemStore = defineStore('system', {
},
pushSystemList(text: any) {
this.systemList.push(text)
console.log(this.systemList)
},
},
})

48
src/views/debug/index.vue

@ -219,13 +219,13 @@ const highVoltageClose = async () => {
</div>
</el-radio-group>
<ft-button type="primary" :on-click="() => motorMove('x')">
<ft-button type="primary" :click-handle="() => motorMove('x')">
执行
</ft-button>
<ft-button type="primary" :on-click="() => motorStop('x')">
<ft-button type="primary" :click-handle="() => motorStop('x')">
停止
</ft-button>
<ft-button :on-click="() => motorToHome('x')">
<ft-button :click-handle="() => motorToHome('x')">
回原点
</ft-button>
</div>
@ -254,13 +254,13 @@ const highVoltageClose = async () => {
</div>
</el-radio-group>
<ft-button type="primary" :on-click="() => motorMove('y')">
<ft-button type="primary" :click-handle="() => motorMove('y')">
执行
</ft-button>
<ft-button type="primary" :on-click="() => motorStop('y')">
<ft-button type="primary" :click-handle="() => motorStop('y')">
停止
</ft-button>
<ft-button :on-click="() => motorToHome('y')">
<ft-button :click-handle="() => motorToHome('y')">
回原点
</ft-button>
</div>
@ -289,13 +289,13 @@ const highVoltageClose = async () => {
</div>
</el-radio-group>
<ft-button type="primary" :on-click="() => motorMove('z')">
<ft-button type="primary" :click-handle="() => motorMove('z')">
执行
</ft-button>
<ft-button type="primary" :on-click="() => motorStop('z')">
<ft-button type="primary" :click-handle="() => motorStop('z')">
停止
</ft-button>
<ft-button :on-click="() => motorToHome('z')">
<ft-button :click-handle="() => motorToHome('z')">
回原点
</ft-button>
</div>
@ -318,10 +318,10 @@ const highVoltageClose = async () => {
</el-radio>
</div>
</el-radio-group>
<ft-button type="primary" style="margin-left: 10px" :on-click="syringePumpInjectionVolumeSet">
<ft-button type="primary" style="margin-left: 10px" :click-handle="syringePumpInjectionVolumeSet">
开始
</ft-button>
<ft-button :on-click="syringePumpStop">
<ft-button :click-handle="syringePumpStop">
停止
</ft-button>
</div>
@ -331,10 +331,10 @@ const highVoltageClose = async () => {
<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" :on-click="highVoltageOpen">
<ft-button type="primary" style="margin-left: 10px" :click-handle="highVoltageOpen">
开启
</ft-button>
<ft-button :on-click="highVoltageClose">
<ft-button :click-handle="highVoltageClose">
关闭
</ft-button>
</div>
@ -344,20 +344,20 @@ const highVoltageClose = async () => {
<el-row :gutter="20">
<el-col :span="12">
<el-card style="display: flex;justify-content: center">
<ft-button type="primary" :on-click="lightingPanelOpen">
<ft-button type="primary" :click-handle="lightingPanelOpen">
开启照明灯
</ft-button>
<ft-button :on-click="lightingPanelClose">
<ft-button :click-handle="lightingPanelClose">
关闭照明灯
</ft-button>
<div style="margin-top: 10px;display: flex;justify-content: center">
<ft-button type="primary" :on-click="threeWayValveOpenSyringePipeline">
<ft-button type="primary" :click-handle="threeWayValveOpenSyringePipeline">
打开喷嘴管路
</ft-button>
<ft-button type="primary" :on-click="threeWayValveOpenNozzlePipeline">
<ft-button type="primary" :click-handle="threeWayValveOpenNozzlePipeline">
打开注射器管路
</ft-button>
<ft-button :on-click="threeWayValveCloseAll">
<ft-button :click-handle="threeWayValveCloseAll">
全部关闭
</ft-button>
</div>
@ -365,23 +365,23 @@ const highVoltageClose = async () => {
</el-col>
<el-col :span="12">
<el-card style="display: flex;justify-content: center">
<ft-button type="primary" :on-click="washValveOpen">
<ft-button type="primary" :click-handle="washValveOpen">
打开清洗阀
</ft-button>
<ft-button type="primary" :on-click="nozzleValveOpen">
<ft-button type="primary" :click-handle="nozzleValveOpen">
打开喷嘴阀
</ft-button>
<ft-button type="primary" :on-click="dehumidifierValveOpen">
<ft-button type="primary" :click-handle="dehumidifierValveOpen">
打开除湿阀
</ft-button>
<div style="margin-top: 10px;display: flex;justify-content: center">
<ft-button :on-click="washValveClose">
<ft-button :click-handle="washValveClose">
关闭清洗阀
</ft-button>
<ft-button :on-click="nozzleValveClose">
<ft-button :click-handle="nozzleValveClose">
关闭喷嘴阀
</ft-button>
<ft-button :on-click="dehumidifierValveClose">
<ft-button :click-handle="dehumidifierValveClose">
关闭除湿阀
</ft-button>
</div>

4
src/views/main/index.vue

@ -130,10 +130,10 @@ const slideTrayOut = async () => {
</ft-button>
</div>
<div>
<ft-button :on-click="slideTrayIn">
<ft-button :click-handle="slideTrayIn">
推入托盘
</ft-button>
<ft-button :on-click="slideTrayOut">
<ft-button :click-handle="slideTrayOut">
推出托盘
</ft-button>
</div>

57
src/views/spray/index.vue

@ -8,20 +8,14 @@ import route_horizontal from 'assets/images/route_horizontal.png'
import route_vertical_active from 'assets/images/route_vertical2.png'
import route_vertical from 'assets/images/route_vertical.png'
import Edit from 'components/martixCraft/Edit/index.vue'
import startSpray from 'components/spray/startSpray/index.vue'
import TrayGraph from 'components/spray/trayGraph/index.vue'
import { FtMessage } from 'libs/message'
import { socket } from 'libs/socket'
import { sendControl } from 'libs/utils'
import { useSystemStore } from 'stores/useSystemStore'
import { nextTick, onMounted, ref } from 'vue'
const systemStore = useSystemStore()
const sprayRefs = ref<any>([])
const wsList = ref<any>([])
const updateParam = () => {
updateForm.value = {
motorZHeight: form.value.motorZHeight, //
@ -84,8 +78,6 @@ const updateForm = ref({
movingSpeed: undefined, //
})
const visible = ref(false)
const formRef = ref()
const checkPosition = () => {
@ -134,16 +126,44 @@ const startWork = async () => {
},
}
console.log(params)
sendControl(params)
visible.value = true
wsList.value = []
socket.init(sprayTskReceiveMessage, 'spray_tsk')
socket.init(sprayPointReceiveMessage, 'spray_point')
await sendControl(params)
currentSpeed = Number(form.value.movingSpeed)
})
}
let currentSpeed = 0
let poll: ReturnType<typeof setInterval>
const sprayPointReceiveMessage = (data: any) => {
drawLine(data.index, data.point)
if (poll) {
clearInterval(poll)
}
const { currentPoint, nextPoint, index } = data
// mm
const moveDistance = currentSpeed / 2
// y
if (currentPoint.x === nextPoint.x) {
let currentY = currentPoint.y
poll = setInterval(() => {
currentY += moveDistance
if (currentY >= nextPoint.y) {
clearInterval(poll)
}
drawLine(index, { x: currentPoint.x * 5, y: currentY * 5 })
}, 500)
}
else if (currentPoint.y === nextPoint.y) {
// x
let currentX = currentPoint.x
poll = setInterval(() => {
currentX += moveDistance
if (currentX >= nextPoint.x) {
clearInterval(poll)
}
drawLine(index, { x: currentX * 5, y: currentPoint.y * 5 })
}, 500)
}
}
const drawLine = async (index: number, point: { x: number, y: number }) => {
@ -152,14 +172,10 @@ const drawLine = async (index: number, point: { x: number, y: number }) => {
sprayRefs.value[index].addLine()
}
})
console.log('drawLine', point)
sprayRefs.value[index].updateLine(point)
}
const sprayTskReceiveMessage = (data: any) => {
console.log(data)
wsList.value.push(data)
}
const pauseWork = async () => {
const params = {
cmdCode: 'matrix_spray_pause',
@ -182,6 +198,7 @@ const continueWork = async () => {
},
}
await sendControl(params)
currentSpeed = Number(form.value.movingSpeed)
}
const stopWork = async () => {
@ -289,7 +306,7 @@ const addCraft = () => {
<ft-button @click="continueWork">
继续喷涂
</ft-button>
<ft-button :disabled="systemStore.systemStatus.spraying" @click="stopWork">
<ft-button @click="stopWork">
结束喷涂
</ft-button>
</div>
@ -421,7 +438,7 @@ const addCraft = () => {
</div>
</el-form>
</el-drawer>
<start-spray v-model="wsList" :visible @close="visible = false" />
<!-- <start-spray v-model="wsList" :visible @close="visible = false" /> -->
<Edit v-if="addVisible" :matrix-list :form-data other-page @ok="ok" @cancel="addVisible = false" />
</div>
</template>

14
src/views/spraySet/index.vue

@ -205,13 +205,13 @@ const dehumidifierStop = async () => {
<el-input v-model="clearSpeed" type="number" style="width: 100px;margin:0 10px" />
<span>uL/min</span>
</div>
<ft-button ref="syringePipelineWashRef" type="primary" :on-click="syringePipelineWash">
<ft-button ref="syringePipelineWashRef" type="primary" :click-handle="syringePipelineWash">
清洗注射器管路
</ft-button>
<ft-button ref="nozzlePipelineWashRef" type="primary" :on-click="nozzlePipelineWash">
<ft-button ref="nozzlePipelineWashRef" type="primary" :click-handle="nozzlePipelineWash">
清洗喷嘴管路
</ft-button>
<ft-button :on-click="pipelineWashStop">
<ft-button :click-handle="pipelineWashStop">
停止清洗
</ft-button>
</div>
@ -231,10 +231,10 @@ const dehumidifierStop = async () => {
<el-input v-model="speed" type="number" style="width: 100px;margin:0 10px" />
<span>uL/min</span>
</div>
<ft-button ref="matrixPrefillRef" type="primary" :on-click="matrixPrefill">
<ft-button ref="matrixPrefillRef" type="primary" :click-handle="matrixPrefill">
开始预充
</ft-button>
<ft-button :on-click="matrixPrefillStop">
<ft-button :click-handle="matrixPrefillStop">
结束预充
</ft-button>
<!-- <ft-button @click="motorToHome">回原点</ft-button> -->
@ -260,10 +260,10 @@ const dehumidifierStop = async () => {
<el-input v-model="humidity" type="number" style="width: 100px;margin:0 10px" />
<span>%RH</span>
</div>
<ft-button ref="dehumidifierStartRef" type="primary" :on-click="dehumidifierStart">
<ft-button ref="dehumidifierStartRef" type="primary" :click-handle="dehumidifierStart">
开始除湿
</ft-button>
<ft-button :on-click="dehumidifierStop">
<ft-button :click-handle="dehumidifierStop">
停止除湿
</ft-button>
</div>

4
vite.config.ts

@ -76,8 +76,8 @@ export default defineConfig({
host: '0.0.0.0',
proxy: {
'/api': {
target: 'http://192.168.1.199:8080',
// target: 'http://192.168.1.200:8080',
// target: 'http://192.168.1.199:8080',
target: 'http://192.168.1.200:8080',
// secure: false,
changeOrigin: true, // 是否跨域
rewrite: path => path.replace(/^\/api/, 'api'),

Loading…
Cancel
Save