<template>
  <el-row>
    <el-col v-for="l in list" :key="l.id" :span="24">
      <!--      @click="showSignInfo(l)"goTrainDetail-->
      <train-card :data="l" :h="false" @click="showSignInfo(l.id)">
        <span v-if="l.orderStatus=='1'" type="primary" style="display: inline-block" class="roundLabel bg-miti" @click.stop="showPay(l)">去缴费</span>
        <span v-if="l.orderStatus=='2'||l.orderStatus=='5'" style="display: inline-block" class="bg-gold roundLabel">审核通过</span>
        <span v-if="l.orderStatus=='3'" class="bg-danger roundLabel" style="display: inline-block">审核未通过</span>
      </train-card>
    </el-col>
  </el-row>
  <el-empty v-if="list.length==0" />

  <el-dialog v-model="bankShow" title="线下支付" width="400" append-to-body>
    <el-descriptions border :column="1">
      <el-descriptions-item label="单位名称" label-class-name="w100px">{{ bankInfo.name }}</el-descriptions-item>
      <el-descriptions-item label="开户行">{{ bankInfo.bank }}</el-descriptions-item>
      <el-descriptions-item label="账户">{{ bankInfo.account }}</el-descriptions-item>
    </el-descriptions>

    <template #footer>
      <div class="dialog-footer text-center">
        <el-button type="primary" round @click="bankShow=false">确定</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup>
import { ref } from 'vue'
import { getMyOrder } from '@/apiPc/train'
import TrainCard from '@/viewsPc/components/trainCard'

const emit = defineEmits(['showTrain', 'showSign'])

const list = ref([])
const bankShow = ref(false)
const bankInfo = ref({})

function init() {
  getMyOrder().then(res => {
    list.value = res.rows
  })
}

function goTrainDetail(id) {
  emit('showTrain', id)
}

function showSignInfo(item) {
  if (item.orderStatus == '1') {
    emit('showSign', {
      id: item.id,
      receivingInfo: item.receivingInfo
    })
  } else {
    emit('showSign', { id: item.id })
  }
}

function showPay(item) {
  bankInfo.value = JSON.parse(item.receivingInfo)
  bankShow.value = true
}

defineExpose({
  init,
  showPay
})
</script>

<style scoped>

</style>