<template>
    <div>
        <el-dialog
            :visible.sync="dialogVisibleNoBindBankcard"
            width="330px"
            :before-close="closeDialog"
            :show-close="false"
            class="dialog-box"
        >
            <img src="~assets/images/icon-status-no-bind-bankcard.png" alt>
            <h3>添加提现银行卡</h3>
            <p>
                请至「个人中心」的「银行卡管理」
                <br>添加您的提现银行卡
            </p>
            <div class="layout-btn" @click="toBankcard">立即添加</div>
            <a href="javascript:;" class="later-btn" @click="closeDialog">稍后添加</a>
        </el-dialog>
    </div>
</template>

<script>
export default {
    name: "noAuth",
    data() {
        return {};
    },
    props: {
        dialogVisibleNoBindBankcard: Boolean
    },
    methods: {
        closeDialog() {
            this.$emit("close");
        },
        toBankcard() {
            this.$router.push({
                path: "/center/bankcard"
            });
        }
    }
};
</script>

<style lang="less" scoped>
@import "../../assets/styles/common.css";
.dialog-box {
    h3 {
        margin-top: 30px;
        font-size: 24px;
        color: #3d86e9;
    }
    p {
        margin-top: 20px;
        font-size: 14px;
        color: #666;
    }
}
.layout-btn {
    width: 262px;
    margin: 40px auto 18px;
}
.later-btn {
    color: #666;
}
</style>
