<template>
    <view class="red-packet-page">
        <!-- Navigation Bar is likely handled by pages.json configuration or custom nav -->
        <!-- Since style says navigationStyle: custom might be needed for some pages, but here we stick to default or simple -->

        <page-scroll
            ref="pageScroll"
            emptyText="暂无红包"
            url="/token/shop/order/myCouponList"
            method="POST"
            @updateList="updateList"
            slotEmpty
        >
            <view class="list-container">
                <red-packet-item v-for="(item, index) in list" :key="index" :info="item" @use="handleUse" />
            </view>
        </page-scroll>
    </view>
</template>

<script>
    import PageScroll from '@/components/pageScroll/index.vue';
    import RedPacketItem from '../components/red-packet-item.vue';

    export default {
        components: {
            PageScroll,
            RedPacketItem
        },
        data() {
            return {
                list: []
            };
        },
        methods: {
            updateList(data) {
                this.list = data;
            },
            handleUse(item) {
                uni.switchTab({
                    url: '/pages/sell/index'
                });
            }
        },
    }
</script>

<style lang="scss" scoped>
    .red-packet-page {
        background-color: #f5f5f5;
        min-height: 100vh;
    }

    .list-container {
        padding-top: 20rpx;
        padding-bottom: 20rpx;
    }
</style>