302 lines
11 KiB
Text
302 lines
11 KiB
Text
|
<!-- 👥 群成员管理页面 -->
|
|||
|
|
<view class="group-members-container">
|
|||
|
|
<!-- 自定义导航栏 -->
|
|||
|
|
<view class="custom-navbar" style="padding-top: {{menuButtonInfo.top}}px;">
|
|||
|
|
<view class="navbar-content" style="height: {{menuButtonHeight}}px;">
|
|||
|
|
<view class="navbar-aran">
|
|||
|
|
<view class="navbar-left" bindtap="goBack">
|
|||
|
|
<!-- <text class="back-icon">‹</text> -->
|
|||
|
|
<image class="back-icon" src="../../../images/back_arrow.svg" mode="" />
|
|||
|
|
</view>
|
|||
|
|
<view class="navbar-title">
|
|||
|
|
<!-- <text class="title-text">群成员 ({{memberCount}})</text> -->
|
|||
|
|
<view class="title-text">群成员管理</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="menu-rigth">
|
|||
|
|
<image class="menu-icon" src="../../../images/group/menu.svg" mode="" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- <view class="navbar-right" wx:if="{{canInviteMembers}}" bindtap="inviteMembers">
|
|||
|
|
<text class="invite-text">邀请</text>
|
|||
|
|
</view> -->
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="members-conten">
|
|||
|
|
<view class="conten-aran">
|
|||
|
|
<view class="members-aran-img">
|
|||
|
|
<image class="aran-img" src="../../../images/group/testImg.jpg" mode="" />
|
|||
|
|
<view>
|
|||
|
|
欢乐谷
|
|||
|
|
<image class="aran-edit" src="../../../images/group/edit.svg" mode="" />
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="member-text-conten">
|
|||
|
|
<view class="text-conten"> 已选择
|
|||
|
|
<view class="member-count">10</view>
|
|||
|
|
/20个成员
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="member-action">
|
|||
|
|
<view class="member-btn">移出群聊</view>
|
|||
|
|
<view class="member-btn">添加成员</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="member-out">
|
|||
|
|
<scroll-view scroll-y="true" class="scroll-container">
|
|||
|
|
<view class="member-arrs">
|
|||
|
|
<view class="arrs-aran" wx:for="{{testArrs}}" wx:key="index">
|
|||
|
|
<view class="arrs-aran-img">
|
|||
|
|
<image class="aran-img-avatar" src="{{item.avatar}}" mode=""/>
|
|||
|
|
</view>
|
|||
|
|
<view class="arrs-aran-title">{{item.nickname}}</view>
|
|||
|
|
<view class="arrs-aran-selected">
|
|||
|
|
<view class="aran-selected"></view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</scroll-view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
<!-- 页面内容 -->
|
|||
|
|
<!-- <view class="page-content"> -->
|
|||
|
|
<!-- 搜索栏 -->
|
|||
|
|
<!-- <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> -->
|
|||
|
|
|
|||
|
|
<!-- 成员筛选 -->
|
|||
|
|
<!-- <view class="filter-container">
|
|||
|
|
<view class="filter-tabs">
|
|||
|
|
<view class="filter-tab {{currentFilter === 'all' ? 'active' : ''}}"
|
|||
|
|
bindtap="switchFilter"
|
|||
|
|
data-filter="all">
|
|||
|
|
<text class="tab-text">全部 ({{memberCount}})</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="filter-tab {{currentFilter === 'admin' ? 'active' : ''}}"
|
|||
|
|
bindtap="switchFilter"
|
|||
|
|
data-filter="admin">
|
|||
|
|
<text class="tab-text">管理员 ({{adminCount}})</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="filter-tab {{currentFilter === 'member' ? 'active' : ''}}"
|
|||
|
|
bindtap="switchFilter"
|
|||
|
|
data-filter="member">
|
|||
|
|
<text class="tab-text">成员 ({{normalMemberCount}})</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|
|||
|
|
|
|||
|
|
<!-- 成员列表 -->
|
|||
|
|
<!-- <scroll-view class="members-list" scroll-y="true"> -->
|
|||
|
|
<!-- 群主 -->
|
|||
|
|
<!-- <view wx:if="{{groupOwner && (currentFilter === 'all' || currentFilter === 'admin')}}"
|
|||
|
|
class="member-section">
|
|||
|
|
<view class="section-title">
|
|||
|
|
<text class="title-text">群主</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="member-item owner"
|
|||
|
|
bindtap="viewMemberProfile"
|
|||
|
|
data-user-id="{{groupOwner.userId}}">
|
|||
|
|
<view class="member-avatar-container">
|
|||
|
|
<image class="member-avatar"
|
|||
|
|
src="{{groupOwner.avatar || '/images/default-avatar.svg'}}"
|
|||
|
|
mode="aspectFill" />
|
|||
|
|
<view class="role-badge owner">
|
|||
|
|
<text class="role-text">群主</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="member-info">
|
|||
|
|
<text class="member-name">{{groupOwner.nickname || groupOwner.username}}</text>
|
|||
|
|
<text class="member-status">{{groupOwner.status || ''}}</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="member-actions">
|
|||
|
|
<text class="action-arrow">›</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|
|||
|
|
|
|||
|
|
<!-- 管理员 -->
|
|||
|
|
<!-- <view wx:if="{{filteredAdmins.length > 0 && (currentFilter === 'all' || currentFilter === 'admin')}}"
|
|||
|
|
class="member-section">
|
|||
|
|
<view class="section-title">
|
|||
|
|
<text class="title-text">管理员</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="member-item admin"
|
|||
|
|
wx:for="{{filteredAdmins}}"
|
|||
|
|
wx:key="userId"
|
|||
|
|
bindtap="viewMemberProfile"
|
|||
|
|
data-user-id="{{item.userId}}"
|
|||
|
|
bindlongpress="showMemberActions"
|
|||
|
|
data-member="{{item}}">
|
|||
|
|
<view class="member-avatar-container">
|
|||
|
|
<image class="member-avatar"
|
|||
|
|
src="{{item.avatar || '/images/default-avatar.svg'}}"
|
|||
|
|
mode="aspectFill" />
|
|||
|
|
<view 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-status">{{item.status || ''}}</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="member-actions">
|
|||
|
|
<view wx:if="{{isOwner && item.userId !== currentUserId}}"
|
|||
|
|
class="action-btn"
|
|||
|
|
bindtap="showMemberActions"
|
|||
|
|
data-member="{{item}}"
|
|||
|
|
catchtap="stopPropagation">
|
|||
|
|
<text class="action-icon">⋯</text>
|
|||
|
|
</view>
|
|||
|
|
<text class="action-arrow">›</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|
|||
|
|
|
|||
|
|
<!-- 普通成员 -->
|
|||
|
|
<!-- <view wx:if="{{filteredMembers.length > 0 && (currentFilter === 'all' || currentFilter === 'member')}}"
|
|||
|
|
class="member-section">
|
|||
|
|
<view class="section-title">
|
|||
|
|
<text class="title-text">成员</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="member-item member"
|
|||
|
|
wx:for="{{filteredMembers}}"
|
|||
|
|
wx:key="userId"
|
|||
|
|
bindtap="viewMemberProfile"
|
|||
|
|
data-user-id="{{item.userId}}"
|
|||
|
|
bindlongpress="showMemberActions"
|
|||
|
|
data-member="{{item}}">
|
|||
|
|
<view class="member-avatar-container">
|
|||
|
|
<image class="member-avatar"
|
|||
|
|
src="{{item.avatar || '/images/default-avatar.svg'}}"
|
|||
|
|
mode="aspectFill" />
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="member-info">
|
|||
|
|
<text class="member-name">{{item.nickname || item.username}}</text>
|
|||
|
|
<text class="member-status">{{item.status || ''}}</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="member-actions">
|
|||
|
|
<view wx:if="{{isOwnerOrAdmin && item.userId !== currentUserId}}"
|
|||
|
|
class="action-btn"
|
|||
|
|
bindtap="showMemberActions"
|
|||
|
|
data-member="{{item}}"
|
|||
|
|
catchtap="stopPropagation">
|
|||
|
|
<text class="action-icon">⋯</text>
|
|||
|
|
</view>
|
|||
|
|
<text class="action-arrow">›</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
-->
|
|||
|
|
<!-- 空状态 -->
|
|||
|
|
<!-- <view class="empty-state" wx:if="{{filteredMembers.length === 0 && filteredAdmins.length === 0 && !groupOwner}}">
|
|||
|
|
<text class="empty-icon">👥</text>
|
|||
|
|
<text class="empty-text">{{searchKeyword ? '没有找到相关成员' : '暂无成员'}}</text>
|
|||
|
|
</view>
|
|||
|
|
</scroll-view>
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|
|||
|
|
|
|||
|
|
<!-- 成员操作菜单 -->
|
|||
|
|
<!-- <view class="member-action-modal" wx:if="{{showMemberActionModal}}" bindtap="closeMemberActionModal">
|
|||
|
|
<view class="modal-content" catchtap="stopPropagation">
|
|||
|
|
<view class="modal-header">
|
|||
|
|
<view class="member-info-header">
|
|||
|
|
<image class="member-avatar-large"
|
|||
|
|
src="{{selectedMember.avatar || '/images/default-avatar.svg'}}"
|
|||
|
|
mode="aspectFill" />
|
|||
|
|
<view class="member-details">
|
|||
|
|
<text class="member-name-large">{{selectedMember.nickname || selectedMember.username}}</text>
|
|||
|
|
<text class="member-role-text">{{selectedMember.role === 'admin' ? '管理员' : '成员'}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="close-btn" bindtap="closeMemberActionModal">
|
|||
|
|
<text class="close-icon">✕</text>
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|
|||
|
|
|
|||
|
|
<!-- <view class="action-list">
|
|||
|
|
查看资料
|
|||
|
|
<view class="action-item" bindtap="viewMemberProfile" data-user-id="{{selectedMember.userId}}">
|
|||
|
|
<view class="action-icon-wrapper">
|
|||
|
|
<text class="action-icon">👤</text>
|
|||
|
|
</view>
|
|||
|
|
<text class="action-title">查看资料</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
发送消息
|
|||
|
|
<view class="action-item" bindtap="sendMessageToMember">
|
|||
|
|
<view class="action-icon-wrapper">
|
|||
|
|
<text class="action-icon">💬</text>
|
|||
|
|
</view>
|
|||
|
|
<text class="action-title">发送消息</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
设置/取消管理员
|
|||
|
|
<view wx:if="{{isOwner && selectedMember.role !== 'owner'}}"
|
|||
|
|
class="action-item"
|
|||
|
|
bindtap="toggleMemberAdmin">
|
|||
|
|
<view class="action-icon-wrapper">
|
|||
|
|
<text class="action-icon">{{selectedMember.role === 'admin' ? '👤' : '👑'}}</text>
|
|||
|
|
</view>
|
|||
|
|
<text class="action-title">{{selectedMember.role === 'admin' ? '取消管理员' : '设为管理员'}}</text>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
移出群聊
|
|||
|
|
<view wx:if="{{canRemoveMember}}"
|
|||
|
|
class="action-item danger"
|
|||
|
|
bindtap="removeMemberFromGroup">
|
|||
|
|
<view class="action-icon-wrapper">
|
|||
|
|
<text class="action-icon">🚫</text>
|
|||
|
|
</view>
|
|||
|
|
<text class="action-title">移出群聊</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|
|||
|
|
|
|||
|
|
<!-- 加载提示 -->
|
|||
|
|
<!-- <view class="loading-overlay" wx:if="{{loading}}">
|
|||
|
|
<view class="loading-content">
|
|||
|
|
<view class="loading-spinner"></view>
|
|||
|
|
<text class="loading-text">{{loadingText}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|