修正完整的管理者查看詳細功能

app/admin/results/detail/[testResultId]/page.tsx

@@ -55,6 +55,7 @@ interface Question {
   userAnswer?: string | number
   isCorrect?: boolean
   score?: number
+  category?: 'innovation' | 'imagination' | 'flexibility' | 'originality'
   created_at: string
 }
 
@@ -394,82 +395,94 @@ function AdminResultDetailContent() {
             </CardContent>
           </Card>
 
-          {/* Score Overview */}
-          <Card className="text-center">
-            <CardHeader>
-              <div
-                className={`w-24 h-24 ${scoreLevel.color} rounded-full flex items-center justify-center mx-auto mb-4`}
-              >
-                <span className="text-3xl font-bold text-white">{result.score}</span>
-              </div>
-              <CardTitle className="text-3xl mb-2">測試完成！</CardTitle>
-              <div className="flex items-center justify-center gap-2 mb-4">
-                <Badge variant="secondary" className="text-lg px-4 py-1">
-                  {scoreLevel.level}
-                </Badge>
-              </div>
-              <p className="text-lg text-muted-foreground mb-3">{scoreLevel.description}</p>
-              <div className="bg-muted/50 rounded-lg p-4 text-sm">
-                <p className="text-muted-foreground">
-                  <span className="font-medium">👉 建議：</span>
-                  {scoreLevel.suggestion}
-                </p>
-              </div>
-            </CardHeader>
-            <CardContent>
-              <div className="grid grid-cols-3 gap-4 mb-6">
-                {result.type === 'creative' ? (
-                  <>
-                    <div className="text-center">
-                      <div className="text-2xl font-bold text-green-600 mb-1">{displayTotalScore}</div>
-                      <div className="text-xs text-muted-foreground">總得分</div>
+          {/* Logic Test Overview */}
+          {result.type === 'logic' && (
+            <Card className="text-center mb-6">
+              <CardHeader>
+                <div
+                  className={`w-24 h-24 ${scoreLevel.color} rounded-full flex items-center justify-center mx-auto mb-4`}
+                >
+                  <span className="text-3xl font-bold text-white">{result.score}</span>
+                </div>
+                <CardTitle className="text-3xl mb-2">邏輯測試完成！</CardTitle>
+                <div className="flex items-center justify-center gap-2 mb-4">
+                  <Badge variant="secondary" className="text-lg px-4 py-1">
+                    {scoreLevel.level}
+                  </Badge>
+                </div>
+                <p className="text-lg text-muted-foreground mb-3">{scoreLevel.description}</p>
+                <div className="bg-muted/50 rounded-lg p-4 text-sm">
+                  <p className="text-muted-foreground">
+                    <span className="font-medium">👉 建議：</span>
+                    {scoreLevel.suggestion}
+                  </p>
+                </div>
+              </CardHeader>
+              <CardContent>
+                <div className="grid grid-cols-3 gap-4 mb-6">
+                  <div className="text-center">
+                    <div className="text-2xl font-bold text-green-600 mb-1">{correctAnswers}</div>
+                    <div className="text-xs text-muted-foreground">答對題數</div>
+                  </div>
+                  <div className="text-center">
+                    <div className="text-2xl font-bold text-primary mb-1">{totalQuestions}</div>
+                    <div className="text-xs text-muted-foreground">總題數</div>
+                  </div>
+                  <div className="text-center">
+                    <div className="text-2xl font-bold text-accent mb-1">
+                      {totalQuestions > 0 ? Math.round((correctAnswers / totalQuestions) * 100) : 0}%
                     </div>
-                    <div className="text-center">
-                      <div className="text-2xl font-bold text-primary mb-1">{displayMaxScore}</div>
-                      <div className="text-xs text-muted-foreground">滿分</div>
-                    </div>
-                    <div className="text-center">
-                      <div className="text-2xl font-bold text-accent mb-1">
-                        {displayScorePercentage}%
-                      </div>
-                      <div className="text-xs text-muted-foreground">得分率</div>
-                    </div>
-                  </>
-                ) : (
-                  <>
-                    <div className="text-center">
-                      <div className="text-2xl font-bold text-green-600 mb-1">{correctAnswers}</div>
-                      <div className="text-xs text-muted-foreground">答對題數</div>
-                    </div>
-                    <div className="text-center">
-                      <div className="text-2xl font-bold text-primary mb-1">{totalQuestions}</div>
-                      <div className="text-xs text-muted-foreground">總題數</div>
-                    </div>
-                    <div className="text-center">
-                      <div className="text-2xl font-bold text-accent mb-1">
-                        {totalQuestions > 0 ? Math.round((correctAnswers / totalQuestions) * 100) : 0}%
-                      </div>
-                      <div className="text-xs text-muted-foreground">正確率</div>
-                    </div>
-                  </>
-                )}
-              </div>
-              <Progress value={result.score} className="h-3 mb-4" />
-            </CardContent>
-          </Card>
+                    <div className="text-xs text-muted-foreground">正確率</div>
+                  </div>
+                </div>
+                <Progress value={result.score} className="h-3 mb-4" />
+              </CardContent>
+            </Card>
+          )}
 
-          {/* Combined Test Analysis */}
-          {result.type === 'combined' && result.details && (
-            <CombinedAnalysis 
-              overallScore={result.score}
-              logicScore={result.details.logicScore}
-              creativityScore={result.details.creativeScore}
-              balanceScore={result.details.abilityBalance}
-              level={getScoreLevel(result.score, result.type).level}
-              description={getScoreLevel(result.score, result.type).description}
-              logicBreakdown={result.details.breakdown}
-              creativityBreakdown={result.details.breakdown}
-            />
+          {/* Creative Test Overview */}
+          {result.type === 'creative' && (
+            <Card className="text-center mb-6">
+              <CardHeader>
+                <div
+                  className={`w-24 h-24 ${scoreLevel.color} rounded-full flex items-center justify-center mx-auto mb-4`}
+                >
+                  <span className="text-3xl font-bold text-white">{result.score}</span>
+                </div>
+                <CardTitle className="text-3xl mb-2">創意測試完成！</CardTitle>
+                <div className="flex items-center justify-center gap-2 mb-4">
+                  <Badge variant="secondary" className="text-lg px-4 py-1">
+                    {scoreLevel.level}
+                  </Badge>
+                </div>
+                <p className="text-lg text-muted-foreground mb-3">{scoreLevel.description}</p>
+                <div className="bg-muted/50 rounded-lg p-4 text-sm">
+                  <p className="text-muted-foreground">
+                    <span className="font-medium">👉 建議：</span>
+                    {scoreLevel.suggestion}
+                  </p>
+                </div>
+              </CardHeader>
+              <CardContent>
+                <div className="grid grid-cols-3 gap-4 mb-6">
+                  <div className="text-center">
+                    <div className="text-2xl font-bold text-green-600 mb-1">{displayTotalScore}</div>
+                    <div className="text-xs text-muted-foreground">總得分</div>
+                  </div>
+                  <div className="text-center">
+                    <div className="text-2xl font-bold text-primary mb-1">{displayMaxScore}</div>
+                    <div className="text-xs text-muted-foreground">滿分</div>
+                  </div>
+                  <div className="text-center">
+                    <div className="text-2xl font-bold text-accent mb-1">
+                      {displayScorePercentage}%
+                    </div>
+                    <div className="text-xs text-muted-foreground">得分率</div>
+                  </div>
+                </div>
+                <Progress value={result.score} className="h-3 mb-4" />
+              </CardContent>
+            </Card>
           )}
 
           {/* Creative Analysis for Creative Tests */}
@@ -483,6 +496,31 @@ function AdminResultDetailContent() {
             />
           )}
 
+          {/* Combined Test Analysis */}
+          {result.type === 'combined' && result.details && (
+            <CombinedAnalysis 
+              overallScore={result.score}
+              logicScore={result.details.logicScore || 0}
+              creativityScore={result.details.creativeScore || 0}
+              balanceScore={result.details.abilityBalance || 0}
+              level={getScoreLevel(result.score, result.type).level}
+              description={getScoreLevel(result.score, result.type).description}
+              logicBreakdown={result.details.breakdown}
+              creativityBreakdown={result.details.breakdown}
+              // 個別測試結果的詳細資料
+              logicCorrectAnswers={logicQuestions.filter(q => q.isCorrect).length}
+              logicTotalQuestions={logicQuestions.length}
+              logicLevel={getScoreLevel(result.details.logicScore || 0, 'logic').level}
+              logicDescription={getScoreLevel(result.details.logicScore || 0, 'logic').description}
+              logicSuggestion={getScoreLevel(result.details.logicScore || 0, 'logic').suggestion}
+              creativityTotalScore={creativeQuestions.reduce((sum, q) => sum + (q.score || 0), 0)}
+              creativityMaxScore={creativeQuestions.length * 5}
+              creativityLevel={getScoreLevel(result.details.creativeScore || 0, 'creative').level}
+              creativityDescription={getScoreLevel(result.details.creativeScore || 0, 'creative').description}
+              creativitySuggestion={getScoreLevel(result.details.creativeScore || 0, 'creative').suggestion}
+            />
+          )}
+
           {/* Detailed Results */}
           {questions.length > 0 && (
             <Card>
@@ -571,7 +609,7 @@ function AdminResultDetailContent() {
                       </h3>
                       <div className="space-y-4">
                         {creativeQuestions.map((question, index) => {
-                          const dimensionInfo = getDimensionInfo(question.category)
+                          const dimensionInfo = getDimensionInfo(question.category || 'innovation')
                           return (
                             <div key={question.id} className={`border rounded-lg p-3 sm:p-4 ${dimensionInfo.borderColor} bg-opacity-30`} style={{ backgroundColor: `${dimensionInfo.color.replace('bg-', '')}10` }}>
                               <div className="flex items-start justify-between mb-2 sm:mb-3">

components/combined-analysis.tsx

@@ -14,6 +14,17 @@ interface CombinedAnalysisProps {
   description: string
   logicBreakdown?: any
   creativityBreakdown?: any
+  // 個別測試結果的詳細資料
+  logicCorrectAnswers?: number
+  logicTotalQuestions?: number
+  logicLevel?: string
+  logicDescription?: string
+  logicSuggestion?: string
+  creativityTotalScore?: number
+  creativityMaxScore?: number
+  creativityLevel?: string
+  creativityDescription?: string
+  creativitySuggestion?: string
 }
 
 export function CombinedAnalysis({ 
@@ -24,7 +35,18 @@ export function CombinedAnalysis({
   level, 
   description,
   logicBreakdown,
-  creativityBreakdown
+  creativityBreakdown,
+  // 個別測試結果的詳細資料
+  logicCorrectAnswers,
+  logicTotalQuestions,
+  logicLevel,
+  logicDescription,
+  logicSuggestion,
+  creativityTotalScore,
+  creativityMaxScore,
+  creativityLevel,
+  creativityDescription,
+  creativitySuggestion
 }: CombinedAnalysisProps) {
   
   // 獲取等級顏色
@@ -111,6 +133,119 @@ export function CombinedAnalysis({
         </CardContent>
       </Card>
 
+      {/* 個別測試結果 */}
+      {(logicCorrectAnswers !== undefined || creativityTotalScore !== undefined) && (
+        <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
+          {/* 邏輯思維測試 */}
+          {logicCorrectAnswers !== undefined && (
+            <Card>
+              <CardHeader>
+                <CardTitle className="flex items-center gap-2">
+                  <Brain className="w-5 h-5 text-blue-600" />
+                  邏輯思維測試
+                </CardTitle>
+              </CardHeader>
+              <CardContent>
+                <div className="space-y-4">
+                  {/* 分數顯示 */}
+                  <div className="flex items-center justify-between">
+                    <span className="text-sm font-medium text-muted-foreground">得分</span>
+                    <div className="flex items-center gap-3">
+                      <Progress value={logicScore} className="w-24 h-2" />
+                      <span className="text-2xl font-bold text-red-600">{logicScore}</span>
+                    </div>
+                  </div>
+
+                  {/* 統計數據 */}
+                  <div className="grid grid-cols-2 gap-3">
+                    <div className="bg-muted/50 rounded-lg p-3 text-center">
+                      <div className="text-lg font-bold text-green-600">{logicCorrectAnswers}</div>
+                      <div className="text-xs text-muted-foreground">答對題數</div>
+                    </div>
+                    <div className="bg-muted/50 rounded-lg p-3 text-center">
+                      <div className="text-lg font-bold text-blue-600">{logicTotalQuestions}</div>
+                      <div className="text-xs text-muted-foreground">總題數</div>
+                    </div>
+                  </div>
+
+                  {/* 等級和描述 */}
+                  <div className="space-y-3">
+                    <div className="flex items-center gap-2">
+                      <div className="w-3 h-3 rounded-full bg-purple-500"></div>
+                      <span className="font-medium text-sm">{logicLevel}</span>
+                    </div>
+                    <p className="text-sm text-muted-foreground leading-relaxed">
+                      {logicDescription}
+                    </p>
+                    <div className="flex items-start gap-2 p-3 bg-muted/30 rounded-lg">
+                      <Star className="w-4 h-4 text-yellow-500 mt-0.5 flex-shrink-0" />
+                      <div>
+                        <span className="text-sm font-medium text-muted-foreground">建議：</span>
+                        <p className="text-sm text-muted-foreground mt-1">{logicSuggestion}</p>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </CardContent>
+            </Card>
+          )}
+
+          {/* 創意能力測試 */}
+          {creativityTotalScore !== undefined && (
+            <Card>
+              <CardHeader>
+                <CardTitle className="flex items-center gap-2">
+                  <Lightbulb className="w-5 h-5 text-orange-600" />
+                  創意能力測試
+                </CardTitle>
+              </CardHeader>
+              <CardContent>
+                <div className="space-y-4">
+                  {/* 分數顯示 */}
+                  <div className="flex items-center justify-between">
+                    <span className="text-sm font-medium text-muted-foreground">得分</span>
+                    <div className="flex items-center gap-3">
+                      <Progress value={creativityScore} className="w-24 h-2" />
+                      <span className="text-2xl font-bold text-orange-600">{creativityScore}</span>
+                    </div>
+                  </div>
+
+                  {/* 統計數據 */}
+                  <div className="grid grid-cols-2 gap-3">
+                    <div className="bg-muted/50 rounded-lg p-3 text-center">
+                      <div className="text-lg font-bold text-green-600">{creativityTotalScore}</div>
+                      <div className="text-xs text-muted-foreground">原始得分</div>
+                    </div>
+                    <div className="bg-muted/50 rounded-lg p-3 text-center">
+                      <div className="text-lg font-bold text-blue-600">{creativityMaxScore}</div>
+                      <div className="text-xs text-muted-foreground">滿分</div>
+                    </div>
+                  </div>
+
+                  {/* 等級和描述 */}
+                  <div className="space-y-3">
+                    <div className="flex items-center gap-2">
+                      <div className="w-3 h-3 rounded-full bg-purple-500"></div>
+                      <span className="font-medium text-sm">{creativityLevel}</span>
+                    </div>
+                    <p className="text-sm text-muted-foreground leading-relaxed">
+                      {creativityDescription}
+                    </p>
+                    <div className="flex items-start gap-2 p-3 bg-muted/30 rounded-lg">
+                      <Star className="w-4 h-4 text-yellow-500 mt-0.5 flex-shrink-0" />
+                      <div>
+                        <span className="text-sm font-medium text-muted-foreground">建議：</span>
+                        <p className="text-sm text-muted-foreground mt-1">{creativitySuggestion}</p>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </CardContent>
+            </Card>
+          )}
+        </div>
+      )}
+
       {/* 能力分析 */}
       <Card>
         <CardHeader>
@@ -127,7 +262,7 @@ export function CombinedAnalysis({
                 <Brain className="w-6 h-6 text-blue-600" />
               </div>
               <h3 className="font-medium text-sm mb-2">邏輯思維</h3>
-              <div className="text-2xl font-bold text-red-600 mb-1">{logicScore}分</div>
+              <div className="text-3xl font-bold text-red-600 mb-1">{logicScore}</div>
               <div className={`text-xs ${logicStatus.color} mb-2`}>{logicStatus.text}</div>
               <Progress value={logicScore} className="h-2" />
             </div>
@@ -138,7 +273,7 @@ export function CombinedAnalysis({
                 <Lightbulb className="w-6 h-6 text-orange-600" />
               </div>
               <h3 className="font-medium text-sm mb-2">創意能力</h3>
-              <div className="text-2xl font-bold text-orange-600 mb-1">{creativityScore}分</div>
+              <div className="text-3xl font-bold text-orange-600 mb-1">{creativityScore}</div>
               <div className={`text-xs ${creativityStatus.color} mb-2`}>{creativityStatus.text}</div>
               <Progress value={creativityScore} className="h-2" />
             </div>
@@ -149,7 +284,7 @@ export function CombinedAnalysis({
                 <Target className="w-6 h-6 text-green-600" />
               </div>
               <h3 className="font-medium text-sm mb-2">能力平衡</h3>
-              <div className="text-2xl font-bold text-orange-600 mb-1">{balanceScore}分</div>
+              <div className="text-3xl font-bold text-orange-600 mb-1">{balanceScore}</div>
               <div className={`text-xs ${balanceStatus.color} mb-2`}>{balanceStatus.text}</div>
               <Progress value={balanceScore} className="h-2" />
             </div>

components/individual-test-results.tsx

@@ -0,0 +1,163 @@
+"use client"
+
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
+import { Badge } from "@/components/ui/badge"
+import { Progress } from "@/components/ui/progress"
+import { Brain, Lightbulb, CheckCircle, Star } from "lucide-react"
+
+interface IndividualTestResultsProps {
+  logicScore: number
+  logicCorrectAnswers: number
+  logicTotalQuestions: number
+  logicLevel: string
+  logicDescription: string
+  logicSuggestion: string
+  creativityScore: number
+  creativityTotalScore: number
+  creativityMaxScore: number
+  creativityLevel: string
+  creativityDescription: string
+  creativitySuggestion: string
+}
+
+export function IndividualTestResults({
+  logicScore,
+  logicCorrectAnswers,
+  logicTotalQuestions,
+  logicLevel,
+  logicDescription,
+  logicSuggestion,
+  creativityScore,
+  creativityTotalScore,
+  creativityMaxScore,
+  creativityLevel,
+  creativityDescription,
+  creativitySuggestion
+}: IndividualTestResultsProps) {
+  
+  // 獲取邏輯測試等級顏色
+  const getLogicLevelColor = (score: number) => {
+    if (score >= 90) return "bg-purple-600"
+    if (score >= 80) return "bg-green-500"
+    if (score >= 60) return "bg-blue-500"
+    if (score >= 30) return "bg-yellow-500"
+    return "bg-red-500"
+  }
+
+  // 獲取創意測試等級顏色
+  const getCreativityLevelColor = (score: number) => {
+    if (score >= 90) return "bg-purple-600"
+    if (score >= 75) return "bg-blue-500"
+    if (score >= 55) return "bg-green-500"
+    if (score >= 35) return "bg-yellow-500"
+    return "bg-red-500"
+  }
+
+  return (
+    <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
+      {/* 邏輯思維測試 */}
+      <Card>
+        <CardHeader>
+          <CardTitle className="flex items-center gap-2">
+            <Brain className="w-5 h-5 text-blue-600" />
+            邏輯思維測試
+          </CardTitle>
+        </CardHeader>
+        <CardContent>
+          <div className="space-y-4">
+            {/* 分數顯示 */}
+            <div className="flex items-center justify-between">
+              <span className="text-sm font-medium text-muted-foreground">得分</span>
+              <div className="flex items-center gap-3">
+                <Progress value={logicScore} className="w-24 h-2" />
+                <span className="text-2xl font-bold text-red-600">{logicScore}</span>
+              </div>
+            </div>
+
+            {/* 統計數據 */}
+            <div className="grid grid-cols-2 gap-3">
+              <div className="bg-muted/50 rounded-lg p-3 text-center">
+                <div className="text-lg font-bold text-green-600">{logicCorrectAnswers}</div>
+                <div className="text-xs text-muted-foreground">答對題數</div>
+              </div>
+              <div className="bg-muted/50 rounded-lg p-3 text-center">
+                <div className="text-lg font-bold text-blue-600">{logicTotalQuestions}</div>
+                <div className="text-xs text-muted-foreground">總題數</div>
+              </div>
+            </div>
+
+            {/* 等級和描述 */}
+            <div className="space-y-3">
+              <div className="flex items-center gap-2">
+                <div className={`w-3 h-3 rounded-full ${getLogicLevelColor(logicScore)}`}></div>
+                <span className="font-medium text-sm">{logicLevel}</span>
+              </div>
+              <p className="text-sm text-muted-foreground leading-relaxed">
+                {logicDescription}
+              </p>
+              <div className="flex items-start gap-2 p-3 bg-muted/30 rounded-lg">
+                <Star className="w-4 h-4 text-yellow-500 mt-0.5 flex-shrink-0" />
+                <div>
+                  <span className="text-sm font-medium text-muted-foreground">建議：</span>
+                  <p className="text-sm text-muted-foreground mt-1">{logicSuggestion}</p>
+                </div>
+              </div>
+            </div>
+          </div>
+        </CardContent>
+      </Card>
+
+      {/* 創意能力測試 */}
+      <Card>
+        <CardHeader>
+          <CardTitle className="flex items-center gap-2">
+            <Lightbulb className="w-5 h-5 text-orange-600" />
+            創意能力測試
+          </CardTitle>
+        </CardHeader>
+        <CardContent>
+          <div className="space-y-4">
+            {/* 分數顯示 */}
+            <div className="flex items-center justify-between">
+              <span className="text-sm font-medium text-muted-foreground">得分</span>
+              <div className="flex items-center gap-3">
+                <Progress value={creativityScore} className="w-24 h-2" />
+                <span className="text-2xl font-bold text-orange-600">{creativityScore}</span>
+              </div>
+            </div>
+
+            {/* 統計數據 */}
+            <div className="grid grid-cols-2 gap-3">
+              <div className="bg-muted/50 rounded-lg p-3 text-center">
+                <div className="text-lg font-bold text-green-600">{creativityTotalScore}</div>
+                <div className="text-xs text-muted-foreground">原始得分</div>
+              </div>
+              <div className="bg-muted/50 rounded-lg p-3 text-center">
+                <div className="text-lg font-bold text-blue-600">{creativityMaxScore}</div>
+                <div className="text-xs text-muted-foreground">滿分</div>
+              </div>
+            </div>
+
+            {/* 等級和描述 */}
+            <div className="space-y-3">
+              <div className="flex items-center gap-2">
+                <div className={`w-3 h-3 rounded-full ${getCreativityLevelColor(creativityScore)}`}></div>
+                <span className="font-medium text-sm">{creativityLevel}</span>
+              </div>
+              <p className="text-sm text-muted-foreground leading-relaxed">
+                {creativityDescription}
+              </p>
+              <div className="flex items-start gap-2 p-3 bg-muted/30 rounded-lg">
+                <Star className="w-4 h-4 text-yellow-500 mt-0.5 flex-shrink-0" />
+                <div>
+                  <span className="text-sm font-medium text-muted-foreground">建議：</span>
+                  <p className="text-sm text-muted-foreground mt-1">{creativitySuggestion}</p>
+                </div>
+              </div>
+            </div>
+          </div>
+        </CardContent>
+      </Card>
+    </div>
+  )
+}