"use client"
import { Button, Card, Image, Space, Table } from "antd";
import '@ant-design/v5-patch-for-react-19';
import { useRouter } from "next/navigation";
import { useAntdTable } from "ahooks";
import { mRequest } from "@/app/_lib/request";
import { ArticleType } from "@/app/_lib/data/article";

export default function Page() {
    const router = useRouter()
    const { tableProps, refresh } = useAntdTable(async ({ current, pageSize }) => mRequest<{
        total: number;
        list: ArticleType[]
    }>('GET', `/api/article?page=${current}&pageSize=${pageSize}`))
    return (
        <Card title="文章管理" extra={
            <Space>
                <Button onClick={() => refresh()}>刷新</Button>
                <Button type="primary" onClick={() => {
                    router.push("/admin/dashboard/article/detail")
                }} >
                    新增文章
                </Button>
            </Space>
        }>
            <Table
                {...tableProps}
                rowKey="_id"
                columns={[
                    {
                        title: '标题',
                        dataIndex: 'title',
                    },
                    {
                        title: '副标题',
                        dataIndex: 'description',
                    },

                    {
                        title: "封面",
                        dataIndex: "content",
                        render: (_, item) => (
                            <>
                                <Image src={item.content} width={70} ></Image>
                            </>
                        )
                    },
                    {
                        title: '操作',
                        render: (_, row) => (
                            <Space>
                                <Button type="primary" onClick={() => {
                                    router.push(`/admin/dashboard/article/detail/${row._id}`)
                                }} >修改</Button>
                                <Button type="primary" danger>删除</Button>
                            </Space>
                        )
                    }
                ]}

            ></Table>
        </Card>
    )
}