南京二号线调整（未完）
This commit is contained in:
fan
parent
999c0197cf
commit
9b422cd3b9
@ -182,7 +182,7 @@ export default {
|
||||
// 重置jlmap宽高
|
||||
resetSize() {
|
||||
this.$nextTick(() => {
|
||||
this.map && this.map.resize({ width: 1920, height: 960 });
|
||||
this.map && this.map.resize({ width: this.width, height: this.height });
|
||||
});
|
||||
},
|
||||
// 设置显示图层
|
||||
|
||||
@ -8,7 +8,7 @@
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
>
|
||||
<map-visual ref="map" type="troDetail" :device-code="deviceCode" />
|
||||
<map-system-draft ref="mapCanvas" @back="back" />
|
||||
<div style="width: 150px;height: 35px;display: flex;position: absolute; bottom: 60px;left: calc(50% - 75px);z-index: 9999;justify-content: space-between;justify-items: center;">
|
||||
<div class="arrow-button" @click="changeStation(-1)"><i class="el-icon-back" /></div>
|
||||
<div class="arrow-button" @click="goTroDialog"><i class="el-icon-top" /><i class="el-icon-top" /></div>
|
||||
@ -18,12 +18,13 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import MapVisual from './mapVisual';
|
||||
// import MapVisual from './mapVisual';
|
||||
import MapSystemDraft from '@/views/newMap/mapsystemNew/index';
|
||||
|
||||
export default {
|
||||
name: 'TRO',
|
||||
components: {
|
||||
MapVisual
|
||||
MapSystemDraft
|
||||
},
|
||||
props: {
|
||||
stationList: {
|
||||
@ -44,27 +45,25 @@ export default {
|
||||
},
|
||||
title() {
|
||||
return '轨道详览';
|
||||
},
|
||||
width() {
|
||||
return this.$store.state.app.width - 30;
|
||||
},
|
||||
height() {
|
||||
return this.$store.state.app.height - 60;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
doShow(deviceCode) {
|
||||
this.dialogShow = true;
|
||||
this.$store.dispatch('config/resize', { width:this.width, height: this.height });
|
||||
this.deviceCode = deviceCode;
|
||||
this.$nextTick(function() {
|
||||
const map = this.$store.state.map.map;
|
||||
const data = {
|
||||
sectionList: map.sectionList,
|
||||
scaling: map.scaling,
|
||||
skinVO: map.skinVO,
|
||||
stationList: map.stationList,
|
||||
origin: map.origin,
|
||||
bigScreenConfig: map.bigScreenConfig,
|
||||
switchList: map.switchList
|
||||
};
|
||||
this.mapData = JSON.parse(JSON.stringify(data));
|
||||
this.$refs.map.loadData(this.mapData, {showMode: '02'});
|
||||
this.$store.state.map.map = Object.assign({}, this.$store.state.map.map);
|
||||
this.$refs.mapCanvas.setCenter(this.deviceCode);
|
||||
});
|
||||
},
|
||||
back() {},
|
||||
doClose() {
|
||||
this.loading = false;
|
||||
this.dialogShow = false;
|
||||
@ -81,7 +80,7 @@ export default {
|
||||
});
|
||||
if (station) {
|
||||
this.deviceCode = station.code;
|
||||
this.$refs.map.setCenter(this.deviceCode);
|
||||
this.$refs.mapCanvas.setCenter(this.deviceCode);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,13 +1,13 @@
|
||||
<template>
|
||||
<div class="menus" :style="{width: width + 'px'}">
|
||||
<menu-bar v-if="$store.state.training.prdType === '01' || $store.state.training.prdType === '02'" ref="menuBar" :selected="selected" :loginActive="loginActive" :isIgnoreLogin="isIgnoreLogin" @login="login" />
|
||||
<menu-bar v-if="$store.state.training.prdType === '01'" ref="menuBar" :selected="selected" :login-active="loginActive" :is-ignore-login="isIgnoreLogin" @login="login" />
|
||||
<menu-train ref="menuTrain" :selected="selected" />
|
||||
<menu-station-stand ref="menuStationStand" :selected="selected" />
|
||||
<menu-signal ref="menuSignal" :selected="selected" />
|
||||
<menu-switch ref="menuSwitch" :selected="selected" />
|
||||
<menu-section ref="menuSection" :selected="selected" />
|
||||
<menu-station ref="menuStation" :selected="selected" />
|
||||
<menu-button v-if="isShowButton" ref="menuButton" :selected="selected" :loginActive="loginActive" :isIgnoreLogin="isIgnoreLogin" :inputStr="inputStr" />
|
||||
<menu-button v-if="isShowButton" ref="menuButton" :selected="selected" :login-active="loginActive" :is-ignore-login="isIgnoreLogin" :input-str="inputStr" />
|
||||
<passive-alarm ref="passiveAlarm" />
|
||||
<passive-contorl ref="passiveControl" pop-class="haerbin-01__systerm" />
|
||||
<passive-Timeout ref="passiveTimeout" />
|
||||
@ -55,7 +55,7 @@ export default {
|
||||
return {
|
||||
loginActive: false,
|
||||
inputStr: ''
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('config', [
|
||||
@ -67,7 +67,7 @@ export default {
|
||||
isIgnoreLogin() {
|
||||
return /jointTrainingNew/.test(this.$route.path) ||
|
||||
/scriptDisplayNew/.test(this.$route.path) ||
|
||||
/displayNew\/[teach|exam|manage]/.test(this.$route.path)
|
||||
/displayNew\/[teach|exam|manage]/.test(this.$route.path);
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
@ -82,7 +82,7 @@ export default {
|
||||
},
|
||||
methods: {
|
||||
login(inputStr) {
|
||||
this.loginActive = !!inputStr
|
||||
this.loginActive = !!inputStr;
|
||||
this.inputStr = inputStr;
|
||||
}
|
||||
}
|
||||
|
||||
@ -261,7 +261,8 @@ export default {
|
||||
'order'
|
||||
]),
|
||||
...mapGetters('map', [
|
||||
'stationList'
|
||||
'stationList',
|
||||
'trainList'
|
||||
]),
|
||||
userId() {
|
||||
return this.$store.state.user ? this.$store.state.user.id : '';
|
||||
|
||||
@ -34,6 +34,7 @@ const Jlmap3dOtherVR = () => import('@/views/jlmap3d/maintainer/jl3dothervr');
|
||||
|
||||
const DisplayNew = () => import('@/views/newMap/displayNew/index');
|
||||
const DisplayCity = () => import('@/views/newMap/displayCity/index');
|
||||
const DisplayBaSiDi = () => import('@/views/newMap/displayBaSiDi/index');
|
||||
const DesignDisplayNew = () => import('@/views/newMap/displayNew/scriptDisplay/scriptPreview/index');
|
||||
const PracticeDisplay = () => import('@/views/newMap/displayNew/practiceDisplay');
|
||||
const BigLPFStrategy = () => import('@/views/newMap/displayNew/bigLPFStrategy');
|
||||
@ -393,6 +394,11 @@ export const publicAsyncRoute = [
|
||||
component: DisplayCity,
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/displayBaSiDi/:mode',
|
||||
component: DisplayBaSiDi,
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/design/displayNew/:mode',
|
||||
component: DesignDisplayNew,
|
||||
|
||||
@ -249,7 +249,11 @@ export default {
|
||||
if (this.loadingProjectList.includes(this.project)) {
|
||||
this.$store.dispatch('app/transitionAnimations');
|
||||
}
|
||||
if (this.currentPrdType === '02' && this.courseModel.lineCode === '14') {
|
||||
this.$router.push({ path: `/displayBaSiDi/demon`, query: query });
|
||||
} else {
|
||||
this.$router.push({ path: `${UrlConfig.displayNew}/demon`, query: query });
|
||||
}
|
||||
launchFullscreen();
|
||||
}).catch(error=>{
|
||||
if (error.code == 10003) {
|
||||
|
||||
365
src/views/newMap/displayBaSiDi/baSiDi.vue
Normal file
365
src/views/newMap/displayBaSiDi/baSiDi.vue
Normal file
@ -0,0 +1,365 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
:visible.sync="dialogVisible"
|
||||
:close-on-click-modal="false"
|
||||
:close-on-press-escape="false"
|
||||
:show-close="false"
|
||||
width="100%"
|
||||
>
|
||||
<div style="height: 130px;">
|
||||
<div class="haerbin-01__systerm nav">
|
||||
<el-row style="padding: 3px;">
|
||||
<el-col :span="20">
|
||||
<div style="width: calc(100% - 10px);border: 2px solid #DDD9CA;border-radius: 1px;height: 132px;">
|
||||
<el-row style="padding: 4px;">
|
||||
<div class="tip-content-box">
|
||||
<div v-if="tipContent[0]">{{ `${tipContent[0].level}` }}</div>
|
||||
<div v-if="tipContent[0]">{{ `${tipContent[0].time}` }}</div>
|
||||
<div v-if="tipContent[0]">{{ `${tipContent[0].confirm ? '确认': '未确认'}` }}</div>
|
||||
</div>
|
||||
<div class="tip-content-box">
|
||||
<div v-if="tipContent[1]">{{ `${tipContent[1].level}` }}</div>
|
||||
<div v-if="tipContent[1]">{{ `${tipContent[1].time}` }}</div>
|
||||
<div v-if="tipContent[1]">{{ `${tipContent[1].confirm ? '确认': '未确认'}` }}</div>
|
||||
</div>
|
||||
<div class="tip-content-box">
|
||||
<div v-if="tipContent[2]">{{ `${tipContent[2].level}` }}</div>
|
||||
<div v-if="tipContent[2]">{{ `${tipContent[2].time}` }}</div>
|
||||
<div v-if="tipContent[2]">{{ `${tipContent[2].confirm ? '确认': '未确认'}` }}</div>
|
||||
</div>
|
||||
</el-row>
|
||||
<div style="padding: 5px;height:20px;line-height: 20px;border-top: 2px solid #DDD9CA;display: flex;justify-content: space-between;">
|
||||
<div>
|
||||
<div class="div-simulate-button" style="width: 40px;" @click="rpsClick">背投</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">车场</div>
|
||||
<div class="div-simulate-button" style="width: 40px;" @click="troClick">轨道</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">系统</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">列车</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="div-simulate-button" style="width: 40px;">联锁</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">列监</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">运图</div>
|
||||
<div class="div-simulate-button" style="width: 55px;">时刻表</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">编表</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">调度</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">站控</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">计划</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="div-simulate-button" style="width: 40px;">SDM</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="div-simulate-button" style="width: 55px;">管理员</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">职权</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="div-simulate-button" style="width: 40px;">拷屏</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">录放</div>
|
||||
<div class="div-simulate-button" style="width: 40px;">布局</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div style="width: calc(100% - 10px);border: 2px solid #DDD9CA;border-radius: 1px;">
|
||||
<el-row style="margin-top: 20px;margin-bottom: 18px;">
|
||||
<el-col :span="16">
|
||||
<el-row class="button-row">
|
||||
<div style="width: 25px;" class="div-simulate-button" :style="{background:isNoRecoverLevelA || isNoConfirmLevelA?'#F00':'#DDD' }" :class="{'headerBox' :isNoConfirmLevelA}" @click="showHimAlarm('A')">A</div>
|
||||
<div style="width: 25px;" class="div-simulate-button" :style="{background:isNoRecoverLevelB || isNoConfirmLevelB?'#F00':'#DDD' }" :class="{'headerBox' :isNoConfirmLevelB}" @click="showHimAlarm('B')">B</div>
|
||||
<div style="width: 25px;" class="div-simulate-button" :style="{background:isNoRecoverLevelC?'#F00':'#DDD' }" @click="showHimAlarm('C')">C</div>
|
||||
</el-row>
|
||||
<el-row class="button-row" style="margin-top: 20px;">
|
||||
<div style="width: 40px;" class="div-simulate-button" @click="showHimAlarm">报警</div>
|
||||
<div style="width: 40px;" class="div-simulate-button" @click="undeveloped">运图</div>
|
||||
</el-row>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div style="width: 40px;height: 60px;line-height: 60px;" class="div-simulate-button" @click="controlAudio(false)">静音</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row class="button-row" style="margin: 10px 0;">
|
||||
<div style="width: 40px;" class="div-simulate-button" @click="undeveloped">档案</div>
|
||||
<div style="width: 40px;" class="div-simulate-button" @click="undeveloped">归档</div>
|
||||
<div style="width: 40px;" class="div-simulate-button" @click="undeveloped">统计</div>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="2" style="border: 2px solid #DDD9CA;border-radius: 1px;">
|
||||
<el-row style="height: 88px;">
|
||||
<div style="font-size: 15px;color: #000;display: flex;justify-content: space-around;align-items: center;margin-top: 40px;">
|
||||
<span>{{ dateString }}</span>
|
||||
<span>{{ time }}</span>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-row class="button-row" style="margin: 10px 0;">
|
||||
<div style="width: 40px;" class="div-simulate-button" @click="undeveloped">锁屏</div>
|
||||
<div style="width: 40px;" class="div-simulate-button" @click="undeveloped">退出</div>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<alarm-table-hmi ref="alarmTableHmi" />
|
||||
<log-detail ref="logDetail" />
|
||||
<rps-dialog ref="rpsDialog" />
|
||||
<tro-dialog ref="troDialog" @goTroDetail="goTroDetail" />
|
||||
<tro-detail-dialog ref="troDetailDialog" :station-list="stationList" @goTroDialog="troClick" />
|
||||
<audio id="buzzer" controls loop="loop" style="width: 0;height: 0">
|
||||
<source :src="buzzerAudio" type="audio/mpeg">
|
||||
</audio>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import BuzzerAudio from '@/assets/buzzer.mp3';
|
||||
import AlarmTableHmi from '@/jmapNew/theme/nanjing_02/menus/menuDialog/alarmTableHmi';
|
||||
import RpsDialog from '@/jmapNew/theme/nanjing_02/menus/dialog/rps';
|
||||
import TroDialog from '@/jmapNew/theme/nanjing_02/menus/dialog/tro';
|
||||
import TroDetailDialog from '@/jmapNew/theme/nanjing_02/menus/dialog/troDetail';
|
||||
import LogDetail from '@/jmapNew/theme/nanjing_02/menus/menuDialog/logDetail';
|
||||
import { prefixIntrger } from '@/utils/date';
|
||||
export default {
|
||||
name: 'BaSiDi',
|
||||
components: {
|
||||
AlarmTableHmi,
|
||||
RpsDialog,
|
||||
TroDialog,
|
||||
TroDetailDialog,
|
||||
LogDetail
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: true,
|
||||
tipContent: [],
|
||||
buzzerAudio: BuzzerAudio,
|
||||
sound: false,
|
||||
noConfirmMapA: {},
|
||||
noConfirmMapB: {},
|
||||
confirmNoRecoverMapA: {},
|
||||
confirmNoRecoverMapB: {},
|
||||
confirmNoRecoverMapC: {},
|
||||
noConfirmMapAString: '{}',
|
||||
noConfirmMapBString: '{}',
|
||||
confirmNoRecoverMapAString: '{}',
|
||||
confirmNoRecoverMapBString: '{}',
|
||||
confirmNoRecoverMapCString: '{}',
|
||||
time: '00:00:00',
|
||||
dateString: '00.00.0000'
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('training', [
|
||||
'mode',
|
||||
'started',
|
||||
'steps',
|
||||
'order'
|
||||
]),
|
||||
...mapGetters('map', [
|
||||
'stationList',
|
||||
'trainList'
|
||||
]),
|
||||
userId() {
|
||||
return this.$store.state.user ? this.$store.state.user.id : '';
|
||||
},
|
||||
isNoConfirmLevelA() {
|
||||
return this.noConfirmMapAString !== '{}';
|
||||
},
|
||||
isNoConfirmLevelB() {
|
||||
return this.noConfirmMapBString !== '{}';
|
||||
},
|
||||
isNoRecoverLevelA() {
|
||||
return this.confirmNoRecoverMapAString !== '{}';
|
||||
},
|
||||
isNoRecoverLevelB() {
|
||||
return this.confirmNoRecoverMapBString !== '{}';
|
||||
},
|
||||
isNoRecoverLevelC() {
|
||||
return this.confirmNoRecoverMapCString !== '{}';
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.training.initTime': function (initTime) {
|
||||
const date = new Date(initTime);
|
||||
this.initDate(date);
|
||||
},
|
||||
'$store.state.socket.simulationAlarmInfo': function(val) {
|
||||
(val || []).forEach(item => {
|
||||
if (!item.confirmed) {
|
||||
this.tipContent.push(item);
|
||||
this.handleAlarm(item);
|
||||
if (this.tipContent.length > 3) {
|
||||
this.tipContent.shift();
|
||||
}
|
||||
if (item.level === 'A') {
|
||||
this.noConfirmMapA[item.code] = item;
|
||||
this.noConfirmMapAString = JSON.stringify(this.noConfirmMapA);
|
||||
} else if (item.level === 'B') {
|
||||
this.noConfirmMapB[item.code] = item;
|
||||
this.noConfirmMapBString = JSON.stringify(this.noConfirmMapB);
|
||||
}
|
||||
} else if (!item.recovered) {
|
||||
if (item.level === 'A') {
|
||||
delete this.noConfirmMapA[item.code];
|
||||
this.confirmNoRecoverMapA[item.code] = item;
|
||||
this.noConfirmMapAString = JSON.stringify(this.noConfirmMapA);
|
||||
this.confirmNoRecoverMapAString = JSON.stringify(this.confirmNoRecoverMapA);
|
||||
} else if (item.level === 'B') {
|
||||
delete this.noConfirmMapB[item.code];
|
||||
this.confirmNoRecoverMapB[item.code] = item;
|
||||
this.noConfirmMapBString = JSON.stringify(this.noConfirmMapB);
|
||||
this.confirmNoRecoverMapBString = JSON.stringify(this.confirmNoRecoverMapB);
|
||||
} else if (item.level === 'C') {
|
||||
this.confirmNoRecoverMapC[item.code] = item;
|
||||
this.confirmNoRecoverMapCString = JSON.stringify(this.confirmNoRecoverMapC);
|
||||
}
|
||||
} else {
|
||||
if (item.level === 'A') {
|
||||
delete this.noConfirmMapA[item.code];
|
||||
delete this.confirmNoRecoverMapA[item.code];
|
||||
this.noConfirmMapAString = JSON.stringify(this.noConfirmMapA);
|
||||
this.confirmNoRecoverMapAString = JSON.stringify(this.confirmNoRecoverMapA);
|
||||
} else if (item.level === 'B') {
|
||||
delete this.noConfirmMapB[item.code];
|
||||
delete this.confirmNoRecoverMapB[item.code];
|
||||
this.noConfirmMapBString = JSON.stringify(this.noConfirmMapB);
|
||||
this.confirmNoRecoverMapBString = JSON.stringify(this.confirmNoRecoverMapB);
|
||||
} else if (item.level === 'C') {
|
||||
delete this.confirmNoRecoverMapC[item.code];
|
||||
this.confirmNoRecoverMapCString = JSON.stringify(this.confirmNoRecoverMapC);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
undeveloped() {
|
||||
this.doClose();
|
||||
this.$alert(this.$t('menu.menuBar.implemented'), this.$t('global.tips'), {
|
||||
confirmButtonText: this.$t('global.confirm'),
|
||||
callback: action => {
|
||||
}
|
||||
});
|
||||
},
|
||||
showHimAlarm(level) {
|
||||
this.$refs.alarmTableHmi.doShow(level);
|
||||
},
|
||||
controlAudio(val) {
|
||||
const audio = document.getElementById('buzzer');
|
||||
this.sound = val;
|
||||
if (audio !== null) {
|
||||
if (val) {
|
||||
audio.play();
|
||||
} else if (val === false) {
|
||||
audio.pause();
|
||||
}
|
||||
}
|
||||
},
|
||||
rpsClick() {
|
||||
this.$refs.rpsDialog.doShow();
|
||||
},
|
||||
troClick() {
|
||||
this.$refs.troDialog.doShow();
|
||||
},
|
||||
goTroDetail(deviceCode) {
|
||||
this.$refs.troDetailDialog.doShow(deviceCode);
|
||||
},
|
||||
initDate(date) {
|
||||
this.time = `${prefixIntrger(date.getHours(), 2)}:${prefixIntrger(date.getMinutes(), 2)}:${prefixIntrger(date.getSeconds(), 2)}`;
|
||||
const years = date.getFullYear() + '';
|
||||
let months = date.getMonth() + 1 + '';
|
||||
let dates = date.getDate() + '';
|
||||
if (months.length < 2) { months = '0' + months; }
|
||||
if (dates.length < 2) { dates = '0' + dates; }
|
||||
this.dateString = dates + '.' + months + '.' + years;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped rel="stylesheet/scss" lang="scss">
|
||||
@import "src/styles/mixin.scss";
|
||||
$width: 30px;
|
||||
$height: 90px;
|
||||
$menuPadding: 10px;
|
||||
$menuItemHeight: 30px;
|
||||
$menuItemWidth: 190px;
|
||||
$menuItemPadding: 5px;
|
||||
|
||||
.nav {
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
color: #0000;
|
||||
background: -webkit-linear-gradient(#FDFDFE, #DEE3F3);
|
||||
background: -o-linear-gradient(#FDFDFE, #DEE3F3);
|
||||
background: -moz-linear-gradient(#FDFDFE, #DEE3F3);
|
||||
background: linear-gradient(#FDFDFE, #DEE3F3);
|
||||
border: 1px solid #B6BCCC !important;
|
||||
border-bottom: 2px solid #B6BCCC !important;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.div-simulate-button{
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
color: #303030;
|
||||
border: 1px solid #44556D;
|
||||
background: #DDD;
|
||||
text-align: center;
|
||||
border-radius: 1px;
|
||||
width: 80px;
|
||||
}
|
||||
.tip-content-box{
|
||||
height: 30px;
|
||||
width: 100%;
|
||||
line-height: 30px;
|
||||
background: #001528;
|
||||
color: #C20F29;
|
||||
font-size: 14px;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.button-row{
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
display: flex;
|
||||
justify-content:space-between;
|
||||
}
|
||||
@keyframes fade {
|
||||
from {
|
||||
opacity: 1.0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.4;
|
||||
}
|
||||
to {
|
||||
opacity: 1.0;
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes fade {
|
||||
from {
|
||||
opacity: 1.0;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.4;
|
||||
}
|
||||
to {
|
||||
opacity: 1.0;
|
||||
}
|
||||
}
|
||||
|
||||
.headerBox {
|
||||
background: #f00;
|
||||
animation: fade 600ms infinite;
|
||||
-webkit-animation: fade 600ms infinite;
|
||||
}
|
||||
/deep/.el-dialog__body{
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
315
src/views/newMap/displayBaSiDi/index.vue
Normal file
315
src/views/newMap/displayBaSiDi/index.vue
Normal file
@ -0,0 +1,315 @@
|
||||
<template>
|
||||
<div class="main" :style="{width: canvasWidth+'px',height:'100%',position:'absolute',overflow:'hidden'}" style="background: #000;">
|
||||
<!--<template>-->
|
||||
<!--<transition name="el-zoom-in-bottom">-->
|
||||
<!--<map-system-draft ref="mapCanvas" @back="back" />-->
|
||||
<!--</transition>-->
|
||||
<!--</template>-->
|
||||
<!--<menu-train-list v-if="isDemon||isContest||isScript" />-->
|
||||
<!--<menu-system-time ref="menuSystemTime" :offset="offset" :group="group" />-->
|
||||
<ba-si-di ref="baSiDi" />
|
||||
<set-time ref="setTime" @ConfirmSelectBeginTime="start" />
|
||||
<div class="display-draft haerbin_btn_box">
|
||||
<el-button-group class="button-group-box">
|
||||
<template v-if="!dataError">
|
||||
<template v-if="!projectDevice">
|
||||
<el-button type="success" :disabled="isDisable" size="small" @click="selectBeginTime">{{ $t('display.demon.drivingByPlan') }}</el-button>
|
||||
<el-button type="danger" size="small" @click="end">{{ $t('display.demon.initialize') }}</el-button>
|
||||
</template>
|
||||
</template>
|
||||
<el-button type="primary" size="small" @click="back">{{ projectDevice?'退出':$t('display.demon.back') }}</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getSessionStorage } from '@/utils/auth';
|
||||
import { mapGetters } from 'vuex';
|
||||
import { OperateMode } from '@/scripts/ConstDic';
|
||||
import { timeFormat } from '@/utils/date';
|
||||
// import MapSystemDraft from '@/views/newMap/mapsystemNew/index';
|
||||
// import MenuTrainList from '@/views/newMap/displayNew/menuTrainList';
|
||||
// import MenuSystemTime from '@/views/newMap/displayNew/menuSystemTime';
|
||||
import SetTime from '@/views/newMap/displayNew/demon/setTime';
|
||||
import { clearSimulation, getSimulationInfoNew, ranAsPlan, exitRunPlan } from '@/api/simulation';
|
||||
import { loadMapDataById } from '@/utils/loaddata';
|
||||
import { EventBus } from '@/scripts/event-bus';
|
||||
import BaSiDi from './baSiDi';
|
||||
|
||||
export default {
|
||||
name: 'DisplayDraft',
|
||||
components: {
|
||||
// MapSystemDraft
|
||||
BaSiDi,
|
||||
SetTime
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
offset: 15,
|
||||
offsetBottom: 15,
|
||||
tipBottom: 0,
|
||||
textStatusHeight: 0,
|
||||
planRunning:false,
|
||||
dataError: false,
|
||||
group:''
|
||||
};
|
||||
},
|
||||
computed:{
|
||||
...mapGetters([
|
||||
'canvasWidth'
|
||||
]),
|
||||
mode() {
|
||||
return this.$route.params.mode;
|
||||
},
|
||||
project() {
|
||||
return getSessionStorage('project');
|
||||
},
|
||||
isDemon() {
|
||||
return this.mode === 'demon' && this.project != 'drts';
|
||||
},
|
||||
isContest() {
|
||||
return this.mode === 'demon' && this.project == 'drts';
|
||||
},
|
||||
mapId() {
|
||||
return this.$route.query.mapId;
|
||||
},
|
||||
width() {
|
||||
return this.$store.state.app.width;
|
||||
},
|
||||
height() {
|
||||
return this.$store.state.app.height;
|
||||
},
|
||||
projectDevice() {
|
||||
return this.$route.query.projectDevice;
|
||||
},
|
||||
isDisable() {
|
||||
return this.$store.state.training.started;
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
'$store.state.socket.permissionOver': function () {
|
||||
this.$alert('用户权限已被收回', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
callback: action => {
|
||||
this.back();
|
||||
}
|
||||
});
|
||||
},
|
||||
'$store.state.config.menuBarLoadedCount': function (val) { // menuBar加载完成
|
||||
this.setPosition();
|
||||
},
|
||||
'$store.state.app.windowSizeCount': function() { // 窗口缩放
|
||||
this.setWindowSize();
|
||||
},
|
||||
'$store.state.training.prdType': function (val) { // 根据权限类型计算高度
|
||||
this.setPosition();
|
||||
},
|
||||
'$store.state.map.mapViewLoadedCount': function (val) { // 地图视图加载完成标识 开始加载默认状态
|
||||
if (this.planRunning) {
|
||||
this.$store.dispatch('training/simulationStart');
|
||||
}
|
||||
},
|
||||
$route() {
|
||||
if (!this.isLesson && !this.isExam) {
|
||||
this.initLoadData();
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
clearSimulation(this.group);
|
||||
this.$store.dispatch('training/reset');
|
||||
},
|
||||
async mounted() {
|
||||
this.setWindowSize();
|
||||
this.initLoadData();
|
||||
this.$store.dispatch('app/animationsClose');
|
||||
},
|
||||
methods:{
|
||||
// 结束加载状态
|
||||
endViewLoading(isSuccess) {
|
||||
if (!isSuccess) {
|
||||
this.$store.dispatch('map/mapClear');
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
EventBus.$emit('viewLoading', false);
|
||||
});
|
||||
},
|
||||
// 仿真错误时，被动退出时调用
|
||||
async back() {
|
||||
// if (this.isExam) {
|
||||
// await this.$refs.menuExam.back();
|
||||
// } else if (this.isLesson) {
|
||||
// await this.$refs.lessonMenu.back();
|
||||
// } else if (this.isDemon) {
|
||||
// await this.$refs.menuDemon.back();
|
||||
// } else if (this.isScript) {
|
||||
// await this.$refs.menuScript.back();
|
||||
// } else if (this.isContest) {
|
||||
// await this.$refs.menuDispatherContest.back();
|
||||
// }
|
||||
},
|
||||
// 设置各个按钮的定位
|
||||
setPosition() {
|
||||
this.$nextTick(() => {
|
||||
this.offset = 10;
|
||||
this.offsetBottom = 15;
|
||||
const menuBar = document.getElementById('menuBar');
|
||||
const menuTool = document.getElementById('menuTool');
|
||||
const menuBottom = document.getElementById('menuButton');
|
||||
const menuButtonsBox = document.getElementById('menuButtons_box');
|
||||
const textStatus = document.getElementById('textStatus');
|
||||
if (menuBar) {
|
||||
this.offset = (menuBar.offsetHeight || 0) + 15;
|
||||
}
|
||||
if (menuTool) {
|
||||
this.offset = (menuTool.offsetHeight || 0) + 15;
|
||||
}
|
||||
const buttonWidth = this.width - 1200; // B box widht
|
||||
if (menuBottom && buttonWidth < 780) {
|
||||
this.offsetBottom = (menuBottom.offsetHeight || 0) + 15;
|
||||
}
|
||||
if (menuButtonsBox) {
|
||||
this.tipBottom = (menuButtonsBox.offsetHeight || 0) + 15;
|
||||
}
|
||||
if (textStatus) {
|
||||
this.textStatusHeight = textStatus.offsetHeight || 0;
|
||||
textStatus.style.top = this.offset - 15 + 'px';
|
||||
}
|
||||
});
|
||||
},
|
||||
// 缩放设置
|
||||
setWindowSize() {
|
||||
const width = this.width;
|
||||
const height = this.height;
|
||||
this.$store.dispatch('config/resize', { width, height });
|
||||
// this.$store.dispatch('training/updateOffsetStationCode', { offsetStationCode: this.offsetStationCode });
|
||||
},
|
||||
// 初始化
|
||||
initLoadData() {
|
||||
this.group = this.$route.query.group;
|
||||
this.$store.dispatch('training/reset');
|
||||
this.loadSimulationInfo();
|
||||
this.loadMapData();
|
||||
},
|
||||
// 新版地图根据仿真group获取仿真基础信息
|
||||
async loadSimulationInfo() {
|
||||
const resp = await getSimulationInfoNew(this.group);
|
||||
if (resp && resp.code == 200 && resp.data) {
|
||||
if (!resp.data.dataError) {
|
||||
this.$store.dispatch('scriptRecord/updateSimulationPause', resp.data.pause); // 是否暂停判断
|
||||
this.$store.dispatch('training/setInitTime', +new Date(`${new Date().toLocaleDateString()} ${timeFormat(resp.data.systemTime)}`));
|
||||
this.$store.dispatch('training/countTime');
|
||||
this.$store.dispatch('runPlan/setRunPlanInfo', resp.data.runPlan);
|
||||
this.planRunning = resp.data.planRunning;
|
||||
if (resp.data.planRunning) {
|
||||
this.$store.commit('training/start');
|
||||
}
|
||||
} else {
|
||||
this.$messageBox('此地图数据正在维护中,无法运行！');
|
||||
}
|
||||
this.dataError = resp.data.dataError;
|
||||
}
|
||||
},
|
||||
// 通过showMode切换显示效果
|
||||
switchModeInner(swch) {
|
||||
let showMode = '03';
|
||||
if (swch == '01') {
|
||||
showMode = '03';
|
||||
} else if (swch == '02') {
|
||||
showMode = '02';
|
||||
}
|
||||
|
||||
const nameList = Object.keys(this.$store.state.map.map || {});
|
||||
let list = [];
|
||||
nameList.forEach(item => {
|
||||
if (item !== 'skinVO') {
|
||||
const data = this.$store.state.map.map[item];
|
||||
if (data && data.constructor === Array) {
|
||||
list = [...list, ...data];
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (swch == '01') {
|
||||
this.$jlmap.updateShowStation(list, this.$store.state.training.centerStationCode); // 显示全部元素
|
||||
} else {
|
||||
this.$jlmap.updateShowStation(list, ''); // 显示全部元素
|
||||
}
|
||||
|
||||
this.$jlmap.updateShowMode(list, showMode); // 二次过滤
|
||||
},
|
||||
// 加载地图数据
|
||||
loadMapData() {
|
||||
if (parseInt(this.mapId)) {
|
||||
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); // 默认为正常模式
|
||||
loadMapDataById(this.mapId, 'simulation');
|
||||
} else {
|
||||
this.endViewLoading();
|
||||
}
|
||||
},
|
||||
start(model) { // 开始仿真
|
||||
const data = {
|
||||
time: model.initTime
|
||||
};
|
||||
if (this.$route.query.prdType === '04') {
|
||||
data.loadNumber = model.loadNum;
|
||||
}
|
||||
ranAsPlan(data, this.group).then(res => {
|
||||
this.$store.dispatch('training/setInitTime', +new Date(`${new Date().toLocaleDateString()} ${model.initTime}`));
|
||||
}).catch(error => {
|
||||
let message = '';
|
||||
switch (error.code) {
|
||||
case '5001':
|
||||
message = this.$t('error.mapDataError');
|
||||
break;
|
||||
case '5002':
|
||||
message = this.$t('error.runningChartDataError');
|
||||
break;
|
||||
case '5003':
|
||||
message = this.$t('error.runningChartIsNotLoaded');
|
||||
break;
|
||||
case '5004':
|
||||
message = this.$t('error.runningDataError');
|
||||
break;
|
||||
case '5000':
|
||||
message = this.$t('error.systemError');
|
||||
break;
|
||||
case '4000':
|
||||
message = this.$t('error.simulationDoesNotExist');
|
||||
break;
|
||||
case '4001':
|
||||
message = this.$t('error.simulationOperationIsNotDefined');
|
||||
break;
|
||||
case '4002':
|
||||
message = this.$t('error.simulationOperationProcessingMethodNotFound');
|
||||
break;
|
||||
case '4003':
|
||||
message = this.$t('error.simulationOperationFailed');
|
||||
break;
|
||||
case '4004':
|
||||
message = this.$t('error.operationConflict');
|
||||
break;
|
||||
default:
|
||||
message = '按计划行车异常,请退出重试!';
|
||||
// this.$messageBox('按计划行车异常,请退出重试!');
|
||||
break;
|
||||
}
|
||||
this.$messageBox(message + '，' + this.$t('error.startSimulationFailed'));
|
||||
});
|
||||
},
|
||||
end() {
|
||||
exitRunPlan(this.group).then(() => {
|
||||
this.$store.dispatch('training/over').then(() => {
|
||||
this.$store.dispatch('training/setMapDefaultState').then(() => {
|
||||
this.$store.dispatch('map/clearJlmapTrainView');
|
||||
this.$store.dispatch('map/resetActiveTrainList', false);
|
||||
this.$store.dispatch('map/setTrainWindowShow', false);
|
||||
});
|
||||
});
|
||||
}).catch(() => {
|
||||
this.$messageBox(this.$t('display.demon.endSimulationFail'));
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
Loading…
Reference in New Issue
Block a user