1
---
2
export const prerender = true;
3
import type { GetStaticPaths } from "astro";
4
import { getCollection } from "astro:content";
5
import { PAGE_SIZE } from "@constants/constants";
6
import GridLayout from "@layouts/grid.astro";
7
import BackwardButton from "@components/backwardButton.astro";
8
import Pagination from "@components/pagination.astro";
9

10
// 1. 抓取并按时间倒序
11
export const getStaticPaths = (async ({ paginate }) => {
12
    const allNotes = await getCollection("notes"); // <-- 记得改集合名称
13
    const sortedNotes = allNotes.sort((a, b) =>
14
        b.data.published.valueOf() - a.data.published.valueOf()
15
    );
16
    return paginate(sortedNotes, { pageSize: PAGE_SIZE });
17
}) satisfies GetStaticPaths;
18

19
const { page } = Astro.props;
20
const formatMonthDay = (date: Date) => {
21
  return new Intl.DateTimeFormat('zh-CN', { month: '2-digit', day: '2-digit' }).format(date);
22
};
23
---
24

25
<GridLayout title="Notes" description="随笔与日常记录">
26
    <div class="flex w-full rounded-(--radius-large) overflow-hidden relative min-h-32">
27
        <div class="card-base z-10 px-9 py-6 relative w-full ">
28
            <BackwardButton currentPath={Astro.url.pathname} />
29

30
            <header class="mb-12">
31
                <h1 class="text-3xl font-bold text-neutral-900 dark:text-neutral-100 mb-3">Notes</h1>
32
                <p class="text-neutral-600 dark:text-neutral-400">随笔与日常记录</p>
33
            </header>
34

35
            <div class="relative ml-4 md:ml-8 border-l-2 border-black/5 dark:border-white/5 pb-8">
36
                {page.data.map((note) => {
37
                    const pureId = note.id.replace(/\.[^/.]+$/, "");
38
                    const date = new Date(note.data.published);
39
                    return (
40
                        <div class="mb-10 ml-6 relative">
41
                            <div class="absolute -left-[33px] top-1.5 w-4 h-4 rounded-full bg-white dark:bg-zinc-900 border-2 border-(--primary) z-10"></div>
42
                            {/* 👇 强制写死绝对路径，彻底杜绝跳回 posts */}
43
                            <a href={`/notes/${pureId}/`} class="block transition-all group">
44
                                <div class="flex flex-col sm:flex-row sm:items-baseline gap-2 sm:gap-6">
45
                                    <span class="text-sm font-mono text-black/30 dark:text-white/30 whitespace-nowrap">
46
                                        {formatMonthDay(date)}
47
                                    </span>
48
                                    <h2 class="text-xl font-bold text-black/80 dark:text-white/80 group-hover:text-(--primary) transition-colors">
49
                                        {note.data.title}
50
                                    </h2>
51
                                </div>
52
                                {note.data.description && (
53
                                    <p class="mt-2 text-sm text-black/50 dark:text-white/50 line-clamp-2 ml-0 sm:ml-[68px]">
54
                                        {note.data.description}
55
                                    </p>
56
                                )}
57
                            </a>
58
                        </div>
59
                    );
60
                })}
61
            </div>
62
            <div class="mt-8"><Pagination page={page}></Pagination></div>
63
        </div>
64
    </div>
65
</GridLayout>

1
---
2
// ... (保留你原来的依赖引入，如 Icon, render, getCollection, formatDateToYYYYMMDD, Markdown 等) ...
3

4
export async function getStaticPaths() {
5
    // 抓取 notes 集合
6
    const noteEntries = await getCollection("notes"); // <-- 记得改集合名称
7

8
    return noteEntries.map(entry => {
9
        // [关键] 移除文件后缀，生成纯净的 slug 路径
10
        const slug = entry.id.replace(/\.[^/.]+$/, "");
11
        return {
12
            params: { slug }, // 生成 /notes/[slug]/ 路由
13
            props: { entry },
14
        };
15
    });
16
}
17

18
const { entry } = Astro.props;
19
// ... (保留原来的 Content 渲染、字数统计等逻辑) ...
20

21
// [关键] 手动拼接 URL 供元数据组件使用，防止组件自动加上 /posts/ 路径
22
const currentNoteUrl = `/notes/${entry.id.replace(/\.[^/.]+$/, "")}/`;
23
---