<template>
  <div>
    <el-form
      class="dialog-info"
      v-if="currentTicket">
      <el-form-item label="票种">
        {{ currentTicket.name }}
      </el-form-item>
      <el-form-item label="总价">
        {{ totalPrice }}
      </el-form-item>
    </el-form>
    <div class="table-box">
      <el-table
        border
        stripe
        width="100%"
        :data="guestList"
      >
        <el-table-column
          label="#"
          type="index"
        >
        </el-table-column>
        <el-table-column
          prop="guestName"
          label="游客姓名"
        >
          <template slot-scope="scope">
            {{ scope.row.guestName || '（空）' }}
          </template>
        </el-table-column>
        <el-table-column
          label="身份证"
        >
          <template slot-scope="scope">
            {{ scope.row.guestIdentify || '（空）' }}
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="dialog-btn-wrap">
      <el-button
        @click="handleClose"
      >
        取消
      </el-button>
      <el-button
        @click="emitSubmit"
        type="primary"
      >
        确定
      </el-button>
    </div>
  </div>
</template>
<script>
export default {
  props: {
    currentTicket: {
      type: Object,
      default: () => {}
    },
    guestList: {
      type: Array,
      default: () => []
    },
    totalPrice: {
      type: Number,
      default: 0
    }
  },
  methods: {
    handleClose () {
      this.$parent.handleClose()
    },
    emitSubmit () {
      this.$emit('submit')
      this.handleClose()
    }
  }
}
</script>
