style(selectMemberDrawer): 简化成员头像为性别图片
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 4.7
parent
f8047c3eef
commit
5572c2212a
@@ -119,55 +119,11 @@
|
|||||||
padding: 24rpx 0;
|
padding: 24rpx 0;
|
||||||
border-bottom: 2rpx solid #EAEDF1;
|
border-bottom: 2rpx solid #EAEDF1;
|
||||||
|
|
||||||
/* 有图片头像 */
|
|
||||||
.member-avatar {
|
|
||||||
width: 90rpx;
|
|
||||||
height: 90rpx;
|
|
||||||
border-radius: 24rpx;
|
|
||||||
flex-shrink: 0;
|
|
||||||
|
|
||||||
&--selected {
|
|
||||||
border: 3rpx solid #50A6FF;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 纯色占位头像 */
|
/* 纯色占位头像 */
|
||||||
.member-avatar-placeholder {
|
.member-avatar-placeholder {
|
||||||
width: 90rpx;
|
width: 90rpx;
|
||||||
height: 90rpx;
|
height: 90rpx;
|
||||||
border-radius: 24rpx;
|
border-radius: 24rpx;
|
||||||
flex-shrink: 0;
|
|
||||||
|
|
||||||
image {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 男:蓝色 */
|
|
||||||
&--male {
|
|
||||||
background-color: #C6E6FF;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 女:粉色 */
|
|
||||||
&--female {
|
|
||||||
background-color: #FFD5E3;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 选中男 */
|
|
||||||
&--selected-male {
|
|
||||||
border: 3rpx solid #50A6FF;
|
|
||||||
width: 96rpx;
|
|
||||||
height: 96rpx;
|
|
||||||
margin: -3rpx 0 0 -3rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 选中女 */
|
|
||||||
&--selected-female {
|
|
||||||
border: 3rpx solid #FF8FB5;
|
|
||||||
width: 96rpx;
|
|
||||||
height: 96rpx;
|
|
||||||
margin: -3rpx 0 0 -3rpx;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 姓名 + 副标题 */
|
/* 姓名 + 副标题 */
|
||||||
|
|||||||
@@ -24,12 +24,9 @@
|
|||||||
<block wx:for="{{ members }}" wx:key="id">
|
<block wx:for="{{ members }}" wx:key="id">
|
||||||
<view class="member-item" bind:tap="onTapMember" data-member="{{ item }}">
|
<view class="member-item" bind:tap="onTapMember" data-member="{{ item }}">
|
||||||
<!-- 头像 -->
|
<!-- 头像 -->
|
||||||
<block wx:if="{{ item.avatar }}">
|
<view class="member-avatar-placeholder">
|
||||||
<image class="member-avatar {{ item.selected ? 'member-avatar--selected' : '' }}" src="{{ item.avatar }}" mode="aspectFill"></image>
|
<image src="{{ item.gender === '女' ? '/images/woman.png' : '/images/man.png' }}" mode="aspectFit" />
|
||||||
</block>
|
</view>
|
||||||
<block wx:else>
|
|
||||||
<view class="member-avatar-placeholder {{ item.gender === '女' ? 'member-avatar-placeholder--female' : 'member-avatar-placeholder--male' }} {{ item.selected && item.gender === '男' ? 'member-avatar-placeholder--selected-male' : '' }} {{ item.selected && item.gender === '女' ? 'member-avatar-placeholder--selected-female' : '' }}"><image src="{{ item.gender === '女' ? '/images/woman.png' : '/images/man.png' }}" mode="aspectFit" /></view>
|
|
||||||
</block>
|
|
||||||
|
|
||||||
<!-- 姓名 + 性别·年龄 -->
|
<!-- 姓名 + 性别·年龄 -->
|
||||||
<view class="member-info">
|
<view class="member-info">
|
||||||
|
|||||||
Reference in New Issue
Block a user