feat(data): 历史记录列表卡片化改版

- 新增记录列表标题与总条数
- 每条记录展示体重及增减徽标、BMI与体脂率
- 新增加减号图标资源

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
17792275749
2026-09-02 11:13:45 +08:00
co-authored by Claude Opus 4.7
parent 7a1e8942a9
commit 0ffb3740fb
4 changed files with 184 additions and 25 deletions
Binary file not shown.

After

Width:  |  Height:  |  Size: 347 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 368 B

+147 -19
View File
@@ -12,7 +12,7 @@
padding: 40rpx 30rpx 30rpx;
box-sizing: border-box;
border-radius: 24rpx;
margin-bottom: 30rpx;
margin-bottom: 15rpx;
background-color: #FFFFFF;
&::before {
@@ -225,13 +225,37 @@
}
}
.data-user-title {
width: 100%;
height: 80rpx;
display: flex;
flex-wrap: nowrap;
box-sizing: border-box;
justify-content: space-between;
> view:nth-of-type(1) {
color: #252535;
height: 80rpx;
font-size: 32rpx;
font-weight: bolder;
line-height: 80rpx;
}
> view:nth-of-type(2) {
color: #808080;
height: 80rpx;
font-size: 26rpx;
line-height: 80rpx;
}
}
.data-user-list {
flex: 1;
overflow: hidden;
.scrollViewContent {
width: 100%;
padding: 24rpx 30rpx;
padding: 0 30rpx;
box-sizing: border-box;
/* 历史记录列表 */
@@ -240,41 +264,145 @@
.list {
width: 100%;
margin-bottom: 30rpx;
padding: 30rpx 48rpx 30rpx 30rpx;
border-radius: 24rpx;
box-sizing: border-box;
background-color: #FFFFFF;
margin-bottom: 24rpx;
>view:first-of-type {
.list-examTime {
color: #808080;
width: 100%;
height: 24rpx;
font-size: 24rpx;
line-height: 24rpx;
margin-bottom: 20rpx;
margin-bottom: 24rpx;
}
>view:last-of-type {
.list-weight {
width: 100%;
height: 96rpx;
height: 48rpx;
display: flex;
justify-content: space-between;
padding-left: 30rpx;
padding-right: 50rpx;
box-sizing: border-box;
flex-wrap: nowrap;
border-radius: 16rpx;
background-color: #FFFFFF;
justify-content: space-between;
margin-bottom: 30rpx;
>view {
color: #808080;
font-size: 26rpx;
height: 96rpx;
line-height: 96rpx;
> view:nth-of-type(1) {
color: #252535;
height: 48rpx;
font-size: 48rpx;
font-weight: bolder;
line-height: 48rpx;
text {
color: #808080;
font-size: 24rpx;
margin-left: 6rpx;
font-weight: normal;
}
}
> view:nth-of-type(2) {
height: 48rpx;
padding: 0 16rpx;
display: flex;
flex-wrap: nowrap;
align-items: center;
border-radius: 8rpx;
background-color: #EAFAF6;
> view:nth-of-type(1) {
width: 14rpx;
height: 18rpx;
display: flex;
align-items: center;
margin-right: 8rpx;
}
> view:nth-of-type(2) {
color: #2AC79F;
font-size: 26rpx;
height: 26rpx;
line-height: 26rpx;
}
}
&.arrow::after {
right: -24rpx;
}
}
.list-bmi {
width: 100%;
height: 26rpx;
display: flex;
flex-wrap: nowrap;
> view {
height: 26rpx;
display: flex;
flex-wrap: nowrap;
margin-right: 55rpx;
> view:nth-of-type(1) {
height: 26rpx;
width: 26rpx;
display: flex;
align-items: center;
margin-right: 10rpx;
}
> view:nth-of-type(2) {
color: #77849E;
height: 26rpx;
font-size: 26rpx;
line-height: 26rpx;
margin-right: 20rpx;
}
> view:nth-of-type(3) {
color: #252535;
font-weight: bold;
height: 26rpx;
font-size: 26rpx;
font-weight: bolder;
line-height: 26rpx;
}
}
}
// >view:first-of-type {
// color: #808080;
// width: 100%;
// height: 24rpx;
// font-size: 24rpx;
// line-height: 24rpx;
// margin-bottom: 20rpx;
// }
// >view:last-of-type {
// width: 100%;
// height: 96rpx;
// display: flex;
// justify-content: space-between;
// padding-left: 30rpx;
// padding-right: 50rpx;
// box-sizing: border-box;
// flex-wrap: nowrap;
// border-radius: 16rpx;
// background-color: #FFFFFF;
// >view {
// color: #808080;
// font-size: 26rpx;
// height: 96rpx;
// line-height: 96rpx;
// text {
// color: #252535;
// font-weight: bold;
// }
// }
// }
}
}
+33 -2
View File
@@ -56,6 +56,11 @@
</view>
</view>
<view class="data-user-title page-container">
<view>记录列表</view>
<view>共 {{total}} 条记录</view>
</view>
<view class="data-user-list">
<scroll-view class="scrollView" scroll-y refresher-enabled refresher-triggered="{{ refresherTriggered }}" bind:refresherrefresh="onRefresh" bind:scrolltolower="onScrollToLower">
<view class="scrollViewContent">
@@ -65,12 +70,38 @@
<view class="data-list">
<block wx:for="{{ records }}" wx:key="recordId">
<view class="list" bind:tap="onTapRecord" data-record-id="{{ item.recordId }}">
<view>{{ item.examTime }}</view>
<view class="list-examTime">{{ item.examTime }}</view>
<view class="list-weight arrow">
<view>{{ item.weight }}<text>kg</text></view>
<view>
<view>
<image src="/images/data/sub.png" mode="aspectFit" />
</view>
<view>0.3</view>
</view>
</view>
<view class="list-bmi">
<view>
<view>
<image src="/images/data/user.png" mode="aspectFit" />
</view>
<view>BMI</view>
<view>{{ item.bmi }}</view>
</view>
<view>
<view>
<image src="/images/data/droplet.png" mode="aspectFit" />
</view>
<view>体脂率</view>
<view>{{ item.fatRate }}%</view>
</view>
</view>
<!-- <view>{{ item.examTime }}</view>
<view class="arrow">
<view>体重:<text>{{ item.weight }}kg</text></view>
<view>BMI<text>{{ item.bmi }}</text></view>
<view>体脂率:<text>{{ item.fatRate }}%</text></view>
</view>
</view> -->
</view>
</block>
</view>