diff --git a/.env b/.env index 28520ca..2d9d4a0 100644 --- a/.env +++ b/.env @@ -1,4 +1,5 @@ VITE_BASE_URL=http://192.168.1.111:8899 VITE_WEBSOCKET_JAVA_URL=ws://127.0.0.1:8899/websocket/nuclear -VITE_WEBSOCKET_CAMERA_URL=ws://127.0.0.1:8899/websocket/nuclear -# VITE_WEBSOCKET_CAMERA_URL=ws://192.168.1.194:8080/ws/cmd \ No newline at end of file +# VITE_WEBSOCKET_CAMERA_URL=ws://127.0.0.1:8899/websocket/nuclear +VITE_WEBSOCKET_CAMERA_URL=ws://192.168.1.194:8081/ws/cmd +VITE_HOST_URL=http://192.168.1.194:8081/ \ No newline at end of file diff --git a/src/command/index.js b/src/command/index.js index af681eb..da14262 100644 --- a/src/command/index.js +++ b/src/command/index.js @@ -12,21 +12,21 @@ const transformToString = data => { export const startCapture = transformToString({ command: 'startCapture', autoRestart: true, - messageId: uuidv4(), + messageId: 'startCapture', need_receipt: true, }) // 停止相机 export const stopCapture = transformToString({ command: 'stopCapture', - messageId: uuidv4(), + messageId: 'stopCapture', need_receipt: true, }) // 获取相机状态 export const getCameraState = transformToString({ command: 'getCameraState', - messageId: uuidv4(), + messageId: 'getCameraState', need_receipt: true, }) @@ -87,7 +87,7 @@ export const stopCharacterRecognition = transformToString({ // 获取识别结果 export const getCharacterRecognitionResult = transformToString({ command: 'getCharacterRecognitionResult', - messageId: uuidv4(), + messageId: 'getCharacterRecognitionResult', need_receipt: true, }) @@ -105,6 +105,13 @@ export const getMechanicalArmState = transformToString({ need_receipt: true, }) +export const getCameraParametersInteger = transformToString({ + command: 'getCameraParametersInteger', + pName: 'ExposureTimeRaw', + messageId: 'getCameraParametersInteger', + need_receipt: true, +}) + /** * 通道1亮度 = 模拟通道亮度*数字通道1亮度 * 通道2亮度 = 模拟通道亮度*数字通道1亮度 @@ -121,6 +128,12 @@ export const setFlashBrightnessAnalog = brightness => need_receipt: true, }) +export const getFlashBrightnessAnalog = transformToString({ + command: 'getFlashBrightnessAnalog', + messageId: 'getFlashBrightnessAnalog', + need_receipt: true, +}) + // 设置数字通道亮度 export const setFlashBrightnessDigital = (channel, brightness) => { return transformToString({ @@ -135,13 +148,22 @@ export const setFlashBrightnessDigital = (channel, brightness) => { // 打开闪光灯 export const openFlashLight = transformToString({ command: 'openFlashLight', - messageId: uuidv4(), + messageId: 'openFlashLight', need_receipt: true, }) // 关闭闪光灯 export const closeFlashLight = transformToString({ command: 'CloseFlashLight', - messageId: uuidv4(), + messageId: 'CloseFlashLight', need_receipt: true, }) + +export const setExposureTimeRaw = value => + transformToString({ + command: 'setCameraParametersInteger', + pName: 'ExposureTimeRaw', + value, + messageId: uuidv4(), + need_receipt: true, + }) diff --git a/src/components/Debug.vue b/src/components/Debug.vue index c53de9c..ab73e9e 100644 --- a/src/components/Debug.vue +++ b/src/components/Debug.vue @@ -10,14 +10,30 @@
-
打开相机
-
关闭相机
+
+ 打开相机 +
+
+ 关闭相机 +
-
+
打开闪光灯
-
+
关闭闪光灯
@@ -28,53 +44,60 @@

模拟通道亮度

- +

{{ simulation_brightness }}

-
-

通道1亮度

- -

{{ brightness_1 }}

-
-
-

通道2亮度

- -

{{ brightness_2 }}

-
-
-

通道3亮度

- -

{{ brightness_3 }}

-
-
-

通道4亮度

- -

{{ brightness_4 }}

-

曝光时间

- +

{{ exposure }}

-
- 修改通道亮度 -
-
实时
拍照
-
+
识别

识别结果

+
{{ recognitionResult }}

实时照片

