feat: 代码复制 + 答题进度条

Author: CodeJudge

frontend/src/pages/Problems.tsx

@@ -20,6 +20,7 @@ import toast from 'react-hot-toast';
 import api from '../services/api';
 import ProblemCard from '../components/ProblemCard';
 import type { Problem, PaginatedResponse, ProblemStats } from '../types';
+import { useAuth } from '../context/AuthContext';
 import { useBookmarks } from '../context/BookmarkContext';
 import { useDocumentTitle } from '../hooks/useDocumentTitle';
 
@@ -66,6 +67,9 @@ export default function Problems() {
   const [jumpPage, setJumpPage] = useState('');
   const [bookmarkFilter, setBookmarkFilter] = useState(false);
   const { isBookmarked } = useBookmarks();
+  const { user } = useAuth();
+  const [userStats, setUserStats] = useState<{ accepted: number } | null>(null);
+  const totalProblems = stats?.total ?? 0;
 
   const fetchStats = useCallback(async () => {
     try {
@@ -90,6 +94,15 @@ export default function Problems() {
     fetchTags();
   }, [fetchStats, fetchTags]);
 
+  useEffect(() => {
+    if (!user) return;
+    api.auth.profile().then((res: any) => {
+      if (res?.accepted_count != null) {
+        setUserStats({ accepted: res.accepted_count });
+      }
+    }).catch(() => {});
+  }, [user]);
+
   const fetchProblems = useCallback(async () => {
     setLoading(true);
     setError(null);
@@ -256,6 +269,22 @@ export default function Problems() {
         </div>
       )}
 
+      {/* Completion Progress */}
+      {user && userStats && (
+        <div className="card p-4 mb-4">
+          <div className="flex items-center justify-between mb-2">
+            <h3 className="text-sm font-medium text-dark-200">答题进度</h3>
+            <span className="text-xs text-dark-400">{userStats.accepted} / {totalProblems} 通过</span>
+          </div>
+          <div className="h-2 bg-dark-700 rounded-full overflow-hidden">
+            <div
+              className="h-full bg-gradient-to-r from-primary-500 to-emerald-500 rounded-full transition-all duration-500"
+              style={{ width: `${totalProblems > 0 ? Math.min(100, (userStats.accepted / totalProblems) * 100) : 0}%` }}
+            />
+          </div>
+        </div>
+      )}
+
       {/* Filters & Page Size */}
       <div className="flex flex-wrap items-center gap-4 mb-6">
         <div className="flex gap-1">

frontend/src/pages/Submissions.tsx

@@ -12,6 +12,7 @@ import {
   CheckCircle,
   Code,
   Award,
+  Clipboard,
 } from 'lucide-react';
 import toast from 'react-hot-toast';
 import api from '../services/api';
@@ -260,12 +261,16 @@ export default function Submissions() {
                           <div className="px-4 pb-4 mt-2 border-t border-dark-700 pt-3">
                             {submission.code && (
                               <div className="mb-3">
-                                <p className="text-xs text-gray-500 mb-1">
-                                  提交代码
-                                </p>
-                                <pre className="bg-dark-900 rounded p-3 text-sm text-gray-300 overflow-auto max-h-60">
-                                  {submission.code}
-                                </pre>
+                                <div className="flex items-center justify-between mb-1">
+                                  <p className="text-xs text-dark-500">提交代码</p>
+                                  <button
+                                    onClick={() => { navigator.clipboard.writeText(submission.code); toast.success('代码已复制'); }}
+                                    className="flex items-center gap-1 text-xs text-dark-400 hover:text-white transition-colors"
+                                  >
+                                    <Clipboard className="w-3.5 h-3.5" /> 复制
+                                  </button>
+                                </div>
+                                <pre className="bg-dark-900 rounded p-3 text-sm text-dark-300 overflow-auto max-h-60">{submission.code}</pre>
                               </div>
                             )}