|
|
@ -10,14 +10,20 @@ |
|
|
|
<div class="operation_proposed"> |
|
|
|
<div class="top_btns"> |
|
|
|
<div class="two_btns"> |
|
|
|
<div class="active_btn">打开相机</div> |
|
|
|
<div class="default_btn">关闭相机</div> |
|
|
|
<div class="active_btn" @click="handleStartCpature">打开相机</div> |
|
|
|
<div class="default_btn" @click="handleStopCpature">关闭相机</div> |
|
|
|
</div> |
|
|
|
<div class="two_btns"> |
|
|
|
<div class="active_btn">打开光源</div> |
|
|
|
<div class="default_btn">关闭光源</div> |
|
|
|
<div class="active_btn" @click="handleOpenFlashLight"> |
|
|
|
打开闪光灯 |
|
|
|
</div> |
|
|
|
<div class="default_btn" @click="handleCloseFlashLight"> |
|
|
|
关闭闪光灯 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="active_btn" @click="handleGetMechanicalArmState"> |
|
|
|
获取机械臂坐标 |
|
|
|
</div> |
|
|
|
<div class="active_btn">获取机械臂坐标</div> |
|
|
|
</div> |
|
|
|
<div class="camera_param"> |
|
|
|
<div class="slider_wrap mb50"> |
|
|
@ -52,9 +58,14 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="camera_image"> |
|
|
|
<div class="active_btn" @click="handleSetFlashBrightness"> |
|
|
|
修改通道亮度 |
|
|
|
</div> |
|
|
|
<div class="active_btn">实时</div> |
|
|
|
<div class="active_btn">拍照</div> |
|
|
|
<div class="active_btn">识别</div> |
|
|
|
<div class="active_btn" @click="handleTakePhoto">拍照</div> |
|
|
|
<div class="active_btn" @click="handleStartCharacterRecognition"> |
|
|
|
识别 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="identify_results"> |
|
|
|
<p class="title">识别结果</p> |
|
|
@ -70,6 +81,21 @@ |
|
|
|
|
|
|
|
<script setup> |
|
|
|
import { ref, onMounted, onUnmounted } from 'vue' |
|
|
|
import { |
|
|
|
startCapture, |
|
|
|
stopCapture, |
|
|
|
getCameraState, |
|
|
|
takePhoto, |
|
|
|
startCharacterRecognition, |
|
|
|
getCharacterRecognitionResult, |
|
|
|
stopCharacterRecognition, |
|
|
|
getMechanicalArmState, |
|
|
|
openFlashLight, |
|
|
|
closeFlashLight, |
|
|
|
setFlashBrightnessAnalog, |
|
|
|
setFlashBrightnessDigital, |
|
|
|
} from '@/command' |
|
|
|
|
|
|
|
const simulation_brightness = ref(0) |
|
|
|
const brightness_1 = ref(0) |
|
|
|
const brightness_2 = ref(0) |
|
|
@ -77,6 +103,50 @@ const brightness_3 = ref(0) |
|
|
|
const brightness_4 = ref(0) |
|
|
|
const exposure = ref(0) |
|
|
|
|
|
|
|
const handleStartCpature = () => { |
|
|
|
websocketsend(startCapture) |
|
|
|
} |
|
|
|
const handleStopCpature = () => { |
|
|
|
websocketsend(stopCapture) |
|
|
|
} |
|
|
|
const handleGetCameraState = () => { |
|
|
|
websocketsend(getCameraState) |
|
|
|
} |
|
|
|
const handleTakePhoto = () => { |
|
|
|
// 拍照前需要确保相机是打开状态 |
|
|
|
handleGetCameraState() |
|
|
|
// 如果相机打开则发送拍照,如果相机关闭 则提醒用户 |
|
|
|
websocketsend(takePhoto) |
|
|
|
} |
|
|
|
|
|
|
|
const handleStartCharacterRecognition = () => { |
|
|
|
websocketsend(startCharacterRecognition) |
|
|
|
} |
|
|
|
const handleStopCharacterRecognition = () => { |
|
|
|
websocketsend(stopCharacterRecognition) |
|
|
|
} |
|
|
|
const handleGetCharacterRecognitionResult = () => { |
|
|
|
websocketsend(getCharacterRecognitionResult) |
|
|
|
} |
|
|
|
const handleGetMechanicalArmState = () => { |
|
|
|
websocketsend(getMechanicalArmState) |
|
|
|
} |
|
|
|
|
|
|
|
const handleOpenFlashLight = () => { |
|
|
|
websocketsend(openFlashLight) |
|
|
|
} |
|
|
|
const handleCloseFlashLight = () => { |
|
|
|
websocketsend(closeFlashLight) |
|
|
|
} |
|
|
|
|
|
|
|
const handleSetFlashBrightness = () => { |
|
|
|
websocketsend(setFlashBrightnessAnalog(simulation_brightness.value)) |
|
|
|
websocketsend(setFlashBrightnessDigital(1, brightness_1.value)) |
|
|
|
websocketsend(setFlashBrightnessDigital(2, brightness_2.value)) |
|
|
|
websocketsend(setFlashBrightnessDigital(3, brightness_3.value)) |
|
|
|
websocketsend(setFlashBrightnessDigital(4, brightness_4.value)) |
|
|
|
} |
|
|
|
|
|
|
|
// 是否真正建立连接 |
|
|
|
const lockReconnect = ref(false) |
|
|
|
// 断开 重连倒计时 |
|
|
@ -101,6 +171,8 @@ const reconnect = () => { |
|
|
|
|
|
|
|
// 接收到消息后改变状态 |
|
|
|
const websocketonmessage = e => { |
|
|
|
// 相机启动停止后接收到回执 而后发送获取相机状态指令 实时改变页面状态 |
|
|
|
|
|
|
|
console.log(e.data) |
|
|
|
} |
|
|
|
|
|
|
@ -114,6 +186,7 @@ const websocketonerror = () => { |
|
|
|
|
|
|
|
// 发送消息 |
|
|
|
const websocketsend = data => { |
|
|
|
console.log(data) |
|
|
|
websock.value.send(data) |
|
|
|
} |
|
|
|
|
|
|
|