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

修改报告样式

Browse Source
This commit is contained in:
limengnan 2026-01-14 11:19:17 +08:00
parent 0f0ca132d3
commit 79e0f6de87
8 changed files with 123 additions and 129 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
frontend/src/renderer/src/assets/archive/noimg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB

BIN
frontend/src/renderer/src/assets/archive/noimg2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

38
frontend/src/renderer/src/views/AloneReportComparison.vue
View File

@ -62,16 +62,18 @@
</div> </div>
<!-- 选中后显示内容 --> <!-- 选中后显示内容 -->
<div class="AloneReportComparison-content-title">整体数据</div> <div class="AloneReportComparison-content-title">整体数据</div>
<div style="width: 90%;height: 219px;"> <div style="width: calc(100% - 10px);height: 219px;">
<img :src="BACKEND_URL+'/' + rawOneData.screen_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + rawOneData.screen_image" alt="" srcset="" style="width: 100%;height: 100%;">
</div> </div>
<div class="AloneReportComparison-content-title">身体姿态</div> <div class="AloneReportComparison-content-title">身体姿态</div>
<!-- <div style="width: 100%;height: 454px; display: flex;justify-content: center;"> --> <div style="width:calc(100% - 10px);height:610px;margin: auto; display: flex;justify-content: center;">
<img :src="BACKEND_URL+'/' + rawOneData.body_image" alt="" srcset="" <img v-if="rawOneData.body_image" :src="BACKEND_URL+'/' + rawOneData.body_image" alt="" srcset=""
style="width: 99%;height: 454px; object-fit:contain; "> style="width: 100%;height: 100%; object-fit:contain; ">
<!-- </div> --> <img v-else src="@/assets/archive/noimg.png" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain; ">
</div>
<div class="AloneReportComparison-content-title">头部姿态</div> <div class="AloneReportComparison-content-title">头部姿态</div>
<div style=" width:calc(100% - 10px); background:#1c222f;;padding:0 20px"> <div style="width:calc(100% - 10px); background:#1c222f;;padding:0 20px">
<div style="width: 380px;padding:20px 0 10px; display: flex;justify-content: space-between;"> <div style="width: 380px;padding:20px 0 10px; display: flex;justify-content: space-between;">
<div style="width:150px;"> <div style="width:150px;">
<div class="rollyawpitchtitle" style=" margin-bottom:10px">倾斜角</div> <div class="rollyawpitchtitle" style=" margin-bottom:10px">倾斜角</div>
@ -115,17 +117,17 @@
</div> </div>
</div> </div>
<div class="AloneReportComparison-content-title">足底压力</div> <div class="AloneReportComparison-content-title">足底压力</div>
<div style="width: 90%;height: 280px; display: flex;"> <div style="width:calc(100% - 10px); display: flex;">
<img :src="BACKEND_URL+'/' + rawOneData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%; <img :src="BACKEND_URL+'/' + rawOneData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
</div> </div>
<div v-if="rawOneData.foot1_image != null" class="AloneReportComparison-content-title">视频1图片</div> <div v-if="rawOneData.foot1_image != null" class="AloneReportComparison-content-title">视频1图片</div>
<div v-if="rawOneData.foot1_image != null" style="width: 90%;height: 230px; display: flex;"> <div v-if="rawOneData.foot1_image != null" style="width:calc(100% - 10px); display: flex;">
<img :src="BACKEND_URL+'/' + rawOneData.foot1_image" alt="" srcset="" <img :src="BACKEND_URL+'/' + rawOneData.foot1_image" alt="" srcset=""
style="width: 100%;height: 100%;object-fit:contain;"> style="width: 100%;height: 100%;object-fit:contain;">
</div> </div>
<div v-if="rawOneData.foot2_image != null" class="AloneReportComparison-content-title">视频2图片</div> <div v-if="rawOneData.foot2_image != null" class="AloneReportComparison-content-title">视频2图片</div>
<div v-if="rawOneData.foot2_image != null" style="width: 90%;height: 230px; display: flex;"> <div v-if="rawOneData.foot2_image != null" style="width:calc(100% - 10px); display: flex;">
<img :src="BACKEND_URL+'/' + rawOneData.foot2_image" alt="" srcset="" <img :src="BACKEND_URL+'/' + rawOneData.foot2_image" alt="" srcset=""
style="width: 100%;height: 100%;object-fit:contain;"> style="width: 100%;height: 100%;object-fit:contain;">
</div> </div>
@ -147,13 +149,17 @@
<!-- 选中后显示内容 --> <!-- 选中后显示内容 -->
<div v-if="rawTwoData.id && rawTwoData.id!=''"> <div v-if="rawTwoData.id && rawTwoData.id!=''">
<div class="AloneReportComparison-content-title">整体数据</div> <div class="AloneReportComparison-content-title">整体数据</div>
<div style="width: 90%;height: 219px;"> <div style="width: calc(100% - 20px);height: 219px;">
<img :src="BACKEND_URL+'/' + rawTwoData.screen_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + rawTwoData.screen_image" alt="" srcset="" style="width: 100%;height: 100%;">
</div> </div>
<div class="AloneReportComparison-content-title">身体姿态</div> <div class="AloneReportComparison-content-title">身体姿态</div>
<div style="width:calc(100% - 10px);height:610px;margin: auto; display: flex;justify-content: center;">
<img v-if="rawTwoData.body_image !=null" :src="BACKEND_URL+'/' + rawTwoData.body_image" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain;">
<img v-else src="@/assets/archive/noimg.png" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain; ">
</div>
<img :src="BACKEND_URL+'/' + rawTwoData.body_image" alt="" srcset=""
style="width: 99%;height: 454px; object-fit:contain;">
<div class="AloneReportComparison-content-title">头部姿态</div> <div class="AloneReportComparison-content-title">头部姿态</div>
<div style=" width:calc(100% - 10px); background:#1c222f;;padding:0 20px"> <div style=" width:calc(100% - 10px); background:#1c222f;;padding:0 20px">
<div style="width: 380px;padding:20px 0 10px; display: flex;justify-content: space-between;"> <div style="width: 380px;padding:20px 0 10px; display: flex;justify-content: space-between;">
@ -199,17 +205,17 @@
</div> </div>
</div> </div>
<div class="AloneReportComparison-content-title">足底压力</div> <div class="AloneReportComparison-content-title">足底压力</div>
<div style="width: 90%;height: 280px; display: flex;"> <div style="width:calc(100% - 10px); display: flex;">
<img :src="BACKEND_URL+'/' + rawTwoData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%; <img :src="BACKEND_URL+'/' + rawTwoData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
</div> </div>
<div v-if="rawTwoData.foot1_image !=null" class="AloneReportComparison-content-title">视频1图片</div> <div v-if="rawTwoData.foot1_image !=null" class="AloneReportComparison-content-title">视频1图片</div>
<div v-if="rawTwoData.foot1_image !=null" style="width: 90%;height: 230px; display: flex;"> <div v-if="rawTwoData.foot1_image !=null" style="width:calc(100% - 10px); display: flex;">
<img :src="BACKEND_URL+'/' + rawTwoData.foot1_image" alt="" srcset="" <img :src="BACKEND_URL+'/' + rawTwoData.foot1_image" alt="" srcset=""
style="width: 100%;height: 100%;object-fit:contain;"> style="width: 100%;height: 100%;object-fit:contain;">
</div> </div>
<div v-if="rawTwoData.foot2_image !=null" class="AloneReportComparison-content-title">视频2图片</div> <div v-if="rawTwoData.foot2_image !=null" class="AloneReportComparison-content-title">视频2图片</div>
<div v-if="rawTwoData.foot2_image !=null" style="width: 90%;height: 230px; display: flex;"> <div v-if="rawTwoData.foot2_image !=null" style="width:calc(100% - 10px); display: flex;">
<img :src="BACKEND_URL+'/' + rawTwoData.foot2_image" alt="" srcset="" <img :src="BACKEND_URL+'/' + rawTwoData.foot2_image" alt="" srcset=""
style="width: 100%;height: 100%;object-fit:contain;"> style="width: 100%;height: 100%;object-fit:contain;">
</div> </div>
@ -667,7 +673,7 @@ function handleCancel(){
max-width: 100% !important; max-width: 100% !important;
height: auto !important; height: auto !important;
object-fit: contain !important; object-fit: contain !important;
max-height: 300px !important; /* 限制最大高度，防止一页占满 */ /* 限制最大高度，防止一页占满 */
} }
/* 头部信息紧凑化 */ /* 头部信息紧凑化 */

