<template>
    <div class="audit-failure">
        <van-image src="@/assets/auditFailure.png" fit="contain" width="150px"></van-image>
        <div style="color:#3C4067;font-size: 16px;">审核失败...</div>
        <div style="color:#B6B5BA;font-size:14px;line-height: 2em;">失败原因:{{message}}</div>

        <div class="btn" @click="reAudit">重新认证</div>
    </div>
</template>
<script lang="ts">
import { Component, Prop, Vue, Emit } from 'vue-property-decorator';
import { Cell, Form, Field, CellGroup, Button, Image, RadioGroup, Radio } from 'vant';
import { State, Getter, Action, Mutation } from 'vuex-class';
import { Route } from 'vue-router';
@Component({
  components: {
    [Form.name]: Form,
    [Field.name]: Field,
    [Button.name]: Button,
    [Image.name]: Image,
    [Cell.name]: Cell,
    [RadioGroup.name]: RadioGroup,
    [Radio.name]: Radio,
  },
})
export default class AuditFailure extends Vue {
  @Prop({
    required: true,
  })private message!: string;
  @Emit('re-audit')
  private reAudit() {
    return;
  }
}
</script>
<style scoped lang="scss">
  .audit-failure{
    padding: 17px;
    .btn{
      display: inline-block;
      width:100px;
      height:40px;
      line-height: 40px;
      margin-top: 50px;
      background:rgba(63,121,254,1);
      border-radius:4px;
      color: #FFFFFF;
    }
  }
</style>