rt-sim-training-client/src/views/bigTrainRunplanManage/trackInformation.vue

<template>
  <el-dialog
    v-dialogDrag
    class="datie-02__systerm"
    :title="title"
    :visible.sync="show"
    width="660px"
    :before-close="doClose"
    :z-index="2000"
    :modal="false"
    :close-on-click-modal="false"
  >
    <div class="TrackInformation">
      <!-- 111 -->
      <!-- form -->
      <el-form ref="form" :model="model" label-width="85px" :rules="rules">
        <el-form-item label="股道:" prop="code">
          <el-select v-model="model.code" placeholder="" style="width:135px;margin-right:200px" disabled>
            <el-option
              v-for="item in filterSectionList"
              :key="item.code"
              :label="item.name"
              :value="item.code"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="线路性质:" prop="trackNature">
          <el-select v-model="model.trackNature" placeholder="" style="width:145px">
            <el-option
              v-for="item in lineTypeList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="接发车方向:" prop="direction">
          <el-select v-model="model.direction" placeholder="" style="width:90px">
            <el-option
              v-for="item in directionList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="接发车类型:" prop="trainType">
          <el-select v-model="model.trainType" placeholder="" style="width:90px">
            <el-option
              v-for="item in typeList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="超限类型:" prop="transfinite">
          <el-select v-model="model.transfinite" placeholder="" style="width:145px">
            <el-option
              v-for="item in transfiniteTypeList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="站台:" prop="standType">
          <el-select v-model="model.standType" placeholder="" style="width:90px">
            <el-option
              v-for="item in standTypeList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="允许动车组:" prop="motorCar">
          <el-select v-model="model.motorCar" placeholder="" style="width:90px">
            <el-option
              v-for="item in allowEmuList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="上水设备:" prop="waterSupply">
          <el-select v-model="model.waterSupply" placeholder="" style="width:145px">
            <el-option
              v-for="item in addWaterEquList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="排污设备:" prop="sewageAbsorption">
          <el-select v-model="model.sewageAbsorption" placeholder="" style="width:90px">
            <el-option
              v-for="item in sewageEquList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="军用:" prop="military">
          <el-select v-model="model.military" placeholder="" style="width:90px">
            <el-option
              v-for="item in militaryList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
      </el-form>
    </div>
    <div style="text-align:right;display:inline-block;width:100%;">
      <div class="trackBtn">
        <el-button :id="domIdCancel" @click="cancel">取消</el-button>
      </div>
      <div class="trackBtn">
        <el-button :id="domIdConfirm " type="primary" :loading="loading" @click="commit">确定 </el-button>
      </div>
    </div>
  </el-dialog>
</template>
<script>
import { OperationEvent } from '@/scripts/cmdPlugin/OperationHandler';
import {menuOperate, commitOperate} from '@/jmapNew/theme/components/utils/menuOperate';
export default {
    name: 'TrackInformation',
    data() {
        return {
            dialogShow: false,
            loading: false,
            filterSectionList:[],
            // trackSectionCode:'',
            lineTypeList:[
                {label:'正线', value:'RIGHT_TRACK'},
                {label:'到发线', value:'ARRIVE_DEPART_TRACK'}
            ],
            directionList:[
                {label:'上行', value:'S'},
                {label:'下行', value:'X'},
                {label:'上下行', value:'D'}
            ],
            typeList:[
                {label:'客车', value:'VAN'},
                {label:'货车', value:'GOODS_VAN'},
                {label:'客货车', value:'PASSENGER'}
            ],
            transfiniteTypeList:[
                {label:'不能接发超限列车', value:'NO'},
                {label:'一级超限', value:'TRANSFINITE_ONE_LEVEL'},
                {label:'二级超限', value:'TRANSFINITE_TWO_LEVEL'},
                {label:'超级超限', value:'TRANSFINITE_SUPER'}
            ],
            standTypeList:[
                {label:'无', value:'NO'},
                {label:'高站台', value:'LOW'},
                {label:'低站台', value:'HIGH'}
            ],
            allowEmuList:[
                {label:'是', value:true},
                {label:'否', value:false}
            ],
            addWaterEquList:[
                {label:'有', value:true},
                {label:'无', value:false}
            ],
            sewageEquList:[
                {label:'有', value:true},
                {label:'无', value:false}
            ],
            militaryList:[
                {label:'是', value:true},
                {label:'否', value:false}
            ],
            model:{
                code:'',
                trackNature:'', // 线路性质  正线/到发线
                direction:'', // 接发车方向  上行、下行、 上下行
                trainType:'', // 接发车类型  客车/货车/客货车
                transfinite:'', // 超限类型  选择“不能接发超限列车/一级超限/二级超限/超级超限”
                standType:'', // 站台 选择“无/高站台/低站台”
                motorCar:'', // 允许动车组  选择“是/否”。
                waterSupply:'', // 上水设备 选择“有/无”
                sewageAbsorption:'', // 排污设备 选择“有/无”
                military:'', // 军用  是/否
                stationCode:'' // 车站
            },
            rules:{

            }
        };
    },
    computed: {
        show() {
            return this.dialogShow && !this.$store.state.menuOperation.break;
        },
        domIdCancel() {
            return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
        },
        domIdConfirm() {
            return this.dialogShow ? OperationEvent.CTCCommand.modifyStationTrack.menu.domId : '';
        },
        title() {
            return '股道信息';
        }
    },
    methods:{
        doShow({row, filterSectionMap, stationCode}) {
            this.filterSectionList = Object.values(filterSectionMap);
            this.model.stationCode = stationCode;
            this.dialogShow = true;
            this.$nextTick(function () {
                this.$store.dispatch('training/emitTipFresh');
            });
            this.model = Object.assign({}, row);
        },
        doClose() {
            this.loading = false;
            this.dialogShow = false;
        },
        commit() {
            this.$refs.form.validate((valid) => {
                if (valid) {
                    this.loading = true;
                    commitOperate(menuOperate.CTC.modifyStationTrack, this.model, 3).then(({valid})=>{
                        if (valid) {
                            this.doClose();
                        }
                    }).catch(() => {
                        this.doClose();
                        this.$emit('noticeInfo');
                    });
                }
            });
        },
        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 lang="scss" scoped>
.trackBtn{display:inline-block;margin-right: 10px;}
.TrackInformation .el-form-item{
    display:inline-block;
    margin-bottom:20px;
}
.TrackInformation{margin-bottom: 15px;}
</style>
<style lang="scss">
.TrackInformation .el-form-item__content {
    line-height: 30px;
}
</style>