修改仿真房间代码
This commit is contained in:
ival
parent
ddfa368268
commit
0776d08053
@ -87,132 +87,133 @@
|
||||
<script>
|
||||
import { checkRectCollision } from '@/utils/index';
|
||||
export default {
|
||||
name: 'PopMenu',
|
||||
props: {
|
||||
menu: {
|
||||
type: Array,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
defaultFontSize: 14,
|
||||
tPosition: {
|
||||
x: -1000,
|
||||
y: -1000
|
||||
},
|
||||
height: 'auto'
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
width() {
|
||||
let fontNum = 0;
|
||||
let newLabel='';
|
||||
this.menu.forEach(elem => {
|
||||
newLabel = elem.label && elem.label.replace(/[^\u0000-\u00ff]/g, 'aa');
|
||||
if (elem.label && newLabel.length > fontNum) {
|
||||
fontNum=newLabel.length;
|
||||
// fontNum = elem.label.length;
|
||||
}
|
||||
});
|
||||
var width = fontNum/2 * this.defaultFontSize + 60 + 'px';
|
||||
// if(this.$t('global.lanuage')==='en'){
|
||||
// width = fontNum/2 * this.defaultFontSize + 40 + 'px';
|
||||
// }
|
||||
return width;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
resetShowPosition(point) {
|
||||
if (point) {
|
||||
this.show = true;
|
||||
const self = this;
|
||||
this.$nextTick(() => {
|
||||
const gutter = 3;
|
||||
// 位置
|
||||
const height = self.$el.clientHeight;
|
||||
const width = self.$el.clientWidth;
|
||||
let px = 0;
|
||||
let py = 0;
|
||||
if (point.x + width > document.documentElement.clientWidth) {
|
||||
px = document.documentElement.clientWidth - width - gutter;
|
||||
} else {
|
||||
px = point.x;
|
||||
}
|
||||
if (point.y + height > document.documentElement.clientHeight) {
|
||||
py = document.documentElement.clientHeight - height - gutter;
|
||||
} else {
|
||||
py = point.y;
|
||||
}
|
||||
// 处理和提示框重叠问题
|
||||
const popTipDialog = document.getElementById('pop_tip_dialog');
|
||||
if (popTipDialog) {
|
||||
const tipRect = {
|
||||
point: { x: popTipDialog.offsetLeft, y: popTipDialog.offsetTop },
|
||||
width: popTipDialog.offsetWidth,
|
||||
height: popTipDialog.offsetHeight
|
||||
};
|
||||
const menuRect = {
|
||||
point: { x: px, y: py },
|
||||
width: self.$el.offsetWidth,
|
||||
height: self.$el.offsetHeight
|
||||
};
|
||||
const collision = checkRectCollision(tipRect, menuRect);
|
||||
// 若重叠，调整位置
|
||||
if (collision) {
|
||||
px = tipRect.point.x + tipRect.width + gutter;
|
||||
if (px + width > document.documentElement.clientWidth) {
|
||||
px = tipRect.point.x - menuRect.width - gutter;
|
||||
}
|
||||
}
|
||||
}
|
||||
self.tPosition.x = px;
|
||||
self.tPosition.y = py;
|
||||
});
|
||||
}
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
// 关闭时立即影藏popover组件
|
||||
const popoverList = document.getElementsByClassName('el-popover');
|
||||
for (let i = 0; i < popoverList.length; i++) {
|
||||
popoverList[i].style.display = 'none';
|
||||
}
|
||||
},
|
||||
checkIfDisabled(menuObj) {
|
||||
return menuObj.disabled === true;
|
||||
},
|
||||
isShow(menuObj) {
|
||||
if (typeof (menuObj.show) === 'undefined') {
|
||||
return true;
|
||||
} else {
|
||||
return menuObj.show;
|
||||
}
|
||||
},
|
||||
calculateSubWidth(item) {
|
||||
const children = item.children;
|
||||
let width = 0;
|
||||
let fontNum = 0;
|
||||
children.forEach(elem => {
|
||||
if (elem.label.length > fontNum) {
|
||||
fontNum = elem.label.length;
|
||||
}
|
||||
});
|
||||
width = fontNum * this.defaultFontSize + 20 + 'px';
|
||||
return width;
|
||||
},
|
||||
openLoadFile(item) {
|
||||
const obj = this.$refs[item.label][0];
|
||||
if (obj.files) {
|
||||
const file = obj.files[0];
|
||||
item.handler(file);
|
||||
obj.value = '';
|
||||
}
|
||||
}
|
||||
}
|
||||
name: 'PopMenu',
|
||||
props: {
|
||||
menu: {
|
||||
type: Array,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
defaultFontSize: 14,
|
||||
tPosition: {
|
||||
x: -1000,
|
||||
y: -1000
|
||||
},
|
||||
height: 'auto'
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
width() {
|
||||
let fontNum = 0;
|
||||
let newLabel = '';
|
||||
this.menu.forEach(elem => {
|
||||
newLabel = elem.label && elem.label.replace(/[^\u0000-\u00ff]/g, 'aa');
|
||||
if (elem.label && newLabel.length > fontNum) {
|
||||
fontNum = newLabel.length;
|
||||
// fontNum = elem.label.length;
|
||||
}
|
||||
});
|
||||
var width = fontNum / 2 * this.defaultFontSize + 60 + 'px';
|
||||
// if(this.$t('global.lanuage')==='en'){
|
||||
// width = fontNum/2 * this.defaultFontSize + 40 + 'px';
|
||||
// }
|
||||
return width;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
methods: {
|
||||
resetShowPosition(point) {
|
||||
console.log(point);
|
||||
if (point) {
|
||||
this.show = true;
|
||||
const self = this;
|
||||
this.$nextTick(() => {
|
||||
const gutter = 3;
|
||||
// 位置
|
||||
const height = self.$el.clientHeight;
|
||||
const width = self.$el.clientWidth;
|
||||
let px = 0;
|
||||
let py = 0;
|
||||
if (point.x + width > document.documentElement.clientWidth) {
|
||||
px = document.documentElement.clientWidth - width - gutter;
|
||||
} else {
|
||||
px = point.x;
|
||||
}
|
||||
if (point.y + height > document.documentElement.clientHeight) {
|
||||
py = document.documentElement.clientHeight - height - gutter;
|
||||
} else {
|
||||
py = point.y;
|
||||
}
|
||||
// 处理和提示框重叠问题
|
||||
const popTipDialog = document.getElementById('pop_tip_dialog');
|
||||
if (popTipDialog) {
|
||||
const tipRect = {
|
||||
point: { x: popTipDialog.offsetLeft, y: popTipDialog.offsetTop },
|
||||
width: popTipDialog.offsetWidth,
|
||||
height: popTipDialog.offsetHeight
|
||||
};
|
||||
const menuRect = {
|
||||
point: { x: px, y: py },
|
||||
width: self.$el.offsetWidth,
|
||||
height: self.$el.offsetHeight
|
||||
};
|
||||
const collision = checkRectCollision(tipRect, menuRect);
|
||||
// 若重叠，调整位置
|
||||
if (collision) {
|
||||
px = tipRect.point.x + tipRect.width + gutter;
|
||||
if (px + width > document.documentElement.clientWidth) {
|
||||
px = tipRect.point.x - menuRect.width - gutter;
|
||||
}
|
||||
}
|
||||
}
|
||||
self.tPosition.x = px;
|
||||
self.tPosition.y = py;
|
||||
});
|
||||
}
|
||||
},
|
||||
close() {
|
||||
this.show = false;
|
||||
// 关闭时立即影藏popover组件
|
||||
const popoverList = document.getElementsByClassName('el-popover');
|
||||
for (let i = 0; i < popoverList.length; i++) {
|
||||
popoverList[i].style.display = 'none';
|
||||
}
|
||||
},
|
||||
checkIfDisabled(menuObj) {
|
||||
return menuObj.disabled === true;
|
||||
},
|
||||
isShow(menuObj) {
|
||||
if (typeof (menuObj.show) === 'undefined') {
|
||||
return true;
|
||||
} else {
|
||||
return menuObj.show;
|
||||
}
|
||||
},
|
||||
calculateSubWidth(item) {
|
||||
const children = item.children;
|
||||
let width = 0;
|
||||
let fontNum = 0;
|
||||
children.forEach(elem => {
|
||||
if (elem.label.length > fontNum) {
|
||||
fontNum = elem.label.length;
|
||||
}
|
||||
});
|
||||
width = fontNum * this.defaultFontSize + 20 + 'px';
|
||||
return width;
|
||||
},
|
||||
openLoadFile(item) {
|
||||
const obj = this.$refs[item.label][0];
|
||||
if (obj.files) {
|
||||
const file = obj.files[0];
|
||||
item.handler(file);
|
||||
obj.value = '';
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
@ -47,26 +47,6 @@ function handle(state, data) {
|
||||
case 'JointTraining_User_Permit': // 综合演练室-用户获取权限消息
|
||||
state.userPermit = msg;
|
||||
break;
|
||||
case 'JointTraining_User_RoomKickOut': // 综合演练室-用户被踢出房间消息
|
||||
state.userRoomKickOut = msg; // 没有给被踢用户发送
|
||||
handleMessageInfo(state, 'userRoomKickOut', msg);
|
||||
break;
|
||||
case 'JointTraining_User_InRoom': // 综合演练室-用户从外部进入房间消息
|
||||
state.userInRoom = msg;
|
||||
handleMessageInfo(state, 'userInRoom', msg);
|
||||
break;
|
||||
case 'JointTraining_User_OutRoom': // 综合演练室-用户退出房间消息
|
||||
state.userOutRoom = msg;
|
||||
handleMessageInfo(state, 'userOutRoom', msg);
|
||||
break;
|
||||
case 'JointTraining_User_InSimulation': // 综合演练室-用户进入仿真消息
|
||||
state.userInSimulation = msg;
|
||||
handleMessageInfoSimulation(state, 'userInSimulation', msg);
|
||||
break;
|
||||
case 'JointTraining_User_BackRoom': // 综合演练室-用户从仿真返回房间消息
|
||||
state.userBackRoom = msg;
|
||||
handleMessageInfoSimulation(state, 'userBackRoom', msg);
|
||||
break;
|
||||
case 'JointTraining_Room_Invite': // 综合演练室-房间邀请消息
|
||||
state.roomInvite = msg;
|
||||
break;
|
||||
@ -130,7 +110,7 @@ function handleRecordList(state, data) {
|
||||
inRoom: true,
|
||||
date: +new Date(`${myDate1} ${data.chatTime}`)
|
||||
};
|
||||
state.chatContentList = param;
|
||||
state.chatContent = param;
|
||||
}
|
||||
// 仿真内部聊天
|
||||
function handleSimulationInfo(state, data) {
|
||||
@ -191,62 +171,11 @@ function handleSimulationInfo(state, data) {
|
||||
}
|
||||
state.simulationText = param;
|
||||
}
|
||||
|
||||
function handleUserinfo(state, data) {
|
||||
if (data.length) { // 分配角色信息
|
||||
state.roleInfo = data;
|
||||
}
|
||||
}
|
||||
function handleMessageInfo(state, type, data) {
|
||||
const message = {
|
||||
join: true,
|
||||
id: data.id,
|
||||
userName: data.nickName,
|
||||
userRole: data.userRole,
|
||||
name: data.name,
|
||||
roomTip: '',
|
||||
chatInfo: true,
|
||||
inSimulation: data.inSimulation,
|
||||
inRoom: data.inRoom,
|
||||
session: 'session',
|
||||
type: type,
|
||||
oneself: data.id === store.state.user.id
|
||||
};
|
||||
switch (type) {
|
||||
case 'userInRoom':
|
||||
message.roomTip = `${data.nickName}进入房间`;
|
||||
break;
|
||||
case 'userRoomKickOut':
|
||||
message.roomTip = `${data.nickName}被踢出房间`;
|
||||
break;
|
||||
case 'userOutRoom':
|
||||
message.roomTip = `${data.nickName}退出房间`;
|
||||
break;
|
||||
}
|
||||
state.chatContentList = message;
|
||||
}
|
||||
function handleMessageInfoSimulation(state, type, data) {
|
||||
const message = {
|
||||
join: true,
|
||||
id: data.id,
|
||||
userName: data.nickName,
|
||||
userRole: data.userRole,
|
||||
name: data.name,
|
||||
simulationTip: '',
|
||||
chatInfo: true,
|
||||
inSimulation: data.inSimulation,
|
||||
inRoom: data.inRoom,
|
||||
session: 'session'
|
||||
};
|
||||
switch (type) {
|
||||
case 'userInSimulation':
|
||||
message.simulationTip = `${data.nickName}进入仿真`;
|
||||
break;
|
||||
case 'userBackRoom':
|
||||
message.simulationTip = `${data.nickName}退出仿真`;
|
||||
break;
|
||||
}
|
||||
state.chatContentSimuList = message;
|
||||
state.roleList = (data instanceof Array) ? data : [data];
|
||||
}
|
||||
|
||||
function handlePushMsgQueue(state, msg) {
|
||||
if (msg instanceof Array) {
|
||||
state.msgQueue.concat(msg);
|
||||
@ -265,8 +194,8 @@ const socket = {
|
||||
state: {
|
||||
payOrder: {}, // 支付消息
|
||||
jointRoomInfo: {}, // 受邀请房间信息
|
||||
chatContentList: {}, // 聊天室聊天内容
|
||||
roleInfo: [], // 设置角色信息
|
||||
chatContent: {}, // 聊天室聊天内容
|
||||
roleList: [], // 设置角色信息
|
||||
jointRoomPrepare: false, // 演练房间准备状态
|
||||
equipmentStatus: [], // 仿真-设备状态消息
|
||||
trainStationList: [], // 仿真-列车实际到发车站消息
|
||||
@ -274,6 +203,7 @@ const socket = {
|
||||
simulationStart: '', // 仿真-开始消息
|
||||
simulationReset: '', // 仿真-异常消息
|
||||
simulationText: {}, // 仿真-用户交互消息（聊天/命令）
|
||||
|
||||
message: {}, // 仿真聊天
|
||||
msgQueue: [], // 命令请求列表
|
||||
msgHead: null, // 消息头
|
||||
@ -285,7 +215,6 @@ const socket = {
|
||||
userInSimulation: {}, // 用户进入仿真消息
|
||||
userBackRoom: {}, // 用户从仿真返回房间消息
|
||||
roomInvite: {}, // 用户扫码信息
|
||||
chatContentSimuList: {}, // 进入仿真，离开仿真信息
|
||||
|
||||
permissionOver: {}, // 权限结束
|
||||
|
||||
@ -300,8 +229,8 @@ const socket = {
|
||||
state.jointRoomInfo = jointRoomInfo;
|
||||
},
|
||||
|
||||
setChatContentList: (state, chatContentList) => {
|
||||
state.chatContentList = chatContentList;
|
||||
setChatContent: (state, chatContent) => {
|
||||
state.chatContent = chatContent;
|
||||
},
|
||||
|
||||
setEquipmentStatus: (state, equipmentStatus) => {
|
||||
@ -351,8 +280,8 @@ const socket = {
|
||||
handle(state, res);
|
||||
},
|
||||
|
||||
setChatContentList: ({ commit }, chatContentList) => {
|
||||
commit('setChatContentList', chatContentList);
|
||||
setChatContent: ({ commit }, chatContent) => {
|
||||
commit('setChatContent', chatContent);
|
||||
},
|
||||
|
||||
setJointRoomInfo: ({ commit }) => {
|
||||
|
||||
@ -3,11 +3,11 @@ 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.41:9000'; // 杜闪
|
||||
// BASE_API = 'http://192.168.3.82:9000'; // 杜康
|
||||
BASE_API = 'http://192.168.3.82:9000'; // 杜康
|
||||
} else {
|
||||
BASE_API = process.env.VUE_APP_BASE_API;
|
||||
}
|
||||
|
||||
@ -34,383 +34,383 @@ 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.roleInfo': 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();
|
||||
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);
|
||||
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})`;
|
||||
}
|
||||
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);
|
||||
}
|
||||
});
|
||||
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 => {
|
||||
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: ''
|
||||
};
|
||||
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);
|
||||
}
|
||||
});
|
||||
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.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;
|
||||
}
|
||||
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);
|
||||
});
|
||||
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);
|
||||
});
|
||||
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.$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
|
||||
};
|
||||
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);
|
||||
}
|
||||
}
|
||||
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>
|
||||
|
||||
@ -130,7 +130,7 @@ export default {
|
||||
this.handleRoomInfo(val);
|
||||
}
|
||||
},
|
||||
'$store.state.socket.chatContentList': function (val) { // 综合演练被踢出房间
|
||||
'$store.state.socket.chatContent': function (val) { // 综合演练被踢出房间
|
||||
if (val.type === 'userRoomKickOut' && val.oneself) {
|
||||
this.$router.push({ path: `/` });
|
||||
this.messageInfo(this.$t('tip.beKickedOut'), 'warning');
|
||||
|
||||
@ -25,288 +25,288 @@ import { timeFormat } from '@/utils/date';
|
||||
import { EventBus } from '@/scripts/event-bus';
|
||||
|
||||
export default {
|
||||
name: 'MenuDemonJoint',
|
||||
components: {
|
||||
QrCode,
|
||||
SetTime
|
||||
},
|
||||
props: {
|
||||
group: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
userRole: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
deviceCode: {
|
||||
type: String,
|
||||
default() {
|
||||
return '';
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isDisable: false,
|
||||
timeNow: 0,
|
||||
remainingTime: 0,
|
||||
recordStep: 'BGSetting',
|
||||
training: {
|
||||
id: '',
|
||||
name: '',
|
||||
remarks: ''
|
||||
},
|
||||
chatShow: true,
|
||||
isShowAuto: false,
|
||||
offset: 10,
|
||||
userId: '',
|
||||
activeName: 'first',
|
||||
activeName2: 'second',
|
||||
stationList: [],
|
||||
stationLists: [],
|
||||
minimize: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
isSpeaking() {
|
||||
return this.userRole != 'Driver' && this.userRole != '';
|
||||
},
|
||||
isDriver() {
|
||||
return this.userRole == 'Driver';
|
||||
},
|
||||
isAdmin() {
|
||||
return this.userRole == 'Admin';
|
||||
},
|
||||
isBigScreen() {
|
||||
return this.userRole == 'BigScreen';
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.config.menuBarLoadedCount': function (val) {
|
||||
this.setPosition();
|
||||
},
|
||||
'$store.state.map.map.stationList': function (val) { // 执行一次 以后不会有变化
|
||||
if (val && val.length) {
|
||||
this.stationList = val;
|
||||
this.stationLists = val;
|
||||
}
|
||||
},
|
||||
'$store.state.socket.roleInfo': function (val) {
|
||||
if (val && val.length) {
|
||||
this.addrolesList(val);
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('config/updateMenuBar');
|
||||
});
|
||||
}
|
||||
},
|
||||
'$store.state.socket.simulationStart': async function (val) {
|
||||
if (val) {
|
||||
await this.loadSystemTime();
|
||||
this.$store.dispatch('training/simulationStart', { start: true });
|
||||
}
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
this.userId = this.$store.state.user.id;
|
||||
await this.initLoadPage();
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.$store.dispatch('training/setGroup', '');
|
||||
},
|
||||
methods: {
|
||||
async initLoadPage() {
|
||||
try {
|
||||
const resp = await runDiagramIsStart(this.group);
|
||||
if (resp && resp.data) {
|
||||
this.isDisable = true;
|
||||
this.$store.dispatch('training/simulationStart');
|
||||
} else {
|
||||
this.isDisable = false;
|
||||
this.$store.dispatch('training/over');
|
||||
}
|
||||
name: 'MenuDemonJoint',
|
||||
components: {
|
||||
QrCode,
|
||||
SetTime
|
||||
},
|
||||
props: {
|
||||
group: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
userRole: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
deviceCode: {
|
||||
type: String,
|
||||
default() {
|
||||
return '';
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isDisable: false,
|
||||
timeNow: 0,
|
||||
remainingTime: 0,
|
||||
recordStep: 'BGSetting',
|
||||
training: {
|
||||
id: '',
|
||||
name: '',
|
||||
remarks: ''
|
||||
},
|
||||
chatShow: true,
|
||||
isShowAuto: false,
|
||||
offset: 10,
|
||||
userId: '',
|
||||
activeName: 'first',
|
||||
activeName2: 'second',
|
||||
stationList: [],
|
||||
stationLists: [],
|
||||
minimize: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
isSpeaking() {
|
||||
return this.userRole != 'Driver' && this.userRole != '';
|
||||
},
|
||||
isDriver() {
|
||||
return this.userRole == 'Driver';
|
||||
},
|
||||
isAdmin() {
|
||||
return this.userRole == 'Admin';
|
||||
},
|
||||
isBigScreen() {
|
||||
return this.userRole == 'BigScreen';
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.config.menuBarLoadedCount': function (val) {
|
||||
this.setPosition();
|
||||
},
|
||||
'$store.state.map.map.stationList': function (val) { // 执行一次 以后不会有变化
|
||||
if (val && val.length) {
|
||||
this.stationList = val;
|
||||
this.stationLists = val;
|
||||
}
|
||||
},
|
||||
'$store.state.socket.roleList': function (val) {
|
||||
if (val && val.length) {
|
||||
this.addrolesList(val);
|
||||
this.$nextTick(() => {
|
||||
this.$store.dispatch('config/updateMenuBar');
|
||||
});
|
||||
}
|
||||
},
|
||||
'$store.state.socket.simulationStart': async function (val) {
|
||||
if (val) {
|
||||
await this.loadSystemTime();
|
||||
this.$store.dispatch('training/simulationStart', { start: true });
|
||||
}
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
this.userId = this.$store.state.user.id;
|
||||
await this.initLoadPage();
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.$store.dispatch('training/setGroup', '');
|
||||
},
|
||||
methods: {
|
||||
async initLoadPage() {
|
||||
try {
|
||||
const resp = await runDiagramIsStart(this.group);
|
||||
if (resp && resp.data) {
|
||||
this.isDisable = true;
|
||||
this.$store.dispatch('training/simulationStart');
|
||||
} else {
|
||||
this.isDisable = false;
|
||||
this.$store.dispatch('training/over');
|
||||
}
|
||||
|
||||
await this.loadSystemTime();
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
// 切换角色tab
|
||||
clickRoles(active) {
|
||||
if (active == 'first') {
|
||||
this.chatShow = true;
|
||||
this.isShowAuto = false;
|
||||
this.$refs.chatView.select(); // 清空选中
|
||||
this.$refs.chat.clearPlay('', ''); // 清空自动播放 会话id
|
||||
await this.loadSystemTime();
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
// 切换角色tab
|
||||
clickRoles(active) {
|
||||
if (active == 'first') {
|
||||
this.chatShow = true;
|
||||
this.isShowAuto = false;
|
||||
this.$refs.chatView.select(); // 清空选中
|
||||
this.$refs.chat.clearPlay('', ''); // 清空自动播放 会话id
|
||||
|
||||
} else {
|
||||
this.chatShow = false;
|
||||
this.isShowAuto = true;
|
||||
this.$refs.chat.getChathistory('', ''); // 获取所有人列表
|
||||
}
|
||||
this.activeName = active;
|
||||
},
|
||||
loadSystemTime() {
|
||||
runDiagramGetTime(this.group).then(response => {
|
||||
this.$store.dispatch('training/setInitTime', +new Date(`${new Date().getFullYear()} ${timeFormat(response.data)}`));
|
||||
});
|
||||
},
|
||||
handleMinimality(data) {
|
||||
if (data == 'min') {
|
||||
this.minimize = true;
|
||||
} else {
|
||||
this.minimize = false;
|
||||
}
|
||||
},
|
||||
handleChatShow(data) {
|
||||
if (!this.minimize) { // 最大化状态
|
||||
if (this.activeName == 'first') {
|
||||
this.$refs.chatView.select(data.id);
|
||||
this.chatShow = false;
|
||||
this.isShowAuto = false;
|
||||
this.$refs.chat.handleTextList(data.conversationId);
|
||||
} else {
|
||||
this.activeName = 'first';
|
||||
this.handleChatShow(data);
|
||||
}
|
||||
} else { // 最小化状态
|
||||
this.minimize = false;
|
||||
this.handleChatShow(data);
|
||||
}
|
||||
},
|
||||
// 切到未读消息并说话
|
||||
showChatSpeak(data) {
|
||||
this.chatShow = false;
|
||||
this.isShowAuto = false;
|
||||
this.$refs.chat.handleTextList(data.conversationId);
|
||||
},
|
||||
// 获取历史纪录list
|
||||
showChat(obj) {
|
||||
this.chatShow = false;
|
||||
this.$refs.chat.getChathistory(obj.code, obj.id);
|
||||
},
|
||||
handleChatList(data) {
|
||||
this.$refs.chatView.hintInfo(data);
|
||||
},
|
||||
// 设置不显示
|
||||
showChatNone() {
|
||||
this.chatShow = true;
|
||||
},
|
||||
messageInfo(message, type) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: message,
|
||||
type: type
|
||||
});
|
||||
},
|
||||
setPosition() {
|
||||
this.$nextTick(() => {
|
||||
let offset = 10;
|
||||
const menuBar = document.getElementById('menuBar');
|
||||
const menuTool = document.getElementById('menuTool');
|
||||
} else {
|
||||
this.chatShow = false;
|
||||
this.isShowAuto = true;
|
||||
this.$refs.chat.getChathistory('', ''); // 获取所有人列表
|
||||
}
|
||||
this.activeName = active;
|
||||
},
|
||||
loadSystemTime() {
|
||||
runDiagramGetTime(this.group).then(response => {
|
||||
this.$store.dispatch('training/setInitTime', +new Date(`${new Date().getFullYear()} ${timeFormat(response.data)}`));
|
||||
});
|
||||
},
|
||||
handleMinimality(data) {
|
||||
if (data == 'min') {
|
||||
this.minimize = true;
|
||||
} else {
|
||||
this.minimize = false;
|
||||
}
|
||||
},
|
||||
handleChatShow(data) {
|
||||
if (!this.minimize) { // 最大化状态
|
||||
if (this.activeName == 'first') {
|
||||
this.$refs.chatView.select(data.id);
|
||||
this.chatShow = false;
|
||||
this.isShowAuto = false;
|
||||
this.$refs.chat.handleTextList(data.conversationId);
|
||||
} else {
|
||||
this.activeName = 'first';
|
||||
this.handleChatShow(data);
|
||||
}
|
||||
} else { // 最小化状态
|
||||
this.minimize = false;
|
||||
this.handleChatShow(data);
|
||||
}
|
||||
},
|
||||
// 切到未读消息并说话
|
||||
showChatSpeak(data) {
|
||||
this.chatShow = false;
|
||||
this.isShowAuto = false;
|
||||
this.$refs.chat.handleTextList(data.conversationId);
|
||||
},
|
||||
// 获取历史纪录list
|
||||
showChat(obj) {
|
||||
this.chatShow = false;
|
||||
this.$refs.chat.getChathistory(obj.code, obj.id);
|
||||
},
|
||||
handleChatList(data) {
|
||||
this.$refs.chatView.hintInfo(data);
|
||||
},
|
||||
// 设置不显示
|
||||
showChatNone() {
|
||||
this.chatShow = true;
|
||||
},
|
||||
messageInfo(message, type) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: message,
|
||||
type: type
|
||||
});
|
||||
},
|
||||
setPosition() {
|
||||
this.$nextTick(() => {
|
||||
let offset = 10;
|
||||
const menuBar = document.getElementById('menuBar');
|
||||
const menuTool = document.getElementById('menuTool');
|
||||
|
||||
if (menuBar) {
|
||||
offset += (menuBar.offsetHeight || 0);
|
||||
}
|
||||
if (menuBar) {
|
||||
offset += (menuBar.offsetHeight || 0);
|
||||
}
|
||||
|
||||
if (menuTool) {
|
||||
offset += (menuTool.offsetHeight || 0);
|
||||
}
|
||||
if (menuTool) {
|
||||
offset += (menuTool.offsetHeight || 0);
|
||||
}
|
||||
|
||||
if (this.offset != offset) {
|
||||
this.offset = offset;
|
||||
}
|
||||
});
|
||||
},
|
||||
// 设置用户角色 Admin 管理员 Instructor 教员 Dispatcher 行调 Attendant 车站 Audience 观众 Driver 司机 Repair 通号
|
||||
addrolesList(list) {
|
||||
list.forEach(item => {
|
||||
if (this.userId == item.id) {
|
||||
switch (item.userRole) {
|
||||
case 'Instructor':
|
||||
this.$store.dispatch('training/setPrdType', '02'); this.$store.dispatch('training/setRoles', 'Instructor');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
case 'Dispatcher':
|
||||
this.$store.dispatch('training/setPrdType', '02'); this.$store.dispatch('training/setRoles', 'Dispatcher');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
case 'Attendant':
|
||||
if (!item['stationCode']) {
|
||||
this.$store.dispatch('training/setPrdType', ''); this.$store.dispatch('training/setRoles', 'Attendant');
|
||||
break;
|
||||
}
|
||||
this.$store.dispatch('training/setPrdType', '01'); this.$store.dispatch('training/setRoles', 'Attendant');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
case 'Driver':
|
||||
this.$store.dispatch('training/setPrdType', ''); this.$store.dispatch('training/setRoles', 'Driver');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
case 'Repair':
|
||||
this.$store.dispatch('training/setPrdType', ''); this.$store.dispatch('training/setRoles', 'Repair');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
case 'IBP':
|
||||
this.$store.dispatch('training/setPrdType', ''); this.$store.dispatch('training/setRoles', 'IBP');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
case 'BigScreen':
|
||||
this.$store.dispatch('training/setPrdType', ''); this.$store.dispatch('training/setRoles', 'BigScreen');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
default:
|
||||
this.$store.dispatch('training/setPrdType', ''); this.$store.dispatch('training/setRoles', 'Audience');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
}
|
||||
}
|
||||
});
|
||||
if (this.$refs.chatView) {
|
||||
this.$refs.chatView.getUserRole();
|
||||
}
|
||||
},
|
||||
handleClick(tab, event) {
|
||||
if (this.activeName == 'second') {
|
||||
this.$refs.chat.getChathistory();
|
||||
}
|
||||
},
|
||||
selectBeginTime() {
|
||||
this.$refs.setTime.doShow();
|
||||
},
|
||||
start(model) {
|
||||
this.isDisable = true;
|
||||
runDiagramStart(model, this.group).then(res => {
|
||||
this.$store.dispatch('training/simulationStart').then(() => {
|
||||
this.$store.dispatch('training/setInitTime', +new Date(`${new Date().getFullYear()} ${model.initTime}`));
|
||||
});
|
||||
}).catch(() => {
|
||||
this.isDisable = false;
|
||||
this.$messageBox(this.$t('error.startSimulationFailed'));
|
||||
});
|
||||
},
|
||||
end() {
|
||||
this.isDisable = false;
|
||||
EventBus.$emit('trainView');
|
||||
runDiagramOver(this.group).catch(() => {
|
||||
this.$store.dispatch('training/over').then(() => {
|
||||
this.isDisable = true;
|
||||
this.$messageBox(this.$t('error.endSimulationFailed'));
|
||||
});
|
||||
});
|
||||
},
|
||||
back() {
|
||||
this.$store.dispatch('training/over').then(() => {
|
||||
putJointTrainingSimulationUser(this.group).then(() => {
|
||||
this.$router.replace({ path: `/trainroom`, query: { skinCode: this.$route.query.skinCode, group: this.group, subSystem: this.$route.query.subSystem } });
|
||||
exitFullscreen();
|
||||
});
|
||||
});
|
||||
},
|
||||
jumpjlmap3d() {
|
||||
this.$emit('hidepanel');
|
||||
}
|
||||
}
|
||||
if (this.offset != offset) {
|
||||
this.offset = offset;
|
||||
}
|
||||
});
|
||||
},
|
||||
// 设置用户角色 Admin 管理员 Instructor 教员 Dispatcher 行调 Attendant 车站 Audience 观众 Driver 司机 Repair 通号
|
||||
addrolesList(list) {
|
||||
list.forEach(item => {
|
||||
if (this.userId == item.id) {
|
||||
switch (item.userRole) {
|
||||
case 'Instructor':
|
||||
this.$store.dispatch('training/setPrdType', '02'); this.$store.dispatch('training/setRoles', 'Instructor');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
case 'Dispatcher':
|
||||
this.$store.dispatch('training/setPrdType', '02'); this.$store.dispatch('training/setRoles', 'Dispatcher');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
case 'Attendant':
|
||||
if (!item['stationCode']) {
|
||||
this.$store.dispatch('training/setPrdType', ''); this.$store.dispatch('training/setRoles', 'Attendant');
|
||||
break;
|
||||
}
|
||||
this.$store.dispatch('training/setPrdType', '01'); this.$store.dispatch('training/setRoles', 'Attendant');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
case 'Driver':
|
||||
this.$store.dispatch('training/setPrdType', ''); this.$store.dispatch('training/setRoles', 'Driver');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
case 'Repair':
|
||||
this.$store.dispatch('training/setPrdType', ''); this.$store.dispatch('training/setRoles', 'Repair');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
case 'IBP':
|
||||
this.$store.dispatch('training/setPrdType', ''); this.$store.dispatch('training/setRoles', 'IBP');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
case 'BigScreen':
|
||||
this.$store.dispatch('training/setPrdType', ''); this.$store.dispatch('training/setRoles', 'BigScreen');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
default:
|
||||
this.$store.dispatch('training/setPrdType', ''); this.$store.dispatch('training/setRoles', 'Audience');
|
||||
this.$emit('getUserRole');
|
||||
break;
|
||||
}
|
||||
}
|
||||
});
|
||||
if (this.$refs.chatView) {
|
||||
this.$refs.chatView.getUserRole();
|
||||
}
|
||||
},
|
||||
handleClick(tab, event) {
|
||||
if (this.activeName == 'second') {
|
||||
this.$refs.chat.getChathistory();
|
||||
}
|
||||
},
|
||||
selectBeginTime() {
|
||||
this.$refs.setTime.doShow();
|
||||
},
|
||||
start(model) {
|
||||
this.isDisable = true;
|
||||
runDiagramStart(model, this.group).then(res => {
|
||||
this.$store.dispatch('training/simulationStart').then(() => {
|
||||
this.$store.dispatch('training/setInitTime', +new Date(`${new Date().getFullYear()} ${model.initTime}`));
|
||||
});
|
||||
}).catch(() => {
|
||||
this.isDisable = false;
|
||||
this.$messageBox(this.$t('error.startSimulationFailed'));
|
||||
});
|
||||
},
|
||||
end() {
|
||||
this.isDisable = false;
|
||||
EventBus.$emit('trainView');
|
||||
runDiagramOver(this.group).catch(() => {
|
||||
this.$store.dispatch('training/over').then(() => {
|
||||
this.isDisable = true;
|
||||
this.$messageBox(this.$t('error.endSimulationFailed'));
|
||||
});
|
||||
});
|
||||
},
|
||||
back() {
|
||||
this.$store.dispatch('training/over').then(() => {
|
||||
putJointTrainingSimulationUser(this.group).then(() => {
|
||||
this.$router.replace({ path: `/trainroom`, query: { skinCode: this.$route.query.skinCode, group: this.group, subSystem: this.$route.query.subSystem } });
|
||||
exitFullscreen();
|
||||
});
|
||||
});
|
||||
},
|
||||
jumpjlmap3d() {
|
||||
this.$emit('hidepanel');
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
|
||||
@ -7,7 +7,6 @@
|
||||
v-model="item.select"
|
||||
class="checkbox"
|
||||
type="checkbox"
|
||||
@change="nodeClick(item)"
|
||||
>
|
||||
<span>{{ item.node.nickName }}</span>
|
||||
</li>
|
||||
@ -43,8 +42,11 @@ export default {
|
||||
props() {
|
||||
return { label: 'name' };
|
||||
},
|
||||
personList() {
|
||||
return this.audienceList.map(e => { return { select: false, node: e }; });
|
||||
},
|
||||
filterList() {
|
||||
return this.audienceList.filter(e => e.nickName.includes(this.filterText)).map(e => { return {select: false, node: e}; });
|
||||
return this.personList.filter(e => e.node.nickName.includes(this.filterText));
|
||||
},
|
||||
titleI18n() {
|
||||
return {
|
||||
@ -66,14 +68,11 @@ export default {
|
||||
},
|
||||
doClose() {
|
||||
this.visible = false;
|
||||
},
|
||||
nodeClick(data) {
|
||||
|
||||
},
|
||||
commit() {
|
||||
this.$emit('handleDispatch', this.personList);
|
||||
const userList = this.personList.filter(e => { return e.select; }).map(e=> { return e.node; });
|
||||
this.$emit('dispatch', {roleType: this.roleType, userList: userList});
|
||||
this.visible = false;
|
||||
this.personList = [];
|
||||
},
|
||||
cancel() {
|
||||
this.doClose();
|
||||
@ -98,6 +97,10 @@ export default {
|
||||
background-color: #c7c7c7;
|
||||
}
|
||||
|
||||
/deep/ .el-dialog__body {
|
||||
padding: 10px 20px;
|
||||
}
|
||||
|
||||
.person {
|
||||
&__container {
|
||||
max-height: 270px;
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<div class="chat__head">
|
||||
<div class="chat__head--title"> 会话窗口</div>
|
||||
</div>
|
||||
<div class="chat__container" :style="{height: listHeight+'px'}">
|
||||
<div ref="content" class="chat__container" :style="{height: listHeight+'px'}">
|
||||
<ul class="chat__container--list">
|
||||
<div v-for="(nor, index) in textList" :key="index" style="margin-top: 5px;">
|
||||
<li v-if="nor.self" style="position: relative">
|
||||
@ -33,6 +33,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { chatWithText } from '@/api/chat';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
@ -52,32 +53,63 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
textList: [],
|
||||
topic: '/user/topic/chatroom',
|
||||
text: '',
|
||||
recorders: null,
|
||||
stomp: null,
|
||||
speak: this.$t('trainRoom.holdAndTalk'),
|
||||
sending: false,
|
||||
background: '',
|
||||
userId: '',
|
||||
disabled:true
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
listHeight() {
|
||||
return this.height - 90;
|
||||
},
|
||||
group() {
|
||||
return this.$route.query.group;
|
||||
},
|
||||
userId() {
|
||||
return this.$store.state.user ? this.$store.state.user.id : '';
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.socket.chatContent': function (val) { // 房间内语音聊天
|
||||
if (val.chatInfo) {
|
||||
this.handelTextList(val);
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleSetInputState() {
|
||||
async handleSetInputState() {
|
||||
if (!this.text.trim()) {
|
||||
this.disabled = true;
|
||||
} else {
|
||||
this.disabled = false;
|
||||
}
|
||||
},
|
||||
handleSendText() {
|
||||
|
||||
async handleSendText() {
|
||||
try {
|
||||
if (this.text.trim()) {
|
||||
await chatWithText(this.text, this.group);
|
||||
this.text = '';
|
||||
this.disabled = true;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
},
|
||||
async handelTextList(params) {
|
||||
if (!params.inSimulation) {
|
||||
this.textList.push(params);
|
||||
this.textList.sort((a, b) => {
|
||||
return a.date - b.date;
|
||||
});
|
||||
}
|
||||
this.sending = false;
|
||||
this.$store.dispatch('socket/setChatContent', {});
|
||||
this.$nextTick(() => {
|
||||
if (this.$refs.content) {
|
||||
this.$refs.content.scrollTop = this.$refs.content.scrollHeight;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -2,26 +2,34 @@
|
||||
<div class="device">
|
||||
<div class="device__head">
|
||||
<div class="device__head--title">
|
||||
{{ $t(titleI18n) }}<span>-{{ hasPlc?$t('trainRoom.plcGatewayOnline'):$t('trainRoom.plcGatewayOffline') }}</span>
|
||||
{{ $t(titleI18n) }}<span>-{{ hasPlc? $t('trainRoom.plcGatewayOnline') : $t('trainRoom.plcGatewayOffline') }}</span>
|
||||
</div>
|
||||
<div class="device__head--add">
|
||||
<el-button v-if="userId == room.creatorId" icon="el-icon-plus" circle plain @click="handleAddUser()" />
|
||||
<el-button v-if="userId == room.creatorId" icon="el-icon-plus" circle plain @click="handleAddDevice()" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="device__container">
|
||||
<ul class="device__container--list">
|
||||
<li v-for="(node, index) in options" :key="index">
|
||||
<span>{{ node.nickName }}</span>
|
||||
<i v-if="userId == room.creatorId" class="el-icon-close delete" @click="handleDelUser(node, index)" />
|
||||
<span>{{ realDeviceType[node.deviceType] }}</span>
|
||||
<i v-if="userId == room.creatorId" class="el-icon-close delete" @click="handleDelDevice(node, index)" />
|
||||
<div style="float: right; margin-right: 15px;">
|
||||
<el-cascader
|
||||
<el-select
|
||||
v-model="node.deviceCode"
|
||||
size="mini"
|
||||
:placeholder="$t('global.choose')"
|
||||
size="mini"
|
||||
:disabled="userId != room.creatorId"
|
||||
:options="stationList"
|
||||
@change="handleSetUser(node, index)"
|
||||
/>
|
||||
@change="handleUpdDevice(node, index)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in deviceList"
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
:disabled="item.disabled"
|
||||
style="margin-left: 10px"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
@ -30,6 +38,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { RealDeviceType } from '@/scripts/ConstDic';
|
||||
|
||||
export default {
|
||||
props: {
|
||||
@ -37,10 +46,6 @@ export default {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
userId: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
room: {
|
||||
type:Object,
|
||||
required: true
|
||||
@ -49,7 +54,11 @@ export default {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
stationList: {
|
||||
deviceType: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
deviceList: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [];
|
||||
@ -62,15 +71,23 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
realDeviceType: RealDeviceType
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
userId() {
|
||||
return this.$store.state.user ? this.$store.state.user.id : '';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleAddDevice() {
|
||||
this.$emit('addDevice',);
|
||||
this.$emit('addDevice', { deviceType: this.deviceType });
|
||||
},
|
||||
handleSetDevice(node, index) {
|
||||
handleUpdDevice(node, index) {
|
||||
this.$emit('changeDevice', { deviceType: this.deviceType, device: node, deviceList: this.deviceList });
|
||||
},
|
||||
handleDelDevice(node, index) {
|
||||
this.$emit('delDevice', { deviceType: this.deviceType, device: node, deviceList: this.deviceList });
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -22,13 +22,18 @@
|
||||
</el-tree>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
<content-menu ref="menu" :click-user-id="clickUserId" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { DeviceMenu } from '@/scripts/ConstDic';
|
||||
import ContentMenu from './content-menu';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
ContentMenu
|
||||
},
|
||||
props: {
|
||||
room: {
|
||||
type: Object,
|
||||
@ -45,7 +50,8 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
filterText: ''
|
||||
filterText: '',
|
||||
clickUserId: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@ -57,6 +63,9 @@ export default {
|
||||
},
|
||||
filterMembers() {
|
||||
return this.members.filter(e =>{ return e.nickName.includes(this.filterText); });
|
||||
},
|
||||
userId() {
|
||||
return this.$store.state.user ? this.$store.state.user.id : '';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@ -66,13 +75,14 @@ export default {
|
||||
},
|
||||
handleShowContextMenu(e, obj, node, vueElem) {
|
||||
e.preventDefault();
|
||||
this.point = {
|
||||
const position = {
|
||||
x: e.clientX,
|
||||
y: e.clientY
|
||||
};
|
||||
|
||||
if (this.userId == this.room.creatorId) {
|
||||
this.clickUserId = obj.id;
|
||||
this.$store.dispatch('menuOperation/setPopMenu', { position: this.point, menu: DeviceMenu.JointRoom });
|
||||
this.clickUserId = `${obj.id || ''}`;
|
||||
this.$store.dispatch('menuOperation/setPopMenu', { position, menu: DeviceMenu.JointRoom });
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -15,13 +15,31 @@
|
||||
<i v-if="userId == room.creatorId" class="el-icon-close delete" @click="handleDelUser(node, index)" />
|
||||
<div v-if="hasDevice" style="float: right; margin-right: 15px;">
|
||||
<el-cascader
|
||||
v-if="roleType == 'IBP'"
|
||||
v-model="node.deviceCode"
|
||||
size="mini"
|
||||
:placeholder="$t('global.choose')"
|
||||
:disabled="userId != room.creatorId"
|
||||
:disabled="isDisable"
|
||||
:options="deviceList"
|
||||
@change="handleSetUser(node, index)"
|
||||
@change="handleUpdUser(node, index)"
|
||||
/>
|
||||
<el-select
|
||||
v-if="roleType == 'Attendant'"
|
||||
v-model="node.deviceCode"
|
||||
:placeholder="$t('global.choose')"
|
||||
size="mini"
|
||||
:disabled="isDisable"
|
||||
@change="handleUpdUser(node, index)"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in deviceList"
|
||||
:key="item.code"
|
||||
:label="item.name"
|
||||
:value="item.code"
|
||||
:disabled="item.disabled"
|
||||
style="margin-left: 10px"
|
||||
/>
|
||||
</el-select>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
@ -37,10 +55,6 @@ export default {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
userId: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
room: {
|
||||
type:Object,
|
||||
required: true
|
||||
@ -66,16 +80,24 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
hasDevice() {
|
||||
return ['Driver', 'Attendant', 'IBP'].includes(this.roleType);
|
||||
return ['Attendant', 'IBP'].includes(this.roleType);
|
||||
},
|
||||
isDisable() {
|
||||
return this.userId != this.room.creatorId;
|
||||
},
|
||||
userId() {
|
||||
return this.$store.state.user ? this.$store.state.user.id : '';
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleAddUser() {
|
||||
this.$emit('addUser', this.roleType);
|
||||
this.$emit('addUser', { roleType: this.roleType });
|
||||
},
|
||||
handleSetUser(node, index) {
|
||||
handleUpdUser(node, index) {
|
||||
this.$emit('changeUser', { roleType: this.roleType, user: node, deviceList: this.deviceList });
|
||||
},
|
||||
handleDelUser(node, index) {
|
||||
this.$emit('delUser', { roleType: this.roleType, user: node, deviceList: this.deviceList });
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -12,13 +12,80 @@
|
||||
<div class="roles__container">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: rolesHeight+'px', width: '100%'}">
|
||||
<div class="roles">
|
||||
<e-role class="role" :user-id="userId" :room="room" :options="dispatcherList" title-i18n="trainRoom.dispatcher" role-type="Dispatcher" @addUser="handleAddUser" />
|
||||
<e-role class="role" :user-id="userId" :room="room" :options="attendantList" title-i18n="trainRoom.stationAttendant" role-type="Attendant" @addUser="handleAddUser" />
|
||||
<e-role class="role" :user-id="userId" :room="room" :options="instructorList" title-i18n="trainRoom.teacher" role-type="Instructor" @addUser="handleAddUser" />
|
||||
<e-role class="role" :user-id="userId" :room="room" :options="repairList" title-i18n="trainRoom.universalAccount" role-type="Repair" @addUser="handleAddUser" />
|
||||
<e-role class="role" :user-id="userId" :room="room" :options="driverList" title-i18n="trainRoom.driver" role-type="Driver" @addUser="handleAddUser" />
|
||||
<e-role class="role" :user-id="userId" :room="room" :options="ibpList" title-i18n="trainRoom.ibp" role-type="IBP" @addUser="handleAddUser" />
|
||||
<e-device class="role" :user-id="userId" :room="room" :options="realDeviceList" title-i18n="trainRoom.realDevice" :has-plc="hasPlc" @addDevice="handleDeviceUser" />
|
||||
<e-role
|
||||
class="role"
|
||||
title-i18n="trainRoom.dispatcher"
|
||||
role-type="Dispatcher"
|
||||
:room="room"
|
||||
:options="dispatcherList"
|
||||
@addUser="handleAddUser"
|
||||
@changeUser="handleUpdUser"
|
||||
@delUser="handleDelUser"
|
||||
/>
|
||||
<e-role
|
||||
class="role"
|
||||
title-i18n="trainRoom.stationAttendant"
|
||||
role-type="Attendant"
|
||||
:room="room"
|
||||
:options="attendantList"
|
||||
:device-list="stationListForAttendant"
|
||||
@addUser="handleAddUser"
|
||||
@changeUser="handleUpdUser"
|
||||
@delUser="handleDelUser"
|
||||
/>
|
||||
<e-role
|
||||
class="role"
|
||||
title-i18n="trainRoom.teacher"
|
||||
role-type="Instructor"
|
||||
:room="room"
|
||||
:options="instructorList"
|
||||
@addUser="handleAddUser"
|
||||
@changeUser="handleUpdUser"
|
||||
@delUser="handleDelUser"
|
||||
/>
|
||||
<e-role
|
||||
class="role"
|
||||
title-i18n="trainRoom.universalAccount"
|
||||
role-type="Repair"
|
||||
:room="room"
|
||||
:options="repairList"
|
||||
@addUser="handleAddUser"
|
||||
@changeUser="handleUpdUser"
|
||||
@delUser="handleDelUser"
|
||||
/>
|
||||
<e-role
|
||||
class="role"
|
||||
title-i18n="trainRoom.driver"
|
||||
role-type="Driver"
|
||||
:room="room"
|
||||
:options="driverList"
|
||||
@addUser="handleAddUser"
|
||||
@changeUser="handleUpdUser"
|
||||
@delUser="handleDelUser"
|
||||
/>
|
||||
<e-role
|
||||
class="role"
|
||||
title-i18n="trainRoom.ibp"
|
||||
role-type="IBP"
|
||||
:room="room"
|
||||
:options="ibpList"
|
||||
:device-list="stationListForIBP"
|
||||
@addUser="handleAddUser"
|
||||
@changeUser="handleUpdUser"
|
||||
@delUser="handleDelUser"
|
||||
/>
|
||||
<e-device
|
||||
class="role"
|
||||
title-i18n="trainRoom.realDevice"
|
||||
device-type="StationStand"
|
||||
:room="room"
|
||||
:options="standList"
|
||||
:device-list="doorList"
|
||||
:has-plc="hasPlc"
|
||||
@addDevice="handleAddDevice"
|
||||
@changeDevice="handleUpdDevice"
|
||||
@delDevice="handleDelDevice"
|
||||
/>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
@ -34,7 +101,8 @@
|
||||
</template>
|
||||
<el-button type="" @click="handleBack">{{ $t('global.back') }}</el-button>
|
||||
</div>
|
||||
<add-person ref="addPerson" :audience-list="audienceList" @dispatch="handleDispatch" />
|
||||
<add-person ref="addPerson" :audience-list="audienceList" @dispatch="handleDispatchUser" />
|
||||
<qr-code ref="qrCode" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -42,18 +110,18 @@
|
||||
import eRole from './e-role';
|
||||
import eDevice from './e-device';
|
||||
import AddPerson from './add-person';
|
||||
import QrCode from '@/components/QrCode';
|
||||
import { getJoinTrainCode, startJointTraining, deljointTrainRoom, putJointTrainingExit, putJointTrainingSimulation, putUserRoles, setRealDevice, delRealDevice } from '@/api/chat';
|
||||
import { getPlcGateway } from '@/api/simulation';
|
||||
|
||||
export default {
|
||||
components : {
|
||||
eRole,
|
||||
eDevice,
|
||||
AddPerson
|
||||
AddPerson,
|
||||
QrCode
|
||||
},
|
||||
props: {
|
||||
userId: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
room: {
|
||||
type: Object,
|
||||
required: true
|
||||
@ -65,83 +133,240 @@ export default {
|
||||
height: {
|
||||
type: Number,
|
||||
required: true
|
||||
},
|
||||
stationList: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [];
|
||||
}
|
||||
},
|
||||
standList: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [];
|
||||
}
|
||||
},
|
||||
doorList: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [];
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
starting: false,
|
||||
hasPlc: false
|
||||
// dispatcherList: [],
|
||||
// attendantList: [],
|
||||
// instructorList: [],
|
||||
// repairList: [],
|
||||
// driverList: [],
|
||||
// ibpList: [],
|
||||
// audienceList: [],
|
||||
// realDeviceList: []
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
rolesHeight() {
|
||||
return this.height - 100;
|
||||
},
|
||||
group() {
|
||||
return this.$route.query.group;
|
||||
},
|
||||
userId() {
|
||||
return this.$store.state.user ? this.$store.state.user.id : '';
|
||||
},
|
||||
starting() {
|
||||
return this.room.state == '02';
|
||||
},
|
||||
stationListForAttendant() {
|
||||
return this.stationList.filter(elem => { return elem.centralized; }).map(item => {
|
||||
const elem = { code: item.code, name: item.name, disabled: false };
|
||||
this.attendantList.forEach(nor => {
|
||||
if (elem.code == nor.deviceCode) {
|
||||
elem.disabled = true;
|
||||
}
|
||||
});
|
||||
return elem;
|
||||
});
|
||||
},
|
||||
stationListForIBP() {
|
||||
return this.stationList.map(item => {
|
||||
const elem = { value: item.code, label: item.name, children: [{value: 'left', label: this.$t('trainRoom.left')}, {value: 'right', label: this.$t('trainRoom.right')}] };
|
||||
return elem;
|
||||
});
|
||||
},
|
||||
dispatcherList() {
|
||||
return this.members.filter(elem => { return elem.role.includes('Dispatcher'); });
|
||||
return this.members.filter(elem => { return [elem.userRole].includes('Dispatcher'); });
|
||||
},
|
||||
attendantList() {
|
||||
return this.members.filter(elem => { return elem.role.includes('Attendant'); });
|
||||
return this.members.filter(elem => { return [elem.userRole].includes('Attendant'); });
|
||||
},
|
||||
instructorList() {
|
||||
return this.members.filter(elem => { return elem.role.includes('Instructor'); });
|
||||
return this.members.filter(elem => { return [elem.userRole].includes('Instructor'); });
|
||||
},
|
||||
repairList() {
|
||||
return this.members.filter(elem => { return elem.role.includes('Repair'); });
|
||||
return this.members.filter(elem => { return [elem.userRole].includes('Repair'); });
|
||||
},
|
||||
driverList() {
|
||||
return this.members.filter(elem => { return elem.role.includes('Drive'); });
|
||||
return this.members.filter(elem => { return [elem.userRole].includes('Driver'); });
|
||||
},
|
||||
ibpList() {
|
||||
return this.members.filter(elem => { return elem.role.includes('IBP'); });
|
||||
return this.members.filter(elem => { return [elem.userRole].includes('IBP'); });
|
||||
},
|
||||
audienceList() {
|
||||
return this.members.filter(elem => { return elem.role.includes('Audience'); });
|
||||
},
|
||||
realDeviceList() {
|
||||
return [];
|
||||
return this.members.filter(elem => { return [elem.userRole].includes('Audience'); });
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
async mounted() {
|
||||
await this.checkPlcGateway();
|
||||
},
|
||||
methods: {
|
||||
async checkPlcGateway() {
|
||||
try {
|
||||
const resp = await getPlcGateway(this.group);
|
||||
this.hasPlc = !!resp.data;
|
||||
} catch (e) {
|
||||
this.hasPlc = false;
|
||||
this.$messageBox(this.$t('error.inquiryPLCDeviceFailed'));
|
||||
}
|
||||
},
|
||||
async handlePostQrcode() {
|
||||
|
||||
this.loading = true;
|
||||
const res = await getJoinTrainCode({}, this.group);
|
||||
if (res.code == '200') {
|
||||
const param = {
|
||||
url: res.data,
|
||||
title: this.$t('trainRoom.distributeTheRoomQRCode')
|
||||
};
|
||||
if (this.$refs) {
|
||||
this.$refs.qrCode.doShow(param);
|
||||
}
|
||||
}
|
||||
this.loading = false;
|
||||
},
|
||||
async handleJoinTraining() {
|
||||
|
||||
this.$emit('joinTraining');
|
||||
},
|
||||
async handleDeviceUser(params) {
|
||||
async handleAddDevice({deviceType}) {
|
||||
const roomDeviceVo = {id: '', deviceType: 'ScreenDoor', deviceCode: ''};
|
||||
if (this.standList.findIndex(elem => { return elem.deviceType == roomDeviceVo.deviceType; }) > -1) {
|
||||
this.$message.info(this.$t('error.theDeviceTypeAlreadyExists'));
|
||||
return;
|
||||
}
|
||||
|
||||
await setRealDevice(this.group, roomDeviceVo);
|
||||
},
|
||||
async handleAddUser(roleType) {
|
||||
async handleUpdDevice({deviceType, device}) {
|
||||
try {
|
||||
await setRealDevice(this.group, device);
|
||||
} catch (e) {
|
||||
this.$messageBox(this.$t('error.connectToRealDeviceFailed'));
|
||||
}
|
||||
},
|
||||
async handleDelDevice({deviceType, device}) {
|
||||
try {
|
||||
await delRealDevice(device.id, this.group);
|
||||
} catch (e) {
|
||||
this.$messageBox(this.$t('error.deleteRealDeviceFailed'));
|
||||
}
|
||||
},
|
||||
async handleAddUser({roleType}) {
|
||||
this.$refs.addPerson.doShow(roleType);
|
||||
},
|
||||
async handleDispatch() {
|
||||
async handleDelUser({roleType, user}) {
|
||||
const params = [{
|
||||
id: user.id,
|
||||
nickName: user.nickName,
|
||||
userRole: 'Audience',
|
||||
deviceCode: ''
|
||||
}];
|
||||
|
||||
await putUserRoles(params, this.group);
|
||||
},
|
||||
async handleUpdUser({roleType, user, deviceList}) {
|
||||
let deviceCode = '';
|
||||
if (roleType === 'IBP') {
|
||||
user.ibpPart = user.deviceCode[1];
|
||||
deviceCode = user.deviceCode[0];
|
||||
} else {
|
||||
user.ibpPart = '';
|
||||
deviceCode = user.deviceCode;
|
||||
}
|
||||
|
||||
const params = [{
|
||||
id: user.id,
|
||||
nickName: user.nickName,
|
||||
userRole: roleType,
|
||||
deviceCode: deviceCode,
|
||||
ibpPart: user.ibpPart
|
||||
}];
|
||||
|
||||
await putUserRoles(params, this.group);
|
||||
|
||||
this.stationList.forEach(item => {
|
||||
item.disabled = false;
|
||||
deviceList.forEach(nor => {
|
||||
if (item.code === nor.deviceCode) {
|
||||
item.disabled = true;
|
||||
}
|
||||
});
|
||||
});
|
||||
},
|
||||
async handleDispatchUser({roleType, userList}) {
|
||||
const list = userList.map(elem => { return { id: elem.id, nickName: elem.nickName, userRole: roleType }; });
|
||||
if (list.length) {
|
||||
try {
|
||||
await putUserRoles(list, this.group);
|
||||
list.forEach(item => {
|
||||
this.treeData.forEach(nor => {
|
||||
if (item.id == nor.id) {
|
||||
nor.userRole = item.userRole;
|
||||
}
|
||||
});
|
||||
});
|
||||
} catch (error) {
|
||||
if (error.code == 500009) {
|
||||
this.messageInfo({error:'error', message: this.$t('error.exceededTheTotalNumberOfAssignableRoles')} );
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
async handleStart() {
|
||||
|
||||
this.loading = true;
|
||||
if (this.attendantList.findIndex(item => { return !item.deviceCode; }) < 0) {
|
||||
try {
|
||||
await startJointTraining(this.group);
|
||||
this.loading = false;
|
||||
} catch (error) {
|
||||
this.$emit('message', {type:'error', message: this.$t('error.startedComprehensiveDrillFailure')});
|
||||
this.loading = false;
|
||||
}
|
||||
} else {
|
||||
this.$emit('message', {type:'error', message: this.$t('error.stationAttendantStationCannotBeEmpty')});
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
async handleStop() {
|
||||
|
||||
this.loading = true;
|
||||
const res = await putJointTrainingSimulation(this.group);
|
||||
this.mapId = res.data.mapId;
|
||||
if (res.data.state == '01') {
|
||||
this.starting = false;
|
||||
}
|
||||
this.loading = false;
|
||||
},
|
||||
async handleExit() {
|
||||
|
||||
this.loading = false;
|
||||
this.$confirm( this.$t('tip.destroyRoomHint'), this.$t('tip.hint'), {
|
||||
confirmButtonText: this.$t('global.confirm'),
|
||||
cancelButtonText: this.$t('global.cancel'),
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
try {
|
||||
await deljointTrainRoom(this.group);
|
||||
} catch (error) {
|
||||
this.$emit('message', {type:'error', message: this.$t('error.destroyedRoomFailed')});
|
||||
}
|
||||
});
|
||||
},
|
||||
async handleBack() {
|
||||
try {
|
||||
this.loading = true;
|
||||
// 调用仿真退出接口
|
||||
await putJointTrainingExit(this.group);
|
||||
this.loading = false;
|
||||
if (this.$route.query.subSystem) {
|
||||
this.$router.push({ path: `/trainingPlatform/detail/${this.$route.query.subSystem}`, query: {mapId: this.room.mapId}});
|
||||
@ -149,7 +374,7 @@ export default {
|
||||
this.$router.go(-1);
|
||||
}
|
||||
} catch (error) {
|
||||
this.messageInfo( this.$t('error.operationFailure'), 'error');
|
||||
this.$emit('message', {type:'error', message: this.$t('error.operationFailure')});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,13 +5,35 @@
|
||||
{{ $t('trainRoom.comprehensiveDrillRoom') }}
|
||||
</div>
|
||||
<div class="room__head--notes">
|
||||
{{ $t('trainRoom.comprehensiveTrainingManager') + room.creator }}
|
||||
{{ $t('trainRoom.comprehensiveTrainingManager') + room.creator.nickName }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="room__container">
|
||||
<e-members class="room__container--members" :user-id="userId" :room="room" :members="members" :height="height" />
|
||||
<e-roles class="room__container--roles" :user-id="userId" :room="room" :members="members" :height="height" />
|
||||
<e-chat class="room__container--chat" :user-id="userId" :room="room" :members="members" :height="height" />
|
||||
<e-members
|
||||
class="room__container--members"
|
||||
:room="room"
|
||||
:members="members"
|
||||
:height="height"
|
||||
@message="messageInfo"
|
||||
/>
|
||||
<e-roles
|
||||
class="room__container--roles"
|
||||
:room="room"
|
||||
:members="members"
|
||||
:height="height"
|
||||
:station-list="stationList"
|
||||
:stand-list="standList"
|
||||
:door-list="doorList"
|
||||
@message="messageInfo"
|
||||
@joinTraining="jumpInSimulation"
|
||||
/>
|
||||
<e-chat
|
||||
class="room__container--chat"
|
||||
:room="room"
|
||||
:members="members"
|
||||
:height="height"
|
||||
@message="messageInfo"
|
||||
/>
|
||||
</div>
|
||||
<div class="room__footer" />
|
||||
</div>
|
||||
@ -21,8 +43,11 @@
|
||||
import eMembers from './e-members';
|
||||
import eChat from './e-chat';
|
||||
import eRoles from './e-roles';
|
||||
import { postRoomDetail } from '@/api/chat';
|
||||
import { postRoomDetail, getJointTrainRoomUserList, getRealDevices, putJointTrainingSimulationEntrance } from '@/api/chat';
|
||||
import { getPublishMapInfo, hasDoorStationList } from '@/api/jmap/map';
|
||||
import { launchFullscreen } from '@/utils/screen';
|
||||
import { getStationList } from '@/api/runplan';
|
||||
import { checkLoginLine } from '@/api/login';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
@ -33,103 +58,191 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
room: {
|
||||
totalNum: 12,
|
||||
totalNum: 0,
|
||||
group: '',
|
||||
mapId: '',
|
||||
creatorId: 1,
|
||||
creator: 'Ival',
|
||||
permissionRest: 1,
|
||||
permissionNum: 20
|
||||
creatorId: '',
|
||||
creator: {
|
||||
nickName: ''
|
||||
},
|
||||
permissionRest: 0,
|
||||
permissionNum: 0,
|
||||
state: ''
|
||||
},
|
||||
members: [
|
||||
{
|
||||
nickName: 'Ival',
|
||||
inRoom: true,
|
||||
role: 'Instructor'
|
||||
},
|
||||
{
|
||||
nickName: 'Dispatcher',
|
||||
inRoom: true,
|
||||
role: 'Dispatcher'
|
||||
},
|
||||
{
|
||||
nickName: 'Instructor',
|
||||
inRoom: true,
|
||||
role: 'Instructor'
|
||||
},
|
||||
{
|
||||
nickName: 'Attendant',
|
||||
inRoom: true,
|
||||
role: 'Attendant'
|
||||
},
|
||||
{
|
||||
nickName: 'Repair',
|
||||
inRoom: true,
|
||||
role: 'Repair'
|
||||
},
|
||||
{
|
||||
nickName: 'Driver',
|
||||
inRoom: true,
|
||||
role: 'Driver'
|
||||
},
|
||||
{
|
||||
nickName: 'IBP',
|
||||
inRoom: true,
|
||||
role: 'IBP'
|
||||
},
|
||||
{
|
||||
nickName: 'Audience1',
|
||||
inRoom: true,
|
||||
role: 'Audience'
|
||||
},
|
||||
{
|
||||
nickName: 'Audience2',
|
||||
inRoom: true,
|
||||
role: 'Audience'
|
||||
},
|
||||
{
|
||||
nickName: 'Audience3',
|
||||
inRoom: true,
|
||||
role: 'Audience'
|
||||
}
|
||||
],
|
||||
stationList: []
|
||||
userMap: [],
|
||||
members: [],
|
||||
stationList: [],
|
||||
standList: [],
|
||||
doorList: []
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
height() {
|
||||
return this.$store.state.app.height - 100;
|
||||
},
|
||||
group() {
|
||||
return this.$route.query.group;
|
||||
},
|
||||
userId() {
|
||||
if (this.$store.state.user) {
|
||||
return this.$store.state.user.id;
|
||||
}
|
||||
return '';
|
||||
return this.$store.state.user ? this.$store.state.user.id : '';
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
await this.handleGetRoomInfo();
|
||||
watch: {
|
||||
members: {
|
||||
deep: true,
|
||||
handler() {
|
||||
this.room.permissionRest = this.members.filter(elem => ['Audience'].includes(elem.userRole)).length;
|
||||
}
|
||||
},
|
||||
// 用户信息
|
||||
'$store.state.socket.roleList': async function (val) {
|
||||
if (val.length) {
|
||||
await this.dispatchUsers(val);
|
||||
}
|
||||
},
|
||||
// 房间消息
|
||||
'$store.state.socket.jointRoomInfo': async function (val) {
|
||||
if (val.creatorId) {
|
||||
await this.dispatchRoomInfo(val);
|
||||
}
|
||||
},
|
||||
// 设备信息
|
||||
'$store.state.socket.realDeviceInfo': async function (val) {
|
||||
await this.getStandList();
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
await this.getRoomInfo();
|
||||
await this.getUserList();
|
||||
await this.getStandList();
|
||||
await this.getStaionList(this.room.mapId);
|
||||
await this.getDoorList(this.room.mapId, this.stationList);
|
||||
this.timeDemon = setInterval(() => {
|
||||
checkLoginLine();
|
||||
}, 5000 * 60);
|
||||
},
|
||||
methods: {
|
||||
async handleGetRoomInfo() {
|
||||
// 获取房间信息 创建人和权限总数
|
||||
const res = await postRoomDetail(this.$route.query.group);
|
||||
this.starting = res.data.state == '02';
|
||||
|
||||
async getRoomInfo() {
|
||||
const resp = await postRoomDetail(this.group);
|
||||
this.room = {
|
||||
mapId: res.data.mapId,
|
||||
creatorId: res.data.creatorId,
|
||||
totalNum: Number(res.data.permissionNum) + Number(res.data.audiencePermissionNum),
|
||||
creator: res.data.creator.nickName,
|
||||
group: res.data.group,
|
||||
audienceNum: res.data.audiencePermissionNum,
|
||||
permissionNum: res.data.permissionNum,
|
||||
permissionRest: 10
|
||||
permissionRest: 0,
|
||||
totalNum: Number(resp.data.permissionNum) + Number(resp.data.audiencePermissionNum),
|
||||
...resp.data || {}
|
||||
};
|
||||
},
|
||||
async getStandList() {
|
||||
const resp = await getRealDevices(this.group);
|
||||
this.standList = resp.data || [];
|
||||
},
|
||||
async getStaionList(mapId) {
|
||||
const resp = await getStationList(mapId);
|
||||
this.stationList = resp.data || [];
|
||||
},
|
||||
async getDoorList(mapId, stationList) {
|
||||
const doorList = [];
|
||||
hasDoorStationList(mapId).then(res =>{
|
||||
stationList.forEach(item => {
|
||||
res.data.forEach(it =>{
|
||||
if (item.code === it.stationCode) {
|
||||
const direction = parseInt(it.doorLocationType) % 2 === 0 ? this.$t('trainRoom.uplinkPlatform') : this.$t('trainRoom.downlinkPlatform');
|
||||
doorList.push({code: it.code, name: item.name + direction});
|
||||
}
|
||||
});
|
||||
});
|
||||
this.doorList = doorList;
|
||||
}).catch(() => {
|
||||
this.$messageBox(this.$t('error.getScreenDoorsListFailed'));
|
||||
});
|
||||
},
|
||||
async getUserList() {
|
||||
const res = await getJointTrainRoomUserList(this.group);
|
||||
this.members = (res.data || []).map(elem => { return this.transformUser(elem); });
|
||||
},
|
||||
async dispatchUsers(users) {
|
||||
users.forEach(user => {
|
||||
const index = this.members.findIndex(elem => { return user.id == elem.id; });
|
||||
if (user.userRole) {
|
||||
if (index >= 0) {
|
||||
this.members.splice(index, 1, Object.assign(this.members[index], this.transformUser(user)));
|
||||
this.checkUserState(user, 'upd');
|
||||
} else {
|
||||
this.members.push(this.transformUser(user));
|
||||
this.checkUserState(user, 'add');
|
||||
}
|
||||
} else {
|
||||
this.members.splice(index, 1);
|
||||
this.checkUserState(user, 'del');
|
||||
}
|
||||
});
|
||||
},
|
||||
async dispatchRoomInfo(room) {
|
||||
Object.assign(this.room, room);
|
||||
switch (room.state) {
|
||||
case '03': // 房间销毁
|
||||
this.$router.go(-1);
|
||||
break;
|
||||
case '02': // 开始仿真
|
||||
this.jumpInSimulation();
|
||||
break;
|
||||
}
|
||||
|
||||
// 获取设备集中站
|
||||
const resp = await getStationList(res.data.mapId);
|
||||
this.stationList = resp.data;
|
||||
// 清空房间信息
|
||||
this.$store.dispatch('socket/setJointRoomInfo');
|
||||
},
|
||||
async checkUserState(user, operate) {
|
||||
switch (operate) {
|
||||
case 'add':
|
||||
this.$store.dispatch('socket/setChatContent', {roomTip: `${user.nickName}进入房间`});
|
||||
break;
|
||||
case 'upd':
|
||||
if (!user.inRoom) {
|
||||
this.$store.dispatch('socket/setChatContent', {roomTip: `${user.nickName}退出房间`});
|
||||
if (this.userId == user.id) {
|
||||
this.jumpOutRoom();
|
||||
}
|
||||
}
|
||||
|
||||
if (user.inSimulation) {
|
||||
this.$store.dispatch('socket/setChatContent', {roomTip: `${user.nickName}进入仿真`});
|
||||
if (this.userId == user.id) {
|
||||
this.jumpInSimulation();
|
||||
}
|
||||
}
|
||||
break;
|
||||
case 'del':
|
||||
this.$store.dispatch('socket/setChatContent', {roomTip: `${user.nickName}被提出房间`});
|
||||
if (this.userId == user.id) {
|
||||
this.jumpOutRoom();
|
||||
}
|
||||
break;
|
||||
}
|
||||
},
|
||||
async jumpInSimulation() {
|
||||
const room = this.room;
|
||||
await putJointTrainingSimulationEntrance(room.group);
|
||||
const rest = await getPublishMapInfo(room.mapId);
|
||||
const query = { skinCode: rest.data.skinCode, mapId: room.mapId, group: room.group, subSystem: this.$route.query.subSystem };
|
||||
this.$router.replace({ path: `/jointTraining`, query: query });
|
||||
launchFullscreen();
|
||||
// 清空房间信息
|
||||
this.$store.dispatch('socket/setJointRoomInfo');
|
||||
},
|
||||
async jumpOutRoom() {
|
||||
this.$router.push({ path: `/` });
|
||||
this.messageInfo({error: 'warning', message: this.$t('tip.beKickedOut')});
|
||||
},
|
||||
transformUser(user) {
|
||||
// 根据用户角色专用数据数据
|
||||
switch (user.userRole) {
|
||||
case 'IBP':
|
||||
user.deviceCode = [user.deviceCode || '', user.ibpPart || ''];
|
||||
break;
|
||||
}
|
||||
|
||||
return user;
|
||||
},
|
||||
messageInfo(info) {
|
||||
this.$message({ showClose: true, ...info });
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -1,85 +0,0 @@
|
||||
<template>
|
||||
<div class="jointRoomMenu">
|
||||
<pop-menu ref="popMenu" :menu="menu" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PopMenu from '@/components/PopMenu';
|
||||
import { DeviceMenu } from '@/scripts/ConstDic';
|
||||
import { putJointTrainingUserkicked } from '@/api/chat';
|
||||
|
||||
export default {
|
||||
name: 'TrainingOperateMenu',
|
||||
components: {
|
||||
PopMenu
|
||||
},
|
||||
props: {
|
||||
point: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
clickUserId: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
menu: [],
|
||||
menuShow: [
|
||||
{
|
||||
label: this.$t('trainRoom.kickOutTheRoom'),
|
||||
handler: this.kicked
|
||||
}
|
||||
],
|
||||
userId: ''
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'$store.state.menuOperation.menuCount': function (val) {
|
||||
if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.JointRoom)) {
|
||||
this.doShow(this.$store.state.menuOperation.menuPosition);
|
||||
} else {
|
||||
this.doClose();
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.userId = this.$store.state.user.id;
|
||||
this.closeEvent();
|
||||
},
|
||||
methods: {
|
||||
closeEvent() {
|
||||
const self = this;
|
||||
window.onclick = function (e) {
|
||||
self.doClose();
|
||||
};
|
||||
},
|
||||
doShow(point) {
|
||||
this.closeEvent();
|
||||
if (this.userId != this.clickUserId) {
|
||||
this.menu = this.menuShow;
|
||||
if (this.$refs && this.$refs.popMenu) {
|
||||
this.$refs.popMenu.resetShowPosition(point);
|
||||
}
|
||||
} else {
|
||||
this.menu = [];
|
||||
}
|
||||
|
||||
},
|
||||
doClose() {
|
||||
if (this.$refs && this.$refs.popMenu) {
|
||||
this.$refs.popMenu.close();
|
||||
}
|
||||
},
|
||||
async kicked() {
|
||||
try {
|
||||
await putJointTrainingUserkicked(this.clickUserId, this.$route.query.group);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
Loading…
Reference in New Issue
Block a user