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-10 13:56:01 +08:00
parent e2243bcc99
commit 13aed4abf5
20 changed files with 258 additions and 452 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
pages/im/components/conversationGroup.vue
View File

@@ -2,19 +2,9 @@
<view>
<view v-for="(item, index) in conversations" :key="index" :class="['message', { 'is-top': item.isTop }]"
:data-item="item" @longpress="onLongPress" @click="toDetail(item)">
<view class="avatar">
<u-badge max="99" shape="horn" absolute :offset="[-5, -8]" :value="item.unreadMessageCount" />
<u-avatar text="群" shape="square" size="44" />
</view>
<view class="content u-border-bottom">
<view class="header">
<view class="name">群组名称</view>
<view class="time">{{ item.sentTime|timeCustomCN }}</view>
</view>
<message-preview class="preview" :msg="item.latestMessage" :user="item.latestMessage.userInfo" />
</view>
</view>
<message-cell :item="item" />
</view>
<view class="shade" @click="hidePop" v-show="showPop">
<view class="pop" :style="popStyle" :class="{'show':showPop}">
<view v-for="(item, index) in popButton" :key="index" @click="pickerMenu" :data-index="index">
@@ -26,9 +16,9 @@
</template>
<script>
import messagePreview from './messagePreview'
import * as RongIMLib from '@/uni_modules/RongCloud-IMWrapper/js_sdk/index'
import im from '@/utils/im/index.js'
import messageCell from './messageCell'
export default {
props: {
@@ -40,7 +30,7 @@
}
},
components: {
messagePreview
messageCell
},
data() {
return {
@@ -55,13 +45,7 @@
pickedItem: {},
}
},
computed: {
friend() {
return function(targetId) {
return this.$store.getters.userInfo(targetId)
}
}
},
methods: {
// 隐藏功能菜单
hidePop() {
@@ -114,6 +98,7 @@
uni.navigateTo({
url: '/pages/im/group/chat?targetId=' + item.targetId
})
this.hidePop()
}
}
}
@@ -122,46 +107,9 @@
<style lang="scss" scoped>
.message {
background: white;
padding: 20rpx 0 0 20rpx;
position: relative;
display: flex;
&.is-top {
background: $window-color;
border-bottom: #e8e8e8;
}
.avatar {
position: relative;
.u-badge {
z-index: 998;
}
}
.content {
margin-left: 30rpx;
width: calc(100% - 46px);
box-sizing: border-box;
position: relative;
.header {
display: flex;
justify-content: space-between;
.name {
font-size: $title-size + 2;
color: #454545;
color: #454545;
}
.time {
font-size: $title-size-sm;
color: $text-gray-m;
position: absolute;
right: 30rpx;
}
}
}
}

71
pages/im/components/conversationPrivate.vue
View File

