Admin SystemAdmin Layout

管理后台布局

ShipAny 内置了一个管理后台布局。

你可以根据自己的需求，开发自己的管理后台系统。

添加管理后台布局

你可以在任何路径下实现一个新的管理后台布局，只需要 import 内置的 DashboardLayout 组件。传递侧边栏 sidebar 数据即可。

参考系统内置的 admin 系统布局逻辑：

app/[locale]/(admin)/layout.tsx
import DashboardLayout from "@/components/dashboard/layout";
import { ReactNode } from "react";
import { Sidebar } from "@/types/blocks/sidebar";
import { getUserInfo } from "@/services/user";
import { redirect } from "next/navigation";
 
export default async function AdminLayout({
  children,
}: {
  children: ReactNode;
}) {
  const userInfo = await getUserInfo();
  if (!userInfo || !userInfo.email) {
    redirect("/auth/signin");
  }
 
  const adminEmails = process.env.ADMIN_EMAILS?.split(",");
  if (!adminEmails?.includes(userInfo?.email)) {
    return (
      <div className="w-screen h-screen flex items-center justify-center">
        No access
      </div>
    );
  }
 
  const sidebar: Sidebar = {
    brand: {
      title: "ShipAny",
      logo: {
        src: "/logo.png",
        alt: "ShipAny",
      },
    },
    nav: {
      items: [
        {
          title: "Users",
          url: "/admin/users",
          icon: "RiUserLine",
        },
        {
          title: "Orders",
          icon: "RiOrderPlayLine",
          is_expand: true,
          children: [
            {
              title: "Paid Orders",
              url: "/admin/paid-orders",
            },
          ],
        },
      ],
    },
    social: {
      items: [
        {
          title: "Home",
          url: "/",
          target: "_blank",
          icon: "RiHomeLine",
        },
        {
          title: "Github",
          url: "https://github.com/shipanyai/shipany-template-one",
          target: "_blank",
          icon: "RiGithubLine",
        },
        {
          title: "Discord",
          url: "https://discord.gg/HQNnrzjZQS",
          target: "_blank",
          icon: "RiDiscordLine",
        },
        {
          title: "X",
          url: "https://x.com/shipanyai",
          target: "_blank",
          icon: "RiTwitterLine",
        },
      ],
    },
  };
 
  return <DashboardLayout sidebar={sidebar}>{children}</DashboardLayout>;
}
Admin ConfigAdd Table