<template>
    <!-- 顶部导航栏 -->
    <van-nav-bar class="navBar" :fixed="true">
            <template #left>
                <div>
                    <van-icon name="cross" size="18" color="#333333"/>
                </div>
            </template>
            <template #right>
                <van-icon name="ellipsis" size="18" color="#333333"/>
            </template>
    </van-nav-bar>
    <div class="content">
        <!-- 实名认证成功 -->
        <div class="authentication_successful" v-if="authenticationStatus == 'authenticationSuccessful'">
            <div class="authentication_successful_one">实名认证成功</div>
            <div class="authentication_successful_two">认证成功后不能修改</div>
            <div class="authentication_successful_information">
                <div class="authentication_successful_name">姓名</div>
                <div class="authentication_successful_text">奶盖</div>
            </div>
            <div class="authentication_successful_information">
                <div class="authentication_successful_name">手机号码</div>
                <div class="authentication_successful_text">188656565656</div>
            </div>
            <div class="authentication_successful_information">
                <div class="authentication_successful_name">身份证号</div>
                <div class="authentication_successful_text">371325565656565656</div>
            </div>
            <div class="authentication_successful_information">
                <div class="authentication_successful_name">身份证照</div>
                <div class="authentication_successful_text">已上传</div>
            </div>
            <div class="real_name_return">
                <div class="real_name_return_con">返回</div>
            </div>
        </div>
        <!-- 实名认证审核中 -->
        <div class="under_review" v-if="authenticationStatus == 'underReview'">
            <img :src="require('@assets/shenqing_shenhezhong.png')" alt="" class="under_review_img">
            <div class="under_review_title">资料审核中</div>
            <div class="under_review_tip">平台将于3日内完成资料审核，请耐心等待</div>
            <div class="under_review_return">
                <div class="under_review_return_con">返回</div>
            </div>
        </div>
        <!-- 实名认证失败 -->
        <div class="under_review" v-if="authenticationStatus == 'auditFailed'">
            <img :src="require('@assets/shenqing_weitongguo.png')" alt="" class="under_review_img">
            <div class="under_review_title">资料审核失败</div>
            <div class="audit_failed_tip">很遗憾，您的资料审核失败，请检查您填写的资料是否正确以及上传照片是否清晰</div>
            <div class="under_review_return">
                <div class="under_review_return_con">重新填写</div>
            </div>
        </div>
    </div>
</template>

<script>

export default {
    data(){
        return{
            authenticationStatus: "auditFailed",
        }
    } 
};
</script>

<style lang="less" scoped>
    .navBar{
        width: 100%;
        height: 44px;
    }
    .content{
        width: 100%;
        height: 100%;
        position: absolute;
        background: #0F0F27;
        margin-top: 44px;
        .authentication_successful{
            width: 100%;
            padding: 16px;
            box-sizing: border-box;
            .authentication_successful_one{
                font-size: 20px;
                font-family: PingFangSC-Medium, PingFang SC;
                font-weight: 500;
                color: #FFFFFF;
                margin-bottom: 6px;
            }
            .authentication_successful_two{
                font-size: 12px;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #FFCA5E;
                margin-bottom: 20px;
            }
            .authentication_successful_information{
                display: flex;
                margin-bottom: 16px;
                font-size: 14px;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #5F646F;
                .authentication_successful_name{
                    width: 56px;  
                    margin-right: 24px;
                }
            }
            .real_name_return{
                padding: 0 50px;
                box-sizing: border-box;
                margin-top: 100px;
                .real_name_return_con{
                    width: 100%;
                    height: 40px;
                    background: #29293F;
                    border-radius: 8px;
                    line-height: 40px;
                    text-align: center;
                    font-size: 16px;
                    font-family: PingFangSC-Medium, PingFang SC;
                    font-weight: 500;
                    color: #939599;
                }
            }
        }
        .under_review{
            .under_review_img{
                margin: 50px 0px 30px 133px;
                width: 110px;
                height: 86px;
            }
            .under_review_title{
                text-align: center;
                font-size: 20px;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #FFFFFF;
                margin-bottom: 16px;
            }
            .under_review_tip{
                text-align: center;
                font-size: 14px;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #939599;
            }
            .audit_failed_tip{
                padding: 0 37px;
                box-sizing: border-box;
                font-size: 14px;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: #939599;
                line-height: 24px;
                text-align: center;
            }
            .under_review_return{
                margin-top: 100px;
                padding: 0 67px;
                box-sizing: border-box;
                .under_review_return_con{
                    width: 100%;
                    height: 40px;
                    background: #29293F;
                    border-radius: 8px;
                    font-size: 16px;
                    font-family: PingFangSC-Medium, PingFang SC;
                    font-weight: 500;
                    color: #939599;
                    line-height: 40px;
                    text-align: center;
                }
            }
        }
    }
</style>
