<template>
    <view class="contract-layout">
        <w-navbarComp :title="title">
            <view v-if="left">
                <template #left>
                    <view class="back-icon" @click="handleBack">
                        <TIcon name="icon-left" :size="30" />
                    </view>
                </template>
            </view>
        </w-navbarComp>
        <img class="bg" src="@/static/images/bg.png" />
        <slot />
    </view>
</template>

<script setup lang="ts">
defineProps({
    title: {
        type: String,
        default: ''
    },
    left: {
        type: Boolean,
        default: true
    }
})
const handleBack = () => {
    uni.navigateBack({
        delta: -1
    })
}
</script>
<style lang="scss" scoped>
.contract-layout {
    width: 100vw;
    height: 100vh;
    display: flex;
    flex-direction: column;
    .back-icon {
        width: 80rpx;
        height: 80rpx;
        @include flex-center;
    }
    .bg {
        position: fixed;
        left: 0;
        top: 0;
        width: 100vw;
        height: 100vh;
        z-index: -1;
    }
}
</style>
