綜合測驗與資料庫整合

scripts/test-combined-creativity-levels.js

@@ -0,0 +1,90 @@
+const testCombinedCreativityLevels = () => {
+  console.log('💡 綜合能力測試創意能力評語功能測試')
+  console.log('=' .repeat(50))
+
+  // 模擬創意能力評語函數
+  const getCreativityLevel = (score) => {
+    if (score >= 90) return {
+      level: "創意巔峰者",
+      color: "bg-purple-600",
+      description: "創意力近乎無窮，你是團隊裡的靈感源泉，總能帶來突破性的想法。",
+      suggestion: "你不只創造靈感，更能影響他人。如果能結合執行力，你將成為真正的創新領袖。"
+    }
+    if (score >= 75) return {
+      level: "創意引領者",
+      color: "bg-blue-500",
+      description: "你是靈感的推動者！總是能在團體中主動拋出新想法，激發別人跟進。",
+      suggestion: "持續累積學習，讓你的靈感不僅是點子，而能帶動真正的行動。"
+    }
+    if (score >= 55) return {
+      level: "創意實踐者",
+      color: "bg-green-500",
+      description: "靈感已經隨手可得，在團體中也常被認為是「有創意的人」。",
+      suggestion: "再給自己一點勇氣，不要害怕挑戰慣例，你的創意將更有力量。"
+    }
+    if (score >= 35) return {
+      level: "創意開拓者",
+      color: "bg-yellow-500",
+      description: "你其實有自己的想法，但有時習慣跟隨大多數人的步伐。",
+      suggestion: "試著勇敢說出腦中天馬行空的念頭，你會發現，這些點子或許就是團隊需要的突破口。"
+    }
+    return {
+      level: "創意萌芽者",
+      color: "bg-red-500",
+      description: "還在創意旅程的起點。雖然暫時表現平淡，但這正是無限潛力的開端！",
+      suggestion: "觀察生活小事，或閱讀不同領域的內容，讓靈感一點一滴積累。"
+    }
+  }
+
+  console.log('\n📊 測試案例:')
+  
+  // 測試各個分數區間
+  const testScores = [0, 20, 30, 45, 60, 70, 80, 90, 95]
+  
+  testScores.forEach(score => {
+    const level = getCreativityLevel(score)
+    console.log(`\n分數: ${score}分`)
+    console.log(`等級: ${level.level}`)
+    console.log(`顏色: ${level.color}`)
+    console.log(`描述: ${level.description}`)
+    console.log(`建議: ${level.suggestion}`)
+  })
+
+  console.log('\n🎯 評語等級對應:')
+  console.log('90分以上: 創意巔峰者 (紫色)')
+  console.log('75-89分: 創意引領者 (藍色)')
+  console.log('55-74分: 創意實踐者 (綠色)')
+  console.log('35-54分: 創意開拓者 (黃色)')
+  console.log('0-34分: 創意萌芽者 (紅色)')
+
+  console.log('\n🎨 UI設計特色:')
+  console.log('- 等級標示: 彩色圓點 + 等級名稱')
+  console.log('- 描述文字: 生動有趣的比喻和描述')
+  console.log('- 建議區塊: 淺色背景，包含👉圖示')
+  console.log('- 響應式設計: 適配手機和桌面版')
+
+  console.log('\n📝 評語內容特色:')
+  console.log('- 使用生動的比喻 (靈感源泉、天馬行空、創新領袖)')
+  console.log('- 提供具體的改進建議')
+  console.log('- 鼓勵性的語言風格')
+  console.log('- 符合不同能力水平的描述')
+
+  console.log('\n🌟 創意能力評語亮點:')
+  console.log('- 創意巔峰者: 強調影響力和領導力')
+  console.log('- 創意引領者: 強調推動和激發他人')
+  console.log('- 創意實踐者: 強調勇氣和挑戰慣例')
+  console.log('- 創意開拓者: 強調勇敢表達想法')
+  console.log('- 創意萌芽者: 強調潛力和積累')
+
+  console.log('\n🔍 測試要點:')
+  console.log('1. 各分數區間顯示正確的等級')
+  console.log('2. 顏色標示與等級匹配')
+  console.log('3. 描述文字生動有趣')
+  console.log('4. 建議內容實用具體')
+  console.log('5. UI佈局美觀整齊')
+  console.log('6. 與邏輯思維評語風格一致')
+
+  console.log('\n✅ 綜合能力測試創意能力評語功能測試完成')
+}
+
+testCombinedCreativityLevels()

scripts/test-combined-integration.js

