rt-sim-training-client/src/views/bigTrainRunplanManage/stationTrack.vue

316 lines
9.6 KiB
Vue

<template>
<div class="stationTrack" :style="{ height: height+'px' }">
<!-- {{ '车站股道' }} -->
<div class="stationTrackL">
<terminal-station-list ref="terminalStationList" :currentid="'getStationTrack'" @loadStationData="loadStationData" />
</div>
<div class="stationTrackR">
<div class="stationTrackRMenu">
<div class="stationTrackRMenuL">
<!-- :id="domIdConfirm" :loading="loading" @click="commit"-->
<el-button class="stationTrackButton" size="small" @click="modifySection">修改</el-button>
</div>
<div class="stationTrackRMenuR">
<span class="stationTrackRVer">版本号</span>
<el-button class="stationTrackButton" size="small">备份</el-button>
<el-button class="stationTrackButton" size="small">更新至生效区</el-button>
<el-button class="stationTrackButton" size="small">导入</el-button>
<el-button class="stationTrackButton" size="small">比较</el-button>
</div>
</div>
<div class="stationTrackRTable" :style="{ height: (height-40)+'px' }">
<el-table
id="stationTrackTableIn"
ref="stationTrackTableIn"
:data="tableData"
border
height="600px"
highlight-current-row
style="border:1px #ccc solid;width:1103px"
@row-click="selectedSection"
@row-dblclick="rowDbClick"
>
<!-- @cell-click="selectedTripNumber" -->
<!-- @current-change="handleCurrentChange" -->
<el-table-column
type="index"
label="序号"
width="100"
/>
<!-- trackSectionCode -->
<el-table-column
prop="code"
label="股道名称"
width="100"
>
<template slot-scope="scope">
{{ filterSectionMap[scope.row.code]?filterSectionMap[scope.row.code].name:'' }}
</template>
</el-table-column>
<!-- lineType -->
<el-table-column
prop="trackNature"
label="线路性质"
width="100"
>
<template slot-scope="scope">
{{ lineTypeMap[scope.row.trackNature] }}
</template>
</el-table-column>
<el-table-column
prop="direction"
label="接发车方向"
width="100"
>
<template slot-scope="scope">
{{ directionMap[scope.row.direction] }}
</template>
</el-table-column>
<!-- type -->
<el-table-column
prop="trainType"
label="接发车类型"
width="100"
>
<template slot-scope="scope">
{{ typeMap[scope.row.trainType] }}
</template>
</el-table-column>
<!-- transfiniteType -->
<el-table-column
prop="transfinite"
label="超限类型"
width="100"
>
<template slot-scope="scope">
{{ transfiniteTypeMap[scope.row.transfinite] }}
</template>
</el-table-column>
<el-table-column
prop="standType"
label="站台"
width="100"
>
<template slot-scope="scope">
{{ standTypeMap[scope.row.standType] }}
</template>
</el-table-column>
<!-- allowEmu -->
<el-table-column
prop="motorCar"
label="允许动车组"
width="100"
>
<template slot-scope="scope">
{{ allowEmuMap[scope.row.motorCar] }}
</template>
</el-table-column>
<!-- addWaterEqu -->
<el-table-column
prop="waterSupply"
label="上水设备"
width="100"
>
<template slot-scope="scope">
{{ addWaterEquMap[scope.row.waterSupply] }}
</template>
</el-table-column>
<!-- sewageEqu -->
<el-table-column
prop="sewageAbsorption"
label="排污设备"
width="100"
>
<template slot-scope="scope">
{{ sewageEquMap[scope.row.sewageAbsorption] }}
</template>
</el-table-column>
<el-table-column
prop="military"
label="军用"
width="100"
>
<template slot-scope="scope">
{{ militaryMap[scope.row.military] }}
</template>
</el-table-column>
</el-table>
</div>
</div>
<!-- -->
<track-information ref="trackInformation" @noticeInfo="noticeInfo" />
</div>
</template>
<script>
import { mapGetters } from 'vuex';
import TerminalStationList from './terminalStationList';
import TrackInformation from './trackInformation';
import {menuOperate, commitOperate} from '@/jmapNew/theme/components/utils/menuOperate';
export default {
name:'StationTrack',
components: {
TerminalStationList,
TrackInformation
},
data() {
return {
height: this.$store.state.app.height - 61,
currentStationCode:'',
filterSectionMap:{},
currentRow:null,
lineTypeMap:{
1:'正线',
2:'到发线'
},
directionMap:{
1:'上行',
2:'下行',
3:'上下行'
},
typeMap:{
1:'客车',
2:'货车',
3:'客货车'
},
transfiniteTypeMap:{
1:'不能接发超限列车',
2:'一级超限',
3:'二级超限',
4:'超级超限'
},
standTypeMap:{
1:'无',
2:'高站台',
3:'低站台'
},
allowEmuMap:{
1:'是',
2:'否'
},
addWaterEquMap:{
1:'有',
2:'无'
},
sewageEquMap:{
1:'有',
2:'无'
},
militaryMap:{
1:'是',
2:'否'
},
tableData:[
]
};
},
computed:{
...mapGetters('map', [
'sectionList'
])
},
methods:{
loadStation() {
this.$refs.terminalStationList.loadStation();
},
loadStationData(stationCode) {
this.currentStationCode = stationCode;
this.filterSectionMap = {};
this.sectionList.forEach(section=>{
if (section.standTrack && section.belongStation == this.currentStationCode) {
this.filterSectionMap[section.code] = {code:section.code, name:section.name};
}
});
this.handleData(stationCode);
},
handleData(stationCode) {
commitOperate(menuOperate.CTC.getStationTrack, { stationCode: stationCode }, 3).then(({valid, response}) => {
if (valid) {
this.tableData = response.data;
}
});
// getStationTrackTerminalStationTree
// this.tableData = [
// {trackSectionCode:'T97', lineType:'1', direction:'1', type:'2', transfiniteType:'2', standType:'1', allowEmu:'2', addWaterEqu:'1',
// sewageEqu:'1', military:'1'},
// {trackSectionCode:'T105', lineType:'2', direction:'1', type:'2', transfiniteType:'2', standType:'1', allowEmu:'2', addWaterEqu:'1',
// sewageEqu:'1', military:'1' }
// ];
},
rowDbClick(row, column, event) {
this.currentRow = row;
this.modifySection();
},
selectedSection(row, column, event) {
this.currentRow = row;
},
modifySection() {
if (this.currentRow) {
this.$refs.trackInformation.doShow({
row:this.currentRow,
filterSectionMap:this.filterSectionMap
});
}
},
noticeInfo() {
this.$emit('noticeInfo');
}
}
};
</script>
<style lang="scss" scoped>
.stationTrack{
padding-left:200px;
}
.stationTrackL{
width: 200px;
height: 100%;
position: absolute;
border-right: 1px #797979 solid;
left: 0;
top: 0;
}
.stationTrackR{
padding:0px 5px 0px 5px;
height: 100%;
background: #d8d8d8;
}
.stationTrackRMenu{
background:#eeeeee;
display: inline-block;
width:100%;
padding:5px;
border-left: 1px #707070 solid;
}
.stationTrackRMenuL{display: inline-block;}
.stationTrackRMenuR{float:right;display: inline-block;}
.stationTrackRTable{background:#a9a9a9;border-left: 1px #707070 solid;}
.stationTrackRVer{
font-size: 14px;
margin-right: 10px;
color: #87a7c9;
}
.stationTrackButton{
background-image: linear-gradient(#ffffff,#d8d8d8);
color: #000;
padding: 5px 10px;
border: 1px #737373 solid;
}
.stationTrackButton:hover{
background-image: linear-gradient(#efffff,#a8daf3);
}
</style>
<style lang="scss">
#stationTrackTableIn.el-table td, #stationTrackTableIn.el-table th{
padding-top: 5px;
padding-bottom: 5px;
border-color: #a5a5a5;
}
// .el-table__body tr.current-row>td
// .el-table__body tr.current-row>td
// #runplanContentTable .el-table__body tr.current-row>td .el-input--mini .el-input__inner{
#stationTrackTableIn .el-table__body tr.current-row>td{
background-color: #6aa8ec;
color: #fff;
}
</style>