joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

修改代码

Browse Source
This commit is contained in:
ival 2019-11-13 11:10:15 +08:00
parent 559a765d27
commit 0c3a91319d
7 changed files with 1227 additions and 2388 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1128
src/jmap/config/skinCode/batong_01.js
View File

File diff suppressed because it is too large Load Diff

1084
src/jmap/config/skinCode/chengdu_04.js
View File

File diff suppressed because it is too large Load Diff

10
src/views/display/demon/runPlanView.vue
View File

@ -31,7 +31,7 @@ export default {
data() {
return {
dialogShow: false,
loading: false,
loading: true,
runPlanId: 'run-plan-view',
myChart: null,
PlanConvert: {},
@ -163,16 +163,16 @@ export default {
}
},
watch: {
'$store.state.runPlan.planLoadedCount': function () {
'$store.state.runPlan.planLoadedCount': async function () {
try {
this.loadChartPage();
await this.loadChartPage();
if (this.dialogShow) {
this.loadInitData(this.series);
await this.loadInitData(this.series);
}
} catch (e) {
console.error(e);
} finally {
this.loading = true;
this.loading = false;
}
},
'$store.state.runPlan.planUpdateCount': function () {

1
src/views/display/menuLesson.vue
View File

@ -29,7 +29,6 @@ import { Notification } from 'element-ui';
import { startTraining, endTraining } from '@/api/jmap/training';
import { trainingNotify } from '@/api/simulation';
import { TrainingMode } from '@/scripts/ConstDic';
import { exitFullscreen } from '@/utils/screen';
import { timeFormat } from '@/utils/date';
import { UrlConfig } from '@/router/index';

490
src/views/jointTraining/chartView.vue
View File

@ -1,490 +0,0 @@
<template>
<div class="box">
<div class="relation" :style="{ width: widthLeft +'px' }">
<drap-left :width-left="widthLeft" :max="300" :min="180" :width="6" :is-save="false" @drapWidth="drapWidth" />
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: '290px' }">
<el-tree
ref="personTree"
:data="treeData"
:props="defaultProps"
node-key="nodeId"
:default-expanded-keys="keyIdList"
@node-click="chatClick"
@node-contextmenu="showContextMenu"
/>
</el-scrollbar>
</div>
<operate-menu
ref="operateMenu"
:group="group"
:point="point"
:selected="selected"
:driver-list="driverList"
:driver-map-dict="driverMapDict"
/>
</div>
</template>
<script>
import DrapLeft from '@/views/components/drapLeft/index';
import OperateMenu from './menuDraft/operateMenu';
import ModelType from '@/jmap/constant/deviceType';
import { DeviceMenu } from '@/scripts/ConstDic';
import { getJointTrainRoomUserList, getUserRoles } from '@/api/chat';
import { EventBus } from '@/scripts/event-bus';
export default {
name: 'ChartView',
components: {
DrapLeft,
OperateMenu
},
props: {
group: {
type: String,
required: true
},
stationList: {
type: Array,
default() {
return [];
}
}
},
data() {
return {
widthLeft: 180,
userId: '',
code: '',
label: '',
selected: {},
message: {},
data: {}, // 数据内容
userRole: '', // 个人权限
userList: [], // 观众列表
driverList: [], // 司机列表
treeData: [ // 角色列表 顺序定死
{
children: [],
name: this.$t('joinTraining.admin'),
nodeId: 'admin01',
type: 'select',
show: false
},
{
children: [],
name: this.$t('joinTraining.teacher'),
nodeId: 'admin02',
type: 'select',
show: false
},
{
children: [],
name: this.$t('joinTraining.dispatcher'),
nodeId: 'admin03',
type: 'select',
show: false
},
{
children: [],
name: this.$t('joinTraining.stationAttendant'),
nodeId: 'admin04',
type: 'select',
show: false
},
{
children: [],
name: this.$t('joinTraining.driver'),
nodeId: 'admin05',
type: 'select',
show: false
},
{
children: [],
name: this.$t('joinTraining.universalAccount'),
nodeId: 'admin06',
type: 'select',
show: false
}
],
defaultProps: {
children: 'children',
label: this.formatName
},
driverMapDict: {},
keyIdList: [],
messageList: [],
point: {
x: 0,
y: 0
}
};
},
watch: {
'stationList': async function (val) { // 执行一次 以后不会有变化
if (val) {
await this.getUserList();
this.initMenu(val);
}
},
'$store.state.socket.roleList': function (val) { // 仿真聊天
val.forEach(item => {
this.treeData[4].children.forEach(elem => {
if (elem.driver && item.userRole == 'Driver' && elem.driver.id == item.id) {
this.selected = elem;
}
});
});
},
'$store.state.training.simulationGroupCount': async function () {
await this.loadRunData();
}
},
created() {
EventBus.$on('trainView', this.updateTrainList);
},
beforeDestroy() {
EventBus.$off('trainView');
},
methods: {
async loadRunData() {
await this.getUserList();
EventBus.$on('trainView', this.updateTrainList);
this.getUserRole();
},
formatName(data, node) {
let name = data.name ? data.name : data.groupNumber;
if (data.driver) {
name = `${name}(${data.driver.nickName})`;
}
return name;
},
drapWidth(width) {
this.widthLeft = Number(width);
},
// 获取设备集中站
initMenu(list) {
this.treeData[3].children = [];
list.forEach(station => {
if (station.centralized) {
const param = {
name: station.name,
code: station.code,
id: '',
nodeId: station.code,
children: null,
show: false,
index: 3
};
this.treeData[3].children.push(param);
}
});
this.userList.forEach(item => {
if (item.userRole == 'Attendant') {
this.treeData[3].children.forEach(nor => {
if (nor.code == item.stationCode) {
nor.name = `${nor.name}【${item.nickName}】`;
nor.id = item.id;
nor.nodeId = item.id;
}
});
}
});
},
// 获取人成员列表
async getUserList() {
const rest = await getJointTrainRoomUserList(this.group);
this.userList = rest.data;
this.treeData[0].children = [];
this.treeData[1].children = [];
this.treeData[2].children = [];
this.treeData[5].children = [];
this.driverMapDict = {};
this.driverList = [];
this.userList.forEach(item => {
const param = {
name: item.nickName,
id: item.id,
nodeId: item.id,
children: null,
show: false,
index: ''
};
if (item.userRole == 'Admin') {
param.index = 0;
this.treeData[0].children.push(param);
} else if (item.userRole == 'Instructor') {
param.index = 1;
this.treeData[1].children.push(param);
} else if (item.userRole == 'Dispatcher') {
param.index = 2;
this.treeData[2].children.push(param);
} else if (item.userRole == 'Driver') {
param.index = 4;
this.driverList.push(param);
} else if (item.userRole == 'Repair') {
param.index = 5;
this.treeData[5].children.push(param);
}
});
this.updateDriverInfo(this.userList);
},
// 点击左侧人员并选择
async chatClick(obj) {
if (obj.type && obj.type == 'select') {
obj.show = false;
this.$emit('showChatNone');
} else {
if (obj.show) {
let data = {};
this.messageList.forEach((item, index) => {
if (item.member.id == obj.id) {
data = item;
this.messageList.splice(index, 1);
}
});
this.$emit('showChatSpeak', data);
this.treeData[obj.index].show = false;
obj.show = false;
} else {
this.updateConversationId(obj);
}
}
},
// 获取个人权限
async getUserRole() {
const res = await getUserRoles(this.group);
this.userRole = res.data.userRole;
if (this.userRole != 'Audience' && this.userRole != '') {
await this.getUserList();
this.initMenu(this.stationList);
}
},
// 更新聊天的回话Id
updateConversationId(obj) {
let id = obj.id;
const code = obj.code || obj._code;
if (obj.driver) {
id = obj.driver.id;
}
if (code || id) {
this.$emit('showChat', { code: code, id: id });
}
},
// 更新列车列表
updateTrainList() {
const list = this.$store.getters['training/viewTrainList']();
if (this.treeData[4].children.length != list.length) {
this.treeData[4].children = [];
if (list && list.length) {
list.sort((a, b) => {
return Number(a.groupNumber) - Number(b.groupNumber);
});
list.forEach(item => {
item.driver = this.driverMapDict[item._code];
item.nodeId = item._code;
item.show = false;
item.index = 4;
this.treeData[4].children.push(item);
});
this.$refs.personTree.updateKeyChildren('admin05', this.treeData[4].children.slice());
}
}
},
// 更新司机信息
updateDriverInfo(list) {
this.updateConversationId(this.selected);
list.forEach(item => {
if (item.userRole == 'Driver') {
if (item.trainCode) {
// 添加司机
this.driverMapDict[item.trainCode] = item;
} else {
// 取消司机
Object.keys(this.driverMapDict).forEach(key => {
const oDriver = this.driverMapDict[key];
const nDriver = this.selected.driver;
if (oDriver && nDriver && oDriver.id == nDriver.id) {
delete this.driverMapDict[key];
}
});
}
}
});
this.treeData[4].children = [];
this.updateTrainList();
},
// 右键显示设置司机菜单
showContextMenu(e, obj, node, vueElem) {
if (this.$store.state.map.roles == 'Admin') {
e.preventDefault();
this.point = {
x: e.clientX,
y: e.clientY
};
if (obj._type == ModelType.Train) {
this.selected = obj;
this.$store.dispatch('menuOperation/setPopMenu', { position: this.point, menu: DeviceMenu.SetDriver });
}
}
},
select(id) {
this.keyIdList = [];
this.$refs.personTree.setCurrentKey(null);
if (id) {
this.keyIdList = [id];
this.$refs.personTree.setCurrentKey(id);
const node = this.$refs.personTree.getCurrentNode();
if (node) {
node.show = false;
this.treeData[node.index].show = false;
}
}
},
hintInfo(data) {
switch (data.member.role) {
case '01':
this.treeData[0].show = true;
this.treeData[0].children.forEach(nor => {
if (nor.id == data.member.id) {
nor.show = true;
}
});
break;
case '02':
this.treeData[1].show = true;
this.treeData[1].children.forEach(nor => {
if (nor.id == data.member.id) {
nor.show = true;
}
});
break;
case '03':
this.treeData[2].show = true;
this.treeData[2].children.forEach(nor => {
if (nor.id == data.member.id) {
nor.show = true;
}
});
break;
case '04':
this.treeData[3].show = true;
this.treeData[3].children.forEach(nor => {
if (nor.id == data.member.id) {
nor.show = true;
}
});
break;
case '05':
this.treeData[4].show = true;
break;
case '06':
this.treeData[4].show = true;
this.treeData[4].children.forEach(nor => {
if (nor.driver && nor.driver.id == data.member.id) {
nor.show = true;
}
});
break;
case '07':
this.treeData[5].show = true;
this.treeData[5].children.forEach(nor => {
if (nor.id == data.member.id) {
nor.show = true;
}
});
break;
}
this.messageList.push(data);
}
}
};
</script>
<style>
.el-tree {
overflow-x: hidden;
}
</style>
<style rel="stylesheet/scss" lang="scss" scoped>
/deep/ {
.el-tabs__nav {
margin-left: 18px;
}
.el-tree-node.is-current>.el-tree-node__content {
background-color: #b9f1f1 !important;
}
.el-tree-node:focus>.el-tree-node__content {
background-color: none;
}
.item-point {
.el-badge__content {
right: -5px;
top: 11px;
}
}
}
#nav {
padding: 30px;
text-align: center;
}
#nav a {
font-weight: bold;
color: #2c3e50;
}
#nav a.router-link-exact-active {
color: #42b983;
}
::-webkit-scrollbar {
width: 3px;
}
::-webkit-scrollbar-thumb {
background-color: #c7c7c7;
}
.box {
display: flex;
justify-content: center;
z-index: 10;
position: relative;
}
.relation {
width: 180px;
float: left;
height: 300px;
.personnel {
width: 100%;
font-size: 16px;
line-height: 20px;
padding-left: 5px;
cursor: pointer;
padding: 3px 8px;
&:hover {
background-color: #e6e6e6;
}
}
}
</style>

670
src/views/jointTraining/chatWindow.vue
View File

@ -1,670 +0,0 @@
<template>
<div class="box">
<!-- 点击播放audio -->
<audio ref="audio" style="display: none;" />
<!-- 单人自动播放 audio -->
<audio ref="audioAuto" style="display: none;" />
<div v-show="!chatShow" class="hello content">
<div ref="content" class="chatContent">
<ul class="newsList">
<div v-for="(nor, index) in textList" :key="index" style="margin-top: 5px;">
<li v-if="nor.self" style="position: relative">
<div class="userName" style="position: absolute; right: 4px; top: 4px; font-size: 14px;">
{{ `${ChatFomat.formatTime(nor.chatTime)} ${ChatFomat.formatName(nor.member)}` }}
</div>
<div class="news">
<span>{{ ChatFomat.formatSay(nor) }}</span>
</div>
<div v-if="nor.voice" class="yuyin" @click="playAudio(nor)">
<i class="el-icon-caret-right" />
</div>
</li>
<li v-if="nor.other" style="position: relative">
<div class="userName" style="position: absolute; left: 12px; top: 4px; font-size: 14px;">
{{ `${ChatFomat.formatName(nor.member)} ${ChatFomat.formatTime(nor.chatTime)}` }}
</div>
<div class="answers">
<span>{{ ChatFomat.formatSay(nor) }}</span>
</div>
<div v-if="nor.voice" class="yuyin1" @click="playAudio(nor)">
<i class="el-icon-caret-right" />
</div>
</li>
<li v-if="nor.join" style="font-size: 12px; text-align: center;">{{ nor.simulationTip }}</li>
</div>
</ul>
</div>
<div class="footChat">
<div class="inputBox">
<div class="sendBtn zIndex1" :style="{background: background, color: color}" :disabled="true" @mousedown="startRecording()" @mouseup="stopRecording()">{{ speak }}</div>
<div v-show="sending" class="sendBtn zIndex2" :style="{background: background}">{{ $t('joinTraining.sending') }}</div>
</div>
<div v-if="isShowAuto" class="switch-box">
<span style="font-size: 12px;">{{ $t('joinTraining.autoplay') }}</span>
<el-switch v-model="isAutoPlay" active-color="#13ce66" inactive-color="#d6d6d6" />
</div>
</div>
</div>
<!-- 待播放列表 audio list-->
<audio ref="autoPlay" src="" />
<!-- 遮罩空白 -->
<div v-show="chatShow" class="hello content" />
</div>
</template>
<script>
import HZRecorder from '@/utils/HZRecorder';
import ChatFomat from '@/utils/chatFomat';
import { postDataBd, getConversation } from '@/api/chat';
import { displayTopic, clearSubscribe } from '@/utils/stomp';
import { sendCommand } from '@/api/jmap/training';
import { EventBus } from '@/scripts/event-bus';
export default {
name: 'ChartWindow',
props: {
group: {
type: String,
required: true
},
chatShow: {
type: Boolean
},
speaking: {
type: Boolean
},
isShowAuto: {
type: Boolean
}
},
data() {
return {
userId: '',
topic: '/user/topic/simulation/chat',
recorders: null,
textList: [],
background: '#edf2fc',
color: '#c6c6c6',
label: '',
message: {},
sending: false,
speak: this.$t('joinTraining.holdAndTalk'),
targetId: '',
conversationId: '',
allConversationId: '', // 所有人会话id
isAutoPlay: false, // 是否自动播放
audioList: [],
playIndex: 0,
playAudioSet: null,
speakOf: false, // 说话中 true 不说话状态 false
isAllSpeakOf: false, // 群聊标志,
ChatFomat: ChatFomat
};
},
watch: {
speaking: function (val) {
if (!val) {
this.background = '#edf2fc';
this.color = '#c6c6c6';
} else {
this.background = '';
this.color = '';
}
},
conversationId(val) {
this.refreshList(val);
},
'$store.state.socket.simulationText': function (val) { // 仿真聊天
if (val.conversationId) {
this.handleSimulationText(val);
}
},
'$store.state.socket.jointRoomInfo': function (val) { // 综合演练房间信息
if (val.creatorId) {
this.handleRoomInfo(val);
}
},
'$store.state.socket.chatContentSimuList': function (val) { // 进入、离开仿真信息
if (val.id) {
this.handelTextList(val);
}
}
},
async mounted() {
this.userId = this.$store.state.user.id;
if (this.speaking) {
this.background = '';
this.color = '';
}
this.allConversationId = await this.getChathistory('', '');
EventBus.$on('chatSubscribeStop', () => {
this.clearSubscribe();
});
this.playSetInterval();
},
beforeDestroy() {
EventBus.$off('chatSubscribeStop');
clearInterval(this.playAudioSet);
this.playAudioSet = null;
},
methods: {
clearSubscribe() {
clearSubscribe(displayTopic);
},
// 人员状态 设置到对话框内容
handelTextList(params) {
if (params.inRoom) {
if (this.conversationId) {
const paramState = {
key: this.conversationIde,
value: params
};
this.$store.dispatch('socket/setMessage', paramState);
}
if (params.session == 'session') {
this.textList.push(params);
}
this.$nextTick(() => {
this.$refs.content.scrollTop = this.$refs.content.scrollHeight;
});
}
},
// 语音录制开始
startRecording() {
if (this.speaking && this.conversationId) {
this.background = '#ccc';
this.speak = this.$t('joinTraining.recording');
this.sending = false;
this.speakOf = true;
HZRecorder.init.get(rec => {
if (typeof rec == 'object') {
this.recorders = rec;
this.recorders.start();
} else {
this.background = '';
this.speak = this.$t('joinTraining.holdAndTalk');
}
});
}
},
// 停止录制
async stopRecording() {
if (this.speaking && this.conversationId) {
this.background = '';
this.speak = this.$t('joinTraining.holdAndTalk');
this.sending = true;
if (this.recorders) {
this.recorders.stop();
var fd = new FormData();
fd.append('file', this.recorders.getBlob());
const param = {
file: fd,
group: this.group,
conversationId: this.conversationId
};
postDataBd(param).catch(error => {
this.sending = false;
this.speakOf = false;
const message = JSON.parse(error.message);
if (message.err_no == 3301) {
this.$message({
showClose: true,
message: this.$t('error.problemWithAudioQuality'),
type: 'error'
});
} else if (message.err_no == 3308) {
this.$message({
showClose: true,
message: this.$t('error.audioIsTooLong'),
type: 'error'
});
} else if (message.err_no == 3314) {
this.$message({
showClose: true,
message: this.$t('error.audioIsTooShort'),
type: 'error'
});
} else {
this.$message({
showClose: true,
message: this.$t('error.networkProblem'),
type: 'error'
});
}
});
this.recorders = null;
} else {
this.sending = false;
this.speakOf = false;
this.$message({
showClose: true,
message: this.$t('error.audioIsTooShort'),
type: 'error'
});
}
}
},
playAudio(nor) {
this.$refs.audio.src = nor.src;
this.$refs.audio.play();
},
handleRoomInfo(data) {
if (data.state == '03') { // 退出房间
this.$router.push({ path: `/` });
this.clearSubscribe();
} else if (data.state == '01') { // 进入准备中
const query = { group: this.group };
this.$router.push({ path: `/trainroom`, query: query });
this.clearSubscribe();
}
this.$store.dispatch('socket/setJointRoomInfo'); // 清空房间信息
},
// 获取历史记录list
async getChathistory(code, userId) {
this.targetId = userId;
this.conversationId = '';
this.textList = [];
this.$store.dispatch('socket/setSimulationTextList');
try {
// 获取历史记录
const params = {
code: code || '',
userId: this.targetId || '',
group: this.group
};
const res = await getConversation(params);
this.conversationId = res.data.id;
this.isAllSpeakOf = false;
if (res.data.group) {
this.isAllSpeakOf = true;
}
// 临时历史记录表
const list = this.$store.state.socket.message[this.conversationId];
if (list && list.length) {
this.textList = list.slice();
this.textList.sort((a, b) => {
return a.date - b.date;
});
this.$nextTick(() => {
if (this.$refs.content) {
this.$refs.content.scrollTop = this.$refs.content.scrollHeight;
}
});
}
return res.data;
} catch (error) {
this.conversationId = '';
}
},
handleSimulationText(data) {
if (data.conversationId == this.conversationId && data.date) {
this.textList.push(data);
this.textList.sort((a, b) => {
return a.date - b.date;
});
}
if (data.conversationId && data.date) { // 保存历史记录表
const paramState = {
key: data.conversationId,
value: data
};
this.$store.dispatch('socket/setMessage', paramState);
}
// 对用户说话 有返回 判断
if (data.targetMember && data.targetMember.userId && data.member && data.member.userId == this.userId && !data.group && this.speakOf && !this.$refs.audioAuto.currentTime) {
// 判断自身对用户说话收到自己信息的时候
this.speakOf = false;
}
// 当在所有人是自动跳转 说完话 有自己信息返回时 可自动跳转
if (this.isAllSpeakOf && data.member && data.member.userId == this.userId) {
this.speakOf = false;
}
if (data.targetMember && data.targetMember.userId == this.userId && data.member && data.member.userId == this.targetId && !data.group && this.speakOf && !this.$refs.audioAuto.currentTime) {
// 判断自己与用户对话 且 用户先返回内容时
this.speakOf = false;
}
if (data.targetMember && data.targetMember.userId == this.userId && !data.group && data.id && !this.speakOf) {
// 他人定位到对自己说话判断
this.$emit('handleChatShow', data);
} else if (data.targetMember && data.targetMember.userId == this.userId && !data.group && data.id && this.speakOf) {
// 他人对自己说话 并且 自己在语音中 判断
this.$emit('handleChatList', data);
}
let operate = {};
if (data.changeVO && data.changeVO.code) {
operate = {
val: data.changeVO.val || '',
code: data.changeVO.code,
type: data.changeVO.type,
operation: data.changeVO.operation
};
}
this.sending = false;
this.$store.dispatch('socket/setSimulationTextList');
this.$nextTick(() => {
this.$refs.content.scrollTop = this.$refs.content.scrollHeight;
if (data.id != this.userId && data.conversationId == this.conversationId && !data.group && data.targetMember && data.targetMember.userId == this.userId) {
// 自己与机器对话机器返回 并播放且单对单语音
this.$refs.audioAuto.src = '';
this.$refs.audioAuto.src = data.src;
this.$refs.audioAuto.load();
this.$refs.audioAuto.play();
const that = this;
this.$refs.audioAuto.onended = function () {
that.speakOf = false;
that.$refs.audioAuto.currentTime = null;
if (data.changeVO && data.changeVO.code) {
sendCommand(that.$route.query.group, operate);
}
};
}
if (this.isAutoPlay && data.id != this.userId && data.group && this.isShowAuto &&
(!data.targetMember || data.targetMember.userId != this.userId)) {
this.autoPlay(data.src, data.value);
}
});
},
refreshList(conversationId) {
this.textList = [];
this.conversationId = conversationId;
const list = this.$store.state.socket.message[conversationId];
if (list && list.length) {
this.textList = list.slice();
this.textList.sort((a, b) => {
return a.date - b.date;
});
}
},
// 未读消息并说话
handleTextList(conversationId) {
this.refreshList(conversationId);
this.$nextTick(() => {
this.$refs.content.scrollTop = this.$refs.content.scrollHeight;
if (this.textList.length && this.textList[this.textList.length - 1].userId != this.userId) {
this.$refs.audioAuto.src = this.textList[this.textList.length - 1].src;
this.$refs.audioAuto.play();
}
});
},
autoPlay(src, name) {
const param = {
src: src,
name: name
};
this.audioList.push(param);
},
playSetInterval() {
const that = this;
this.playAudioSet = setInterval(() => {
if (this.isAutoPlay && this.audioList && this.audioList.length && !this.$refs.autoPlay.currentTime) {
const data = this.audioList.shift();
if (data) {
this.$refs.autoPlay.src = data.src;
this.$refs.autoPlay.play();
}
}
}, 2000);
this.$nextTick(() => {
if (this.$refs.autoPlay) {
this.$refs.autoPlay.onended = function () {
const data = that.audioList.shift();
if (data) {
if (that.isAutoPlay) {
that.$refs.autoPlay.src = data.src;
that.$refs.autoPlay.play();
} else {
that.audioList = [];
that.$refs.autoPlay.currentTime = null;
}
} else {
that.$refs.autoPlay.currentTime = null;
}
};
}
});
},
clearPlay() {
this.conversationId = ''; // 会话id
this.audioList = []; // 播放列表
}
}
};
</script>
<style>
.el-tree {
overflow-x: hidden;
}
.el-tree-node.is-current>.el-tree-node__content {
background-color: #e4e3e3 !important;
}
</style>
<style rel="stylesheet/scss" lang="scss" scoped>
/deep/ {
.el-tabs__nav {
margin-left: 18px;
}
}
#nav {
padding: 30px;
text-align: center;
}
#nav a {
font-weight: bold;
color: #2c3e50;
}
#nav a.router-link-exact-active {
color: #42b983;
}
::-webkit-scrollbar {
width: 3px;
}
::-webkit-scrollbar-thumb {
background-color: #c7c7c7;
}
.box {
/* display: flex; */
/* justify-content: center; */
z-index: 10;
}
.audio-boxs {
display: none;
}
.content {
-webkit-box-orient: vertical;
height: 300px;
width: 100%;
border: 1px solid #ccc;
border-top: none;
.chatContent {
-webkit-box-flex: 1;
overflow-y: scroll;
padding-right: 8px;
height: 268px;
.newsList {
list-style: none;
margin: 0;
padding: 10px 0;
li {
width: 100%;
overflow: hidden;
padding-top: 8px;
}
}
}
.yuyin {
width: 20px;
height: 20px;
cursor: pointer;
margin-top: 21px;
margin-right: 3px;
float: right;
border: 1px solid #ccc;
border-radius: 50%;
}
.yuyin1 {
width: 20px;
height: 20px;
cursor: pointer;
margin-top: 21px;
margin-left: 3px;
float: left;
border: 1px solid #ccc;
border-radius: 50%;
}
.nesHead {
width: 44px;
height: 44px;
border-radius: 50%;
margin-left: 15px;
float: right;
display: flex;
align-items: center;
}
.news {
max-width: 55%;
width: auto;
height: auto;
background: #2683f5;
padding: 6px 10px;
margin-top: 15px;
line-height: 20px;
font-size: 14px;
border-radius: 4px;
position: relative;
float: right;
color: #fff;
text-align: left;
.jiao {
position: absolute;
right: -8px;
top: 10px;
}
}
.nesHead img {
width: 44px;
}
.answerHead img {
width: 44px;
}
.answerHead {
width: 44px;
height: 44px;
border-radius: 50%;
margin-left: 15px;
float: left;
display: flex;
align-items: center;
}
.answers {
max-width: 55%;
width: auto;
height: auto;
background: #eee;
padding: 5px 10px;
margin-top: 15px;
line-height: 22px;
font-size: 14px;
border-radius: 5px;
margin-left: 10px;
position: relative;
float: left;
text-align: left;
.jiao {
position: absolute;
left: -8px;
top: 10px;
}
}
}
.footChat {
width: 100%;
height: 30px;
border-top: 1px solid #ccc;
position: relative;
.inputBox {
position: relative;
height: 30px;
width: 100%;
float: left;
textarea {
width: 99%;
height: 75px;
border: none;
outline: none;
resize: none;
font-size: 16px;
}
}
.switch-box {
position: absolute;
right: 10px;
top: 0;
width: 100px;
height: 30px;
line-height: 30px;
z-index: 3;
}
.sendBtn {
background: #fff;
width: 100%;
height: 30px;
line-height: 30px;
text-align: center;
/* background: #0188fb; */
border: 0;
/* position: absolute;
bottom: 10px;
right: 10px; */
color: #000;
cursor: pointer;
font-size: 12px;
position: absolute;
left: 0;
top: 0;
}
.zIndex1 {
z-index: 1;
}
.zIndex2 {
z-index: 2;
background: #ccc;
}
}
</style>

