96 lines
2.7 KiB
Vue
96 lines
2.7 KiB
Vue
<template>
|
|
<view class="msg--file">
|
|
<message-state :message="message" :isGroup="isGroup" :isRemote="isRemote" />
|
|
|
|
<view class="">
|
|
<view class="name" v-if="isGroup && isRemote">{{ contact(message.senderUserId).name }}</view>
|
|
<view class="file" :class="isRemote ? 'left': 'right'">
|
|
<view class="img">
|
|
{{ content.fileType }}
|
|
{{ content.name }}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<!-- "content": {
|
|
"fileType": "jpg",
|
|
"remote": "https://rongcloud-spic.ronghub.com/Xl1PRVpHVldeRQAGVgEHAAcBBgYGBgcDAwMGMjA3MA%3D%3D.jpg?e=1661583313&token=livk5rb3__JZjCtEiMxXpQ8QscLxbNLehwhHySnX:t58hs4uvM1RFsBeKLTcDbVW-k5w=",
|
|
"size": 347062,
|
|
"objectName": "RC:FileMsg",
|
|
"name": "Screenshot_2022-02-25-14-44-55-886_io.zhhealth.app.jpg",
|
|
"local": "file:///storage/emulated/0/DCIM/Screenshots/Screenshot_2022-02-25-14-44-55-886_io.zhhealth.app.jpg",
|
|
"userInfo": {
|
|
"userId": "10051",
|
|
"name": "Jason.电信",
|
|
"extra": "",
|
|
"portraitUrl": "http://storage.zh.shangkelian.cn/uploads/2022/02/16/29b13f5301694721ad7acd8b8b67bbd9.jpg"
|
|
}
|
|
}, -->
|
|
<script>
|
|
import * as RongIMLib from '@/uni_modules/RongCloud-IMWrapper/js_sdk/index'
|
|
import messageState from './messageState'
|
|
import imBase from '../../mixins/imBase.js'
|
|
|
|
export default {
|
|
mixins: [
|
|
imBase
|
|
],
|
|
props: {
|
|
message: {
|
|
type: Object,
|
|
default: () => {
|
|
return {}
|
|
}
|
|
},
|
|
isGroup: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
},
|
|
components: {
|
|
messageState
|
|
},
|
|
computed: {
|
|
isRemote() {
|
|
return this.message.messageDirection == 2
|
|
},
|
|
content() {
|
|
return this.message.content
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.msg--file {
|
|
display: flex;
|
|
align-items: flex-end;
|
|
|
|
.name {
|
|
font-size: 24rpx;
|
|
color: $text-gray-m;
|
|
}
|
|
|
|
.file {
|
|
.img {
|
|
width: 180rpx;
|
|
}
|
|
|
|
&.left {
|
|
.img {
|
|
border-radius: 0 10rpx 10rpx 10rpx;
|
|
}
|
|
}
|
|
|
|
&.right {
|
|
.img {
|
|
border-radius: 10rpx 0 10rpx 10rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
</style>
|