rt-sim-training-client/src/jmapNew/theme/datie_02/menus/dialog/standDetail.vue

<template>
  <el-dialog
    v-dialogDrag
    class="chengdou-03__systerm stand-detail"
    :title="title"
    :visible.sync="show"
    width="380px"
    :before-close="doClose"
    :z-index="2000"
    :modal="false"
    :close-on-click-modal="false"
  >
    <el-row class="header">
      <el-col :span="10">
        <span>车站</span>
      </el-col>
      <el-col :span="10" :offset="2">
        <span>站台</span>
      </el-col>
    </el-row>
    <el-row class="header">
      <el-col :span="10">
        <el-input v-model="stationName" size="small" disabled />
      </el-col>
      <el-col :span="10" :offset="2">
        <el-input v-model="standName" style="padding: 0 3px;" size="small" disabled />
      </el-col>
    </el-row>
    <el-row class="content">
      <el-col :span="6">
        <span>停站时间</span>
      </el-col>
      <el-col :span="18">
        <el-input v-model="modelData.stopTime" size="small" disabled />
      </el-col>
    </el-row>
    <el-row class="content">
      <el-col :span="6">
        <span>运行等级</span>
      </el-col>
      <el-col :span="18">
        <el-input v-model="modelData.runLevel" size="small" disabled />
      </el-col>
    </el-row>
    <el-row class="content">
      <el-col :span="6">
        <span>扣车</span>
      </el-col>
      <el-col :span="18">
        <el-input v-model="modelData.detainCar" size="small" disabled />
      </el-col>
    </el-row>
    <el-row class="content">
      <el-col :span="6">
        <span>跳停</span>
      </el-col>
      <el-col :span="18">
        <el-input v-model="modelData.jumpStop" size="small" disabled />
      </el-col>
    </el-row>
    <el-row justify="center" class="button-group">
      <el-col :span="18">
        <span style="opacity: 0;">1</span>
      </el-col>
      <el-col :span="4">
        <el-button :id="domIdConfirm" type="primary" :loading="loading" @click="commit">退出</el-button>
      </el-col>
    </el-row>
    <notice-info ref="noticeInfo" pop-class="chengdou-03__systerm" />
  </el-dialog>
</template>

<script>
import { mapGetters } from 'vuex';
import { OperationEvent } from '@/scripts/cmdPlugin/OperationHandler';
import NoticeInfo from '@/jmapNew/theme/components/menus/childDialog/noticeInfo';
// import CMD from '@/scripts/cmdPlugin/CommandEnum';
import CancelMouseState from '@/mixin/CancelMouseState';

export default {
    name: 'StandDetail',
    components: {
        NoticeInfo
    },
    mixins: [
        CancelMouseState
    ],
    data() {
        return {
            dialogShow: false,
            loading: false,
            tempData: [],
            stationName: '',
            standName: '',
            runLevelList: [
                '自动',
                '低速',
                '常速',
                '高速'
            ],
            modelData: {
                stopTime: '自动',
                runLevel: '自动',
                detainCar: '无扣车',
                jumpStop: '无跳停'
            }
        };
    },
    computed: {
        ...mapGetters('map', [
            'mapConfig',
            'stationList'
        ]),
        show() {
            return this.dialogShow && !this.$store.state.menuOperation.break;
        },
        domIdCancel() {
            return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
        },
        domIdConfirm() {
            return this.dialogShow ? OperationEvent.Command.close.confirm.domId : '';
        },
        title() {
            return '站台信息';
        }
    },
    methods: {
        loadInitData(selected, opts) {
            this.tempData = [];

            // const stationList = this.stationList.slice();
            // const index = this.stationList.findIndex(n => n.code == selected.stationCode);
            // let stationStand, station;
            // if (selected.direction == '01') { // 下行
            //     // 下行时，此站不是最后一站
            //     if (index != 0) {
            //         stationStand = this.$store.getters['map/getDeviceByCode'](this.stationList[index - 1].code);
            //         station = this.$store.getters['map/getDeviceByCode'](stationStand.stationCode);
            //     }
            // } else {
            //     // 上行时，此站不是最后一站
            //     if (index != this.stationList.length - 1) {
            //         stationStand = this.$store.getters['map/getDeviceByCode'](this.stationList[index + 1].code);
            //         station = this.$store.getters['map/getDeviceByCode'](stationStand.stationCode);
            //     }
            // }
            this.modelData = {
                stopTime: selected.parkingTime < 0 ? '自动' : `${selected.parkingTime} 秒`,
                runLevel: this.runLevelList[selected.runLevelTime],
                detainCar: selected.stationHoldTrain || selected.centerHoldTrain ? '已设置' : '无扣车',
                jumpStop: selected.allSkip || selected.assignSkip ? '已设置' : '无跳停'
            };
        },
        doShow(operate, selected, opts) {
            this.selected = selected;
            if (!this.dialogShow) {
                this.standName = '';
                this.stationName = '';
                if (selected && selected._type.toUpperCase() === 'StationStand'.toUpperCase()) {
                    if (this.mapConfig.upRight) {
                        this.standName = selected.right ? '上行' : '下行';
                    } else if (!this.mapConfig.upRight) {
                        this.standName = selected.right ? '下行' : '上行';
                    }
                    const station = this.$store.getters['map/getDeviceByCode'](selected.stationCode);
                    if (station) {
                        this.stationName = station.name;
                    }
                }
                this.loadInitData(selected, opts);
            }
            this.dialogShow = true;
            this.$nextTick(function () {
                this.$store.dispatch('training/emitTipFresh');
            });
        },
        doClose() {
            this.loading = false;
            this.dialogShow = false;
            this.$store.dispatch('training/emitTipFresh');
        },
        commit() {
            const operate = {
                operation: OperationEvent.Command.close.confirm.operation
            };

            this.loading = true;
            this.$store.dispatch('training/nextNew', operate).then(({ valid }) => {
                this.loading = false;
                if (valid) {
                    this.doClose();
                }
            }).catch(() => {
                this.loading = false;
                this.doClose();
            });
        },
        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>
    .content {
        margin-top: 20px;
    }
</style>