
<template>
    <view>
        <image :src="resource.red_envelope_rain_bg" web class="red-bg" mode="aspectFill"/>
        <view class="bottom-fixed flex-column-align-center" style="padding-bottom: 100rpx">
            <view style="padding-bottom: 270rpx">
                <image :src="resource.red_rule_time" style="width: 258rpx; height: 123rpx"/>
            </view>
            <image :src="resource.refresh" style="width: 90rpx; height: 90rpx" @click="refresh"/>
        </view>
    </view>
</template>

<script>
import resource from '@/utils/resource'
import { throttle } from '@/utils'

export default {
    data() {
        return {
            resource
        }
    },
    methods: {
        refresh() {
            throttle.call(this.realRefresh)
        },
        realRefresh() {
            this.$emit('refresh')
        }
    }
}
</script>

<style lang="scss" scoped>
.red-bg {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 101vh;
}
</style>