123 lines
2.9 KiB
Vue
123 lines
2.9 KiB
Vue
<script setup>
|
|
// 移除群成员
|
|
|
|
// 腾讯云聊天
|
|
import TencentCloudChat from '@tencentcloud/chat';
|
|
import {
|
|
ref,
|
|
reactive,
|
|
nextTick,
|
|
onUnmounted,
|
|
onMounted,
|
|
computed,
|
|
getCurrentInstance,
|
|
watch,
|
|
} from 'vue'
|
|
// api
|
|
import api from '@/api/index.js'
|
|
// 工具库
|
|
import util from '@/common/js/util.js'
|
|
import {
|
|
onLoad,
|
|
onReady,
|
|
onPageScroll,
|
|
onUnload
|
|
} from "@dcloudio/uni-app"
|
|
import {
|
|
useStore
|
|
} from 'vuex'
|
|
import { filter } from 'lodash';
|
|
// 群组id
|
|
const groupId = ref('')
|
|
// 好友列表
|
|
const friendList = reactive([])
|
|
// 群成员列表
|
|
const memberList = reactive([])
|
|
// 新增成员
|
|
const newMemberIds = reactive([])
|
|
const store = useStore()
|
|
// 用户信息
|
|
const userinfo = computed(() => store.state.userinfo)
|
|
|
|
onLoad((option) => {
|
|
if (option.groupId) groupId.value = option.groupId
|
|
// 获取群成员列表
|
|
getGroupMemberList()
|
|
})
|
|
|
|
/**
|
|
* 获取群成员列表
|
|
* https://web.sdk.qcloud.com/im/doc/v3/zh-cn/SDK.html#getGroupMemberList
|
|
*/
|
|
function getGroupMemberList() {
|
|
uni.$chat.getGroupMemberList({
|
|
groupID: groupId.value,
|
|
count: 100,
|
|
}).then(function(rs) {
|
|
memberList.length = 0
|
|
memberList.push(...rs.data.memberList.filter(item => {
|
|
return item.userID !== userinfo.value.id
|
|
}))
|
|
console.log('memberList', memberList)
|
|
})
|
|
}
|
|
|
|
/**
|
|
* 选择人员
|
|
* @param {String} id 群成员id
|
|
*/
|
|
function handleUser(id) {
|
|
let find_index = newMemberIds.findIndex(node => node === id)
|
|
if (find_index >= 0) newMemberIds.splice(find_index, 1)
|
|
else newMemberIds.push(id)
|
|
}
|
|
|
|
/**
|
|
* 删除群成员
|
|
* https://web.sdk.qcloud.com/im/doc/v3/zh-cn/SDK.html#deleteGroupMember
|
|
*/
|
|
function handleSubmit() {
|
|
uni.$chat.deleteGroupMember({
|
|
groupID: groupId.value,
|
|
userIDList: newMemberIds,
|
|
}).then((rs) => {
|
|
uni.navigateBack()
|
|
}).catch((imError) => {
|
|
console.warn('addGroupMember error:', imError); // 错误信息
|
|
});
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<view class="appbw">
|
|
<view class="list pb30">
|
|
<view class="item rows mlr20" v-for="(item, index) in memberList" :key="item.userID" :id="item.userID"
|
|
@click="handleUser(item.userID)">
|
|
<view class="checkBox">
|
|
<template v-if="newMemberIds.includes(item.userID)">
|
|
<uni-icons type="checkbox-filled" size="40rpx" color="#37B111" />
|
|
</template>
|
|
<template v-else>
|
|
<uni-icons type="circle" size="40rpx" color="#999" />
|
|
</template>
|
|
</view>
|
|
|
|
<view class="child pl30 pr50 f1">
|
|
<view class="item rows ptb20">
|
|
<image class="wh80 avatar cir" :src="item.avatar" mode="aspectFill" />
|
|
<view class="name thd f1 ml20 c333 f32">{{ item.nameCard || item.nick }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="mtb20 nomore">到底啦~</view>
|
|
</view>
|
|
|
|
<view class="footer plr30 bfff">
|
|
<view class="btn colourful" @click="handleSubmit">移除</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
</style> |