新增哈尔滨线路底部栏 操作

This commit is contained in:
zyy 2020-03-18 18:47:37 +08:00
parent a925c568e5
commit 3afa12711e
8 changed files with 336 additions and 14 deletions

View File

@ -2,14 +2,241 @@
<div id="haerbin-01__menuButton">
<div class="haerbin-01__systerm button">
<el-row>
<el-col :span="4" />
<el-col :span="11">
<div class="nav-border">
<el-row class="nav-border-row">
<template v-for="(item, index) in centralizedStationList">
<div :key="index" class="nav-border-row row-width-box flex-row">
<div v-if="item.name" class="fake-button-active" :class="{'active': item.show}" @click="clickCommand(item)">{{ item.name }}</div>
<div v-else class="fake-button" />
</div>
</template>
</el-row>
</div>
</el-col>
<el-col :span="10">
<div class="nav-border">
<div class="nav-border-top">
<el-button class="fl" :class="{'disabled': canCommand}" style="line-height: 18px; margin-top: 4px;" plain :disabled="canCommand" @click="command">执行</el-button>
<el-button class="fr" style="line-height: 18px; margin-top: 4px;" plain>取消</el-button>
</div>
<div class="nav-border-bottom">
<el-table
ref="table"
:data="tempData"
border
:cell-style="tableStyle"
style="width: 100%;background: #E0E0E0;border: none;outline: none;"
size="mini"
height="56"
class="haerbin_table"
highlight-current-row
:show-header="false"
@row-click="clickEvent"
>
<el-table-column prop="name" style="margin-left:10px" class-name="abc" />
</el-table>
</div>
</div>
</el-col>
<el-col :span="3">
<div class="nav-border flex-box">
<el-button style="line-height: 18px; width: 100px; margin: 0;" plain>联锁</el-button>
<el-button style="line-height: 18px; width: 100px; margin: 0;" plain>时刻表</el-button>
<el-button style="line-height: 18px; width: 100px; margin: 0;" plain>ATS</el-button>
</div>
</el-col>
</el-row>
<notice-info ref="noticeInfo" />
</div>
</div>
</template>
<script>
import { mapGetters } from 'vuex';
import { deepAssign } from '@/utils/index';
import NoticeInfo from './dialog/childDialog/childDialog/noticeInfo';
import CMD from '@/scripts/cmdPlugin/CommandEnum';
import { OperationEvent } from '@/scripts/cmdPlugin/OperationHandler';
export default {
components: {
NoticeInfo
},
props: {
selected: {
type: Object,
default() {
return null;
}
}
},
data() {
return {
tempData: [],
canCommand: true,
operate: '',
cmdType: '',
param: {},
tableStyle: {
'border-bottom': 'none',
'border-right': 'none',
'padding': 0
},
oldClickObj: null, //
route: null, //
centralizedStationList: new Array(15).fill({}),
swicthParamList: [
{ name: '封锁道岔', cmdType: CMD.Switch.CMD_SWITCH_BLOCK, operate: OperationEvent.Switch.block.menu.operation, show: false },
{ name: '解封道岔', cmdType: CMD.Switch.CMD_SWITCH_UNBLOCK, operate: OperationEvent.Switch.unblock.menu.operation, show: false },
{ name: '取消锁定', cmdType: CMD.Switch.CMD_SWITCH_SINGLE_UNLOCK, operate: OperationEvent.Switch.unlock.menu.operation, show: false },
{ name: '单锁道岔', cmdType: CMD.Switch.CMD_SWITCH_SINGLE_LOCK, operate: OperationEvent.Switch.lock.menu.operation, show: false },
{ name: '转换定位', cmdType: CMD.Switch.CMD_SWITCH_NORMAL_POSITION, operate: OperationEvent.Switch.locate.menu.operation, show: false },
{ name: '转换反位', cmdType: CMD.Switch.CMD_SWITCH_REVERSE_POSITION, operate: OperationEvent.Switch.reverse.menu.operation, show: false }
],
signalParamList: [
{ name: '追踪单开', cmdType: CMD.Signal.CMD_SIGNAL_SET_CI_AUTO_TRIGGER, operate: OperationEvent.Signal.setAutoTrigger.menu.operation, show: false },
{ name: '追踪单关', cmdType: CMD.Signal.CMD_SIGNAL_CANCEL_CI_AUTO_TRIGGER, operate: OperationEvent.Signal.cancelAutoTrigger.menu.operation, show: false },
{ name: '自排单开', cmdType: CMD.Signal.CMD_SIGNAL_OPEN_AUTO_SETTING, operate: OperationEvent.Signal.atsAutoControl.menu.operation, show: false },
{ name: '自排单关', cmdType: CMD.Signal.CMD_SIGNAL_CLOSE_AUTO_SETTING, operate: OperationEvent.Signal.humanControl.menu.operation, show: false },
{ name: '重复开放', cmdType: CMD.Signal.CMD_SIGNAL_REOPEN_SIGNAL, operate: OperationEvent.Signal.reopenSignal.menu.operation, show: false },
{ name: '封锁信号', cmdType: CMD.Signal.CMD_SIGNAL_BLOCK, operate: OperationEvent.Signal.lock.menu.operation, show: false },
{ name: '解封信号', cmdType: CMD.Signal.CMD_SIGNAL_UNBLOCK, operate: OperationEvent.Signal.unlock.menu.operation, show: false },
{ name: '关单信号', cmdType: CMD.Signal.CMD_SIGNAL_CLOSE_SIGNAL, operate: OperationEvent.Signal.cancelAutoTrigger.menu.operation, show: false }
],
routeParamList: [
{ name: 'ATP进路', cmdType: CMD.Signal.CMD_SIGNAL_SET_ROUTE, operate: OperationEvent.Signal.arrangementRoute.menu.operation, show: false },
{ name: '取消ATP', cmdType: CMD.Signal.CMD_SIGNAL_CANCEL_ROUTE, operate: OperationEvent.Signal.cancelTrainRoute.menu.operation, show: false },
{ name: '联锁进路', cmdType: CMD.Signal.CMD_SIGNAL_SET_ROUTE, operate: OperationEvent.Signal.arrangementRoute.menu.operation, show: false },
{ name: '取消联锁', cmdType: CMD.Signal.CMD_SIGNAL_CANCEL_ROUTE, operate: OperationEvent.Signal.cancelTrainRoute.menu.operation, show: false },
{ name: '引导进路', cmdType: CMD.Signal.CMD_SIGNAL_ROUTE_GUIDE, operate: OperationEvent.Signal.guide.menu.operation, show: false },
{ name: '取消引导', cmdType: CMD.Signal.CMD_SIGNAL_HUMAN_RELEASE_ROUTE, operate: OperationEvent.Signal.humanTrainRoute.menu.operation, show: false }
]
};
},
computed: {
...mapGetters('map', [
'routeList'
])
},
watch: {
'$store.state.menuOperation.setMenuChangeCount': function (val) {
if (this.selected._type) {
this.canCommand = true;
// console.log(this.selected, 'selected');
switch (this.selected._type) {
case 'Switch':
this.handleSwicthMenu();
break;
case 'Signal':
if (this.oldClickObj && this.oldClickObj.code != this.selected.code) {
this.checkSignal();
} else {
this.handleSingalMenu();
}
break;
}
}
}
},
methods: {
clickCommand(row) {
this.clearAllMenuShow();
if (this.tempData.length) {
row.show = true;
this.operate = row.operate;
this.cmdType = row.cmdType;
this.canCommand = false;
}
},
clearAllMenuShow() {
this.centralizedStationList.forEach(item => {
if (item.name) {
item.show = false;
}
});
},
handleSwicthMenu() { //
this.centralizedStationList = new Array(15).fill({});
this.swicthParamList.forEach((swicth, index) => {
this.centralizedStationList[index] = swicth;
});
this.tempData = [];
this.tempData.push(this.selected);
this.param = {
switchCode: this.selected.code
};
},
handleSingalMenu() {
this.oldClickObj = deepAssign({}, this.selected);
this.centralizedStationList = new Array(15).fill({});
this.signalParamList.forEach((swicth, index) => {
this.centralizedStationList[index] = swicth;
});
this.tempData = [];
this.tempData.push(this.selected);
this.param = {
signalCode: this.selected.code
};
},
handleRouteMenu() { //
this.centralizedStationList = new Array(15).fill({});
this.routeParamList.forEach((swicth, index) => {
this.centralizedStationList[index] = swicth;
});
this.tempData = [];
this.tempData.push(this.route);
this.param = {
routeCode: this.route.code
};
},
//
checkSignal() {
this.route = null;
this.routeList.forEach(item => {
if (item.startSignalCode == this.oldClickObj.code && item.endSignalCode == this.selected.code) {
this.route = item;
}
});
if (this.route && this.route.code) {
this.handleRouteMenu();
} else {
this.handleSingalMenu();
}
},
handleParam() {
if (this.operate == OperationEvent.Signal.cancelTrainRoute.menu.operation || this.operate == OperationEvent.Signal.humanTrainRoute.menu.operation) {
this.param = {
signalCode: this.route.startSignalCode
};
}
},
command() {
this.handleParam();
const step = {
over: true,
cmdType: this.cmdType,
operation: this.operate,
param: this.param
};
// console.log(step);
this.$store.dispatch('training/nextNew', step).then(({ valid }) => {
if (valid) {
this.doClose();
}
}).catch((error) => {
this.doClose();
this.$refs.noticeInfo.doShow(step, error.message);
});
},
doClose() {
this.operate = ''; //
this.cmdType = '';
this.oldClickObj = null; //
this.param = {};
this.tempData = []; //
this.canCommand = true; //
this.clearAllMenuShow();
}
}
};
</script>
<style lang="scss">
@ -18,10 +245,88 @@ export default {
bottom: 0;
height: 90px;
width: 100%;
background: #ccc;
background: #E0E0E0;
z-index: 2;
}
// .display-draft{
// bottom:105px !important;
// }
.nav-border {
font-size: 12px;
color: #000;
height: 90px;
text-align: center;
border-top: 2px solid #7E8076;
border-left: 2px solid #6A6B64;
border-right: 2px solid #FBFBFA;
border-bottom: 2px solid #FBFBFA;
}
.nav-border-top{
height: 30px;
padding: 0 20px;
width: 100%;
font-size: 12px;
color: #000;
border-bottom: 2px solid #FBFBFA;
.fl {
float: left;
width: 100px;
&.disabled{
border: none!important;
color: #ccc!important;
}
}
.fr{
float: right;
width: 100px;
}
}
.nav-border-bottom{
height: 56px;
width: 100%;
font-size: 12px;
}
.flex-box{
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
}
.nav-border-row{
height: 29px;
&.row-width-box{
width: 20%;
float: left;
}
}
.flex-row{
display: flex;
justify-content: center;
align-items: center;
}
.fake-button{
width: 80px;
height: 20px;
border-radius: 5px !important;
border: 1px solid #D0CEC5;
box-shadow: -1px 0px 1px #BFBEB7 inset, 1px 0px 1px #BFBEB7 inset, 0px 1px 1px #BFBEB7 inset, 0px -1px 1px #BFBEB7 inset;
}
.fake-button-active{
width: 80px;
height: 20px;
border-radius: 5px !important;
line-height: 18px;
border: 1px solid #426688;
cursor: pointer;
box-shadow: -1px 0px 1px #fff inset, 1px 0px 1px #fff inset, 0px 1px 1px #fff inset, 0px -1px 1px #fff inset;
&:hover, &.active{
background: #b1b1b1;
}
}
.haerbin_table .abc:hover{
background-color:#2b68c3!important;
color: #fff;
}
.haerbin_table .el-table__body tr.current-row .abc{
background-color: #2b68c3!important;
color: #fff;
}
</style>

