85 lines
2.9 KiB
Text
85 lines
2.9 KiB
Text
<!-- 💬 @提醒选择组件 -->
|
|
<view class="mention-selector-container" wx:if="{{visible}}" bindtap="onMaskTap">
|
|
<view class="selector-content" catchtap="stopPropagation">
|
|
<!-- 选择器头部 -->
|
|
<view class="selector-header">
|
|
<text class="header-title">选择要@的成员</text>
|
|
<view class="close-btn" bindtap="onClose">
|
|
<text class="close-icon">✕</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 搜索框 -->
|
|
<view class="search-container">
|
|
<view class="search-input-wrapper">
|
|
<text class="search-icon">🔍</text>
|
|
<input class="search-input"
|
|
placeholder="搜索群成员"
|
|
value="{{searchKeyword}}"
|
|
bindinput="onSearchInput" />
|
|
<view wx:if="{{searchKeyword}}"
|
|
class="clear-search"
|
|
bindtap="clearSearch">
|
|
<text class="clear-icon">✕</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 成员列表 -->
|
|
<scroll-view class="members-list" scroll-y="true">
|
|
<!-- @全体成员 -->
|
|
<view wx:if="{{showMentionAll && !searchKeyword}}"
|
|
class="member-item mention-all"
|
|
bindtap="onMentionAll">
|
|
<view class="member-avatar-container">
|
|
<view class="mention-all-avatar">
|
|
<text class="mention-all-icon">@</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="member-info">
|
|
<text class="member-name">所有人</text>
|
|
<text class="member-desc">@全体成员</text>
|
|
</view>
|
|
|
|
<view class="member-action">
|
|
<text class="action-text">@</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 群成员 -->
|
|
<view class="member-item"
|
|
wx:for="{{filteredMembers}}"
|
|
wx:key="userId"
|
|
bindtap="onMentionMember"
|
|
data-member="{{item}}">
|
|
<view class="member-avatar-container">
|
|
<image class="member-avatar"
|
|
src="{{item.avatar || '/images/default-avatar.png'}}"
|
|
mode="aspectFill" />
|
|
<view wx:if="{{item.role === 'owner'}}" class="role-badge owner">
|
|
<text class="role-text">群主</text>
|
|
</view>
|
|
<view wx:elif="{{item.role === 'admin'}}" class="role-badge admin">
|
|
<text class="role-text">管理员</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="member-info">
|
|
<text class="member-name">{{item.nickname || item.username}}</text>
|
|
<text class="member-desc">{{item.status || ''}}</text>
|
|
</view>
|
|
|
|
<view class="member-action">
|
|
<text class="action-text">@</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 空状态 -->
|
|
<view class="empty-state" wx:if="{{filteredMembers.length === 0 && searchKeyword}}">
|
|
<text class="empty-icon">👥</text>
|
|
<text class="empty-text">没有找到相关成员</text>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
</view>
|