添加刷新按钮
This commit is contained in:
parent
8b3c1b9ec5
commit
50daf3f070
@ -65,9 +65,15 @@
|
||||
身体姿态
|
||||
</div>
|
||||
</div>
|
||||
<div :style="{ color: femtoboltStatus == '已连接' ? '#00CC33' : '#808080' }"
|
||||
style="font-size: 14px;">
|
||||
{{ femtoboltStatus }}</div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<img src="@/assets/refresh.png" title="刷新身体姿态数据"
|
||||
@click="refreshClick('femtobolt')"
|
||||
alt="" style="margin-right: 5px;cursor: pointer;">
|
||||
<div :style="{ color: femtoboltStatus == '已连接' ? '#00CC33' : '#808080' }"
|
||||
style="font-size: 14px;">
|
||||
{{ femtoboltStatus }}</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div ref="wholeBodyRef" style="display: flex;justify-content: center;height:calc( 100% - 40px);padding-top: 0px;">
|
||||
<!-- 使用深度相机视频流替换静态图片 -->
|
||||
@ -85,29 +91,36 @@
|
||||
<div style="display: flex;">
|
||||
<div class="module-header">
|
||||
<div style="display: flex;align-items: center;">
|
||||
<div class="module-title" style="width:230px">
|
||||
<div class="module-title" style="width:380px">
|
||||
<div class="module-title-bg">
|
||||
<img src="@/assets/svg/u67.svg" alt="" srcset="" style="margin-right: 5px;">
|
||||
头部姿态
|
||||
</div>
|
||||
<el-button type="primary" class="start-btn" @click="calibrationClick" :disabled="isRecording"
|
||||
style="background-color: #0099ff;font-size: 14px;
|
||||
--el-button-border-color: transparent !important;border-radius: 20px;height:26px;border:none;width: 100px;">
|
||||
校准
|
||||
</el-button>
|
||||
<div>
|
||||
<el-button type="primary" class="start-btn" @click="calibrationClick" :disabled="isRecording"
|
||||
style="background-color: #0099ff;font-size: 14px;
|
||||
--el-button-border-color: transparent !important;border-radius: 20px;height:26px;border:none;width: 100px;">
|
||||
校准
|
||||
</el-button>
|
||||
<el-button type="primary" class="start-btn" @click="clearAndStartTracking" :disabled="isRecording"
|
||||
style="background-color: #0099ff;font-size: 14px;margin-left: 15px;
|
||||
--el-button-border-color: transparent !important;border-radius: 20px;height:26px;border:none;width: 100px;">
|
||||
清零
|
||||
</el-button>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div style="display: flex;align-items: center;">
|
||||
<img src="@/assets/refresh.png" title="刷新头部姿态数据"
|
||||
@click="refreshClick('imu')"
|
||||
alt="" style="margin-right: 5px;cursor: pointer;">
|
||||
<div :style="{ color: imuStatus == '已连接' ? '#00CC33' : '#808080' }" style="font-size: 14px;">{{
|
||||
imuStatus
|
||||
}}</div>
|
||||
<el-button type="primary" class="start-btn" @click="clearAndStartTracking" :disabled="isRecording"
|
||||
style="background-color: #0099ff;font-size: 14px;margin-left: 15px;
|
||||
--el-button-border-color: transparent !important;border-radius: 20px;height:26px;border:none;width: 100px;">
|
||||
清零
|
||||
</el-button>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -169,8 +182,13 @@
|
||||
足部压力
|
||||
</div>
|
||||
</div>
|
||||
<div :style="{ color: pressureStatus == '已连接' ? '#00CC33' : '#808080' }" style="font-size: 14px;">{{
|
||||
pressureStatus }}</div>
|
||||
<div style="display: flex;align-items: center;">
|
||||
<img src="@/assets/refresh.png" title="刷新足部压力数据"
|
||||
@click="refreshClick('pressure')"
|
||||
alt="" style="margin-right: 5px;cursor: pointer;">
|
||||
<div :style="{ color: pressureStatus == '已连接' ? '#00CC33' : '#808080' }" style="font-size: 14px;">{{
|
||||
pressureStatus }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="
|
||||
@ -331,7 +349,12 @@
|
||||
视频
|
||||
</div>
|
||||
</div>
|
||||
<div :style="{ color: cameraStatus == '已连接' ? '#00CC33' : '#808080' }" style="font-size: 14px;">{{ cameraStatus }}</div>
|
||||
<div style="display: flex;align-items: center;">
|
||||
<img src="@/assets/refresh.png" title="刷新视频数据"
|
||||
@click="refreshClick('camera')"
|
||||
alt="" style="margin-right: 5px;cursor: pointer;">
|
||||
<div :style="{ color: cameraStatus == '已连接' ? '#00CC33' : '#808080' }" style="font-size: 14px;">{{ cameraStatus }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div ref="videoImgRef" style="width: 100%;height: calc(100% - 47px)">
|
||||
@ -597,6 +620,7 @@ let cameraSocket = null
|
||||
let femtoboltSocket = null
|
||||
let imuSocket = null
|
||||
let pressureSocket = null
|
||||
let restartSocket = null
|
||||
let frameCount = 0
|
||||
|
||||
// 后端服务器地址配置
|
||||
@ -870,6 +894,14 @@ const savePatient = async () => {
|
||||
}
|
||||
}
|
||||
function routeTo(path) {
|
||||
if( isPreventCombo.value == true){
|
||||
setTimeout(() => {
|
||||
isPreventCombo.value = false
|
||||
}, 2000);
|
||||
ElMessage.warning(`请勿连击点击刷新按钮`)
|
||||
return
|
||||
}
|
||||
isPreventCombo.value = true
|
||||
router.push(`/`)
|
||||
}
|
||||
function cameraUpdate() { // 相机设置数据更新弹框
|
||||
@ -941,7 +973,12 @@ function connectWebSocket() {
|
||||
pressureSocket.disconnect()
|
||||
pressureSocket = null
|
||||
}
|
||||
if (restartSocket) {
|
||||
restartSocket.disconnect()
|
||||
restartSocket = null
|
||||
}
|
||||
|
||||
|
||||
// 创建主Socket.IO连接
|
||||
socket = io(BACKEND_URL, {
|
||||
transports: ['websocket', 'polling'], // 只使用polling,与后端保持一致
|
||||
@ -964,7 +1001,7 @@ function connectWebSocket() {
|
||||
femtoboltSocket = devicesSocket
|
||||
imuSocket = devicesSocket
|
||||
pressureSocket = devicesSocket
|
||||
|
||||
restartSocket = devicesSocket
|
||||
// 主连接事件
|
||||
socket.on('connect', () => {
|
||||
console.log('✅ 主WebSocket连接成功!Socket ID:', socket.id)
|
||||
@ -1046,7 +1083,12 @@ function connectWebSocket() {
|
||||
tempInfo.value.camera_frame = data
|
||||
displayFrame(data.image)
|
||||
})
|
||||
devicesSocket.on('device_restart_message', (data) => {
|
||||
debugger
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
devicesSocket.on('femtobolt_frame', (data) => {
|
||||
tempInfo.value.femtobolt_frame = data
|
||||
@ -1147,6 +1189,8 @@ function disconnectWebSocket() {
|
||||
femtoboltSocket = null
|
||||
imuSocket = null
|
||||
pressureSocket = null
|
||||
restartSocket = null
|
||||
|
||||
console.log('🔗 统一设备命名空间连接已断开')
|
||||
}
|
||||
|
||||
@ -1626,7 +1670,14 @@ async function handleStartStop() {
|
||||
ElMessage.warning('WebSocket未连接,无法操作')
|
||||
return
|
||||
}
|
||||
|
||||
if( isPreventCombo.value == true){
|
||||
setTimeout(() => {
|
||||
isPreventCombo.value = false
|
||||
}, 2000);
|
||||
ElMessage.warning(`请勿连击点击刷新按钮`)
|
||||
return
|
||||
}
|
||||
isPreventCombo.value = true
|
||||
if (isStart.value) {
|
||||
// 停止录制视频
|
||||
await stopRecord()
|
||||
@ -2043,7 +2094,41 @@ const stopRecord = async () => { // 停止录屏
|
||||
}
|
||||
function routerClick(){
|
||||
historyDialogVisible.value = true
|
||||
// router.push(`/patient/${patientInfo.value.id}`)
|
||||
}
|
||||
|
||||
|
||||
const isPreventCombo =ref(false) // 防止连击
|
||||
|
||||
// 单个刷新数据
|
||||
function refreshClick(type) {
|
||||
if( isPreventCombo.value == true){
|
||||
setTimeout(() => {
|
||||
isPreventCombo.value = false
|
||||
}, 5000);
|
||||
ElMessage.warning(`请勿连击点击刷新按钮`)
|
||||
return
|
||||
}
|
||||
isPreventCombo.value = true
|
||||
if (devicesSocket && devicesSocket.connected) {
|
||||
console.log('🚀 发送重启设备请求...')
|
||||
debugger
|
||||
if(type == 'camera'){
|
||||
devicesSocket.emit('restart_device', { device_type: 'camera' })
|
||||
}else if(type == 'femtobolt'){
|
||||
devicesSocket.emit('restart_device', { device_type: 'femtobolt' })
|
||||
}else if(type == 'imu'){
|
||||
devicesSocket.emit('restart_device', { device_type: 'imu' })
|
||||
}else if(type == 'pressure'){
|
||||
devicesSocket.emit('restart_device', { device_type: 'pressure' })
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
} else {
|
||||
console.warn('⚠️ 设备Socket未连接,无法启动设备数据推送')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user