fix(components): pagination works now (for realsies)
This commit is contained in:
parent
c562992c26
commit
af1b09f55c
@ -10,12 +10,13 @@
|
||||
const { token } = useToken();
|
||||
const dark = inject<Ref<boolean>>("dark");
|
||||
const { data } = useAuth();
|
||||
let prop = defineProps<{ story: IStory; last?: boolean; showActions?: boolean }>();
|
||||
const idxo = (prop.last || false ? prop.story.chapters.length : 1) - 1;
|
||||
const story = defineModel<IStory>("story", { required: true });
|
||||
let prop = defineProps<{ last?: boolean; showActions?: boolean }>();
|
||||
const idxo = computed(() => (prop.last || false ? story.value.chapters.length : 1) - 1);
|
||||
// console.log("idx0->", idxo)
|
||||
// log.debug("posti->", prop.story.chapters[ prop.story.chapters.length - 1 ]);
|
||||
const shortDate = format(Date.parse(prop.story.chapters[prop.story.chapters.length - 1]?.posted!.toString()), "yyyy/MM/dd");
|
||||
const longDate = format(Date.parse(prop.story.chapters[prop.story.chapters.length - 1]?.posted!.toString()), "iiii',' yyyy-MM-dd");
|
||||
const shortDate = format(Date.parse(story.value.chapters[story.value.chapters.length - 1]?.posted!.toString()), "yyyy/MM/dd");
|
||||
const longDate = format(Date.parse(story.value.chapters[story.value.chapters.length - 1]?.posted!.toString()), "iiii',' yyyy-MM-dd");
|
||||
</script>
|
||||
<template>
|
||||
<a-card>
|
||||
|
@ -4,64 +4,53 @@
|
||||
const route = useRoute();
|
||||
let curPage = ref(route.query.page || 1);
|
||||
const props = defineProps<{
|
||||
prefix?: string;
|
||||
items?: IStory[];
|
||||
prefix: string;
|
||||
last?: boolean;
|
||||
}>();
|
||||
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}`, {
|
||||
let data = (
|
||||
await useApiFetch<any>(props.prefix, {
|
||||
query: {
|
||||
page: curPage,
|
||||
page: curPage.value,
|
||||
},
|
||||
})
|
||||
).data.value;
|
||||
let rdata = ref(data);
|
||||
const loading = ref<boolean>(false);
|
||||
const pagiChange = (page, pageSize) => {
|
||||
loading.value = true;
|
||||
curPage.value = page;
|
||||
useApiFetch(props.prefix, {
|
||||
query: {
|
||||
page,
|
||||
},
|
||||
}).then(({ data }) => {
|
||||
rdata.value = data.value;
|
||||
loading.value = false;
|
||||
navigateTo({
|
||||
path: useRoute().fullPath,
|
||||
query: {
|
||||
page,
|
||||
},
|
||||
});
|
||||
});
|
||||
rdata.value = data.value;
|
||||
};
|
||||
</script>
|
||||
<template>
|
||||
<div>
|
||||
<a-list :data-source="rdata.stories" item-layout="vertical">
|
||||
<a-list v-model:data-source="rdata.stories" item-layout="vertical" v-model:loading="loading">
|
||||
<template #renderItem="{ item }">
|
||||
<!-- {{ item.title }} -->
|
||||
<single-story :story="item" :last="last" />
|
||||
<single-story :key="item._id" :story="item" :last="last" />
|
||||
</template>
|
||||
</a-list>
|
||||
<a-pagination
|
||||
v-model:disabled="loading"
|
||||
:default-page-size="20"
|
||||
:total="rdata.total"
|
||||
:default-current="curPage as number"
|
||||
@change="pagiChange"
|
||||
:show-quick-jumper="true"
|
||||
:show-size-changer="false"
|
||||
/>
|
||||
</div>
|
||||
<!-- {
|
||||
defaultPageSize: 20,
|
||||
total: rdata.total,
|
||||
defaultCurrent: curPage as number,
|
||||
onChange: pagiChange,
|
||||
// hideOnSinglePage: true,
|
||||
showSizeChanger: false,
|
||||
}-->
|
||||
</template>
|
||||
<style scoped>
|
||||
.ant-list-items > * + * {
|
||||
|
Loading…
Reference in New Issue
Block a user