yuchunlei/bodyWeight
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[AI Generated]: refactor(Views): 优化测量报告页面结构与样式

Browse Source
This commit is contained in:
17792275749
2026-05-13 11:19:32 +08:00
parent d1331437fa
commit afa602dff9
7 changed files with 116 additions and 345 deletions
Download Patch File Download Diff File Expand all files Collapse all files
miniprogram/pages/measurementReport/measurementReport.less
+86 -41
View File
@@ -6,65 +6,67 @@
/* ===== 测量信息卡片 ===== */
.info-card {
width: 100%;
padding: 40rpx 30rpx;
display: flex;
align-items: center;
padding: 36rpx 30rpx;
margin-bottom: 24rpx;
border-radius: 24rpx;
box-sizing: border-box;
background-color: #FFFFFF;
//background-color: #FFFFFF;
background: linear-gradient(180deg, #D3E9FF 0%, #FCFBFD 100%);
.info-header {
display: flex;
align-items: center;
.info-avatar {
width: 90rpx;
height: 90rpx;
border-radius: 24rpx;
margin-right: 24rpx;
box-sizing: border-box;
background-color: #C6E6FF;
border: 3rpx solid #50A6FF;
}
.info-avatar {
width: 96rpx;
height: 96rpx;
border-radius: 50%;
margin-right: 24rpx;
background-color: #C6E6FF;
border: 3rpx solid #50A6FF;
.info-meta {
flex: 1;
.info-name {
color: #333333;
height: 32rpx;
font-size: 32rpx;
font-weight: bold;
line-height: 32rpx;
margin-bottom: 20rpx;
}
.info-meta {
flex: 1;
.info-time {
color: #77849E;
font-size: 26rpx;
line-height: 34rpx;
margin-bottom: 16rpx;
}
.info-name {
color: #333333;
font-size: 32rpx;
font-weight: 700;
line-height: 32rpx;
}
.info-time {
color: #77849E;
height: 26rpx;
font-size: 26rpx;
line-height: 26rpx;
}
}
}
/* ===== 体重卡片 ===== */
/* ===== 最近测量卡 ===== */
.weight-card {
width: 100%;
position: relative;
margin-bottom: 24rpx;
padding: 2rpx 2rpx 50rpx;
border-radius: 24rpx;
box-sizing: border-box;
background-color: #FFFFFF;
/* 卡头 */
/* 卡头(带渐变背景) */
.card-header {
width: 100%;
height: 88rpx;
padding-left: 30rpx;
padding-right: 30rpx;
padding-right: 10rpx;
box-sizing: border-box;
display: flex;
align-items: center;
margin-bottom: 18rpx;
justify-content: space-between;
background: linear-gradient(180deg, rgba(211, 233, 255, 0.6) 0%, rgba(252, 251, 253, 0.6) 100%);
.card-header-left {
display: flex;
@@ -92,7 +94,7 @@
padding: 0 30rpx;
box-sizing: border-box;
/* 体重主数据行 */
/* ===== 最近测量:体重主数据行 ===== */
.weight-row {
display: flex;
align-items: flex-end;
@@ -169,7 +171,7 @@
font-size: 28rpx;
line-height: 28rpx;
.diff-arrow {
text {
position: absolute;
left: 0;
bottom: 42rpx;
@@ -253,6 +255,30 @@
}
}
/* BMI 行(标签 + badge 并排) */
.metric-label-row {
height: 30rpx;
display: flex;
align-items: center;
margin-bottom: 20rpx;
.metric-label {
margin-bottom: 0;
}
/* BMI 标准/偏高 badge */
.bmi-badge {
height: 30rpx;
padding: 0 10rpx;
margin-left: 10rpx;
font-size: 18rpx;
line-height: 30rpx;
border-radius: 8rpx;
color: #FFFFFF;
background-color: #2AC79F;
}
}
.metric-value-row {
display: flex;
align-items: baseline;
@@ -270,13 +296,21 @@
color: #252535;
height: 26rpx;
font-size: 26rpx;
font-weight: 500;
font-weight: bold;
line-height: 26rpx;
}
}
}
}
}
.card-lianjie {
position: absolute;
right: 24rpx;
width: 32rpx;
height: 84rpx;
bottom: -55rpx;
}
}
/* ===== 详细数据卡 ===== */
@@ -288,12 +322,12 @@
box-sizing: border-box;
background-color: #FFFFFF;
/* 卡头 */
/* 卡头(带渐变背景) */
.card-header {
width: 100%;
height: 88rpx;
padding-left: 30rpx;
padding-right: 30rpx;
padding-right: 50rpx;
box-sizing: border-box;
display: flex;
align-items: center;
@@ -318,16 +352,28 @@
line-height: 30rpx;
}
}
.card-header-right {
display: flex;
align-items: center;
.link-text {
color: #77849E;
height: 24rpx;
font-size: 24rpx;
line-height: 24rpx;
}
}
}
/* 详细数据:三格 */
/* ===== 详细数据:三格 ===== */
.detail-grid {
display: flex;
padding: 0 30rpx;
justify-content: space-between;
.detail-item {
width: 194rpx;
width: 195rpx;
padding: 24rpx;
box-sizing: border-box;
border-radius: 16rpx;
@@ -350,7 +396,7 @@
color: #252535;
height: 44rpx;
font-size: 44rpx;
font-weight: 500;
font-weight: bold;
line-height: 44rpx;
margin-right: 2rpx;
}
@@ -359,7 +405,6 @@
color: #252535;
height: 26rpx;
font-size: 26rpx;
font-weight: 500;
line-height: 26rpx;
}
}