"use client"

import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
import { Input } from "@/components/ui/input"
import { Button } from "@/components/ui/button"
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"

export default function UsersPage() {
  return (
    <div className="space-y-6">
      <div className="flex justify-between items-center">
        <h2 className="text-3xl font-bold tracking-tight">用户管理</h2>
        <div className="flex w-full max-w-sm items-center space-x-2">
          <Input type="text" placeholder="搜索用户..." />
          <Button type="submit">搜索</Button>
        </div>
      </div>

      <Card>
        <CardHeader>
          <CardTitle>用户列表</CardTitle>
        </CardHeader>
        <CardContent>
          <Table>
            <TableHeader>
              <TableRow>
                <TableHead className="w-[100px]">ID</TableHead>
                <TableHead>用户名</TableHead>
                <TableHead>绑定状态</TableHead>
                <TableHead>注册时间</TableHead>
                <TableHead className="text-right">操作</TableHead>
              </TableRow>
            </TableHeader>
            <TableBody>
              <TableRow>
                <TableCell className="font-medium">1001</TableCell>
                <TableCell>测试用户A</TableCell>
                <TableCell className="text-green-600">已绑定</TableCell>
                <TableCell>2025-12-28</TableCell>
                <TableCell className="text-right">
                  <Button variant="ghost" size="sm">查看</Button>
                </TableCell>
              </TableRow>
              <TableRow>
                <TableCell className="font-medium">1002</TableCell>
                <TableCell>游客_8392</TableCell>
                <TableCell className="text-yellow-600">未绑定</TableCell>
                <TableCell>2025-12-29</TableCell>
                <TableCell className="text-right">
                   <Button variant="ghost" size="sm">查看</Button>
                </TableCell>
              </TableRow>
            </TableBody>
          </Table>
        </CardContent>
      </Card>
    </div>
  )
}