153 lines
3.1 KiB
Vue
153 lines
3.1 KiB
Vue
<script setup>
|
|
// 群组列表
|
|
|
|
import {
|
|
reactive,
|
|
onMounted,
|
|
onUnmounted,
|
|
getCurrentInstance,
|
|
} from 'vue';
|
|
// 工具库
|
|
import util from '@/common/js/util.js'
|
|
import {
|
|
onLoad,
|
|
onUnload,
|
|
} from '@dcloudio/uni-app'
|
|
// 腾讯云聊天
|
|
import TencentCloudChat from '@tencentcloud/chat';
|
|
//
|
|
import api from '@/api/index.js'
|
|
//
|
|
const {
|
|
proxy
|
|
} = getCurrentInstance()
|
|
// 数据列表
|
|
const list = reactive([])
|
|
|
|
// 右滑菜单
|
|
const rightOption = [
|
|
// {
|
|
// text: '退出群聊',
|
|
// style: {
|
|
// backgroundColor: '#F85050'
|
|
// },
|
|
// fn: (item) => quitGroup(item)
|
|
// }
|
|
]
|
|
|
|
onLoad(() => {
|
|
//
|
|
getGroupList()
|
|
// 开启监听
|
|
addListener()
|
|
})
|
|
|
|
onUnload(() => {
|
|
// 移除监听
|
|
removeListener()
|
|
})
|
|
|
|
// 开启监听
|
|
function addListener() {
|
|
let onFriendListUpdated = function(event) {
|
|
console.log('onFriendListUpdated')
|
|
getGroupList()
|
|
}
|
|
|
|
uni.$chat.on(TencentCloudChat.EVENT.GROUP_LIST_UPDATED, onFriendListUpdated);
|
|
}
|
|
|
|
// 移除监听
|
|
function removeListener() {
|
|
uni.$chat.off(TencentCloudChat.EVENT.GROUP_LIST_UPDATED);
|
|
}
|
|
|
|
// 获取群组列表
|
|
function getGroupList() {
|
|
api.news.myGroups().then(rs => {
|
|
if (rs.code == 200) {
|
|
list.length = 0
|
|
list.push(...rs.data)
|
|
console.log('group list', list)
|
|
return
|
|
}
|
|
util.alert({
|
|
content: rs.msg,
|
|
showCancel: false
|
|
})
|
|
})
|
|
}
|
|
|
|
/**
|
|
* 跳转聊天
|
|
* @param {Object} item
|
|
*/
|
|
function handleGroupItem(item) {
|
|
console.log('group item', item)
|
|
util.toChat({
|
|
name: `${item.name}`,
|
|
msgId: item.groupId,
|
|
type: 'GROUP',
|
|
num: item.memberCount,
|
|
})
|
|
}
|
|
|
|
/**
|
|
* 菜单
|
|
* @param {Object} ev 默认事件
|
|
* @param {Object} item 单项
|
|
*/
|
|
function handleMenu(ev, item) {
|
|
ev.content.fn(item)
|
|
proxy.$refs.swipeAction.closeAll()
|
|
}
|
|
|
|
/**
|
|
* 退出群组
|
|
* @param {Object} item 详情
|
|
*/
|
|
function quitGroup(item) {
|
|
util.alert({
|
|
content: '确认退出群聊？'
|
|
}).then(rs => {
|
|
if (!rs.confirm) return
|
|
uni.$chat.quitGroup({
|
|
groupID: item.groupID,
|
|
}).then(rs => {
|
|
getGroupList()
|
|
})
|
|
})
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<view class="appbw">
|
|
<uni-swipe-action ref="swipeAction">
|
|
<view class="list plr30 pb30">
|
|
<view class="item" v-for="(item, index) in list" :key="index">
|
|
<uni-swipe-action-item :right-options="rightOption" @click="handleMenu($event,item)">
|
|
<view class="item rows ptb30" @click="handleGroupItem(item)">
|
|
<image class="wh120 fs0 avatar br10" :src="item.groupFaceUrl" mode="aspectFill" />
|
|
|
|
<view class="f1 oh ml30">
|
|
<view class="name thd f1 c333 f34">{{item.name}}</view>
|
|
<!-- <view class="content thd mt10 c666 f24">{{item.lastMessage.messageForShow || ''}}</view> -->
|
|
</view>
|
|
<!-- <view class="time c999 f22" v-if="item.lastMessage.messageForShow || ''">{{util.formatTime('yyyy-MM-dd HH:mm:ss',item.lastMessage.lastTime)}}</view> -->
|
|
</view>
|
|
</uni-swipe-action-item>
|
|
</view>
|
|
|
|
<view class="mtb20 nomore">到底啦~</view>
|
|
</view>
|
|
</uni-swipe-action>
|
|
</view>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
.list {
|
|
.item + .item {
|
|
border-top: 2rpx solid #eee;
|
|
}
|
|
}
|
|
</style> |