65
frontend/src/renderer/src/views/GenerateReport.vue
View File

@ -63,13 +63,15 @@
<!-- 选中后显示内容 --> <!-- 选中后显示内容 -->
<div v-if="rawData.id && rawData.id!=''"> <div v-if="rawData.id && rawData.id!=''">
<div class="generateReport-content-title">整体数据</div> <div class="generateReport-content-title">整体数据</div>
<div style="width: 600px;height: 337px;"> <div style="width: calc(100% - 20px);height: 337px;">
<img :src="BACKEND_URL+'/' + rawData.screen_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + rawData.screen_image" alt="" srcset="" style="width: 100%;height: 100%;">
</div> </div>
<div class="generateReport-content-title">身体姿态</div> <div class="generateReport-content-title">身体姿态</div>
<div style="width: 100%;height: 454px; display: flex;justify-content: center;"> <div style="width: 100%; height: 500px; display: flex;justify-content: center;">
<img :src="BACKEND_URL+'/' + rawData.body_image" alt="" srcset="" style="width: 100%;height: 100%; <img v-if="rawData.body_image !=null" :src="BACKEND_URL+'/' + rawData.body_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
<img v-else src="@/assets/archive/noimg.png" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain; ">
</div> </div>
<div class="generateReport-content-title">头部姿态</div> <div class="generateReport-content-title">头部姿态</div>
<div style=" width:calc(100% - 20px); background:#1c222f;padding-left:70px"> <div style=" width:calc(100% - 20px); background:#1c222f;padding-left:70px">
@ -113,16 +115,16 @@
</div> </div>
<div class="generateReport-content-title">足底压力</div> <div class="generateReport-content-title">足底压力</div>
<div style="width: 600px;height: 270px; display: flex;"> <div style="width: calc(100% - 20px);height: 270px; display: flex;">
<img :src="BACKEND_URL+'/' + rawData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%; <img :src="BACKEND_URL+'/' + rawData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
</div> </div>
<div v-if="rawData.foot1_image!=null" class="generateReport-content-title">视频1图片</div> <div v-if="rawData.foot1_image!=null" class="generateReport-content-title">视频1图片</div>
<div v-if="rawData.foot1_image!=null" style="width: 600px;height: 338px; display: flex;"> <div v-if="rawData.foot1_image!=null" style="width: calc(100% - 20px);height: 338px; display: flex;">
<img :src="BACKEND_URL+'/' + rawData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + rawData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%;">
</div> </div>
<div v-if="rawData.foot2_image!=null" class="generateReport-content-title">视频2图片</div> <div v-if="rawData.foot2_image!=null" class="generateReport-content-title">视频2图片</div>
<div v-if="rawData.foot2_image!=null" style="width: 600px;height: 338px; display: flex;"> <div v-if="rawData.foot2_image!=null" style="width: calc(100% - 20px);height: 338px; display: flex;">
<img :src="BACKEND_URL+'/' + rawData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + rawData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%;">
</div> </div>
</div> </div>
@ -138,13 +140,15 @@
<!-- 选中后显示内容 --> <!-- 选中后显示内容 -->
<div v-if="calibrationData.id && calibrationData.id!=''"> <div v-if="calibrationData.id && calibrationData.id!=''">
<div class="generateReport-content-title">整体数据</div> <div class="generateReport-content-title">整体数据</div>
<div style="width: 600px;height: 337px;"> <div style="width: calc(100% - 20px);height: 337px;">
<img :src="BACKEND_URL+'/' + calibrationData.screen_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + calibrationData.screen_image" alt="" srcset="" style="width: 100%;height: 100%;">
</div> </div>
<div class="generateReport-content-title">身体姿态</div> <div class="generateReport-content-title">身体姿态</div>
<div style="width: 100%;height: 454px; display: flex;justify-content: center;"> <div style="width: 100%;height: 454px; display: flex;justify-content: center;">
<img :src="BACKEND_URL+'/' + calibrationData.body_image" alt="" srcset="" style="width: 100%;height: 100%; <img v-if="calibrationData.body_image!=null" :src="BACKEND_URL+'/' + calibrationData.body_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
<img v-else src="@/assets/archive/noimg.png" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain; ">
</div> </div>
<div class="generateReport-content-title">头部姿态</div> <div class="generateReport-content-title">头部姿态</div>
@ -187,56 +191,17 @@
</div> </div>
</div> </div>
</div> </div>
<!-- <div style="width: 555px;padding:20px 0; display: flex;justify-content: space-between;">
<div class="rollyawpitchtitle">倾斜角</div>
<div class="rollyawpitchtitle">旋转角</div>
<div class="rollyawpitchtitle">俯仰角</div>
</div>
<div style="width: 555px;padding:20px 0; display: flex;justify-content: space-between;">
<img src="@/assets/archive/roll.png">
<img src="@/assets/archive/yaw.png">
<img src="@/assets/archive/pitch.png">
</div>
<div style="width: 575px;padding:20px 0; display: flex;justify-content: space-between;">
<div class="rollyawpitchtext">左：<span class="rollyawpitchtextcolor">
{{headPoseMaxValuesRight.rotationLeftMax}}°
</span>
</div>
<div class="rollyawpitchtext">左：<span class="rollyawpitchtextcolor">
{{headPoseMaxValuesRight.tiltLeftMax}}°
</span></div>
<div class="rollyawpitchtext">俯：<span class="rollyawpitchtextcolor">
{{headPoseMaxValuesRight.pitchDownMax}}°
</span></div>
</div>
<div style="width: 575px;padding:0px 0; display: flex;justify-content: space-between;">
<div class="rollyawpitchtext">右：<span class="rollyawpitchtextcolor">
{{headPoseMaxValuesRight.rotationRightMax}}°
</span></div>
<div class="rollyawpitchtext">右：
<span class="rollyawpitchtextcolor">
{{headPoseMaxValuesRight.tiltRightMax}}°
</span>
</div>
<div class="rollyawpitchtext">仰：
<span class="rollyawpitchtextcolor">
{{headPoseMaxValuesRight.pitchUpMax}}°
</span>
</div>
</div> -->
<div class="generateReport-content-title">足底压力</div> <div class="generateReport-content-title">足底压力</div>
<div style="width: 600px;height: 270px; display: flex;"> <div style="width: calc(100% - 20px);height: 270px; display: flex;">
<img :src="BACKEND_URL+'/' + calibrationData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%; <img :src="BACKEND_URL+'/' + calibrationData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
</div> </div>
<div v-if="calibrationData.foot1_image !=null" class="generateReport-content-title">视频1图片</div> <div v-if="calibrationData.foot1_image !=null" class="generateReport-content-title">视频1图片</div>
<div v-if="calibrationData.foot1_image !=null" style="width: 600px;height: 338px; display: flex;"> <div v-if="calibrationData.foot1_image !=null" style="width: calc(100% - 20px);height: 338px; display: flex;">
<img :src="BACKEND_URL+'/' + calibrationData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + calibrationData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%;">
</div> </div>
<div v-if="calibrationData.foot2_image !=null" class="generateReport-content-title">视频2图片</div> <div v-if="calibrationData.foot2_image !=null" class="generateReport-content-title">视频2图片</div>
<div v-if="calibrationData.foot2_image !=null" style="width: 600px;height: 338px; display: flex;"> <div v-if="calibrationData.foot2_image !=null" style="width: calc(100% - 20px);height: 338px; display: flex;">
<img :src="BACKEND_URL+'/' + calibrationData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + calibrationData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%;">
</div> </div>
</div> </div>

