import { api } from "@nice/client"
import { Button, Tag } from "antd"
import { useEffect, useMemo, useState } from "react"

function HomePage() {
  const { data } = api.staff.findMany.useQuery({
    take: 10
  })
  const [counter, setCounter] = useState<number>(0)
  const counterText = useMemo(() => {
    return `当前计数为：${counter}`
  }, [counter])
  useEffect(() => {
    console.log(data)
  }, [data])
  return <div className="p-2 space-y-2">
    <Tag>{counterText}</Tag>
    <div className="space-x-2" >
      <Button type="primary" onClick={() => {
        setCounter(counter + 1)
      }}>加1</Button>
      <Button danger
        onClick={() => {
          setCounter(counter - 1)
        }}
      >减1</Button>
    </div>

    {
      data?.map(i => {
        return <div className="p-2 rounded border shadow">
          <Tag>{i.username}</Tag>
        </div>
      })
    }
  </div>
}
// export { HomePage }
export default HomePage