64 lines
1.3 KiB
Vue
64 lines
1.3 KiB
Vue
<script setup lang="ts">
|
|
import singleStory from "~/components/listings/singleStory.vue";
|
|
import { IStory } from "~/models/stories";
|
|
const route = useRoute();
|
|
let curPage = ref(route.query.page || 1);
|
|
const props = defineProps<{ prefix?: string; items?: IStory[] }>();
|
|
let data;
|
|
if (!props.prefix) {
|
|
data = props.items;
|
|
} else if (!props.items) {
|
|
data = (
|
|
await useApiFetch<any>(`${props.prefix}`, {
|
|
query: {
|
|
page: curPage,
|
|
},
|
|
})
|
|
).data;
|
|
}
|
|
let rdata = ref(data);
|
|
const pagiChange = async (page, pageSize) => {
|
|
curPage.value = page;
|
|
// await navigateTo({
|
|
// path: useRoute().fullPath,
|
|
// query: {
|
|
// page
|
|
// }
|
|
// })
|
|
// let {data: data } = await useApiFetch(`${props.prefix}/stories`, {
|
|
// query: {
|
|
// page: curPage
|
|
// }
|
|
// })
|
|
// rdata.value = data;
|
|
};
|
|
</script>
|
|
<template>
|
|
<a-list
|
|
:pagination="{
|
|
defaultPageSize: 20,
|
|
total: rdata.total,
|
|
defaultCurrent: curPage as number,
|
|
// onChange: pagiChange,
|
|
hideOnSinglePage: true,
|
|
showSizeChanger: false,
|
|
}"
|
|
:data-source="rdata.stories"
|
|
item-layout="vertical"
|
|
>
|
|
<template #renderItem="{ item }">
|
|
<!-- {{ item.title }} -->
|
|
<single-story :story="item" />
|
|
</template>
|
|
</a-list>
|
|
</template>
|
|
<style scoped>
|
|
.ant-list-items > * + * {
|
|
margin-top: 1.2em;
|
|
}
|
|
|
|
.ant-pagination {
|
|
text-align: center;
|
|
}
|
|
</style>
|