View File

@ -25,7 +25,7 @@ import MenuContextHandler from '@/scripts/cmdPlugin/MenuContextHandler';
import { mapGetters } from 'vuex';
import { OperationEvent } from '@/scripts/cmdPlugin/OperationHandler';
import { DeviceMenu, OperateMode } from '@/scripts/ConstDic';
import { querySignalStatus } from '@/api/simulation';
// import { querySignalStatus } from '@/api/simulation';
export default {
name: 'SignalMenu',

View File

@ -94,8 +94,8 @@ class MenuContextHandler {
if (control) {
if (this.getPrdType() != '') {
const type = State2SimulationMap[this.getPrdType()];
// const status = State2ControlMap[control.controlMode]; // 判断当前模式
const status = 'LocalStationControl';
const status = State2ControlMap[control.controlMode]; // 判断当前模式
// const status = 'LocalStationControl';
menu = [...menuList[type]];
// 特殊处理站台的右键操作( 因为小站台不允许有操作 )
if (selected._type == 'StationStand') {

View File

@ -13,6 +13,7 @@ const menuOperation = {
selected: {}, // 选中的地图对象
subType: '', // 选中的设备子元素类型
selectedCount: 0, // 选中对象变更标识
setMenuChangeCount: 0, // 哈尔滨线路左键点击变更标识
menu: null, // 弹出菜单设备
menuPosition: {}, // 弹出菜单位置
menuCount: 0, // 弹出菜单变更标识
@ -79,6 +80,11 @@ const menuOperation = {
state.subType = selected.subType;
state.selectedCount += 1;
},
setMenuChange: (state, selected) => {
state.selected = selected.device;
state.subType = selected.subType;
state.setMenuChangeCount += 1;
},
mbmpCountIncrement: (state) => {
state.mbmpCount += 1;
},
@ -175,6 +181,10 @@ const menuOperation = {
setSelected: ({ commit }, selected) => {
commit('setSelected', selected);
},
// 改变哈尔滨底部菜单
setMenuChange: ({ commit }, selected) => {
commit('setMenuChange', selected);
},
/**
* 设置菜单

View File

@ -5,7 +5,7 @@
<span v-if="countTime" class="display-score">{{ $t('display.demon.trialTime') }} {{ countTime }}</span>
</el-row>
</div>
<div class="display-draft">
<div class="display-draft" :class="{'display-type-hb': $route.query.lineCode == '07'}">
<el-button-group>
<el-button v-if="isShowScheduling" type="primary" @click="jumpScheduling">{{ $t('display.demon.dispatchingPlan') }}</el-button>
<el-button type="jumpjlmap3d" @click="jumpjlmap3d">{{ jl3dname }}</el-button>
@ -275,4 +275,7 @@ export default {
right: 20px;
bottom: 15px;
}
.display-type-hb{
bottom: 105px;
}
</style>

View File

@ -105,6 +105,9 @@ export default {
}
this.selected = device;
this.$store.dispatch('menuOperation/setSelected', {device: device, subType: em.subType});
if (this.$route.query.lineCode == '07') {
this.$store.dispatch('menuOperation/setMenuChange', {device: device, subType: em.subType});
}
this.$store.dispatch('training/emitTipFresh');
},

View File

@ -29,7 +29,7 @@
<systerm-out ref="systermOut" />
<add-task ref="addTask" @dispatchOperate="dispatchOperate" @refresh="refresh" />
<delete-task ref="deleteTask" @dispatchOperate="dispatchOperate" @refresh="refresh" />
<modifying-task ref="modifyingTask" @dispatchOperate="dispatchOperate" />
<modifying-task ref="modifyingTask" @dispatchOperate="dispatchOperate" @refresh="refresh" />
<edit-station-between-time ref="editStationBetweenTime" />

View File

@ -409,9 +409,10 @@ export default {
} else {
//
updatePlanTrip(this.buildModel()).then(resp => {
this.$emit('dispatchOperate', {
dialogName: 'openRunPlan', operate: 'loadRunPlanData', params: Object.assign({refresh: true}, this.$route.query)
});
// this.$emit('dispatchOperate', {
// dialogName: 'openRunPlan', operate: 'loadRunPlanData', params: Object.assign({refresh: true}, this.$route.query)
// });
this.$emit('refresh');
this.$message.success(this.$t('planMonitor.modifying.modifyTaskSuccess'));
}).catch(() => {
this.$messageBox(this.$t('planMonitor.modifying.modifyTaskFailed'));