This commit is contained in:
zyy 2020-05-28 09:26:21 +08:00
commit 3f451e817c
9 changed files with 282 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({ return request({
url: `/simulation/${group}/wx/conversation`, url: `/simulation/${group}/wx/conversation`,
method: 'get', method: 'post',
params: params data
}); });
} }

View File

@ -407,8 +407,8 @@ export default class Train extends Group {
this.setHoldStatus(model.hold); this.setHoldStatus(model.hold);
this.setJumpStatus(model.jump); this.setJumpStatus(model.jump);
this.setSoonerOrLater(model.dt); this.setSoonerOrLater(model.dt);
this.setPlanRoutingTypeColor(model.planRoutingType);
this.setTrainTypeColor(model.type); this.setTrainTypeColor(model.type);
this.setPlanRoutingTypeColor(model.planRoutingType);
const style = this.style; const style = this.style;
if (style.Section.trainPosition.display) { if (style.Section.trainPosition.display) {
this.updateSection(object); this.updateSection(object);

View File

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

View File

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

View File

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

View File

@ -32,9 +32,15 @@ export default {
if (resp.data) { if (resp.data) {
const data = resp.data; const data = resp.data;
data.map(coversition=>{ data.map(coversition=>{
const objectCover = this.handleMemberName(coversition); if (coversition.name) {
coversition.coverName = objectCover.coversitionName; coversition.coverName = coversition.name;
coversition.isOnline = objectCover.isOnline; coversition.isOnline = true;
} else {
const objectCover = this.handleMemberName(coversition);
coversition.coverName = objectCover.coversitionName;
coversition.isOnline = objectCover.isOnline;
}
return coversition; return coversition;
}); });
this.coversitionList = data; this.coversitionList = data;
@ -49,15 +55,21 @@ export default {
const index = this.coversitionList.findIndex(item=>{ return item.id == data.id; }); const index = this.coversitionList.findIndex(item=>{ return item.id == data.id; });
if (index < 0) { if (index < 0) {
const objectCover = this.handleMemberName(data); const objectCover = this.handleMemberName(data);
data.coverName = objectCover.coversitionName; if (data.name) {
data.isOnline = objectCover.isOnline; data.coverName = data.name;
data.isOnline = true;
} else {
data.coverName = objectCover.coversitionName;
data.isOnline = objectCover.isOnline;
}
this.coversitionList.push(data); this.coversitionList.push(data);
this.currentCoversition = data; this.currentCoversition = data;
} }
}, },
changeCoversition(coversition) { changeCoversition(coversition) {
this.$emit('setHeadTitle', !coversition.isOnline ? coversition.coverName + ' (离线)' : coversition.coverName); 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.$emit('setCurrentCoversition', coversition);
// this.$refs.chatContent.reloadData(this.currentCoversition); // this.$refs.chatContent.reloadData(this.currentCoversition);
}, },
@ -72,7 +84,7 @@ export default {
this.changeCoversition(coversition); this.changeCoversition(coversition);
}, },
handleMemberName(conversition) { handleMemberName(conversition) {
if (conversition.group) { if (conversition.all) {
return {coversitionName:conversition.name, isOnline:true}; return {coversitionName:conversition.name, isOnline:true};
} else { } else {
let coversitionName = ''; 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" :key="member.id"
:class="member.online?'each-chat-member':'each-chat-member each-chat-member-outline'" :class="member.online?'each-chat-member':'each-chat-member each-chat-member-outline'"
:style="member.userId === userId ?'color:red':''" :style="member.userId === userId ?'color:red':''"
@click="createConversition(member)"
>{{ member.memberName }}</div> >{{ member.memberName }}</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import {getSimulationMembersNew, getSimulationConversationIdNew} from '@/api/chat'; import {getSimulationMembersNew} from '@/api/chat';
import ConstConfig from '@/scripts/ConstConfig'; import ConstConfig from '@/scripts/ConstConfig';
import Cookies from 'js-cookie'; import Cookies from 'js-cookie';
export default { export default {
@ -26,7 +25,7 @@ export default {
}, },
data() { data() {
return { return {
showMembers:false, showMembers:true,
memberList:[] memberList:[]
}; };
}, },
@ -39,17 +38,6 @@ export default {
this.getSimulationMembers(); this.getSimulationMembers();
}, },
methods:{ 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) { setMemberStatus(memberInfo) {
this.getSimulationMembers(); this.getSimulationMembers();
// memberInfo.forEach(member=>{ // memberInfo.forEach(member=>{
@ -84,14 +72,6 @@ export default {
}); });
this.memberList = lastData; this.memberList = lastData;
}); });
},
doShow() {
if (this.showMembers) {
this.showMembers = false;
} else {
this.showMembers = true;
this.getSimulationMembers();
}
} }
} }
}; };

View File

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