14
frontend/src/renderer/src/views/ImageDetailsCompare.vue
View File

@ -6,16 +6,16 @@
</div> </div>
<div class="ImageDetailsCompare-imgbgbox"> <div class="ImageDetailsCompare-imgbgbox">
<div class="ImageDetailsCompare-display" v-if="indexActive == 0"> <div class="ImageDetailsCompare-display" v-if="indexActive == 0">
<div class="ImageDetailsCompare-content-imgbox" style="width: 740px;height: 100%;"> <div class="ImageDetailsCompare-content-imgbox" style="width: 49%;height: 100%;">
<div class="ImageDetailsCompare-content-title">{{ ImageDetailsInfoLeft.id }}</div> <div class="ImageDetailsCompare-content-title">{{ ImageDetailsInfoLeft.id }}</div>
<img :src="BACKEND_URL+'/' + ImageDetailsInfoLeft.screen_image" alt="" <img :src="BACKEND_URL+'/' + ImageDetailsInfoLeft.screen_image" alt=""
style="width: 740px;height:416px;"> style="width: 100%;height:416px;">
</div> </div>
<div class="ImageDetailsCompare-content-imgbox" <div class="ImageDetailsCompare-content-imgbox"
style="width: 740px;height: 100%;margin-left: 50px;"> style="width: 49%;height: 100%;margin-left: 10px;">
<div class="ImageDetailsCompare-content-title">{{ ImageDetailsInfoRight.id }}</div> <div class="ImageDetailsCompare-content-title">{{ ImageDetailsInfoRight.id }}</div>
<img :src="BACKEND_URL+'/' + ImageDetailsInfoRight.screen_image" alt="" <img :src="BACKEND_URL+'/' + ImageDetailsInfoRight.screen_image" alt=""
style="width: 740px;height:416px;"> style="width:100%;height:416px;">
</div> </div>
</div> </div>
<div class="ImageDetailsCompare-display" v-if="indexActive == 1"> <div class="ImageDetailsCompare-display" v-if="indexActive == 1">
@ -32,13 +32,13 @@
</div> </div>
</div> </div>
<div class="ImageDetailsCompare-display" v-if="indexActive == 2"> <div class="ImageDetailsCompare-display" v-if="indexActive == 2">
<div class="ImageDetailsCompare-content-imgbox" style="width: 740px;height: 100%;"> <div class="ImageDetailsCompare-content-imgbox" style="width: 49%;height: 100%;">
<div class="ImageDetailsCompare-content-title">{{ ImageDetailsInfoLeft.id }}</div> <div class="ImageDetailsCompare-content-title">{{ ImageDetailsInfoLeft.id }}</div>
<img :src="BACKEND_URL+'/' + ImageDetailsInfoLeft.head_data_image" alt="" <img :src="BACKEND_URL+'/' + ImageDetailsInfoLeft.head_data_image" alt=""
style="max-width: 100%;max-height: 100%;object-fit:contain;"> style="max-width: 100%;max-height: 100%;object-fit:contain;">
</div> </div>
<div class="ImageDetailsCompare-content-imgbox" <div class="ImageDetailsCompare-content-imgbox"
style="width: 630px;height: 100%;margin-left: 50px;"> style="width: 49%;height: 100%;margin-left: 10px;">
<div class="ImageDetailsCompare-content-title">{{ ImageDetailsInfoRight.id }}</div> <div class="ImageDetailsCompare-content-title">{{ ImageDetailsInfoRight.id }}</div>
<img :src="BACKEND_URL+'/' + ImageDetailsInfoRight.head_data_image" alt="" <img :src="BACKEND_URL+'/' + ImageDetailsInfoRight.head_data_image" alt=""
style="max-width: 100%;max-height: 100%;object-fit:contain;"> style="max-width: 100%;max-height: 100%;object-fit:contain;">
@ -51,7 +51,7 @@
style="max-width: 100%;max-height: 100%;"> style="max-width: 100%;max-height: 100%;">
</div> </div>
<div class="ImageDetailsCompare-content-imgbox" <div class="ImageDetailsCompare-content-imgbox"
style="width: 50%;height: 100%;margin-left: 50px;"> style="width: 50%;height: 100%;margin-left: 10px;">
<div class="ImageDetailsCompare-content-title">{{ ImageDetailsInfoRight.id }}</div> <div class="ImageDetailsCompare-content-title">{{ ImageDetailsInfoRight.id }}</div>
<img :src="BACKEND_URL+'/' + ImageDetailsInfoRight.foot_data_image" alt="" <img :src="BACKEND_URL+'/' + ImageDetailsInfoRight.foot_data_image" alt=""
style="max-width: 100%;max-height: 100%;"> style="max-width: 100%;max-height: 100%;">

