This commit is contained in:
zyy 2020-04-28 14:49:57 +08:00
commit 56fa896b6d
7 changed files with 49 additions and 17 deletions

View File

@ -6,7 +6,7 @@ NODE_ENV = 'development'
# VUE_APP_BASE_API = 'https://joylink.club/jlcloud'
# VUE_APP_BASE_API = 'http://192.168.3.4:9000'
VUE_APP_BASE_API = 'http://192.168.3.6:9000'
VUE_VOICE_API = 'https://test.joylink.club'
VUE_APP_VOICE_API = 'https://test.joylink.club'
# vue-cli uses the VUE_CLI_BABEL_TRANSPILE_MODULES environment variable,
# to control whether the babel-plugin-dynamic-import-node plugin is enabled.

View File

@ -4,4 +4,4 @@ VUE_APP_PRO = 'local'
# base api
VUE_APP_BASE_API = 'https://joylink.club/jlcloud'
VUE_VOICE_API = 'https://joylink.club'
VUE_APP_VOICE_API = 'https://joylink.club'

View File

@ -3,4 +3,4 @@ NODE_ENV = 'production'
# base api
VUE_APP_BASE_API = 'https://joylink.club/jlcloud'
VUE_VOICE_API = 'https://joylink.club'
VUE_APP_VOICE_API = 'https://joylink.club'

View File

@ -3,4 +3,4 @@ NODE_ENV = 'test'
# base api
VUE_APP_BASE_API = 'https://test.joylink.club/jlcloud'
VUE_VOICE_API = 'https://test.joylink.club'
VUE_APP_VOICE_API = 'https://test.joylink.club'

View File

@ -154,6 +154,13 @@ function handleSimulationInfo(state, data) {
date: +new Date(`${myDate1} ${chatTime}`)
};
state.simulationText = params;
if (state.coversitionList[data.conversationId]) {
state.coversitionList[data.conversationId].push(params);
} else {
state.coversitionList[data.conversationId] = [];
state.coversitionList[data.conversationId].push(params);
}
// switch (data.member.role) {
// case '01':
// role = '管理员';
@ -235,6 +242,7 @@ const socket = {
simulationStart: '', // 仿真-开始消息
simulationReset: '', // 仿真-异常消息
simulationText: {}, // 仿真-用户交互消息(聊天/命令)
coversitionList:{}, // 历史仿真-用户消息列表
message: {}, // 仿真聊天
msgQueue: [], // 命令请求列表
@ -259,7 +267,6 @@ const socket = {
beLogoutCount: 0, // 被登出
runPlanReloadCount: 0 // 仿真运行图变更
},
getters: {
},
mutations: {

View File

@ -1,5 +1,6 @@
<template>
<div v-quickMenuDrag class="chatBox">
<!-- v-quickMenuDrag -->
<div class="chatBox">
<div v-show="!minimize" class="chat-box">
<div :class="showMembers?'memberAnimate chat-box-members':'chat-box-members'">
<div class="chat-member-title">成员列表</div>
@ -33,7 +34,7 @@
</div>
</div>
<div class="chat-box-content">
<chat-content :current-coversition="currentCoversition" />
<chat-content ref="chatContent" :current-coversition="currentCoversition" />
<div v-if="recordSending" class="chat_record_tip">
<div id="record_progress_bar" :style="'width:'+100/60*seconds+'%'" />
<div class="record_icon" />
@ -285,6 +286,7 @@ export default {
changeCoversition(coversition) {
this.headerTitle = coversition.name;
this.currentCoversition = {id:coversition.id, group:coversition.group};
this.$refs.chatContent.reloadData(this.currentCoversition);
}
}
};

View File

@ -6,10 +6,11 @@
<div v-if="chatContent.group" class="userName">{{ chatContent.memberName }}</div>
<div :class="chatContent.self?'userChatTime textRight':'userChatTime'">{{ formatTime(chatContent.chatTime) }}</div>
</div>
<div class="userBubble">
<div class="userBubble" @click="playAudio('audio'+index)">
<div class="userMessage">
<div class="messageText">{{ chatContent.message }}</div>
<audio :src="baseUrl+chatContent.src" style="display:none" />
<span class="el-icon-video-play playicon" />
<span class="messageText">{{ chatContent.message }}</span>
<audio :id="'audio'+index" :src="baseUrl+chatContent.src" style="display:none" />
</div>
</div>
</div>
@ -27,23 +28,39 @@ export default {
data() {
return {
chatContentList:[],
baseUrl:''
coversition:{},
baseUrl:process.env.VUE_APP_VOICE_API
};
},
watch:{
'$store.state.socket.simulationText':function (val, old) { // 仿
if (this.currentCoversition.id == val.conversationId) {
this.chatContentList.push(this.$store.state.socket.simulationText);
const simulationText = this.$store.state.socket.simulationText;
this.chatContentList.push(simulationText);
}
}
},
mounted() {
console.log('VUE_VOICE_API' + process.env.VUE_VOICE_API);
this.baseUrl = process.env.VUE_VOICE_API;
created() {
this.coversition = this.currentCoversition;
this.inintData();
},
methods:{
inintData() {
const coversitionListAll = Object.assign({}, this.$store.state.socket.coversitionList);
const coversitionList = coversitionListAll[this.coversition.id] || [];
// console.log('inintData---coversitionList' + JSON.stringify(this.$store.state.socket.coversitionList[this.coversition.id]));
this.chatContentList = coversitionList;
},
formatTime(time) {
return /\d{2}:\d{2}:\d{2}/.exec(time)[0] || time;
},
playAudio(id) {
document.querySelector('#' + id).play();
},
reloadData(currentCoversition) {
this.chatContentList = [];
this.coversition = currentCoversition;
this.inintData();
}
}
};
@ -55,6 +72,7 @@ export default {
display: inline-block;
overflow: auto;
padding-bottom: 20px;
cursor:auto;
}
.leftUser{
float: left;
@ -72,15 +90,20 @@ export default {
.userName{}
.userChatTime{font-size: 12px;}
.userBubble{
max-width: 300px;
max-width: 200px;
font-size: 12px;
padding: 10px;
background: #ccc;
border-radius: 5px;
cursor: pointer;
}
.playicon{
font-size: 20px;
vertical-align: top;
}
.textRight{text-align: right;}
.userMessage{}
.messageText{}
.messageText{line-height: 20px;}
.chatContentInClass{
display: inline-block;
width: 100%;