"use client" import { useState, useEffect } from "react" import { ProtectedRoute } from "@/components/protected-route" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Button } from "@/components/ui/button" import { Progress } from "@/components/ui/progress" import { Badge } from "@/components/ui/badge" import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select" import { Brain, Lightbulb, BarChart3, ArrowLeft, TrendingUp, Users, Award, Target } from "lucide-react" import Link from "next/link" import { useAuth, type User } from "@/lib/hooks/use-auth" interface DepartmentStats { department: string totalUsers: number participatedUsers: number participationRate: number averageLogicScore: number averageCreativeScore: number averageCombinedScore: number overallAverage: number topPerformer: string | null testCounts: { logic: number creative: number combined: number } } interface TestResult { userId: string userName: string userDepartment: string type: "logic" | "creative" | "combined" score: number completedAt: string } export default function AnalyticsPage() { return ( ) } function AnalyticsContent() { const { user } = useAuth() const [departmentStats, setDepartmentStats] = useState([]) const [selectedDepartment, setSelectedDepartment] = useState("all") const [overallStats, setOverallStats] = useState({ totalUsers: 0, totalParticipants: 0, overallParticipationRate: 0, averageScore: 0, totalTests: 0, }) const departments = ["人力資源部", "資訊技術部", "財務部", "行銷部", "業務部", "研發部", "客服部", "其他"] useEffect(() => { loadAnalyticsData() }, []) const loadAnalyticsData = () => { // Load users const users: User[] = JSON.parse(localStorage.getItem("hr_users") || "[]") // Load all test results const allResults: TestResult[] = [] users.forEach((user: User) => { // Check for logic test results const logicKey = `logicTestResults_${user.id}` const logicResults = localStorage.getItem(logicKey) if (logicResults) { const data = JSON.parse(logicResults) allResults.push({ userId: user.id, userName: user.name, userDepartment: user.department, type: "logic", score: data.score, completedAt: data.completedAt, }) } // Check for creative test results const creativeKey = `creativeTestResults_${user.id}` const creativeResults = localStorage.getItem(creativeKey) if (creativeResults) { const data = JSON.parse(creativeResults) allResults.push({ userId: user.id, userName: user.name, userDepartment: user.department, type: "creative", score: data.score, completedAt: data.completedAt, }) } // Check for combined test results const combinedKey = `combinedTestResults_${user.id}` const combinedResults = localStorage.getItem(combinedKey) if (combinedResults) { const data = JSON.parse(combinedResults) allResults.push({ userId: user.id, userName: user.name, userDepartment: user.department, type: "combined", score: data.overallScore, completedAt: data.completedAt, }) } }) // Calculate department statistics const deptStats: DepartmentStats[] = departments .map((dept) => { const deptUsers = users.filter((u) => u.department === dept) const deptResults = allResults.filter((r) => r.userDepartment === dept) const participatedUsers = new Set(deptResults.map((r) => r.userId)).size // Calculate average scores by test type const logicResults = deptResults.filter((r) => r.type === "logic") const creativeResults = deptResults.filter((r) => r.type === "creative") const combinedResults = deptResults.filter((r) => r.type === "combined") const averageLogicScore = logicResults.length > 0 ? Math.round(logicResults.reduce((sum, r) => sum + r.score, 0) / logicResults.length) : 0 const averageCreativeScore = creativeResults.length > 0 ? Math.round(creativeResults.reduce((sum, r) => sum + r.score, 0) / creativeResults.length) : 0 const averageCombinedScore = combinedResults.length > 0 ? Math.round(combinedResults.reduce((sum, r) => sum + r.score, 0) / combinedResults.length) : 0 // Calculate overall average const allScores = [averageLogicScore, averageCreativeScore, averageCombinedScore].filter((s) => s > 0) const overallAverage = allScores.length > 0 ? Math.round(allScores.reduce((sum, s) => sum + s, 0) / allScores.length) : 0 // Find top performer const userScores = new Map() deptResults.forEach((result) => { if (!userScores.has(result.userId)) { userScores.set(result.userId, []) } userScores.get(result.userId)!.push(result.score) }) let topPerformer: string | null = null let topScore = 0 userScores.forEach((scores, userId) => { const avgScore = scores.reduce((sum, s) => sum + s, 0) / scores.length if (avgScore > topScore) { topScore = avgScore const user = users.find((u) => u.id === userId) topPerformer = user ? user.name : null } }) return { department: dept, totalUsers: deptUsers.length, participatedUsers, participationRate: deptUsers.length > 0 ? Math.round((participatedUsers / deptUsers.length) * 100) : 0, averageLogicScore, averageCreativeScore, averageCombinedScore, overallAverage, topPerformer, testCounts: { logic: logicResults.length, creative: creativeResults.length, combined: combinedResults.length, }, } }) .filter((stat) => stat.totalUsers > 0) // Only show departments with users setDepartmentStats(deptStats) // Calculate overall statistics const totalUsers = users.length const totalParticipants = new Set(allResults.map((r) => r.userId)).size const overallParticipationRate = totalUsers > 0 ? Math.round((totalParticipants / totalUsers) * 100) : 0 const averageScore = allResults.length > 0 ? Math.round(allResults.reduce((sum, r) => sum + r.score, 0) / allResults.length) : 0 setOverallStats({ totalUsers, totalParticipants, overallParticipationRate, averageScore, totalTests: allResults.length, }) } 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 getParticipationColor = (rate: number) => { if (rate >= 80) return "text-green-600" if (rate >= 60) return "text-blue-600" if (rate >= 40) return "text-yellow-600" return "text-red-600" } const filteredStats = selectedDepartment === "all" ? departmentStats : departmentStats.filter((stat) => stat.department === selectedDepartment) return ( {/* Header */} 返回儀表板 部門分析 查看各部門的測試結果統計和分析 {/* Overall Statistics */} {overallStats.totalUsers} 總用戶數 {overallStats.totalParticipants} 參與用戶 {overallStats.overallParticipationRate}% 參與率 {overallStats.averageScore} 平均分數 {overallStats.totalTests} 總測試次數 {/* Department Filter */} 部門篩選 所有部門 {departments.map((dept) => ( {dept} ))} {/* Department Statistics */} {filteredStats.map((stat) => ( {stat.department} {stat.participatedUsers}/{stat.totalUsers} 人參與 參與率: {stat.participationRate}% {/* Participation Rate */} 參與率 {stat.participationRate}% {/* Test Scores */} {stat.averageLogicScore || "-"} 邏輯思維 ({stat.testCounts.logic} 次) {stat.averageCreativeScore || "-"} 創意能力 ({stat.testCounts.creative} 次) {stat.averageCombinedScore || "-"} 綜合能力 ({stat.testCounts.combined} 次) {/* Overall Average */} 部門平均分數 {stat.overallAverage || "-"} {/* Top Performer */} {stat.topPerformer && ( 表現最佳 {stat.topPerformer} )} ))} {filteredStats.length === 0 && ( {selectedDepartment === "all" ? "暫無部門數據" : "該部門暫無數據"} )} ) }
查看各部門的測試結果統計和分析