rt-sim-training-client/src/views/planSchedule/statusBar.vue

108 lines
3.2 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"
/>
</template>
<script>
import DataTable from './menusPlan/components/dataTable';
import { formatTime, formatName } from '@/utils/runPlan';
export default {
name: 'PlanStatusBar',
components: {
DataTable
},
props: {
maxTop: {
type: Number,
required: true
}
},
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.selected': function (select) {
this.stationListConfig.data = [];
const serviceObj = this.$store.state.runPlan.editData[select.serviceNumber];
if (serviceObj) {
const trainMap = serviceObj.trainMap;
if (trainMap) {
const trainObj = trainMap[select.tripNumber];
if (trainObj) {
const stationTimeList = trainObj.stationTimeList;
if (stationTimeList && stationTimeList.length) {
stationTimeList.forEach((elem, index) => {
const 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>