232
src/views/jointTraining/menuDraft/operateMenu.vue
View File

@ -12,124 +12,124 @@ import { putUserRoles } from '@/api/chat';
import { DeviceMenu } from '@/scripts/ConstDic';
export default {
name: 'OperateMenu',
components: {
PopMenu,
ChooseRole
},
props: {
group: {
type: String,
required: true
},
point: {
type: Object,
required: true
},
selected: {
type: Object,
required: true
},
driverList: {
type: Array,
required: true
},
driverMapDict: {
type: Object,
required: true
}
},
data() {
return {
menuShow: false,
menu: [
{
label: this.$t('joinTraining.chooseDriver'),
handler: this.chooseDriver
},
{
label: this.$t('joinTraining.cancelDriver'),
handler: this.cancelDriver
}
]
};
},
watch: {
'$store.state.menuOperation.menuCount': function (val) {
if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.SetDriver)) {
this.doShow(this.$store.state.menuOperation.menuPosition);
} else {
this.doClose();
}
}
},
mounted() {
this.closeEvent();
},
methods: {
closeEvent() {
const self = this;
window.onclick = function (e) {
self.doClose();
};
},
doShow(point) {
this.closeEvent();
if (this.$refs && this.$refs.popMenu) {
this.$refs.popMenu.resetShowPosition(point);
}
this.menuShow = true;
},
doClose() {
if (this.$refs && this.$refs.popMenu) {
this.$refs.popMenu.close();
}
this.menuShow = false;
},
chooseDriver() {
const arrs = Object.values(this.driverMapDict);
const list = this.driverList.filter(elem => {
let ret = true;
arrs.forEach(item => {
if (item.id == elem.id) {
ret = false;
}
});
return ret;
});
name: 'OperateMenu',
components: {
PopMenu,
ChooseRole
},
props: {
group: {
type: String,
required: true
},
point: {
type: Object,
required: true
},
selected: {
type: Object,
required: true
},
driverList: {
type: Array,
required: true
},
driverMapDict: {
type: Object,
required: true
}
},
data() {
return {
menuShow: false,
menu: [
{
label: this.$t('joinTraining.chooseDriver'),
handler: this.chooseDriver
},
{
label: this.$t('joinTraining.cancelDriver'),
handler: this.cancelDriver
}
]
};
},
watch: {
'$store.state.menuOperation.menuCount': function (val) {
if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.SetDriver)) {
this.doShow(this.$store.state.menuOperation.menuPosition);
} else {
this.doClose();
}
}
},
mounted() {
this.closeEvent();
},
methods: {
closeEvent() {
const self = this;
window.onclick = function (e) {
self.doClose();
};
},
doShow(point) {
this.closeEvent();
if (this.$refs && this.$refs.popMenu) {
this.$refs.popMenu.resetShowPosition(point);
}
this.menuShow = true;
},
doClose() {
if (this.$refs && this.$refs.popMenu) {
this.$refs.popMenu.close();
}
this.menuShow = false;
},
chooseDriver() {
const arrs = Object.values(this.driverMapDict);
const list = this.driverList.filter(elem => {
let ret = true;
arrs.forEach(item => {
if (item.id == elem.id) {
ret = false;
}
});
return ret;
});
this.$refs.chooseRole.doShow({ title: this.$t('joinTraining.chooseDriver'), list: list });
},
async setDriver(obj) {
if (obj && this.selected) {
const params = [{
id: obj.id,
nickName: obj.name,
userRole: 'Driver',
stationCode: '',
trainCode: this.selected._code
}];
this.$refs.chooseRole.doShow({ title: this.$t('joinTraining.chooseDriver'), list: list });
},
async setDriver(obj) {
if (obj && this.selected) {
const params = [{
id: obj.id,
nickName: obj.name,
userRole: 'Driver',
stationCode: '',
trainCode: this.selected._code
}];
await putUserRoles(params, this.group);
}
},
async cancelDriver() {
const data = this.driverMapDict[this.selected._code];
if (data) {
const params = [{
id: data.id,
nickName: data.name,
userRole: 'Driver',
stationCode: '',
trainCode: ''
}];
await putUserRoles(params, this.group);
}
},
async cancelDriver() {
const data = this.driverMapDict[this.selected._code];
if (data) {
const params = [{
id: data.id,
nickName: data.name,
userRole: 'Driver',
stationCode: '',
trainCode: ''
}];
await putUserRoles(params, this.group);
}
},
refresh() {
this.$emit('refresh');
}
}
await putUserRoles(params, this.group);
}
},
refresh() {
this.$emit('refresh');
}
}
};
</script>