改為使用者看不到答題結果
This commit is contained in:
@@ -1,36 +1,12 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import { useEffect, useState } from "react"
|
import { useEffect, useState } from "react"
|
||||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
|
import { Card, CardContent } from "@/components/ui/card"
|
||||||
import { Button } from "@/components/ui/button"
|
import { Button } from "@/components/ui/button"
|
||||||
import { Badge } from "@/components/ui/badge"
|
import { BarChart3, Home } from "lucide-react"
|
||||||
import { Progress } from "@/components/ui/progress"
|
|
||||||
import { Brain, Lightbulb, BarChart3, Home, RotateCcw, TrendingUp, Target, Award, Printer, Share2 } from "lucide-react"
|
|
||||||
import Link from "next/link"
|
import Link from "next/link"
|
||||||
import { getRecommendations } from "@/lib/utils/score-calculator"
|
|
||||||
import { useAuth } from "@/lib/hooks/use-auth"
|
import { useAuth } from "@/lib/hooks/use-auth"
|
||||||
|
|
||||||
interface LogicQuestion {
|
|
||||||
id: number
|
|
||||||
question: string
|
|
||||||
option_a: string
|
|
||||||
option_b: string
|
|
||||||
option_c: string
|
|
||||||
option_d: string
|
|
||||||
option_e: string
|
|
||||||
correct_answer: 'A' | 'B' | 'C' | 'D' | 'E'
|
|
||||||
explanation?: string
|
|
||||||
created_at: string
|
|
||||||
}
|
|
||||||
|
|
||||||
interface CreativeQuestion {
|
|
||||||
id: number
|
|
||||||
statement: string
|
|
||||||
category: 'innovation' | 'imagination' | 'flexibility' | 'originality'
|
|
||||||
is_reverse: boolean
|
|
||||||
created_at: string
|
|
||||||
}
|
|
||||||
|
|
||||||
interface CombinedTestResults {
|
interface CombinedTestResults {
|
||||||
type: string
|
type: string
|
||||||
logicScore: number
|
logicScore: number
|
||||||
@@ -54,8 +30,6 @@ interface CombinedTestResults {
|
|||||||
export default function CombinedResultsPage() {
|
export default function CombinedResultsPage() {
|
||||||
const { user } = useAuth()
|
const { user } = useAuth()
|
||||||
const [results, setResults] = useState<CombinedTestResults | null>(null)
|
const [results, setResults] = useState<CombinedTestResults | null>(null)
|
||||||
const [logicQuestions, setLogicQuestions] = useState<LogicQuestion[]>([])
|
|
||||||
const [creativeQuestions, setCreativeQuestions] = useState<CreativeQuestion[]>([])
|
|
||||||
const [isLoading, setIsLoading] = useState(true)
|
const [isLoading, setIsLoading] = useState(true)
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@@ -63,58 +37,44 @@ export default function CombinedResultsPage() {
|
|||||||
if (!user) return
|
if (!user) return
|
||||||
|
|
||||||
try {
|
try {
|
||||||
// 從資料庫獲取最新的綜合測試結果
|
// 從資料庫獲取最新的綜合測驗結果
|
||||||
const response = await fetch(`/api/test-results/combined?userId=${user.id}`)
|
const response = await fetch(`/api/test-results/combined?userId=${user.id}`)
|
||||||
const data = await response.json()
|
const data = await response.json()
|
||||||
|
|
||||||
if (data.success && data.data.length > 0) {
|
if (data.success && data.data.length > 0) {
|
||||||
// 取最新的結果
|
// 按創建時間排序，取最新的結果
|
||||||
const latestResult = data.data[0]
|
const sortedResults = data.data.sort((a: any, b: any) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime())
|
||||||
|
const latestResult = sortedResults[0]
|
||||||
|
|
||||||
// 轉換為前端需要的格式
|
|
||||||
setResults({
|
setResults({
|
||||||
type: "combined",
|
type: latestResult.type,
|
||||||
logicScore: latestResult.logic_score,
|
logicScore: latestResult.logicScore || 0,
|
||||||
creativityScore: latestResult.creativity_score,
|
creativityScore: latestResult.creativityScore || 0,
|
||||||
overallScore: latestResult.overall_score,
|
overallScore: latestResult.overallScore || latestResult.score || 0,
|
||||||
level: latestResult.level,
|
level: latestResult.level || "待評估",
|
||||||
description: latestResult.description || "",
|
description: latestResult.description || "測試完成",
|
||||||
breakdown: {
|
breakdown: latestResult.breakdown || {
|
||||||
logic: latestResult.logic_score,
|
logic: latestResult.logicScore || 0,
|
||||||
creativity: latestResult.creativity_score,
|
creativity: latestResult.creativityScore || 0,
|
||||||
balance: latestResult.balance_score
|
balance: latestResult.balance || 0
|
||||||
},
|
},
|
||||||
logicAnswers: latestResult.logic_breakdown?.answers || {},
|
logicAnswers: latestResult.logicAnswers || {},
|
||||||
creativeAnswers: latestResult.creativity_breakdown?.answers || {},
|
creativeAnswers: latestResult.creativeAnswers || {},
|
||||||
logicCorrect: latestResult.logic_breakdown?.correct || 0,
|
logicCorrect: latestResult.logicCorrect || 0,
|
||||||
creativityTotal: latestResult.creativity_breakdown?.total || 0,
|
creativityTotal: latestResult.creativityTotal || 0,
|
||||||
creativityMaxScore: latestResult.creativity_breakdown?.maxScore || 0,
|
creativityMaxScore: latestResult.creativityMaxScore || 100,
|
||||||
completedAt: latestResult.completed_at
|
completedAt: latestResult.created_at
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
// 如果沒有資料庫結果，回退到 localStorage
|
// 如果沒有資料庫結果，嘗試從 localStorage 載入
|
||||||
const savedResults = localStorage.getItem("combinedTestResults")
|
const savedResults = localStorage.getItem("combinedTestResults")
|
||||||
if (savedResults) {
|
if (savedResults) {
|
||||||
setResults(JSON.parse(savedResults))
|
setResults(JSON.parse(savedResults))
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Load questions from database
|
|
||||||
const logicResponse = await fetch('/api/logic-questions')
|
|
||||||
const logicData = await logicResponse.json()
|
|
||||||
|
|
||||||
const creativeResponse = await fetch('/api/creative-questions')
|
|
||||||
const creativeData = await creativeResponse.json()
|
|
||||||
|
|
||||||
if (logicData.success && creativeData.success) {
|
|
||||||
setLogicQuestions(logicData.questions)
|
|
||||||
setCreativeQuestions(creativeData.questions)
|
|
||||||
} else {
|
|
||||||
console.error('Failed to load questions:', logicData.error || creativeData.error)
|
|
||||||
}
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Error loading data:', error)
|
console.error('Error loading combined test results:', error)
|
||||||
// 回退到 localStorage
|
// 如果 API 失敗，嘗試從 localStorage 載入
|
||||||
const savedResults = localStorage.getItem("combinedTestResults")
|
const savedResults = localStorage.getItem("combinedTestResults")
|
||||||
if (savedResults) {
|
if (savedResults) {
|
||||||
setResults(JSON.parse(savedResults))
|
setResults(JSON.parse(savedResults))
|
||||||
@@ -155,381 +115,40 @@ export default function CombinedResultsPage() {
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
const recommendations = getRecommendations(results.logicScore, results.creativityScore)
|
|
||||||
|
|
||||||
const getScoreColor = (score: number) => {
|
|
||||||
if (score >= 90) return "text-green-600"
|
|
||||||
if (score >= 80) return "text-blue-600"
|
|
||||||
if (score >= 70) return "text-yellow-600"
|
|
||||||
if (score >= 60) return "text-orange-600"
|
|
||||||
return "text-red-600"
|
|
||||||
}
|
|
||||||
|
|
||||||
const getLogicLevel = (score: number) => {
|
|
||||||
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: "多練習經典邏輯題，像是在拼拼圖般，慢慢建立清晰的分析步驟。"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const getCreativityLevel = (score: number) => {
|
|
||||||
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: "觀察生活小事，或閱讀不同領域的內容，讓靈感一點一滴積累。"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen bg-background">
|
<div className="min-h-screen bg-background flex items-center justify-center">
|
||||||
{/* Header */}
|
<Card className="w-full max-w-md">
|
||||||
<header className="border-b bg-card/50 backdrop-blur-sm">
|
<CardContent className="text-center py-12">
|
||||||
<div className="container mx-auto px-4 py-4">
|
<div className="w-20 h-20 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-6">
|
||||||
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
|
<BarChart3 className="w-10 h-10 text-green-600" />
|
||||||
<div className="flex items-center gap-3">
|
|
||||||
<div className="w-10 h-10 bg-gradient-to-r from-primary to-accent rounded-lg flex items-center justify-center">
|
|
||||||
<BarChart3 className="w-6 h-6 text-white" />
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<h1 className="text-xl font-bold text-foreground">綜合能力測試結果</h1>
|
|
||||||
<p className="text-sm text-muted-foreground">
|
|
||||||
完成時間：{new Date(results.completedAt).toLocaleString("zh-TW")}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="flex justify-end gap-2">
|
|
||||||
<Button
|
|
||||||
onClick={() => {
|
|
||||||
if (navigator.share) {
|
|
||||||
navigator.share({
|
|
||||||
title: '綜合能力測試結果',
|
|
||||||
text: '查看我的綜合能力測試結果',
|
|
||||||
url: window.location.href
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
navigator.clipboard.writeText(window.location.href)
|
|
||||||
alert('連結已複製到剪貼簿')
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
variant="outline"
|
|
||||||
size="sm"
|
|
||||||
className="print:hidden"
|
|
||||||
>
|
|
||||||
<Share2 className="w-4 h-4 sm:mr-2" />
|
|
||||||
<span className="hidden sm:inline">分享結果</span>
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
onClick={() => window.print()}
|
|
||||||
variant="outline"
|
|
||||||
size="sm"
|
|
||||||
className="print:hidden"
|
|
||||||
>
|
|
||||||
<Printer className="w-4 h-4 sm:mr-2" />
|
|
||||||
<span className="hidden sm:inline">列印結果</span>
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<h1 className="text-2xl font-bold text-foreground mb-4">綜合測試完成！</h1>
|
||||||
</header>
|
<p className="text-lg text-muted-foreground mb-6">
|
||||||
|
感謝您完成綜合能力測試，您的答案已成功提交。
|
||||||
<div className="container mx-auto px-4 py-8">
|
</p>
|
||||||
<div className="max-w-6xl mx-auto space-y-8">
|
<p className="text-sm text-muted-foreground mb-8">
|
||||||
{/* Overall Score */}
|
完成時間：{new Date(results.completedAt).toLocaleString("zh-TW")}
|
||||||
<Card className="text-center bg-gradient-to-br from-primary/5 to-accent/5 border-2 border-primary/20">
|
</p>
|
||||||
<CardHeader>
|
<div className="space-y-3">
|
||||||
<div className="w-32 h-32 bg-gradient-to-r from-primary to-accent rounded-full flex items-center justify-center mx-auto mb-4">
|
<Button asChild size="lg" className="w-full">
|
||||||
<span className="text-4xl font-bold text-white">{results.overallScore}</span>
|
<Link href="/home">
|
||||||
</div>
|
|
||||||
<CardTitle className="text-4xl mb-2">綜合評估完成！</CardTitle>
|
|
||||||
<div className="flex items-center justify-center gap-2 mb-4">
|
|
||||||
<Badge className="bg-gradient-to-r from-primary to-accent text-white text-xl px-6 py-2">
|
|
||||||
{results.level}
|
|
||||||
</Badge>
|
|
||||||
</div>
|
|
||||||
<p className="text-lg text-muted-foreground max-w-2xl mx-auto text-pretty">{results.description}</p>
|
|
||||||
</CardHeader>
|
|
||||||
<CardContent>
|
|
||||||
<Progress value={results.overallScore} className="h-4 mb-6" />
|
|
||||||
<div className="grid grid-cols-3 gap-4 md:gap-6">
|
|
||||||
<div className="text-center">
|
|
||||||
<div className={`text-2xl md:text-3xl font-bold mb-1 md:mb-2 ${getScoreColor(results.logicScore)}`}>
|
|
||||||
{results.logicScore}
|
|
||||||
</div>
|
|
||||||
<div className="text-xs md:text-sm text-muted-foreground">邏輯思維</div>
|
|
||||||
</div>
|
|
||||||
<div className="text-center">
|
|
||||||
<div className={`text-2xl md:text-3xl font-bold mb-1 md:mb-2 ${getScoreColor(results.creativityScore)}`}>
|
|
||||||
{results.creativityScore}
|
|
||||||
</div>
|
|
||||||
<div className="text-xs md:text-sm text-muted-foreground">創意能力</div>
|
|
||||||
</div>
|
|
||||||
<div className="text-center">
|
|
||||||
<div className={`text-2xl md:text-3xl font-bold mb-1 md:mb-2 ${getScoreColor(results.breakdown.balance)}`}>
|
|
||||||
{results.breakdown.balance}
|
|
||||||
</div>
|
|
||||||
<div className="text-xs md:text-sm text-muted-foreground">能力平衡</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
|
|
||||||
{/* Detailed Breakdown */}
|
|
||||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-8">
|
|
||||||
{/* Logic Results */}
|
|
||||||
<Card>
|
|
||||||
<CardHeader>
|
|
||||||
<CardTitle className="flex items-center gap-2">
|
|
||||||
<Brain className="w-5 h-5 text-primary" />
|
|
||||||
邏輯思維測試
|
|
||||||
</CardTitle>
|
|
||||||
</CardHeader>
|
|
||||||
<CardContent>
|
|
||||||
<div className="space-y-4">
|
|
||||||
<div className="flex justify-between items-center">
|
|
||||||
<span className="text-muted-foreground">得分</span>
|
|
||||||
<span className={`text-2xl font-bold ${getScoreColor(results.logicScore)}`}>
|
|
||||||
{results.logicScore}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<Progress value={results.logicScore} className="h-3" />
|
|
||||||
<div className="grid grid-cols-2 gap-4 text-sm">
|
|
||||||
<div className="text-center p-3 bg-muted/50 rounded">
|
|
||||||
<div className="font-bold text-green-600">{results.logicCorrect}</div>
|
|
||||||
<div className="text-muted-foreground">答對題數</div>
|
|
||||||
</div>
|
|
||||||
<div className="text-center p-3 bg-muted/50 rounded">
|
|
||||||
<div className="font-bold text-primary">{logicQuestions.length}</div>
|
|
||||||
<div className="text-muted-foreground">總題數</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Logic Level Assessment */}
|
|
||||||
{(() => {
|
|
||||||
const logicLevel = getLogicLevel(results.logicScore)
|
|
||||||
return (
|
|
||||||
<div className="mt-4 p-4 bg-muted/30 rounded-lg">
|
|
||||||
<div className="flex items-center gap-2 mb-2">
|
|
||||||
<div className={`w-3 h-3 ${logicLevel.color} rounded-full`}></div>
|
|
||||||
<span className="font-medium text-sm">{logicLevel.level}</span>
|
|
||||||
</div>
|
|
||||||
<p className="text-sm text-muted-foreground mb-2 leading-relaxed">
|
|
||||||
{logicLevel.description}
|
|
||||||
</p>
|
|
||||||
<div className="bg-muted/50 rounded p-2 text-xs">
|
|
||||||
<span className="font-medium">👉 建議：</span>
|
|
||||||
<span className="text-muted-foreground">{logicLevel.suggestion}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
})()}
|
|
||||||
</div>
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
|
|
||||||
{/* Creative Results */}
|
|
||||||
<Card>
|
|
||||||
<CardHeader>
|
|
||||||
<CardTitle className="flex items-center gap-2">
|
|
||||||
<Lightbulb className="w-5 h-5 text-accent" />
|
|
||||||
創意能力測試
|
|
||||||
</CardTitle>
|
|
||||||
</CardHeader>
|
|
||||||
<CardContent>
|
|
||||||
<div className="space-y-4">
|
|
||||||
<div className="flex justify-between items-center">
|
|
||||||
<span className="text-muted-foreground">得分</span>
|
|
||||||
<span className={`text-2xl font-bold ${getScoreColor(results.creativityScore)}`}>
|
|
||||||
{results.creativityScore}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<Progress value={results.creativityScore} className="h-3" />
|
|
||||||
<div className="grid grid-cols-2 gap-4 text-sm">
|
|
||||||
<div className="text-center p-3 bg-muted/50 rounded">
|
|
||||||
<div className="font-bold text-accent">{results.creativityTotal}</div>
|
|
||||||
<div className="text-muted-foreground">原始得分</div>
|
|
||||||
</div>
|
|
||||||
<div className="text-center p-3 bg-muted/50 rounded">
|
|
||||||
<div className="font-bold text-primary">{results.creativityMaxScore}</div>
|
|
||||||
<div className="text-muted-foreground">滿分</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Creative Level Assessment */}
|
|
||||||
{(() => {
|
|
||||||
const creativityLevel = getCreativityLevel(results.creativityScore)
|
|
||||||
return (
|
|
||||||
<div className="mt-4 p-4 bg-muted/30 rounded-lg">
|
|
||||||
<div className="flex items-center gap-2 mb-2">
|
|
||||||
<div className={`w-3 h-3 ${creativityLevel.color} rounded-full`}></div>
|
|
||||||
<span className="font-medium text-sm">{creativityLevel.level}</span>
|
|
||||||
</div>
|
|
||||||
<p className="text-sm text-muted-foreground mb-2 leading-relaxed">
|
|
||||||
{creativityLevel.description}
|
|
||||||
</p>
|
|
||||||
<div className="bg-muted/50 rounded p-2 text-xs">
|
|
||||||
<span className="font-medium">👉 建議：</span>
|
|
||||||
<span className="text-muted-foreground">{creativityLevel.suggestion}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
})()}
|
|
||||||
</div>
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Ability Analysis */}
|
|
||||||
<Card>
|
|
||||||
<CardHeader>
|
|
||||||
<CardTitle className="flex items-center gap-2">
|
|
||||||
<TrendingUp className="w-5 h-5" />
|
|
||||||
能力分析
|
|
||||||
</CardTitle>
|
|
||||||
</CardHeader>
|
|
||||||
<CardContent>
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
|
|
||||||
<div className="text-center p-6 border rounded-lg">
|
|
||||||
<Brain className="w-12 h-12 text-primary mx-auto mb-4" />
|
|
||||||
<h3 className="font-semibold mb-2">邏輯思維</h3>
|
|
||||||
<div className={`text-2xl font-bold mb-2 ${getScoreColor(results.logicScore)}`}>
|
|
||||||
{results.logicScore}分
|
|
||||||
</div>
|
|
||||||
<Progress value={results.logicScore} className="h-2 mb-2" />
|
|
||||||
<p className="text-sm text-muted-foreground">
|
|
||||||
{results.logicScore >= 80 ? "表現優秀" : results.logicScore >= 60 ? "表現良好" : "需要提升"}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="text-center p-6 border rounded-lg">
|
|
||||||
<Lightbulb className="w-12 h-12 text-accent mx-auto mb-4" />
|
|
||||||
<h3 className="font-semibold mb-2">創意能力</h3>
|
|
||||||
<div className={`text-2xl font-bold mb-2 ${getScoreColor(results.creativityScore)}`}>
|
|
||||||
{results.creativityScore}分
|
|
||||||
</div>
|
|
||||||
<Progress value={results.creativityScore} className="h-2 mb-2" />
|
|
||||||
<p className="text-sm text-muted-foreground">
|
|
||||||
{results.creativityScore >= 80
|
|
||||||
? "表現優秀"
|
|
||||||
: results.creativityScore >= 60
|
|
||||||
? "表現良好"
|
|
||||||
: "需要提升"}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="text-center p-6 border rounded-lg">
|
|
||||||
<Target className="w-12 h-12 text-green-600 mx-auto mb-4" />
|
|
||||||
<h3 className="font-semibold mb-2">能力平衡</h3>
|
|
||||||
<div className={`text-2xl font-bold mb-2 ${getScoreColor(results.breakdown.balance)}`}>
|
|
||||||
{results.breakdown.balance}分
|
|
||||||
</div>
|
|
||||||
<Progress value={results.breakdown.balance} className="h-2 mb-2" />
|
|
||||||
<p className="text-sm text-muted-foreground">
|
|
||||||
{results.breakdown.balance >= 80
|
|
||||||
? "非常均衡"
|
|
||||||
: results.breakdown.balance >= 60
|
|
||||||
? "相對均衡"
|
|
||||||
: "發展不均"}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
|
|
||||||
{/* Recommendations */}
|
|
||||||
{recommendations.length > 0 && (
|
|
||||||
<Card>
|
|
||||||
<CardHeader>
|
|
||||||
<CardTitle className="flex items-center gap-2">
|
|
||||||
<Award className="w-5 h-5" />
|
|
||||||
發展建議
|
|
||||||
</CardTitle>
|
|
||||||
</CardHeader>
|
|
||||||
<CardContent>
|
|
||||||
<div className="space-y-3">
|
|
||||||
{recommendations.map((recommendation, index) => (
|
|
||||||
<div key={index} className="flex items-start gap-3 p-4 bg-muted/50 rounded-lg">
|
|
||||||
<div className="w-6 h-6 bg-primary rounded-full flex items-center justify-center flex-shrink-0 mt-0.5">
|
|
||||||
<span className="text-xs font-bold text-primary-foreground">{index + 1}</span>
|
|
||||||
</div>
|
|
||||||
<p className="text-sm leading-relaxed">{recommendation}</p>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{/* Actions */}
|
|
||||||
<div className="flex flex-col sm:flex-row gap-4 justify-center">
|
|
||||||
<Button asChild size="lg">
|
|
||||||
<Link href="/">
|
|
||||||
<Home className="w-4 h-4 mr-2" />
|
<Home className="w-4 h-4 mr-2" />
|
||||||
<span>返回首頁</span>
|
返回首頁
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</Button>
|
||||||
<Button asChild variant="outline" size="lg">
|
<Button asChild variant="outline" size="lg" className="w-full">
|
||||||
<Link href="/tests/combined">
|
<Link href="/tests/logic">
|
||||||
<RotateCcw className="w-4 h-4 mr-2" />
|
開始邏輯測試
|
||||||
重新測試
|
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</Button>
|
||||||
<Button asChild variant="outline" size="lg">
|
<Button asChild variant="outline" size="lg" className="w-full">
|
||||||
<Link href="/results">查看所有成績</Link>
|
<Link href="/tests/creative">
|
||||||
|
開始創意測試
|
||||||
|
</Link>
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</CardContent>
|
||||||
</div>
|
</Card>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
@@ -1,13 +1,10 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import { useEffect, useState } from "react"
|
import { useEffect, useState } from "react"
|
||||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
|
import { Card, CardContent } from "@/components/ui/card"
|
||||||
import { Button } from "@/components/ui/button"
|
import { Button } from "@/components/ui/button"
|
||||||
import { Badge } from "@/components/ui/badge"
|
import { Lightbulb, Home } from "lucide-react"
|
||||||
import { Progress } from "@/components/ui/progress"
|
|
||||||
import { Lightbulb, Home, RotateCcw, TrendingUp, Printer, Share2 } from "lucide-react"
|
|
||||||
import Link from "next/link"
|
import Link from "next/link"
|
||||||
import { creativeQuestions } from "@/lib/questions/creative-questions"
|
|
||||||
import { useAuth } from "@/lib/hooks/use-auth"
|
import { useAuth } from "@/lib/hooks/use-auth"
|
||||||
|
|
||||||
interface CreativeTestResults {
|
interface CreativeTestResults {
|
||||||
@@ -17,18 +14,11 @@ interface CreativeTestResults {
|
|||||||
maxScore: number
|
maxScore: number
|
||||||
answers: Record<number, number>
|
answers: Record<number, number>
|
||||||
completedAt: string
|
completedAt: string
|
||||||
dimensionScores?: {
|
|
||||||
innovation: { percentage: number, rawScore: number, maxScore: number }
|
|
||||||
imagination: { percentage: number, rawScore: number, maxScore: number }
|
|
||||||
flexibility: { percentage: number, rawScore: number, maxScore: number }
|
|
||||||
originality: { percentage: number, rawScore: number, maxScore: number }
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function CreativeResultsPage() {
|
export default function CreativeResultsPage() {
|
||||||
const { user } = useAuth()
|
const { user } = useAuth()
|
||||||
const [results, setResults] = useState<CreativeTestResults | null>(null)
|
const [results, setResults] = useState<CreativeTestResults | null>(null)
|
||||||
const [questions, setQuestions] = useState<any[]>([])
|
|
||||||
const [isLoading, setIsLoading] = useState(true)
|
const [isLoading, setIsLoading] = useState(true)
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@@ -45,28 +35,16 @@ export default function CreativeResultsPage() {
|
|||||||
const sortedResults = data.data.sort((a: any, b: any) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime())
|
const sortedResults = data.data.sort((a: any, b: any) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime())
|
||||||
const latestResult = sortedResults[0]
|
const latestResult = sortedResults[0]
|
||||||
|
|
||||||
// 獲取題目資料來計算各維度分數
|
setResults({
|
||||||
const questionsResponse = await fetch('/api/creative-questions')
|
type: latestResult.type,
|
||||||
const questionsData = await questionsResponse.json()
|
score: latestResult.score,
|
||||||
|
totalScore: latestResult.totalScore || latestResult.score,
|
||||||
if (questionsData.success) {
|
maxScore: latestResult.maxScore || 100,
|
||||||
setQuestions(questionsData.questions)
|
answers: latestResult.answers || {},
|
||||||
|
completedAt: latestResult.created_at
|
||||||
// 計算各維度分數
|
})
|
||||||
const dimensionScores = await calculateDimensionScores(latestResult, questionsData.questions)
|
|
||||||
|
|
||||||
setResults({
|
|
||||||
type: "creative",
|
|
||||||
score: latestResult.score,
|
|
||||||
totalScore: latestResult.correct_answers,
|
|
||||||
maxScore: latestResult.total_questions * 5,
|
|
||||||
answers: {}, // 從資料庫結果中獲取
|
|
||||||
completedAt: latestResult.completed_at,
|
|
||||||
dimensionScores: dimensionScores
|
|
||||||
})
|
|
||||||
}
|
|
||||||
} else {
|
} else {
|
||||||
// 如果沒有資料庫結果，回退到 localStorage
|
// 如果沒有資料庫結果，嘗試從 localStorage 載入
|
||||||
const savedResults = localStorage.getItem("creativeTestResults")
|
const savedResults = localStorage.getItem("creativeTestResults")
|
||||||
if (savedResults) {
|
if (savedResults) {
|
||||||
setResults(JSON.parse(savedResults))
|
setResults(JSON.parse(savedResults))
|
||||||
@@ -74,11 +52,11 @@ export default function CreativeResultsPage() {
|
|||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('Error loading creative test results:', error)
|
console.error('Error loading creative test results:', error)
|
||||||
// 回退到 localStorage
|
// 如果 API 失敗，嘗試從 localStorage 載入
|
||||||
const savedResults = localStorage.getItem("creativeTestResults")
|
const savedResults = localStorage.getItem("creativeTestResults")
|
||||||
if (savedResults) {
|
if (savedResults) {
|
||||||
setResults(JSON.parse(savedResults))
|
setResults(JSON.parse(savedResults))
|
||||||
}
|
}
|
||||||
} finally {
|
} finally {
|
||||||
setIsLoading(false)
|
setIsLoading(false)
|
||||||
}
|
}
|
||||||
@@ -87,69 +65,17 @@ export default function CreativeResultsPage() {
|
|||||||
loadData()
|
loadData()
|
||||||
}, [user])
|
}, [user])
|
||||||
|
|
||||||
// 計算各維度分數
|
if (isLoading) {
|
||||||
const calculateDimensionScores = async (testResult: any, questions: any[]) => {
|
return (
|
||||||
try {
|
<div className="min-h-screen bg-background flex items-center justify-center">
|
||||||
// 獲取詳細答案
|
<Card className="w-full max-w-md">
|
||||||
const answersResponse = await fetch(`/api/creative-test-answers?testResultId=${testResult.id}`)
|
<CardContent className="text-center py-8">
|
||||||
const answersData = await answersResponse.json()
|
<div className="w-8 h-8 border-4 border-primary border-t-transparent rounded-full animate-spin mx-auto mb-4"></div>
|
||||||
|
<p className="text-muted-foreground">載入結果中...</p>
|
||||||
if (!answersData.success) {
|
</CardContent>
|
||||||
return {
|
</Card>
|
||||||
innovation: { percentage: 0, rawScore: 0, maxScore: 0 },
|
</div>
|
||||||
imagination: { percentage: 0, rawScore: 0, maxScore: 0 },
|
)
|
||||||
flexibility: { percentage: 0, rawScore: 0, maxScore: 0 },
|
|
||||||
originality: { percentage: 0, rawScore: 0, maxScore: 0 }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const answers = answersData.data
|
|
||||||
const dimensionScores: Record<string, { total: number, count: number }> = {
|
|
||||||
innovation: { total: 0, count: 0 },
|
|
||||||
imagination: { total: 0, count: 0 },
|
|
||||||
flexibility: { total: 0, count: 0 },
|
|
||||||
originality: { total: 0, count: 0 }
|
|
||||||
}
|
|
||||||
|
|
||||||
// 計算各維度分數
|
|
||||||
answers.forEach((answer: any) => {
|
|
||||||
const question = questions.find(q => q.id === answer.question_id)
|
|
||||||
if (question && dimensionScores[question.category]) {
|
|
||||||
dimensionScores[question.category].total += answer.score
|
|
||||||
dimensionScores[question.category].count += 1
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
// 計算百分比分數和原始分數
|
|
||||||
const result = {
|
|
||||||
innovation: { percentage: 0, rawScore: 0, maxScore: 0 },
|
|
||||||
imagination: { percentage: 0, rawScore: 0, maxScore: 0 },
|
|
||||||
flexibility: { percentage: 0, rawScore: 0, maxScore: 0 },
|
|
||||||
originality: { percentage: 0, rawScore: 0, maxScore: 0 }
|
|
||||||
}
|
|
||||||
|
|
||||||
Object.keys(dimensionScores).forEach(category => {
|
|
||||||
const { total, count } = dimensionScores[category]
|
|
||||||
const maxScore = count * 5
|
|
||||||
const percentage = count > 0 ? Math.round((total / maxScore) * 100) : 0
|
|
||||||
|
|
||||||
result[category as keyof typeof result] = {
|
|
||||||
percentage: percentage,
|
|
||||||
rawScore: total,
|
|
||||||
maxScore: maxScore
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
return result
|
|
||||||
} catch (error) {
|
|
||||||
console.error('計算維度分數失敗:', error)
|
|
||||||
return {
|
|
||||||
innovation: { percentage: 0, rawScore: 0, maxScore: 0 },
|
|
||||||
imagination: { percentage: 0, rawScore: 0, maxScore: 0 },
|
|
||||||
flexibility: { percentage: 0, rawScore: 0, maxScore: 0 },
|
|
||||||
originality: { percentage: 0, rawScore: 0, maxScore: 0 }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!results) {
|
if (!results) {
|
||||||
@@ -167,438 +93,40 @@ export default function CreativeResultsPage() {
|
|||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
const getCreativityLevel = (score: number) => {
|
|
||||||
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: "觀察生活小事，或閱讀不同領域的內容，讓靈感一點一滴積累。"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const creativityLevel = getCreativityLevel(results.score)
|
|
||||||
|
|
||||||
// Calculate category scores - prioritize database data if available
|
|
||||||
let categoryResults: Array<{
|
|
||||||
category: string
|
|
||||||
name: string
|
|
||||||
score: number
|
|
||||||
rawScore: number
|
|
||||||
maxRawScore: number
|
|
||||||
}> = []
|
|
||||||
|
|
||||||
if (results.dimensionScores) {
|
|
||||||
// Use database-calculated dimension scores
|
|
||||||
const dimensionNames = {
|
|
||||||
innovation: '創新能力',
|
|
||||||
imagination: '想像力',
|
|
||||||
flexibility: '靈活性',
|
|
||||||
originality: '原創性'
|
|
||||||
}
|
|
||||||
|
|
||||||
categoryResults = Object.entries(results.dimensionScores).map(([key, data]) => ({
|
|
||||||
category: key,
|
|
||||||
name: dimensionNames[key as keyof typeof dimensionNames],
|
|
||||||
score: data.percentage,
|
|
||||||
rawScore: data.rawScore,
|
|
||||||
maxRawScore: data.maxScore
|
|
||||||
}))
|
|
||||||
} else {
|
|
||||||
// Fallback to localStorage calculation
|
|
||||||
const categoryScores = {
|
|
||||||
innovation: { total: 0, count: 0, name: "創新能力" },
|
|
||||||
imagination: { total: 0, count: 0, name: "想像力" },
|
|
||||||
flexibility: { total: 0, count: 0, name: "靈活性" },
|
|
||||||
originality: { total: 0, count: 0, name: "原創性" },
|
|
||||||
}
|
|
||||||
|
|
||||||
creativeQuestions.forEach((question, index) => {
|
|
||||||
const answer = results.answers[index] || 1
|
|
||||||
const score = question.isReverse ? 6 - answer : answer
|
|
||||||
categoryScores[question.category].total += score
|
|
||||||
categoryScores[question.category].count += 1
|
|
||||||
})
|
|
||||||
|
|
||||||
categoryResults = Object.entries(categoryScores).map(([key, data]) => ({
|
|
||||||
category: key,
|
|
||||||
name: data.name,
|
|
||||||
score: data.count > 0 ? Math.round((data.total / (data.count * 5)) * 100) : 0,
|
|
||||||
rawScore: data.total,
|
|
||||||
maxRawScore: data.count * 5,
|
|
||||||
}))
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen bg-background">
|
<div className="min-h-screen bg-background flex items-center justify-center">
|
||||||
{/* Header */}
|
<Card className="w-full max-w-md">
|
||||||
<header className="border-b bg-card/50 backdrop-blur-sm">
|
<CardContent className="text-center py-12">
|
||||||
<div className="container mx-auto px-4 py-4">
|
<div className="w-20 h-20 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-6">
|
||||||
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
|
<Lightbulb className="w-10 h-10 text-green-600" />
|
||||||
<div className="flex items-center gap-3">
|
|
||||||
<div className="w-10 h-10 bg-accent rounded-lg flex items-center justify-center">
|
|
||||||
<Lightbulb className="w-6 h-6 text-accent-foreground" />
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<h1 className="text-xl font-bold text-foreground">創意能力測試結果</h1>
|
|
||||||
<p className="text-sm text-muted-foreground">
|
|
||||||
完成時間：{new Date(results.completedAt).toLocaleString("zh-TW")}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="flex justify-end gap-2">
|
|
||||||
<Button
|
|
||||||
onClick={() => {
|
|
||||||
if (navigator.share) {
|
|
||||||
navigator.share({
|
|
||||||
title: '創意能力測試結果',
|
|
||||||
text: '查看我的創意能力測試結果',
|
|
||||||
url: window.location.href
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
navigator.clipboard.writeText(window.location.href)
|
|
||||||
alert('連結已複製到剪貼簿')
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
variant="outline"
|
|
||||||
size="sm"
|
|
||||||
className="print:hidden"
|
|
||||||
>
|
|
||||||
<Share2 className="w-4 h-4 sm:mr-2" />
|
|
||||||
<span className="hidden sm:inline">分享結果</span>
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
onClick={() => window.print()}
|
|
||||||
variant="outline"
|
|
||||||
size="sm"
|
|
||||||
className="print:hidden"
|
|
||||||
>
|
|
||||||
<Printer className="w-4 h-4 sm:mr-2" />
|
|
||||||
<span className="hidden sm:inline">列印結果</span>
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<h1 className="text-2xl font-bold text-foreground mb-4">創意能力測試完成！</h1>
|
||||||
</header>
|
<p className="text-lg text-muted-foreground mb-6">
|
||||||
|
感謝您完成創意能力測試，您的答案已成功提交。
|
||||||
<div className="container mx-auto px-4 py-8">
|
</p>
|
||||||
<div className="max-w-4xl mx-auto space-y-8">
|
<p className="text-sm text-muted-foreground mb-8">
|
||||||
{/* Score Overview */}
|
完成時間：{new Date(results.completedAt).toLocaleString("zh-TW")}
|
||||||
<Card className="text-center">
|
</p>
|
||||||
<CardHeader>
|
<div className="space-y-3">
|
||||||
<div
|
<Button asChild size="lg" className="w-full">
|
||||||
className={`w-24 h-24 ${creativityLevel.color} rounded-full flex items-center justify-center mx-auto mb-4`}
|
<Link href="/home">
|
||||||
>
|
|
||||||
<span className="text-3xl font-bold text-white">{results.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">
|
|
||||||
{creativityLevel.level}
|
|
||||||
</Badge>
|
|
||||||
</div>
|
|
||||||
<p className="text-lg text-muted-foreground mb-3">{creativityLevel.description}</p>
|
|
||||||
<div className="bg-muted/50 rounded-lg p-4 text-sm">
|
|
||||||
<p className="text-muted-foreground">
|
|
||||||
<span className="font-medium">👉 建議：</span>
|
|
||||||
{creativityLevel.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-accent mb-1">{results.totalScore}</div>
|
|
||||||
<div className="text-xs text-muted-foreground">總得分</div>
|
|
||||||
</div>
|
|
||||||
<div className="text-center">
|
|
||||||
<div className="text-2xl font-bold text-primary mb-1">{results.maxScore}</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">
|
|
||||||
{Math.round((results.totalScore / results.maxScore) * 100)}%
|
|
||||||
</div>
|
|
||||||
<div className="text-xs text-muted-foreground">得分率</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<Progress value={results.score} className="h-3 mb-4" />
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
|
|
||||||
{/* Category Analysis */}
|
|
||||||
<Card>
|
|
||||||
<CardHeader>
|
|
||||||
<CardTitle className="flex items-center gap-2">
|
|
||||||
<TrendingUp className="w-5 h-5" />
|
|
||||||
能力維度分析
|
|
||||||
</CardTitle>
|
|
||||||
</CardHeader>
|
|
||||||
<CardContent>
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 md:gap-6">
|
|
||||||
{categoryResults.map((category) => (
|
|
||||||
<div key={category.category} className="space-y-2 md:space-y-3">
|
|
||||||
<div className="flex justify-between items-center">
|
|
||||||
<h3 className="font-medium text-sm md:text-base">{category.name}</h3>
|
|
||||||
<Badge variant="outline" className="text-xs">{category.score}分</Badge>
|
|
||||||
</div>
|
|
||||||
<Progress value={category.score} className="h-2" />
|
|
||||||
<p className="text-xs md:text-sm text-muted-foreground">
|
|
||||||
{category.rawScore} / {category.maxRawScore} 分
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
|
|
||||||
{/* Detailed Feedback Chart */}
|
|
||||||
<Card>
|
|
||||||
<CardHeader>
|
|
||||||
<CardTitle className="flex items-center gap-2">
|
|
||||||
<TrendingUp className="w-5 h-5" />
|
|
||||||
創意能力分析圖表
|
|
||||||
</CardTitle>
|
|
||||||
</CardHeader>
|
|
||||||
<CardContent>
|
|
||||||
<div className="space-y-6">
|
|
||||||
<div className="p-3 md:p-4 bg-muted/50 rounded-lg">
|
|
||||||
<h3 className="font-medium mb-2 text-sm md:text-base">創意能力評估</h3>
|
|
||||||
<p className="text-xs md:text-sm text-muted-foreground leading-relaxed">
|
|
||||||
基於您的測試結果，您在創意思維方面表現為「{creativityLevel.level}」水平。
|
|
||||||
{results.score >= 75 &&
|
|
||||||
"您具備出色的創新思維能力，善於從不同角度思考問題，能夠產生獨特的想法和解決方案。"}
|
|
||||||
{results.score >= 50 &&
|
|
||||||
results.score < 75 &&
|
|
||||||
"您具有一定的創造性思維潛力，建議多參與創新活動，培養發散性思維。"}
|
|
||||||
{results.score < 50 && "建議您多接觸創新思維訓練，培養好奇心和探索精神，提升創造性解決問題的能力。"}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Radar Chart */}
|
|
||||||
<div className="space-y-4">
|
|
||||||
<h4 className="font-medium text-sm md:text-base text-center">能力維度雷達圖</h4>
|
|
||||||
<div className="flex justify-center">
|
|
||||||
<div className="relative w-56 h-56 md:w-72 md:h-72">
|
|
||||||
{/* Radar Chart Background */}
|
|
||||||
<svg viewBox="0 0 200 200" className="w-full h-full">
|
|
||||||
{/* Grid circles */}
|
|
||||||
<circle cx="100" cy="100" r="60" fill="none" stroke="#e5e7eb" strokeWidth="1"/>
|
|
||||||
<circle cx="100" cy="100" r="45" fill="none" stroke="#e5e7eb" strokeWidth="1"/>
|
|
||||||
<circle cx="100" cy="100" r="30" fill="none" stroke="#e5e7eb" strokeWidth="1"/>
|
|
||||||
<circle cx="100" cy="100" r="15" fill="none" stroke="#e5e7eb" strokeWidth="1"/>
|
|
||||||
|
|
||||||
{/* Grid lines - 4 axes for 4 dimensions */}
|
|
||||||
{[0, 90, 180, 270].map((angle, index) => {
|
|
||||||
const x1 = 100 + 60 * Math.cos((angle - 90) * Math.PI / 180)
|
|
||||||
const y1 = 100 + 60 * Math.sin((angle - 90) * Math.PI / 180)
|
|
||||||
return (
|
|
||||||
<line
|
|
||||||
key={index}
|
|
||||||
x1="100"
|
|
||||||
y1="100"
|
|
||||||
x2={x1}
|
|
||||||
y2={y1}
|
|
||||||
stroke="#e5e7eb"
|
|
||||||
strokeWidth="1"
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
})}
|
|
||||||
|
|
||||||
{/* Data points and area */}
|
|
||||||
{categoryResults.map((category, index) => {
|
|
||||||
const angle = (index * 90 - 90) * Math.PI / 180
|
|
||||||
const radius = (category.score / 100) * 60
|
|
||||||
const x = 100 + radius * Math.cos(angle)
|
|
||||||
const y = 100 + radius * Math.sin(angle)
|
|
||||||
|
|
||||||
// Calculate label position - more space for text
|
|
||||||
let labelRadius = 75
|
|
||||||
let labelX = 100 + labelRadius * Math.cos(angle)
|
|
||||||
let labelY = 100 + labelRadius * Math.sin(angle)
|
|
||||||
|
|
||||||
// Special adjustments for imagination and originality
|
|
||||||
if (angle === 0) { // Right - 想像力
|
|
||||||
labelRadius = 70
|
|
||||||
labelX = 100 + labelRadius * Math.cos(angle)
|
|
||||||
labelY = 100 + labelRadius * Math.sin(angle)
|
|
||||||
} else if (angle === 180 * Math.PI / 180) { // Left - 原創性
|
|
||||||
labelRadius = 70
|
|
||||||
labelX = 100 + labelRadius * Math.cos(angle)
|
|
||||||
labelY = 100 + labelRadius * Math.sin(angle)
|
|
||||||
}
|
|
||||||
|
|
||||||
// Adjust text anchor based on position
|
|
||||||
let textAnchor: "middle" | "start" | "end" = "middle"
|
|
||||||
let dominantBaseline: "middle" | "hanging" | "alphabetic" = "middle"
|
|
||||||
|
|
||||||
if (angle === -90 * Math.PI / 180) { // Top
|
|
||||||
dominantBaseline = "hanging"
|
|
||||||
} else if (angle === 90 * Math.PI / 180) { // Bottom
|
|
||||||
dominantBaseline = "alphabetic"
|
|
||||||
} else if (angle === 0) { // Right
|
|
||||||
textAnchor = "start"
|
|
||||||
} else if (angle === 180 * Math.PI / 180) { // Left
|
|
||||||
textAnchor = "end"
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<g key={category.category}>
|
|
||||||
{/* Data point */}
|
|
||||||
<circle
|
|
||||||
cx={x}
|
|
||||||
cy={y}
|
|
||||||
r="4"
|
|
||||||
fill="#3b82f6"
|
|
||||||
stroke="white"
|
|
||||||
strokeWidth="2"
|
|
||||||
className="drop-shadow-sm"
|
|
||||||
/>
|
|
||||||
{/* Label - positioned closer to the chart */}
|
|
||||||
<text
|
|
||||||
x={labelX}
|
|
||||||
y={labelY}
|
|
||||||
textAnchor={textAnchor}
|
|
||||||
dominantBaseline={dominantBaseline}
|
|
||||||
className="text-[10px] fill-gray-600 font-medium"
|
|
||||||
>
|
|
||||||
{category.name}
|
|
||||||
</text>
|
|
||||||
{/* Score label - positioned above the data point */}
|
|
||||||
<text
|
|
||||||
x={x}
|
|
||||||
y={y - 12}
|
|
||||||
textAnchor="middle"
|
|
||||||
dominantBaseline="middle"
|
|
||||||
className="text-[10px] fill-blue-600 font-bold"
|
|
||||||
style={{ textShadow: '1px 1px 2px white, -1px -1px 2px white, 1px -1px 2px white, -1px 1px 2px white' }}
|
|
||||||
>
|
|
||||||
{category.score}%
|
|
||||||
</text>
|
|
||||||
</g>
|
|
||||||
)
|
|
||||||
})}
|
|
||||||
|
|
||||||
{/* Area fill */}
|
|
||||||
<polygon
|
|
||||||
points={categoryResults.map((category, index) => {
|
|
||||||
const angle = (index * 90 - 90) * Math.PI / 180
|
|
||||||
const radius = (category.score / 100) * 60
|
|
||||||
const x = 100 + radius * Math.cos(angle)
|
|
||||||
const y = 100 + radius * Math.sin(angle)
|
|
||||||
return `${x},${y}`
|
|
||||||
}).join(' ')}
|
|
||||||
fill="rgba(59, 130, 246, 0.2)"
|
|
||||||
stroke="#3b82f6"
|
|
||||||
strokeWidth="2"
|
|
||||||
/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Legend */}
|
|
||||||
<div className="flex justify-center">
|
|
||||||
<div className="grid grid-cols-2 md:grid-cols-4 gap-3 text-xs">
|
|
||||||
{categoryResults.map((category) => (
|
|
||||||
<div key={category.category} className="flex items-center gap-2">
|
|
||||||
<div className="w-3 h-3 bg-blue-500 rounded-full"></div>
|
|
||||||
<span className="text-muted-foreground">{category.name}</span>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Dimension Details */}
|
|
||||||
<div className="mt-6 grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
||||||
{categoryResults.map((category) => {
|
|
||||||
const getDescription = (categoryName: string) => {
|
|
||||||
switch (categoryName) {
|
|
||||||
case '創新能力':
|
|
||||||
return '善於提出新想法，勇於嘗試不同的解決方案'
|
|
||||||
case '想像力':
|
|
||||||
return '能夠從不同角度思考，具有豐富的創意思維'
|
|
||||||
case '靈活性':
|
|
||||||
return '適應變化能力強，能夠靈活調整思維方式'
|
|
||||||
case '原創性':
|
|
||||||
return '具有獨特的創見，能夠產生原創性想法'
|
|
||||||
default:
|
|
||||||
return ''
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const getLevel = (score: number) => {
|
|
||||||
if (score >= 80) return { text: '優秀', color: 'text-green-600' }
|
|
||||||
if (score >= 60) return { text: '良好', color: 'text-blue-600' }
|
|
||||||
if (score >= 40) return { text: '一般', color: 'text-yellow-600' }
|
|
||||||
return { text: '待提升', color: 'text-red-600' }
|
|
||||||
}
|
|
||||||
|
|
||||||
const level = getLevel(category.score)
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div key={category.category} className="p-3 bg-muted/30 rounded-lg">
|
|
||||||
<div className="flex items-center justify-between mb-2">
|
|
||||||
<h5 className="font-medium text-sm">{category.name}</h5>
|
|
||||||
<div className="flex items-center gap-2">
|
|
||||||
<span className="text-sm font-bold text-blue-600">{category.score}%</span>
|
|
||||||
<span className={`text-xs ${level.color}`}>{level.text}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<p className="text-xs text-muted-foreground leading-relaxed">
|
|
||||||
{getDescription(category.name)}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
|
|
||||||
{/* Actions */}
|
|
||||||
<div className="flex flex-col sm:flex-row gap-3 sm:gap-4 justify-center">
|
|
||||||
<Button asChild size="lg" className="w-full sm:w-auto">
|
|
||||||
<Link href="/">
|
|
||||||
<Home className="w-4 h-4 mr-2" />
|
<Home className="w-4 h-4 mr-2" />
|
||||||
<span>返回首頁</span>
|
返回首頁
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</Button>
|
||||||
<Button asChild variant="outline" size="lg" className="w-full sm:w-auto">
|
<Button asChild variant="outline" size="lg" className="w-full">
|
||||||
<Link href="/tests/creative">
|
<Link href="/tests/logic">
|
||||||
<RotateCcw className="w-4 h-4 mr-2" />
|
開始邏輯測試
|
||||||
重新測試
|
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</Button>
|
||||||
<Button asChild variant="outline" size="lg" className="w-full sm:w-auto">
|
<Button asChild variant="outline" size="lg" className="w-full">
|
||||||
<Link href="/tests/logic">開始邏輯測試</Link>
|
<Link href="/tests/combined">
|
||||||
|
開始綜合測試
|
||||||
|
</Link>
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</CardContent>
|
||||||
</div>
|
</Card>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
@@ -127,193 +127,39 @@ export default function LogicResultsPage() {
|
|||||||
const scoreLevel = getScoreLevel(results.score)
|
const scoreLevel = getScoreLevel(results.score)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen bg-background">
|
<div className="min-h-screen bg-background flex items-center justify-center">
|
||||||
{/* Header */}
|
<Card className="w-full max-w-md">
|
||||||
<header className="border-b bg-card/50 backdrop-blur-sm">
|
<CardContent className="text-center py-12">
|
||||||
<div className="container mx-auto px-4 py-4">
|
<div className="w-20 h-20 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-6">
|
||||||
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
|
<CheckCircle className="w-10 h-10 text-green-600" />
|
||||||
<div className="flex items-center gap-3">
|
|
||||||
<div className="w-10 h-10 bg-primary rounded-lg flex items-center justify-center">
|
|
||||||
<Brain className="w-6 h-6 text-primary-foreground" />
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<h1 className="text-xl font-bold text-foreground">邏輯思維測試結果</h1>
|
|
||||||
<p className="text-sm text-muted-foreground">
|
|
||||||
完成時間：{new Date(results.completedAt).toLocaleString("zh-TW")}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="flex justify-end gap-2">
|
|
||||||
<Button
|
|
||||||
onClick={() => {
|
|
||||||
if (navigator.share) {
|
|
||||||
navigator.share({
|
|
||||||
title: '邏輯思維測試結果',
|
|
||||||
text: '查看我的邏輯思維測試結果',
|
|
||||||
url: window.location.href
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
navigator.clipboard.writeText(window.location.href)
|
|
||||||
alert('連結已複製到剪貼簿')
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
variant="outline"
|
|
||||||
size="sm"
|
|
||||||
className="print:hidden"
|
|
||||||
>
|
|
||||||
<Share2 className="w-4 h-4 sm:mr-2" />
|
|
||||||
<span className="hidden sm:inline">分享結果</span>
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
onClick={() => window.print()}
|
|
||||||
variant="outline"
|
|
||||||
size="sm"
|
|
||||||
className="print:hidden"
|
|
||||||
>
|
|
||||||
<Printer className="w-4 h-4 sm:mr-2" />
|
|
||||||
<span className="hidden sm:inline">列印結果</span>
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<h1 className="text-2xl font-bold text-foreground mb-4">邏輯思維測試完成！</h1>
|
||||||
</header>
|
<p className="text-lg text-muted-foreground mb-6">
|
||||||
|
感謝您完成邏輯思維測試，您的答案已成功提交。
|
||||||
<div className="container mx-auto px-4 py-8">
|
</p>
|
||||||
<div className="max-w-4xl mx-auto space-y-8">
|
<p className="text-sm text-muted-foreground mb-8">
|
||||||
{/* Score Overview */}
|
完成時間：{new Date(results.completedAt).toLocaleString("zh-TW")}
|
||||||
<Card className="text-center">
|
</p>
|
||||||
<CardHeader>
|
<div className="space-y-3">
|
||||||
<div
|
<Button asChild size="lg" className="w-full">
|
||||||
className={`w-24 h-24 ${scoreLevel.color} rounded-full flex items-center justify-center mx-auto mb-4`}
|
<Link href="/home">
|
||||||
>
|
|
||||||
<span className="text-3xl font-bold text-white">{results.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">{results.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">{results.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">
|
|
||||||
{Math.round((results.correctAnswers / results.totalQuestions) * 100)}%
|
|
||||||
</div>
|
|
||||||
<div className="text-xs text-muted-foreground">正確率</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<Progress value={results.score} className="h-3 mb-4" />
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
|
|
||||||
{/* Detailed Results */}
|
|
||||||
<Card>
|
|
||||||
<CardHeader>
|
|
||||||
<CardTitle>詳細結果</CardTitle>
|
|
||||||
</CardHeader>
|
|
||||||
<CardContent>
|
|
||||||
<div className="space-y-6">
|
|
||||||
{questions.map((question, index) => {
|
|
||||||
const userAnswer = results.answers[index]
|
|
||||||
const isCorrect = userAnswer === question.correct_answer
|
|
||||||
|
|
||||||
// 根據選項字母獲取對應的選項文字
|
|
||||||
const getOptionText = (option: string) => {
|
|
||||||
switch (option) {
|
|
||||||
case 'A': return question.option_a
|
|
||||||
case 'B': return question.option_b
|
|
||||||
case 'C': return question.option_c
|
|
||||||
case 'D': return question.option_d
|
|
||||||
case 'E': return question.option_e
|
|
||||||
default: return "未作答"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const correctOptionText = getOptionText(question.correct_answer)
|
|
||||||
const userOptionText = userAnswer ? getOptionText(userAnswer) : "未作答"
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div key={question.id} className="border rounded-lg p-3 sm:p-4">
|
|
||||||
<div className="flex items-start gap-3 mb-3">
|
|
||||||
<div className="flex-shrink-0 mt-1">
|
|
||||||
{isCorrect ? (
|
|
||||||
<CheckCircle className="w-4 h-4 sm:w-5 sm:h-5 text-green-500" />
|
|
||||||
) : (
|
|
||||||
<XCircle className="w-4 h-4 sm:w-5 sm:h-5 text-red-500" />
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
<div className="flex-1 min-w-0">
|
|
||||||
<h3 className="font-medium mb-2 text-sm sm:text-base text-balance">
|
|
||||||
第{index + 1}題：{question.question}
|
|
||||||
</h3>
|
|
||||||
<div className="space-y-2 text-xs sm:text-sm">
|
|
||||||
<div className="flex flex-col sm:flex-row sm:items-center gap-1 sm:gap-2">
|
|
||||||
<span className="text-muted-foreground text-xs">你的答案：</span>
|
|
||||||
<Badge variant={isCorrect ? "default" : "destructive"} className="text-xs w-fit">
|
|
||||||
{userAnswer ? `${userAnswer}. ${userOptionText}` : "未作答"}
|
|
||||||
</Badge>
|
|
||||||
</div>
|
|
||||||
{!isCorrect && (
|
|
||||||
<div className="flex flex-col sm:flex-row sm:items-center gap-1 sm:gap-2">
|
|
||||||
<span className="text-muted-foreground text-xs">正確答案：</span>
|
|
||||||
<Badge variant="outline" className="border-green-500 text-green-700 text-xs w-fit">
|
|
||||||
{question.correct_answer}. {correctOptionText}
|
|
||||||
</Badge>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{question.explanation && (
|
|
||||||
<div className="mt-2 p-2 sm:p-3 bg-muted/50 rounded text-xs sm:text-sm">
|
|
||||||
<strong>解析：</strong>
|
|
||||||
{question.explanation}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
|
|
||||||
{/* Actions */}
|
|
||||||
<div className="flex flex-col sm:flex-row gap-3 sm:gap-4 justify-center">
|
|
||||||
<Button asChild size="lg" className="w-full sm:w-auto">
|
|
||||||
<Link href="/">
|
|
||||||
<Home className="w-4 h-4 mr-2" />
|
<Home className="w-4 h-4 mr-2" />
|
||||||
<span>返回首頁</span>
|
返回首頁
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</Button>
|
||||||
<Button asChild variant="outline" size="lg" className="w-full sm:w-auto">
|
<Button asChild variant="outline" size="lg" className="w-full">
|
||||||
<Link href="/tests/logic">
|
<Link href="/tests/creative">
|
||||||
<RotateCcw className="w-4 h-4 mr-2" />
|
開始創意測試
|
||||||
重新測試
|
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</Button>
|
||||||
<Button asChild variant="outline" size="lg" className="w-full sm:w-auto">
|
<Button asChild variant="outline" size="lg" className="w-full">
|
||||||
<Link href="/tests/creative">開始創意測試</Link>
|
<Link href="/tests/combined">
|
||||||
|
開始綜合測試
|
||||||
|
</Link>
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</CardContent>
|
||||||
</div>
|
</Card>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user