<template>
    <z-paging
        auto-show-back-to-top
        ref="paging"
        v-model="dataList"
        @query="queryList"
        :fixed="false"
        height="100%"
    >
        <block v-for="item in dataList" :key="item.id">
            <coupon-card :item="item" :status="status" :showBtn="false" />
        </block>
    </z-paging>
</template>

<script lang="ts" setup>
import { ref, shallowRef, watch } from 'vue'
// import { apiUserCouponList } from '@/api/coupon'

const props = withDefaults(
    defineProps<{
        status: number | undefined | string
    }>(),
    {
        status: 1
    }
)

const paging = shallowRef<any>(null)
const dataList = ref<any>([])

watch(
    () => props.status,
    () => {
        paging.value.reload()
    }
)

const queryList = async (page_no: number, page_size: number) => {
    // try {
    //     const { lists } = await apiUserCouponList({
    //         status: props.status,
    //         page_no,
    //         page_size
    //     })
    //     paging.value.complete(lists)
    // } catch (e) {
    //     console.log('报错=>', e)
    //     //TODO handle the exception
    //     paging.value.complete(false)
    // }
}
</script>
