This commit is contained in:
fan 2020-05-28 09:07:41 +08:00
commit fe1fcdbcf3
9 changed files with 286 additions and 45 deletions

View File

@ -312,11 +312,11 @@ export function getSimulationConversationListNew(group) {
}
// 获取/创建仿真会话(新版地图)
export function getSimulationConversationIdNew(params, group) {
export function getSimulationConversationIdNew(data, group) {
return request({
url: `/simulation/${group}/wx/conversation`,
method: 'get',
params: params
method: 'post',
data
});
}

View File

@ -163,7 +163,7 @@ function handleSimulationInfo(state, data) {
targetOnline:data.targetMember ? data.targetMember.online : null,
targetName:data.targetMember ? data.targetMember : 'All',
targetRole:data.targetMember ? data.targetMember.role : null,
group: data.group,
all: data.all,
date: +new Date(`${myDate1} ${chatTime}`)
};
state.simulationText = params;

View File

@ -176,7 +176,9 @@ export default {
this.$messageBox('试卷还没被加载');
}
}).catch(()=>{});
}).catch(()=>{
this.$messageBox('试卷还没被加载');
});
} else {
getPracticalQuestion(this.$route.query.raceId).then((responese)=>{
if (responese.data) {
@ -187,6 +189,8 @@ export default {
} else {
this.$messageBox('试卷还没被加载');
}
}).catch(()=>{
this.$messageBox('试卷还没被加载');
});
}
}

View File