33
frontend/src/renderer/src/views/PopUpOnlyReport.vue
View File

@ -60,16 +60,23 @@
<!-- 选中后显示内容 --> <!-- 选中后显示内容 -->
<div v-if="rawData.id && rawData.id!=''"> <div v-if="rawData.id && rawData.id!=''">
<div class="PopUpOnlyReport-content-title">整体数据</div> <div class="PopUpOnlyReport-content-title">整体数据</div>
<div style="width: 600px;height: 387px; margin: auto;"> <div style="width:calc(100% - 10px);max-height: 400px; margin: auto;">
<img :src="BACKEND_URL+'/' + rawData.screen_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + rawData.screen_image" alt="" srcset=""
style="width: 100%;height: 100%;max-height: 400px;">
</div> </div>
<div class="PopUpOnlyReport-content-title">身体姿态</div> <div class="PopUpOnlyReport-content-title">身体姿态</div>
<div style="width:calc(100% - 10px);height:610px;margin: auto; display: flex;justify-content: center;">
<img :src="BACKEND_URL+'/' + rawData.body_image" alt="" srcset="" <img v-if="rawData.body_image" :src="BACKEND_URL+'/' + rawData.body_image" alt="" srcset=""
style="width: 99%;height: 454px; object-fit:contain; "> style="width: 100%;height: 100%; object-fit:contain; ">
<img v-else src="@/assets/archive/noimg.png" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain; ">
</div>
<!-- <img :src="BACKEND_URL+'/' + rawData.body_image" alt="" srcset=""
style="width: 99%;height: 454px; object-fit:contain; "> -->
<div class="PopUpOnlyReport-content-title">头部姿态</div> <div class="PopUpOnlyReport-content-title">头部姿态</div>
<div style=" width:630px; background:#1c222f;margin: auto;padding-left:50px"> <div style=" width:calc(100% - 10px);margin: auto; background:#1c222f;margin: auto;padding-left:50px">
<div style="width: 555px;padding:20px 0; display: flex;justify-content: space-between;"> <div style="width: 555px;padding:20px 0; margin: auto; display: flex;justify-content: space-between;">
<div style="width: 170px;"> <div style="width: 170px;">
<div class="rollyawpitchtitle" style="width:137px; margin-bottom:10px">倾斜角</div> <div class="rollyawpitchtitle" style="width:137px; margin-bottom:10px">倾斜角</div>
<img src="@/assets/archive/roll.png"> <img src="@/assets/archive/roll.png">
@ -83,7 +90,7 @@
<img src="@/assets/archive/pitch.png"> <img src="@/assets/archive/pitch.png">
</div> </div>
</div> </div>
<div style="width: 555px;padding:20px 0; display: flex;justify-content: space-between;"> <div style="width: 555px;padding:20px 0; margin: auto; display: flex;justify-content: space-between;">
<div class="rollyawpitchtext">左：<span class="rollyawpitchtextcolor"> <div class="rollyawpitchtext">左：<span class="rollyawpitchtextcolor">
{{headPoseMaxValuesLeft.rotationLeftMax}}° {{headPoseMaxValuesLeft.rotationLeftMax}}°
</span> </span>
@ -95,7 +102,7 @@
{{headPoseMaxValuesLeft.pitchDownMax}}° {{headPoseMaxValuesLeft.pitchDownMax}}°
</span></div> </span></div>
</div> </div>
<div style="width: 555px;padding:20px 0; display: flex;justify-content: space-between;"> <div style="width: 555px;padding:20px 0; margin: auto; display: flex;justify-content: space-between;">
<div class="rollyawpitchtext">右：<span class="rollyawpitchtextcolor"> <div class="rollyawpitchtext">右：<span class="rollyawpitchtextcolor">
{{headPoseMaxValuesLeft.rotationRightMax}}° {{headPoseMaxValuesLeft.rotationRightMax}}°
</span></div> </span></div>
@ -113,16 +120,16 @@
</div> </div>
<div class="PopUpOnlyReport-content-title">足底压力</div> <div class="PopUpOnlyReport-content-title">足底压力</div>
<div style="width: 600px;height: 370px; margin: auto; display: flex;margin-bottom: 100px;"> <div style=" width:calc(100% - 10px);margin: auto; display: flex;margin-bottom: 100px;">
<img :src="BACKEND_URL+'/' + rawData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%; <img :src="BACKEND_URL+'/' + rawData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
</div> </div>
<div v-if="rawData.foot1_image != null" class="PopUpOnlyReport-content-title">视频1图片</div> <div v-if="rawData.foot1_image != null" class="PopUpOnlyReport-content-title">视频1图片</div>
<div v-if="rawData.foot1_image != null" style="width: 600px;height: 338px; display: flex; margin: auto;"> <div v-if="rawData.foot1_image != null" style=" width:calc(100% - 10px); display: flex; margin: auto;">
<img :src="BACKEND_URL+'/' + rawData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + rawData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%;">
</div> </div>
<div v-if="rawData.foot2_image != null" class="PopUpOnlyReport-content-title">视频2图片</div> <div v-if="rawData.foot2_image != null" class="PopUpOnlyReport-content-title">视频2图片</div>
<div v-if="rawData.foot2_image != null" style="width: 600px;height: 338px; display: flex; margin: auto;"> <div v-if="rawData.foot2_image != null" style=" width:calc(100% - 10px); display: flex; margin: auto;">
<img :src="BACKEND_URL+'/' + rawData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + rawData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%;">
</div> </div>
</div> </div>
@ -652,7 +659,7 @@ function handleCancel(){
max-width: 100% !important; max-width: 100% !important;
height: auto !important; height: auto !important;
object-fit: contain !important; object-fit: contain !important;
max-height: 300px !important; /* 限制最大高度，防止一页占满 */ /* max-height: 300px !important; */
} }
/* 头部信息紧凑化 */ /* 头部信息紧凑化 */

