45 lines
1.1 KiB
TypeScript
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-[#0f6fca] text-sm"}>{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 text-sm text-[#666666] items-center"}
|
||
|
|
href={`../${article.id}`}
|
||
|
|
>
|
||
|
|
<span className={"flex-1 w-0 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;
|