mirror of
https://github.com/cfngc4594/monaco-editor-lsp-next.git
synced 2026-05-31 10:18:52 +00:00
refactor(dashboard): simplify student navigation
This commit is contained in:
parent
be8f3ee945
commit
705e0f29e4
@ -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()
|
||||||
)}
|
)}
|
||||||
|
|||||||
@ -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>
|
||||||
|
|||||||
@ -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>
|
||||||
|
|||||||
@ -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>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user