'use client' import Link from 'next/link' import { signOut, useSession } from 'next-auth/react' import { ChevronDown, LogOut, Settings2, UserRound } from 'lucide-react' import { useEffect, useRef, useState } from 'react' type DepartmentAccountMenuProps = { collapsed: boolean onNavigate?: () => void } export default function DepartmentAccountMenu({ collapsed, onNavigate }: DepartmentAccountMenuProps) { const { data: session } = useSession() const [open, setOpen] = useState(false) const menuRef = useRef(null) const triggerRef = useRef(null) const userName = session?.user?.name || session?.user?.email || '当前用户' const initials = userName.slice(0, 1).toUpperCase() const canAccessMaterialAdmin = ['ADMIN', 'SYSTEM_ADMIN', 'DEPT_ADMIN'].includes(session?.user?.role ?? '') useEffect(() => { const closeMenu = (event: MouseEvent) => { if (menuRef.current && !menuRef.current.contains(event.target as Node)) setOpen(false) } const closeWithEscape = (event: KeyboardEvent) => { if (event.key !== 'Escape' || !open) return event.stopPropagation() setOpen(false) triggerRef.current?.focus() } document.addEventListener('mousedown', closeMenu) document.addEventListener('keydown', closeWithEscape) return () => { document.removeEventListener('mousedown', closeMenu) document.removeEventListener('keydown', closeWithEscape) } }, [open]) return (
{open && (
{ setOpen(false) onNavigate?.() }} className="flex min-h-11 items-center gap-3 rounded-lg px-3 text-sm font-medium hover:bg-[#f2f5f8] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#1677ff]" >
)}
) }