@@ -2,18 +2,7 @@
<view>
<view v-for="(item, index) in conversations" :key="index" :class="['message', { 'is-top': item.isTop }]"
:data-item="item" @longpress="onLongPress" @click="toDetail(item)">
<view class="avatar" @click="toFriend(item.targetId)">
<u-badge max="99" shape="horn" absolute :offset="[-5, -8]"
:value="item.unreadMessageCount" />
<u-avatar :src="friend(item.targetId).portraitUrl" shape="square" size="44" />
</view>
<view class="content u-border-bottom">
<view class="header">
<view class="name">{{ friend(item.targetId).name }}</view>
<view class="time">{{ item.sentTime|timeCustomCN }}</view>
</view>
<message-preview class="preview" :msg="item.latestMessage" />
</view>
<message-cell :item="item" />
</view>
<view class="shade" @click="hidePop" v-show="showPop">
@@ -27,9 +16,9 @@
</template>
<script>
import messagePreview from './messagePreview'
import * as RongIMLib from '@/uni_modules/RongCloud-IMWrapper/js_sdk/index'
import im from '@/utils/im/index.js'
import * as RongIMLib from '@/uni_modules/RongCloud-IMWrapper/js_sdk/index'
import im from '@/utils/im/index.js'
import messageCell from './messageCell'
export default {
props: {
@@ -54,12 +43,12 @@
}
},
components: {
messagePreview
messageCell
},
computed: {
friend() {
contact() {
return function(targetId) {
return this.$store.getters.userInfo(targetId)
return this.$store.getters.contactInfo(targetId)
}
}
},
@@ -80,9 +69,9 @@
RongIMLib.setConversationToTop(this.pickedItem.conversationType, this.pickedItem.targetId, !this
.pickedItem.isTop)
} else {
RongIMLib.removeConversation(this.pickedItem.conversationType, this.pickedItem.targetId)
RongIMLib.removeConversation(this.pickedItem.conversationType, this.pickedItem.targetId)
RongIMLib.deleteMessages(this.pickedItem.conversationType, this.pickedItem.targetId)
}
}
this.$emit('refresh')
im.setNotifyBadge()
this.hidePop()
@@ -117,11 +106,6 @@
uni.navigateTo({
url: '/pages/im/private/chat?targetId=' + item.targetId
})
},
toFriend(targetId) {
uni.navigateTo({
url: '/pages/im/friends/info?targetId=' + targetId
})
}
}
}
@@ -130,46 +114,9 @@
<style lang="scss" scoped>
.message {
background: white;
padding: 20rpx 0 0 20rpx;
position: relative;
display: flex;
&.is-top {
background: $window-color;
border-bottom: #e8e8e8;
}
.avatar {
position: relative;
.u-badge {
z-index: 998;
}
}
.content {
margin-left: 30rpx;
width: calc(100% - 46px);
box-sizing: border-box;
position: relative;
.header {
display: flex;
justify-content: space-between;
.name {
font-size: $title-size + 2;
color: #454545;
color: #454545;
}
.time {
font-size: $title-size-sm;
color: $text-gray-m;
position: absolute;
right: 30rpx;
}
}
}
}

85
pages/im/components/messageCell.vue Normal file
View File

@@ -0,0 +1,85 @@
<template>
<view class="message--cell">
<view class="avatar">
<u-badge max="99" shape="horn" absolute :offset="[-5, -8]" :value="item.unreadMessageCount" />
<u-avatar :src="contact(item.targetId).portraitUrl" shape="square" size="44" />
</view>
<view class="content">
<view class="header">
<view class="name">{{ contact(item.targetId).name }}</view>
<view class="time">{{ item.sentTime|timeCustomCN }}</view>
</view>
<message-preview class="preview" :msg="item.latestMessage" :conversationType="item.conversationType"
:user="item.latestMessage.userInfo" />
</view>
</view>
</template>
<script>
import messagePreview from './messagePreview'
export default {
props: {
item: {
type: Object,
default: function() {
return {}
}
}
},
computed: {
contact() {
return function(targetId) {
return this.$store.getters.contactInfo(targetId)
}
}
},
components: {
messagePreview
}
}
</script>
<style lang="scss" scoped>
.message--cell {
display: flex;
padding: 20rpx 0 0 20rpx;
.avatar {
position: relative;
.u-badge {
z-index: 998;
}
}
.content {
margin-left: 30rpx;
box-sizing: border-box;
position: relative;
flex: 1;
border-bottom-width: 0.5px !important;
border-color: $u-border-color !important;
border-bottom-style: solid;
.header {
display: flex;
justify-content: space-between;
.name {
font-size: $title-size + 2;
color: #454545;
color: #454545;
}
.time {
font-size: $title-size-sm;
color: $text-gray-m;
position: absolute;
right: 30rpx;
}
}
}
}
</style>

20
pages/im/components/messagePreview.nvue
View File

