Skip to content

C
chart-web
Commit 1332c7e9 authored by looker's avatar looker
Browse files
Options

hahah

parent 1eab6941
Hide whitespace changes
Inline Side-by-side
Showing with 125 additions and 8 deletions
dist.zip
View file @ 1332c7e9
No preview for this file type
src/components/chatlist/chatlist.vue
View file @ 1332c7e9
......@@ -84,7 +84,33 @@ export default {
return name.length>8?name.substring(0,8)+'...':name;
},
content(messages){
return messages[messages.length-1]?messages[messages.length-1].content:''
let temp =""
if(!messages||messages.length==0){
return ''
}
switch(messages[messages.length-1].type){
case 1:
temp = messages[messages.length-1].content
break;
case 3:
temp = '[图片]'
break;
case 43:
temp = '[视频]'
break;
case 42:
temp = '[卡片]'
break;
case 34:
temp = '[语音]'
break;
case 10000:
temp = '[系统消息]'
break;
default:
temp = '[其他]'
}
return temp
}
},
}
......
src/components/message/message.vue
View file @ 1332c7e9
......@@ -33,6 +33,57 @@
height:300px;" :src="item.imageUrl | imgUrl" alt=""></div>
</div>
</div>
<div v-if="item.type==43" class="main" :class="{ self: item.isSend }">
<img class="avatar" width="36" height="36" :src="item.isSend ? user.img : selectedChat.user.img||'static/images/weixin.jpg'" />
<div class="time"><span>{{item.createTime | time}}</span></div>
<div class="content">
<video width="300" height="300" controls>
<source :src="item.videoUrl | videoUrl" type="video/mp4">
</video>
</div>
</div>
<div v-if="item.type==42" class="main" :class="{ self: item.isSend }">
<img class="avatar" width="36" height="36" :src="item.isSend ? user.img : selectedChat.user.img||'static/images/weixin.jpg'" />
<div class="time"><span>{{item.createTime | time}}</span></div>
<div class="content">
<a :href="item.cardUrl" target="_blank" >
<h1 style="">
<span style="font-size: 14px;color: black">{{item.cardTitle}}</span>
</h1>
<div style="width: 70%;height: 100%;float: left;">
<span style="font-size: 12px;color: gray">{{item.cardDescription}}</span>
</div>
<div style="width: 30%;height: 100%;float: right;">
<img width=30% height=100% :src="item.cardImageUrl" alt="">
</div>
</a>
</div>
</div>
<div v-if="item.type==34" class="main" :class="{ self: item.isSend }">
<img class="avatar" width="36" height="36" :src="item.isSend ? user.img : selectedChat.user.img||'static/images/weixin.jpg'" />
<div class="time"><span>{{item.createTime | time}}</span></div>
<div class="content" @click="playMusic(item.id)">
<audio :id="'audio'+item.id" class="audio-musc" controls>
<source src="/i/horse.ogg" type="audio/ogg">
<source :src="imgUrl + item.audioUrl" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<img v-if="!item.isSend&&bufanClass!=item.id" src="static/icon-img/laba-right.png" width="20px" height="20px" style="margin-left: 50px;margin-top: 5px;" alt="">
<img v-if="!item.isSend&&bufanClass==item.id" src="static/icon-img/1Rw0-Kq.gif" width="20px" height="20px" style="margin-left: 50px;margin-top: 5px;" alt="">
<img v-if="item.isSend" src="static/icon-img/laba-left.png" width="20px" height="20px" style="margin-right: 50px;margin-top: 5px;" alt="">
<!-- <a :href="item.cardUrl" target="_blank" >
<h1 style="">
<span style="font-size: 14px;color: black">{{item.cardTitle}}</span>
</h1>
<div style="width: 70%;height: 100%;float: left;">
<span style="font-size: 12px;color: gray">{{item.cardDescription}}</span>
</div>
<div style="width: 30%;height: 100%;float: right;">
<img width=30% height=100% :src="item.cardImageUrl" alt="">
</div>
</a> -->
</div>
</div>
</li>
</template>
</ul>
......@@ -52,6 +103,7 @@ export default {
return {
imgUrl:process.env.IMG_ADDRESS,
headerId:0,
bufanClass:'',
changeFlag:true,
loadStatus:false,
}
......@@ -110,6 +162,18 @@ export default {
}
},
methods: {
playMusic(id){
this.bufanClass = id
let auto = window.document.getElementById('audio'+id);
// auto.duration
auto.play()
var is_playFinish = setInterval(()=>{
if(auto.ended){
this.bufanClass = 0
window.clearInterval(is_playFinish);
}
}, 10);
},
...mapActions('user',[
'moreMessage',
]),
......@@ -128,6 +192,16 @@ export default {
return moment(date).format('YYYY-MM-DD HH:mm:ss')
},
imgUrl(img){
if(!img){
return ''
}
if(img.indexOf("http") >= 0){
return img
}else{
return process.env.IMG_ADDRESS + img
}
},
videoUrl(img){
if(!img){
return ''
}
......@@ -186,7 +260,7 @@ export default {
font-size: 14px
text-align: left
word-break: break-all
background-color: #fafafa
background-color: #fff
border-radius: 4px
&:before
content: " "
......@@ -207,5 +281,8 @@ export default {
vertical-align: middle
border-right-color: transparent
border-left-color: #b2e281
.audio-musc{
display:none;
}
</style>
src/store/modules/user.js
View file @ 1332c7e9
......@@ -2,7 +2,7 @@ import * as service from '@/service'
// import io from 'socket.io-client';
import apiUrl from '@/service/api.js'
import router from '@/router'
import { compare, singel } from '@/utils/tools'
import { compare, singel, getAutioLength } from '@/utils/tools'
import {
setToken, getToken, setUserId,
getUserId, emojis, setUserInfo,
......@@ -97,6 +97,7 @@ const user = {
let tempList = []
for(let i in value){
let temp = [{
type:1,
content: value[i].content||'',
date: value[i].lastUpdateTime
}]
......@@ -128,8 +129,9 @@ const user = {
let tempList = []
for(let i in value){
let temp = [{
content: value[i].content||'',
date: value[i].lastUpdateTime
type:1,
content: value[i].content||'',
date: value[i].lastUpdateTime
}]
tempList.push({
id: value[i].id,
......@@ -160,7 +162,8 @@ const user = {
for(let c in chatlist){
if(chatlist[c].id==selectId){
let temp = [...value, ...chatlist[c].messages]
chatlist[c].messages = temp.sort(compare('createTime'))
let aotps = getAutioLength(temp)
chatlist[c].messages = aotps.sort(compare('createTime'))
}
}
},
......@@ -170,7 +173,7 @@ const user = {
for(let c in array){
if(array[c].id==value[0].conversationId){
let temp = value == null?[]:value.sort(compare('createTime'))
array[c].messages = [...array[c].messages, ...temp]
array[c].messages = getAutioLength([...array[c].messages, ...temp])
array[c].queryData = value[0].createTime
array.sort(compare('queryData'))
array.reverse()
......
src/utils/tools.js
View file @ 1332c7e9
......@@ -12,4 +12,15 @@ export const singel = (arr)=>{
return item;
}, []);
return arr
}
\ No newline at end of file
}
export const getAutioLength = (message)=>{
for(let m of message){
if(m.type==34){
let mp3 = process.env.IMG_ADDRESS + m.audioUrl;
let mp3Temp = new Audio(mp3);
m.duration = mp3Temp.duration
}
}
return message
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment