diff --git a/app/flashcards/page.tsx b/app/flashcards/page.tsx index 46c6e90..b19f32c 100644 --- a/app/flashcards/page.tsx +++ b/app/flashcards/page.tsx @@ -8,6 +8,39 @@ export default function FlashcardsPage() { const [selectedSet, setSelectedSet] = useState(null) const [searchTerm, setSearchTerm] = useState('') const [filterTag, setFilterTag] = useState('all') + const [selectedCards, setSelectedCards] = useState([]) + const [showCheckModal, setShowCheckModal] = useState(false) + const [checkingCard, setCheckingCard] = useState(null) + const [checkResults, setCheckResults] = useState(null) + const [errorReports, setErrorReports] = useState([ + { + id: 1, + cardId: 1, + word: 'negotiate', + reportType: '發音錯誤', + description: '美式發音標記有誤', + reportedAt: '2小時前', + status: 'pending' + }, + { + id: 2, + cardId: 3, + word: 'perspective', + reportType: '翻譯不準確', + description: '翻譯缺少其他常用含義', + reportedAt: '1天前', + status: 'pending' + }, + { + id: 3, + cardId: 5, + word: 'implement', + reportType: '例句錯誤', + description: '例句時態使用不當', + reportedAt: '3天前', + status: 'pending' + } + ]) // Mock data const cardSets = [ @@ -64,11 +97,66 @@ export default function FlashcardsPage() { ] const flashcards = [ - { id: 1, word: 'negotiate', translation: '協商', setId: 1, mastery: 80, nextReview: '明天' }, - { id: 2, word: 'accomplish', translation: '完成', setId: 1, mastery: 60, nextReview: '今天' }, - { id: 3, word: 'perspective', translation: '觀點', setId: 2, mastery: 90, nextReview: '3天後' }, - { id: 4, word: 'substantial', translation: '大量的', setId: 2, mastery: 40, nextReview: '今天' }, - { id: 5, word: 'implement', translation: '實施', setId: 3, mastery: 70, nextReview: '明天' }, + { + id: 1, + word: 'negotiate', + translation: '協商', + definition: 'To discuss something with someone in order to reach an agreement', + partOfSpeech: 'verb', + pronunciation: '/nɪˈɡoʊʃieɪt/', + example: 'We need to negotiate a better deal with our suppliers.', + setId: 1, + mastery: 80, + nextReview: '明天' + }, + { + id: 2, + word: 'accomplish', + translation: '完成', + definition: 'To finish something successfully or to achieve something', + partOfSpeech: 'verb', + pronunciation: '/əˈkɒmplɪʃ/', + example: 'She accomplished her goal of running a marathon.', + setId: 1, + mastery: 60, + nextReview: '今天' + }, + { + id: 3, + word: 'perspective', + translation: '觀點', + definition: 'A particular way of considering something', + partOfSpeech: 'noun', + pronunciation: '/pərˈspektɪv/', + example: 'From my perspective, this is the best solution.', + setId: 2, + mastery: 90, + nextReview: '3天後' + }, + { + id: 4, + word: 'substantial', + translation: '大量的', + definition: 'Large in size, value, or importance', + partOfSpeech: 'adjective', + pronunciation: '/səbˈstænʃəl/', + example: 'The company made a substantial profit last year.', + setId: 2, + mastery: 40, + nextReview: '今天' + }, + { + id: 5, + word: 'implement', + translation: '實施', + definition: 'To put a decision, plan, or agreement into effect', + partOfSpeech: 'verb', + pronunciation: '/ˈɪmplɪment/', + example: 'We need to implement new safety measures.', + setId: 3, + mastery: 70, + nextReview: '明天' + }, ] const tags = ['all', '影視', '商務', '日常', '考試', '科技', '口語', '正式', '基礎', '學術', '專業'] @@ -184,6 +272,21 @@ export default function FlashcardsPage() { > 收藏詞卡 + @@ -282,17 +385,51 @@ export default function FlashcardsPage() {

共 {filteredCards.length} 個詞卡

- +
+ {selectedCards.length > 0 && ( + + )} + +
{filteredCards.map(card => (
- -
+ { + if (e.target.checked) { + setSelectedCards([...selectedCards, card.id]) + } else { + setSelectedCards(selectedCards.filter(id => id !== card.id)) + } + }} + className="h-4 w-4 text-primary focus:ring-primary border-gray-300 rounded" + /> +
{ + setCheckingCard(card) + setCheckResults(null) + setShowCheckModal(true) + }} + className="cursor-pointer hover:text-primary transition-colors" + >
{card.word}
{card.translation}
@@ -336,6 +473,121 @@ export default function FlashcardsPage() {
)} + + {activeTab === 'error-reports' && ( +
+
+

+ 錯誤回報清單 ({errorReports.filter(r => r.status === 'pending').length} 個待處理) +

+ {errorReports.filter(r => r.status === 'pending').length > 0 && ( + + )} +
+ + {errorReports.length === 0 ? ( +
+
+ + + +
+

沒有錯誤回報

+

所有詞卡內容都正確無誤！

+
+ ) : ( +
+ {errorReports.map(report => ( +
+
+
+
+

{report.word}

+ + {report.status === 'pending' ? '待處理' : '已解決'} + + + {report.reportType} + +
+

{report.description}

+
+ 回報時間：{report.reportedAt} +
+
+
+ {report.status === 'pending' && ( + <> + + + + )} +
+
+
+ ))} +
+ )} +
+ )}
@@ -398,6 +650,203 @@ export default function FlashcardsPage() {
+ + {/* Smart Check Modal */} + {showCheckModal && ( +
+
+
+
+

🤖 智能檢測

+ +
+
+ +
+ {!checkResults ? ( + // 檢測前 +
+
+

+ {checkingCard?.isErrorList + ? `即將檢測 ${checkingCard.reports.length} 個錯誤回報` + : checkingCard?.errorReport + ? `正在檢測錯誤回報：${checkingCard.errorReport.reportType}` + : checkingCard + ? `正在檢測詞卡「${checkingCard.word}」的內容...` + : `即將檢測 ${selectedCards.length} 個詞卡的內容正確性`} +

+
+ + {checkingCard && !checkingCard.isErrorList && ( +
+ {checkingCard.errorReport && ( +
+
+ 錯誤回報：{checkingCard.errorReport.reportType} +
+
+ {checkingCard.errorReport.description} +
+
+ )} +
+
單字：{checkingCard.word}
+
翻譯：{checkingCard.translation}
+
定義：{checkingCard.definition}
+
詞性：{checkingCard.partOfSpeech}
+
發音：{checkingCard.pronunciation}
+
例句：{checkingCard.example}
+
+
+ )} + + {checkingCard?.isErrorList && ( +
+
錯誤清單：
+
+ {checkingCard.reports.map((report, idx) => ( +
+
{report.word}
+
+ {report.reportType}: {report.description} +
+
+ ))} +
+
+ )} + + +
+ ) : ( + // 檢測結果 +
+
+
+ + + +

檢測完成

+
+

+ {checkResults.isErrorList + ? `已檢測 ${checkResults.totalChecked} 個錯誤回報，發現 ${checkResults.errors.length} 個問題` + : `已檢測 ${checkResults.totalChecked} 個詞卡，發現 ${checkResults.errors.length} 個問題`} +

+
+ + {checkResults.errors.length > 0 && ( +
+

📝 發現的問題：

+
+ {checkResults.errors.map((error, idx) => ( +
+
{error.field}
+
+
原始： {error.original}
+
建議： {error.corrected}
+
{error.reason}
+
+
+ ))} +
+
+ )} + + {checkResults.suggestions.length > 0 && ( +
+

💡 改進建議：

+
    + {checkResults.suggestions.map((suggestion, idx) => ( +
  • + • + {suggestion} +
    • + ))} +
+
+ )} + +
+ + +
+
+ )} +
+
+
+ )} ) } \ No newline at end of file diff --git a/app/learn/page.tsx b/app/learn/page.tsx index 78f309e..b7219b7 100644 --- a/app/learn/page.tsx +++ b/app/learn/page.tsx @@ -15,6 +15,9 @@ export default function LearnPage() { const [isRecording, setIsRecording] = useState(false) const [audioPlaying, setAudioPlaying] = useState(false) const [modalImage, setModalImage] = useState(null) + const [showReportModal, setShowReportModal] = useState(false) + const [reportReason, setReportReason] = useState('') + const [reportingCard, setReportingCard] = useState(null) // Mock data with real example images const cards = [ @@ -214,6 +217,23 @@ export default function LearnPage() { {mode === 'flip' ? ( /* Flip Card Mode */
+ {/* Error Report Button for Flip Mode */} +
+ +
+
) : mode === 'quiz' ? ( /* Quiz Mode - 選擇題：英文定義選中文翻譯 */ -
-
-
根據定義選擇正確的中文翻譯
-
- {currentCard.definition} -
-
- ({currentCard.partOfSpeech}) -
+
+ {/* Error Report Button for Quiz Mode */} +
+
+
+
+
根據定義選擇正確的中文翻譯
+
+ {currentCard.definition} +
+
+ ({currentCard.partOfSpeech}) +
+
+
{quizOptions.map((option, idx) => (
) : mode === 'fill' ? ( /* Fill in the Blank Mode - 填空題 */ -
-
-
根據例句圖片和句子填入正確的詞彙
+
+ {/* Error Report Button for Fill Mode */} +
+ +
+ +
+
+
根據例句圖片和句子填入正確的詞彙
{/* Example Image */} {currentCard.exampleImage && ( @@ -477,12 +527,31 @@ export default function LearnPage() {
)} +
) : mode === 'listening' ? ( /* Listening Test Mode - 聽力測試 */ -
-
-
聽音頻，選擇正確的單字
+
+ {/* Error Report Button for Listening Mode */} +
+ +
+ +
+
+
聽音頻，選擇正確的單字
{/* Audio Play Button */}
)} +
) : mode === 'speaking' ? ( /* Speaking Test Mode - 口說測試 */ -
-
-
念出以下例句
+
+ {/* Error Report Button for Speaking Mode */} +
+ +
+ +
+
+
念出以下例句
{/* Target Sentence */}
@@ -622,6 +710,7 @@ export default function LearnPage() { )}
+
) : null} {/* Navigation Buttons */} @@ -682,6 +771,84 @@ export default function LearnPage() {
)} + + {/* Error Report Modal */} + {showReportModal && ( +
setShowReportModal(false)} + > +
e.stopPropagation()} + > +
+

回報錯誤

+ +
+ +
+
+ 詞卡：{reportingCard?.word} +
+
+ 測驗模式：{mode === 'flip' ? '翻卡模式' : mode === 'quiz' ? '選擇題' : mode === 'fill' ? '填空題' : mode === 'listening' ? '聽力測試' : '口說測試'} +
+
+ +
+ +