"use client";
import { useState } from "react";
import { Card } from "@/components/ui/Card";
import { Button } from "@/components/ui/Button";

export default function AttendancePage() {
  const [checkedIn, setCheckedIn] = useState(false);
  return (
    <div className="space-y-4">
      <h1 className="text-xl font-bold text-gray-800">考勤打卡</h1>
      <Card className="text-center py-8">
        <p className="text-4xl mb-2">{checkedIn ? "✅" : "🕐"}</p>
        <p className="text-sm text-gray-500">{new Date().toLocaleString("zh-CN")}</p>
        <Button onClick={() => setCheckedIn(!checkedIn)} variant={checkedIn ? "secondary" : "primary"} className="mt-4" size="lg" disabled={checkedIn}>
          {checkedIn ? "已打卡" : "打卡签到"}
        </Button>
      </Card>
    </div>
  );
}