<template>
    <div class="fruit6">
        <div class="content">
            <img class="img" src="./images/6-1.png" alt="">
            <div class="name">提货成功</div>
        </div>
        <div class="bottom">
            <div class="operation" @click="jump">查看详情</div>
            <div class="safe-area"></div>
        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {
            qrCode: '',
        }
    },
    created() {
        this.qrCode = this.$route.query
    },
    methods: {
        jump() {
            this.$router.replace({
                name: "FruitIndex",
                query: {code: this.qrCode},
            });
        }
    },
}
</script>

<style lang="stylus" scoped>
.fruit6{
    height: 100vh;
    height 100%
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    .content{
        box-sizing: border-box;
        padding-bottom: constant(safe-area-inset-bottom);
        padding-bottom: env(safe-area-inset-bottom);
        height: calc(100vh - 100px);
        overflow-y: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        color: #333;    
        img{
            width 150px;
            height 150px;
        }
        .name{
            font-size: 40px; 
            font-weight: 600;
            margin: 20px 0 400px 0;
        }
    }  
    .bottom {
        display: flex;
        flex-direction: column;
        position: fixed
        bottom: 0;
        width: 100%;
        left: 0px;
        box-sizing: border-box;
        padding-bottom: constant(safe-area-inset-bottom);
        padding-bottom: env(safe-area-inset-bottom);
        .operation {
            width: 100%;
            background: #EB4E3F;
            font-size: 40px;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            color: #fff;
            line-height: 100px;
            text-align: center;
            margin-top: 20px;
        }
    }  
}
</style>