400 lines
17 KiB
Vue
400 lines
17 KiB
Vue
|
<template>
|
|||
|
<el-dialog
|
|||
|
v-dialogDrag
|
|||
|
class="haerbin-01__systerm"
|
|||
|
:title="title"
|
|||
|
:modal="false"
|
|||
|
width="600px"
|
|||
|
:visible.sync="show"
|
|||
|
:before-close="doClose"
|
|||
|
>
|
|||
|
<div style="padding: 0 10px;">
|
|||
|
<el-row>
|
|||
|
<span style="color:#000;font-size: 16px;font-weight: bold;">选择列车</span>
|
|||
|
<hr style="display: inline-block;width: 480px;">
|
|||
|
</el-row>
|
|||
|
<el-row style="padding: 5px;">
|
|||
|
<el-col :span="11" style="height: 28px;line-height: 28px;">
|
|||
|
<el-radio v-model="train" label="all">所有列车</el-radio>
|
|||
|
</el-col>
|
|||
|
<el-col :span="4" style="height: 28px;line-height: 28px;text-align: right;">
|
|||
|
<div>当前状态:</div>
|
|||
|
</el-col>
|
|||
|
<el-col :span="9">
|
|||
|
<el-input v-model="input" size="mini" :disabled="true" placeholder="请输入内容" />
|
|||
|
</el-col>
|
|||
|
</el-row>
|
|||
|
<el-row style="padding: 5px;">
|
|||
|
<el-col :span="4" style="height: 28px;line-height: 28px;">
|
|||
|
<el-radio v-model="train" label="one">单列车号</el-radio>
|
|||
|
</el-col>
|
|||
|
<el-col :span="7">
|
|||
|
<el-select v-model="trainCode" :disabled="train !== 'one'" style="width: 160px" size="mini" placeholder="请选择">
|
|||
|
<el-option
|
|||
|
v-for="item in trainList"
|
|||
|
:key="item.code"
|
|||
|
:label="item.code"
|
|||
|
:value="item.code"
|
|||
|
/>
|
|||
|
</el-select>
|
|||
|
</el-col>
|
|||
|
<el-col :span="4" style="height: 28px;line-height: 28px;text-align: right;">
|
|||
|
<div>当前状态:</div>
|
|||
|
</el-col>
|
|||
|
<el-col :span="9">
|
|||
|
<el-input v-model="input" size="mini" :disabled="true" placeholder="请输入内容" />
|
|||
|
</el-col>
|
|||
|
</el-row>
|
|||
|
<el-row style="padding: 5px 0;">
|
|||
|
<span style="color:#000;font-size: 16px;font-weight: bold;">选择调度模式</span>
|
|||
|
<hr style="display: inline-block;width: 170px;">
|
|||
|
<span style="color:#000;font-size: 16px;font-weight: bold;">调整行车间隔</span>
|
|||
|
<hr style="display: inline-block;width: 170px;">
|
|||
|
</el-row>
|
|||
|
<el-row style="padding: 5px;">
|
|||
|
<el-col :span="12" style="height: 28px;line-height: 28px;">
|
|||
|
<el-radio v-model="atrMode" label="TIME_TABLE_REGULATION">时刻表调度</el-radio>
|
|||
|
</el-col>
|
|||
|
<el-col :span="6" style="height: 28px;line-height: 28px;">
|
|||
|
<el-radio v-model="intervalMode" :disabled="true">列车个数</el-radio>
|
|||
|
</el-col>
|
|||
|
<el-col :span="6">
|
|||
|
<el-input-number v-model="trainNumber" size="mini" :min="0" :max="999" :disabled="true" controls-position="right" label="列车个数" />
|
|||
|
</el-col>
|
|||
|
</el-row>
|
|||
|
<el-row style="padding: 5px;">
|
|||
|
<el-col :offset="12" :span="6" style="height: 28px;line-height: 28px;">
|
|||
|
<el-radio v-model="intervalMode" :disabled="true">间隔时间(秒)</el-radio>
|
|||
|
</el-col>
|
|||
|
<el-col :span="6">
|
|||
|
<el-input-number v-model="trainInterval" size="mini" :disabled="true" :min="0" :max="999" controls-position="right" label="间隔时间" />
|
|||
|
</el-col>
|
|||
|
</el-row>
|
|||
|
<el-row style="padding: 5px;">
|
|||
|
<el-col :span="12" style="height: 28px;line-height: 28px;">
|
|||
|
<el-radio v-model="atrMode" label="HEADWAY_REGULATION_FRONT">列车间隔调度-前调</el-radio>
|
|||
|
</el-col>
|
|||
|
<el-col :span="12">
|
|||
|
<el-button :disabled="true" style="height: 28px;width: 260px;">计算</el-button>
|
|||
|
</el-col>
|
|||
|
</el-row>
|
|||
|
<el-row style="padding: 5px;">
|
|||
|
<el-col :span="12">
|
|||
|
<el-radio v-model="atrMode" label="HEADWAY_REGULATION_FRONT_AND_BACK">列车间隔调度-前调+后调</el-radio>
|
|||
|
</el-col>
|
|||
|
<el-col :span="2" style="height: 28px;line-height: 28px;">
|
|||
|
<span>最小</span>
|
|||
|
</el-col>
|
|||
|
<el-col :span="5">
|
|||
|
<el-input v-model="input" :disabled="true" size="mini" />
|
|||
|
</el-col>
|
|||
|
<el-col :span="4" :offset="1">
|
|||
|
<el-input v-model="input" :disabled="true" size="mini" />
|
|||
|
</el-col>
|
|||
|
</el-row>
|
|||
|
<el-row style="padding: 5px;">
|
|||
|
<el-col :span="2" :offset="12" style="height: 28px;line-height: 28px;">
|
|||
|
<span>最小</span>
|
|||
|
</el-col>
|
|||
|
<el-col :span="5">
|
|||
|
<el-input v-model="input" size="mini" :disabled="true" />
|
|||
|
</el-col>
|
|||
|
<el-col :span="4" :offset="1">
|
|||
|
<el-input v-model="input" size="mini" :disabled="true" />
|
|||
|
</el-col>
|
|||
|
</el-row>
|
|||
|
<el-row style="padding: 5px;">
|
|||
|
<el-col :span="12" style="height: 28px;line-height: 28px;">
|
|||
|
<el-radio v-model="atrMode" label="REGULATION_OFF">关闭自动调度</el-radio>
|
|||
|
</el-col>
|
|||
|
<el-col :span="2" style="height: 28px;line-height: 28px;">
|
|||
|
<span>最大</span>
|
|||
|
</el-col>
|
|||
|
<el-col :span="5">
|
|||
|
<el-input v-model="input" size="mini" :disabled="true" />
|
|||
|
</el-col>
|
|||
|
<el-col :span="4" :offset="1">
|
|||
|
<el-input v-model="input" size="mini" :disabled="true" />
|
|||
|
</el-col>
|
|||
|
</el-row>
|
|||
|
<el-row style="padding: 5px 0">
|
|||
|
<span style="color:#000;font-size: 16px;font-weight: bold;">选择时间项(人工调度)</span>
|
|||
|
<hr style="display: inline-block;width: 370px;">
|
|||
|
</el-row>
|
|||
|
<el-row style="padding: 5px;">
|
|||
|
<el-col :span="4">
|
|||
|
<el-radio v-model="timeTerm" :disabled="atrMode !== 'REGULATION_OFF'" label="stop" @change="termChange">停站时间</el-radio>
|
|||
|
<el-radio v-model="timeTerm" :disabled="atrMode !== 'REGULATION_OFF'" label="driving" @change="termChange">行驶时间</el-radio>
|
|||
|
<el-radio v-model="timeTerm" :disabled="atrMode !== 'REGULATION_OFF'" label="run" @change="termChange">不停/停站</el-radio>
|
|||
|
</el-col>
|
|||
|
<el-col :span="20">
|
|||
|
<el-table v-if="timeTerm === 'stop'" ref="table1" :data="tableData1" style="width: 100%" height="80">
|
|||
|
<el-table-column prop="direction" label="方向" />
|
|||
|
<el-table-column prop="name" label="站名" />
|
|||
|
<!--<el-table-column prop="time" label="时间" />-->
|
|||
|
<el-table-column label="时间">
|
|||
|
<template slot-scope="scope">
|
|||
|
<el-input-number v-model="scope.row.time" size="mini" :min="-1" :controls="false" style="width: 100%" />
|
|||
|
</template>
|
|||
|
</el-table-column>
|
|||
|
<el-table-column prop="timeRange" label="推荐时间" />
|
|||
|
</el-table>
|
|||
|
<el-table v-else-if="timeTerm === 'driving'" ref="table2" :data="tableData2" style="width: 100%" height="80">
|
|||
|
<el-table-column prop="follow" label="从" />
|
|||
|
<el-table-column prop="to" label="至" />
|
|||
|
<!--<el-table-column prop="time" label="时间" />-->
|
|||
|
<el-table-column label="时间">
|
|||
|
<template slot-scope="scope">
|
|||
|
<el-input-number v-model="scope.row.time" size="mini" :min="-1" :controls="false" style="width: 100%" />
|
|||
|
</template>
|
|||
|
</el-table-column>
|
|||
|
<el-table-column prop="timeRange" label="推荐时间" />
|
|||
|
</el-table>
|
|||
|
<el-table v-else-if="timeTerm === 'run'" ref="table3" :data="tableData3" style="width: 100%" height="80">
|
|||
|
<el-table-column prop="direction" label="方向" />
|
|||
|
<el-table-column prop="name" label="站名" />
|
|||
|
<el-table-column label="不停">
|
|||
|
<template slot-scope="scope">
|
|||
|
<el-checkbox v-model="scope.row.stop" />
|
|||
|
</template>
|
|||
|
</el-table-column>
|
|||
|
</el-table>
|
|||
|
<el-table v-else ref="table4">
|
|||
|
<el-table-column prop="follow" label="从" />
|
|||
|
<el-table-column prop="to" label="至" />
|
|||
|
<el-table-column prop="time" label="时间" />
|
|||
|
<el-table-column prop="timeRange" label="推荐时间" />
|
|||
|
</el-table>
|
|||
|
</el-col>
|
|||
|
</el-row>
|
|||
|
<div>
|
|||
|
<el-button style="width: 100px;height: 28px;margin-right: 103px;">显示列车信息</el-button>
|
|||
|
<el-button style="width: 100px;height: 28px;" @click="commit">执行</el-button>
|
|||
|
<el-button style="width: 100px;height: 28px;" @click="reset">重设</el-button>
|
|||
|
<el-button style="width: 100px;height: 28px;" @click="doClose">关闭</el-button>
|
|||
|
</div>
|
|||
|
</div>
|
|||
|
</el-dialog>
|
|||
|
</template>
|
|||
|
<script>
|
|||
|
import { mapGetters } from 'vuex';
|
|||
|
import CMD from '@/scripts/cmdPlugin/CommandEnum';
|
|||
|
import { OperationEvent } from '@/scripts/cmdPlugin/OperationHandler';
|
|||
|
export default {
|
|||
|
name:'ATRDialog',
|
|||
|
data() {
|
|||
|
return {
|
|||
|
train: 'all',
|
|||
|
trainCode: '',
|
|||
|
atrMode: 'REGULATION_OFF',
|
|||
|
intervalMode: '',
|
|||
|
trainInterval: '',
|
|||
|
trainNumber: '',
|
|||
|
tableData: [],
|
|||
|
tableData1: [],
|
|||
|
tableData2: [],
|
|||
|
tableData3: [],
|
|||
|
tableData4: [],
|
|||
|
input: '',
|
|||
|
timeTerm: 'stop',
|
|||
|
sortStationList: [],
|
|||
|
noStopList: [],
|
|||
|
dialogShow:false
|
|||
|
};
|
|||
|
},
|
|||
|
computed: {
|
|||
|
show() {
|
|||
|
return this.dialogShow && !this.$store.state.menuOperation.break;
|
|||
|
},
|
|||
|
title() {
|
|||
|
return '时刻表';
|
|||
|
},
|
|||
|
...mapGetters('map', [
|
|||
|
'trainList',
|
|||
|
'stationList',
|
|||
|
'stationStandList'
|
|||
|
])
|
|||
|
},
|
|||
|
watch: {
|
|||
|
train(val) {
|
|||
|
if (val === 'all') {
|
|||
|
this.tableData1.forEach(item => {
|
|||
|
const stand = this.$store.getters['map/getDeviceByCode'](item.code);
|
|||
|
item.time = stand.parkingTime;
|
|||
|
});
|
|||
|
} else if (val === 'one' && this.trainCode) {
|
|||
|
this.tableData1.forEach(item => {
|
|||
|
const stand = this.$store.getters['map/getDeviceByCode'](item.code);
|
|||
|
item.time = stand.parkingTimeMap[this.trainCode];
|
|||
|
});
|
|||
|
}
|
|||
|
},
|
|||
|
trainCode(val) {
|
|||
|
if (this.train === 'one') {
|
|||
|
this.tableData1.forEach(item => {
|
|||
|
const stand = this.$store.getters['map/getDeviceByCode'](item.code);
|
|||
|
item.time = stand.parkingTimeMap[val];
|
|||
|
});
|
|||
|
}
|
|||
|
},
|
|||
|
atrMode(val) {
|
|||
|
if (val !== 'REGULATION_OFF') {
|
|||
|
this.timeTerm = '';
|
|||
|
}
|
|||
|
}
|
|||
|
},
|
|||
|
mounted() {
|
|||
|
|
|||
|
},
|
|||
|
methods: {
|
|||
|
initData() {
|
|||
|
this.sortStationList = [...this.stationList];
|
|||
|
this.sortStationList.sort((station1, station2) => {
|
|||
|
return station1.sn - station2.sn;
|
|||
|
});
|
|||
|
const standMap = {};
|
|||
|
this.stationStandList.forEach(stand => {
|
|||
|
if (standMap[stand.stationCode]) {
|
|||
|
standMap[stand.stationCode].push(stand);
|
|||
|
} else {
|
|||
|
standMap[stand.stationCode] = [stand];
|
|||
|
}
|
|||
|
});
|
|||
|
for (let i = 0; i < this.sortStationList.length; i++) {
|
|||
|
const standList = standMap[this.sortStationList[i].code];
|
|||
|
if (!standList) {
|
|||
|
continue;
|
|||
|
}
|
|||
|
let rightStand = '';
|
|||
|
let leftStand = '';
|
|||
|
standList.forEach(stand => {
|
|||
|
if (stand.right) {
|
|||
|
rightStand = this.$store.getters['map/getDeviceByCode'](stand.code);
|
|||
|
} else {
|
|||
|
leftStand = this.$store.getters['map/getDeviceByCode'](stand.code);
|
|||
|
}
|
|||
|
});
|
|||
|
this.tableData1.push({ direction: '>', name: this.sortStationList[i].name, time: rightStand.parkingTime, timeRange: '020-060', code: rightStand.code });
|
|||
|
this.tableData1.push({ direction: '<', name: this.sortStationList[i].name, time: leftStand.parkingTime, timeRange: '020-060', code: leftStand.code });
|
|||
|
this.tableData3.push({ direction: '>', name: this.sortStationList[i].name, stop: false, code: rightStand.code });
|
|||
|
this.tableData3.push({ direction: '<', name: this.sortStationList[i].name, stop: false, code: leftStand.code });
|
|||
|
if (i === this.sortStationList.length - 1) {
|
|||
|
this.tableData2.push({ follow: '>' + this.sortStationList[i].name, to: '<' + this.sortStationList[i].name, time: 0, timeRange: '060-300', code: rightStand.code });
|
|||
|
this.tableData2.push({ follow: '<' + this.sortStationList[i].name, to: '<' + this.sortStationList[i - 1].name, time: 0, timeRange: '060-300', code: leftStand.code });
|
|||
|
} else if ( i === 0 ) {
|
|||
|
this.tableData2.push({ follow: '<' + this.sortStationList[i].name, to: '>' + this.sortStationList[i].name, time: 0, timeRange: '060-300', code: rightStand.code });
|
|||
|
this.tableData2.push({ follow: '>' + this.sortStationList[i].name, to: '>' + this.sortStationList[i + 1].name, time: 0, timeRange: '060-300', code: leftStand.code });
|
|||
|
} else {
|
|||
|
this.tableData2.push({ follow: '<' + this.sortStationList[i].name, to: '<' + this.sortStationList[i - 1].name, time: 0, timeRange: '060-300', code: rightStand.code });
|
|||
|
this.tableData2.push({ follow: '>' + this.sortStationList[i].name, to: '>' + this.sortStationList[i + 1].name, time: 0, timeRange: '060-300', code: leftStand.code });
|
|||
|
}
|
|||
|
}
|
|||
|
},
|
|||
|
doShow() {
|
|||
|
this.initData();
|
|||
|
this.dialogShow = true;
|
|||
|
},
|
|||
|
doClose() {
|
|||
|
this.dialogShow = false;
|
|||
|
},
|
|||
|
reset() {
|
|||
|
this.train = '';
|
|||
|
this.atrMode = '';
|
|||
|
this.timeTerm = '';
|
|||
|
},
|
|||
|
commit() {
|
|||
|
const standParkingTime = {};
|
|||
|
this.tableData1.forEach(item => {
|
|||
|
standParkingTime[item.code + ''] = item.time;
|
|||
|
});
|
|||
|
const step = {
|
|||
|
cmdType: CMD.Train.CMD_TRAIN_REGULATION,
|
|||
|
operate: OperationEvent.StationStand.setStopTime.confirm,
|
|||
|
param: {
|
|||
|
standParkingTime: standParkingTime,
|
|||
|
groupNumber: this.train === 'one' ? this.trainCode : '',
|
|||
|
parkingAlwaysValid: true,
|
|||
|
atrMode: this.atrMode,
|
|||
|
timeTerm: this.timeTerm
|
|||
|
},
|
|||
|
over:true
|
|||
|
};
|
|||
|
this.$store.dispatch('training/nextNew', step).then(({ valid }) => {
|
|||
|
if (valid) {
|
|||
|
this.dialogShow = false;
|
|||
|
}
|
|||
|
}).catch((error) => {
|
|||
|
console.error(error);
|
|||
|
if (error && error.code == '10017') {
|
|||
|
this.$message.error(error.message);
|
|||
|
} else {
|
|||
|
this.$message.error('命令执行失败');
|
|||
|
}
|
|||
|
});
|
|||
|
},
|
|||
|
termChange(val) {
|
|||
|
}
|
|||
|
}
|
|||
|
};
|
|||
|
</script>
|
|||
|
<style lang="scss" scoped>
|
|||
|
.actualTimetable{padding:0px 15px;}
|
|||
|
.actualTimetableT{width:100%;position: relative;}
|
|||
|
.defaultTimetableT{width:100%;position: relative;overflow:hidden;}
|
|||
|
.actualTimetableTtext,.defaultTimetableTtext{position:absolute;height: 20px;padding-right:5px;font-size:15px;color: #676767;background:#e2e2e2;font-weight: bold;}
|
|||
|
.actualTimetableTLine,.defaultTimetableTLine{display:inline-block;margin-left:10px;width:100%;border-bottom: 1px #A0A0A0 solid;vertical-align: top;height: 9px;}
|
|||
|
.actualTimetableForm{}
|
|||
|
.actualTimeFormEach{margin-top: 10px;}
|
|||
|
.actualTimeFormEach span{font-size:15px;color: #151515;}
|
|||
|
.actualTimeFormValue{
|
|||
|
font-size:15px;
|
|||
|
color: #151515;
|
|||
|
display: inline-block;
|
|||
|
padding: 5px 10px;
|
|||
|
border: 1px #A2A2A2 solid;
|
|||
|
width: 810px;
|
|||
|
}
|
|||
|
.defaultTimetable{
|
|||
|
padding:15px 15px 0px 15px;
|
|||
|
}
|
|||
|
// .defaultTimetab{
|
|||
|
// padding: 10px 15px 10px 15px;
|
|||
|
// }
|
|||
|
.defaultTimetableM{margin-top:10px;}
|
|||
|
.defaultTimetableB{display:inline-block;width:100%;margin-top: 10px;}
|
|||
|
#defaultClearSele{margin-right:10px;width:90px;}
|
|||
|
#defaultClearAll{width:90px;}
|
|||
|
#defaultShowTime{float:right;width:90px;}
|
|||
|
.defaultTimetableBtn{
|
|||
|
background:transparent;
|
|||
|
border:1px#9C9C9C solid ;
|
|||
|
height:auto ;
|
|||
|
outline:none;
|
|||
|
text-align:center;
|
|||
|
display: inline-block;
|
|||
|
padding:4px 0px;
|
|||
|
color:#090909;
|
|||
|
cursor: pointer;
|
|||
|
}
|
|||
|
.defaultTimetableBtn.disabled{border:1px #A9A9A9 solid ;color: #A7A7A7; cursor: no-drop;}
|
|||
|
.ttlButtonGroup{
|
|||
|
border-top: 1px #6d6d6d solid;
|
|||
|
margin-top: 10px;
|
|||
|
padding: 10px 15px;
|
|||
|
}
|
|||
|
#changeActual{margin-right:10px;width:120px}
|
|||
|
#changeDefault{width:120px;margin-right:175px;}
|
|||
|
#settingTimetable{width:130px;margin-right:10px;}
|
|||
|
#resetTimetable{width:130px;margin-right:10px;}
|
|||
|
#closeTimetable{width:130px;}
|
|||
|
</style>
|
|||
|
<style lang="scss">
|
|||
|
.ttl.haerbin-01__systerm .el-dialog .el-dialog__body{
|
|||
|
background: #E2E2E2;
|
|||
|
padding:20px 0px 10px 0px;
|
|||
|
}
|
|||
|
.defaultTimetab.el-table .cell{
|
|||
|
padding-top:5px;padding-bottom:5px;
|
|||
|
}
|
|||
|
</style>
|