[AI Generated]: feat(device): 设备列表添加 scroll-view 支持滚动,优化布局结构

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
17792275749
2026-05-26 14:36:01 +08:00
co-authored by Claude Sonnet 4.6
parent 0a05fde0ba
commit 14ec4fe177
2 changed files with 174 additions and 163 deletions
+17 -10
View File
@@ -2,36 +2,41 @@
.equipment { .equipment {
width: 100%; width: 100%;
height: 100%; height: 100%;
padding: 30rpx 30rpx 0;
box-sizing: border-box; box-sizing: border-box;
background-color: #F7F8FA; background-color: #F7F8FA;
display: flex;
flex-direction: column;
/* 副标题:已配对设备 */ /* 副标题:已配对设备 */
.section-title { .section-title {
color: #808080; color: #808080;
height: 28rpx; height: 80rpx;
font-size: 26rpx; font-size: 26rpx;
line-height: 28rpx; line-height: 28rpx;
padding: 0 30rpx; padding: 0 30rpx;
margin-bottom: 20rpx; line-height: 80rpx;
flex-shrink: 0;
} }
/* 卡片列表 */ /* 卡片列表scroll-view */
.device-list { .device-list {
flex: 1;
width: 100%; width: 100%;
display: flex;
flex-direction: column; .scroll-view-content {
width: 100%;
padding: 0 30rpx;
box-sizing: border-box;
.device-card { .device-card {
width: 100%;
background-color: #FFFFFF; background-color: #FFFFFF;
border-radius: 16rpx; border-radius: 16rpx;
padding: 30rpx; padding: 30rpx;
box-sizing: border-box; box-sizing: border-box;
margin-bottom: 24rpx; // margin: 0 30rpx 24rpx;
&:last-child { &:last-child {
margin-bottom: 0; margin-bottom: 30rpx;
} }
/* 上半:图标 + 设备名 + 状态 */ /* 上半:图标 + 设备名 + 状态 */
@@ -153,6 +158,7 @@
} }
} }
} }
}
/* 底部「添加设备」主按钮 */ /* 底部「添加设备」主按钮 */
.add-btn { .add-btn {
@@ -163,7 +169,8 @@
justify-content: center; justify-content: center;
background-color: #1385FA; background-color: #1385FA;
border-radius: 44rpx; border-radius: 44rpx;
margin: 40rpx auto 0; margin: 40rpx auto;
flex-shrink: 0;
.add-btn-icon { .add-btn-icon {
color: #FFFFFF; color: #FFFFFF;
@@ -5,6 +5,8 @@
<!-- 设备卡片列表 --> <!-- 设备卡片列表 -->
<view class="device-list"> <view class="device-list">
<scroll-view class="scrollView" scroll-y>
<view class="scroll-view-content">
<block wx:for="{{ deviceList }}" wx:key="id"> <block wx:for="{{ deviceList }}" wx:key="id">
<view class="device-card"> <view class="device-card">
@@ -49,6 +51,8 @@
</view> </view>
</block> </block>
</view> </view>
</scroll-view>
</view>
<!-- 底部「添加设备」主按钮 --> <!-- 底部「添加设备」主按钮 -->
<view class="add-btn" bind:tap="onTapAdd"> <view class="add-btn" bind:tap="onTapAdd">