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-22 10:16:44 +08:00
parent 914f3f9371
commit f03c3a0989
6 changed files with 217 additions and 169 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
pages/im/private/chat.vue
View File

@@ -12,16 +12,9 @@
:src="contact(item.senderUserId).portraitUrl" />
<view class="msg">
<show-voice v-if="item.objectName === 'RC:HQVCMsg'" :message="item" />
<show-image v-if="item.objectName === 'RC:ImgMsg'" :guest="item.messageDirection == 1"
:msg="item.content" />
<show-text v-if="item.objectName === 'RC:TxtMsg'" :guest="item.messageDirection == 1"
:msg="item.content" />
<show-call v-if="item.objectName === 'RC:InfoNtf'" :guest="item.messageDirection == 1"
:msg="item.content" />
<view class="state" v-if="item.messageDirection == 1">
<text
:class="item.sentStatus === 50?'state-text':'state-text-active'">{{ item.sentStatus == 50 ? '已读': '未读'}}</text>
</view>
<show-image v-if="item.objectName === 'RC:ImgMsg'" :message="item" />
<show-text v-if="item.objectName === 'RC:TxtMsg'" :message="item" />
<show-call v-if="item.objectName === 'RC:InfoNtf'" :message="item" />
</view>
</view>
</view>
@@ -36,9 +29,9 @@
import showImage from '../components/showImage'
import showText from '../components/showText'
import showCall from '../components/showCall'
import sentMessageBar from '../components/sentMessageBar'
import utils from '@/utils/index.js'
import sentMessageBar from '../components/sentMessageBar'
import utils from '@/utils/index.js'
export default {
components: {
sentMessageBar,
@@ -48,7 +41,7 @@
showCall
},
data() {
return {
return {
avatarRpx: 84,
targetId: '',
messages: [],
@@ -60,9 +53,9 @@
}
}
},
computed: {
avatarSize() {
return utils.rpx2px(this.avatarRpx)
computed: {
avatarSize() {
return utils.rpx2px(this.avatarRpx)
},
latestMessage() {
if (this.messages.length) {
@@ -100,7 +93,7 @@
}
})
// 监听收到新消息，判断是否是当前会话，更新会话内容
uni.$on('onReceiveMessage', (msg) => {
uni.$on('onReceiveMessage', (msg) => {
if (msg.targetId == this.targetId) {
this.getNewMessage()
}
@@ -184,7 +177,7 @@
.time {
text-align: center;
font-size: 24rpx;
color: #666;
color: #666;
margin-bottom: 10rpx;
}
@@ -207,20 +200,19 @@
.msg {
margin: 0 20rpx;
// .state {
// padding-top: 10rpx;
.state {
padding-top: 10rpx;
// .state-text {
// font-size: $title-size-m - 2;
// color: rgba($color: $main-color, $alpha: 0.3)
// }
.state-text {
font-size: $title-size-m - 2;
color: rgba($color: $main-color, $alpha: 0.3)
}
.state-text-active {
font-size: $title-size-m - 2;
color: #cecece;
}
}
// .state-text-active {
// font-size: $title-size-m - 2;
// color: #cecece;
// }
// }
}
}