rt-sim-training-client/src/views/newMap/trainTicket/redLicence.vue

<template>
  <div style="border: 1px solid #000000;margin-top: 20px;padding: 20px;background: #e799d8;">
    <div style="text-align: center;font-size: 28px;">许&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;可&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;证</div>
    <div style="font-size: 14px;margin-top: 15px;display: flex;align-items: center;margin-bottom: 20px;justify-content: end;">
      <div>第</div>
      <el-input v-model="redLicenseForm.number" :disabled="switchFlag" size="small" style="width: 80px;" />
      <div style="margin-right: 20px;">号</div>
    </div>
    <div style="font-size: 16px;margin-top: 10px;text-indent:36px;">
      <span>现在一切电话中断，准许第</span>
      <el-input v-model="redLicenseForm.licenseTripNumber" :disabled="switchFlag" style="display: inline;" size="small" class="inline-input" />
      <span>次列车自</span>
      <el-input v-model="redLicenseForm.licenseStation" :disabled="switchFlag" style="display: inline;" size="small" class="inline-input" />
      <span>站至</span>
      <el-input v-model="redLicenseForm.licenseNextStation" :disabled="switchFlag" style="display: inline;" size="small" class="inline-input" />
      <span>站，本列车前于</span>
      <el-input v-model="redLicenseForm.licenseHour" :disabled="switchFlag" style="display: inline;" size="small" class="inline-input" />
      <span>时</span>
      <el-input v-model="redLicenseForm.licenseMinute" :disabled="switchFlag" style="display: inline;" size="small" class="inline-input" />
      <span>分发出的第</span>
      <el-input v-model="redLicenseForm.licenseTripNumber2" :disabled="switchFlag" style="display: inline;" size="small" class="inline-input" />
      <span>次列车，邻站到达通知</span>
      <el-radio-group v-model="redLicenseForm.licenseReceived" :disabled="switchFlag" style="display: inline;">
        <el-radio :label="true">已</el-radio>
        <el-radio :label="false" style="margin-left: 5px;">未</el-radio>
      </el-radio-group>
      <span>收到</span>
    </div>
    <div style="text-align: center;font-size: 28px;margin-top: 10px;">通&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;知&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;书</div>
    <div style="font-size: 16px;margin-top: 10px;text-indent: 36px;">
      <span>1.第</span>
      <el-input v-model="redLicenseForm.noticeTripNumber" :disabled="switchFlag" style="display: inline;" size="small" class="inline-input" />
      <span>次列车到达你站后，准接你站发出的列车。</span>
    </div>
    <div style="font-size: 16px;margin-top: 10px;text-indent: 36px;">
      <span>2.于</span>
      <el-input v-model="redLicenseForm.noticeHour1" :disabled="switchFlag" style="display: inline;" size="small" class="inline-input" />
      <span>时</span>
      <el-input v-model="redLicenseForm.noticeMinute1" :disabled="switchFlag" style="display: inline;" size="small" class="inline-input" />
      <span>分发出第</span>
      <el-input v-model="redLicenseForm.noticeTripNumber1" :disabled="switchFlag" style="display: inline;" size="small" class="inline-input" />
      <span>次列车，并于</span>
      <el-input v-model="redLicenseForm.noticeHour2" :disabled="switchFlag" style="display: inline;" size="small" class="inline-input" />
      <span>时</span>
      <el-input v-model="redLicenseForm.noticeMinute2" :disabled="switchFlag" style="display: inline;" size="small" class="inline-input" />
      <span>分再发出第</span>
      <el-input v-model="redLicenseForm.noticeTripNumber2" :disabled="switchFlag" style="display: inline;" size="small" class="inline-input" />
      <span>次列车。</span>
    </div>
    <div style="font-size: 16px;margin-top: 60px;display: flex;align-items: center;justify-content: end;">
      <div><span style="color: #f00;">{{ redLicenseForm.stationSeal }}</span>（站名印）车站值班员（签名）</div>
      <el-input v-model="redLicenseForm.signature" :disabled="switchFlag" size="small" style="width: 80px;" />
    </div>
    <div style="font-size: 16px;margin-top: 15px;display: flex;align-items: center;margin-bottom: 10px;justify-content: end;">
      <el-input v-model="redLicenseForm.year" :disabled="switchFlag" size="small" style="width: 80px;" />
      <div>年</div>
      <el-input v-model="redLicenseForm.moon" :disabled="switchFlag" size="small" style="width: 80px;" />
      <div>月</div>
      <el-input v-model="redLicenseForm.day" :disabled="switchFlag" size="small" style="width: 80px;" />
      <div>日填发</div>
    </div>
    <div v-if="switchFlag" style="text-align: center;">
      <el-select v-model="memberId" size="small" style="width: 200px" placeholder="请选择">
        <el-option
          v-for="item in giveMemberList"
          :key="item.id"
          :label="item.labelName"
          :disabled="item.userId == userId"
          :value="item.id"
        />
      </el-select>
      <el-button size="small" style="margin-left: 10px;" type="primary" @click="giveTicket">给予</el-button>
    </div>
  </div>
</template>

<script>
export default {
    name: 'RedLicence',
    props: {
        redLicenseForm:{
            type: Object,
            required: true
        },
        switchFlag:{
            type: Boolean,
            required: true
        },
        giveMemberList: {
            type: Array,
            default() {
                return [];
            }
        }
    },
    data() {
        return {
            memberId: ''
        };
    },
    computed: {
        userId() {
            return this.$store.state.user ? this.$store.state.user.id : '';
        }
    },
    methods: {
        giveTicket() {
            if (this.memberId) {
                this.$emit('giveTicket', { ticketId: this.redLicenseForm.id, memberId: this.memberId });
                this.memberId = '';
            }
        }
    }
};
</script>

<style scoped>

</style>