<template>
    <div class="submit">
        <NavHeader color="#0687D2" title="提交成功" @back="$router.go(-1)" />
        <div class="content">
            <div class="img">
                <img src="./img/success.png" alt="">
            </div>
            <div class="apply">您的申请已提交</div>
            <div class="declare">可至 我的申报 查看审核进度</div>
            <div class="button">
                <van-button round color="#0687D2" size="large">
                    <van-count-down :time="time" @finish="finish">
                        <template #default="timeData">
                            <span>{{ timeData.seconds }}秒后返回原页面</span>
                        </template>
                    </van-count-down>
                </van-button>
            </div>
        </div>
    </div>
</template>

<script>
import NavHeader from "@/components/NavHeader";
import Vue from 'vue';
import { Button,CountDown  } from 'vant';

Vue.use(Button)
    .use(CountDown);
export default {
    components: { NavHeader },
    data() {
        return {
            time: 4000,
        }
    },
    methods: {
        finish() {
            this.$router.push({
                name: 'PolicyReportThree',
            });
        }
    },
}
</script>

<style lang="stylus" scoped>
.content{
    display flex;
    flex-direction column;
    align-items center;
    padding 0 75px;
    .img{
        width 180px;
        height 180px;
        margin 200px 0 85px 0;
        img{
            width 100%;
            height 100%;
        }
    }
    .apply{
        font-size: 36px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: #333333;
        line-height: 50px;
    }
    .declare{
        font-size: 24px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #666666;
        line-height: 33px;
        padding 20px 0 80px 0;
    }
    .button{
        width 600px;
    }
}
</style>