uniapp-h5/pages/xyyk/tickets.vue

66 lines
1.3 KiB
Vue

<template>
<scroll-view scroll-y="true" class="container" @scrolltolower="getNextPage">
<view class="wrapper">
<view v-for="(item,index) in list" :key="item.id">
<TicketItem :detail="item" @view-event="handleView"/>
</view>
</view>
</scroll-view>
</template>
<script setup>
import { onMounted , ref, unref } from 'vue';
import TicketItem from './components/ticket-item';
import {getTicketList} from '../../api/xyyk';
const page = ref(1);
const pageSize = 10;
const total = ref(0);
const list = ref([]);
onMounted(()=> {
const params = {
page:unref(page),
pageSize:unref(pageSize)
}
getTicketList({params}).then(res => {
const {count,data} = res
total.value = count;
list.value = data;
})
})
const isLastPage = () => unref(page) === Math.ceil(unref(total) / pageSize)
const getNextPage = () => {
if(isLastPage){
console.log('已经是最后一页');
return false;
};
const params = {
page:unref(page) + 1,
pageSize:unref(pageSize),
}
}
const handleView = (item) => {
const {voucher_link} = item
console.log(item)
}
</script>
<style scoped lang="scss">
.container{
width:100vw;
height:100vh;
background-color: #f7f7f7;
overflow-y: auto;
.wrapper{
width:100%;
position: relative;
display: flex;
flex-direction: column;
align-items: center;
padding-bottom:32rpx;
}
}
</style>