TmOct5/ZhHealth
1
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

根据事件广播，更新好友申请的数量提醒

Browse Source
This commit is contained in:
Jason.Chen
2022-02-09 12:01:36 +08:00
parent fbf9d7db31
commit 1678fd6e80
8 changed files with 200 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
.hbuilderx/launch.json
View File

@@ -14,6 +14,10 @@
{
"launchtype" : "local"
},
"mp-weixin" :
{
"launchtype" : "local"
},
"type" : "uniCloud"
}
]

112
pages/im/components/friendApplyCell.vue Normal file
View File

@@ -0,0 +1,112 @@
<template>
<view class="apply--cell u-border-bottom">
<view class="avatar">
<u-avatar :src="user.portraitUrl" shape="square" size="46" />
</view>
<view class="info">
<view class="name">
{{ user.name }}
</view>
<view class="message">
{{ message.message }}
</view>
</view>
<view class="action">
<u-button type="success" size="mini" @click="resolve">通过</u-button>
<u-button type="warning" size="mini" @click="reject">拒绝</u-button>
</view>
</view>
</template>
<script>
import * as RongIMLib from '@/uni_modules/RongCloud-IMWrapper/js_sdk/index'
import {
resolveFriend,
rejectFriend
} from '@/apis/interfaces/im.js'
export default {
props: {
message: {
type: Object,
default: {}
}
},
computed: {
user() {
return JSON.parse(this.message.extra)
}
},
methods: {
resolve() {
resolveFriend(this.message.sourceUserId).then(res => {
this.clearMessages()
uni.showToast({
icon: 'none',
title: '通过好友申请'
})
}).catch(err => {
uni.showToast({
icon: 'none',
title: err.message
})
})
},
reject() {
uni.showModal({
title: '拒绝申请',
success: (res) => {
if (res.confirm) {
rejectFriend(this.message.sourceUserId).then(res => {
this.clearMessages()
}).catch(err => {
uni.showToast({
icon: 'none',
title: err.message
})
})
}
}
})
},
// 不管是通过还是拒绝，都要把相关的信息清理
clearMessages() {
RongIMLib.deleteMessages(RongIMLib.ConversationType.SYSTEM, this.message.sourceUserId)
this.$emit('success')
uni.$emit('onContactNotification')
}
}
}
</script>
<style lang="scss" scoped>
.apply--cell {
display: flex;
padding: $padding;
align-items: center;
.info {
flex: 1;
margin-left: $padding;
.name {
font-size: $title-size + 2;
}
.message {
color: $text-gray-m;
font-size: $title-size-m;
margin-top: 10rpx;
}
}
.action {
justify-content: space-between;
.u-button+.u-button {
margin-top: 10rpx;
}
}
}
</style>

11
components/friend-apply-reject-agree/index.vue → pages/im/components/friendApplyList.vue
View File

