refactor(dashboard): simplify student navigation

This commit is contained in:
cfngc4594 2026-05-29 11:55:56 +08:00
parent be8f3ee945
commit 705e0f29e4
4 changed files with 23 additions and 170 deletions

View File

@ -16,13 +16,6 @@ interface LayoutProps {
children: React.ReactNode; children: React.ReactNode;
} }
interface WrongProblem {
id: string;
name: string;
status: string;
url?: string;
}
export default async function Layout({ children }: LayoutProps) { export default async function Layout({ children }: LayoutProps) {
const session = await auth(); const session = await auth();
const user = session?.user; const user = session?.user;
@ -49,57 +42,14 @@ export default async function Layout({ children }: LayoutProps) {
return <TeacherSidebar user={user} />; return <TeacherSidebar user={user} />;
case "STUDENT": case "STUDENT":
default: default:
// 学生STUDENT需要查询错题数据 return <AppSidebar user={user} />;
return <AppSidebar user={user} wrongProblems={[]} />;
} }
}; };
// 只有学生才需要查询错题数据
let wrongProblemsData: WrongProblem[] = [];
if (fullUser.role === "STUDENT") {
// 查询未完成未AC题目的最新一次提交
const wrongProblems = await prisma.problem.findMany({
where: {
submissions: {
some: { userId: user.id },
},
NOT: {
submissions: {
some: { userId: user.id, status: "AC" },
},
},
},
select: {
id: true,
displayId: true,
localizations: {
where: { locale: "zh", type: "TITLE" },
select: { content: true },
},
submissions: {
where: { userId: user.id },
orderBy: { createdAt: "desc" },
take: 1,
select: {
status: true,
},
},
},
});
// 组装传递给 AppSidebar 的数据格式
wrongProblemsData = wrongProblems.map((p) => ({
id: p.id,
name: p.localizations[0]?.content || `题目${p.displayId}`,
status: p.submissions[0]?.status || "-",
url: `/problems/${p.id}`,
}));
}
return ( return (
<SidebarProvider> <SidebarProvider>
{fullUser.role === "STUDENT" ? ( {fullUser.role === "STUDENT" ? (
<AppSidebar user={user} wrongProblems={wrongProblemsData} /> <AppSidebar user={user} />
) : ( ) : (
renderSidebar() renderSidebar()
)} )}

View File

@ -3,14 +3,10 @@ import {
BookOpen, BookOpen,
CheckCircle, CheckCircle,
Clock, Clock,
TrendingUp,
AlertCircle, AlertCircle,
BarChart3,
Target, Target,
Activity, Activity,
GraduationCapIcon,
} from "lucide-react"; } from "lucide-react";
import Link from "next/link";
import { import {
Card, Card,
CardContent, CardContent,
@ -22,7 +18,6 @@ import prisma from "@/lib/prisma";
import { auth } from "@/lib/auth"; import { auth } from "@/lib/auth";
import { redirect } from "next/navigation"; import { redirect } from "next/navigation";
import { Badge } from "@/components/ui/badge"; import { Badge } from "@/components/ui/badge";
import { Button } from "@/components/ui/button";
import { Progress } from "@/components/ui/progress"; import { Progress } from "@/components/ui/progress";
interface Stats { interface Stats {
@ -206,28 +201,6 @@ export default async function DashboardPage() {
color: "text-purple-600", color: "text-purple-600",
}, },
], ],
actions: [
{
label: "管理员管理",
href: "/dashboard/management",
icon: Target,
},
{
label: "学生管理",
href: "/dashboard/usermanagement/student",
icon: Users,
},
{
label: "教师管理",
href: "/dashboard/usermanagement/teacher",
icon: GraduationCapIcon,
},
{
label: "题目管理",
href: "/dashboard/usermanagement/problem",
icon: BookOpen,
},
],
}; };
case "TEACHER": case "TEACHER":
return { return {
@ -253,28 +226,6 @@ export default async function DashboardPage() {
color: "text-purple-600", color: "text-purple-600",
}, },
], ],
actions: [
{
label: "学生管理",
href: "/dashboard/usermanagement/student",
icon: Users,
},
{
label: "题目管理",
href: "/dashboard/usermanagement/problem",
icon: BookOpen,
},
{
label: "完成情况",
href: "/dashboard/teacher/dashboard",
icon: BarChart3,
},
{
label: "课程管理",
href: "/dashboard/teacher/courses",
icon: BookOpen,
},
],
}; };
default: default:
return { return {
@ -300,20 +251,6 @@ export default async function DashboardPage() {
color: "text-purple-600", color: "text-purple-600",
}, },
], ],
actions: [
{
label: "我的进度",
href: "/dashboard/student/dashboard",
icon: TrendingUp,
},
{
label: "我的课程",
href: "/dashboard/student/courses",
icon: GraduationCapIcon,
},
{ label: "开始做题", href: "/problemset", icon: BookOpen },
{ label: "个人设置", href: "/dashboard/management", icon: Target },
],
}; };
} }
}; };
@ -379,26 +316,6 @@ export default async function DashboardPage() {
</Card> </Card>
)} )}
{/* 快速操作 */}
<Card>
<CardHeader>
<CardTitle></CardTitle>
<CardDescription>访</CardDescription>
</CardHeader>
<CardContent>
<div className="grid gap-4 md:grid-cols-4">
{config.actions.map((action, index) => (
<Link key={index} href={action.href}>
<Button variant="outline" className="w-full justify-start">
<action.icon className="mr-2 h-4 w-4" />
{action.label}
</Button>
</Link>
))}
</div>
</CardContent>
</Card>
{/* 最近活动 */} {/* 最近活动 */}
<Card> <Card>
<CardHeader> <CardHeader>

