fix: patch P0 security vulnerabilities and critical UX issues across 6 modules

Security: Add admin/layout.tsx auth guard; Add requirePermission() to 12 admin pages

Dashboard: Fix StudentStatsGrid rendering; Fix teacher greeting; Add loading/error boundaries; Fix col-span; Add metadata

Announcements: Fix audience filtering; Add user detail page; Trigger notifications on publish; Pass classes data; Add loading.tsx

Messages: Implement soft delete; Add unread badge with polling; Add notification dropdown polling; Add keyword search; Add quiet hours DND

Management: Add loading/error for 9 admin routes; Fix admin-classes-view to use Select for school/grade

Profile/Settings: Add loading/error; Fix parent role routing; Create ParentSettingsView; Integrate AiProviderSettingsCard; Add Tab URL persistence; Add logout confirm; Add avatar; Fix Progress arbitrary class

Schema: Add senderDeletedAt/receiverDeletedAt to messages; Add quietHours to notificationPreferences; Add uniqueIndex import

Docs: Update architecture docs 004/005
This commit is contained in:
SpecialX
2026-06-22 13:57:31 +08:00
parent 5ff7ab9e72
commit a4d096a6fc
81 changed files with 2145 additions and 124 deletions

View File

@@ -1,19 +1,34 @@
"use client"
import Link from "next/link"
import type { ReactNode } from "react"
import { User, Palette, Lock, Bell } from "lucide-react"
import { useRouter, useSearchParams } from "next/navigation"
import { Suspense, type ReactNode } from "react"
import { User, Palette, Lock, Bell, Sparkles } from "lucide-react"
import { signOut } from "next-auth/react"
import { ThemePreferencesCard } from "@/modules/settings/components/theme-preferences-card"
import { ProfileSettingsForm } from "@/modules/settings/components/profile-settings-form"
import { PasswordChangeForm } from "@/modules/settings/components/password-change-form"
import { NotificationPreferencesForm } from "@/modules/settings/components/notification-preferences-form"
import { AiProviderSettingsCard } from "@/modules/settings/components/ai-provider-settings-card"
import { Button } from "@/shared/components/ui/button"
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/shared/components/ui/card"
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/shared/components/ui/tabs"
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
AlertDialogTrigger,
} from "@/shared/components/ui/alert-dialog"
import { UserProfile } from "@/modules/users/data-access"
import type { NotificationPreferences } from "@/modules/notifications/types"
import { usePermission } from "@/shared/hooks/use-permission"
import { Permissions } from "@/shared/types/permissions"
interface SettingsViewProps {
/** 页面副标题描述 */
@@ -28,24 +43,52 @@ interface SettingsViewProps {
generalExtra?: ReactNode
}
const VALID_TABS = ["general", "notifications", "appearance", "security", "ai"] as const
type TabValue = (typeof VALID_TABS)[number]
function isTabValue(value: string | null): value is TabValue {
return value !== null && (VALID_TABS as readonly string[]).includes(value)
}
/**
* 统一设置页视图
*
* 消除 admin / teacher / student 个设置视图的重复布局:
* 消除 admin / teacher / student / parent 四个设置视图的重复布局:
* - 相同的页面头部(标题 + 描述 + 返回按钮)
* - 相同的 4 个标签页General / Notifications / Appearance / Security
* - 相同的标签页General / Notifications / Appearance / Security / AI
* - 相同的 Notifications / Appearance / Security 标签页内容
* - 相同的 Session 卡片(登出)
*
* 角色差异通过 `description`、`backHref` 和 `generalExtra` 三个 props 注入。
* 当前激活的标签页通过 URL `?tab=` 参数持久化。
*/
export function SettingsView({
function SettingsViewInner({
description,
backHref,
user,
notificationPreferences,
generalExtra,
}: SettingsViewProps) {
const router = useRouter()
const searchParams = useSearchParams()
const { hasPermission } = usePermission()
const tabParam = searchParams.get("tab")
const activeTab: TabValue = isTabValue(tabParam) ? tabParam : "general"
const handleTabChange = (value: string) => {
const params = new URLSearchParams(searchParams.toString())
if (value === "general") {
params.delete("tab")
} else {
params.set("tab", value)
}
const query = params.toString()
router.push(query ? `?${query}` : "?", { scroll: false })
}
const canConfigureAi = hasPermission(Permissions.AI_CONFIGURE)
return (
<div className="flex h-full flex-col gap-8 p-8">
<div className="flex flex-col justify-between gap-4 md:flex-row md:items-center">
@@ -60,7 +103,7 @@ export function SettingsView({
</div>
</div>
<Tabs defaultValue="general" className="w-full">
<Tabs value={activeTab} onValueChange={handleTabChange} className="w-full">
<TabsList className="w-full justify-start">
<TabsTrigger value="general" className="gap-2">
<User className="h-4 w-4" />
@@ -78,6 +121,12 @@ export function SettingsView({
<Lock className="h-4 w-4" />
Security
</TabsTrigger>
{canConfigureAi ? (
<TabsTrigger value="ai" className="gap-2">
<Sparkles className="h-4 w-4" />
AI
</TabsTrigger>
) : null}
</TabsList>
<TabsContent value="general" className="mt-6 space-y-6">
@@ -105,13 +154,43 @@ export function SettingsView({
<div className="text-sm font-medium">Sign out</div>
<div className="text-sm text-muted-foreground">Return to the login screen.</div>
</div>
<Button variant="outline" onClick={() => signOut({ callbackUrl: "/login" })}>
Log out
</Button>
<AlertDialog>
<AlertDialogTrigger asChild>
<Button variant="outline">Log out</Button>
</AlertDialogTrigger>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Confirm sign out</AlertDialogTitle>
<AlertDialogDescription>
Are you sure you want to sign out? You will be returned to the login screen.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>Cancel</AlertDialogCancel>
<AlertDialogAction onClick={() => signOut({ callbackUrl: "/login" })}>
Sign out
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</CardContent>
</Card>
</TabsContent>
{canConfigureAi ? (
<TabsContent value="ai" className="mt-6 space-y-6">
<AiProviderSettingsCard />
</TabsContent>
) : null}
</Tabs>
</div>
)
}
export function SettingsView(props: SettingsViewProps) {
return (
<Suspense fallback={null}>
<SettingsViewInner {...props} />
</Suspense>
)
}