"use client"
import { Suspense } from "react"
import { getPageUsers } from "@/actions/user"
import { DataTable, useDataTable } from "@/components/data-table"
import { Button } from "@/components/ui/button"
import type { User } from "@/models/user"

export default function UserPage() {
  const table = useDataTable<User>((page, size) => getPageUsers({ page, size }))

  return (
    <div>
      <Suspense>
        <DataTable<User>
          {...table}
          columns={[
            { header: "账号", accessorKey: "username" },
            { header: "手机", accessorKey: "phone" },
            { header: "邮箱", accessorKey: "email" },
            { header: "姓名", accessorKey: "name" },
            { header: "余额", accessorKey: "balance" },
            { header: "认证状态", accessorKey: "id_type" },
            { header: "账号状态", accessorKey: "status" },
            { header: "联系方式", accessorKey: "contact_wechat" },
            { header: "管理员", accessorKey: "admin_id" },
            { header: "最后登录时间", accessorKey: "last_login" },
            { header: "创建时间", accessorKey: "created_at" },
            {
              header: "操作",
              cell: () => (
                <div>
                  <Button>认领</Button>
                </div>
              ),
            },
          ]}
        />
      </Suspense>
    </div>
  )
}