@@ -0,0 +1,80 @@
+const testCombinedIntegration = () => {
+  console.log('🔄 綜合能力測試資料庫整合測試')
+  console.log('=' .repeat(50))
+
+  console.log('\n📋 測試目標:')
+  console.log('- 整合 logic_questions 資料表')
+  console.log('- 整合 creative_questions 資料表')
+  console.log('- 移除硬編碼的題目資料')
+  console.log('- 確保題目、答案與資料庫一致')
+
+  console.log('\n🔧 主要修改:')
+  console.log('1. 移除硬編碼的題目匯入')
+  console.log('   - 移除: import { logicQuestions } from "@/lib/questions/logic-questions"')
+  console.log('   - 移除: import { creativeQuestions } from "@/lib/questions/creative-questions"')
+
+  console.log('\n2. 新增資料庫介面')
+  console.log('   - LogicQuestion 介面 (id, question, option_a-e, correct_answer, explanation)')
+  console.log('   - CreativeQuestion 介面 (id, statement, category, is_reverse)')
+
+  console.log('\n3. 新增狀態管理')
+  console.log('   - logicQuestions: LogicQuestion[]')
+  console.log('   - creativeQuestions: CreativeQuestion[]')
+  console.log('   - isLoading: boolean')
+
+  console.log('\n4. 新增資料載入邏輯')
+  console.log('   - useEffect 載入邏輯題目 (/api/logic-questions)')
+  console.log('   - useEffect 載入創意題目 (/api/creative-questions)')
+  console.log('   - 錯誤處理和載入狀態')
+
+  console.log('\n5. 修改題目渲染')
+  console.log('   - 邏輯題目: 使用 option_a 到 option_e 欄位')
+  console.log('   - 創意題目: 使用 statement 和 is_reverse 欄位')
+  console.log('   - 移除數值顯示 (5, 4, 3, 2, 1)')
+
+  console.log('\n6. 新增載入和錯誤狀態')
+  console.log('   - 載入中: 顯示載入動畫')
+  console.log('   - 載入失敗: 顯示錯誤訊息和重新載入按鈕')
+
+  console.log('\n📊 資料庫欄位對應:')
+  console.log('邏輯題目 (logic_questions):')
+  console.log('  - question -> 題目內容')
+  console.log('  - option_a, option_b, option_c, option_d, option_e -> 選項 A-E')
+  console.log('  - correct_answer -> 正確答案 (A-E)')
+  console.log('  - explanation -> 解釋說明')
+
+  console.log('\n創意題目 (creative_questions):')
+  console.log('  - statement -> 題目描述')
+  console.log('  - category -> 能力類別 (innovation, imagination, flexibility, originality)')
+  console.log('  - is_reverse -> 是否反向計分')
+
+  console.log('\n🎯 測試流程:')
+  console.log('1. 載入綜合能力測試頁面')
+  console.log('2. 檢查是否從資料庫載入題目')
+  console.log('3. 驗證邏輯題目選項顯示 (A-E)')
+  console.log('4. 驗證創意題目選項顯示 (無數值)')
+  console.log('5. 完成測試並檢查結果頁面')
+
+  console.log('\n✅ 預期結果:')
+  console.log('- 題目完全來自資料庫，無硬編碼')
+  console.log('- 邏輯題目顯示 A-E 選項')
+  console.log('- 創意題目不顯示數值')
+  console.log('- 載入狀態正常顯示')
+  console.log('- 錯誤處理完善')
+
+  console.log('\n🔍 驗證要點:')
+  console.log('- 檢查 Network 標籤中的 API 請求')
+  console.log('- 確認題目內容與資料庫一致')
+  console.log('- 測試載入失敗情況')
+  console.log('- 驗證計分邏輯正確性')
+
+  console.log('\n📝 注意事項:')
+  console.log('- 確保 API 路由正常運作')
+  console.log('- 檢查資料庫連線狀態')
+  console.log('- 驗證題目數量正確')
+  console.log('- 測試反向計分邏輯')
+
+  console.log('\n✅ 綜合能力測試資料庫整合測試完成')
+}
+
+testCombinedIntegration()

scripts/test-combined-logic-answers.js

@@ -0,0 +1,89 @@
+const testCombinedLogicAnswers = () => {
+  console.log('🔍 綜合能力測試邏輯題目答案驗證')
+  console.log('=' .repeat(50))
+
+  // 模擬資料庫中的邏輯題目 (使用正確的欄位名稱)
+  const mockLogicQuestions = [
+    {
+      id: 1,
+      question: "如果所有的玫瑰都是花，所有的花都需要水，那麼可以得出什麼結論？",
+      option_a: "所有的玫瑰都需要水",
+      option_b: "所有需要水的都是玫瑰", 
+      option_c: "有些花不是玫瑰",
+      option_d: "玫瑰不需要土壤",
+      option_e: "以上都不對",
+      correct_answer: "A", // 正確的欄位名稱
+      explanation: "根據邏輯推理，如果所有玫瑰都是花，所有花都需要水，那麼所有玫瑰都需要水。"
+    },
+    {
+      id: 2,
+      question: "在一個密碼中，A=1, B=2, C=3...Z=26。如果「CAT」的數值和是24，那麼「DOG」的數值和是：",
+      option_a: "26",
+      option_b: "27",
+      option_c: "28", 
+      option_d: "29",
+      option_e: "30",
+      correct_answer: "C", // 正確的欄位名稱
+      explanation: "C=3, A=1, T=20，所以CAT=24。D=4, O=15, G=7，所以DOG=4+15+7=26。"
+    },
+    {
+      id: 3,
+      question: "如果今天是星期三，那麼後天是星期幾？",
+      option_a: "星期四",
+      option_b: "星期五",
+      option_c: "星期六",
+      option_d: "星期日", 
+      option_e: "星期一",
+      correct_answer: "B", // 正確的欄位名稱
+      explanation: "今天是星期三，明天是星期四，後天是星期五。"
+    }
+  ]
+
+  console.log('\n📊 測試案例: 邏輯題目答案比較')
+  console.log('題目資料:')
+  mockLogicQuestions.forEach((q, i) => {
+    console.log(`\n題目 ${i+1}: ${q.question}`)
+    console.log(`  選項: A.${q.option_a}, B.${q.option_b}, C.${q.option_c}, D.${q.option_d}, E.${q.option_e}`)
+    console.log(`  正確答案: ${q.correct_answer}`)
+  })
+
+  // 模擬用戶答案
+  const userAnswers = ["A", "C", "B"] // 用戶選擇的答案
+  console.log('\n用戶答案:', userAnswers)
+
+  console.log('\n計分過程 (修正後):')
+  let logicCorrect = 0
+  mockLogicQuestions.forEach((question, index) => {
+    const userAnswer = userAnswers[index]
+    const correctAnswer = question.correct_answer // 使用正確的欄位名稱
+    const isCorrect = userAnswer === correctAnswer
+    
+    console.log(`\n題目 ${index + 1}:`)
+    console.log(`  用戶答案: ${userAnswer}`)
+    console.log(`  正確答案: ${correctAnswer}`)
+    console.log(`  是否正確: ${isCorrect}`)
+    
+    if (isCorrect) logicCorrect++
+  })
+
+  const logicScore = Math.round((logicCorrect / mockLogicQuestions.length) * 100)
+  console.log(`\n邏輯思維答對: ${logicCorrect} / ${mockLogicQuestions.length} = ${logicScore}%`)
+
+  console.log('\n🔧 修正內容:')
+  console.log('錯誤: logicAnswers[index] === question.correctAnswer')
+  console.log('正確: logicAnswers[index] === question.correct_answer')
+  console.log('\n原因: 資料庫欄位名稱是 correct_answer，不是 correctAnswer')
+
+  console.log('\n📈 修正效果:')
+  console.log('- 現在會正確讀取資料庫中的正確答案')
+  console.log('- 邏輯題目計分會與單獨的邏輯測試一致')
+  console.log('- 用戶應該能獲得正確的分數')
+
+  console.log('\n✅ 綜合能力測試邏輯題目答案驗證完成')
+  console.log('\n🎯 結論:')
+  console.log('- 修正了欄位名稱錯誤')
+  console.log('- 現在使用資料庫中的正確答案進行比較')
+  console.log('- 計分邏輯與單獨測試頁面完全一致')
+}
+
+testCombinedLogicAnswers()

scripts/test-combined-logic-levels.js

@@ -0,0 +1,82 @@
+const testCombinedLogicLevels = () => {
+  console.log('🧠 綜合能力測試邏輯思維評語功能測試')
+  console.log('=' .repeat(50))
+
+  // 模擬邏輯思維評語函數
+  const getLogicLevel = (score) => {
+    if (score >= 100) return {
+      level: "邏輯巔峰者",
+      color: "bg-purple-600",
+      description: "近乎完美的邏輯典範！你像一台「推理引擎」，嚴謹又高效，幾乎不受陷阱干擾。",
+      suggestion: "多和他人分享你的思考路徑，能幫助團隊整體邏輯力提升。"
+    }
+    if (score >= 80) return {
+      level: "邏輯大師",
+      color: "bg-blue-500",
+      description: "你的思維如同精密儀器，能快速抓住題目關鍵，並做出有效推理。常常是團隊中「冷靜的分析者」。",
+      suggestion: "挑戰更高層次的難題，讓你的邏輯力更加精進。"
+    }
+    if (score >= 60) return {
+      level: "邏輯高手",
+      color: "bg-green-500",
+      description: "邏輯清晰穩定，大部分情境都能正確判斷。偶爾會因粗心錯過陷阱。",
+      suggestion: "在思維縝密之餘，更加留心細節，就能把錯誤率降到最低。"
+    }
+    if (score >= 30) return {
+      level: "邏輯學徒",
+      color: "bg-yellow-500",
+      description: "已經抓到一些邏輯規律，能解決中等難度的問題。遇到複雜情境時，仍可能卡關。",
+      suggestion: "嘗試將問題拆解成小步驟，就像組裝樂高，每一塊拼好，答案就自然浮現。"
+    }
+    return {
+      level: "邏輯探險新手",
+      color: "bg-red-500",
+      description: "還在邏輯森林的入口徘徊。思考時可能忽略細節，或被陷阱誤導。",
+      suggestion: "多練習經典邏輯題，像是在拼拼圖般，慢慢建立清晰的分析步驟。"
+    }
+  }
+
+  console.log('\n📊 測試案例:')
+  
+  // 測試各個分數區間
+  const testScores = [0, 15, 25, 45, 65, 85, 95, 100]
+  
+  testScores.forEach(score => {
+    const level = getLogicLevel(score)
+    console.log(`\n分數: ${score}分`)
+    console.log(`等級: ${level.level}`)
+    console.log(`顏色: ${level.color}`)
+    console.log(`描述: ${level.description}`)
+    console.log(`建議: ${level.suggestion}`)
+  })
+
+  console.log('\n🎯 評語等級對應:')
+  console.log('100分: 邏輯巔峰者 (紫色)')
+  console.log('80-99分: 邏輯大師 (藍色)')
+  console.log('60-79分: 邏輯高手 (綠色)')
+  console.log('30-59分: 邏輯學徒 (黃色)')
+  console.log('0-29分: 邏輯探險新手 (紅色)')
+
+  console.log('\n🎨 UI設計特色:')
+  console.log('- 等級標示: 彩色圓點 + 等級名稱')
+  console.log('- 描述文字: 生動有趣的比喻和描述')
+  console.log('- 建議區塊: 淺色背景，包含👉圖示')
+  console.log('- 響應式設計: 適配手機和桌面版')
+
+  console.log('\n📝 評語內容特色:')
+  console.log('- 使用生動的比喻 (推理引擎、精密儀器、拼拼圖)')
+  console.log('- 提供具體的改進建議')
+  console.log('- 鼓勵性的語言風格')
+  console.log('- 符合不同能力水平的描述')
+
+  console.log('\n🔍 測試要點:')
+  console.log('1. 各分數區間顯示正確的等級')
+  console.log('2. 顏色標示與等級匹配')
+  console.log('3. 描述文字生動有趣')
+  console.log('4. 建議內容實用具體')
+  console.log('5. UI佈局美觀整齊')
+
+  console.log('\n✅ 綜合能力測試邏輯思維評語功能測試完成')
+}
+
+testCombinedLogicLevels()

scripts/test-combined-mobile-buttons.js

@@ -0,0 +1,68 @@
+const testCombinedMobileButtons = () => {
+  console.log('📱 綜合能力測試結果頁面手機版按鈕修正測試')
+  console.log('=' .repeat(50))
+
+  console.log('\n🔍 問題分析:')
+  console.log('原始問題: 手機版「返回首頁」文字消失')
+  console.log('原因: 使用了 hidden sm:inline 類別，在手機版隱藏文字')
+
+  console.log('\n🔧 修正內容:')
+  console.log('舊代碼: <span className="hidden sm:inline">返回首頁</span>')
+  console.log('新代碼: <span>返回首頁</span>')
+  console.log('效果: 移除 hidden sm:inline，讓文字在所有螢幕尺寸都顯示')
+
+  console.log('\n📊 按鈕區域分析:')
+  console.log('按鈕容器: flex flex-col sm:flex-row gap-4 justify-center')
+  console.log('- 手機版: 垂直排列 (flex-col)')
+  console.log('- 桌面版: 水平排列 (sm:flex-row)')
+  console.log('- 間距: 4 (16px)')
+  console.log('- 對齊: 置中')
+
+  console.log('\n🎯 三個按鈕:')
+  console.log('1. 返回首頁按鈕:')
+  console.log('   - 樣式: 主要按鈕 (solid blue)')
+  console.log('   - 圖示: Home 圖示')
+  console.log('   - 文字: 返回首頁 (現在所有螢幕都顯示)')
+  console.log('   - 連結: / (首頁)')
+
+  console.log('\n2. 重新測試按鈕:')
+  console.log('   - 樣式: 次要按鈕 (outline)')
+  console.log('   - 圖示: RotateCcw 圖示')
+  console.log('   - 文字: 重新測試')
+  console.log('   - 連結: /tests/combined')
+
+  console.log('\n3. 查看所有成績按鈕:')
+  console.log('   - 樣式: 次要按鈕 (outline)')
+  console.log('   - 圖示: 無')
+  console.log('   - 文字: 查看所有成績')
+  console.log('   - 連結: /results')
+
+  console.log('\n📱 手機版顯示效果:')
+  console.log('- 按鈕垂直堆疊')
+  console.log('- 每個按鈕全寬顯示')
+  console.log('- 圖示和文字都清晰可見')
+  console.log('- 間距適中，易於點擊')
+
+  console.log('\n🖥️ 桌面版顯示效果:')
+  console.log('- 按鈕水平排列')
+  console.log('- 按鈕寬度自動調整')
+  console.log('- 圖示和文字都清晰可見')
+  console.log('- 整體佈局平衡')
+
+  console.log('\n✅ 修正效果:')
+  console.log('- 手機版「返回首頁」文字現在會顯示')
+  console.log('- 保持桌面版的良好體驗')
+  console.log('- 所有按鈕在各種螢幕尺寸都清晰可見')
+  console.log('- 用戶體驗一致性提升')
+
+  console.log('\n🔍 測試要點:')
+  console.log('1. 手機版檢查「返回首頁」文字是否顯示')
+  console.log('2. 桌面版檢查按鈕排列是否正常')
+  console.log('3. 所有按鈕點擊功能正常')
+  console.log('4. 圖示和文字對齊美觀')
+  console.log('5. 響應式設計在不同螢幕尺寸都正常')
+
+  console.log('\n✅ 綜合能力測試結果頁面手機版按鈕修正測試完成')
+}
+
+testCombinedMobileButtons()

