[AI Generated]: refactor(member,my): 成员页重构为 flex+scroll-view 布局并设为首页；我的页改为 onShow 刷新
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
17792275749
co-authored by
Claude Sonnet 4.6
Claude Sonnet 4.6
parent
14ec4fe177
commit
2ecb86871b
@@ -12,7 +12,6 @@
|
||||
color: #808080;
|
||||
height: 80rpx;
|
||||
font-size: 26rpx;
|
||||
line-height: 28rpx;
|
||||
padding: 0 30rpx;
|
||||
line-height: 80rpx;
|
||||
flex-shrink: 0;
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
.equipmentMember {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
/* 顶部浅红提示条(未连接态) */
|
||||
.tips {
|
||||
@@ -10,6 +12,7 @@
|
||||
padding-left: 30rpx;
|
||||
align-items: center;
|
||||
flex-shrink: 0;
|
||||
margin-bottom: 24rpx;
|
||||
box-sizing: border-box;
|
||||
background-color: rgba(255, 77, 79, 0.12);
|
||||
|
||||
@@ -37,9 +40,11 @@
|
||||
|
||||
.seaction {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 24rpx 30rpx 0 ;
|
||||
box-sizing: border-box;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 24rpx;
|
||||
|
||||
/* 设备卡(大卡:左插画 + 右信息) */
|
||||
.device-card {
|
||||
@@ -103,51 +108,51 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* 成员卡(容量小标题 + 列表整体白卡) */
|
||||
.member-card {
|
||||
width: 100%;
|
||||
margin-bottom: 40rpx;
|
||||
border-radius: 20rpx;
|
||||
background-color: #FFFFFF;
|
||||
.scrollViewContent {
|
||||
box-sizing: border-box;
|
||||
|
||||
/* 容量小标题 */
|
||||
.member-card-header {
|
||||
/* 成员卡(容量小标题 + 列表整体白卡) */
|
||||
.member-card {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
display: flex;
|
||||
padding: 0 30rpx;
|
||||
flex: 1;
|
||||
box-sizing: border-box;
|
||||
border-bottom: 1rpx solid #EAECF1;
|
||||
justify-content: space-between;
|
||||
overflow: hidden;
|
||||
margin-bottom: 40rpx;
|
||||
border-radius: 20rpx;
|
||||
background-color: #FFFFFF;
|
||||
|
||||
.capacity-label {
|
||||
color: #252535;
|
||||
/* 容量小标题 */
|
||||
.member-card-header {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
line-height: 88rpx;
|
||||
}
|
||||
display: flex;
|
||||
padding: 0 30rpx;
|
||||
box-sizing: border-box;
|
||||
border-bottom: 1rpx solid #EAECF1;
|
||||
justify-content: space-between;
|
||||
|
||||
.capacity-value {
|
||||
color: #1385FA;
|
||||
height: 88rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
line-height: 88rpx;
|
||||
}
|
||||
}
|
||||
.capacity-label {
|
||||
color: #252535;
|
||||
height: 88rpx;
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
line-height: 88rpx;
|
||||
}
|
||||
|
||||
/* 列表 */
|
||||
.member-card-list {
|
||||
width: 100%;
|
||||
padding: 0 30rpx;
|
||||
box-sizing: border-box;
|
||||
.capacity-value {
|
||||
color: #1385FA;
|
||||
height: 88rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
line-height: 88rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.member-item {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20rpx 0;
|
||||
padding: 20rpx 30rpx;
|
||||
box-sizing: border-box;
|
||||
border-bottom: 1rpx solid #F0F0F2;
|
||||
|
||||
@@ -259,6 +264,14 @@
|
||||
color: #77849E;
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 100%;
|
||||
height: 120rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #FFFFFF;
|
||||
|
||||
/* 底部添加成员按钮 */
|
||||
.add-member {
|
||||
|
||||
@@ -10,72 +10,78 @@
|
||||
|
||||
<view class="seaction">
|
||||
<!-- 设备卡 -->
|
||||
<view class="device-card">
|
||||
<image class="device-illustration" src="/images/device/{{ deviceCard.name }}.png" mode="aspectFit"></image>
|
||||
<view class="device-info">
|
||||
<view class="device-name">{{ deviceCard.name }}</view>
|
||||
<view class="device-status">
|
||||
<view class="status-dot {{ connected ? 'status-dot-on' : 'status-dot-off' }}"></view>
|
||||
<view class="status-text">{{ connected ? '设备已连接' : '未连接' }}</view>
|
||||
<view class="page-container">
|
||||
<view class="device-card">
|
||||
<image class="device-illustration" src="/images/device/{{ deviceCard.name }}.png" mode="aspectFit"></image>
|
||||
<view class="device-info">
|
||||
<view class="device-name">{{ deviceCard.name }}</view>
|
||||
<view class="device-status">
|
||||
<view class="status-dot {{ connected ? 'status-dot-on' : 'status-dot-off' }}"></view>
|
||||
<view class="status-text">{{ connected ? '设备已连接' : '未连接' }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 成员卡(容量 + 列表) -->
|
||||
<view class="member-card">
|
||||
<!-- 设备容量(仅已连接态) -->
|
||||
<block wx:if="{{ connected }}">
|
||||
<view class="member-card-header">
|
||||
<view class="capacity-label">设备容量</view>
|
||||
<view class="capacity-value">
|
||||
{{ deviceCard.capacityUsed }}/{{ deviceCard.capacityTotal }}
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<scroll-view class="scrollView" scroll-y>
|
||||
<view class="scrollViewContent page-container">
|
||||
<!-- 成员卡(容量 + 列表) -->
|
||||
<view class="member-card">
|
||||
<!-- 设备容量(仅已连接态) -->
|
||||
<block wx:if="{{ connected }}">
|
||||
<view class="member-card-header">
|
||||
<view class="capacity-label">设备容量</view>
|
||||
<view class="capacity-value">
|
||||
{{ deviceCard.capacityUsed }}/{{ deviceCard.capacityTotal }}
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!-- 成员列表 -->
|
||||
<scroll-view scroll-y class="member-card-list">
|
||||
<block wx:for="{{ memberList }}" wx:key="id">
|
||||
<view class="member-item">
|
||||
<!-- 头像：取名字第一个字 -->
|
||||
<view class="member-avatar">{{ item.realname[0] }}</view>
|
||||
<!-- 成员列表 -->
|
||||
<block wx:for="{{ memberList }}" wx:key="id">
|
||||
<view class="member-item">
|
||||
<!-- 头像：取名字第一个字 -->
|
||||
<view class="member-avatar">{{ item.realname[0] }}</view>
|
||||
|
||||
<!-- 信息列 -->
|
||||
<view class="member-info">
|
||||
<view class="member-name-row">
|
||||
<view class="member-name">{{ item.realname }}</view>
|
||||
<!-- 本人 badge -->
|
||||
<block wx:if="{{ item.relationType == 1 }}">
|
||||
<view class="badge badge-self">本人</view>
|
||||
<!-- 信息列 -->
|
||||
<view class="member-info">
|
||||
<view class="member-name-row">
|
||||
<view class="member-name">{{ item.realname }}</view>
|
||||
<!-- 本人 badge -->
|
||||
<block wx:if="{{ item.relationType == 1 }}">
|
||||
<view class="badge badge-self">本人</view>
|
||||
</block>
|
||||
</view>
|
||||
<view class="member-meta">
|
||||
<text class="meta-text">{{ item.sex_dictText }}</text>
|
||||
<text class="meta-divider">·</text>
|
||||
<text class="meta-text">{{ item.ageDisplay }}岁</text>
|
||||
<text class="meta-divider">|</text>
|
||||
<text class="meta-text">{{ item.height }}cm</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 右侧:他人添加 badge 或 编辑/删除按钮 -->
|
||||
<view class="member-actions">
|
||||
<!-- 他人添加：仅展示 badge -->
|
||||
<block wx:if="{{ item.relationType == 3 }}">
|
||||
<view class="badge badge-other">他人添加</view>
|
||||
</block>
|
||||
<!-- 自己添加（relationType == 2）：显示编辑/删除 -->
|
||||
<block wx:elif="{{ item.relationType != 1 }}">
|
||||
<view class="action-text" data-id="{{ item.id }}" bind:tap="onTapEdit">编辑</view>
|
||||
<view class="action-text action-text-danger" data-id="{{ item.id }}" bind:tap="onTapDelete">删除</view>
|
||||
</block>
|
||||
</view>
|
||||
<view class="member-meta">
|
||||
<text class="meta-text">{{ item.sex_dictText }}</text>
|
||||
<text class="meta-divider">·</text>
|
||||
<text class="meta-text">{{ item.ageDisplay }}岁</text>
|
||||
<text class="meta-divider">|</text>
|
||||
<text class="meta-text">{{ item.height }}cm</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
<!-- 右侧:他人添加 badge 或 编辑/删除按钮 -->
|
||||
<view class="member-actions">
|
||||
<!-- 他人添加：仅展示 badge -->
|
||||
<block wx:if="{{ item.relationType == 3 }}">
|
||||
<view class="badge badge-other">他人添加</view>
|
||||
</block>
|
||||
<!-- 自己添加（relationType == 2）：显示编辑/删除 -->
|
||||
<block wx:elif="{{ item.relationType != 1 }}">
|
||||
<view class="action-text" data-id="{{ item.id }}" bind:tap="onTapEdit">编辑</view>
|
||||
<view class="action-text action-text-danger" data-id="{{ item.id }}" bind:tap="onTapDelete">删除</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
<!-- 底部添加成员按钮 -->
|
||||
<!-- 底部添加成员按钮 -->
|
||||
<view class="btn">
|
||||
<view class="add-member {{ connected ? '' : 'add-member-disabled' }}" bind:tap="onTapAddMember">
|
||||
<view class="add-member-icon">+</view>
|
||||
<view class="add-member-text">添加成员<text>（最多10位）</text></view>
|
||||
|
||||
@@ -32,7 +32,7 @@ Page({
|
||||
userInfo: null as PageUserInfo | null,
|
||||
},
|
||||
|
||||
onLoad() {
|
||||
onShow() {
|
||||
const raw = wx.getStorageSync('userInfo') as StorageUserInfo | null
|
||||
if (!raw?.userId) return
|
||||
const userInfo: PageUserInfo = {
|
||||
|
||||
Reference in New Issue
Block a user