feat(selectMemberDrawer): 用户列表新增本人/员工/家庭用户标签展示

- ExistingMember 补充 dataType/relationType 字段
- API 映射层透传 dataType 与 relationType
- member-type 区域按类型展示对应颜色标签

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
17792275749
2026-06-10 17:16:22 +08:00
co-authored by Claude Opus 4.7
parent 0fab5259c9
commit 44659a6ae4
3 changed files with 274 additions and 244 deletions
@@ -64,6 +64,7 @@
} }
/* 关闭按钮 */ /* 关闭按钮 */
.drawer-close { .drawer-close {
width: 32rpx; width: 32rpx;
height: 32rpx; height: 32rpx;
@@ -127,6 +128,7 @@
margin-top: 24rpx; margin-top: 24rpx;
/* 有图片头像 */ /* 有图片头像 */
.member-avatar { .member-avatar {
width: 90rpx; width: 90rpx;
height: 90rpx; height: 90rpx;
@@ -139,6 +141,7 @@
} }
/* 纯色占位头像 */ /* 纯色占位头像 */
.member-avatar-placeholder { .member-avatar-placeholder {
width: 90rpx; width: 90rpx;
height: 90rpx; height: 90rpx;
@@ -146,16 +149,19 @@
flex-shrink: 0; flex-shrink: 0;
/* 男:蓝色 */ /* 男:蓝色 */
&--male { &--male {
background-color: #C6E6FF; background-color: #C6E6FF;
} }
/* 女:粉色 */ /* 女:粉色 */
&--female { &--female {
background-color: #FFD5E3; background-color: #FFD5E3;
} }
/* 选中男 */ /* 选中男 */
&--selected-male { &--selected-male {
border: 3rpx solid #50A6FF; border: 3rpx solid #50A6FF;
width: 96rpx; width: 96rpx;
@@ -164,6 +170,7 @@
} }
/* 选中女 */ /* 选中女 */
&--selected-female { &--selected-female {
border: 3rpx solid #FF8FB5; border: 3rpx solid #FF8FB5;
width: 96rpx; width: 96rpx;
@@ -173,6 +180,7 @@
} }
/* 姓名 + 副标题 */ /* 姓名 + 副标题 */
.member-info { .member-info {
flex: 1; flex: 1;
height: 78rpx; height: 78rpx;
@@ -197,25 +205,32 @@
} }
} }
/* 竖向分隔线 */ .member-type {
.member-divider { height: 40rpx;
width: 2rpx;
height: 24rpx;
background-color: #EAEDF1;
border-radius: 1rpx;
margin-left: 17rpx;
flex-shrink: 0; flex-shrink: 0;
.member-type-tag {
height: 40rpx;
padding: 0 14rpx;
font-size: 22rpx;
line-height: 40rpx;
border-radius: 6rpx;
} }
/* 身高 */ .member-type-tag--self {
.member-height { color: #1385FA;
color: #77849E; background-color: rgba(19, 133, 250, 0.12);
font-size: 26rpx; }
line-height: 34rpx;
white-space: nowrap; .member-type-tag--employee {
margin-left: 19rpx; color: #10B981;
width: 76rpx; background-color: rgba(16, 185, 129, 0.12);
flex-shrink: 0; }
.member-type-tag--family {
color: #F59E0B;
background-color: rgba(245, 158, 11, 0.12);
}
} }
} }
@@ -11,6 +11,8 @@ interface AddMemberApiItem {
weight: number weight: number
idCard: string | null idCard: string | null
avatar: string | null avatar: string | null
dataType?: number
relationType?: number | string | null
} }
/** GET /weighingScale/v3/select/history/user 返回的单条结构 */ /** GET /weighingScale/v3/select/history/user 返回的单条结构 */
@@ -23,6 +25,7 @@ interface HistoryApiItem {
birthday: string birthday: string
avatar: string | null avatar: string | null
relationType: number | string | null relationType: number | string | null
dataType?: number
} }
/** 抽屉内部用户项(含回填所需全量字段) */ /** 抽屉内部用户项(含回填所需全量字段) */
@@ -41,6 +44,8 @@ interface ExistingMember {
sex?: number sex?: number
birthday?: string birthday?: string
relationType?: number | string | null relationType?: number | string | null
/** 0=员工 1=家庭成员 */
dataType?: number
} }
/** /**
@@ -136,6 +141,7 @@ Component({
sex: item.sex, sex: item.sex,
birthday: item.birthday, birthday: item.birthday,
relationType: item.relationType, relationType: item.relationType,
dataType: item.dataType,
})) }))
this.setData({ members }) this.setData({ members })
}) })
@@ -155,6 +161,8 @@ Component({
weight: item.weight, weight: item.weight,
idCard: item.idCard ?? '', idCard: item.idCard ?? '',
avatar: item.avatar ?? '', avatar: item.avatar ?? '',
relationType: item.relationType,
dataType: item.dataType,
})) }))
this.setData({ members }) this.setData({ members })
}) })
@@ -27,7 +27,8 @@
<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 }}"> <block wx:if="{{ item.avatar }}">
<image class="member-avatar {{ item.selected ? 'member-avatar--selected' : '' }}" src="{{ item.avatar }}" mode="aspectFill"></image> <image class="member-avatar {{ item.selected ? 'member-avatar--selected' : '' }}"
src="{{ item.avatar }}" mode="aspectFill"></image>
</block> </block>
<block wx:else> <block wx:else>
<view class="member-avatar-placeholder {{ item.gender === '女' ? 'member-avatar-placeholder--female' : 'member-avatar-placeholder--male' }} {{ item.selected ? 'member-avatar-placeholder--selected-male' : '' }} {{ item.selected && item.gender === '女' ? 'member-avatar-placeholder--selected-female' : '' }}"></view> <view class="member-avatar-placeholder {{ item.gender === '女' ? 'member-avatar-placeholder--female' : 'member-avatar-placeholder--male' }} {{ item.selected ? 'member-avatar-placeholder--selected-male' : '' }} {{ item.selected && item.gender === '女' ? 'member-avatar-placeholder--selected-female' : '' }}"></view>
@@ -36,14 +37,20 @@
<!-- 姓名 + 性别·年龄 --> <!-- 姓名 + 性别·年龄 -->
<view class="member-info"> <view class="member-info">
<text class="member-name">{{ item.name }}</text> <text class="member-name">{{ item.name }}</text>
<text class="member-sub">{{ item.gender }}·{{ item.age }}岁</text> <text class="member-sub">{{ item.gender }}·{{ item.age }}岁 丨 {{ item.height }}cm</text>
</view> </view>
<!-- 竖向分隔线 --> <view class="member-type">
<view class="member-divider"></view> <block wx:if="{{ item.relationType == 1 }}">
<view class="member-type-tag member-type-tag--self">本人</view>
<!-- 身高 --> </block>
<text class="member-height">{{ item.height }}cm</text> <block wx:elif="{{ item.dataType === 0 }}">
<view class="member-type-tag member-type-tag--employee">员工</view>
</block>
<block wx:elif="{{ item.dataType === 1 }}">
<view class="member-type-tag member-type-tag--family">家庭用户</view>
</block>
</view>
</view> </view>
<!-- 水平分隔线 --> <!-- 水平分隔线 -->