This commit is contained in:
2022-02-17 13:04:20 +08:00
11 changed files with 132 additions and 76 deletions

BIN
.DS_Store vendored

Binary file not shown.

View File

@@ -3,13 +3,16 @@
<view class="users">
<view :class="['user', {'active': item.targetId == currentUser.targetId}]" @longpress="showAction(item)"
v-for="(item, index) in users" :key="index" @click="toUser(item)">
<u-avatar :size="avatarSize" shape="square" :src="contact(item.targetId).portraitUrl"></u-avatar>
<view class="avatar">
<u-avatar :size="avatarSize" shape="square" :src="contact(item.targetId).portraitUrl"></u-avatar>
<view class="admin" v-if="item.is_admin">管理</view>
<view class="owner" v-if="item.targetId === adminUid">群主</view>
</view>
<view class="name">{{ item.name }}</view>
<view class="admin" v-if="item.is_admin">管理</view>
<view class="owner" v-if="item.targetId === adminUid">群主</view>
</view>
<view class="user" v-if="isAdmin">
<u-avatar @click="inviteUser" shape="square" icon="plus" bg-color="#eeeeee" color="#999999">
<u-avatar @click="inviteUser" :size="avatarSize" shape="square" icon="plus" bg-color="#eeeeee"
color="#999999">
</u-avatar>
<view class="name">邀请好友</view>
</view>
@@ -58,21 +61,25 @@
currentUser: {},
avatarSize: 40
}
},
computed: {
contact() {
return function(targetId) {
return this.$store.getters.contactInfo(targetId)
}
}
},
computed: {
contact() {
return function(targetId) {
return this.$store.getters.contactInfo(targetId)
}
}
},
created() {
this.avatarSize = 126 / 750 * wx.getSystemInfoSync().windowWidth
console.log(this.avatarSize)
this.avatarSize = 90 / 750 * wx.getSystemInfoSync().windowWidth
},
mounted() {
this.initGroupInfo()
this.initUsers()
getGroupUsers(this.targetId, this.count).then(res => {
this.users = res
res.map(item => {
this.$store.dispatch('updateContact', item)
})
})
},
methods: {
initGroupInfo() {
@@ -86,7 +93,6 @@
initUsers() {
getGroupUsers(this.targetId, this.count).then(res => {
this.users = res
console.log('群成员列表', res);
})
},
hideAction(item) {
@@ -237,7 +243,6 @@
}
</script>
<style lang="scss" scoped>
.users {
flex-direction: row;
@@ -246,8 +251,6 @@
padding: 20rpx 0;
.user {
overflow: hidden;
position: relative;
width: 126rpx;
margin-left: 20rpx;
margin-bottom: 20rpx;
@@ -255,12 +258,46 @@
flex-direction: column;
justify-content: center;
align-items: center;
border-radius: 0 10rpx 0 0;
&.active {
background-color: $window-color;
}
.avatar {
border-radius: 0 8rpx 0 0;
position: relative;
width: 90rpx;
height: 90rpx;
overflow: hidden;
.admin {
position: absolute;
background-color: $main-color;
transform: rotate(45deg);
color: #ffffff;
font-size: 12rpx;
width: 100rpx;
padding-top: 30rpx;
text-align: center;
right: -45rpx;
top: -20rpx;
}
.owner {
position: absolute;
background-color: $text-price;
transform: rotate(45deg);
color: #ffffff;
font-size: 12rpx;
width: 100rpx;
padding-top: 30rpx;
text-align: center;
right: -45rpx;
top: -20rpx;
}
}
.name {
color: $text-gray-m;
width: 126rpx;
@@ -272,31 +309,6 @@
word-break: break-word;
}
.admin {
position: absolute;
background-color: $main-color;
transform: rotate(45deg);
color: #ffffff;
font-size: 12rpx;
width: 100rpx;
padding-top: 30rpx;
text-align: center;
right: -45rpx;
top: -20rpx;
}
.owner {
position: absolute;
background-color: $text-price;
transform: rotate(45deg);
color: #ffffff;
font-size: 12rpx;
width: 100rpx;
padding-top: 30rpx;
text-align: center;
right: -45rpx;
top: -20rpx;
}
}
}

View File

@@ -6,10 +6,12 @@
</view>
<view class="content">
<view class="header">
<view class="name">{{ contact(item.targetId).name }} <text v-if="item.conversationType === 3" class='qun'>[]</text></view>
<view class="name">{{ contact(item.targetId).name }} <text v-if="item.conversationType === 3"
class='qun'>[]</text></view>
<view class="time">{{ item.sentTime|timeCustomCN }}</view>
</view>
<message-preview class="preview" :msg="item.latestMessage" :conversationType="item.conversationType" :user="item.latestMessage.userInfo" />
<message-preview class="preview" :msg="item.latestMessage" :conversationType="item.conversationType"
:user="item.latestMessage.userInfo" />
</view>
</view>
</template>
@@ -17,10 +19,6 @@
<script>
import messagePreview from './messagePreview'
export default {
props: {
item: {
@@ -73,9 +71,9 @@
.name {
font-size: $title-size + 2;
color: #454545;
display: flex;
align-items: center;
color: #454545;
display: flex;
align-items: center;
.qun {
color: $main-color;

View File

@@ -23,6 +23,9 @@
</view>
<view class="preview" v-if="msg.objectName=='RC:VideoMsg'">
<text v-if="conversationType == 3">{{ user.name }}</text>[视频通话]
</view>
<view class="preview" v-if="msg.objectName=='RC:GrpNtf'">
[{{ msg.message }}]
</view>
</view>
</template>

View File

@@ -2,7 +2,10 @@
<view class="group--chat">
<list class="body" :show-scrollbar="false">
<cell class="cell" v-for="(item, index) in messages" :key="index">
<view class="cell-item" :class="item.messageDirection == 1 ? 'right' : 'left'">
<view class="cell-system" v-if="item.senderUserId === '__system__'">
<text class="text">{{ item.content.message }}</text>
</view>
<view v-else :class="['cell-item', item.messageDirection == 1 ? 'right' : 'left']">
<u-avatar class="avatar" @click="toUser(item)" size="36" shape="square"
:src="contact(item.senderUserId).portraitUrl" />
<view class="msg">
@@ -25,6 +28,9 @@
import {
timeCustomCN
} from '@/utils/filters.js'
import {
getGroupBase
} from '@/apis/interfaces/im.js'
import * as RongIMLib from '@/uni_modules/RongCloud-IMWrapper/js_sdk/index'
import im from '@/utils/im/index.js'
import showVoice from '../components/showVoice'
@@ -73,12 +79,21 @@
uni.setNavigationBarTitle({
title: this.groupInfo.name
})
// 获取群成员数量
getGroupBase(this.targetId).then(res => {
uni.setNavigationBarTitle({
title: this.groupInfo.name + `(${res.members})`
})
})
// 获取历史消息列表
this.getMessageList()
// 监听收到本群的消息,追加消息
uni.$on('onReceiveMessage', (msg) => {
if (msg.targetId == this.targetId) {
this.getNewMessage()
}
})
// 清理聊天记录
uni.$once('cleanGroupMessage', this.getMessageList)
},
onNavigationBarButtonTap() {
@@ -87,6 +102,7 @@
})
},
methods: {
// 转到好友资料页面
toUser(item) {
if (item.senderUserId == '__system__') {
return
@@ -106,9 +122,9 @@
this.conversationType,
this.targetId,
this.latestMessage.sentTime,
1,
10,
false,
(messages) => {
(messages) => {
this.messages = this.messages.concat(messages)
this.scrollBottom()
})
@@ -122,7 +138,8 @@
100,
true,
(messages) => {
this.messages = messages.reverse()
console.log(messages);
this.messages = messages.reverse()
this.scrollBottom()
})
},
@@ -161,6 +178,15 @@
.cell {
padding: 10rpx 30rpx;
.cell-system {
align-items: center;
.text {
font-size: 24rpx;
color: $text-gray-m;
}
}
.cell-item {
width: 690rpx;
justify-content: flex-start;

View File

@@ -64,13 +64,14 @@
uni.showToast({
title: '创建成功'
})
this.initData()
this.onHideModal()
}).catch(err => {
uni.showToast({
icon: 'none',
title: err
title: err.message
})
}).finally(() => {
this.initData()
this.onHideModal()
})
},
toGroup(targetId) {

View File

@@ -273,6 +273,7 @@
success: (res) => {
if (res.confirm) {
dismissGroup(this.targetId).then(res => {
console.log('解散群', res);
uni.showToast({
icon: 'none',
title: '解散成功'

View File

@@ -53,11 +53,10 @@
},
onLoad() {
// 好友申请数量
this.checkNewFriendPending()
// 监听新的好友申请
uni.$on('onContactNotification', () => {
console.log('监听申请');
this.checkNewFriendPending()
this.checkNewFriendPending()
// 监听新的好友申请
uni.$on('onContactNotification', () => {
this.checkNewFriendPending()
})
},
onShow() {
@@ -77,8 +76,7 @@
},
methods: {
checkNewFriendPending() {
console.log('触发新申请好友事件');
im.getPendingList((pendings) => {
im.getPendingList((pendings) => {
console.log(pendings);
this.hasNewFriends = pendings.length
})
@@ -96,9 +94,13 @@
getConversationList() {
const count = 1000
const timestamp = 0
RongIMLib.getConversationList([1, 3], count, timestamp, (res) => {
if (res.code === 0) {
this.conversations = res.conversations
RongIMLib.getConversationList([1, 3], count, timestamp, ({
code,
conversations
}) => {
console.log(conversations);
if (code === 0) {
this.conversations = conversations
}
})
},

View File

@@ -5,8 +5,8 @@
<cell class="cell" v-for="(item, index) in messages" :key="index">
<view class="time">
<text class="text">{{ customCN(item.sentTime) }}</text>
</view>
<view class="cell-item" :class="item.messageDirection == 1 ? 'right' : 'left'">
</view>
<view :class="['cell-item', item.messageDirection == 1 ? 'right' : 'left']">
<u-avatar class="avatar" size="36" shape="square" @click="showUser(targetId, item.messageDirection)"
:src="contact(item.senderUserId).portraitUrl" />
<view class="msg">

View File

@@ -159,10 +159,22 @@ const addListeners = () => {
}) => {
console.log('消息删除结果', code)
})
} else if (message.objectName === RongIMLib.ObjectName.ContactNotification) {
console.log('onContactNotification');
} else if (message.objectName === RongIMLib.ObjectName.ContactNotification) {
// 触发一个新好友的通知事件
uni.$emit('onContactNotification', message.content)
uni.$emit('onContactNotification', message)
} else if (message.objectName === RongIMLib.ObjectName.GroupNotification) {
// 解散群
if (message.content.operation === 'Dismiss') {
RongIMLib.cleanHistoryMessages(message.conversationType, message.targetId,
message.sentTime - 1, false, ({
code
}) => {
if (code == 0) {
uni.$emit('onGroupDismiss', message.targetId)
}
})
}
uni.$emit('onReceiveMessage', message)
}
})

View File

@@ -15,7 +15,8 @@ const getMessageList = (conversationType, targetId, timeStamp, count, isForward,
'RC:LBSMsg',
'RC:SightMsg',
'RC:ReferenceMsg',
'RC:CombineMsg'
'RC:CombineMsg',
'RC:GrpNtf'
]
RongIMLib.getHistoryMessagesByTimestamp(