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-07 11:24:46 +08:00
parent b202a62d5d
commit eb88bf56f8
7 changed files with 302 additions and 266 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
components/im/imAUDIO.vue
View File

@@ -1,98 +0,0 @@
<template>
<view>
<view class="im--audio" :class="guest ? 'right': 'left'" @click="onPlayMsg">
<image v-if="!guest" class="audio-mp3" src="@/static/icon/audio_green.png" mode="widthFix"></image>
<text class="audio-text">"{{msg.duration}}"</text>
<image v-if="guest" class="audio-mp3" src="@/static/icon/audio_white.png" mode="widthFix"></image>
</view>
</view>
</template>
<script>
export default {
name: "im",
props: {
msg: {
type: Object,
default: () => {
return {
local: '',
remote: '',
objectName: '',
duration: 0
}
}
},
guest: {
type: Boolean,
default: true
}
},
methods: {
// 播放语音消息
onPlayMsg() {
uni.downloadFile({
url: this.msg.remote,
success: (res) => {
if (res.statusCode === 200) {
let innerAudioContext = uni.createInnerAudioContext()
innerAudioContext.src = res.tempFilePath
if (this.audioContextPaused) {
innerAudioContext.play()
this.audioContextPaused = false
return
}
innerAudioContext.stop()
innerAudioContext.onStop(resStop => {
this.audioContextPaused = true
})
innerAudioContext.onError(err => {
console.log(err);
})
}
}
})
}
}
}
</script>
<style scoped>
.im--audio {
flex-direction: row;
justify-content: space-between;
align-items: center;
height: 79rpx;
width: 170rpx;
padding: 0 20rpx;
box-sizing: border-box;
}
,
.im--audio.left {
border-radius: 0 20rpx 20rpx 20rpx;
background: white;
}
.im--audio.right {
border-radius: 20rpx 0 20rpx 20rpx;
background: #34CE98;
}
.audio-mp3 {
width: 38rpx;
height: 38rpx;
}
.audio-text {
font-size: 30rpx;
}
.im--audio.left .audio-text {
color: #333;
}
.im--audio.right .audio-text {
color: white;
}
</style>

47
components/im/imIMG.vue
View File

@@ -1,47 +0,0 @@
<template>
<view class="im--img" :class="guest ? 'right': 'left'">
<image class="src" :src="msg" @click="openImg" mode="widthFix"></image>
</view>
</template>
<script>
export default {
name:"im",
props:{
msg : {
type : String,
default: 'https://images.pexels.com/photos/9024609/pexels-photo-9024609.jpeg'
},
guest: {
type: Boolean,
default: true
}
},
methods:{
openImg(){
uni.previewImage({
urls : [this.msg],
current : 1
})
}
}
}
</script>
<style scoped>
.im--img{
padding: 19rpx;
}
.im--img.left{
border-radius: 0 20rpx 20rpx 20rpx;
background: white;
}
.im--img.right{
border-radius: 20rpx 0 20rpx 20rpx;
background: #34CE98;
}
.src{
width: 240rpx;
}
</style>

46
components/im/imTXT.vue
View File

@@ -1,46 +0,0 @@
<template>
<view class="im--box">
<text class="im--text" :class="guest ? 'right': 'left'">{{msg}}</text>
</view>
</template>
<script>
export default {
name:"im",
data() {
return {
};
},
props:{
msg : {
type : String,
default: ''
},
guest: {
type: Boolean,
default: true
}
}
}
</script>
<style scoped>
.im--text{
max-width: 400rpx;
padding: 20rpx;
font-size: 28rpx;
line-height: 40rpx;
}
.im--text.left{
border-radius: 0 20rpx 20rpx 20rpx;
background: white;
}
.im--text.right{
border-radius: 20rpx 0 20rpx 20rpx;
background: #34CE98;
color: white;
}
</style>