Files
caszl-next/app/components/ArticleList.tsx
quantulr b6a722fa79 update
2023-11-03 17:25:10 +08:00

45 lines
1.1 KiB
TypeScript

import React from "react";
import { listArticles } from "@/app/api/articles";
import styles from "./ArticleList.module.scss";
import Link from "next/link";
import Pagination from "@/app/components/Pagination";
import dayjs from "dayjs";
const ArticleList = async ({
cid,
pageNo,
title,
}: {
title: string;
cid: string;
pageNo: number;
}) => {
const data = await listArticles({
pageNo,
cid,
pageSize: 20,
sort: "new",
});
return (
<>
<h2 className={"text-sm text-[#0f6fca]"}>{title}</h2>
<ul className={`${styles.articles} mt-5`}>
{data.lists.map((article, index) => (
<li className={`${styles.article}`} key={article.id}>
<Link
className={"flex h-8 items-center text-sm text-[#666666]"}
href={`../${article.id}`}
>
<span className={"w-0 flex-1 truncate"}>{article.title}</span>
<span>{dayjs(article.createTime).format("YYYY-MM-DD")}</span>
</Link>
</li>
))}
</ul>
<Pagination page={pageNo} total={data.count} perPage={20} />
</>
);
};
export default ArticleList;