[AI Generated]: feat(device): 设备列表添加 scroll-view 支持滚动,优化布局结构
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Sonnet 4.6
parent
0a05fde0ba
commit
14ec4fe177
@@ -2,36 +2,41 @@
|
||||
.equipment {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 30rpx 30rpx 0;
|
||||
box-sizing: border-box;
|
||||
background-color: #F7F8FA;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
/* 副标题:已配对设备 */
|
||||
.section-title {
|
||||
color: #808080;
|
||||
height: 28rpx;
|
||||
height: 80rpx;
|
||||
font-size: 26rpx;
|
||||
line-height: 28rpx;
|
||||
padding: 0 30rpx;
|
||||
margin-bottom: 20rpx;
|
||||
line-height: 80rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* 卡片列表 */
|
||||
/* 卡片列表(scroll-view) */
|
||||
.device-list {
|
||||
flex: 1;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.scroll-view-content {
|
||||
width: 100%;
|
||||
padding: 0 30rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
.device-card {
|
||||
width: 100%;
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 16rpx;
|
||||
padding: 30rpx;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 24rpx;
|
||||
// margin: 0 30rpx 24rpx;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
|
||||
/* 上半:图标 + 设备名 + 状态 */
|
||||
@@ -153,6 +158,7 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 底部「添加设备」主按钮 */
|
||||
.add-btn {
|
||||
@@ -163,7 +169,8 @@
|
||||
justify-content: center;
|
||||
background-color: #1385FA;
|
||||
border-radius: 44rpx;
|
||||
margin: 40rpx auto 0;
|
||||
margin: 40rpx auto;
|
||||
flex-shrink: 0;
|
||||
|
||||
.add-btn-icon {
|
||||
color: #FFFFFF;
|
||||
|
||||
@@ -5,6 +5,8 @@
|
||||
|
||||
<!-- 设备卡片列表 -->
|
||||
<view class="device-list">
|
||||
<scroll-view class="scrollView" scroll-y>
|
||||
<view class="scroll-view-content">
|
||||
<block wx:for="{{ deviceList }}" wx:key="id">
|
||||
<view class="device-card">
|
||||
|
||||
@@ -49,6 +51,8 @@
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
<!-- 底部「添加设备」主按钮 -->
|
||||
<view class="add-btn" bind:tap="onTapAdd">
|
||||
|
||||
Reference in New Issue
Block a user