From 42c54ec90a959051ed1178408d99a8945010b729 Mon Sep 17 00:00:00 2001
From: yanlongqi <yuchat@163.com>
Date: Wed, 12 Nov 2025 22:07:35 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E9=94=99=E9=A2=98=E7=BB=83=E4=B9=A0?=
 =?UTF-8?q?=E6=A8=A1=E5=BC=8F=E6=B7=BB=E5=8A=A0=E9=87=8D=E6=96=B0=E7=AD=94?=
 =?UTF-8?q?=E9=A2=98=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 在QuestionCard组件中添加重新答题按钮
- 仅在错题练习模式(mode=wrong)且答案错误时显示
- 点击后重置当前题目状态，清空答案，允许重新作答
- 添加ReloadOutlined图标提升用户体验

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 web/src/components/QuestionCard.tsx | 25 ++++++++++++++++++++++---
 web/src/pages/Question.tsx          | 19 +++++++++++++++++++
 2 files changed, 41 insertions(+), 3 deletions(-)

diff --git a/web/src/components/QuestionCard.tsx b/web/src/components/QuestionCard.tsx
index 75b4adb..a197065 100644
--- a/web/src/components/QuestionCard.tsx
+++ b/web/src/components/QuestionCard.tsx
@@ -1,5 +1,6 @@
 import React, { useState, useEffect } from 'react'
 import { Space, Tag, Typography, Radio, Checkbox, Input, Button } from 'antd'
+import { ReloadOutlined } from '@ant-design/icons'
 import type { Question, AnswerResult as AnswerResultType } from '../types/question'
 import AnswerResult from './AnswerResult'
 import styles from '../pages/Question.module.less'
@@ -17,6 +18,8 @@ interface QuestionCardProps {
   onAnswerChange: (answer: string | string[]) => void
   onSubmit: () => void
   onNext: () => void
+  onRetry?: () => void  // 新增：重新答题回调
+  mode?: string  // 新增：答题模式（用于判断是否是错题练习）
 }
 
 const QuestionCard: React.FC<QuestionCardProps> = ({
@@ -29,6 +32,8 @@ const QuestionCard: React.FC<QuestionCardProps> = ({
   onAnswerChange,
   onSubmit,
   onNext,
+  onRetry,
+  mode,
 }) => {
   const [fillAnswers, setFillAnswers] = useState<string[]>([])
 
@@ -187,9 +192,23 @@ const QuestionCard: React.FC<QuestionCardProps> = ({
             提交答案
           </Button>
         ) : (
-          <Button type="primary" size="large" block onClick={onNext} loading={autoNextLoading}>
-            {autoNextLoading ? '正在跳转到下一题...' : '下一题'}
-          </Button>
+          <Space direction="vertical" style={{ width: '100%' }} size="middle">
+            {/* 如果是错题练习模式且答案错误，显示重新答题按钮 */}
+            {mode === 'wrong' && !answerResult?.correct && onRetry && (
+              <Button
+                type="default"
+                size="large"
+                block
+                icon={<ReloadOutlined />}
+                onClick={onRetry}
+              >
+                重新答题
+              </Button>
+            )}
+            <Button type="primary" size="large" block onClick={onNext} loading={autoNextLoading}>
+              {autoNextLoading ? '正在跳转到下一题...' : '下一题'}
+            </Button>
+          </Space>
         )}
       </div>
     </div>
diff --git a/web/src/pages/Question.tsx b/web/src/pages/Question.tsx
index f212984..1570b8b 100644
--- a/web/src/pages/Question.tsx
+++ b/web/src/pages/Question.tsx
@@ -452,6 +452,23 @@ const QuestionPage: React.FC = () => {
     loadQuestions(typeParam || undefined);
   };
 
+  // 重新答题（错题练习模式）
+  const handleRetryQuestion = () => {
+    // 重置当前题目的答题状态
+    setShowResult(false);
+    setAnswerResult(null);
+
+    // 重置答案
+    if (currentQuestion) {
+      setSelectedAnswer(
+        currentQuestion.type === "multiple-selection" ? [] : ""
+      );
+    }
+
+    // 滚动到页面顶部
+    window.scrollTo({ top: 0, behavior: 'smooth' });
+  };
+
   return (
     <div className={styles.container}>
       {/* 固定顶栏：包含导航和进度 */}
@@ -503,6 +520,8 @@ const QuestionPage: React.FC = () => {
             onAnswerChange={setSelectedAnswer}
             onSubmit={handleSubmit}
             onNext={handleNext}
+            onRetry={handleRetryQuestion}
+            mode={searchParams.get("mode") || undefined}
           />
         )}
       </div>