2021-05-28 14:07:28 +08:00
|
|
|
|
<template>
|
|
|
|
|
|
<el-dialog
|
|
|
|
|
|
v-dialogDrag
|
|
|
|
|
|
class="route-setting"
|
|
|
|
|
|
:title="title"
|
|
|
|
|
|
:visible.sync="show"
|
|
|
|
|
|
width="900px"
|
|
|
|
|
|
label-position="top"
|
|
|
|
|
|
:before-close="doClose"
|
2021-05-28 15:22:23 +08:00
|
|
|
|
:z-index="2009"
|
2021-05-28 14:07:28 +08:00
|
|
|
|
:modal="false"
|
|
|
|
|
|
:close-on-click-modal="false"
|
|
|
|
|
|
>
|
|
|
|
|
|
<div style="padding: 5px;">
|
|
|
|
|
|
<el-row>
|
|
|
|
|
|
<el-col :span="12"><span>所选位置：</span></el-col>
|
|
|
|
|
|
<el-col :span="12"><span>列车号：</span></el-col>
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
<el-row>
|
|
|
|
|
|
<el-col :span="12">
|
2021-05-28 17:18:51 +08:00
|
|
|
|
<el-input v-model="sectionName" size="mini" style="width: 400px;" :disabled="true" />
|
2021-05-28 14:07:28 +08:00
|
|
|
|
</el-col>
|
|
|
|
|
|
<el-col :span="12">
|
2021-05-28 17:18:51 +08:00
|
|
|
|
<el-input v-model="trainCode" :max-length="7" size="mini" style="width: 310px;" />
|
|
|
|
|
|
<el-button size="mini" icon="el-icon-search" @click="trainFind" />
|
|
|
|
|
|
<el-button size="mini" icon="el-icon-refresh-left" @click="resetTrainCode" />
|
2021-05-28 14:07:28 +08:00
|
|
|
|
</el-col>
|
|
|
|
|
|
</el-row>
|
2021-05-28 15:22:23 +08:00
|
|
|
|
<div style="display: flex;justify-content: space-around;margin-top: 20px;">
|
2021-05-28 17:18:51 +08:00
|
|
|
|
<el-button size="mini" style="width: 280px;" @click="changeOperationType('show')">显示列车信息</el-button>
|
|
|
|
|
|
<el-button size="mini" style="width: 280px;" @click="changeOperationType('update')">修改列车资料</el-button>
|
|
|
|
|
|
<el-button size="mini" style="width: 280px;" @click="changeOperationType('create')">创建列车号</el-button>
|
2021-05-28 14:07:28 +08:00
|
|
|
|
</div>
|
2021-05-28 15:22:23 +08:00
|
|
|
|
<div style="display: flex;justify-content: space-around;margin-top: 10px;">
|
2021-05-28 17:18:51 +08:00
|
|
|
|
<el-button size="mini" style="width: 280px;" @click="changeOperationType('delete')">删除列车号</el-button>
|
|
|
|
|
|
<el-button size="mini" style="width: 280px;" @click="changeOperationType('move')">步进列车号</el-button>
|
|
|
|
|
|
<el-button size="mini" style="width: 280px;" @click="changeOperationType('resort')">重排列车号</el-button>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div v-if="operationType === 'show'">
|
|
|
|
|
|
<el-table :data="tableData" border style="width: 100%;margin-top: 20px;" height="200">
|
|
|
|
|
|
<el-table-column prop="date" label="方向" />
|
|
|
|
|
|
<el-table-column prop="name" label="列车号" />
|
|
|
|
|
|
<el-table-column prop="address" label="位置" />
|
|
|
|
|
|
<el-table-column prop="address" label="ARS" />
|
|
|
|
|
|
<el-table-column prop="address" label="晚点" />
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div v-else-if="operationType === 'create'" style="display: flex;justify-content: space-between;">
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<el-table :data="tableData" border style="width: 280px;margin-top: 20px;" height="200">
|
|
|
|
|
|
<el-table-column prop="date" label="方向" width="60" />
|
|
|
|
|
|
<el-table-column prop="name" label="列车号" width="157" />
|
|
|
|
|
|
<el-table-column prop="address" label="位置" width="60" />
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<div style="margin-top: 20px;display: flex;justify-content: space-between;padding: 5px;align-items: center;">
|
|
|
|
|
|
<span>位置：</span>
|
|
|
|
|
|
<el-input size="mini" style="width: 150px;" />
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div style="display: flex;justify-content: space-between;padding: 5px;align-items: center;margin-top: 10px;">
|
|
|
|
|
|
<span>新列车号：</span>
|
|
|
|
|
|
<el-input size="mini" style="width: 150px;" />
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div style="display: flex;justify-content: space-between;padding: 5px;margin-top: 10px;">
|
|
|
|
|
|
<span>设置该列车为自动排列：</span>
|
|
|
|
|
|
<el-radio v-model="autoArrange" label="true">开启</el-radio>
|
|
|
|
|
|
<el-radio v-model="autoArrange" label="false">关闭</el-radio>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div style="display: flex;justify-content: space-between;padding: 5px;align-items: center;margin-top: 10px;">
|
|
|
|
|
|
<span>车组号：</span>
|
|
|
|
|
|
<el-input size="mini" style="width: 60px;" />
|
|
|
|
|
|
<div style="border: 1px solid #DCDFE6;padding: 4px 5px;border-radius: 3px;"><></div>
|
|
|
|
|
|
<el-input size="mini" style="width: 60px;" />
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<div style="margin-top: 20px;height: 20px;">插入位置（之前）：</div>
|
|
|
|
|
|
<el-table :data="tableData" border style="width: 280px;" height="180">
|
|
|
|
|
|
<el-table-column prop="date" label="方向" width="60" />
|
|
|
|
|
|
<el-table-column prop="name" label="列车号" width="157" />
|
|
|
|
|
|
<el-table-column prop="address" label="位置" width="60" />
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div v-else-if="operationType === 'delete'" style="display: flex;">
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<el-table :data="tableData" border style="width: 280px;margin-top: 20px;" height="200">
|
|
|
|
|
|
<el-table-column prop="date" label="方向" width="60" />
|
|
|
|
|
|
<el-table-column prop="name" label="列车号" width="157" />
|
|
|
|
|
|
<el-table-column prop="address" label="位置" width="60" />
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div style="width: 250px;display: flex;justify-content: space-between;margin-top: 20px;margin-left: 10px;align-items: center;height: 25px;">
|
|
|
|
|
|
<div>所选列车号：</div>
|
|
|
|
|
|
<el-input style="width: 150px;" size="mini" />
|
|
|
|
|
|
</div>
|
2021-05-28 15:22:23 +08:00
|
|
|
|
</div>
|
2021-05-28 14:07:28 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
|
import { mapGetters } from 'vuex';
|
|
|
|
|
|
import { OperationEvent } from '@/scripts/cmdPlugin/OperationHandler';
|
|
|
|
|
|
// import { EventBus } from '@/scripts/event-bus';
|
|
|
|
|
|
// import CMD from '@/scripts/cmdPlugin/CommandEnum';
|
|
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
|
name: 'RouteCreate',
|
|
|
|
|
|
data() {
|
|
|
|
|
|
return {
|
|
|
|
|
|
dialogShow: false,
|
|
|
|
|
|
loading: false,
|
2021-05-28 15:22:23 +08:00
|
|
|
|
selected: null,
|
2021-05-28 17:18:51 +08:00
|
|
|
|
tableData: [],
|
|
|
|
|
|
sectionName: '',
|
|
|
|
|
|
trainCode: '',
|
|
|
|
|
|
operationType: 'create',
|
|
|
|
|
|
autoArrange: false
|
2021-05-28 14:07:28 +08:00
|
|
|
|
};
|
|
|
|
|
|
},
|
|
|
|
|
|
computed: {
|
|
|
|
|
|
...mapGetters('map', [
|
|
|
|
|
|
'stationList'
|
|
|
|
|
|
]),
|
|
|
|
|
|
show() {
|
|
|
|
|
|
return this.dialogShow && !this.$store.state.menuOperation.break;
|
|
|
|
|
|
},
|
|
|
|
|
|
title() {
|
|
|
|
|
|
return '列监';
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
|
|
|
loadInitData(map) {
|
2021-05-28 15:22:23 +08:00
|
|
|
|
// console.log(map, 11111);
|
2021-05-28 14:07:28 +08:00
|
|
|
|
},
|
|
|
|
|
|
doShow(operate, selected) {
|
|
|
|
|
|
this.dialogShow = true;
|
|
|
|
|
|
this.selected = selected;
|
|
|
|
|
|
|
2021-05-28 15:22:23 +08:00
|
|
|
|
this.loadInitData();
|
2021-05-28 14:07:28 +08:00
|
|
|
|
|
|
|
|
|
|
this.$nextTick(function () {
|
|
|
|
|
|
this.$store.dispatch('training/emitTipFresh');
|
|
|
|
|
|
});
|
|
|
|
|
|
},
|
|
|
|
|
|
doClose() {
|
|
|
|
|
|
this.loading = false;
|
|
|
|
|
|
this.dialogShow = false;
|
|
|
|
|
|
this.$store.dispatch('training/emitTipFresh');
|
|
|
|
|
|
},
|
|
|
|
|
|
handleSelect(tab) {
|
|
|
|
|
|
this.activeIndex = tab;
|
|
|
|
|
|
},
|
2021-05-28 17:18:51 +08:00
|
|
|
|
trainFind() {
|
|
|
|
|
|
const train = this.$store.getters['map/getDeviceByCode'](this.trainCode);
|
|
|
|
|
|
this.tableData = [train];
|
|
|
|
|
|
},
|
|
|
|
|
|
resetTrainCode() {
|
|
|
|
|
|
this.trainCode = '';
|
|
|
|
|
|
},
|
|
|
|
|
|
changeOperationType(type) {
|
|
|
|
|
|
this.operationType = type;
|
|
|
|
|
|
},
|
2021-05-28 14:07:28 +08:00
|
|
|
|
commit() {
|
|
|
|
|
|
// const operate = {
|
|
|
|
|
|
// send: true,
|
|
|
|
|
|
|
|
|
|
|
|
// operation: OperationEvent.Section.newtrain.menu.operation,
|
|
|
|
|
|
// cmdType: CMD.Section.CMD_NEW_TRAIN,
|
|
|
|
|
|
// val: '' + this.direction + '::' + this.trainCode
|
|
|
|
|
|
// };
|
|
|
|
|
|
// this.loading = true;
|
|
|
|
|
|
// this.$store.dispatch('training/nextNew', operate).then(({ valid }) => {
|
|
|
|
|
|
// this.loading = false;
|
|
|
|
|
|
// if (valid) {
|
|
|
|
|
|
// this.doClose();
|
|
|
|
|
|
// }
|
|
|
|
|
|
// }).catch(() => {
|
|
|
|
|
|
// this.loading = false;
|
|
|
|
|
|
// this.doClose();
|
|
|
|
|
|
// EventBus.$emit('sendMsg', {message: '命令执行失败！'});
|
|
|
|
|
|
// });
|
|
|
|
|
|
},
|
|
|
|
|
|
cancel() {
|
|
|
|
|
|
const operate = {
|
|
|
|
|
|
operation: OperationEvent.Command.cancel.menu.operation
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
this.$store.dispatch('training/nextNew', operate).then(({ valid }) => {
|
|
|
|
|
|
if (valid) {
|
|
|
|
|
|
this.doClose();
|
|
|
|
|
|
}
|
|
|
|
|
|
}).catch(() => {
|
|
|
|
|
|
this.doClose();
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
};
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
|
|
|
|
|
.route-setting {
|
|
|
|
|
|
.content_box {
|
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
|
.el-button{
|
|
|
|
|
|
&.active{
|
|
|
|
|
|
background: #969696;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
.table_content_box{
|
|
|
|
|
|
margin-bottom: 20px;
|
|
|
|
|
|
}
|
|
|
|
|
|
/deep/ {
|
|
|
|
|
|
.table{
|
|
|
|
|
|
.table_header_box{
|
|
|
|
|
|
.cell{
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
word-break: break-word;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|
