Merge branch 'test' of https://git.code.tencent.com/lian-cbtc/jl-client into test
This commit is contained in:
joylink_cuiweidong
commit
02d486c1af
@ -2,9 +2,9 @@ export function getBaseUrl() {
|
||||
let BASE_API;
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
// BASE_API = 'https://joylink.club/jlcloud';
|
||||
// BASE_API = 'https://test.joylink.club/jlcloud';
|
||||
BASE_API = 'https://test.joylink.club/jlcloud';
|
||||
// BASE_API = 'http://192.168.3.5:9000'; // 袁琪
|
||||
BASE_API = 'http://192.168.3.6:9000'; // 旭强
|
||||
// BASE_API = 'http://192.168.3.6:9000'; // 旭强
|
||||
// BASE_API = 'http://192.168.3.41:9000'; // 张赛
|
||||
// BASE_API = 'http://192.168.3.82:9000'; // 杜康
|
||||
// BASE_API = 'http://b29z135112.zicp.vip';
|
||||
|
||||
@ -22,7 +22,7 @@
|
||||
</template>
|
||||
<script>
|
||||
import { Notification } from 'element-ui';
|
||||
import ChatBox from '@/views/newMap/jointTrainingNew/chatView/chatBox';
|
||||
import ChatBox from '@/views/newMap/jointTrainingNew/newChatView/chatBox';
|
||||
import {setPlaySpeed, startPlaying, playingPause, endPlaying, fromPauseToPlay} from '@/api/competition';
|
||||
export default {
|
||||
name:'MenuPlay',
|
||||
|
||||
@ -108,7 +108,7 @@ import MenuPractice from '@/views/newMap/displayNew/menuPractice';
|
||||
import Jl3dDrive from '@/views/jlmap3d/drive/jl3ddrive';
|
||||
import Jl3dDevice from '@/views/jlmap3d/device/jl3ddevice';
|
||||
import Scheduling from './demon/scheduling';
|
||||
import { clearSimulation, getSimulationInfoNew} from '@/api/simulation';
|
||||
import { clearSimulation, getSimulationInfoNew, getSimulationMemberList, getAllSimulationUser} from '@/api/simulation';
|
||||
import { getTrainingDetailNew } from '@/api/jmap/training';
|
||||
// loadScriptNew, , scriptExecuteNew
|
||||
import { mapGetters } from 'vuex';
|
||||
@ -342,6 +342,7 @@ export default {
|
||||
}
|
||||
this.checkLoginLineTimer();
|
||||
this.checkMouseStatusTimer();
|
||||
this.initMemberUserInfo();
|
||||
} catch (error) {
|
||||
this.$messageBox(`初始化失败: ${error.message}`);
|
||||
this.endViewLoading();
|
||||
@ -385,6 +386,18 @@ export default {
|
||||
this.endViewLoading();
|
||||
}
|
||||
},
|
||||
initMemberUserInfo() {
|
||||
getSimulationMemberList(this.$route.query.group).then(resp => {
|
||||
this.$store.dispatch('training/setMemberList', {memberList:resp.data, userId: this.$store.state.user.id});
|
||||
}).catch(() => {
|
||||
this.$messageBox('获取仿真成员列表失败！');
|
||||
});
|
||||
getAllSimulationUser(this.$route.query.group).then(resp => {
|
||||
this.$store.dispatch('training/setSimulationUserList', resp.data);
|
||||
}).catch(() => {
|
||||
this.$messageBox('获取所有仿真用户失败！');
|
||||
});
|
||||
},
|
||||
// 加载实操地图数据
|
||||
async initPracticeData() {
|
||||
this.$store.dispatch('training/end', TrainingMode.NORMAL);
|
||||
|
||||
@ -35,7 +35,7 @@
|
||||
<!-- 单人仿真 -->
|
||||
<script>
|
||||
import SetTime from './demon/setTime';
|
||||
import ChatBox from './chatView/chatBox';
|
||||
import ChatBox from '../jointTrainingNew/newChatView/chatBox';
|
||||
import { Notification } from 'element-ui';
|
||||
import { getGoodsTryUse } from '@/api/management/goods';
|
||||
import { ranAsPlan, exitRunPlan, clearSimulation, getSimulationInfoNew } from '@/api/simulation';
|
||||
|
||||
@ -1,506 +0,0 @@
|
||||
<template>
|
||||
<!-- v-quickMenuDrag -->
|
||||
<div class="chatBox" :style="{'bottom':bottom+'px'}">
|
||||
<div v-show="!minimize" class="chat-box">
|
||||
<chat-member-list v-if="project!='refereeJsxt'|| IsAnswering" ref="chatMemberList" :group="group" :current-coversition="currentCoversition" />
|
||||
<div class="chat-box-main">
|
||||
<chat-coversition-list ref="chatCoversitionList" :user-role="userRole" @hideAddCoversition="hideAddCoversition" @setCurrentCoversition="setCurrentCoversition" @setHeadTitle="setHeadTitle" />
|
||||
<div class="chat-window">
|
||||
<div class="chat-box-header">
|
||||
<div class="chat-box-header-title">{{ headerTitle }}</div>
|
||||
<div class="minimality" @click="handleMinimality('min')">
|
||||
<i class="el-icon-remove" />
|
||||
</div>
|
||||
<div v-show="currentCoversition.all==undefined?true&&isShow:currentCoversition.all&&isShow" class="chat-createGroup" @click="handleCreateGroup()">
|
||||
<i class="el-icon-plus" style="font-weight: bolder;" />
|
||||
</div>
|
||||
<div class="chat-setting" @click="handleSetting()">
|
||||
<i class="el-icon-s-tools" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="chat-box-content">
|
||||
<chat-content ref="chatContent" :project="project" :is-answering="IsAnswering" :current-coversition="currentCoversition" @changeCoversition="changeCoversition" />
|
||||
<div v-if="recordSending" class="chat_record_tip">
|
||||
<div id="record_progress_bar" :style="'width:'+100/60*seconds+'%'" />
|
||||
<div class="record_icon" />
|
||||
<div class="record_tip_text">正在录音...</div>
|
||||
<div class="record_tip_confirm" @click="stopRecording()">确定</div>
|
||||
<div class="record_tip_cancle" @click="cancleRecording()">取消</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="chat-box-footer">
|
||||
<div class="chat-box-footer-tool" />
|
||||
<el-button v-if="isButtonShow" size="mini" type="danger" class="chat-box-footer-quit" :loading="quitLoading" @click="quitCoversition()">退出群聊</el-button>
|
||||
<el-button v-if="currentCoversition.all||isButtonShow" class="chat-box-footer-send" size="mini" type="primary" :disabled="recordSending" @click="startRecording()">发送语音</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-show="minimize" class="reminder-drag minimize-box">
|
||||
<div class="chat-title">聊天窗口</div>
|
||||
<div class="minimality" @click="handleMinimality('max')">
|
||||
<i class="el-icon-circle-plus" />
|
||||
</div>
|
||||
</div>
|
||||
<chat-setting ref="chatSetting" :form="form" @setSetting="setSetting" />
|
||||
<chat-create-group ref="createGroup" :group="group" @addCoversition="addCoversition" />
|
||||
<chat-tooltip :group="group" @getCoversitionList="getCoversitionList" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import ChatSetting from './chatSetting';
|
||||
import ChatContent from './chatContent';
|
||||
import ChatMemberList from './chatMemberList';
|
||||
import ChatCoversitionList from './chatCoversitionList';
|
||||
import ChatCreateGroup from './chatCreateGroup';
|
||||
import ChatTooltip from './chatTooltip';
|
||||
import RecordRTC from 'recordrtc';
|
||||
import {uploadAudioFileNew, quitCoversition} from '@/api/chat';
|
||||
import { getSessionStorage } from '@/utils/auth';
|
||||
export default {
|
||||
name: 'ChatBox',
|
||||
components:{
|
||||
ChatSetting,
|
||||
ChatContent,
|
||||
ChatMemberList,
|
||||
ChatCoversitionList,
|
||||
ChatCreateGroup,
|
||||
ChatTooltip
|
||||
},
|
||||
props: {
|
||||
group: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
userRole: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
minimize:true,
|
||||
bottom:15,
|
||||
recordSending:false,
|
||||
currentCoversition:{},
|
||||
seconds:0,
|
||||
inter:null,
|
||||
recorders: null,
|
||||
microphone:null,
|
||||
isHasCoversition:false,
|
||||
quitLoading:false,
|
||||
form:{
|
||||
language:'zh',
|
||||
sex:'1'
|
||||
},
|
||||
headerTitle:''
|
||||
};
|
||||
},
|
||||
computed:{
|
||||
isShow() {
|
||||
return this.userRole != 'ADMIN' && this.userRole != 'AUDIENCE' && !this.isHasCoversition;
|
||||
},
|
||||
isButtonShow() {
|
||||
return this.userRole != 'ADMIN' && this.userRole != 'AUDIENCE' && this.isHasCoversition;
|
||||
},
|
||||
project() {
|
||||
return getSessionStorage('project');
|
||||
},
|
||||
IsAnswering() {
|
||||
return !(this.$route.path.includes('refereeJsxtDisplay'));
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
'$store.state.map.mapViewLoadedCount':function(val) {
|
||||
const object = document.querySelector('.menuButton');
|
||||
if (object) {
|
||||
const objectBottom = parseInt(object.style.bottom) || 0;
|
||||
this.bottom = this.bottom + object.offsetHeight + objectBottom;
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.initPage();
|
||||
},
|
||||
methods:{
|
||||
async initPage() {
|
||||
},
|
||||
handleMinimality(data) {
|
||||
if (data == 'min') {
|
||||
this.minimize = true;
|
||||
this.$refs.chatSetting.doClose();
|
||||
this.$refs.createGroup.doClose();
|
||||
} else {
|
||||
this.minimize = false;
|
||||
}
|
||||
},
|
||||
setSetting(data) {
|
||||
this.form = data;
|
||||
},
|
||||
getCoversitionList() {
|
||||
this.$refs.chatCoversitionList.initPage(false);
|
||||
},
|
||||
setCurrentCoversition(coversition) {
|
||||
if (coversition && coversition.id) {
|
||||
this.currentCoversition = coversition;
|
||||
this.headerTitle = coversition.name;
|
||||
} else {
|
||||
this.headerTitle = '';
|
||||
}
|
||||
if (this.recordSending) {
|
||||
this.cancleRecording();
|
||||
}
|
||||
this.$refs.chatContent.scrollTop();
|
||||
},
|
||||
setHeadTitle(headerTitle) {
|
||||
this.headerTitle = headerTitle;
|
||||
},
|
||||
hideAddCoversition() {
|
||||
this.isHasCoversition = true;
|
||||
},
|
||||
quitCoversition() {
|
||||
this.quitLoading = true;
|
||||
quitCoversition(this.group, this.currentCoversition.id).then(res=>{
|
||||
this.currentCoversition = {all:undefined, id:null};
|
||||
this.$refs.chatCoversitionList.initPage(true);
|
||||
this.isHasCoversition = false;
|
||||
this.quitLoading = false;
|
||||
}).catch(error=>{
|
||||
this.$messageBox('退出会话失败: ' + error.message);
|
||||
this.quitLoading = false;
|
||||
});
|
||||
},
|
||||
addCoversition({data, headerTitle}) {
|
||||
this.$refs.chatCoversitionList.addCoversition(data);
|
||||
this.isHasCoversition = true;
|
||||
this.currentCoversition = {id:data.id, all:data.all};
|
||||
this.headerTitle = headerTitle;
|
||||
},
|
||||
// 语音录制开始
|
||||
startRecording() {
|
||||
const that = this;
|
||||
if (!this.recordSending && !this.recorders && !this.microphone) {
|
||||
this.$refs.chatSetting.doClose();
|
||||
const StereoAudioRecorder = RecordRTC.StereoAudioRecorder;
|
||||
navigator.getUserMedia(
|
||||
{ audio: true } // 只启用音频
|
||||
, function (stream) {
|
||||
that.microphone = stream;
|
||||
that.recorders = new RecordRTC(that.microphone, {
|
||||
type: 'audio',
|
||||
recorderType: StereoAudioRecorder,
|
||||
numberOfAudioChannels: 1,
|
||||
bitsPerSecond:256000,
|
||||
desiredSampRate: 16000
|
||||
});
|
||||
that.recorders.startRecording();
|
||||
that.recordSending = true;
|
||||
that.inter = setInterval(() => {
|
||||
if (that.seconds < 60) {
|
||||
that.seconds++;
|
||||
} else {
|
||||
clearInterval(that.inter);
|
||||
}
|
||||
}, 1000);
|
||||
}, function (error) {
|
||||
switch (error.code || error.name) {
|
||||
case 'PERMISSION_DENIED':
|
||||
case 'PermissionDeniedError':
|
||||
that.$message({
|
||||
showClose: true,
|
||||
message: '用户拒绝提供信息',
|
||||
type: 'error'
|
||||
});
|
||||
break;
|
||||
case 'NOT_SUPPORTED_ERROR':
|
||||
case 'NotSupportedError':
|
||||
that.$message({
|
||||
showClose: true,
|
||||
message: '浏览器不支持硬件设备',
|
||||
type: 'error'
|
||||
});
|
||||
break;
|
||||
case 'MANDATORY_UNSATISFIED_ERROR':
|
||||
case 'MandatoryUnsatisfiedError':
|
||||
that.$message({
|
||||
showClose: true,
|
||||
message: '无法发现指定的硬件设备',
|
||||
type: 'error'
|
||||
});
|
||||
break;
|
||||
default:
|
||||
that.$message({
|
||||
showClose: true,
|
||||
message: '无法打开麦克风',
|
||||
type: 'error'
|
||||
});
|
||||
break;
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
},
|
||||
cancleRecording() {
|
||||
if (this.microphone) {
|
||||
clearInterval(this.inter);
|
||||
this.seconds = 0;
|
||||
this.microphone.stop();
|
||||
this.microphone = null;
|
||||
this.recordSending = false;
|
||||
this.recorders = null;
|
||||
}
|
||||
},
|
||||
// 停止录制
|
||||
stopRecording() {
|
||||
const that = this;
|
||||
this.recorders.stopRecording(function(blobURL) {
|
||||
clearInterval(that.inter);
|
||||
that.seconds = 0;
|
||||
const blob = that.recorders.getBlob();
|
||||
const fd = new FormData();
|
||||
fd.append('file', blob);
|
||||
uploadAudioFileNew(that.group, that.form.language, that.form.sex, that.currentCoversition.id, fd)
|
||||
.then((data) => {
|
||||
})
|
||||
.catch(error => {
|
||||
console.log(error);
|
||||
});
|
||||
if (that.microphone) {
|
||||
that.microphone.stop();
|
||||
that.microphone = null;
|
||||
that.recordSending = false;
|
||||
that.recorders = null;
|
||||
}
|
||||
});
|
||||
},
|
||||
changeCoversition(data) {
|
||||
this.$refs.chatCoversitionList.changeCoversitionOther(data);
|
||||
},
|
||||
handleSetting() {
|
||||
this.$refs.chatSetting.doShow();
|
||||
},
|
||||
handleCreateGroup() {
|
||||
this.$refs.createGroup.doShow();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.chatBox{
|
||||
width: 503px;
|
||||
// height: 400px;
|
||||
position: absolute;
|
||||
padding-left:5px;
|
||||
left: 0;
|
||||
bottom:28px;
|
||||
z-index:9;
|
||||
}
|
||||
.chat-box{
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
}
|
||||
.chat-box-header{
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
border-bottom: 1px #dedede solid;
|
||||
}
|
||||
.chat-box-header-title{
|
||||
font-size: 15px;
|
||||
margin-left: 15px;
|
||||
display: inline-block;
|
||||
margin-top: 10px;
|
||||
width: 70%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.chat-box-content{
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
border-bottom: 1px #dedede solid;
|
||||
position: relative;
|
||||
}
|
||||
.chat-box-contentTip{
|
||||
|
||||
}
|
||||
.chat-box-footer{
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
}
|
||||
.chat-window{
|
||||
display: inline-block;
|
||||
width: 400px;
|
||||
}
|
||||
.chat-setting{
|
||||
float: right;
|
||||
line-height: 40px;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
}
|
||||
.chat-createGroup{
|
||||
float: right;
|
||||
line-height: 40px;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
position: relative;
|
||||
}
|
||||
.chat-box-footer-tool{
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
}
|
||||
.chat-box-footer-send{
|
||||
background: #36a2fd;
|
||||
width: 65px;
|
||||
font-size: 12px;
|
||||
padding: 5px 0px 4px 0px;
|
||||
text-align: center;
|
||||
border-radius: 3px;
|
||||
color: #fff;
|
||||
float: right;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.minimality {
|
||||
float: right;
|
||||
line-height: 40px;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
font-size:16px;
|
||||
}
|
||||
.chat-box-main{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
border-right: 1px #dedede solid;
|
||||
z-index: 4;
|
||||
background: #fff;
|
||||
border-radius: 5px;
|
||||
left:5px;
|
||||
font-size:0;
|
||||
}
|
||||
.chat-coversition{
|
||||
|
||||
}
|
||||
.coversition-list{
|
||||
|
||||
}
|
||||
.chat-box-footer-quit{
|
||||
background: red;
|
||||
width: 65px;
|
||||
font-size: 12px;
|
||||
padding: 5px 0px 4px 0px;
|
||||
text-align: center;
|
||||
border-radius: 3px;
|
||||
color: #fff;
|
||||
float: left;
|
||||
margin-left: 10px;
|
||||
margin-bottom: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.showMembers{
|
||||
float: right;
|
||||
line-height: 40px;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
font-size: 17px;
|
||||
}
|
||||
#record_progress_bar{
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
background: #bbe5f5;
|
||||
}
|
||||
.chat_record_tip{
|
||||
height: 28px;
|
||||
display: inline-block;
|
||||
background: #dfe6ee;
|
||||
width: 100%;
|
||||
font-size: 13px;
|
||||
border-top: 1px #d8dce5 solid;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
}
|
||||
.record_icon{
|
||||
display: inline-block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
background: #25d825;
|
||||
border-radius: 10px;
|
||||
left: 7px;
|
||||
margin-right: 0px;
|
||||
box-shadow: -1px 0px 3px #6d6d6d;
|
||||
border: 1px #28d228 solid;
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
}
|
||||
.record_tip_text{
|
||||
display: inline-block;
|
||||
font-size: 12px;
|
||||
margin-left: 3px;
|
||||
// padding: 8px 0px 6px 0px;
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
left:20px
|
||||
}
|
||||
.record_tip_confirm{
|
||||
position: absolute;
|
||||
right: 63px;
|
||||
padding: 3px 0px 2px 0px;
|
||||
border: 1px #a2a5aa solid;
|
||||
border-radius: 5px;
|
||||
width: 45px;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
top: 4px;
|
||||
background: #eeeeee;
|
||||
cursor: pointer;
|
||||
}
|
||||
.record_tip_cancle{
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
padding: 3px 0px 2px 0px;
|
||||
border: 1px #a2a5aa solid;
|
||||
border-radius: 5px;
|
||||
width: 45px;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
top: 4px;
|
||||
background: #eeeeee;
|
||||
cursor: pointer;
|
||||
}
|
||||
.chat-box-footer-send.disbled{
|
||||
cursor: no-drop;
|
||||
}
|
||||
|
||||
.minimize-box {
|
||||
width: 97.5%;
|
||||
height: 40px;
|
||||
position: absolute;
|
||||
left: 5px;
|
||||
bottom: 0;
|
||||
z-index: 222;
|
||||
background: #fff;
|
||||
border-radius: 5px;
|
||||
|
||||
.chat-title {
|
||||
float: left;
|
||||
font-size: 15px;
|
||||
margin-left: 10px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
.minimality {
|
||||
float: right;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -1,290 +0,0 @@
|
||||
<template>
|
||||
<div class="chatcontentIn">
|
||||
<div class="chatcontentInner">
|
||||
<div v-for="(chatContent,index) in chatContentList" :key="index" class="chatContentInClass">
|
||||
<div :class="chatContent.self?'rightUser':'leftUser'">
|
||||
<div class="userHeader">
|
||||
<!-- chatContent.all&& -->
|
||||
<div v-if="!chatContent.self" class="userName">{{ covertName(chatContent.member,false) }}</div>
|
||||
<div :class="chatContent.self?'userChatTime textRight':'userChatTime'">{{ formatTime(chatContent.chatTime) }}</div>
|
||||
</div>
|
||||
<div class="userBubble" @click="playAudio(baseUrl+chatContent.src)">
|
||||
<div class="userMessage">
|
||||
<!-- chatContent.all&& -->
|
||||
<span v-if="!chatContent.member.robot&&chatContent.all">{{ covertName(chatContent.targetUser,true) }}</span>
|
||||
<span class="el-icon-video-play playicon" />
|
||||
<span class="messageText">{{ chatContent.message }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<audio id="audioPlay" style="display:none" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {getSimulationContextListNew} from '@/api/chat';
|
||||
import ConstConfig from '@/scripts/ConstConfig';
|
||||
import Cookies from 'js-cookie';
|
||||
|
||||
export default {
|
||||
props:{
|
||||
currentCoversition:{
|
||||
type:Object,
|
||||
required:true
|
||||
},
|
||||
project:{
|
||||
type:String,
|
||||
required:true
|
||||
},
|
||||
isAnswering:{
|
||||
type:Boolean,
|
||||
required:true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
chatContentList:[],
|
||||
coversition:{},
|
||||
currentAudioList:[],
|
||||
currentAudioIndex:0,
|
||||
isPlay:false,
|
||||
baseUrl:process.env.VUE_APP_VOICE_API
|
||||
};
|
||||
},
|
||||
watch:{
|
||||
'$store.state.socket.simulationText':function (val, old) { // 仿真聊天
|
||||
// if (this.currentCoversition.id == val.conversationId) {
|
||||
// const simulationText = this.$store.state.socket.simulationText;
|
||||
// this.chatContentList.push(simulationText);
|
||||
// }
|
||||
const simulationText = this.$store.state.socket.simulationText;
|
||||
if (this.currentCoversition.id == val.id) {
|
||||
this.chatContentList.push(simulationText);
|
||||
if (simulationText.member.userId != this.$store.state.user.id) {
|
||||
this.currentAudioList.push(this.baseUrl + simulationText.src);
|
||||
console.log(this.isPlay);
|
||||
if (!this.isPlay) {
|
||||
this.isPlay = true;
|
||||
this.playAllAudio();
|
||||
}
|
||||
}
|
||||
this.scrollTop();
|
||||
} else {
|
||||
if (!simulationText.all) {
|
||||
this.$emit('changeCoversition', simulationText);
|
||||
// this.$emit('addCoversition', {data:simulationText, headerTitle:''});
|
||||
this.chatContentList.push(simulationText);
|
||||
if (simulationText.member.userId != this.$store.state.user.id) {
|
||||
this.currentAudioList.push(this.baseUrl + simulationText.src);
|
||||
console.log(this.isPlay);
|
||||
if (!this.isPlay) {
|
||||
this.isPlay = true;
|
||||
this.playAllAudio();
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (this.project == 'refereeJsxt') {
|
||||
this.chatContentList.push(simulationText);
|
||||
simulationText.name = '所有人';
|
||||
this.$emit('changeCoversition', simulationText);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
$route() {
|
||||
this.inintData();
|
||||
},
|
||||
currentCoversition:function (val, old) {
|
||||
if (val && (this.project != 'refereeJsxt' || this.isAnswering)) {
|
||||
this.chatContentList = [];
|
||||
this.coversition = this.currentCoversition;
|
||||
this.inintData();
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// this.coversition = this.currentCoversition;
|
||||
// this.inintData();
|
||||
},
|
||||
methods:{
|
||||
inintData() {
|
||||
if (this.coversition.id) {
|
||||
getSimulationContextListNew(this.$route.query.group, this.coversition.id).then(res=>{
|
||||
const userId = this.$store.state.user.id;
|
||||
const coversitionList = res.data.map(coversition=>{
|
||||
coversition.self = false;
|
||||
if (coversition.member.userId == userId) {
|
||||
coversition.self = true;
|
||||
}
|
||||
coversition.src = coversition.isAudio ? `/audio/${coversition.audioPath}` : '';
|
||||
coversition.targetUser = coversition.targetMember ? coversition.targetMember : 'All';
|
||||
return coversition;
|
||||
});
|
||||
this.chatContentList = coversitionList;
|
||||
this.scrollTop();
|
||||
});
|
||||
}
|
||||
// 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;
|
||||
},
|
||||
scrollTop() {
|
||||
this.$nextTick(function() {
|
||||
const scrollTop = document.querySelector('.chatcontentInner').offsetHeight - document.querySelector('.chatcontentIn').offsetHeight + 30;
|
||||
document.querySelector('.chatcontentIn').scrollTop = scrollTop;
|
||||
});
|
||||
},
|
||||
formatTime(time) {
|
||||
return /\d{2}:\d{2}:\d{2}/.exec(time)[0] || time;
|
||||
},
|
||||
playAllAudio() {
|
||||
this.playEachAudio(this.currentAudioList[this.currentAudioIndex]);
|
||||
},
|
||||
playEachAudio(audioUrl) {
|
||||
this.$nextTick(function() {
|
||||
document.querySelector('#audioPlay').src = audioUrl;
|
||||
document.querySelector('#audioPlay').play();
|
||||
const that = this;
|
||||
document.querySelector('#audioPlay').onended = function() {
|
||||
that.currentAudioList.shift();
|
||||
console.log(that.currentAudioList.length);
|
||||
if (that.currentAudioList.length > 0) {
|
||||
that.playEachAudio(that.currentAudioList[that.currentAudioIndex]);
|
||||
} else {
|
||||
that.isPlay = false;
|
||||
}
|
||||
};
|
||||
});
|
||||
},
|
||||
covertName(data, status) {
|
||||
if (data != 'All') {
|
||||
if (data instanceof Array) {
|
||||
let result = '';
|
||||
data.forEach(each=>{
|
||||
result += this.covertEachName(each, status);
|
||||
});
|
||||
return result;
|
||||
} else {
|
||||
return this.covertEachName(data, status);
|
||||
}
|
||||
} else {
|
||||
return '@All';
|
||||
}
|
||||
},
|
||||
covertEachName(data, status) {
|
||||
const roleTypeList = ConstConfig.ConstSelect.roleTypeNew;
|
||||
roleTypeList.forEach(function(element) {
|
||||
const rolename = element.value;
|
||||
if (Cookies.get('user_lang') == 'en') {
|
||||
if (rolename == data.role) {
|
||||
data.role = element.enLabel;
|
||||
}
|
||||
} else {
|
||||
if (rolename == data.role) {
|
||||
data.role = element.label;
|
||||
}
|
||||
}
|
||||
});
|
||||
const deviceName = data.deviceName ? '-' + data.deviceName : '';
|
||||
const memberName = data.name ? '-' + data.name : '';
|
||||
if (status) {
|
||||
return '@' + data.role + deviceName + memberName;
|
||||
} else {
|
||||
return data.role + deviceName + memberName;
|
||||
}
|
||||
},
|
||||
playAudio(audioUrl) {
|
||||
document.querySelector('#audioPlay').src = audioUrl;
|
||||
document.querySelector('#audioPlay').play();
|
||||
}
|
||||
// reloadData(currentCoversition) {
|
||||
// this.chatContentList = [];
|
||||
// this.coversition = currentCoversition;
|
||||
// this.inintData();
|
||||
// }
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.chatcontentIn{
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
display: inline-block;
|
||||
overflow: auto;
|
||||
padding-bottom: 20px;
|
||||
cursor:auto;
|
||||
}
|
||||
.leftUser{
|
||||
float: left;
|
||||
margin-left: 10px;
|
||||
margin-top: 10px;
|
||||
display: inline-block;
|
||||
}
|
||||
.rightUser{
|
||||
float: right;
|
||||
margin-right: 10px;
|
||||
margin-top: 10px;
|
||||
display: inline-block;
|
||||
}
|
||||
.userHeader{margin-bottom: 2px;}
|
||||
.userName{font-size: 12px;display:inline-block;}
|
||||
.userChatTime{font-size: 12px;display:inline-block;}
|
||||
.userBubble{
|
||||
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;width: 100%;}
|
||||
.userMessage{}
|
||||
.messageText{line-height: 20px;}
|
||||
.chatContentInClass{
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
// 谷歌、safari、qq浏览器、360浏览器滚动条样式
|
||||
// 定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸
|
||||
.chatcontentIn::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
// height: 110px;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
/*定义滚动条轨道 内阴影+圆角*/
|
||||
.chatcontentIn::-webkit-scrollbar-track {
|
||||
// box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
|
||||
border-radius: 10px;
|
||||
background-color: #FFFFFF;;
|
||||
}
|
||||
/*定义滑块 内阴影+圆角*/
|
||||
.chatcontentIn::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
// box-shadow: inset 0 0 6px rgba(0,0,0,.3);
|
||||
background-color: #cacaca;
|
||||
}
|
||||
/*滑块效果*/
|
||||
.chatcontentIn::-webkit-scrollbar-thumb:hover {
|
||||
border-radius: 5px;
|
||||
// box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
|
||||
background: rgba(0,0,0,0.4);
|
||||
}
|
||||
/*IE滚动条颜色*/
|
||||
html {
|
||||
scrollbar-face-color:#bfbfbf;/*滚动条颜色*/
|
||||
scrollbar-highlight-color:#000;
|
||||
scrollbar-3dlight-color:#000;
|
||||
scrollbar-darkshadow-color:#000;
|
||||
scrollbar-Shadow-color:#adadad;/*滑块边色*/
|
||||
scrollbar-arrow-color:rgba(0,0,0,0.4);/*箭头颜色*/
|
||||
scrollbar-track-color:#eeeeee;/*背景颜色*/
|
||||
}
|
||||
</style>
|
||||
@ -1,172 +0,0 @@
|
||||
<template>
|
||||
<div class="chat-coversition">
|
||||
<div id="coversition-list-name" />
|
||||
<div class="coversition-list">
|
||||
<div
|
||||
v-for="coversition in coversitionList"
|
||||
:key="coversition.id"
|
||||
:class="coversition.id==currentCoversition.id?'coversition-active each-coversition':'each-coversition'"
|
||||
@click="changeCoversition(coversition)"
|
||||
>
|
||||
<div class="coversitionName">{{ coversition.name }}</div>
|
||||
<!-- <div v-if="!coversition.all" class="el-icon-close closeConversition" @click="closeCoversition(coversition.id)" /> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {getSimulationConversationListNew} from '@/api/chat';
|
||||
export default {
|
||||
name:'ChatCoversitionList',
|
||||
props: {
|
||||
userRole: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
coversitionList:[],
|
||||
currentCoversition:{}
|
||||
};
|
||||
},
|
||||
watch:{
|
||||
'userRole':function(val) {
|
||||
this.initPage(true);
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
// this.initPage(true);
|
||||
},
|
||||
methods:{
|
||||
initPage(status) {
|
||||
getSimulationConversationListNew(this.$route.query.group).then(resp=>{
|
||||
if (resp.data) {
|
||||
const data = resp.data;
|
||||
if (this.userRole == 'ADMIN' || this.userRole == 'AUDIENCE') {
|
||||
this.coversitionList = data;
|
||||
} else {
|
||||
this.coversitionList = data.filter(coversition=>{ return coversition.all == false; });
|
||||
if (this.coversitionList.length >= 1) {
|
||||
this.$emit('hideAddCoversition');
|
||||
}
|
||||
}
|
||||
if (resp.data && resp.data.length && resp.data.length > 0 && status) {
|
||||
if (this.userRole == 'ADMIN' || this.userRole == 'AUDIENCE') {
|
||||
this.currentCoversition = data[0];
|
||||
this.$emit('setCurrentCoversition', resp.data[0]);
|
||||
} else {
|
||||
if (this.coversitionList.length >= 1) {
|
||||
this.currentCoversition = data[0];
|
||||
this.$emit('setCurrentCoversition', resp.data[0]);
|
||||
} else {
|
||||
this.currentCoversition = null;
|
||||
this.$emit('setCurrentCoversition', this.currentCoversition);
|
||||
}
|
||||
}
|
||||
} else if (resp.data && resp.data.length && resp.data.length > 0 && !status) {
|
||||
const coversition = data.filter(coversition=>{ return coversition.all == false; });
|
||||
this.currentCoversition = coversition[0];
|
||||
this.$emit('setCurrentCoversition', coversition[0]);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
addCoversition(data) {
|
||||
const index = this.coversitionList.findIndex(item=>{ return item.id == data.id; });
|
||||
if (index < 0) {
|
||||
this.coversitionList.push(data);
|
||||
this.currentCoversition = data;
|
||||
}
|
||||
},
|
||||
changeCoversition(coversition) {
|
||||
this.$emit('setHeadTitle', coversition.name);
|
||||
this.currentCoversition = {id:coversition.id, all:coversition.all};
|
||||
this.$emit('setCurrentCoversition', coversition);
|
||||
// this.$refs.chatContent.reloadData(this.currentCoversition);
|
||||
},
|
||||
changeCoversitionOther(coversition) {
|
||||
const index = this.coversitionList.findIndex(item=>{ return item.id == coversition.id; });
|
||||
if (index < 0) {
|
||||
this.coversitionList.push(coversition);
|
||||
}
|
||||
this.changeCoversition(coversition);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.chat-coversition{
|
||||
width: 100px;
|
||||
display: inline-block;
|
||||
border-right: 1px #dedede solid;
|
||||
height: 100%;
|
||||
vertical-align: top;
|
||||
background: #f9f9f9;
|
||||
border-radius: 5px 0px 0px 5px;
|
||||
}
|
||||
.coversition-list{
|
||||
padding: 3px 0px 10px 0px;
|
||||
height: 355px;
|
||||
overflow: auto;
|
||||
margin-top:40px;
|
||||
}
|
||||
.each-coversition{
|
||||
font-size: 14px;
|
||||
padding: 10px 7px 10px 10px;
|
||||
border-bottom: 1px #dedede solid;
|
||||
cursor: pointer;
|
||||
}
|
||||
.coversition-active{
|
||||
background: #e0e0e0;
|
||||
}
|
||||
.coversitionName{
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
display: inline-block;
|
||||
width: 60px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.closeConversition{
|
||||
vertical-align: top;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
// 谷歌、safari、qq浏览器、360浏览器滚动条样式
|
||||
// 定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸
|
||||
.coversition-list::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
// height: 110px;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
/*定义滚动条轨道 内阴影+圆角*/
|
||||
.coversition-list::-webkit-scrollbar-track {
|
||||
// box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
|
||||
border-radius: 10px;
|
||||
background-color: #FFFFFF;;
|
||||
}
|
||||
/*定义滑块 内阴影+圆角*/
|
||||
.coversition-list::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
// box-shadow: inset 0 0 6px rgba(0,0,0,.3);
|
||||
background-color: #cacaca;
|
||||
}
|
||||
/*滑块效果*/
|
||||
.coversition-list::-webkit-scrollbar-thumb:hover {
|
||||
border-radius: 5px;
|
||||
// box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
|
||||
background: rgba(0,0,0,0.4);
|
||||
}
|
||||
/*IE滚动条颜色*/
|
||||
html {
|
||||
scrollbar-face-color:#bfbfbf;/*滚动条颜色*/
|
||||
scrollbar-highlight-color:#000;
|
||||
scrollbar-3dlight-color:#000;
|
||||
scrollbar-darkshadow-color:#000;
|
||||
scrollbar-Shadow-color:#adadad;/*滑块边色*/
|
||||
scrollbar-arrow-color:rgba(0,0,0,0.4);/*箭头颜色*/
|
||||
scrollbar-track-color:#eeeeee;/*背景颜色*/
|
||||
}
|
||||
</style>
|
||||
@ -1,234 +0,0 @@
|
||||
<template>
|
||||
<div v-show="dialogVisible" class="chat-create-group-all">
|
||||
<div class="chat-create-group">
|
||||
<div class="create-group-header">
|
||||
<div class="create-group-title">添加会话对象</div>
|
||||
<div class="create-group-close">
|
||||
<i class="el-icon-close" @click="dialogVisible=false" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="create-group-content">
|
||||
<div class="chat-member-list">
|
||||
<el-checkbox-group v-model="checkList">
|
||||
<el-checkbox
|
||||
v-for="member in memberList"
|
||||
:key="member.id"
|
||||
class="each-chat-member"
|
||||
:label="member"
|
||||
:disabled="member.userId === userId"
|
||||
>{{ member.memberName }}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
<div class="currentSelectList">
|
||||
<div
|
||||
v-for="member in checkList"
|
||||
:key="member.id"
|
||||
class="eachSelect"
|
||||
>
|
||||
{{ member.memberName }}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- :style="member.userId === userId ?'color:red':''" -->
|
||||
</div>
|
||||
<div class="create-group-bottom">
|
||||
<el-button :loading="loading" size="small" type="primary" @click="doCreate">创建会话</el-button>
|
||||
<el-button size="small" @click="doClose">取消</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {getSimulationMembersNew, getSimulationConversationIdNew} from '@/api/chat';
|
||||
import ConstConfig from '@/scripts/ConstConfig';
|
||||
import Cookies from 'js-cookie';
|
||||
export default {
|
||||
name:'ChatCreateGroup',
|
||||
props: {
|
||||
group: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible:false,
|
||||
loading:false,
|
||||
memberList:[],
|
||||
checkList:[]
|
||||
};
|
||||
},
|
||||
computed:{
|
||||
userId() {
|
||||
return this.$store.state.user.id;
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
doShow() {
|
||||
this.getSimulationMembers();
|
||||
this.dialogVisible = true;
|
||||
},
|
||||
getSimulationMembers() {
|
||||
getSimulationMembersNew(this.$route.query.group).then(resp => {
|
||||
let lastData = JSON.stringify(resp.data);
|
||||
const roleTypeList = ConstConfig.ConstSelect.roleTypeNew;
|
||||
roleTypeList.forEach(function(element) {
|
||||
const rolename = element.value;
|
||||
if (Cookies.get('user_lang') == 'en') {
|
||||
lastData = lastData.replace(new RegExp(rolename, 'g'), element.enLabel);
|
||||
} else {
|
||||
lastData = lastData.replace(new RegExp(rolename, 'g'), element.label);
|
||||
}
|
||||
});
|
||||
lastData = JSON.parse(lastData);
|
||||
lastData = lastData.filter(memberIn=>{ return memberIn.role != '观众'; });
|
||||
lastData.map(member=>{
|
||||
const deviceName = member.deviceName ? '-' + member.deviceName : '';
|
||||
const memberName = member.name ? '-' + member.name : '';
|
||||
member.memberName = member.role + deviceName + memberName;
|
||||
return member;
|
||||
});
|
||||
this.memberList = lastData;
|
||||
});
|
||||
},
|
||||
doCreate() {
|
||||
if (this.checkList.length > 0) {
|
||||
this.loading = true;
|
||||
const checkList = this.checkList.map(function(check) { return check.id; });
|
||||
getSimulationConversationIdNew(checkList, this.group).then(resp => {
|
||||
if (resp.data) {
|
||||
const data = resp.data;
|
||||
this.loading = false;
|
||||
this.$emit('addCoversition', {data:data, headerTitle:resp.data.name});
|
||||
this.dialogVisible = false;
|
||||
this.checkList = [];
|
||||
}
|
||||
}).catch(error=>{
|
||||
this.$messageBox('创建会话失败: ' + error.message);
|
||||
this.loading = false;
|
||||
this.dialogVisible = false;
|
||||
this.checkList = [];
|
||||
});
|
||||
}
|
||||
|
||||
},
|
||||
doClose() {
|
||||
this.checkList = [];
|
||||
this.dialogVisible = false;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.chat-create-group-all{
|
||||
position:absolute;
|
||||
width:100%;
|
||||
height:100%;
|
||||
left:0;
|
||||
top:0;
|
||||
z-index:10;
|
||||
}
|
||||
.chat-create-group{
|
||||
position: absolute;
|
||||
width: 70%;
|
||||
height: 300px;
|
||||
border: 1px #dedede solid;
|
||||
left: 26%;
|
||||
top: 8%;
|
||||
z-index: 7;
|
||||
border-radius: 8px;
|
||||
box-shadow: #b5aeae 0 0 10px;
|
||||
background: #fff;
|
||||
}
|
||||
.create-group-header{
|
||||
padding-left: 10px;
|
||||
padding-top: 6px;
|
||||
font-size: 14px;
|
||||
border-bottom: 1px #dedede solid;
|
||||
padding-bottom: 6px;
|
||||
}
|
||||
.create-group-title{
|
||||
display: inline-block;
|
||||
}
|
||||
.create-group-close{
|
||||
float: right;
|
||||
display: inline-block;
|
||||
margin-right: 5px;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.chat-member-list{
|
||||
width: 54%;
|
||||
height: 216px;
|
||||
overflow-y: auto;
|
||||
padding: 5px 10px;
|
||||
font-size: 14px;
|
||||
overflow-x: hidden;
|
||||
border-right: 1px #ccc solid;
|
||||
display:inline-block;
|
||||
}
|
||||
.create-group-content{
|
||||
width: 100%;
|
||||
height: 220px;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 1px #dedede solid;
|
||||
}
|
||||
.create-group-bottom{
|
||||
text-align: center;
|
||||
margin-top:8px;
|
||||
}
|
||||
.each-chat-member{
|
||||
display:block;
|
||||
margin-top:5px;
|
||||
}
|
||||
.currentSelectList{
|
||||
display: inline-block;
|
||||
width: 44%;
|
||||
font-size: 14px;
|
||||
vertical-align: top;
|
||||
padding: 5px 10px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
height: 216px;
|
||||
}
|
||||
.eachSelect{
|
||||
display:block;
|
||||
margin-top:5px;
|
||||
}
|
||||
// 谷歌、safari、qq浏览器、360浏览器滚动条样式
|
||||
// 定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸
|
||||
.chat-member-list::-webkit-scrollbar,.currentSelectList::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
// height: 110px;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
/*定义滚动条轨道 内阴影+圆角*/
|
||||
.chat-member-list::-webkit-scrollbar-track,.currentSelectList::-webkit-scrollbar-track{
|
||||
// box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
|
||||
border-radius: 10px;
|
||||
background-color: #FFFFFF;;
|
||||
}
|
||||
/*定义滑块 内阴影+圆角*/
|
||||
.chat-member-list::-webkit-scrollbar-thumb,.currentSelectList::-webkit-scrollbar-thumb{
|
||||
border-radius: 10px;
|
||||
// box-shadow: inset 0 0 6px rgba(0,0,0,.3);
|
||||
background-color: #cacaca;
|
||||
}
|
||||
/*滑块效果*/
|
||||
.chat-member-list::-webkit-scrollbar-thumb:hover,.currentSelectList::-webkit-scrollbar-thumb:hover {
|
||||
border-radius: 5px;
|
||||
// box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
|
||||
background: rgba(0,0,0,0.4);
|
||||
}
|
||||
/*IE滚动条颜色*/
|
||||
html {
|
||||
scrollbar-face-color:#bfbfbf;/*滚动条颜色*/
|
||||
scrollbar-highlight-color:#000;
|
||||
scrollbar-3dlight-color:#000;
|
||||
scrollbar-darkshadow-color:#000;
|
||||
scrollbar-Shadow-color:#adadad;/*滑块边色*/
|
||||
scrollbar-arrow-color:rgba(0,0,0,0.4);/*箭头颜色*/
|
||||
scrollbar-track-color:#eeeeee;/*背景颜色*/
|
||||
}
|
||||
</style>
|
||||
@ -1,163 +0,0 @@
|
||||
<template>
|
||||
<div :class="showMembers?'memberAnimate chat-box-members':'chat-box-members'">
|
||||
<div class="chat-member-title">成员列表</div>
|
||||
<div class="chat-member-list">
|
||||
<div
|
||||
v-for="member in memberList"
|
||||
:key="member.id"
|
||||
class="each-chat-member"
|
||||
:style="member.userId === userId ?'color:red':''"
|
||||
:title="member.memberName"
|
||||
>{{ member.memberName }}</div>
|
||||
<!-- :class="member.online?'each-chat-member':'each-chat-member each-chat-member-outline'" -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// getSimulationMembersNew,
|
||||
import {getSimulationChatMemberNew} from '@/api/chat';
|
||||
import ConstConfig from '@/scripts/ConstConfig';
|
||||
import Cookies from 'js-cookie';
|
||||
export default {
|
||||
name: 'ChatMemberList',
|
||||
props: {
|
||||
group: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
currentCoversition:{
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showMembers:true,
|
||||
memberList:[]
|
||||
};
|
||||
},
|
||||
computed:{
|
||||
userId() {
|
||||
return this.$store.state.user.id;
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
currentCoversition:function (val, old) {
|
||||
if (val) {
|
||||
this.getSimulationMembers();
|
||||
}
|
||||
},
|
||||
'$store.state.socket.acceptInviteChat':function(val) {
|
||||
this.getSimulationMembers();
|
||||
},
|
||||
'$store.state.socket.quitCoversition':function(val) {
|
||||
this.getSimulationMembers();
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods:{
|
||||
getSimulationMembers() {
|
||||
this.memberList = [];
|
||||
if (this.currentCoversition.id) {
|
||||
getSimulationChatMemberNew(this.$route.query.group, this.currentCoversition.id).then(resp => {
|
||||
let lastData = JSON.stringify(resp.data);
|
||||
const roleTypeList = ConstConfig.ConstSelect.roleTypeNew;
|
||||
roleTypeList.forEach(function(element) {
|
||||
const rolename = element.value;
|
||||
if (Cookies.get('user_lang') == 'en') {
|
||||
lastData = lastData.replace(new RegExp(rolename, 'g'), element.enLabel);
|
||||
} else {
|
||||
lastData = lastData.replace(new RegExp(rolename, 'g'), element.label);
|
||||
}
|
||||
});
|
||||
lastData = JSON.parse(lastData);
|
||||
lastData = lastData.filter(memberIn=>{ return memberIn.role != '观众'; });
|
||||
lastData.map(member=>{
|
||||
const deviceName = member.deviceName ? '-' + member.deviceName : '';
|
||||
const memberName = member.name ? '-' + member.name : '';
|
||||
member.memberName = member.role + deviceName + memberName;
|
||||
return member;
|
||||
});
|
||||
this.memberList = lastData;
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.memberAnimate{
|
||||
transform: translateX(97%);
|
||||
}
|
||||
.chat-box-members{
|
||||
position: absolute;
|
||||
width: 140px;
|
||||
right: 0;
|
||||
height: 100%;
|
||||
background: #fff;
|
||||
border-right: 1px #dedede solid;
|
||||
border-radius: 0px 5px 5px 0px;
|
||||
z-index: 2;
|
||||
transition: transform 1s;
|
||||
padding: 12px 2px 10px 16px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.chat-member-title{
|
||||
}
|
||||
.chat-member-list{
|
||||
margin-top: 13px;
|
||||
font-size: 12px;
|
||||
margin-left: 2px;
|
||||
height: 350px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.each-chat-member{
|
||||
margin-bottom: 10px;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
}
|
||||
.each-chat-member-outline{
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
// 谷歌、safari、qq浏览器、360浏览器滚动条样式
|
||||
// 定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸
|
||||
.chat-member-list::-webkit-scrollbar {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
// height: 110px;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
/*定义滚动条轨道 内阴影+圆角*/
|
||||
.chat-member-list::-webkit-scrollbar-track {
|
||||
// box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
|
||||
border-radius: 10px;
|
||||
background-color: #FFFFFF;;
|
||||
}
|
||||
/*定义滑块 内阴影+圆角*/
|
||||
.chat-member-list::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
// box-shadow: inset 0 0 6px rgba(0,0,0,.3);
|
||||
background-color: #cacaca;
|
||||
}
|
||||
/*滑块效果*/
|
||||
.chat-member-list::-webkit-scrollbar-thumb:hover {
|
||||
border-radius: 5px;
|
||||
// box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
|
||||
background: rgba(0,0,0,0.4);
|
||||
}
|
||||
/*IE滚动条颜色*/
|
||||
html {
|
||||
scrollbar-face-color:#bfbfbf;/*滚动条颜色*/
|
||||
scrollbar-highlight-color:#000;
|
||||
scrollbar-3dlight-color:#000;
|
||||
scrollbar-darkshadow-color:#000;
|
||||
scrollbar-Shadow-color:#adadad;/*滑块边色*/
|
||||
scrollbar-arrow-color:rgba(0,0,0,0.4);/*箭头颜色*/
|
||||
scrollbar-track-color:#eeeeee;/*背景颜色*/
|
||||
}
|
||||
</style>
|
||||
@ -1,126 +0,0 @@
|
||||
<template>
|
||||
<div v-show="dialogVisible" class="chat-popup">
|
||||
<div class="chat-setting-header">
|
||||
<div class="chat-setting-title">设置</div>
|
||||
<div class="chat-setting-close">
|
||||
<i class="el-icon-close" @click="dialogVisible=false" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="chat-setting-content">
|
||||
<div class="chat-setting-language">
|
||||
<div class="setting-language-title">语言: </div>
|
||||
<el-switch
|
||||
v-model="form.language"
|
||||
class="setting-language-select"
|
||||
active-color="#409EFF"
|
||||
inactive-color="#ff4949"
|
||||
active-text="中"
|
||||
inactive-text="En"
|
||||
active-value="zh"
|
||||
inactive-value="en"
|
||||
@change="changeLanguage()"
|
||||
/>
|
||||
</div>
|
||||
<div class="chat-setting-sex">
|
||||
<div class="setting-sex-title">性别: </div>
|
||||
<el-switch
|
||||
v-model="form.sex"
|
||||
class="setting-sex-select"
|
||||
active-color="#409EFF"
|
||||
inactive-color="#ff4949"
|
||||
active-icon-class="el-icon-male"
|
||||
inactive-icon-class="el-icon-female"
|
||||
active-value="1"
|
||||
inactive-value="0"
|
||||
@change="changeSex()"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'ChatSetting',
|
||||
props:{
|
||||
form:{
|
||||
type:Object,
|
||||
required:true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
loading:false
|
||||
};
|
||||
},
|
||||
methods:{
|
||||
doShow() {
|
||||
this.dialogVisible = true;
|
||||
},
|
||||
doClose() {
|
||||
this.dialogVisible = false;
|
||||
},
|
||||
changeLanguage() {
|
||||
this.$emit('setSetting', this.form);
|
||||
},
|
||||
changeSex() {
|
||||
this.$emit('setSetting', this.form);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.chat-popup{
|
||||
position: absolute;
|
||||
width: 54%;
|
||||
height: 143px;
|
||||
border: 1px #dedede solid;
|
||||
left: 33%;
|
||||
top: 24%;
|
||||
z-index: 7;
|
||||
border-radius: 4px;
|
||||
-webkit-box-shadow: 3px 3px 3px #dedede;
|
||||
box-shadow: 3px 3px 3px #dedede;
|
||||
background: #fff;
|
||||
}
|
||||
.chat-setting-header{
|
||||
padding-left: 10px;
|
||||
padding-top: 6px;
|
||||
font-size: 14px;
|
||||
border-bottom: 1px #dedede solid;
|
||||
padding-bottom: 6px;
|
||||
}
|
||||
.chat-setting-title{
|
||||
display: inline-block;
|
||||
}
|
||||
.chat-setting-close{
|
||||
float: right;
|
||||
display: inline-block;
|
||||
margin-right: 5px;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.chat-setting-content{
|
||||
|
||||
}
|
||||
.chat-setting-language,.chat-setting-sex{
|
||||
display: inline-block;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.setting-language-title,.setting-sex-title{
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
margin-left: 20px;
|
||||
vertical-align: top;
|
||||
margin-top: 3px;
|
||||
}
|
||||
.setting-language-select,.setting-sex-select{
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss">
|
||||
.setting-sex-select .el-icon-male,.setting-sex-select .el-icon-female{
|
||||
font-size:18px !important;
|
||||
}
|
||||
</style>
|
||||
@ -1,110 +0,0 @@
|
||||
<template>
|
||||
<div v-show="dialogVisible" class="chatTooltipAll">
|
||||
<div class="chatTooltip">
|
||||
<div class="chatTooltipHeader">
|
||||
{{ userName }} 邀请您加入会话！
|
||||
</div>
|
||||
<div class="chatTooltipBootom">
|
||||
<div class="create-group-bottom">
|
||||
<el-button :loading="loading" size="small" type="primary" @click="doCreate">接受</el-button>
|
||||
<el-button size="small" @click="doClose">拒绝</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script>
|
||||
import ConstConfig from '@/scripts/ConstConfig';
|
||||
import Cookies from 'js-cookie';
|
||||
import {acceptCoversitionInvite} from '@/api/chat';
|
||||
export default {
|
||||
name:'ChatTooltip',
|
||||
props: {
|
||||
group: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
userName:'',
|
||||
dialogVisible:false,
|
||||
loading:false,
|
||||
conversationId:''
|
||||
};
|
||||
},
|
||||
watch:{
|
||||
'$store.state.socket.inviteOtherIntoChat':function(val) {
|
||||
this.userName = this.coverName(val);
|
||||
this.dialogVisible = true;
|
||||
this.conversationId = val.conversationId;
|
||||
}
|
||||
},
|
||||
// {"conversationId":"22e10b17-7a6c-4b1b-8724-f87fb2053b76","from":{"id":"17","userId":"75","name":"赵",
|
||||
// "role":"STATION_SUPERVISOR","deviceType":"STATION","deviceCode":"Station32955","deviceName":"世纪大道","online":true,"robot":false}
|
||||
methods:{
|
||||
coverName(inviteUser) {
|
||||
const member = inviteUser.from;
|
||||
const roleTypeList = ConstConfig.ConstSelect.roleTypeNew;
|
||||
let data = member.role;
|
||||
roleTypeList.forEach(function(element) {
|
||||
const rolename = element.value;
|
||||
if (Cookies.get('user_lang') == 'en') {
|
||||
data = data.replace(rolename, element.enLabel);
|
||||
} else {
|
||||
data = data.replace(rolename, element.label);
|
||||
}
|
||||
});
|
||||
const deviceName = member.deviceName ? '-' + member.deviceName : '';
|
||||
const memberName = member.name ? '-' + member.name : '';
|
||||
return data + deviceName + memberName;
|
||||
},
|
||||
doCreate() {
|
||||
this.loading = true;
|
||||
acceptCoversitionInvite(this.group, this.conversationId).then(res=>{
|
||||
this.loading = false;
|
||||
this.dialogVisible = false;
|
||||
this.$emit('getCoversitionList');
|
||||
}).catch(error=>{
|
||||
this.$messageBox('接受邀请失败: ' + error.message);
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.dialogVisible = false;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.chatTooltip{
|
||||
position: absolute;
|
||||
width: 290px;
|
||||
left: 32%;
|
||||
top: 42%;
|
||||
z-index: 5;
|
||||
background: #fff;
|
||||
padding: 15px;
|
||||
box-shadow: #969090 0px 0px 10px;
|
||||
border-radius: 4px;
|
||||
line-height: 20px;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
.chatTooltipHeader{
|
||||
margin-top:10px;
|
||||
font-size:14px;
|
||||
}
|
||||
.chatTooltipBootom{
|
||||
margin-top:10px;
|
||||
text-align: center;
|
||||
margin-bottom:10px;
|
||||
}
|
||||
.chatTooltipAll{
|
||||
position:absolute;
|
||||
width:100%;
|
||||
height:100%;
|
||||
left:0;
|
||||
top:0;
|
||||
z-index: 10;
|
||||
}
|
||||
</style>
|
||||
@ -51,7 +51,16 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="chat-box-content">
|
||||
<chat-content ref="chatContent" :project="project" :is-answering="IsAnswering" :conversition-id="conversitionId" :message-list="messageList" />
|
||||
<chat-content
|
||||
ref="chatContent"
|
||||
:project="project"
|
||||
:is-answering="IsAnswering"
|
||||
:conversition-id="conversitionId"
|
||||
:conversition-member-list="conversitionMemberList"
|
||||
:message-list="messageList"
|
||||
:simulation-users="simulationUsers"
|
||||
@changeMessageList="changeMessageList"
|
||||
/>
|
||||
<div v-if="recordSending" class="chat_record_tip">
|
||||
<div id="record_progress_bar" :style="'width:'+100/60*seconds+'%'" />
|
||||
<div class="record_icon" />
|
||||
@ -268,7 +277,7 @@ export default {
|
||||
this.$refs.chatSetting.doClose();
|
||||
} else {
|
||||
this.firstClick && this.$nextTick(() => {
|
||||
this.userRole == 'AUDIENCE' && this.isAudienceInitData();
|
||||
this.isAudienceInitData();
|
||||
if (this.$refs.tree) {
|
||||
this.$refs.tree.filter(this.queryMember);
|
||||
}
|
||||
@ -303,7 +312,7 @@ export default {
|
||||
startConversition(this.group, this.memberIdList).then(resp => {
|
||||
this.conversitionId = resp.data.id;
|
||||
this.conversitionMemberList = resp.data.memberList;
|
||||
this.messageList = resp.data.messageList;
|
||||
this.messageList = [];
|
||||
this.userString = '';
|
||||
this.isConversitionCreator = true;
|
||||
this.$message.success('创建会话成功！');
|
||||
@ -470,7 +479,17 @@ export default {
|
||||
this.conversitionId = data.id;
|
||||
this.conversitionMemberList = data.memberList;
|
||||
this.isConversitionCreator = false;
|
||||
this.messageList = data.messageList;
|
||||
this.messageList = [];
|
||||
if (data.messageList && data.messageList) {
|
||||
data.messageList.forEach(message => {
|
||||
const member = this.memberData[message.memberId];
|
||||
message.src = `/audio/${message.audioPath}`;
|
||||
if (member) {
|
||||
message.self = this.$store.state.userId == member.userId;
|
||||
}
|
||||
this.messageList.push(message);
|
||||
});
|
||||
}
|
||||
},
|
||||
connectMember(val) {
|
||||
this.conversitionMemberList.forEach(member => {
|
||||
@ -479,19 +498,55 @@ export default {
|
||||
}
|
||||
});
|
||||
},
|
||||
sortByMessageTime(message1, message2) {
|
||||
const time1 = new Date(message1.time).valueOf();
|
||||
const time2 = new Date(message2.time).valueOf();
|
||||
return time1 - time2;
|
||||
},
|
||||
isAudienceInitData() {
|
||||
getAllConversition(this.group).then(resp => {
|
||||
if (resp.data && resp.data.length) {
|
||||
let messageList = [];
|
||||
const messageList = [];
|
||||
resp.data.forEach(conversation => {
|
||||
messageList = [...messageList, ...conversation.messageList];
|
||||
if (this.userRole == 'AUDIENCE') {
|
||||
(conversation.messageList || []).forEach(message => {
|
||||
const member = this.memberData[message.memberId];
|
||||
message.src = `/audio/${message.audioPath}`;
|
||||
message.members = conversation.memberList;
|
||||
if (member) {
|
||||
message.self = this.$store.state.userId == member.userId;
|
||||
}
|
||||
messageList.push(message);
|
||||
});
|
||||
} else {
|
||||
const user = this.simulationUsers[this.$store.state.user.id];
|
||||
!conversation.over && conversation.memberList.forEach(member =>{
|
||||
if (member.memberId == user.memberId) {
|
||||
this.conversitionMemberList = conversation.memberList;
|
||||
this.conversitionId = conversation.id;
|
||||
this.messageList = [];
|
||||
conversation.messageList.forEach(message => {
|
||||
const member = this.memberData[message.memberId];
|
||||
message.src = `/audio/${message.audioPath}`;
|
||||
if (member) {
|
||||
message.self = this.$store.state.userId == member.userId;
|
||||
}
|
||||
this.messageList.push(message);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
this.messageList = messageList.sort(this.sortByMessageTime);
|
||||
}
|
||||
});
|
||||
this.conversitionMemberList = [];
|
||||
this.$store.state.training.memberList.forEach(item =>{
|
||||
this.conversitionMemberList.push({memberId: item.id, connect:true });
|
||||
});
|
||||
},
|
||||
changeMessageList(data) {
|
||||
this.messageList.push(data);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -5,15 +5,15 @@
|
||||
<div :class="chatContent.self?'rightUser':'leftUser'">
|
||||
<div class="userHeader">
|
||||
<!-- chatContent.all&& -->
|
||||
<div v-if="!chatContent.self" class="userName">{{ covertName(chatContent.member,false) }}</div>
|
||||
<div :class="chatContent.self?'userChatTime textRight':'userChatTime'">{{ formatTime(chatContent.chatTime) }}</div>
|
||||
<div v-if="!chatContent.self" class="userName">{{ covertName(chatContent,false) }}</div>
|
||||
<div :class="chatContent.self?'userChatTime textRight':'userChatTime'">{{ chatContent.time }}</div>
|
||||
</div>
|
||||
<div class="userBubble" @click="playAudio(baseUrl+chatContent.src)">
|
||||
<div class="userMessage">
|
||||
<!-- chatContent.all&& -->
|
||||
<span v-if="!chatContent.member.robot&&chatContent.all">{{ covertName(chatContent.targetUser,true) }}</span>
|
||||
<span>{{ covertName(chatContent,true) }}</span>
|
||||
<span class="el-icon-video-play playicon" />
|
||||
<span class="messageText">{{ chatContent.message }}</span>
|
||||
<span class="messageText">{{ chatContent.content }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<audio id="audioPlay" style="display:none" />
|
||||
@ -39,6 +39,14 @@ export default {
|
||||
conversitionId: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
conversitionMemberList: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
simulationUsers: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
@ -54,10 +62,15 @@ export default {
|
||||
watch:{
|
||||
'$store.state.socket.conversationInfo':function (val, old) { // 仿真聊天
|
||||
const conversationInfo = this.$store.state.socket.conversationInfo;
|
||||
const member = this.$store.state.training.memberData[val.message.memberId];
|
||||
conversationInfo.message.src = `/audio/${conversationInfo.message.audioPath}`;
|
||||
if (member) {
|
||||
conversationInfo.message.self = this.$store.state.userId == member.userId;
|
||||
}
|
||||
if (this.conversitionId == val.id) {
|
||||
this.chatContentList.push(conversationInfo);
|
||||
if (simulationText.userId != this.$store.state.user.id) {
|
||||
this.currentAudioList.push(this.baseUrl + conversationInfo.src);
|
||||
this.$emit('changeMessageList', conversationInfo.message);
|
||||
if (member && member.userId != this.$store.state.user.id) {
|
||||
this.currentAudioList.push(this.baseUrl + '/audio/' + conversationInfo.message.audioPath);
|
||||
if (!this.isPlay) {
|
||||
this.isPlay = true;
|
||||
this.playAllAudio();
|
||||
@ -65,9 +78,9 @@ export default {
|
||||
}
|
||||
this.scrollTop();
|
||||
} else if (this.userRole === 'AUDIENCE') {
|
||||
this.messageList.push(conversationInfo.data);
|
||||
if (simulationText.userId != this.$store.state.user.id) {
|
||||
this.currentAudioList.push(this.baseUrl + conversationInfo.src);
|
||||
this.$emit('changeMessageList', conversationInfo.message);
|
||||
if (member && member.userId != this.$store.state.user.id) {
|
||||
this.currentAudioList.push(this.baseUrl + '/audio/' + conversationInfo.message.audioPath);
|
||||
if (!this.isPlay) {
|
||||
this.isPlay = true;
|
||||
this.playAllAudio();
|
||||
@ -109,9 +122,9 @@ export default {
|
||||
document.querySelector('.chatcontentIn').scrollTop = scrollTop;
|
||||
});
|
||||
},
|
||||
formatTime(time) {
|
||||
return /\d{2}:\d{2}:\d{2}/.exec(time)[0] || time;
|
||||
},
|
||||
// formatTime(time) {
|
||||
// return /\d{2}:\d{2}:\d{2}/.exec(time)[0] || time;
|
||||
// },
|
||||
playAllAudio() {
|
||||
this.playEachAudio(this.currentAudioList[this.currentAudioIndex]);
|
||||
},
|
||||
@ -132,41 +145,29 @@ export default {
|
||||
});
|
||||
},
|
||||
covertName(data, status) {
|
||||
if (data != 'All') {
|
||||
if (data instanceof Array) {
|
||||
let result = '';
|
||||
data.forEach(each=>{
|
||||
result += this.covertEachName(each, status);
|
||||
});
|
||||
return result;
|
||||
} else {
|
||||
return this.covertEachName(data, status);
|
||||
}
|
||||
if (status) {
|
||||
let result = '';
|
||||
const members = data.members || this.conversitionMemberList;
|
||||
(members || []).forEach(member => {
|
||||
if (member.memberId != data.memberId) {
|
||||
result += ('@' + this.covertEachName(member.memberId));
|
||||
}
|
||||
});
|
||||
return result;
|
||||
} else {
|
||||
return '@All';
|
||||
return this.covertEachName(data.memberId);
|
||||
}
|
||||
},
|
||||
covertEachName(data, status) {
|
||||
const roleTypeList = ConstConfig.ConstSelect.roleTypeNew;
|
||||
roleTypeList.forEach(function(element) {
|
||||
const rolename = element.value;
|
||||
if (Cookies.get('user_lang') == 'en') {
|
||||
if (rolename == data.role) {
|
||||
data.role = element.enLabel;
|
||||
}
|
||||
} else {
|
||||
if (rolename == data.role) {
|
||||
data.role = element.label;
|
||||
}
|
||||
}
|
||||
});
|
||||
const deviceName = data.deviceName ? '-' + data.deviceName : '';
|
||||
const memberName = data.name ? '-' + data.name : '';
|
||||
if (status) {
|
||||
return '@' + data.role + deviceName + memberName;
|
||||
} else {
|
||||
return data.role + deviceName + memberName;
|
||||
covertEachName(memberId) {
|
||||
let name = '';
|
||||
const member = this.$store.state.training.memberData[memberId];
|
||||
if (member && member.userId) {
|
||||
const user = this.simulationUsers[member.userId];
|
||||
name = member.label + '(' + user.nickName + ')';
|
||||
} else if (member) {
|
||||
name = member.label;
|
||||
}
|
||||
return name;
|
||||
},
|
||||
playAudio(audioUrl) {
|
||||
document.querySelector('#audioPlay').src = audioUrl;
|
||||
|
||||
@ -331,30 +331,30 @@ export default {
|
||||
item.scores.forEach(elem => {
|
||||
if (elem.prdType === '01') {
|
||||
this.showLocal = true;
|
||||
localExamSocreRadio = elem.examSocreRadio * 100 * 60 / 100 / item.scores.length;
|
||||
localLessonPassRate = elem.lessonPassRate * 100 * 30 / 100 / item.scores.length;
|
||||
localExamSocreRadio = elem.examSocreRadio * 60 / item.scores.length;
|
||||
localLessonPassRate = elem.lessonPassRate * 30 / item.scores.length;
|
||||
totolScore += localExamSocreRadio * 100;
|
||||
totolScore += localLessonPassRate * 100;
|
||||
} else if (elem.prdType === '02') {
|
||||
this.showCenter = true;
|
||||
centerExamSocreRadio = elem.examSocreRadio * 100 * 60 / 100 / item.scores.length;
|
||||
centerLessonPassRate = elem.lessonPassRate * 100 * 30 / 100 / item.scores.length;
|
||||
centerExamSocreRadio = elem.examSocreRadio * 60 / item.scores.length;
|
||||
centerLessonPassRate = elem.lessonPassRate * 30 / item.scores.length;
|
||||
totolScore += centerExamSocreRadio * 100;
|
||||
totolScore += centerLessonPassRate * 100;
|
||||
}
|
||||
});
|
||||
totolScore += item.attendance * 100 * 10 / 100 * 100;
|
||||
totolScore += item.attendance * 100 * 10;
|
||||
this.tableData.push(
|
||||
{
|
||||
index: index + 1,
|
||||
name: item.name,
|
||||
studentID: item.studentID,
|
||||
attendance: item.attendance * 100 * 10 / 100,
|
||||
localExamSocreRadio:localExamSocreRadio,
|
||||
localLessonPassRate: localLessonPassRate,
|
||||
centerExamSocreRadio: centerExamSocreRadio,
|
||||
centerLessonPassRate: centerLessonPassRate,
|
||||
totolScore: totolScore / 100
|
||||
attendance: Math.round(item.attendance * 10) / 10,
|
||||
localExamSocreRadio: Math.round(localExamSocreRadio * 10) / 10,
|
||||
localLessonPassRate: Math.round(localLessonPassRate * 10) / 10,
|
||||
centerExamSocreRadio: Math.round(centerExamSocreRadio * 10) / 10,
|
||||
centerLessonPassRate: Math.round(centerLessonPassRate * 10) / 10,
|
||||
totolScore: Math.round(totolScore) / 100
|
||||
});
|
||||
});
|
||||
}).catch(() =>{
|
||||
|
||||
Loading…
Reference in New Issue
Block a user