整合資料庫、完成登入註冊忘記密碼功能

app/judge-scoring/page.tsx

@@ -11,7 +11,7 @@ import { Progress } from "@/components/ui/progress"
 import { Avatar, AvatarFallback } from "@/components/ui/avatar"
 import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "@/components/ui/dialog"
 import { Textarea } from "@/components/ui/textarea"
-import { AlertTriangle, CheckCircle, User, Trophy, LogIn, Loader2 } from "lucide-react"
+import { AlertTriangle, CheckCircle, User, Trophy, LogIn, Loader2, Eye, EyeOff, Lock } from "lucide-react"
 
 interface Judge {
   id: string
@@ -41,6 +41,7 @@ export default function JudgeScoringPage() {
   const [isSubmitting, setIsSubmitting] = useState(false)
   const [error, setError] = useState("")
   const [success, setSuccess] = useState("")
+  const [showAccessCode, setShowAccessCode] = useState(false)
 
   // Judge data - empty for production
   const mockJudges: Judge[] = []
@@ -145,13 +146,24 @@ export default function JudgeScoringPage() {
 
             <div className="space-y-2">
               <Label htmlFor="accessCode">存取碼</Label>
-              <Input
-                id="accessCode"
-                type="password"
-                placeholder="請輸入存取碼"
-                value={accessCode}
-                onChange={(e) => setAccessCode(e.target.value)}
-              />
+              <div className="relative">
+                <Lock className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400 w-4 h-4" />
+                <Input
+                  id="accessCode"
+                  type={showAccessCode ? "text" : "password"}
+                  placeholder="請輸入存取碼"
+                  value={accessCode}
+                  onChange={(e) => setAccessCode(e.target.value)}
+                  className="pl-10 pr-10"
+                />
+                <button
+                  type="button"
+                  onClick={() => setShowAccessCode(!showAccessCode)}
+                  className="absolute right-3 top-1/2 transform -translate-y-1/2 text-gray-400 hover:text-gray-600"
+                >
+                  {showAccessCode ? <EyeOff className="w-4 h-4" /> : <Eye className="w-4 h-4" />}
+                </button>
+              </div>
             </div>
 
             <Button