100 lines
3.5 KiB
Vue
100 lines
3.5 KiB
Vue
<template>
|
|
<data-table id="PlanStatusBar" ref="dataTable" :height="height-11" :config="stationListConfig" :close="false"
|
|
:style="{top: maxmini? maxTop-110+'px':maxTop-21+'px'}" @touch="touch"></data-table>
|
|
</template>
|
|
|
|
<script>
|
|
import DataTable from '../menusPlan/components/dataTable';
|
|
import { formatTime, formatName } from '@/utils/runPlan';
|
|
|
|
export default {
|
|
name: 'PlanStatusBar',
|
|
props: {
|
|
maxTop: {
|
|
type: Number,
|
|
required: true
|
|
}
|
|
},
|
|
components: {
|
|
DataTable
|
|
},
|
|
data() {
|
|
return {
|
|
maxmini: true,
|
|
height: 100,
|
|
stationListConfig: {
|
|
data: [],
|
|
showClose: true,
|
|
highlightCurrentRow: true,
|
|
columns: [
|
|
{
|
|
prop: 'stationName',
|
|
label: '站台',
|
|
width: 400
|
|
},
|
|
{
|
|
prop: 'startTime',
|
|
label: '到点',
|
|
},
|
|
{
|
|
prop: 'stopTime',
|
|
label: '停站时间',
|
|
},
|
|
{
|
|
prop: 'endTime',
|
|
label: '发点',
|
|
},
|
|
{
|
|
prop: 'level',
|
|
label: '运行等级'
|
|
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
watch: {
|
|
'$store.state.runPlan.select': function (select) {
|
|
this.stationListConfig.data = [];
|
|
let serviceObj = this.$store.state.runPlan.editData[select.serviceNumber];
|
|
if (serviceObj) {
|
|
let trainMap = serviceObj.trainMap;
|
|
if (trainMap) {
|
|
let trainObj = trainMap[select.tripNumber];
|
|
if (trainObj) {
|
|
let stationTimeList = trainObj.stationTimeList;
|
|
if (stationTimeList && stationTimeList.length) {
|
|
stationTimeList.forEach((elem, index) => {
|
|
let stationObj = {
|
|
stationName: formatName(elem.stationCode),
|
|
startTime: formatTime(index == 0 ? null : stationTimeList[index - 1].secondTime),
|
|
stopTime: formatTime(index == 0 ? null : elem.secondTime - stationTimeList[index - 1].secondTime),
|
|
endTime: formatTime(elem.secondTime),
|
|
level: ''
|
|
}
|
|
this.stationListConfig.data.push(stationObj);
|
|
});
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
touch(maxmini) {
|
|
this.maxmini = maxmini;
|
|
this.$emit('setPosition');
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
|
@import "src/styles/mixin.scss";
|
|
|
|
#PlanStatusBar {
|
|
z-index: 5;
|
|
position: absolute;
|
|
width: 100%;
|
|
}
|
|
</style> |