@ -11,8 +11,11 @@
<div class="minimality" @click="handleMinimality('min')">
<i class="el-icon-remove" />
</div>
<div v-show="currentCoversition.group==undefined?true:currentCoversition.group" class="showMembers" @click="handleMembers()">
<!-- <div v-show="currentCoversition.group==undefined?true:currentCoversition.group" class="showMembers" @click="handleMembers()">
<i class="el-icon-user-solid" />
</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" />
@ -42,6 +45,7 @@
</div>
</div>
<chat-setting ref="chatSetting" :form="form" @setSetting="setSetting" />
<chat-create-group ref="createGroup" :group="group" @addCoversition="addCoversition" />
</div>
</template>
<script>
@ -49,6 +53,7 @@ import ChatSetting from './chatSetting';
import ChatContent from './chatContent';
import ChatMemberList from './chatMemberList';
import ChatCoversitionList from './chatCoversitionList';
import ChatCreateGroup from './chatCreateGroup';
import RecordRTC from 'recordrtc';
import {uploadAudioFileNew} from '@/api/chat';
export default {
@ -57,12 +62,17 @@ export default {
ChatSetting,
ChatContent,
ChatMemberList,
ChatCoversitionList
ChatCoversitionList,
ChatCreateGroup
},
props: {
group: {
type: String,
required: true
},
userRole: {
type: String,
required: true
}
},
data() {
@ -81,6 +91,11 @@ export default {
headerTitle:'所有人'
};
},
computed:{
isShow() {
return this.userRole != 'ADMIN' && this.userRole != 'AUDIENCE';
}
},
watch: {
'$store.state.socket.simulationRoleList': function (val) {
if (val && val.length) {
@ -110,7 +125,7 @@ export default {
},
setCurrentCoversition(coversition) {
this.currentCoversition = coversition;
if (coversition.group) {
if (coversition.all) {
this.headerTitle = coversition.name;
}
if (this.recordSending) {
@ -123,7 +138,7 @@ export default {
},
addCoversition({data, headerTitle}) {
this.$refs.chatCoversitionList.addCoversition(data);
this.currentCoversition = {id:data.id, group:data.group};
this.currentCoversition = {id:data.id, all:data.all};
this.headerTitle = headerTitle;
},
//
@ -229,9 +244,12 @@ export default {
handleSetting() {
this.$refs.chatSetting.doShow();
},
handleMembers() {
this.$refs.chatSetting.doClose();
this.$refs.chatMemberList.doShow();
// handleMembers() {
// this.$refs.chatSetting.doClose();
// this.$refs.chatMemberList.doShow();
// },
handleCreateGroup() {
this.$refs.createGroup.doShow();
}
}
};
@ -285,6 +303,14 @@ export default {
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;

View File

@ -4,12 +4,12 @@
<div v-for="(chatContent,index) in chatContentList" :key="index" class="chatContentInClass">
<div :class="chatContent.self?'rightUser':'leftUser'">
<div class="userHeader">
<div v-if="chatContent.group&& !chatContent.self" class="userName">{{ covertName(chatContent.member) }}</div>
<div v-if="chatContent.all&& !chatContent.self" class="userName">{{ covertName(chatContent.member) }}</div>
<div :class="chatContent.self?'userChatTime textRight':'userChatTime'">{{ formatTime(chatContent.chatTime) }}</div>
</div>
<div class="userBubble" @click="playAudio('audio'+index)">
<div class="userMessage">
<span v-if="chatContent.group&&!chatContent.member.robot">@{{ covertName(chatContent.targetName) }}</span>
<span v-if="chatContent.all&&!chatContent.member.robot">@{{ covertName(chatContent.targetName) }}</span>
<span class="el-icon-video-play playicon" />
<span class="messageText">{{ chatContent.message }}</span>
<audio :id="'audio'+index" :src="baseUrl+chatContent.src" style="display:none" />
@ -59,7 +59,7 @@ export default {
}
this.scrollTop();
} else {
if (!simulationText.group) {
if (!simulationText.all) {
this.$emit('changeCoversition', simulationText);
// this.$emit('addCoversition', {data:simulationText, headerTitle:''});
this.chatContentList.push(simulationText);

View File

@ -32,9 +32,15 @@ export default {
if (resp.data) {
const data = resp.data;
data.map(coversition=>{
const objectCover = this.handleMemberName(coversition);
coversition.coverName = objectCover.coversitionName;
coversition.isOnline = objectCover.isOnline;
if (coversition.name) {
coversition.coverName = coversition.name;
coversition.isOnline = true;
} else {
const objectCover = this.handleMemberName(coversition);
coversition.coverName = objectCover.coversitionName;
coversition.isOnline = objectCover.isOnline;
}
return coversition;
});
this.coversitionList = data;
@ -49,15 +55,21 @@ export default {
const index = this.coversitionList.findIndex(item=>{ return item.id == data.id; });
if (index < 0) {
const objectCover = this.handleMemberName(data);
data.coverName = objectCover.coversitionName;
data.isOnline = objectCover.isOnline;
if (data.name) {
data.coverName = data.name;
data.isOnline = true;
} else {
data.coverName = objectCover.coversitionName;
data.isOnline = objectCover.isOnline;
}
this.coversitionList.push(data);
this.currentCoversition = data;
}
},
changeCoversition(coversition) {
this.$emit('setHeadTitle', !coversition.isOnline ? coversition.coverName + ' (离线)' : coversition.coverName);
this.currentCoversition = {id:coversition.id, group:coversition.group};
this.currentCoversition = {id:coversition.id, all:coversition.all};
this.$emit('setCurrentCoversition', coversition);
// this.$refs.chatContent.reloadData(this.currentCoversition);
},
@ -72,7 +84,7 @@ export default {
this.changeCoversition(coversition);
},
handleMemberName(conversition) {
if (conversition.group) {
if (conversition.all) {
return {coversitionName:conversition.name, isOnline:true};
} else {
let coversitionName = '';

View File

@ -0,0 +1,219 @@
<template>
<div v-show="dialogVisible" 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>
</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 = [];
}
});
}
},
doClose() {
this.checkList = [];
this.dialogVisible = false;
}
}
};
</script>
<style lang="scss" scoped>
.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;
}
// safariqq360
//
.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>

View File

@ -7,13 +7,12 @@
:key="member.id"
:class="member.online?'each-chat-member':'each-chat-member each-chat-member-outline'"
:style="member.userId === userId ?'color:red':''"
@click="createConversition(member)"
>{{ member.memberName }}</div>
</div>
</div>
</template>
<script>
import {getSimulationMembersNew, getSimulationConversationIdNew} from '@/api/chat';
import {getSimulationMembersNew} from '@/api/chat';
import ConstConfig from '@/scripts/ConstConfig';
import Cookies from 'js-cookie';
export default {
@ -26,7 +25,7 @@ export default {
},
data() {
return {
showMembers:false,
showMembers:true,
memberList:[]
};
},
@ -39,17 +38,6 @@ export default {
this.getSimulationMembers();
},
methods:{
createConversition(member) {
if (member.userId != this.$store.state.user.id && member.online) {
getSimulationConversationIdNew({ memberId: member.id }, this.group).then(resp => {
if (resp.data) {
const data = resp.data;
this.$emit('addCoversition', {data:data, headerTitle:member.memberName});
this.showMembers = false;
}
});
}
},
setMemberStatus(memberInfo) {
this.getSimulationMembers();
// memberInfo.forEach(member=>{
@ -84,14 +72,6 @@ export default {
});
this.memberList = lastData;
});
},
doShow() {
if (this.showMembers) {
this.showMembers = false;
} else {
this.showMembers = true;
this.getSimulationMembers();
}
}
}
};

View File

@ -1,6 +1,6 @@
<template>
<div>
<chat-box :group="group" />
<chat-box :group="group" :user-role="userRole" />
<div class="display-draft" :class="{'display-type-hb': $route.query.lineCode == '07' && $store.state.training.prdType=='01'}">
<el-button-group>
<el-button v-if="isProject && !dataError " type="primary" @click="setRelDevice">{{ $t('joinTraining.connectRealDevices') }}</el-button>