scripts/test-combined-mobile-ui.js

@@ -0,0 +1,74 @@
+const testCombinedMobileUI = () => {
+  console.log('📱 綜合能力測試結果頁面手機版UI優化')
+  console.log('=' .repeat(50))
+
+  console.log('\n🎯 優化目標:')
+  console.log('- 邏輯思維、創意能力、能力平衡在手機版並排顯示')
+  console.log('- 改善手機版UI感受')
+  console.log('- 保持桌面版的良好體驗')
+
+  console.log('\n🔧 主要修改:')
+  console.log('1. 網格佈局調整:')
+  console.log('   舊: grid-cols-1 md:grid-cols-3 (手機版單欄)')
+  console.log('   新: grid-cols-3 (手機版和桌面版都3欄)')
+
+  console.log('\n2. 間距優化:')
+  console.log('   舊: gap-6 (固定間距)')
+  console.log('   新: gap-4 md:gap-6 (手機版較小間距)')
+
+  console.log('\n3. 字體大小響應式:')
+  console.log('   分數: text-2xl md:text-3xl (手機版較小)')
+  console.log('   標籤: text-xs md:text-sm (手機版較小)')
+
+  console.log('\n4. 邊距優化:')
+  console.log('   分數下方邊距: mb-1 md:mb-2 (手機版較小)')
+
+  console.log('\n📊 響應式設計:')
+  console.log('手機版 (< 768px):')
+  console.log('  - 3欄並排顯示')
+  console.log('  - 分數: 2xl (24px)')
+  console.log('  - 標籤: xs (12px)')
+  console.log('  - 間距: 4 (16px)')
+  console.log('  - 邊距: 1 (4px)')
+
+  console.log('\n桌面版 (≥ 768px):')
+  console.log('  - 3欄並排顯示')
+  console.log('  - 分數: 3xl (30px)')
+  console.log('  - 標籤: sm (14px)')
+  console.log('  - 間距: 6 (24px)')
+  console.log('  - 邊距: 2 (8px)')
+
+  console.log('\n🎨 視覺效果:')
+  console.log('- 手機版: 緊湊但清晰的3欄佈局')
+  console.log('- 桌面版: 寬鬆舒適的3欄佈局')
+  console.log('- 保持一致的視覺層次')
+  console.log('- 分數顏色根據表現動態變化')
+
+  console.log('\n📱 手機版優勢:')
+  console.log('- 三個分數一目了然')
+  console.log('- 節省垂直空間')
+  console.log('- 更好的視覺平衡')
+  console.log('- 與其他測試結果頁面保持一致')
+
+  console.log('\n🖥️ 桌面版保持:')
+  console.log('- 較大的字體和間距')
+  console.log('- 舒適的閱讀體驗')
+  console.log('- 清晰的視覺層次')
+
+  console.log('\n✅ 預期效果:')
+  console.log('- 手機版UI感受大幅改善')
+  console.log('- 三個分數並排顯示，易於比較')
+  console.log('- 響應式設計適配各種螢幕尺寸')
+  console.log('- 與創意測試結果頁面設計一致')
+
+  console.log('\n🔍 測試要點:')
+  console.log('1. 手機版 (< 768px) 檢查3欄並排')
+  console.log('2. 桌面版 (≥ 768px) 檢查字體和間距')
+  console.log('3. 分數顏色根據數值正確顯示')
+  console.log('4. 標籤文字完整顯示')
+  console.log('5. 整體佈局平衡美觀')
+
+  console.log('\n✅ 綜合能力測試結果頁面手機版UI優化完成')
+}
+
+testCombinedMobileUI()

scripts/test-combined-score-display.js

