ThbTech/BodyBalanceEvaluation
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改

Browse Source
This commit is contained in:
jingna 2025-08-05 18:22:24 +08:00
parent 830a5520cb
commit 5dd55a2a40
1 changed files with 61 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

124
frontend/src/renderer/src/views/Detection.vue
View File

@ -120,7 +120,8 @@
<el-button <el-button
type="primary" type="primary"
class="start-btn" class="start-btn"
style="background-image: linear-gradient(to right, rgb(236, 50, 166), rgb(160, 5, 216)); --el-button-border-color: transparent !important" style="background-image: linear-gradient(to right, rgb(236, 50, 166), rgb(160, 5, 216));
--el-button-border-color: transparent !important;border-radius: 20px;border:none;width: 150px;"
> >
清零 清零
</el-button> </el-button>
@ -130,35 +131,24 @@
<!-- 仪表盘区域 --> <!-- 仪表盘区域 -->
<div style="display: flex;justify-content: space-between;padding: 10px;padding-top: 10px;"> <div style="display: flex;justify-content: space-between;padding: 10px;padding-top: 10px;">
<div style="width: 33%;"> <div style="width: 33%;">
<img src="@/assets/test1.png" alt="" style="width: 100%;"> <img src="@/assets/test1.png" alt="" style="width: 100%;height: 150px;">
<div class="gauge-group-box"> <div class="gauge-group-box">
<div>最大旋转角：</div> <div class="gauge-group-box-text1">左：<span class="gauge-group-box-text2">-55.2°</span></div>
<div> <div class="gauge-group-box-text1" style="margin-left: 20px;">右：<span class="gauge-group-box-text2">-55.2°</span></div>
<div>左：-55.2°</div>
<div>右：54.2°</div>
</div>
</div> </div>
</div> </div>
<div style="width: 33%;"> <div style="width: 33%;">
<img src="@/assets/test1.png" alt="" style="width: 100%;"> <img src="@/assets/test1.png" alt="" style="width: 100%;height: 150px;">
<div class="gauge-group-box"> <div class="gauge-group-box">
<div>最大倾斜角：</div> <div class="gauge-group-box-text1">左：<span class="gauge-group-box-text2">-7.7°</span></div>
<div> <div class="gauge-group-box-text1" style="margin-left: 20px;">右：<span class="gauge-group-box-text2">8.7°</span></div>
<div>左：-7.7°</div>
<div>右：8.7°</div>
</div>
</div> </div>
</div> </div>
<div style="width: 33%;"> <div style="width: 33%;">
<img src="@/assets/test1.png" alt="" style="width: 100%;"> <img src="@/assets/test1.png" alt="" style="width: 100%;height: 150px;">
<div class="gauge-group-box"> <div class="gauge-group-box">
<div>最大仰视角：</div> <div class="gauge-group-box-text1">左：<span class="gauge-group-box-text2">-10.5°</span></div>
<div> <div class="gauge-group-box-text1" style="margin-left: 20px;">右：<span class="gauge-group-box-text2">11.5°</span></div>
<div>左：-10.5°</div>
<div>右：11.5°</div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -250,7 +240,7 @@
align-content: space-between; align-content: space-between;
"> ">
<!-- 基础信息模块 --> <!-- 基础信息模块 -->
<div class="module-card" style="padding-bottom: 40px; height: calc(513px);"> <div class="module-card" style="padding-bottom: 40px; height: calc(370px);">
<div style="display: flex;"> <div style="display: flex;">
<div class="module-header"> <div class="module-header">
<div class="module-title"> <div class="module-title">
@ -323,7 +313,7 @@
</div> </div>
<!-- 视频模块 --> <!-- 视频模块 -->
<div class="module-card" style="height: calc(100% - 520px);min-height: 324px;"> <div class="module-card" style="height: calc(100% - 380px);min-height: 324px;">
<div style="display: flex;margin-bottom: 20px;"> <div style="display: flex;margin-bottom: 20px;">
<div class="module-header"> <div class="module-header">
<div class="module-title"> <div class="module-title">
@ -1002,11 +992,9 @@ function stopRecording() {
// 保存录像 // 保存录像
async function saveRecording() { async function saveRecording() {
try { try {
debugger
if (recordedChunks.length === 0) { if (recordedChunks.length === 0) {
throw new Error('没有录制数据') throw new Error('没有录制数据')
} }
console.log()
// 验证必需的患者信息 // 验证必需的患者信息
if (!patientInfo.value.id || !patientInfo.value.name || !patientInfo.value.sessionId) { if (!patientInfo.value.id || !patientInfo.value.name || !patientInfo.value.sessionId) {
throw new Error(`缺少必需的患者信息: ID=${patientInfo.value.id}, 姓名=${patientInfo.value.name}, 会话ID=${patientInfo.value.sessionId}`) throw new Error(`缺少必需的患者信息: ID=${patientInfo.value.id}, 姓名=${patientInfo.value.name}, 会话ID=${patientInfo.value.sessionId}`)
@ -1030,8 +1018,9 @@ async function saveRecording() {
try { try {
const base64Data = reader.result const base64Data = reader.result
// await fetch(`${BACKEND_URL}/api/recordings/save`
// 调用后端API保存录像 // 调用后端API保存录像
const response = await fetch(`${BACKEND_URL}/api/recordings/save`, { const response = await fetch(`${BACKEND_URL}/api/detection/${patientInfo.value.sessionId}/stop`, {
method: 'POST', method: 'POST',
headers: { headers: {
'Content-Type': 'application/json' 'Content-Type': 'application/json'
@ -1057,7 +1046,7 @@ async function saveRecording() {
message: `录像保存成功！文件路径: ${result.filepath}`, message: `录像保存成功！文件路径: ${result.filepath}`,
duration: 5000 duration: 5000
}) })
dialogVisible.value = false dialogVisible.value = true
// 更新会话的视频路径 // 更新会话的视频路径
if (patientInfo.value.sessionId) { if (patientInfo.value.sessionId) {
try { try {
@ -1188,49 +1177,49 @@ async function stopDetection() {
} }
// 如果正在录制，停止录制 // 如果正在录制，停止录制
if (isRecording.value) { // if (isRecording.value) {
stopRecording() // stopRecording()
} // }
saveRecording()
isStart.value = false isStart.value = false
// 调用后端API停止检测会话 // // 调用后端API停止检测会话
if (patientInfo.value.sessionId) { // 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 response = await fetch(`${BACKEND_URL}/api/detection/${patientInfo.value.sessionId}/stop`, {
const result = await response.json() // method: 'POST',
if (result.success) { // headers: {
console.log('✅ 检测会话已停止') // 'Content-Type': 'application/json'
//停止弹出诊断信息 // },
dialogVisible.value = true // body: JSON.stringify({
if (result.duration) { // duration: duration
console.log(`⏱️ 检测持续时间: ${result.duration}秒`) // })
} // })
}
}
}
dialogVisible.value = true
// 清除检测开始时间和会话ID
patientInfo.value.detectionStartTime = null
// patientInfo.value.sessionId = null
ElMessage.success('检测已停止，视频继续播放') // 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) { } catch (error) {
console.error('❌ 停止检测失败:', error) console.error('❌ 停止检测失败:', error)
ElMessage.error(`停止检测失败: ${error.message}`) ElMessage.error(`停止检测失败: ${error.message}`)
} }
} }
// 格式化日期方法 // 格式化日期方法
const formatDate = (dateString) => { const formatDate = (dateString) => {
if (!dateString) return '-' if (!dateString) return '-'
@ -1427,7 +1416,7 @@ onUnmounted(() => {
display: flex; display: flex;
padding: 10px; padding: 10px;
justify-content: space-between; justify-content: space-between;
height: calc(100vh - 60px); height: calc(100vh - 130px);
/* flex: 1; /* flex: 1;
display: grid; display: grid;
@ -1687,9 +1676,18 @@ onUnmounted(() => {
.gauge-group-box{ .gauge-group-box{
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center;
color: #ffffff; color: #ffffff;
font-size: 12px; font-family: 'Arial Negreta', 'Arial Normal', 'Arial', sans-serif;
}
.gauge-group-box-text1{
font-size: 16px;
font-weight: 700;
font-style: normal;
}
.gauge-group-box-text2{
font-size: 24px;
color: #30F3FF;
font-weight: 700;
} }
.gauge-table-title{ .gauge-table-title{
padding: 10px; padding: 10px;