xinghen.work/src/pages/admin/AdminLayout.tsx

import {
  BookOpen,
  Clock3,
  LayoutDashboard,
  LogOut,
  Megaphone,
  ShieldCheck,
  Users
} from 'lucide-react'
import { NavLink, Navigate, Outlet, useNavigate } from 'react-router-dom'
import { Brand } from '../../components/Brand'
import { Footer } from '../../components/Footer'
import { useAuth } from '../../AuthContext'

export function AdminLayout() {
  const { user, loading, logout } = useAuth()
  const navigate = useNavigate()

  if (loading) return <div className="center-loading">正在加载管理后台…</div>

  // 未登录或非管理员，统一拦截跳转至管理员专属登录页 /admin/login
  if (!user || user.role !== 'ADMIN') {
    return <Navigate to="/admin/login" replace />
  }

  const handleAdminLogout = async () => {
    await logout()
    navigate('/admin/login', { replace: true })
  }

  return (
    <div className="admin-shell">
      <header className="admin-topbar">
        <div className="admin-brand-wrap">
          <NavLink to="/admin" className="logo-link">
            <Brand />
          </NavLink>
          <div className="admin-badge">
            <ShieldCheck size={14} />
            <span>管理后台</span>
          </div>
        </div>

        <nav className="admin-nav admin-nav-grouped" aria-label="平台管理">
          <NavLink to="/admin" end className={({ isActive }) => (isActive ? 'active' : '')}><LayoutDashboard size={16} /><span>待办概览</span></NavLink>
          <details className="admin-nav-group"><summary><Clock3 size={16} />课程制作</summary><div>
            <NavLink to="/admin/production-queue">制作队列</NavLink>
            <NavLink to="/admin/courses"><BookOpen size={15} />全部课程</NavLink>
            <NavLink to="/admin/digital-instructors">数字讲师</NavLink>
          </div></details>
          <details className="admin-nav-group"><summary><Users size={16} />人员与组织</summary><div>
            <NavLink to="/admin/users">用户管理</NavLink>
            <NavLink to="/admin/organizations">组织管理</NavLink>
          </div></details>
          <details className="admin-nav-group"><summary><Megaphone size={16} />运营</summary><div>
            <NavLink to="/admin/leads">落地页线索</NavLink>
          </div></details>
        </nav>

        <div className="admin-top-actions">
          <div className="admin-user-info">
            <strong>{user.contactName || '系统管理员'}</strong>
            <small>{user.phone}</small>
          </div>
          <button className="icon-button" title="退出管理员登录" onClick={handleAdminLogout}>
            <LogOut size={18} />
          </button>
        </div>
      </header>

      <main className="admin-main">
        <Outlet />
      </main>
      <Footer />
    </div>
  )
}