36
frontend/src/renderer/src/views/PopUpReport.vue
View File

@ -61,13 +61,17 @@
<!-- 选中后显示内容 --> <!-- 选中后显示内容 -->
<div v-if="rawData.id && rawData.id!=''"> <div v-if="rawData.id && rawData.id!=''">
<div class="PopUpReport-content-title">整体数据</div> <div class="PopUpReport-content-title">整体数据</div>
<div style="width: 90%;height: 219px;"> <div style="width:calc(100% - 10px);max-height: 400px;max-height: 400px; margin: auto;">
<img :src="BACKEND_URL+'/' + rawData.screen_image" alt="" srcset="" style="width: 100%;height: 100%; <img :src="BACKEND_URL+'/' + rawData.screen_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
</div> </div>
<div class="PopUpReport-content-title">身体姿态</div> <div class="PopUpReport-content-title">身体姿态</div>
<img :src="BACKEND_URL+'/' + rawData.body_image" alt="" srcset="" <div style="width:calc(100% - 10px);height:610px;margin: auto; display: flex;justify-content: center;">
style="width: 99%;height: 454px; object-fit:contain; "> <img v-if="rawData.body_image" :src="BACKEND_URL+'/' + rawData.body_image" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain; ">
<img v-else src="@/assets/archive/noimg.png" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain; ">
</div>
<div class="PopUpReport-content-title">头部姿态</div> <div class="PopUpReport-content-title">头部姿态</div>
<div style=" width:calc(100% - 10px); background:#1c222f;;padding:0 10px"> <div style=" width:calc(100% - 10px); background:#1c222f;;padding:0 10px">
<div style="width: 100%;padding-top:10px; display: flex;justify-content: space-between;"> <div style="width: 100%;padding-top:10px; display: flex;justify-content: space-between;">
@ -110,16 +114,16 @@
</div> </div>
<div class="PopUpReport-content-title">足底压力</div> <div class="PopUpReport-content-title">足底压力</div>
<div style="width: 90%;height: 280px; display: flex;"> <div style="width:calc(100% - 10px);margin: auto; display: flex;">
<img :src="BACKEND_URL+'/' + rawData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%; <img :src="BACKEND_URL+'/' + rawData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
</div> </div>
<div v-if="rawData.foot1_image != null" class="PopUpReport-content-title">视频1图片</div> <div v-if="rawData.foot1_image != null" class="PopUpReport-content-title">视频1图片</div>
<div v-if="rawData.foot1_image != null" style="width: 90%;height: 230px; display: flex;"> <div v-if="rawData.foot1_image != null" style="width:calc(100% - 10px);margin: auto; display: flex;">
<img :src="BACKEND_URL+'/' + rawData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + rawData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%;">
</div> </div>
<div v-if="rawData.foot2_image != null" class="PopUpReport-content-title">视频2图片</div> <div v-if="rawData.foot2_image != null" class="PopUpReport-content-title">视频2图片</div>
<div v-if="rawData.foot2_image != null" style="width: 90%;height: 230px; display: flex;"> <div v-if="rawData.foot2_image != null" style="width:calc(100% - 10px);margin: auto; display: flex;">
<img :src="BACKEND_URL+'/' + rawData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + rawData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%;">
</div> </div>
</div> </div>
@ -134,13 +138,17 @@
<!-- 选中后显示内容 --> <!-- 选中后显示内容 -->
<div v-if="calibrationData.id && calibrationData.id!=''"> <div v-if="calibrationData.id && calibrationData.id!=''">
<div class="PopUpReport-content-title">整体数据</div> <div class="PopUpReport-content-title">整体数据</div>
<div style="width: 90%;height: 219px;"> <div style="width:calc(100% - 10px);max-height: 400px; margin: auto;">
<img :src="BACKEND_URL+'/' + calibrationData.screen_image" alt="" srcset="" <img :src="BACKEND_URL+'/' + calibrationData.screen_image" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain;"> style="width: 100%;height: 100%;max-height: 400px; object-fit:contain;">
</div> </div>
<div class="PopUpReport-content-title">身体姿态</div> <div class="PopUpReport-content-title">身体姿态</div>
<img :src="BACKEND_URL+'/' + calibrationData.body_image" alt="" srcset="" <div style="width:calc(100% - 10px);height:610px;margin: auto; display: flex;justify-content: center;">
style="width: 99%;height: 454px; object-fit:contain; "> <img v-if="calibrationData.body_image" :src="BACKEND_URL+'/' + calibrationData.body_image" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain; ">
<img v-else src="@/assets/archive/noimg.png" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain; ">
</div>
<div class="PopUpReport-content-title">头部姿态</div> <div class="PopUpReport-content-title">头部姿态</div>
<div style=" width:calc(100% - 10px); background:#1c222f;padding:0 10px"> <div style=" width:calc(100% - 10px); background:#1c222f;padding:0 10px">
<div style="width: 100%;padding-top:20px; display: flex;justify-content: space-between;"> <div style="width: 100%;padding-top:20px; display: flex;justify-content: space-between;">
@ -182,16 +190,16 @@
</div> </div>
</div> </div>
<div class="PopUpReport-content-title">足底压力</div> <div class="PopUpReport-content-title">足底压力</div>
<div style="width: 90%;height: 280px; display: flex;"> <div style="width:calc(100% - 10px);margin: auto; display: flex;">
<img :src="BACKEND_URL+'/' + calibrationData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%; <img :src="BACKEND_URL+'/' + calibrationData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
</div> </div>
<div v-if="calibrationData.foot1_image != null" class="PopUpReport-content-title">视频1图片</div> <div v-if="calibrationData.foot1_image != null" class="PopUpReport-content-title">视频1图片</div>
<div v-if="calibrationData.foot1_image != null" style="width: 90%;height: 230px; display: flex;"> <div v-if="calibrationData.foot1_image != null" style="width:calc(100% - 10px);margin: auto; display: flex;">
<img :src="BACKEND_URL+'/' + calibrationData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + calibrationData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%;">
</div> </div>
<div v-if="calibrationData.foot2_image != null" class="PopUpReport-content-title">视频2图片</div> <div v-if="calibrationData.foot2_image != null" class="PopUpReport-content-title">视频2图片</div>
<div v-if="calibrationData.foot2_image != null" style="width: 90%;height: 230px; display: flex;"> <div v-if="calibrationData.foot2_image != null" style="width:calc(100% - 10px);margin: auto; display: flex;">
<img :src="BACKEND_URL+'/' + calibrationData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%;"> <img :src="BACKEND_URL+'/' + calibrationData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%;">
</div> </div>
</div> </div>
@ -643,7 +651,7 @@ function getFormattedTime() {
max-width: 100% !important; max-width: 100% !important;
height: auto !important; height: auto !important;
object-fit: contain !important; object-fit: contain !important;
max-height: 300px !important; /* 限制最大高度，防止一页占满 */ /* max-height: 300px !important; */
} }
/* 头部信息紧凑化 */ /* 头部信息紧凑化 */