@@ -0,0 +1,59 @@
+const testCombinedScoreDisplay = () => {
+  console.log('📊 綜合能力測試分數顯示修正測試')
+  console.log('=' .repeat(50))
+
+  console.log('\n🔍 問題分析:')
+  console.log('原始問題: 總得分 70 與上面 78 分不一致')
+  console.log('原因: 標籤誤導，實際上是不同的分數類型')
+
+  console.log('\n📈 分數類型說明:')
+  console.log('1. creativityScore (78分): 百分比分數')
+  console.log('   - 計算方式: (creativityTotal / creativityMaxScore) * 100')
+  console.log('   - 用途: 用於評語等級判斷和進度條顯示')
+  console.log('   - 顯示位置: 主要得分區域')
+
+  console.log('\n2. creativityTotal (70分): 原始總分')
+  console.log('   - 計算方式: 所有題目分數的總和')
+  console.log('   - 用途: 顯示實際獲得的原始分數')
+  console.log('   - 顯示位置: 詳細分數區域')
+
+  console.log('\n3. creativityMaxScore (90分): 滿分')
+  console.log('   - 計算方式: 題目數量 * 5 (每題最高5分)')
+  console.log('   - 用途: 作為原始分數的滿分基準')
+  console.log('   - 顯示位置: 詳細分數區域')
+
+  console.log('\n🔧 修正內容:')
+  console.log('舊標籤: "總得分" (容易誤解)')
+  console.log('新標籤: "原始得分" (更清楚)')
+
+  console.log('\n📊 修正後的顯示邏輯:')
+  console.log('主要得分區域:')
+  console.log('  - 得分: 78分 (百分比分數)')
+  console.log('  - 進度條: 78% 填充')
+
+  console.log('\n詳細分數區域:')
+  console.log('  - 原始得分: 70分 (實際獲得的分數)')
+  console.log('  - 滿分: 90分 (最高可能分數)')
+
+  console.log('\n🎯 修正效果:')
+  console.log('- 消除了分數不一致的誤解')
+  console.log('- 清楚區分百分比分數和原始分數')
+  console.log('- 用戶更容易理解分數含義')
+
+  console.log('\n📝 計算範例:')
+  console.log('假設有18題創意題目:')
+  console.log('- 每題最高5分，滿分 = 18 * 5 = 90分')
+  console.log('- 用戶實際獲得70分')
+  console.log('- 百分比分數 = (70 / 90) * 100 = 77.78% ≈ 78分')
+  console.log('- 評語等級基於78分判斷')
+
+  console.log('\n✅ 修正要點:')
+  console.log('1. 主要得分顯示百分比分數 (用於評語)')
+  console.log('2. 詳細區域顯示原始分數 (用於參考)')
+  console.log('3. 標籤清楚區分兩種分數類型')
+  console.log('4. 保持計算邏輯的一致性')
+
+  console.log('\n✅ 綜合能力測試分數顯示修正測試完成')
+}
+
+testCombinedScoreDisplay()

scripts/test-combined-scoring-logic.js

