<template>
  <el-dialog
    v-dialogDrag
    class="route-setting"
    :title="title"
    :visible.sync="show"
    width="900px"
    label-position="top"
    :before-close="doClose"
    :z-index="2002"
    :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">
          <el-input size="mini" style="width: 400px;" :disabled="true" />
        </el-col>
        <el-col :span="12">
          <el-input size="mini" style="width: 400px;" />
        </el-col>
      </el-row>
      <div style="display: flex;">
        <el-button>显示列车信息</el-button>
        <el-button>修改列车资料</el-button>
        <el-button>创建列车号</el-button>
        <el-button>删除列车号</el-button>
        <el-button>步进列车号</el-button>
        <el-button>重排列车号</el-button>
      </div>
    </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,
            selected: null
        };
    },
    computed: {
        ...mapGetters('map', [
            'map',
            'stationList'
        ]),
        show() {
            return this.dialogShow && !this.$store.state.menuOperation.break;
        },
        title() {
            return '列监';
        }
    },
    methods: {
        loadInitData(map) {
            console.log(map, 11111);
        },
        doShow(operate, selected) {
            this.dialogShow = true;
            this.selected = selected;

            this.loadInitData(this.map);

            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;
        },
        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>
