feat: complete post page

This commit is contained in:
yanghao05
2025-04-09 16:43:39 +08:00
parent 6151f4e244
commit 1f4c05c54a

View File

@@ -43,9 +43,9 @@ const loading = ref(false);
const posts = ref([]);
// Pagination state
const page = ref(0); // 改为从0开始计数
const limit = ref(10);
const total = ref(0);
const first = ref(0); // 当前页起始索引
const rows = ref(10); // 每页显示数量
const total = ref(0); // 总记录数
// Status mapping
const statusMap = {
@@ -120,18 +120,27 @@ const calculateDiscountPrice = (price, discount) => {
const fetchPosts = async () => {
loading.value = true;
try {
const response = await postService.getPosts(page.value + 1, limit.value); // API调用时页码加1
// Calculate current page (1-based) from first and rows
const currentPage = (first.value / rows.value) + 1;
console.log('Fetching page:', currentPage); // Debug log
const response = await postService.getPosts({
page: currentPage,
limit: rows.value
});
posts.value = response.items.map(post => ({
...post,
status: statusMap[post.status] || '未知',
mediaTypes: getMediaTypes(post.assets),
price: post.price / 100, // Convert cents to yuan
price: post.price / 100,
publishedAt: formatDateTime(post.created_at),
viewCount: post.views,
likes: post.likes
}));
total.value = response.total;
} catch (error) {
console.error('Fetch error:', error); // Debug log
toast.add({ severity: 'error', summary: '错误', detail: '加载文章失败', life: 3000 });
} finally {
loading.value = false;
@@ -140,8 +149,9 @@ const fetchPosts = async () => {
// Handle page change
const onPage = (event) => {
page.value = event.page; // PrimeVue的页码从0开始
limit.value = event.rows;
console.log('Page event:', event); // Debug log
first.value = event.first;
rows.value = event.rows;
fetchPosts();
};
@@ -188,8 +198,8 @@ const formatMediaTypes = (mediaTypes) => {
<InputText v-model="globalFilterValue" placeholder="搜索文章..." class="flex-1" />
</div>
<DataTable v-model:filters="filters" :value="posts" :paginator="true" :rows="limit" :totalRecords="total"
:loading="loading" :lazy="true" v-model:first="page" @page="onPage"
<DataTable v-model:filters="filters" :value="posts" :paginator="true" :rows="rows" :totalRecords="total"
:loading="loading" :lazy="true" :first="first" @page="onPage"
paginatorTemplate="FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink CurrentPageReport RowsPerPageDropdown"
:rowsPerPageOptions="[10, 20, 50]"
currentPageReportTemplate="显示第 {first} 到 {last} 条,共 {totalRecords} 条结果" dataKey="id"