View File

@ -10,15 +10,17 @@ import {
DropdownMenu, DropdownMenu,
DropdownMenuContent, DropdownMenuContent,
DropdownMenuGroup, DropdownMenuGroup,
DropdownMenuItem,
DropdownMenuLabel, DropdownMenuLabel,
DropdownMenuSeparator, DropdownMenuSeparator,
DropdownMenuTrigger, DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"; } from "@/components/ui/dropdown-menu";
import { signOut } from "next-auth/react"; import { signOut } from "next-auth/react";
import { useRouter } from "next/navigation"; import { useTranslations } from "next-intl";
import { BadgeCheck, ChevronsUpDown, UserPen, LogOut } from "lucide-react"; import { ChevronsUpDown, LogOut } from "lucide-react";
import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"; import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
import { SettingsButton } from "@/components/settings-button";
import { DashboardButton } from "@/components/dashboard-button";
import { DropdownMenuItem } from "@/components/ui/dropdown-menu";
export function NavUser({ export function NavUser({
user, user,
@ -30,7 +32,8 @@ export function NavUser({
}; };
}) { }) {
const { isMobile } = useSidebar(); const { isMobile } = useSidebar();
const router = useRouter(); const t = useTranslations("UserAvatar");
const avatarFallback = user.name?.charAt(0) || user.email?.charAt(0) || "U";
async function handleLogout() { async function handleLogout() {
await signOut({ await signOut({
@ -39,14 +42,6 @@ export function NavUser({
}); });
} }
function handleAccount() {
if (user && user.email) {
router.replace("/dashboard/management");
} else {
router.replace("/sign-in");
}
}
return ( return (
<SidebarMenu> <SidebarMenu>
<SidebarMenuItem> <SidebarMenuItem>
@ -58,7 +53,9 @@ export function NavUser({
> >
<Avatar className="h-8 w-8 rounded-lg"> <Avatar className="h-8 w-8 rounded-lg">
<AvatarImage src={user.avatar} alt={user.name} /> <AvatarImage src={user.avatar} alt={user.name} />
<AvatarFallback className="rounded-lg">CN</AvatarFallback> <AvatarFallback className="rounded-lg">
{avatarFallback}
</AvatarFallback>
</Avatar> </Avatar>
<div className="grid flex-1 text-left text-sm leading-tight"> <div className="grid flex-1 text-left text-sm leading-tight">
<span className="truncate font-semibold">{user.name}</span> <span className="truncate font-semibold">{user.name}</span>
@ -77,7 +74,9 @@ export function NavUser({
<div className="flex items-center gap-2 px-1 py-1.5 text-left text-sm"> <div className="flex items-center gap-2 px-1 py-1.5 text-left text-sm">
<Avatar className="h-8 w-8 rounded-lg"> <Avatar className="h-8 w-8 rounded-lg">
<AvatarImage src={user.avatar} alt={user.name} /> <AvatarImage src={user.avatar} alt={user.name} />
<AvatarFallback className="rounded-lg">CN</AvatarFallback> <AvatarFallback className="rounded-lg">
{avatarFallback}
</AvatarFallback>
</Avatar> </Avatar>
<div className="grid flex-1 text-left text-sm leading-tight"> <div className="grid flex-1 text-left text-sm leading-tight">
<span className="truncate font-semibold">{user.name}</span> <span className="truncate font-semibold">{user.name}</span>
@ -87,19 +86,13 @@ export function NavUser({
</DropdownMenuLabel> </DropdownMenuLabel>
<DropdownMenuSeparator /> <DropdownMenuSeparator />
<DropdownMenuGroup> <DropdownMenuGroup>
<DropdownMenuItem onClick={handleAccount}> <DashboardButton />
<BadgeCheck /> <SettingsButton />
</DropdownMenuItem>
<DropdownMenuItem onClick={() => router.push("/sign-in")}>
<UserPen />
</DropdownMenuItem>
</DropdownMenuGroup> </DropdownMenuGroup>
<DropdownMenuSeparator /> <DropdownMenuSeparator />
<DropdownMenuItem onClick={handleLogout}> <DropdownMenuItem onClick={handleLogout}>
<LogOut /> <LogOut />
{t("LogOut")}
</DropdownMenuItem> </DropdownMenuItem>
</DropdownMenuContent> </DropdownMenuContent>
</DropdownMenu> </DropdownMenu>

View File

@ -14,7 +14,6 @@ import { User } from "next-auth";
import { siteConfig } from "@/config/site"; import { siteConfig } from "@/config/site";
import { NavMain } from "@/components/nav-main"; import { NavMain } from "@/components/nav-main";
import { NavUser } from "@/components/nav-user"; import { NavUser } from "@/components/nav-user";
import { NavProjects } from "@/components/nav-projects";
import { NavSecondary } from "@/components/nav-secondary"; import { NavSecondary } from "@/components/nav-secondary";
import { Command, LifeBuoy, Send, Shield } from "lucide-react"; import { Command, LifeBuoy, Send, Shield } from "lucide-react";
import { useTranslations } from "next-intl"; import { useTranslations } from "next-intl";
@ -27,10 +26,6 @@ const data = {
icon: Shield, icon: Shield,
isActive: true, isActive: true,
items: [ items: [
{
title: "我的进度",
url: "/dashboard/student/dashboard",
},
{ {
title: "开始做题", title: "开始做题",
url: "/problemset", url: "/problemset",
@ -39,6 +34,10 @@ const data = {
title: "我的课程", title: "我的课程",
url: "/dashboard/student/courses", url: "/dashboard/student/courses",
}, },
{
title: "我的进度",
url: "/dashboard/student/dashboard",
},
{ {
title: "个人设置", title: "个人设置",
url: "/dashboard/management", url: "/dashboard/management",
@ -93,14 +92,9 @@ const data = {
interface AppSidebarProps { interface AppSidebarProps {
user: User; user: User;
wrongProblems: {
id: string;
name: string;
status: string;
}[];
} }
export function AppSidebar({ user, wrongProblems, ...props }: AppSidebarProps) { export function AppSidebar({ user, ...props }: AppSidebarProps) {
const t = useTranslations("Sidebar"); const t = useTranslations("Sidebar");
const userInfo = { const userInfo = {
name: user.name ?? "", name: user.name ?? "",
@ -129,7 +123,6 @@ export function AppSidebar({ user, wrongProblems, ...props }: AppSidebarProps) {
</SidebarHeader> </SidebarHeader>
<SidebarContent> <SidebarContent>
<NavMain items={data.navMain} /> <NavMain items={data.navMain} />
<NavProjects projects={wrongProblems} />
<NavSecondary items={data.navSecondary} className="mt-auto" /> <NavSecondary items={data.navSecondary} className="mt-auto" />
</SidebarContent> </SidebarContent>
<SidebarFooter> <SidebarFooter>