-
+
+ + + + + +
+
@@ -85,38 +108,60 @@ import { startCapture, stopCapture, getCameraState, - takePhoto, + takeAndSavePhoto, startCharacterRecognition, getCharacterRecognitionResult, stopCharacterRecognition, + getFlashBrightnessAnalog, getMechanicalArmState, openFlashLight, closeFlashLight, setFlashBrightnessAnalog, - setFlashBrightnessDigital, + setExposureTimeRaw, + getCameraParametersInteger, } from '@/command' +import { MessagePlugin } from 'tdesign-vue-next' + +const photoUrl = ref('') +const recognitionResult = ref({}) + +setInterval( + () => { + photoUrl.value = `${ + import.meta.env.VITE_HOST_URL + }app/core/realtime_photo/now.png?${Math.random()}` + }, + 500, + 500, +) const simulation_brightness = ref(0) -const brightness_1 = ref(0) -const brightness_2 = ref(0) -const brightness_3 = ref(0) -const brightness_4 = ref(0) const exposure = ref(0) +const flashStatus = ref(false) + +// 相机参数 +const isCameraOpen = ref(false) const handleStartCpature = () => { - websocketsend(startCapture) + if (!isCameraOpen.value) { + websocketsend(startCapture) + } } const handleStopCpature = () => { - websocketsend(stopCapture) + if (isCameraOpen.value) { + websocketsend(stopCapture) + } } const handleGetCameraState = () => { websocketsend(getCameraState) } const handleTakePhoto = () => { - // 拍照前需要确保相机是打开状态 - handleGetCameraState() - // 如果相机打开则发送拍照,如果相机关闭 则提醒用户 - websocketsend(takePhoto) + if (isCameraOpen.value) { + // 如果相机打开则发送拍照,如果相机关闭 则提醒用户 + websocketsend(takeAndSavePhoto) + } else { + MessagePlugin('error', { content: '请先开启相机' }) + } } const handleStartCharacterRecognition = () => { @@ -133,18 +178,26 @@ const handleGetMechanicalArmState = () => { } const handleOpenFlashLight = () => { - websocketsend(openFlashLight) + if (isOpenCamera()) { + if (!flashStatus.value) { + websocketsend(openFlashLight) + } + } } const handleCloseFlashLight = () => { - websocketsend(closeFlashLight) + if (isOpenCamera()) { + if (flashStatus.value) { + 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 isOpenCamera = () => { + if (!isCameraOpen.value) { + MessagePlugin('error', { content: '请先打开相机' }) + return false + } + return true } // 是否真正建立连接 @@ -172,12 +225,57 @@ const reconnect = () => { // 接收到消息后改变状态 const websocketonmessage = e => { // 相机启动停止后接收到回执 而后发送获取相机状态指令 实时改变页面状态 - - console.log(e.data) + const data = JSON.parse(e.data) + console.log(data) + const { messageId, success } = data + if (success) { + switch (messageId) { + case 'startCapture': + MessagePlugin('success', { content: '开启相机成功' }) + handleGetCameraState() + break + case 'stopCapture': + MessagePlugin('success', { content: '关闭相机成功' }) + handleGetCameraState() + break + case 'getCameraState': + const { cameraState } = data + const { isOpen } = cameraState + isCameraOpen.value = isOpen + break + case 'getCameraParametersInteger': + const { value } = data + exposure.value = value + break + case 'openFlashLight': + flashStatus.value = true + break + case 'CloseFlashLight': + flashStatus.value = false + break + case 'getFlashBrightnessAnalog': + const { brightness } = data + simulation_brightness.value = brightness + break + case 'getCharacterRecognitionResult': + const { result } = data + recognitionResult.value = result + break + default: + break + } + } else { + MessagePlugin('error', { content: 'ws发送指令执行错误' }) + } } const websocketonopen = () => { - console.log('客户端链接1!!!') + console.log('客户端链接成功!!!') + handleGetCameraState() + websocketsend(getCameraParametersInteger) + // 无法获取当前闪光灯是开是关。建议上层代码,初始化时候关闭闪光灯,然后在本地保存一个当前状态 + handleCloseFlashLight() + websocketsend(getFlashBrightnessAnalog) } const websocketonerror = () => { @@ -186,7 +284,6 @@ const websocketonerror = () => { // 发送消息 const websocketsend = data => { - console.log(data) websock.value.send(data) } @@ -210,6 +307,19 @@ const initWebSocket = () => { initWebSocket() +// 业务处理 +const handleExposureTime = value => { + if (isOpenCamera()) { + websocketsend(setExposureTimeRaw(value)) + } +} + +const handleSimulationBrightness = value => { + if (isOpenCamera()) { + websocketsend(setFlashBrightnessAnalog(value)) + } +} + onUnmounted(() => { websock.value.close() }) @@ -326,6 +436,9 @@ onUnmounted(() => { letter-spacing: 0.07em; color: #191919; } + .result { + padding: 10px 0; + } } } } @@ -344,12 +457,20 @@ onUnmounted(() => { letter-spacing: 0.07em; color: #191919; } - .photo { + .default_photo { flex: 1; width: 100%; border-radius: 6px; + display: flex; + align-items: center; + justify-content: center; background: #ebebeb; } + .photo { + flex: 1; + width: 100%; + border-radius: 6px; + } } }