梳理了前端检测页面的交互处理逻辑
This commit is contained in:
parent
d1738c3e42
commit
2a3d168e50
@ -947,7 +947,7 @@ def handle_disconnect():
|
||||
logger.info('客户端已断开连接')
|
||||
|
||||
# 原始的start_video处理逻辑（暂时注释）
|
||||
@socketio.on('start_video')
|
||||
@socketio.on('start_video_stream')
|
||||
def handle_start_video(data=None):
|
||||
try:
|
||||
results = {'status': 'success', 'cameras': {}}
|
||||
@ -996,7 +996,7 @@ def handle_start_video(data=None):
|
||||
logger.error(f'启动视频流失败: {e}', exc_info=True)
|
||||
emit('video_status', {'status': 'error', 'message': f'启动失败: {str(e)}'})
|
||||
|
||||
@socketio.on('stop_video')
|
||||
@socketio.on('stop_video_stream')
|
||||
def handle_stop_video(data=None):
|
||||
logger.info(f'收到stop_video事件，数据: {data}')
|
||||
|
||||
|
||||
@ -26,36 +26,13 @@
|
||||
--el-button-border-color: transparent ">
|
||||
结束
|
||||
</el-button>
|
||||
<el-button v-if="isStart && isConnected" @click="handleScreenshot" type="primary" class="start-btn" style="background-image: linear-gradient(to right, #FBB106, #A817C6);
|
||||
<el-button v-if="isStart && isConnected" @click="saveDetectionData" type="primary" class="start-btn" style="background-image: linear-gradient(to right, #FBB106, #A817C6);
|
||||
--el-button-border-color: #409EFF;
|
||||
--el-button-border-color: transparent ">
|
||||
保存数据
|
||||
</el-button>
|
||||
<!-- <el-button
|
||||
@click="handleStartStopRecording"
|
||||
:disabled="!isConnected"
|
||||
type="warning"
|
||||
class="start-btn"
|
||||
style="background-image: linear-gradient(to right, rgb(255, 193, 7), rgb(255, 87, 34));
|
||||
--el-button-border-color: #409EFF;
|
||||
--el-button-border-color: transparent; margin-left: 10px;"
|
||||
>
|
||||
{{ isRecording ? '停止录制' : '开始录制' }}
|
||||
</el-button> -->
|
||||
<!-- <el-button
|
||||
v-if="isStart == true"
|
||||
@click="handleDataCollection"
|
||||
:loading="dataCollectionLoading"
|
||||
type="success"
|
||||
style="width: 120px;background-image: linear-gradient(to right, rgb(40, 167, 69), rgb(25, 135, 84));
|
||||
--el-button-border-color: #409EFF;
|
||||
--el-button-border-color: transparent; margin-left: 10px;"
|
||||
>
|
||||
检测数据采集
|
||||
</el-button> -->
|
||||
</div>
|
||||
|
||||
|
||||
<div class="top-bar-right">
|
||||
<span class="info-item">测试时间：2025/5/28 下午14:38</span>
|
||||
<span class="info-item">测试医生：李四</span>
|
||||
@ -509,8 +486,10 @@ function connectWebSocket() {
|
||||
socket.on('connect', () => {
|
||||
console.log('✅ WebSocket连接成功！Socket ID:', socket.id)
|
||||
isConnected.value = true
|
||||
// 连接成功后自动开始RTSP播放（仅播放视频，不创建会话）
|
||||
startRtsp()
|
||||
// 连接成功后自动启动视频流、IMU流和压力传感器流
|
||||
startVideoStream()
|
||||
startIMUStreaming();
|
||||
startPressureStreaming();
|
||||
})
|
||||
|
||||
// 连接失败事件
|
||||
@ -528,7 +507,9 @@ function connectWebSocket() {
|
||||
socket.on('disconnect', (reason) => {
|
||||
console.log('⚠️ 连接断开:', reason)
|
||||
isConnected.value = false
|
||||
hideVideo()
|
||||
stopVideoStream()
|
||||
stopIMUStreaming()
|
||||
stopPressureStreaming()
|
||||
// 如果正在录像，停止录像
|
||||
if (isRecording.value) {
|
||||
stopRecording()
|
||||
@ -536,6 +517,7 @@ function connectWebSocket() {
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
// 监听视频状态事件
|
||||
socket.on('video_status', (data) => {
|
||||
console.log('📺 视频状态:', data)
|
||||
@ -552,10 +534,6 @@ function connectWebSocket() {
|
||||
displayDepthCameraFrame(data.image)
|
||||
})
|
||||
|
||||
// 监听错误事件
|
||||
socket.on('error', (error) => {
|
||||
console.error('❌ Socket错误:', error)
|
||||
})
|
||||
|
||||
// 监听IMU状态事件
|
||||
socket.on('imu_status', (data) => {
|
||||
@ -589,29 +567,25 @@ function connectWebSocket() {
|
||||
handlePressureData(data)
|
||||
})
|
||||
|
||||
// 监听错误事件
|
||||
socket.on('error', (error) => {
|
||||
console.error('❌ Socket错误:', error)
|
||||
})
|
||||
|
||||
|
||||
} catch (error) {
|
||||
console.error('💥 连接异常:', error.message)
|
||||
isConnected.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// 断开WebSocket连接
|
||||
function disconnectWebSocket() {
|
||||
if (socket) {
|
||||
socket.disconnect()
|
||||
socket = null
|
||||
console.log('主动断开连接')
|
||||
isConnected.value = false
|
||||
hideVideo()
|
||||
}
|
||||
}
|
||||
|
||||
// 启动视频流
|
||||
function startRtsp() {
|
||||
// 启动视频推流
|
||||
function startVideoStream() {
|
||||
if (socket && socket.connected) {
|
||||
console.log('🚀 发送start_video事件')
|
||||
|
||||
socket.emit('start_video', {}, (ack) => {
|
||||
socket.emit('start_video_stream', {}, (ack) => {
|
||||
if (ack) {
|
||||
console.log('✅ start_video事件已确认:', ack)
|
||||
} else {
|
||||
@ -634,10 +608,10 @@ function startRtsp() {
|
||||
}
|
||||
|
||||
// 停止视频流
|
||||
function stopRtsp() {
|
||||
function stopVideoStream() {
|
||||
if (socket && socket.connected) {
|
||||
console.log('🛑 发送stop_video事件')
|
||||
socket.emit('stop_video', {}, (ack) => {
|
||||
socket.emit('stop_video_stream', {}, (ack) => {
|
||||
if (ack) {
|
||||
console.log('✅ stop_video事件已确认:', ack)
|
||||
} else {
|
||||
@ -667,11 +641,6 @@ function displayDepthCameraFrame(base64Image) {
|
||||
}
|
||||
}
|
||||
|
||||
// 隐藏视频
|
||||
function hideVideo() {
|
||||
rtspImgSrc.value = ''
|
||||
depthCameraImgSrc.value = ''
|
||||
}
|
||||
|
||||
// 处理IMU头部姿态数据
|
||||
function handleIMUData(data) {
|
||||
@ -777,19 +746,7 @@ function stopPressureStreaming() {
|
||||
}
|
||||
}
|
||||
|
||||
// 手动开始/停止录制功能
|
||||
function handleStartStopRecording() {
|
||||
if (!isConnected.value) {
|
||||
ElMessage.warning('WebSocket未连接，无法操作')
|
||||
return
|
||||
}
|
||||
|
||||
if (isRecording.value) {
|
||||
stopRecording()
|
||||
} else {
|
||||
startRecording()
|
||||
}
|
||||
}
|
||||
|
||||
// 检测数据采集功能
|
||||
async function handleDataCollection() {
|
||||
@ -880,8 +837,9 @@ async function handleDataCollection() {
|
||||
}
|
||||
}
|
||||
|
||||
// 截图功能（保留原有功能）
|
||||
async function handleScreenshot() {
|
||||
// 保存检测数据
|
||||
|
||||
async function saveDetectionData() {
|
||||
if (screenshotLoading.value) return
|
||||
|
||||
try {
|
||||
@ -917,7 +875,7 @@ async function handleScreenshot() {
|
||||
}
|
||||
|
||||
// 调用后端API保存截图
|
||||
const result = await saveScreenshot({
|
||||
const result = await sendDetectionData({
|
||||
patientId: patientInfo.value.id,
|
||||
patientName: patientInfo.value.name,
|
||||
sessionId: patientInfo.value.sessionId,
|
||||
@ -960,21 +918,9 @@ async function handleScreenshot() {
|
||||
}
|
||||
}
|
||||
|
||||
// 生成检查记录ID
|
||||
function generateSessionId() {
|
||||
const now = new Date()
|
||||
const year = now.getFullYear()
|
||||
const month = String(now.getMonth() + 1).padStart(2, '0')
|
||||
const day = String(now.getDate()).padStart(2, '0')
|
||||
const hour = String(now.getHours()).padStart(2, '0')
|
||||
const minute = String(now.getMinutes()).padStart(2, '0')
|
||||
const second = String(now.getSeconds()).padStart(2, '0')
|
||||
// 调用后端API保存检测数据
|
||||
async function sendDetectionData(data) {
|
||||
|
||||
return `${year}${month}${day}${hour}${minute}${second}`
|
||||
}
|
||||
|
||||
// 调用后端API保存截图
|
||||
async function saveScreenshot(data) {
|
||||
try {
|
||||
const response = await fetch(`${BACKEND_URL}/api/detection/${patientInfo.value.sessionId}/collect`
|
||||
, {
|
||||
@ -1372,41 +1318,8 @@ async function stopDetection() {
|
||||
if (isRecording.value) {
|
||||
stopRecording()
|
||||
}
|
||||
// saveRecording()
|
||||
isStart.value = false
|
||||
|
||||
// // 调用后端API停止检测会话
|
||||
// if (patientInfo.value.sessionId) {
|
||||
|
||||
// const response = await fetch(`${BACKEND_URL}/api/detection/${patientInfo.value.sessionId}/stop`, {
|
||||
// method: 'POST',
|
||||
// headers: {
|
||||
// 'Content-Type': 'application/json'
|
||||
// },
|
||||
// body: JSON.stringify({
|
||||
// duration: duration
|
||||
// })
|
||||
// })
|
||||
|
||||
// if (response.ok) {
|
||||
// const result = await response.json()
|
||||
// if (result.success) {
|
||||
// console.log('✅ 检测会话已停止')
|
||||
// //停止弹出诊断信息
|
||||
// dialogVisible.value = true
|
||||
// if (result.duration) {
|
||||
// console.log(`⏱️ 检测持续时间: ${result.duration}秒`)
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// dialogVisible.value = true
|
||||
// // 清除检测开始时间和会话ID
|
||||
// patientInfo.value.detectionStartTime = null
|
||||
// // patientInfo.value.sessionId = null
|
||||
|
||||
// ElMessage.success('检测已停止，视频继续播放')
|
||||
|
||||
} catch (error) {
|
||||
console.error('❌ 停止检测失败:', error)
|
||||
ElMessage.error(`停止检测失败: ${error.message}`)
|
||||
@ -1450,16 +1363,17 @@ const loadPatientInfo = async () => {
|
||||
|
||||
// 处理页面关闭或刷新事件
|
||||
const handleBeforeUnload = () => {
|
||||
// 停止录像（如果正在录像）
|
||||
if (isRecording.value) {
|
||||
stopRecording()
|
||||
}
|
||||
// 停止检测（如果正在检测）
|
||||
if (isStart.value) {
|
||||
stopDetection()
|
||||
}
|
||||
// 停止视频播放
|
||||
stopRtsp()
|
||||
stopVideoStream()
|
||||
// 停止IMU流
|
||||
stopIMUStreaming()
|
||||
// 停止压力传感器流
|
||||
stopPressureStreaming()
|
||||
|
||||
// 断开WebSocket连接
|
||||
if (socket) {
|
||||
socket.disconnect()
|
||||
|
||||
Loading…
Reference in New Issue
Block a user