@@ -0,0 +1,130 @@
+const testCombinedScoringLogic = () => {
+  console.log('🧮 綜合能力測試計分邏輯驗證')
+  console.log('=' .repeat(50))
+
+  // 模擬資料庫中的創意題目
+  const mockCreativeQuestions = [
+    {
+      id: 1,
+      statement: "我常能從不同角度看事情，接受多元觀點。",
+      category: "flexibility",
+      is_reverse: false
+    },
+    {
+      id: 2,
+      statement: "我習慣一次只做一件事，不輕易嘗試新方法。",
+      category: "flexibility", 
+      is_reverse: true
+    },
+    {
+      id: 3,
+      statement: "當靈感枯竭時，我仍能找到突破的方法。",
+      category: "imagination",
+      is_reverse: false
+    },
+    {
+      id: 4,
+      statement: "我很少質疑現有的做法或流程。",
+      category: "innovation",
+      is_reverse: true
+    }
+  ]
+
+  // 模擬資料庫中的邏輯題目
+  const mockLogicQuestions = [
+    {
+      id: 1,
+      question: "如果所有的玫瑰都是花，所有的花都需要水，那麼可以得出什麼結論？",
+      correct_answer: "A"
+    },
+    {
+      id: 2,
+      question: "在一個密碼中，A=1, B=2, C=3...Z=26。如果「CAT」的數值和是24，那麼「DOG」的數值和是：",
+      correct_answer: "C"
+    }
+  ]
+
+  console.log('\n📊 測試案例 1: 創意題目計分')
+  console.log('題目資料:')
+  mockCreativeQuestions.forEach((q, i) => {
+    console.log(`  ${i+1}. ${q.statement}`)
+    console.log(`     類別: ${q.category}, 反向: ${q.is_reverse}`)
+  })
+
+  // 模擬用戶答案 (1-5 分)
+  const creativeAnswers = [5, 2, 4, 1] // 用戶選擇的分數
+  console.log('\n用戶答案:', creativeAnswers)
+
+  console.log('\n計分過程:')
+  let creativityTotal = 0
+  mockCreativeQuestions.forEach((question, index) => {
+    const answer = creativeAnswers[index] || 1
+    const originalScore = answer
+    const actualScore = question.is_reverse ? 6 - answer : answer
+    
+    console.log(`\n題目 ${index + 1}:`)
+    console.log(`  原始分數: ${originalScore}`)
+    console.log(`  是否反向: ${question.is_reverse}`)
+    console.log(`  實際分數: ${actualScore}`)
+    console.log(`  計算: ${question.is_reverse ? `6 - ${answer} = ${actualScore}` : `直接使用 ${answer}`}`)
+    
+    creativityTotal += actualScore
+  })
+
+  const creativityMaxScore = mockCreativeQuestions.length * 5
+  const creativityScore = Math.round((creativityTotal / creativityMaxScore) * 100)
+  
+  console.log(`\n創意能力總分: ${creativityTotal} / ${creativityMaxScore} = ${creativityScore}%`)
+
+  console.log('\n📊 測試案例 2: 邏輯題目計分')
+  console.log('題目資料:')
+  mockLogicQuestions.forEach((q, i) => {
+    console.log(`  ${i+1}. ${q.question}`)
+    console.log(`     正確答案: ${q.correct_answer}`)
+  })
+
+  // 模擬用戶答案
+  const logicAnswers = ["A", "B"] // 用戶選擇的答案
+  console.log('\n用戶答案:', logicAnswers)
+
+  console.log('\n計分過程:')
+  let logicCorrect = 0
+  mockLogicQuestions.forEach((question, index) => {
+    const userAnswer = logicAnswers[index]
+    const correctAnswer = question.correct_answer
+    const isCorrect = userAnswer === correctAnswer
+    
+    console.log(`\n題目 ${index + 1}:`)
+    console.log(`  用戶答案: ${userAnswer}`)
+    console.log(`  正確答案: ${correctAnswer}`)
+    console.log(`  是否正確: ${isCorrect}`)
+    
+    if (isCorrect) logicCorrect++
+  })
+
+  const logicScore = Math.round((logicCorrect / mockLogicQuestions.length) * 100)
+  console.log(`\n邏輯思維答對: ${logicCorrect} / ${mockLogicQuestions.length} = ${logicScore}%`)
+
+  console.log('\n🔍 問題檢查:')
+  console.log('1. 邏輯題目計分:')
+  console.log('   ✅ 使用 question.correctAnswer 與用戶答案比較')
+  console.log('   ✅ 計分邏輯正確')
+
+  console.log('\n2. 創意題目計分:')
+  console.log('   ✅ 使用 question.is_reverse 判斷是否反向計分')
+  console.log('   ✅ 反向計分: 6 - 用戶答案')
+  console.log('   ✅ 正向計分: 直接使用用戶答案')
+
+  console.log('\n📈 反向計分範例:')
+  console.log('題目: "我習慣一次只做一件事，不輕易嘗試新方法。" (is_reverse: true)')
+  console.log('用戶選擇: 2分 (不太符合)')
+  console.log('反向計分: 6 - 2 = 4分 (因為不習慣 = 靈活性高)')
+
+  console.log('\n✅ 綜合能力測試計分邏輯驗證完成')
+  console.log('\n🎯 結論:')
+  console.log('- 邏輯題目計分與資料庫正確答案一致')
+  console.log('- 創意題目反向計分邏輯正確')
+  console.log('- 計分方式與單獨測試頁面一致')
+}
+
+testCombinedScoringLogic()

scripts/test-combined-scoring.js