@@ -1,28 +1,28 @@
<template>
<view>
<view class="preview" v-if="msg.objectName=='RC:TxtMsg'">
<text v-if="user.name">{{ user.name }}:</text>{{ msg.content || '' }}
<text v-if="conversationType == 3">{{ user.name }}: </text>{{ msg.content || '' }}
</view>
<view class="preview" v-if="msg.objectName=='RC:HQVCMsg'">
<text v-if="user.name">{{ user.name }}:</text>[语音]
<text v-if="conversationType == 3">{{ user.name }}: </text>[语音]
</view>
<view class="preview" v-if="msg.objectName=='RC:ImgMsg'">
<text v-if="user.name">{{ user.name }}:</text>[图片]
<text v-if="conversationType == 3">{{ user.name }}: </text>[图片]
</view>
<view class="preview" v-if="msg.objectName=='RC:GIFMsg'">
<text v-if="user.name">{{ user.name }}:</text>[表情]
<text v-if="conversationType == 3">{{ user.name }}: </text>[表情]
</view>
<view class="preview" v-if="msg.objectName=='RC:FileMsg'">
<text v-if="user.name">{{ user.name }}:</text>[文件]
<text v-if="conversationType == 3">{{ user.name }}: </text>[文件]
</view>
<view class="preview" v-if="msg.objectName=='RC:LBSMsg'">
<text v-if="user.name">{{ user.name }}:</text>[位置]
<text v-if="conversationType == 3">{{ user.name }}: </text>[位置]
</view>
<view class="preview" v-if="msg.objectName=='RC:AudioMsg'">
<text v-if="user.name">{{ user.name }}:</text>[语音通话]
<text v-if="conversationType == 3">{{ user.name }}: </text>[语音通话]
</view>
<view class="preview" v-if="msg.objectName=='RC:VideoMsg'">
<text v-if="user.name">{{ user.name }}:</text>[视频通话]
<text v-if="conversationType == 3">{{ user.name }}: </text>[视频通话]
</view>
</view>
</template>
@@ -33,6 +33,10 @@
msg: {
type: Object,
default: {}
},
conversationType: {
type: Number,
default: 0
},
user: {
type: Object,

3
pages/im/components/sentMessageBar.nvue
View File

@@ -12,7 +12,7 @@
@success="onSuccess" />
<sent-text v-if="chatType === 1" :conversationType="conversationType" :targetId="targetId"
@success="onSuccess" />
<view class="msg-type msg-popups" @click="scrollBottom('msgPopups')">
<view class="msg-type msg-popups" @click="showPopups = !showPopups">
<image class="icon" src="@/static/icon/popups-icon.png"></image>
</view>
</view>
@@ -27,7 +27,6 @@
import sentVoice from '../components/sentVoice'
import sentPopups from '../components/sentPopups'
export default {
props: {
conversationType: {

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

@@ -17,9 +17,9 @@
<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" />
<u-avatar size="40" shape="square" :src="contact(friendItem.userId).portraitUrl" />
<view class="info">
<view class="name">{{ friend(friendItem.userId).name }}</view>
<view class="name">{{ contact(friendItem.userId).name }}</view>
<view class="address">{{ friendItem.address }}</view>
</view>
</view>
@@ -48,9 +48,9 @@
};
},
computed: {
friend() {
contact() {
return function(targetId) {
return this.$store.getters.userInfo(targetId)
return this.$store.getters.contactInfo(targetId)
}
}
},

4
pages/im/friends/info.vue
View File

@@ -5,8 +5,8 @@
<u-avatar :src="userInfo.portraitUrl || require('@/static/user/cover.png')" shape="square" size="50"
bg-color="#fff"></u-avatar>
<view class="info-text">
<view class="nickname">{{userInfo.name}}</view>
<view class="address" @longpress="copyAddress">地址：{{userInfo.address}}</view>
<view class="nickname">{{ userInfo.name }}</view>
<view class="address" @longpress="copyAddress">地址：{{ userInfo.address }}</view>
</view>
</view>
<!-- 用户资料 -->

27
pages/im/group/chat.nvue
View File

@@ -49,23 +49,17 @@
},
onLoad(e) {
this.targetId = e.targetId
this.initMessageList()
this.getMessageList()
uni.$on('onReceiveGroupMessage', (msg) => {
if (msg.targetId == this.targetId) {
this.initMessageList()
this.getMessageList()
}
})
},
onBackPress() {
uni.$off('onReceiveGroupMessage')
},
methods: {
initMessageList() {
this.getMessageList()
// 清理当前会话，未读消息数量
RongIMLib.clearMessagesUnreadStatus(this.conversationType, this.targetId, new Date().getTime())
// 发送消息已读状态给对方
RongIMLib.sendReadReceiptMessage(this.conversationType, this.targetId, new Date().getTime())
// 更新badge提醒数量
im.setNotifyBadge()
},
// 获取消息列表
getMessageList() {
im.getMessageList(
@@ -75,16 +69,19 @@
20,
true,
(messages) => {
console.log('获取到的消息', messages);
this.messages = messages.reverse()
this.scrollBottom()
})
},
// 滚动到底部
scrollBottom(type) {
if (type === 'msgPopups') {
this.showPopups = !this.showPopups
}
// 清理当前会话，未读消息数量
RongIMLib.clearMessagesUnreadStatus(this.conversationType, this.targetId, new Date().getTime() + 1100)
// 发送消息已读状态给对方
RongIMLib.sendReadReceiptMessage(this.conversationType, this.targetId, new Date().getTime())
// 更新badge提醒数量
im.setNotifyBadge()
setTimeout(() => {
let el = this.$refs.chatBottom
ChatList.scrollToElement(el, {

11
pages/im/index.vue
View File

@@ -54,7 +54,6 @@
export default {
data() {
return {
isShown: true, // 当前页面显示状态
showType: 1, // 0 单聊，1 群聊
conversations: [], // 会话列表
groupConversations: [],
@@ -80,7 +79,9 @@
if (this.$store.state.token !== '') {
this.getPrivateConversationList()
this.getGroupConversationList()
}
}
console.log('开始监听');
// 监听新消息
uni.$on('onReceivePrivateMessage', (msg) => {
this.getPrivateConversationList()
@@ -88,13 +89,11 @@
uni.$on('onReceiveGroupMessage', (msg) => {
this.getGroupConversationList()
})
this.isShown = true
},
onHide() {
uni.$off('onReceivePrivateMessage')
uni.$off('onReceiveGroupMessage')
this.isShown = false
uni.$off('onReceiveGroupMessage')
console.log('index 隐藏');
},
onNavigationBarButtonTap(e) {
if (e.index == 0) {

27
pages/im/private/chat.nvue
View File

@@ -62,12 +62,12 @@
},
onLoad(e) {
this.targetId = e.targetId
this.userInfo = this.$store.getters.userInfo(this.targetId)
this.userInfo = this.$store.getters.contactInfo(this.targetId)
uni.setNavigationBarTitle({
title: this.userInfo.name
})
// 获取消息列表
this.initMessageList()
this.getMessageList()
// 监听消息已读状态
uni.$on('onReadReceiptReceived', (data) => {
if (data.targetId == this.targetId) {
@@ -77,20 +77,11 @@
// 监听收到新消息，判断是否是当前会话，更新会话内容
uni.$on('onReceivePrivateMessage', (msg) => {
if (msg.targetId == this.targetId) {
this.initMessageList()
this.getMessageList()
}
})
},
methods: {
initMessageList() {
this.getMessageList()
// 清理当前会话，未读消息数量
RongIMLib.clearMessagesUnreadStatus(this.conversationType, this.targetId, new Date().getTime())
// 发送消息已读状态给对方
RongIMLib.sendReadReceiptMessage(this.conversationType, this.targetId, new Date().getTime())
// 更新badge提醒数量
im.setNotifyBadge()
},
customCN(val) {
return timeCustomCN(val)
},
@@ -103,7 +94,6 @@
10,
true,
(messages) => {
console.log('获取到的消息', messages);
this.messages = messages.reverse()
this.scrollBottom()
})
@@ -116,10 +106,13 @@
})
},
// 滚动到底部
scrollBottom(type) {
if (type === 'msgPopups') {
this.showPopups = !this.showPopups
}
scrollBottom(type) {
// 清理当前会话，未读消息数量
RongIMLib.clearMessagesUnreadStatus(this.conversationType, this.targetId, new Date().getTime() + 1100)
// 发送消息已读状态给对方
RongIMLib.sendReadReceiptMessage(this.conversationType, this.targetId, new Date().getTime())
// 更新badge提醒数量
im.setNotifyBadge()
setTimeout(() => {
let el = this.$refs.chatBottom
ChatList.scrollToElement(el, {