diff --git a/.gitattributes b/.gitattributes
new file mode 100644
index 0000000..6313b56
--- /dev/null
+++ b/.gitattributes
@@ -0,0 +1 @@
+* text=auto eol=lf
diff --git a/src/layouts/RootLayout.tsx b/src/layouts/RootLayout.tsx
index 675c642..a0c56ba 100644
--- a/src/layouts/RootLayout.tsx
+++ b/src/layouts/RootLayout.tsx
@@ -3,16 +3,11 @@ import { Layout, Menu } from 'antd';
 import { useState } from 'react';
 import { Outlet, useLocation, useNavigate } from 'react-router';
 import { routes } from '../routes';
+import { toMenuItems } from '../routes/utils';
 
 const { Header, Sider, Content } = Layout;
 
-const menuItems = routes
-  .filter((r) => !r.hideInMenu)
-  .map((r) => ({
-    key: r.path,
-    icon: r.icon,
-    label: r.label,
-  }));
+const menuItems = toMenuItems(routes);
 
 const RootLayout = () => {
   const navigate = useNavigate();
@@ -42,6 +37,7 @@ const RootLayout = () => {
           <Menu
             mode="inline"
             selectedKeys={[location.pathname]}
+            defaultOpenKeys={menuItems.map((item) => item.key)}
             items={menuItems}
             onClick={({ key }) => navigate(key)}
             style={{ height: '100%', borderRight: 0, paddingBottom: 48 }}
diff --git a/src/layouts/SystemLayout.tsx b/src/layouts/SystemLayout.tsx
new file mode 100644
index 0000000..f308459
--- /dev/null
+++ b/src/layouts/SystemLayout.tsx
@@ -0,0 +1,5 @@
+import { Outlet } from 'react-router';
+
+const SystemLayout = () => <Outlet />;
+
+export default SystemLayout;
diff --git a/src/pages/About.tsx b/src/pages/about/index.tsx
similarity index 100%
rename from src/pages/About.tsx
rename to src/pages/about/index.tsx
diff --git a/src/pages/Home.tsx b/src/pages/home/index.tsx
similarity index 100%
rename from src/pages/Home.tsx
rename to src/pages/home/index.tsx
diff --git a/src/pages/NotFound.tsx b/src/pages/not-found/index.tsx
similarity index 100%
rename from src/pages/NotFound.tsx
rename to src/pages/not-found/index.tsx
diff --git a/src/pages/system/user/index.tsx b/src/pages/system/user/index.tsx
new file mode 100644
index 0000000..673ab1f
--- /dev/null
+++ b/src/pages/system/user/index.tsx
@@ -0,0 +1,21 @@
+import { Table, Typography } from 'antd';
+
+const { Title } = Typography;
+
+const columns = [
+  { title: '用户名', dataIndex: 'username', key: 'username' },
+  { title: '姓名', dataIndex: 'name', key: 'name' },
+  { title: '邮箱', dataIndex: 'email', key: 'email' },
+  { title: '状态', dataIndex: 'status', key: 'status' },
+];
+
+const UserManagement = () => {
+  return (
+    <div style={{ padding: 24 }}>
+      <Title level={4} style={{ marginBottom: 16 }}>用户管理</Title>
+      <Table columns={columns} dataSource={[]} rowKey="username" />
+    </div>
+  );
+};
+
+export default UserManagement;
diff --git a/src/routes/index.tsx b/src/routes/index.tsx
index 02982c7..3974c8e 100644
--- a/src/routes/index.tsx
+++ b/src/routes/index.tsx
@@ -1,7 +1,9 @@
-import { HomeOutlined, InfoCircleOutlined } from '@ant-design/icons';
-import About from '../pages/About';
-import Home from '../pages/Home';
-import NotFound from '../pages/NotFound';
+import { HomeOutlined, InfoCircleOutlined, SettingOutlined, UserOutlined } from '@ant-design/icons';
+import SystemLayout from '../layouts/SystemLayout';
+import About from '../pages/about';
+import Home from '../pages/home';
+import NotFound from '../pages/not-found';
+import UserManagement from '../pages/system/user';
 import type { RouteItem } from './types';
 
 export const routes: RouteItem[] = [
@@ -17,6 +19,20 @@ export const routes: RouteItem[] = [
     icon: <InfoCircleOutlined />,
     component: <About />,
   },
+  {
+    path: '/system',
+    label: '系统配置',
+    icon: <SettingOutlined />,
+    component: <SystemLayout />,
+    children: [
+      {
+        path: '/system/user',
+        label: '用户管理',
+        icon: <UserOutlined />,
+        component: <UserManagement />,
+      },
+    ],
+  },
   {
     path: '*',
     label: '404',
diff --git a/src/routes/utils.tsx b/src/routes/utils.tsx
index c057110..3f9a94b 100644
--- a/src/routes/utils.tsx
+++ b/src/routes/utils.tsx
@@ -21,3 +21,21 @@ export function toRouteObjects(items: RouteItem[]): RouteObject[] {
     return route;
   });
 }
+
+type MenuItem = {
+  key: string;
+  icon?: React.ReactNode;
+  label: string;
+  children?: MenuItem[];
+};
+
+export function toMenuItems(items: RouteItem[]): MenuItem[] {
+  return items
+    .filter((r) => !r.hideInMenu)
+    .map((r) => ({
+      key: r.path,
+      icon: r.icon,
+      label: r.label,
+      children: r.children ? toMenuItems(r.children) : undefined,
+    }));
+}