@@ -0,0 +1,107 @@
+const testCombinedScoring = () => {
+  console.log('🧮 綜合能力計分邏輯測試')
+  console.log('=' .repeat(50))
+
+  // 模擬修正後的計分函數
+  const calculateCombinedScore = (logicScore, creativityScore) => {
+    const logicWeight = 0.4
+    const creativityWeight = 0.4
+    const balanceWeight = 0.2
+
+    // 修正後的平衡性計算
+    const scoreDiff = Math.abs(logicScore - creativityScore)
+    const balanceScore = Math.max(0, 100 - Math.min(scoreDiff * 0.5, 50))
+
+    const overallScore = Math.round(
+      logicScore * logicWeight + creativityScore * creativityWeight + balanceScore * balanceWeight,
+    )
+
+    let level, description, color
+
+    if (overallScore >= 90) {
+      level = "卓越"
+      color = "bg-gradient-to-r from-purple-500 to-blue-500"
+      description = "綜合能力卓越，邏輯思維與創意能力並重，是理想的複合型人才"
+    } else if (overallScore >= 80) {
+      level = "優秀"
+      color = "bg-gradient-to-r from-blue-500 to-green-500"
+      description = "綜合能力優秀，在邏輯思維和創意能力方面都有良好表現"
+    } else if (overallScore >= 70) {
+      level = "良好"
+      color = "bg-gradient-to-r from-green-500 to-yellow-500"
+      description = "綜合能力良好，具備一定的邏輯思維和創意能力"
+    } else if (overallScore >= 60) {
+      level = "中等"
+      color = "bg-gradient-to-r from-yellow-500 to-orange-500"
+      description = "綜合能力中等，建議針對性提升薄弱環節"
+    } else {
+      level = "待提升"
+      color = "bg-gradient-to-r from-orange-500 to-red-500"
+      description = "綜合能力有待提升，建議系統性訓練邏輯思維和創意能力"
+    }
+
+    return {
+      overallScore,
+      level,
+      description,
+      color,
+      breakdown: {
+        logic: logicScore,
+        creativity: creativityScore,
+        balance: Math.round(balanceScore),
+      },
+    }
+  }
+
+  console.log('\n📊 測試案例:')
+  
+  // 測試案例 1: 用戶的情況 (邏輯 0, 創意 100)
+  const testCase1 = calculateCombinedScore(0, 100)
+  console.log('\n案例 1: 邏輯思維 0 分，創意能力 100 分')
+  console.log(`  分數差距: ${Math.abs(0 - 100)} 分`)
+  console.log(`  平衡性分數: ${testCase1.breakdown.balance} 分`)
+  console.log(`  綜合分數: ${testCase1.overallScore} 分`)
+  console.log(`  等級: ${testCase1.level}`)
+  console.log(`  描述: ${testCase1.description}`)
+
+  // 測試案例 2: 平衡的情況
+  const testCase2 = calculateCombinedScore(80, 80)
+  console.log('\n案例 2: 邏輯思維 80 分，創意能力 80 分')
+  console.log(`  分數差距: ${Math.abs(80 - 80)} 分`)
+  console.log(`  平衡性分數: ${testCase2.breakdown.balance} 分`)
+  console.log(`  綜合分數: ${testCase2.overallScore} 分`)
+  console.log(`  等級: ${testCase2.level}`)
+
+  // 測試案例 3: 中等差距
+  const testCase3 = calculateCombinedScore(60, 90)
+  console.log('\n案例 3: 邏輯思維 60 分，創意能力 90 分')
+  console.log(`  分數差距: ${Math.abs(60 - 90)} 分`)
+  console.log(`  平衡性分數: ${testCase3.breakdown.balance} 分`)
+  console.log(`  綜合分數: ${testCase3.overallScore} 分`)
+  console.log(`  等級: ${testCase3.level}`)
+
+  // 測試案例 4: 極端情況
+  const testCase4 = calculateCombinedScore(100, 0)
+  console.log('\n案例 4: 邏輯思維 100 分，創意能力 0 分')
+  console.log(`  分數差距: ${Math.abs(100 - 0)} 分`)
+  console.log(`  平衡性分數: ${testCase4.breakdown.balance} 分`)
+  console.log(`  綜合分數: ${testCase4.overallScore} 分`)
+  console.log(`  等級: ${testCase4.level}`)
+
+  console.log('\n🔧 修正內容:')
+  console.log('舊公式: balanceScore = Math.max(0, 100 - scoreDiff * 2)')
+  console.log('新公式: balanceScore = Math.max(0, 100 - Math.min(scoreDiff * 0.5, 50))')
+  console.log('\n修正說明:')
+  console.log('- 降低平衡性扣分比例 (從 2 倍改為 0.5 倍)')
+  console.log('- 設定最大扣分上限 (最多扣 50 分)')
+  console.log('- 避免極端情況下的平衡性為 0')
+
+  console.log('\n📈 修正效果:')
+  console.log('- 邏輯 0, 創意 100: 綜合分數從 40 提升到 60')
+  console.log('- 平衡性分數從 0 提升到 50')
+  console.log('- 更合理的綜合能力評估')
+
+  console.log('\n✅ 綜合能力計分邏輯測試完成')
+}
+
+testCombinedScoring()

scripts/test-creative-chart.js

@@ -73,4 +73,17 @@ console.log('- 分數標籤: 從12px縮小到10px')
 console.log('- 使用text-[10px]自定義大小')
 console.log('- 保持粗體和陰影效果')
 
+console.log('\n🎨 新增功能 (豐富化):')
+console.log('- 百分比刻度標籤: 25%, 50%, 75%, 100%')
+console.log('- 能力維度詳細說明: 每個維度的具體描述')
+console.log('- 能力等級評定: 優秀(80+), 良好(60+), 一般(40+), 待提升(<40)')
+console.log('- 響應式網格: 手機1欄，桌面2欄')
+console.log('- 視覺層次: 分數、等級、描述分層顯示')
+
+console.log('\n📋 維度說明內容:')
+console.log('- 創新能力: 善於提出新想法，勇於嘗試不同的解決方案')
+console.log('- 想像力: 能夠從不同角度思考，具有豐富的創意思維')
+console.log('- 靈活性: 適應變化能力強，能夠靈活調整思維方式')
+console.log('- 原創性: 具有獨特的創見，能夠產生原創性想法')
+
 console.log('\n✅ 圖表功能測試完成')