group mangage

This commit is contained in:
cansnow
2026-01-10 15:40:38 +08:00
parent 825ac3457d
commit 941464c330
12 changed files with 392 additions and 181 deletions
@@ -1,126 +1,128 @@
<template>
<custom-nav-bar @leftClick="leftClick" :title="getTitle">
</custom-nav-bar>
<custom-nav-bar @leftClick="leftClick" :title="getTitle">
</custom-nav-bar>
</template>
<script>
import CustomNavBar from "@/components/CustomNavBar/index.vue";
import { ContactChooseTypes } from "@/constant";
export default {
name: "",
components: {
CustomNavBar,
},
props: {
checkVisible: {
type: Boolean,
default: false,
},
isNomal: {
type: Boolean,
default: false,
},
isTransfer: {
type: Boolean,
default: false,
},
isAt: {
type: Boolean,
default: false,
},
isSetAdmin: {
type: Boolean,
default: false,
},
isMute: {
type: Boolean,
default: false,
},
isCall: {
type: Boolean,
default: false,
},
groupID: String,
},
data() {
return {
moreMenuVisible: false,
};
},
computed: {
getTitle() {
if (this.isCall) {
return "邀请成员";
}
if (this.isAt) {
return "选择提醒的人";
}
if (this.isSetAdmin) {
return "设置管理员";
}
if (this.isMute) {
return "禁言成员";
}
if (this.checkVisible) {
return "移除群成员";
}
return "群成员";
},
},
methods: {
leftClick() {
if (this.checkVisible) {
this.$emit("update:checkVisible", false);
}
},
rightClick() {
this.moreMenuVisible = true;
},
checkMenu() {
if (this.moreMenuVisible) {
this.moreMenuVisible = false;
}
},
inviteMember() {
uni.navigateTo({
url: `/pages/common/contactChoose/index?type=${ContactChooseTypes.Invite}&groupID=${this.groupID}`,
});
},
removeMember() {
this.$emit("removeMember");
},
},
};
import CustomNavBar from "@/components/CustomNavBar/index.vue";
import {
ContactChooseTypes
} from "@/constant";
export default {
name: "",
components: {
CustomNavBar,
},
props: {
checkVisible: {
type: Boolean,
default: false,
},
isNomal: {
type: Boolean,
default: false,
},
isTransfer: {
type: Boolean,
default: false,
},
isAt: {
type: Boolean,
default: false,
},
isSetAdmin: {
type: Boolean,
default: false,
},
isMute: {
type: Boolean,
default: false,
},
isCall: {
type: Boolean,
default: false,
},
groupID: String,
},
data() {
return {
moreMenuVisible: false,
};
},
computed: {
getTitle() {
if (this.isCall) {
return "邀请成员";
}
if (this.isAt) {
return "选择提醒的人";
}
if (this.isSetAdmin) {
return "设置管理员";
}
if (this.isMute) {
return "禁言成员";
}
if (this.checkVisible) {
return "移除群成员";
}
return "群成员";
},
},
methods: {
leftClick() {
if (this.checkVisible) {
this.$emit("update:checkVisible", false);
}
},
rightClick() {
this.moreMenuVisible = true;
},
checkMenu() {
if (this.moreMenuVisible) {
this.moreMenuVisible = false;
}
},
inviteMember() {
uni.navigateTo({
url: `/pages/common/contactChoose/index?type=${ContactChooseTypes.Invite}&groupID=${this.groupID}`,
});
},
removeMember() {
this.$emit("removeMember");
},
},
};
</script>
<style lang="scss">
.more_container {
position: relative;
.more_container {
position: relative;
.more_dot {
padding: 24rpx;
margin-right: 20rpx;
}
.more_dot {
padding: 24rpx;
margin-right: 20rpx;
}
.more_menu {
position: absolute;
bottom: 0;
left: 50%;
transform: translate(-100%, 100%);
box-shadow: 0px 0px 6px 2px rgba(0, 0, 0, 0.16);
width: max-content;
border-radius: 8rpx;
background-color: #fff;
.more_menu {
position: absolute;
bottom: 0;
left: 50%;
transform: translate(-100%, 100%);
box-shadow: 0px 0px 6px 2px rgba(0, 0, 0, 0.16);
width: max-content;
border-radius: 8rpx;
background-color: #fff;
.menu_item {
padding: 20rpx 48rpx;
font-size: 28rpx;
color: $uni-text-color;
.menu_item {
padding: 20rpx 48rpx;
font-size: 28rpx;
color: $uni-text-color;
// &:nth-child(1) {
// border-bottom: 1px solid #F0F0F0;
// }
}
}
}
</style>
// &:nth-child(1) {
// border-bottom: 1px solid #F0F0F0;
// }
}
}
}
</style>
+167 -20
View File
@@ -1,7 +1,14 @@
<template>
<view @click="pageClick" class="group_members_container">
<group-member-list-header ref="navHeaderRef" :checkVisible.sync="showCheck" :isTransfer="isTransfer"
:isNomal="!isOwner && !isAdmin" :groupID="groupID" @removeMember="showMemberCheck" />
<group-member-list-header
ref="navHeaderRef"
:checkVisible.sync="showCheck"
:isTransfer="isTransfer"
:isSetAdmin="isSetAdmin"
:isNomal="!isOwner && !isAdmin"
:groupID="groupID"
@removeMember="showMemberCheck"
/>
<view class="search_bar_wrap">
<u-search disabled class="search_bar" shape="square" placeholder="搜索" :showAction="false"
@@ -10,22 +17,35 @@
<u-list class="member_list" @scrolltolower="loadMore" lowerThreshold="100" height="1">
<u-list-item v-for="member in groupMemberList" :key="member.userID">
<user-item @itemClick="userClick" @updateCheck="updateCheck" :checked="isChecked(member.userID)"
:checkVisible="showCheck" :disabled="!canCheck(member) && showCheck" :item="member" />
<user-item
@itemClick="userClick"
@updateCheck="updateCheck"
@longtapEvent="longtap"
:checked="isChecked(member.userID)"
:checkVisible="showCheck"
:disabled="!canCheck(member) && showCheck" :item="member"
/>
</u-list-item>
<view v-show="loadState.loading" class="member_loading">
<u-loading-icon></u-loading-icon>
</view>
</u-list>
<choose-index-footer v-if="showCheck" :comfirmLoading="comfirmLoading" @removeItem="updateCheck"
@confirm="confirm" :choosedData="getChoosedData" :isRemove="isRemove" :maxLength="groupMemberLength" />
<choose-index-footer
v-if="showCheck"
:comfirmLoading="comfirmLoading"
@removeItem="updateCheck"
@confirm="confirm"
:choosedData="getChoosedData"
:isRemove="isRemove"
:maxLength="groupMemberLength" />
<u-modal :show="showConfirmModal" asyncClose showCancelButton @confirm="modalConfirm"
@cancel="() => (showConfirmModal = false)" :content="
isRemove
? '确定移除已选群成员?'
: `确定要把群主转移给${choosedTransferMember.nickname}吗?`
<u-modal
:show="showConfirmModal"
asyncClose
showCancelButton
@confirm="modalConfirm"
@cancel="() => (showConfirmModal = false)" :content="isRemove? '确定移除已选群成员?': `确定要把群主转移给${choosedTransferMember.nickname}吗?`
" />
<u-toast ref="uToast"></u-toast>
</view>
@@ -61,6 +81,7 @@
hasMore: true,
loading: false,
},
adminUserIdList:[]
};
},
computed: {
@@ -82,6 +103,9 @@
isTransfer() {
return this.type === GroupMemberListTypes.Transfer;
},
isSetAdmin() {
return this.type === GroupMemberListTypes.setAdmin;
},
isChecked() {
return (userID) => this.choosedMemberIDList.includes(userID);
},
@@ -93,8 +117,7 @@
},
isAdmin() {
return (
this.$store.getters.storeCurrentMemberInGroup.roleLevel ===
GroupMemberRole.Admin
this.$store.getters.storeCurrentMemberInGroup.roleLevel === GroupMemberRole.Admin
);
},
canCheck() {
@@ -125,12 +148,29 @@
this.loadMemberList(groupID);
this.type = type;
this.groupID = groupID;
this.isRightKick = type === GroupMemberListTypes.Kickout;
if (
this.isRightKick
) {
this.isRightKick = (type == GroupMemberListTypes.setAdmin|| type === GroupMemberListTypes.Kickout);
if (this.isRightKick) {
this.showCheck = true;
}
if(type == GroupMemberListTypes.setAdmin){
IMSDK.asyncApi('getGroupMemberOwnerAndAdmin', IMSDK.uuid(), this.groupID).then(({data}) => {
let arr = [];
data.forEach((item)=>{
if(item.roleLevel == GroupMemberRole.Admin){
arr.push(item.userID);
}
});
this.adminUserIdList = arr;
this.choosedMemberIDList = arr;
console.log(arr);
// 调用成功
})
.catch(({ errCode, errMsg }) => {
console.log(errCode, errMsg );
// 调用失败
})
}
},
methods: {
async pageClick(e) {
@@ -146,8 +186,36 @@
this.$refs.navHeaderRef.checkMenu();
}
},
confirm() {
this.showConfirmModal = true;
async confirm() {
if(this.isSetAdmin){
uni.showLoading({mask:true})
const remveUserIds = this.adminUserIdList.filter(userID=>{
return !this.choosedMemberIDList.includes(userID);
});
const addUserIds = this.choosedMemberIDList.filter(userID=>{
return !this.adminUserIdList.includes(userID);
});
remveUserIds.forEach(async (userID)=>{
await IMSDK.asyncApi(IMSDK.IMMethods.SetGroupMemberInfo,IMSDK.uuid(),{
roleLevel:GroupMemberRole.Normal,
groupID:this.groupID,
userID:userID
});
})
addUserIds.forEach(async (userID)=>{
await IMSDK.asyncApi(IMSDK.IMMethods.SetGroupMemberInfo,IMSDK.uuid(),{
roleLevel:GroupMemberRole.Admin,
groupID:this.groupID,
userID:userID
});
})
uni.hideLoading();
this.groupMemberList = [];
this.loadMemberList(this.groupID);
uni.navigateBack();
}else{
this.showConfirmModal = true;
}
},
modalConfirm() {
let func = () => {};
@@ -182,7 +250,6 @@
} else {
this.choosedMemberIDList = [...this.choosedMemberIDList, userID];
}
console.log(this.choosedMemberIDList);
},
userClick(member) {
if (this.type === GroupMemberListTypes.Transfer) {
@@ -227,6 +294,86 @@
})
.finally(() => (this.loadState.loading = false));
},
longtap(member){
const _this = this;
if(this.isRightKick){
return ;
}
if(!this.isOwner&&!this.isAdmin){
return ;
}
if(this.$store.getters.storeCurrentMemberInGroup.roleLevel == member.roleLevel ){
return ;
}
let itemList = [];
if(this.isOwner){
itemList.push(member.roleLevel == GroupMemberRole.Admin ? '取消管理员' : '设为管理员');
}
if(this.isOwner || this.isAdmin){
itemList.push(member.muteEndTime > 0 ? '取消禁言':'设置禁言');
itemList.push('踢出群聊');
}
uni.showActionSheet({
itemList:itemList,
async success({tapIndex}) {
if(tapIndex == 0){
let roleId = itemList[tapIndex]=='设为管理员' ? GroupMemberRole.Admin : GroupMemberRole.Normal;
await IMSDK.asyncApi(IMSDK.IMMethods.SetGroupMemberInfo,IMSDK.uuid(),{
roleLevel:roleId,
groupID:_this.groupID,
userID:member.userID
});
_this.groupMemberList = _this.groupMemberList.map((item)=>{
if(item.userID == member.userID){
item.roleLevel = roleId
}
return item;
});
return ;
}
if(tapIndex == 1){
if(itemList[tapIndex]=='取消禁言'){
_this.setMute(member.userID,0)
return ;
}
uni.showActionSheet({
itemList:['2小时','8小时','1天','3天','7天','15天','30天','1年'],
async success(res){
const secs = [3600*2,3600*8,3600*24,3600*72,3600*24*7,3600*24*15,3600*24*30,3600*24*365];
_this.setMute(member.userID,secs[res.tapIndex])
}
});
return ;
}
if(tapIndex == 2){
await IMSDK.asyncApi(IMSDK.IMMethods.KickGroupMember,IMSDK.uuid(),{
groupID:_this.groupID,
reason:"",
userIDList:[member.userID]
});
_this.groupMemberList = _this.groupMemberList.filter((item)=>{
return item.userID != member.userID;
});
return ;
}
}
})
},
async setMute(userID,mutedSeconds){
const _this = this;
await IMSDK.asyncApi(IMSDK.IMMethods.ChangeGroupMemberMute,IMSDK.uuid(),{
mutedSeconds:mutedSeconds,
groupID:_this.groupID,
userID:userID
});
this.groupMemberList = this.groupMemberList.map((item)=>{
if(item.userID == userID){
item.muteEndTime = mutedSeconds===0 ? 0 : (new Date().getTime())+mutedSeconds*1000
}
return item;
});
},
showToast(message, complete = null) {
this.$refs.uToast.show({
message,