@@ -1,15 +1,14 @@
<template>
<view class="friend-apply">
<block v-for="item in lists" v-if="lists.length > 0" :key="item.userId">
<block v-for="(item, index) in lists" v-if="lists.length > 0" :key="index">
<view class="lists">
<view class="" style="width: 100rpx;height: 100rpx;">
<u-image class="cover" radius="4" width="100rpx" height="100rpx" :src="item.portraitUrl || require('@/static/user/cover.png')" :lazy-load="true" />
<u-avatar :src="JSON.parse(item.latestMessage.extra).portraitUrl" shape="square" size="44" />
</view>
<view class="right">
<view class="title">
<view class="name">{{ item.name }}</view>
<view class="des" v-if="isApply">{{ item.address || '这家伙很懒，什么都没有添加~' }}</view>
<view class="des" v-else>{{ item.remark || '你好,听说你很优秀想认识~' }}</view>
<view class="des">{{ item.latestMessage.message }}</view>
</view>
<view class="agress-btn">
<span v-if="isAgree" @click="action('agree', item)">通过</span>
@@ -44,8 +43,8 @@ export default {
default: false
}
},
data() {
return {};
created() {
console.log(this.lists);
},
methods: {
action(type, item) {

51
pages/im/friends/index.vue
View File

@@ -1,18 +1,16 @@
<template>
<view>
<view class="friend-flex u-border-bottom" @click="toPending">
<u-avatar class="cover" size="40" shape="square" :src="require('@/static/im/im_01.png')"></u-avatar>
<u-badge max="99" absolute :offset="[23, 20]" :value="pendingCount" />
<view class="name">新的朋友</view>
</view>
<view class="friend-flex" @click="showToast">
<u-avatar class="cover" size="40" shape="square" :src="require('@/static/im/im_00.png')"></u-avatar>
<view class="name">我的群聊</view>
</view>
<u-index-list :index-list="indexs" inactiveColor="#666" activeColor="#34CE98">
<view>
<view class="friend-flex u-border-bottom" @click="toPending">
<u-avatar class="cover" size="40" shape="square" :src="require('@/static/im/im_01.png')"></u-avatar>
<view class="name">
新的朋友 ({{ pendingCount }})
</view>
</view>
<view class="friend-flex" @click="showToast">
<u-avatar class="cover" size="40" shape="square" :src="require('@/static/im/im_00.png')"></u-avatar>
<view class="name">我的群聊</view>
</view>
</view>
<block v-if="friends.length > 0">
<template v-for="(item, fkey) in friends">
<!-- #ifdef APP-NVUE -->
@@ -24,8 +22,8 @@
<u-index-anchor :text="indexs[fkey]" bgColor="#F3F6FB" height="20" size="12" color="#666">
</u-index-anchor>
<!-- #endif -->
<view v-for="(friendItem, index) in item" :key="friendItem.userId"
class="friend-flex u-border-bottom" @click="toFriend(friendItem.userId)">
<view v-for="(friendItem, index) in item" :key="index" class="friend-flex u-border-bottom"
@click="toFriend(friendItem.userId)">
<u-avatar size="40" shape="square" :src="friend(friendItem.userId).portraitUrl" />
<view class="name">{{ friend(friendItem.userId).name }}</view>
</view>
@@ -42,10 +40,10 @@
<script>
import {
getFriendsLetter,
getPendingCount
getFriendsLetter
} from '@/apis/interfaces/im';
import * as RongIMLib from '@/uni_modules/RongCloud-IMWrapper/js_sdk/index'
export default {
data() {
return {
@@ -62,16 +60,27 @@
}
},
onLoad() {
uni.$on('onContactNotification', this.checkNewFriendPending)
this.checkNewFriendPending()
getFriendsLetter().then(res => {
this.indexs = res.indexList
this.friends = res.itemArr
})
getPendingCount().then(res => {
console.log(res);
this.pendingCount = res
})
},
onUnload() {
uni.$off('onContactNotification')
},
methods: {
checkNewFriendPending() {
// 获取是否有新的好友申请
RongIMLib.getConversationList([RongIMLib.ConversationType.SYSTEM], 1000, 0, (res) => {
if (res.code === 0) {
this.pendingCount = res.conversations.filter((item) => {
return item.objectName == RongIMLib.ObjectName.ContactNotification
}).length
}
})
},
showToast() {
uni.showToast({
title: '群聊功能暂未开放，敬请期待',

69
pages/im/friends/pending.vue
View File

@@ -1,11 +1,3 @@
<!--
* @Description:新朋友即新增好友申请列表 可以搜索跳转
* @Author: Aimee·Zhang
* @Date: 2022-01-24 10:49:15
* @LastEditors: Aimee·Zhang
* @LastEditTime: 2022-01-25 10:18:26
-->
<template>
<view class="pending">
<u-sticky>
@@ -14,67 +6,42 @@
:disabled="true" :show-action="false" />
</view>
</u-sticky>
<block v-if="pedings.length > 0">
<applyFriend :lists="pedings" :isAgree="true" :isReject="false" @action="action" />
</block>
<view class="no-lists" v-else>
<u-image class="cover" radius="4" width="400rpx" height="400rpx"
:src="require('@/static/imgs/no-friend.png')" :lazy-load="true" />
<span>暂无申请记录~</span>
<view v-for="(item, index) in pendings" :key="index">
<apply-cell :message="item.latestMessage" @success="getPendingList" />
</view>
</view>
</template>
<script>
import {
getPedings,
resolveFriend,
rejectFriend
} from '@/apis/interfaces/im.js'
import * as RongIMLib from "@/uni_modules/RongCloud-IMWrapper/js_sdk/index"
import applyFriend from '@/components/friend-apply-reject-agree'
import * as RongIMLib from '@/uni_modules/RongCloud-IMWrapper/js_sdk/index'
import applyCell from '../components/friendApplyCell'
export default {
components: {
applyFriend
applyCell
},
data() {
return {
pedings: []
pendings: []
}
},
onLoad() {
this.getPeddingList()
this.getPendingList()
uni.$on('onContactNotification', this.getPendingList)
},
onUnload() {
uni.$off('onContactNotification')
},
methods: {
// 操作同意或拒绝
action(e) {
let url = e.type === 'agree' ? resolveFriend : rejectFriend
uni.showModal({
title: e.type === 'agree' ? '通过' : '拒绝',
content: e.type === 'agree' ? '通过后即可与该用户畅所欲言' : '拒绝后将不会收到该用户发来信息',
success: res => {
if (res.confirm) {
url(e.item.userId).then(res => {
this.getPeddingList()
})
}
getPendingList() {
// 获取系统中的好友关系会话列表
RongIMLib.getConversationList([RongIMLib.ConversationType.SYSTEM], 1000, 0, (res) => {
if (res.code === 0) {
this.pendings = res.conversations.filter((item) => {
return item.objectName == RongIMLib.ObjectName.ContactNotification
})
}
})
},
getPeddingList() {
// 获取系统中的好友关系会话列表
// RongIMLib.getConversationList([RongIMLib.ConversationType.SYSTEM], 50, 0, (res) => {
// if (res.code === 0) {
// this.pedings = res.conversations.filter((item) => {
// return item.objectName == RongIMLib.ObjectName.ContactNotification
// })
// }
// })
getPedings().then(res => {
console.log(res)
this.pedings = res
})
}
}
};

2
pages/im/friends/search.vue
View File

@@ -31,7 +31,7 @@
searchFriend,
pedingFriend
} from '@/apis/interfaces/im.js';
import applyFriend from '@/components/friend-apply-reject-agree';
import applyFriend from '../components/friendApplyList.vue';
export default {
components: {
applyFriend

24
pages/im/index.vue
View File

@@ -20,7 +20,7 @@
<uni-icons color="#555" type="scan" size="22" />
</view>
<view class="item" @click="onNav('imFriends', {})">
<u-badge absolute max="99" isDot :offset="[0, 0]" :show="hasNewFriends" />
<u-badge absolute max="99" :offset="[-5, -5]" :value="hasNewFriends" />
<uni-icons color="#555" custom-prefix="iconfont" type="icon-tuandui" size="22" />
</view>
</view>
@@ -72,7 +72,7 @@
</template>
<script>
import * as RongIMLib from "@/uni_modules/RongCloud-IMWrapper/js_sdk/index"
import * as RongIMLib from '@/uni_modules/RongCloud-IMWrapper/js_sdk/index'
import im from '@/utils/im/index.js'
import userAuth from '@/public/userAuth'
import messagePreview from './components/messagePreview'
@@ -96,7 +96,7 @@
pickedItem: {},
privateUnread: 0,
groupUnread: 0,
hasNewFriends: true
hasNewFriends: 0
}
},
components: {
@@ -109,15 +109,19 @@
}
}
},
onLoad() {
onLoad() {
// 好友申请数量
this.checkNewFriendPending()
uni.$on('onConnectionStatusChange', (status) => {
this.connection = status
})
uni.$on('onContactNotification', this.checkNewFriendPending)
},
onShow() {
if (this.$store.state.token !== '') {
this.getConversationList()
}
}
// 监听新消息
uni.$on('onReceiveMessage', (msg) => {
console.log('收到消息，刷新列表');
this.getConversationList()
@@ -150,6 +154,16 @@
}
},
methods: {
checkNewFriendPending() {
// 获取是否有新的好友申请
RongIMLib.getConversationList([RongIMLib.ConversationType.SYSTEM], 1000, 0, (res) => {
if (res.code === 0) {
this.hasNewFriends = res.conversations.filter((item) => {
return item.objectName == RongIMLib.ObjectName.ContactNotification
}).length
}
})
},
// 隐藏功能菜单
hidePop() {
this.showPop = false

19
utils/im/index.js
View File

@@ -59,11 +59,6 @@ const connect = (token, userInfo, callback) => {
// 首次运行获取好友列表
const FK = 'IFT_' + userInfo.userId
const model = uni.model.friendModel
model.find((err, results) => {
console.log('SQL 全部数据', results);
})
uni.getStorage({
key: FK,
success: () => {
@@ -133,14 +128,22 @@ const addListeners = () => {
})
// 添加消息监听函数
RongIMLib.addReceiveMessageListener((res) => {
console.log('收到消息', res.data.message);
const message = res.data.message
console.log('收到消息', message);
if (inArray(message.objectName, notifyMsgTypes)) {
console.log('通知并计数的消息');
newMessage(message)
} else if (message.objectName === 'RC:ProfileNtf') {
console.log('更新资料消息', JSON.parse(message.content.data));
} else if (message.objectName === RongIMLib.ObjectName.ProfileNotification) {
store.dispatch('updateFriend', JSON.parse(message.content.data))
// 调用完更新之后，删除这条消息
RongIMLib.deleteMessagesByIds([message.messageId], ({
code
}) => {
console.log('消息删除结果', code);
})
} else if (message.objectName === RongIMLib.ObjectName.ContactNotification) {
// 触发一个新好友的通知事件
uni.$emit('onContactNotification', message.content)
}
})