62
frontend/src/renderer/src/views/ReportComparison.vue
View File

@ -66,14 +66,16 @@
<!-- 选中后显示内容 --> <!-- 选中后显示内容 -->
<div class="ReportComparison-content-title">整体数据</div> <div class="ReportComparison-content-title">整体数据</div>
<div style="width: 90%;height: 100px;"> <div style="width:calc(100% - 10px);margin: auto;">
<img :src="BACKEND_URL+'/' + rawOneData.screen_image" alt="" srcset="" <img :src="BACKEND_URL+'/' + rawOneData.screen_image" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain; "> style="width: 100%;height: 100%; object-fit:contain; ">
</div> </div>
<div class="ReportComparison-content-title">身体姿态</div> <div class="ReportComparison-content-title">身体姿态</div>
<div style="width: 90%;height:300px; display: flex;justify-content: center;"> <div style="width:calc(100% - 10px);height:260px;margin: auto; display: flex;justify-content: center;">
<img :src="BACKEND_URL+'/' + rawOneData.body_image" alt="" srcset="" style="width: 100%;height: 100%; <img v-if="rawOneData.body_image !=null" :src="BACKEND_URL+'/' + rawOneData.body_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
<img v-else src="@/assets/archive/noimg.png" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain; ">
</div> </div>
<div class="ReportComparison-content-title">头部姿态</div> <div class="ReportComparison-content-title">头部姿态</div>
<div style=" width:calc(100% - 10px); background:#1c222f;;padding:0 10px"> <div style=" width:calc(100% - 10px); background:#1c222f;;padding:0 10px">
@ -120,16 +122,16 @@
</div> </div>
</div> </div>
<div class="ReportComparison-content-title">足底压力</div> <div class="ReportComparison-content-title">足底压力</div>
<div style="width: 90%;height:200px;display: flex;"> <div style="width:calc(100% - 10px);margin: auto;display: flex;">
<img :src="BACKEND_URL+'/' + rawOneData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%; <img :src="BACKEND_URL+'/' + rawOneData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
</div> </div>
<div v-if="rawOneData.foot1_image != null" class="ReportComparison-content-title">视频1图片</div> <div v-if="rawOneData.foot1_image != null" class="ReportComparison-content-title">视频1图片</div>
<div v-if="rawOneData.foot1_image != null" style="width: 90%;height:180px; display: flex;"> <div v-if="rawOneData.foot1_image != null" style="width:calc(100% - 10px);margin: auto; display: flex;">
<img :src="BACKEND_URL+'/' + rawOneData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;"> <img :src="BACKEND_URL+'/' + rawOneData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;">
</div> </div>
<div v-if="rawOneData.foot2_image != null" class="ReportComparison-content-title">视频2图片</div> <div v-if="rawOneData.foot2_image != null" class="ReportComparison-content-title">视频2图片</div>
<div v-if="rawOneData.foot2_image != null" style="width: 90%;height:180px; display: flex;"> <div v-if="rawOneData.foot2_image != null" style="width:calc(100% - 10px);margin: auto; display: flex;">
<img :src="BACKEND_URL+'/' + rawOneData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;"> <img :src="BACKEND_URL+'/' + rawOneData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;">
</div> </div>
@ -144,14 +146,16 @@
<!-- 选中后显示内容 --> <!-- 选中后显示内容 -->
<div class="ReportComparison-content-title">整体数据</div> <div class="ReportComparison-content-title">整体数据</div>
<div style="width: 90%;height: 100px;"> <div style="width:calc(100% - 10px);margin: auto;">
<img :src="BACKEND_URL+'/' + calibrationOneData.screen_image" alt="" <img :src="BACKEND_URL+'/' + calibrationOneData.screen_image" alt=""
srcset="" style="width: 100%;height: 100%;object-fit:contain;"> srcset="" style="width: 100%;height: 100%;object-fit:contain;">
</div> </div>
<div class="ReportComparison-content-title">身体姿态</div> <div class="ReportComparison-content-title">身体姿态</div>
<div style="width: 90%;height:300px; display: flex;justify-content: center;"> <div style="width:calc(100% - 10px);height:260px;margin: auto; display: flex;justify-content: center;">
<img :src="BACKEND_URL+'/' + calibrationOneData.body_image" alt="" srcset="" style="width: 100%;height: 100%; <img v-if="calibrationOneData.body_image !=null" :src="BACKEND_URL+'/' + calibrationOneData.body_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
<img v-else src="@/assets/archive/noimg.png" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain; ">
</div> </div>
<div class="ReportComparison-content-title">头部姿态</div> <div class="ReportComparison-content-title">头部姿态</div>
<div style=" width:calc(100% - 10px); background:#1c222f;;padding:0 10px"> <div style=" width:calc(100% - 10px); background:#1c222f;;padding:0 10px">
@ -198,16 +202,16 @@
</div> </div>
</div> </div>
<div class="ReportComparison-content-title">足底压力</div> <div class="ReportComparison-content-title">足底压力</div>
<div style="width: 90%;height:200px;display: flex;"> <div style="width:calc(100% - 10px);display: flex;">
<img :src="BACKEND_URL+'/' + calibrationOneData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%; <img :src="BACKEND_URL+'/' + calibrationOneData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
</div> </div>
<div v-if="calibrationOneData.foot1_image != null" class="ReportComparison-content-title">视频1图片</div> <div v-if="calibrationOneData.foot1_image != null" class="ReportComparison-content-title">视频1图片</div>
<div v-if="calibrationOneData.foot1_image != null" style="width: 90%;height:180px; display: flex;"> <div v-if="calibrationOneData.foot1_image != null" style="width:calc(100% - 10px); display: flex;">
<img :src="BACKEND_URL+'/' + calibrationOneData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;"> <img :src="BACKEND_URL+'/' + calibrationOneData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;">
</div> </div>
<div v-if="calibrationOneData.foot2_image != null" class="ReportComparison-content-title">视频2图片</div> <div v-if="calibrationOneData.foot2_image != null" class="ReportComparison-content-title">视频2图片</div>
<div v-if="calibrationOneData.foot2_image != null" style="width: 90%;height:180px; display: flex;"> <div v-if="calibrationOneData.foot2_image != null" style="width:calc(100% - 10px); display: flex;">
<img :src="BACKEND_URL+'/' + calibrationOneData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;"> <img :src="BACKEND_URL+'/' + calibrationOneData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;">
</div> </div>
</div> </div>
@ -233,17 +237,19 @@
<!-- 选中后显示内容 --> <!-- 选中后显示内容 -->
<div class="ReportComparison-content-title">整体数据</div> <div class="ReportComparison-content-title">整体数据</div>
<div style="width: 90%;height: 100px;"> <div style="width:calc(100% - 10px);margin: auto;">
<img :src="BACKEND_URL+'/' + rawTwoData.screen_image" alt="" <img :src="BACKEND_URL+'/' + rawTwoData.screen_image" alt=""
srcset="" style="width: 100%;height: 100%;object-fit:contain;"> srcset="" style="width: 100%;height: 100%;object-fit:contain;">
</div> </div>
<div class="ReportComparison-content-title">身体姿态</div> <div class="ReportComparison-content-title">身体姿态</div>
<div style="width: 90%;height:300px; display: flex;justify-content: center;"> <div style="width:calc(100% - 10px);height:260px;margin: auto; display: flex;justify-content: center;">
<img :src="BACKEND_URL+'/' + rawTwoData.body_image" alt="" srcset="" style="width: 100%;height: 100%; <img v-if="rawTwoData.body_image !=null" :src="BACKEND_URL+'/' + rawTwoData.body_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
<img v-else src="@/assets/archive/noimg.png" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain; ">
</div> </div>
<div class="ReportComparison-content-title">头部姿态</div> <div class="ReportComparison-content-title">头部姿态</div>
<div style=" width:calc(100% - 10px); background:#1c222f;;padding:0 10px"> <div style="width:calc(100% - 10px); background:#1c222f;;padding:0 10px">
<div style="width: 100%;padding:10px 0; display: flex;justify-content: space-between;"> <div style="width: 100%;padding:10px 0; display: flex;justify-content: space-between;">
<div style="width:66px;"> <div style="width:66px;">
<div class="rollyawpitchtitle" style="width:66px;font-size:14px; margin-bottom:10px">倾斜角</div> <div class="rollyawpitchtitle" style="width:66px;font-size:14px; margin-bottom:10px">倾斜角</div>
@ -289,16 +295,16 @@
<div class="ReportComparison-content-title">足底压力</div> <div class="ReportComparison-content-title">足底压力</div>
<div style="width: 90%;height:200px;display: flex;"> <div style="width:calc(100% - 10px);margin: auto;display: flex;">
<img :src="BACKEND_URL+'/' + rawTwoData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%; <img :src="BACKEND_URL+'/' + rawTwoData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
</div> </div>
<div v-if="rawTwoData.foot1_image != null" class="ReportComparison-content-title">视频1图片</div> <div v-if="rawTwoData.foot1_image != null" class="ReportComparison-content-title">视频1图片</div>
<div v-if="rawTwoData.foot1_image != null" style="width: 90%;height:180px; display: flex;"> <div v-if="rawTwoData.foot1_image != null" style="width:calc(100% - 10px);margin: auto; display: flex;">
<img :src="BACKEND_URL+'/' + rawTwoData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;"> <img :src="BACKEND_URL+'/' + rawTwoData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;">
</div> </div>
<div v-if="rawTwoData.foot2_image != null" class="ReportComparison-content-title">视频2图片</div> <div v-if="rawTwoData.foot2_image != null" class="ReportComparison-content-title">视频2图片</div>
<div v-if="rawTwoData.foot2_image != null" style="width: 90%;height:180px; display: flex;"> <div v-if="rawTwoData.foot2_image != null" style="width:calc(100% - 10px);margin: auto; display: flex;">
<img :src="BACKEND_URL+'/' + rawTwoData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;"> <img :src="BACKEND_URL+'/' + rawTwoData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;">
</div> </div>
@ -313,14 +319,16 @@
<!-- 选中后显示内容 --> <!-- 选中后显示内容 -->
<div class="ReportComparison-content-title">整体数据</div> <div class="ReportComparison-content-title">整体数据</div>
<div style="width: 90%;height: 100px;"> <div style="width:calc(100% - 10px);margin: auto;">
<img :src="BACKEND_URL+'/' + calibrationTwoData.screen_image" alt="" <img :src="BACKEND_URL+'/' + calibrationTwoData.screen_image" alt=""
srcset="" style="width: 100%;height: 100%;object-fit:contain;"> srcset="" style="width: 100%;height: 100%;object-fit:contain;">
</div> </div>
<div class="ReportComparison-content-title">身体姿态</div> <div class="ReportComparison-content-title">身体姿态</div>
<div style="width: 90%;height:300px; display: flex;justify-content: center;"> <div style="width:calc(100% - 10px);height:260px;margin: auto; display: flex;justify-content: center;">
<img :src="BACKEND_URL+'/' + calibrationTwoData.body_image" alt="" srcset="" style="width: 100%;height: 100%; <img v-if="calibrationTwoData.body_image !=null" :src="BACKEND_URL+'/' + calibrationTwoData.body_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
<img v-else src="@/assets/archive/noimg.png" alt="" srcset=""
style="width: 100%;height: 100%; object-fit:contain; ">
</div> </div>
<div class="ReportComparison-content-title">头部姿态</div> <div class="ReportComparison-content-title">头部姿态</div>
<div style=" width:calc(100% - 10px); background:#1c222f;;padding:0 10px"> <div style=" width:calc(100% - 10px); background:#1c222f;;padding:0 10px">
@ -367,16 +375,16 @@
</div> </div>
</div> </div>
<div class="ReportComparison-content-title">足底压力</div> <div class="ReportComparison-content-title">足底压力</div>
<div style="width: 90%;height:200px;display: flex;"> <div style="width:calc(100% - 10px);margin: auto;display: flex;">
<img :src="BACKEND_URL+'/' + calibrationTwoData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%; <img :src="BACKEND_URL+'/' + calibrationTwoData.foot_data_image" alt="" srcset="" style="width: 100%;height: 100%;
object-fit:contain; "> object-fit:contain; ">
</div> </div>
<div v-if="calibrationTwoData.foot1_image != null" class="ReportComparison-content-title">视频1图片</div> <div v-if="calibrationTwoData.foot1_image != null" class="ReportComparison-content-title">视频1图片</div>
<div v-if="calibrationTwoData.foot1_image != null" style="width: 90%;height:180px; display: flex;"> <div v-if="calibrationTwoData.foot1_image != null" style="width:calc(100% - 10px);margin: auto; display: flex;">
<img :src="BACKEND_URL+'/' + calibrationTwoData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;"> <img :src="BACKEND_URL+'/' + calibrationTwoData.foot1_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;">
</div> </div>
<div v-if="calibrationTwoData.foot2_image != null" class="ReportComparison-content-title">视频2图片</div> <div v-if="calibrationTwoData.foot2_image != null" class="ReportComparison-content-title">视频2图片</div>
<div v-if="calibrationTwoData.foot2_image != null" style="width: 90%;height:180px; display: flex;"> <div v-if="calibrationTwoData.foot2_image != null" style="width:calc(100% - 10px);margin: auto; display: flex;">
<img :src="BACKEND_URL+'/' + calibrationTwoData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;"> <img :src="BACKEND_URL+'/' + calibrationTwoData.foot2_image" alt="" srcset="" style="width: 100%;height: 100%; object-fit:contain;">
</div> </div>
</div> </div>
@ -906,7 +914,7 @@ function handleCancel(){
max-width: 100% !important; max-width: 100% !important;
height: auto !important; height: auto !important;
object-fit: contain !important; object-fit: contain !important;
max-height: 300px !important; /* 限制最大高度，防止一页占满 */ /* max-height: 300px !important; */
} }
/* 头部信息紧凑化 */ /* 头部信息紧凑化 */