diff --git a/Merge/front/src/components/SuperAdmin.js b/Merge/front/src/components/SuperAdmin.js
new file mode 100644
index 0000000..817b708
--- /dev/null
+++ b/Merge/front/src/components/SuperAdmin.js
@@ -0,0 +1,64 @@
+import React, { useState, useEffect } from 'react';
+import { NavLink, Outlet } from 'react-router-dom';
+import { Spin } from 'antd';
+import { fetchUserList } from '../api/posts';
+import '../style/SuperAdmin.css';
+
+export default function SuperAdmin() {
+  const SUPERADMIN_USER_ID = 3;
+  const [loading, setLoading] = useState(true);
+  const [hasPermission, setHasPermission] = useState(true);
+
+  useEffect(() => {
+    async function check() {
+      try {
+        await fetchUserList(SUPERADMIN_USER_ID);
+      } catch (e) {
+        if (e.message === 'Unauthorized') {
+          setHasPermission(false);
+        } else {
+          console.error(e);
+        }
+      } finally {
+        setLoading(false);
+      }
+    }
+    check();
+  }, []);
+
+  if (loading) return <Spin spinning tip="加载中…" style={{ width: '100%', marginTop: 100 }} />;
+  if (!hasPermission) return <div style={{ textAlign: 'center', marginTop: 100 }}>权限不足</div>;
+
+  return (
+    <div className="super-admin-container">
+      <aside className="super-admin-sidebar">
+        <h2>超级管理员</h2>
+        <nav>
+          <ul>
+            <li>
+              <NavLink 
+                to="users" 
+                end 
+                className={({ isActive }) => isActive ? 'active' : ''}
+              >
+                用户管理
+              </NavLink>
+            </li>
+            <li>
+              <NavLink 
+                to="dashboard" 
+                className={({ isActive }) => isActive ? 'active' : ''}
+              >
+                平台运行监控
+              </NavLink>
+            </li>
+          </ul>
+        </nav>
+      </aside>
+
+      <main className="super-admin-content">
+        <Outlet />
+      </main>
+    </div>
+  );
+}
\ No newline at end of file