111 lines
3.5 KiB
Vue
111 lines
3.5 KiB
Vue
<template>
|
||
<view class="">
|
||
<view class="notify" v-if="message.objectName === 'RC:GrpNtf'">{{ message.content.message }}</view>
|
||
<view class="notify" v-else-if="message.objectName === 'RC:RcNtf'">
|
||
{{ contact(message.senderUserId).name }} 撤回了一条消息
|
||
</view>
|
||
<view v-else :class="['cell-item', message.messageDirection == 1 ? 'right' : 'left']">
|
||
<u-avatar class="avatar" @click="toUser(message)" :size="avatarSize" shape="square"
|
||
:src="contact(message.senderUserId).portraitUrl" />
|
||
<view class="msg">
|
||
<show-text v-if="message.objectName === 'RC:TxtMsg'" :message="message" :isGroup="isGroup" />
|
||
<show-voice v-else-if="message.objectName === 'RC:HQVCMsg'" :message="message" :isGroup="isGroup" />
|
||
<show-image v-else-if="message.objectName === 'RC:ImgMsg'" :message="message" :isGroup="isGroup" />
|
||
<show-call v-else-if="message.objectName === 'RC:InfoNtf'" :message="message" :isGroup="isGroup" />
|
||
<view v-else class="">
|
||
[未处理的消息类型 {{ message.objectName }}]
|
||
</view>
|
||
</view>
|
||
<!-- <view class="time">{{ item.sentTime|timeCustomCN }}</view> 时间判断，最好是隔一段时间没有消息才展示一个 -->
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import showVoice from './show/showVoice'
|
||
import showImage from './show/showImage'
|
||
import showText from './show/showText'
|
||
import showCall from './show/showCall'
|
||
import utils from '@/utils/index.js'
|
||
|
||
export default {
|
||
components: {
|
||
showCall,
|
||
showVoice,
|
||
showImage,
|
||
showText
|
||
},
|
||
props: {
|
||
message: {
|
||
type: Object,
|
||
default: function() {
|
||
return {}
|
||
}
|
||
},
|
||
isGroup: {
|
||
type: Boolean,
|
||
default: false
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
avatarRpx: 84
|
||
}
|
||
},
|
||
computed: {
|
||
avatarSize() {
|
||
return utils.rpx2px(this.avatarRpx)
|
||
},
|
||
contact() {
|
||
return function(targetId) {
|
||
return this.$store.getters.contactInfo(targetId)
|
||
}
|
||
}
|
||
},
|
||
methods: {
|
||
toUser(item) {
|
||
if (item.messageDirection == 1) {
|
||
uni.navigateTo({
|
||
url: '/pages/im/friends/mine?targetId=' + item.senderUserId
|
||
})
|
||
} else {
|
||
uni.navigateTo({
|
||
url: '/pages/im/friends/info?targetId=' + item.senderUserId
|
||
})
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.notify {
|
||
text-align: center;
|
||
font-size: 24rpx;
|
||
color: #666;
|
||
}
|
||
|
||
.cell-item {
|
||
display: flex;
|
||
width: 710rpx;
|
||
justify-content: flex-start;
|
||
|
||
&.left {
|
||
flex-direction: row;
|
||
}
|
||
|
||
&.right {
|
||
flex-direction: row-reverse;
|
||
|
||
.state {
|
||
flex-direction: row;
|
||
justify-content: flex-end;
|
||
}
|
||
}
|
||
|
||
.msg {
|
||
margin: 0 20rpx;
|
||
}
|
||
}
|
||
</style>
|