<template>
    <view class="image-wraper">
        <view class="header-wrap" :style="{ paddingTop: info.statusBarHeight + 'px' }">
            <theme-image src="@/static/image_tb.jpg" class="header-image" mode="widthFix"></theme-image>
            <view class="back-area" @click.stop="handleBack"></view>
            <view class="open-area" @click.stop="handleOpen"></view>
        </view>
        <view class="img-wrap relative" :style="{ paddingTop: (info.statusBarHeight + 46) + 'px' }">
            <theme-image src="@/static/image_luodiye.jpg" class="full-image" mode="widthFix"></theme-image>
            <view class="click-btn" @click.stop="handleOpen"></view>
        </view>
    </view>
</template>
<script setup>
import { openUrl } from '@/module/utils/openUrl';


const info = uni.getWindowInfo();
const handleOpen = () => {
    // to download and report
    console.log('click', import.meta.env.VITE_WALLET_URL);
    openUrl(import.meta.env.VITE_WALLET_URL)

}
const handleBack = () => {
    uni.navigateBack();
}

</script>
<style lang="scss" scoped>
.image-wraper {
    width: 100%;
    min-height: 100vh;

    .header-wrap {
        width: 100%;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 10;
        background-color: #80050A;
        height: 92rpx;


        .header-image {
            width: 100%;
            display: block;
            height: 92rpx;
        }

        .back-area {
            position: absolute;
            left: 10px;
            top: 0;
            width: 60px;
            height: 50px;
            z-index: 1000;
        }

        .open-area {
            position: absolute;
            right: 10px;
            top: 0;
            width: 220px;
            height: 50px;
            z-index: 1000;
        }
    }

    .full-image {
        width: 100%;
        display: block;
    }

    .img-wrap {
        width: 100%;

        .click-btn {
            position: absolute;
            bottom: 40rpx;
            left: 50%;
            transform: translateX(-50%);
            width: 400rpx;
            height: 90rpx;
            z-index: 50;
        }
    }
}
</style>