feat: split settings management pages

app/(app)/app/loading.tsx

@@ -0,0 +1,7 @@
+export default function AppLoading(): React.ReactElement {
+  return (
+    <div className="fixed inset-x-0 top-0 z-50 h-1 overflow-hidden bg-secondary">
+      <div className="loading-progress h-full bg-primary" />
+    </div>
+  );
+}

app/(app)/app/settings/audit/page.tsx

@@ -0,0 +1,100 @@
+import { redirect } from "next/navigation";
+
+import { Badge } from "@/components/ui/badge";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { getCurrentAuthContext } from "@/modules/core/server/auth";
+import { hasPermission } from "@/modules/core/server/permissions";
+import { readData } from "@/modules/core/server/store";
+import { TableToolbar } from "@/modules/settings/components/TableToolbar";
+import { getPage, getPageCount, getSearchParam, paginate, type SearchParams } from "@/modules/settings/lib/pagination";
+
+type AuditPageProps = {
+  searchParams?: Promise<SearchParams>;
+};
+
+export default async function AuditPage({ searchParams }: AuditPageProps): Promise<React.ReactElement> {
+  const context = await getCurrentAuthContext();
+  if (!context) {
+    redirect("/login");
+  }
+
+  if (!hasPermission(context.permissions, "audit:read")) {
+    redirect("/app/dashboard");
+  }
+
+  const params = (await searchParams) ?? {};
+  const query = getSearchParam(params, "q");
+  const page = getPage(params);
+  const data = await readData();
+  const normalizedQuery = query.trim().toLowerCase();
+  const filteredLogs = data.auditLogs.filter((log) =>
+    [log.actorEmail ?? "系统", log.action, log.targetType, log.targetId ?? "", log.result, log.reason]
+      .join(" ")
+      .toLowerCase()
+      .includes(normalizedQuery),
+  );
+  const pageCount = getPageCount(filteredLogs.length);
+  const visibleLogs = paginate(filteredLogs, page);
+
+  return (
+    <div className="flex flex-col gap-5">
+      <section>
+        <Badge variant="success">Audit</Badge>
+        <h2 className="mt-3 text-xl font-semibold">审计日志</h2>
+        <p className="mt-1 text-sm text-muted-foreground">关键操作、拒绝访问和故障处理留痕。</p>
+      </section>
+
+      <Card>
+        <CardHeader>
+          <CardTitle>审计列表</CardTitle>
+        </CardHeader>
+        <CardContent className="p-0">
+          <TableToolbar
+            page={Math.min(page, pageCount)}
+            pageCount={pageCount}
+            pathname="/app/settings/audit"
+            query={query}
+            searchPlaceholder="搜索操作者、动作、对象、结果"
+            total={filteredLogs.length}
+          />
+          <div className="overflow-x-auto">
+            <table className="w-full min-w-[900px] text-sm">
+              <thead className="bg-secondary text-left text-xs text-muted-foreground">
+                <tr>
+                  <th className="px-4 py-3 font-medium">时间</th>
+                  <th className="px-4 py-3 font-medium">操作者</th>
+                  <th className="px-4 py-3 font-medium">动作</th>
+                  <th className="px-4 py-3 font-medium">对象</th>
+                  <th className="px-4 py-3 font-medium">结果</th>
+                  <th className="px-4 py-3 font-medium">原因</th>
+                </tr>
+              </thead>
+              <tbody className="divide-y bg-card">
+                {visibleLogs.map((log) => (
+                  <tr className="table-row-enter hover:bg-secondary/45" key={log.id}>
+                    <td className="px-4 py-3 text-muted-foreground">{new Date(log.timestamp).toLocaleString("zh-CN")}</td>
+                    <td className="px-4 py-3">{log.actorEmail ?? "系统"}</td>
+                    <td className="px-4 py-3">{log.action}</td>
+                    <td className="px-4 py-3 text-muted-foreground">
+                      {log.targetType}
+                      {log.targetId ? ` / ${log.targetId.slice(0, 8)}` : ""}
+                    </td>
+                    <td className="px-4 py-3">{log.result}</td>
+                    <td className="px-4 py-3 text-muted-foreground">{log.reason}</td>
+                  </tr>
+                ))}
+                {visibleLogs.length === 0 ? (
+                  <tr>
+                    <td className="px-4 py-8 text-center text-muted-foreground" colSpan={6}>
+                      暂无匹配审计
+                    </td>
+                  </tr>
+                ) : null}
+              </tbody>
+            </table>
+          </div>
+        </CardContent>
+      </Card>
+    </div>
+  );
+}

app/(app)/app/settings/layout.tsx

@@ -0,0 +1,37 @@
+import Link from "next/link";
+import { Activity, Building2, ListChecks, Settings, Users } from "lucide-react";
+
+const settingsNavItems = [
+  { href: "/app/settings/users", label: "用户管理", icon: Users },
+  { href: "/app/settings/organizations", label: "机构管理", icon: Building2 },
+  { href: "/app/settings/roles", label: "角色权限", icon: Settings },
+  { href: "/app/settings/audit", label: "审计日志", icon: ListChecks },
+  { href: "/app/settings/status", label: "运行状态", icon: Activity },
+];
+
+type SettingsLayoutProps = {
+  children: React.ReactNode;
+};
+
+export default function SettingsLayout({ children }: SettingsLayoutProps): React.ReactElement {
+  return (
+    <div className="mx-auto flex w-full max-w-7xl flex-col gap-5">
+      <section className="border-b pb-4">
+        <h1 className="text-2xl font-semibold tracking-normal">系统设置</h1>
+        <nav className="mt-4 flex gap-2 overflow-x-auto" aria-label="系统设置导航">
+          {settingsNavItems.map((item) => (
+            <Link
+              className="inline-flex min-h-10 shrink-0 items-center gap-2 rounded-md border bg-card px-3 text-sm font-medium transition-colors hover:bg-secondary"
+              href={item.href}
+              key={item.href}
+            >
+              <item.icon className="size-4 text-muted-foreground" aria-hidden="true" />
+              {item.label}
+            </Link>
+          ))}
+        </nav>
+      </section>
+      {children}
+    </div>
+  );
+}

app/(app)/app/settings/organizations/page.tsx

@@ -0,0 +1,102 @@
+import { redirect } from "next/navigation";
+
+import { Badge } from "@/components/ui/badge";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { getCurrentAuthContext } from "@/modules/core/server/auth";
+import { hasPermission } from "@/modules/core/server/permissions";
+import { readData } from "@/modules/core/server/store";
+import {
+  OrganizationManagementClient,
+  OrganizationRowActions,
+} from "@/modules/settings/components/OrganizationManagementClient";
+import { TableToolbar } from "@/modules/settings/components/TableToolbar";
+import { getPage, getPageCount, getSearchParam, paginate, type SearchParams } from "@/modules/settings/lib/pagination";
+
+type OrganizationsPageProps = {
+  searchParams?: Promise<SearchParams>;
+};
+
+export default async function OrganizationsPage({ searchParams }: OrganizationsPageProps): Promise<React.ReactElement> {
+  const context = await getCurrentAuthContext();
+  if (!context) {
+    redirect("/login");
+  }
+
+  if (!hasPermission(context.permissions, "organization:read")) {
+    redirect("/app/dashboard");
+  }
+
+  const params = (await searchParams) ?? {};
+  const query = getSearchParam(params, "q");
+  const page = getPage(params);
+  const data = await readData();
+  const normalizedQuery = query.trim().toLowerCase();
+  const filteredOrganizations = data.organizations.filter((organization) =>
+    [organization.name, organization.slug, organization.status].join(" ").toLowerCase().includes(normalizedQuery),
+  );
+  const pageCount = getPageCount(filteredOrganizations.length);
+  const visibleOrganizations = paginate(filteredOrganizations, page);
+
+  return (
+    <div className="flex flex-col gap-5">
+      <section>
+        <Badge variant="success">Organizations</Badge>
+        <h2 className="mt-3 text-xl font-semibold">机构管理</h2>
+        <p className="mt-1 text-sm text-muted-foreground">多机构租户、启停状态和机构角色初始化。</p>
+      </section>
+
+      {hasPermission(context.permissions, "organization:manage") ? <OrganizationManagementClient /> : null}
+
+      <Card>
+        <CardHeader>
+          <CardTitle>机构列表</CardTitle>
+        </CardHeader>
+        <CardContent className="p-0">
+          <TableToolbar
+            page={Math.min(page, pageCount)}
+            pageCount={pageCount}
+            pathname="/app/settings/organizations"
+            query={query}
+            searchPlaceholder="搜索机构名称、标识、状态"
+            total={filteredOrganizations.length}
+          />
+          <div className="overflow-x-auto">
+            <table className="w-full min-w-[820px] text-sm">
+              <thead className="bg-secondary text-left text-xs text-muted-foreground">
+                <tr>
+                  <th className="px-4 py-3 font-medium">机构</th>
+                  <th className="px-4 py-3 font-medium">Slug</th>
+                  <th className="px-4 py-3 font-medium">状态</th>
+                  <th className="px-4 py-3 text-right font-medium">创建时间</th>
+                  <th className="px-4 py-3 text-right font-medium">操作</th>
+                </tr>
+              </thead>
+              <tbody className="divide-y bg-card">
+                {visibleOrganizations.map((organization) => (
+                  <tr className="table-row-enter hover:bg-secondary/45" key={organization.id}>
+                    <td className="px-4 py-3 font-medium">{organization.name}</td>
+                    <td className="px-4 py-3 text-muted-foreground">{organization.slug}</td>
+                    <td className="px-4 py-3">{organization.status === "active" ? "启用" : "停用"}</td>
+                    <td className="px-4 py-3 text-right text-muted-foreground">
+                      {new Date(organization.createdAt).toLocaleString("zh-CN")}
+                    </td>
+                    <td className="px-4 py-3">
+                      <OrganizationRowActions organization={organization} />
+                    </td>
+                  </tr>
+                ))}
+                {visibleOrganizations.length === 0 ? (
+                  <tr>
+                    <td className="px-4 py-8 text-center text-muted-foreground" colSpan={5}>
+                      暂无匹配机构
+                    </td>
+                  </tr>
+                ) : null}
+              </tbody>
+            </table>
+          </div>
+        </CardContent>
+      </Card>
+    </div>
+  );
+}

app/(app)/app/settings/page.tsx

@@ -1,31 +1,5 @@
 import { redirect } from "next/navigation";
 
-import { getCurrentAuthContext, toPublicAccount } from "@/modules/core/server/auth";
-import { getRoleDefinitions, hasPermission } from "@/modules/core/server/permissions";
-import { readData } from "@/modules/core/server/store";
-import { SettingsOverview } from "@/modules/settings/components/SettingsOverview";
-
 export default async function SettingsPage(): Promise<React.ReactElement> {
-  const context = await getCurrentAuthContext();
-  if (!context) {
-    redirect("/login");
-  }
-
-  if (!hasPermission(context.permissions, "account:read")) {
-    redirect("/app/dashboard");
-  }
-
-  const data = await readData();
-  const roles = await getRoleDefinitions(context.organization?.id);
-  return (
-    <SettingsOverview
-      accounts={data.accounts.map((account) => toPublicAccount(account))}
-      roles={roles}
-      auditLogs={data.auditLogs.slice(0, 100)}
-      organizations={data.organizations}
-      memberships={data.memberships}
-      joinRequests={data.joinRequests}
-      incidents={data.incidents}
-    />
-  );
+  redirect("/app/settings/users");
 }

app/(app)/app/settings/roles/page.tsx

@@ -0,0 +1,101 @@
+import { redirect } from "next/navigation";
+
+import { Badge } from "@/components/ui/badge";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { getCurrentAuthContext } from "@/modules/core/server/auth";
+import { getRoleDefinitions, hasPermission, PERMISSION_DEFINITIONS } from "@/modules/core/server/permissions";
+import { RoleManagementClient, RoleRowActions } from "@/modules/settings/components/RoleManagementClient";
+import { TableToolbar } from "@/modules/settings/components/TableToolbar";
+import { getPage, getPageCount, getSearchParam, paginate, type SearchParams } from "@/modules/settings/lib/pagination";
+
+type RolesPageProps = {
+  searchParams?: Promise<SearchParams>;
+};
+
+export default async function RolesPage({ searchParams }: RolesPageProps): Promise<React.ReactElement> {
+  const context = await getCurrentAuthContext();
+  if (!context) {
+    redirect("/login");
+  }
+
+  if (!hasPermission(context.permissions, "role:read")) {
+    redirect("/app/dashboard");
+  }
+
+  const params = (await searchParams) ?? {};
+  const query = getSearchParam(params, "q");
+  const page = getPage(params);
+  const roles = await getRoleDefinitions(context.organization?.id);
+  const normalizedQuery = query.trim().toLowerCase();
+  const filteredRoles = roles.filter((role) =>
+    [role.label, role.key, role.description, role.scope, ...role.permissions].join(" ").toLowerCase().includes(normalizedQuery),
+  );
+  const pageCount = getPageCount(filteredRoles.length);
+  const visibleRoles = paginate(filteredRoles, page);
+
+  return (
+    <div className="flex flex-col gap-5">
+      <section>
+        <Badge variant="success">RBAC</Badge>
+        <h2 className="mt-3 text-xl font-semibold">角色权限</h2>
+        <p className="mt-1 text-sm text-muted-foreground">系统权限点、内置角色和机构自定义角色。</p>
+      </section>
+
+      {hasPermission(context.permissions, "role:manage") ? <RoleManagementClient permissions={PERMISSION_DEFINITIONS} /> : null}
+
+      <Card>
+        <CardHeader>
+          <CardTitle>角色列表</CardTitle>
+        </CardHeader>
+        <CardContent className="p-0">
+          <TableToolbar
+            page={Math.min(page, pageCount)}
+            pageCount={pageCount}
+            pathname="/app/settings/roles"
+            query={query}
+            searchPlaceholder="搜索角色、权限、说明"
+            total={filteredRoles.length}
+          />
+          <div className="overflow-x-auto">
+            <table className="w-full min-w-[980px] text-sm">
+              <thead className="bg-secondary text-left text-xs text-muted-foreground">
+                <tr>
+                  <th className="px-4 py-3 font-medium">角色</th>
+                  <th className="px-4 py-3 font-medium">范围</th>
+                  <th className="px-4 py-3 font-medium">类型</th>
+                  <th className="px-4 py-3 font-medium">状态</th>
+                  <th className="px-4 py-3 font-medium">权限</th>
+                  <th className="px-4 py-3 text-right font-medium">操作</th>
+                </tr>
+              </thead>
+              <tbody className="divide-y bg-card">
+                {visibleRoles.map((role) => (
+                  <tr className="table-row-enter align-top hover:bg-secondary/45" key={role.id}>
+                    <td className="px-4 py-3">
+                      <p className="font-medium">{role.label}</p>
+                      <p className="text-xs text-muted-foreground">{role.description}</p>
+                    </td>
+                    <td className="px-4 py-3">{role.scope === "platform" ? "平台" : "机构"}</td>
+                    <td className="px-4 py-3">{role.isSystem ? "内置" : "自定义"}</td>
+                    <td className="px-4 py-3">{role.isEnabled ? "启用" : "停用"}</td>
+                    <td className="px-4 py-3 text-muted-foreground">{role.permissions.join(", ") || "-"}</td>
+                    <td className="px-4 py-3">
+                      <RoleRowActions permissions={PERMISSION_DEFINITIONS} role={role} />
+                    </td>
+                  </tr>
+                ))}
+                {visibleRoles.length === 0 ? (
+                  <tr>
+                    <td className="px-4 py-8 text-center text-muted-foreground" colSpan={6}>
+                      暂无匹配角色
+                    </td>
+                  </tr>
+                ) : null}
+              </tbody>
+            </table>
+          </div>
+        </CardContent>
+      </Card>
+    </div>
+  );
+}

app/(app)/app/settings/status/page.tsx

@@ -0,0 +1,138 @@
+import { redirect } from "next/navigation";
+
+import { Badge } from "@/components/ui/badge";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { checkDatabaseConnection } from "@/modules/core/server/db";
+import { getCurrentAuthContext } from "@/modules/core/server/auth";
+import { hasPermission } from "@/modules/core/server/permissions";
+import { readData } from "@/modules/core/server/store";
+import { IncidentStatusActions } from "@/modules/settings/components/IncidentStatusActions";
+import { TableToolbar } from "@/modules/settings/components/TableToolbar";
+import { getPage, getPageCount, getSearchParam, paginate, type SearchParams } from "@/modules/settings/lib/pagination";
+
+type StatusPageProps = {
+  searchParams?: Promise<SearchParams>;
+};
+
+export default async function StatusPage({ searchParams }: StatusPageProps): Promise<React.ReactElement> {
+  const context = await getCurrentAuthContext();
+  if (!context) {
+    redirect("/login");
+  }
+
+  if (!hasPermission(context.permissions, "incident:read")) {
+    redirect("/app/dashboard");
+  }
+
+  const params = (await searchParams) ?? {};
+  const query = getSearchParam(params, "q");
+  const page = getPage(params);
+  const [data, databaseHealth] = await Promise.all([readData(), checkDatabaseConnection()]);
+  const canManageIncidents = hasPermission(context.permissions, "incident:manage");
+  const normalizedQuery = query.trim().toLowerCase();
+  const filteredIncidents = data.incidents.filter((incident) =>
+    [incident.title, incident.description, incident.source, incident.severity, incident.status]
+      .join(" ")
+      .toLowerCase()
+      .includes(normalizedQuery),
+  );
+  const pageCount = getPageCount(filteredIncidents.length);
+  const visibleIncidents = paginate(filteredIncidents, page);
+
+  return (
+    <div className="flex flex-col gap-5">
+      <section>
+        <Badge variant={databaseHealth.ok ? "success" : "danger"}>{databaseHealth.ok ? "Healthy" : "Degraded"}</Badge>
+        <h2 className="mt-3 text-xl font-semibold">运行状态</h2>
+        <p className="mt-1 text-sm text-muted-foreground">{databaseHealth.reason}</p>
+      </section>
+
+      <section className="grid gap-4 md:grid-cols-4">
+        <Card>
+          <CardHeader>
+            <CardTitle className="text-3xl">{data.organizations.length}</CardTitle>
+          </CardHeader>
+          <CardContent className="pt-0 text-sm text-muted-foreground">机构</CardContent>
+        </Card>
+        <Card>
+          <CardHeader>
+            <CardTitle className="text-3xl">{data.accounts.length}</CardTitle>
+          </CardHeader>
+          <CardContent className="pt-0 text-sm text-muted-foreground">账号</CardContent>
+        </Card>
+        <Card>
+          <CardHeader>
+            <CardTitle className="text-3xl">{data.beds.length}</CardTitle>
+          </CardHeader>
+          <CardContent className="pt-0 text-sm text-muted-foreground">床位</CardContent>
+        </Card>
+        <Card>
+          <CardHeader>
+            <CardTitle className="text-3xl">{data.incidents.length}</CardTitle>
+          </CardHeader>
+          <CardContent className="pt-0 text-sm text-muted-foreground">故障事件</CardContent>
+        </Card>
+      </section>
+
+      <Card>
+        <CardHeader>
+          <CardTitle>故障中心</CardTitle>
+        </CardHeader>
+        <CardContent className="p-0">
+          <TableToolbar
+            page={Math.min(page, pageCount)}
+            pageCount={pageCount}
+            pathname="/app/settings/status"
+            query={query}
+            searchPlaceholder="搜索故障标题、来源、状态"
+            total={filteredIncidents.length}
+          />
+          <div className="overflow-x-auto">
+            <table className="w-full min-w-[960px] text-sm">
+              <thead className="bg-secondary text-left text-xs text-muted-foreground">
+                <tr>
+                  <th className="px-4 py-3 font-medium">标题</th>
+                  <th className="px-4 py-3 font-medium">严重级别</th>
+                  <th className="px-4 py-3 font-medium">状态</th>
+                  <th className="px-4 py-3 font-medium">来源</th>
+                  <th className="px-4 py-3 text-right font-medium">创建时间</th>
+                  <th className="px-4 py-3 text-right font-medium">操作</th>
+                </tr>
+              </thead>
+              <tbody className="divide-y bg-card">
+                {visibleIncidents.map((incident) => (
+                  <tr className="table-row-enter align-top hover:bg-secondary/45" key={incident.id}>
+                    <td className="px-4 py-3">
+                      <p className="font-medium">{incident.title}</p>
+                      <p className="text-xs text-muted-foreground">{incident.description}</p>
+                    </td>
+                    <td className="px-4 py-3">{incident.severity}</td>
+                    <td className="px-4 py-3">{incident.status}</td>
+                    <td className="px-4 py-3 text-muted-foreground">{incident.source}</td>
+                    <td className="px-4 py-3 text-right text-muted-foreground">
+                      {new Date(incident.createdAt).toLocaleString("zh-CN")}
+                    </td>
+                    <td className="px-4 py-3">
+                      {canManageIncidents ? (
+                        <IncidentStatusActions incident={incident} />
+                      ) : (
+                        <span className="block text-right text-xs text-muted-foreground">只读</span>
+                      )}
+                    </td>
+                  </tr>
+                ))}
+                {visibleIncidents.length === 0 ? (
+                  <tr>
+                    <td className="px-4 py-8 text-center text-muted-foreground" colSpan={6}>
+                      暂无匹配故障
+                    </td>
+                  </tr>
+                ) : null}
+              </tbody>
+            </table>
+          </div>
+        </CardContent>
+      </Card>
+    </div>
+  );
+}

app/(app)/app/settings/users/page.tsx

@@ -0,0 +1,140 @@
+import { redirect } from "next/navigation";
+
+import { Badge } from "@/components/ui/badge";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { getCurrentAuthContext, toPublicAccount } from "@/modules/core/server/auth";
+import { getRoleDefinitions, hasPermission } from "@/modules/core/server/permissions";
+import { readData } from "@/modules/core/server/store";
+import { ROLE_LABELS } from "@/modules/core/types";
+import type { RoleId } from "@/modules/core/types";
+import { TableToolbar } from "@/modules/settings/components/TableToolbar";
+import { UserAccountActions, UserManagementClient } from "@/modules/settings/components/UserManagementClient";
+import { getPage, getPageCount, getSearchParam, paginate, type SearchParams } from "@/modules/settings/lib/pagination";
+
+type UsersPageProps = {
+  searchParams?: Promise<SearchParams>;
+};
+
+function formatRoleLabel(role: string): string {
+  if (role in ROLE_LABELS) {
+    return ROLE_LABELS[role as RoleId];
+  }
+
+  return role;
+}
+
+export default async function UsersPage({ searchParams }: UsersPageProps): Promise<React.ReactElement> {
+  const context = await getCurrentAuthContext();
+  if (!context) {
+    redirect("/login");
+  }
+
+  if (!hasPermission(context.permissions, "account:read")) {
+    redirect("/app/dashboard");
+  }
+
+  const params = (await searchParams) ?? {};
+  const query = getSearchParam(params, "q");
+  const page = getPage(params);
+  const data = await readData();
+  const roles = await getRoleDefinitions(context.organization?.id);
+  const roleById = new Map(roles.map((role) => [role.id, role]));
+  const organizationById = new Map(data.organizations.map((organization) => [organization.id, organization]));
+  const accounts = data.accounts.map((account) => {
+    const membership = context.organization?.id
+      ? data.memberships.find(
+          (item) => item.accountId === account.id && item.organizationId === context.organization?.id && item.status === "active",
+        )
+      : data.memberships.find((item) => item.accountId === account.id && item.status === "active");
+    const organization = membership ? organizationById.get(membership.organizationId) : undefined;
+    const platformRole = account.platformRoleId ? roleById.get(account.platformRoleId) : undefined;
+
+    return toPublicAccount(account, platformRole?.key ?? membership?.roleKey, organization);
+  });
+  const normalizedQuery = query.trim().toLowerCase();
+  const filteredAccounts = accounts.filter((account) =>
+    [account.name, account.email, account.status, String(account.role), account.organization ?? ""]
+      .join(" ")
+      .toLowerCase()
+      .includes(normalizedQuery),
+  );
+  const pageCount = getPageCount(filteredAccounts.length);
+  const visibleAccounts = paginate(filteredAccounts, page);
+
+  return (
+    <div className="flex flex-col gap-5">
+      <section>
+        <Badge variant="success">Accounts</Badge>
+        <h2 className="mt-3 text-xl font-semibold">用户管理</h2>
+        <p className="mt-1 text-sm text-muted-foreground">账号创建、机构加入审批、角色分配和账号列表。</p>
+      </section>
+
+      <UserManagementClient organizations={data.organizations} roles={roles} joinRequests={data.joinRequests} />
+
+      <Card>
+        <CardHeader>
+          <CardTitle>账号列表</CardTitle>
+        </CardHeader>
+        <CardContent className="p-0">
+          <TableToolbar
+            page={Math.min(page, pageCount)}
+            pageCount={pageCount}
+            pathname="/app/settings/users"
+            query={query}
+            searchPlaceholder="搜索姓名、邮箱、角色、状态"
+            total={filteredAccounts.length}
+          />
+          <div className="overflow-x-auto">
+            <table className="w-full min-w-[920px] text-sm">
+              <thead className="bg-secondary text-left text-xs text-muted-foreground">
+                <tr>
+                  <th className="px-4 py-3 font-medium">账号</th>
+                  <th className="px-4 py-3 font-medium">角色</th>
+                  <th className="px-4 py-3 font-medium">机构</th>
+                  <th className="px-4 py-3 font-medium">状态</th>
+                  <th className="px-4 py-3 text-right font-medium">创建时间</th>
+                  <th className="px-4 py-3 text-right font-medium">操作</th>
+                </tr>
+              </thead>
+              <tbody className="divide-y bg-card">
+                {visibleAccounts.map((account) => (
+                  <tr className="table-row-enter hover:bg-secondary/45" key={account.id}>
+                    <td className="px-4 py-3">
+                      <p className="font-medium">{account.name}</p>
+                      <p className="text-xs text-muted-foreground">{account.email}</p>
+                    </td>
+                    <td className="px-4 py-3">{formatRoleLabel(account.role)}</td>
+                    <td className="px-4 py-3 text-muted-foreground">{account.organization ?? "-"}</td>
+                    <td className="px-4 py-3">
+                      <Badge variant={account.status === "active" ? "success" : account.status === "pending" ? "warning" : "danger"}>
+                        {account.status === "active" ? "启用" : account.status === "pending" ? "待审批" : "停用"}
+                      </Badge>
+                    </td>
+                    <td className="px-4 py-3 text-right text-muted-foreground">
+                      {new Date(account.createdAt).toLocaleString("zh-CN")}
+                    </td>
+                    <td className="px-4 py-3">
+                      <UserAccountActions
+                        account={account}
+                        currentAccountId={context.account.id}
+                        organizations={data.organizations}
+                        roles={roles}
+                      />
+                    </td>
+                  </tr>
+                ))}
+                {visibleAccounts.length === 0 ? (
+                  <tr>
+                    <td className="px-4 py-8 text-center text-muted-foreground" colSpan={6}>
+                      暂无匹配账号
+                    </td>
+                  </tr>
+                ) : null}
+              </tbody>
+            </table>
+          </div>
+        </CardContent>
+      </Card>
+    </div>
+  );
+}

app/api/organizations/[id]/route.ts

@@ -0,0 +1,145 @@
+import { eq } from "drizzle-orm";
+
+import { jsonFailure, jsonSuccess, readJsonBody } from "@/modules/core/server/api";
+import { recordAuditLog } from "@/modules/core/server/audit";
+import { requirePermission } from "@/modules/core/server/auth";
+import { getDatabase } from "@/modules/core/server/db";
+import { organizations } from "@/modules/core/server/schema";
+import type { OrganizationStatus } from "@/modules/core/types";
+
+type RouteContext = {
+  params: Promise<{
+    id: string;
+  }>;
+};
+
+const ORGANIZATION_STATUSES: OrganizationStatus[] = ["active", "disabled"];
+
+function isRecord(value: unknown): value is Record<string, unknown> {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+
+function readString(source: Record<string, unknown>, key: string): string {
+  const value = source[key];
+  return typeof value === "string" ? value.trim() : "";
+}
+
+function readStatus(value: unknown): OrganizationStatus | null {
+  if (typeof value !== "string") {
+    return null;
+  }
+
+  return ORGANIZATION_STATUSES.find((status) => status === value) ?? null;
+}
+
+export async function PATCH(request: Request, context: RouteContext): Promise<Response> {
+  const { id } = await context.params;
+  const auth = await requirePermission("organization:manage", {
+    action: "organization.update",
+    targetType: "organization",
+    targetId: id,
+  });
+
+  if (!auth.success) {
+    return auth.response;
+  }
+
+  const body = await readJsonBody(request);
+  if (!isRecord(body)) {
+    return jsonFailure("请求数据格式无效");
+  }
+
+  const name = readString(body, "name");
+  const slug = readString(body, "slug");
+  const status = "status" in body ? readStatus(body.status) : null;
+  if ("status" in body && !status) {
+    return jsonFailure("机构状态无效");
+  }
+
+  if (!name && !slug && !status) {
+    return jsonFailure("请至少填写一个要更新的字段");
+  }
+
+  const updateValues: {
+    name?: string;
+    slug?: string;
+    status?: OrganizationStatus;
+    updatedAt: Date;
+  } = {
+    updatedAt: new Date(),
+  };
+
+  if (name) {
+    updateValues.name = name;
+  }
+  if (slug) {
+    updateValues.slug = slug;
+  }
+  if (status) {
+    updateValues.status = status;
+  }
+
+  const database = getDatabase();
+  try {
+    const rows = await database.update(organizations).set(updateValues).where(eq(organizations.id, id)).returning();
+    const organization = rows[0];
+    if (!organization) {
+      return jsonFailure("机构不存在", 404);
+    }
+
+    await recordAuditLog({
+      actor: auth.context.account,
+      organizationId: organization.id,
+      action: "organization.update",
+      targetType: "organization",
+      targetId: organization.id,
+      result: "success",
+      reason: `更新机构：${organization.name}`,
+    });
+
+    return jsonSuccess("机构已更新", { organization });
+  } catch (error) {
+    const message = error instanceof Error ? error.message : "";
+    if (message.includes("organizations_slug_unique")) {
+      return jsonFailure("机构标识已存在", 409);
+    }
+
+    return jsonFailure("机构更新失败", 500);
+  }
+}
+
+export async function DELETE(_request: Request, context: RouteContext): Promise<Response> {
+  const { id } = await context.params;
+  const auth = await requirePermission("organization:manage", {
+    action: "organization.disable",
+    targetType: "organization",
+    targetId: id,
+  });
+
+  if (!auth.success) {
+    return auth.response;
+  }
+
+  const database = getDatabase();
+  const rows = await database
+    .update(organizations)
+    .set({ status: "disabled", updatedAt: new Date() })
+    .where(eq(organizations.id, id))
+    .returning();
+  const organization = rows[0];
+  if (!organization) {
+    return jsonFailure("机构不存在", 404);
+  }
+
+  await recordAuditLog({
+    actor: auth.context.account,
+    organizationId: organization.id,
+    action: "organization.disable",
+    targetType: "organization",
+    targetId: organization.id,
+    result: "success",
+    reason: `停用机构：${organization.name}`,
+  });
+
+  return jsonSuccess("机构已停用", { organization });
+}

app/api/settings/accounts/[id]/route.ts

@@ -0,0 +1,240 @@
+import { and, eq } from "drizzle-orm";
+
+import { jsonFailure, jsonSuccess, readJsonBody } from "@/modules/core/server/api";
+import { recordAuditLog } from "@/modules/core/server/audit";
+import { requirePermission, toPublicAccount } from "@/modules/core/server/auth";
+import { getDatabase } from "@/modules/core/server/db";
+import { hasPermission } from "@/modules/core/server/permissions";
+import { accounts, memberships, organizations, roles, sessions } from "@/modules/core/server/schema";
+import type { AccountStatus, Organization } from "@/modules/core/types";
+
+type RouteContext = {
+  params: Promise<{
+    id: string;
+  }>;
+};
+
+const ACCOUNT_STATUSES: AccountStatus[] = ["active", "disabled", "pending"];
+
+function isRecord(value: unknown): value is Record<string, unknown> {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+
+function readString(source: Record<string, unknown>, key: string): string {
+  const value = source[key];
+  return typeof value === "string" ? value.trim() : "";
+}
+
+function readStatus(value: unknown): AccountStatus | null {
+  if (typeof value !== "string") {
+    return null;
+  }
+
+  return ACCOUNT_STATUSES.find((status) => status === value) ?? null;
+}
+
+function toOrganization(row: typeof organizations.$inferSelect): Organization {
+  return {
+    id: row.id,
+    name: row.name,
+    slug: row.slug,
+    status: row.status,
+    createdAt: row.createdAt.toISOString(),
+    updatedAt: row.updatedAt.toISOString(),
+  };
+}
+
+export async function PATCH(request: Request, context: RouteContext): Promise<Response> {
+  const { id } = await context.params;
+  const auth = await requirePermission("account:manage", {
+    action: "account.update",
+    targetType: "account",
+    targetId: id,
+  });
+
+  if (!auth.success) {
+    return auth.response;
+  }
+
+  const body = await readJsonBody(request);
+  if (!isRecord(body)) {
+    return jsonFailure("请求数据格式无效");
+  }
+
+  const name = readString(body, "name");
+  const status = "status" in body ? readStatus(body.status) : null;
+  const roleId = readString(body, "roleId");
+  const requestedOrganizationId = readString(body, "organizationId");
+  const organizationId = requestedOrganizationId || auth.context.organization?.id;
+
+  if ("status" in body && !status) {
+    return jsonFailure("账号状态无效");
+  }
+
+  if (!name && !status && !roleId) {
+    return jsonFailure("请至少填写一个要更新的字段");
+  }
+
+  if (id === auth.context.account.id && status === "disabled") {
+    return jsonFailure("不能停用当前登录账号", 400);
+  }
+
+  const canManagePlatform = hasPermission(auth.context.permissions, "platform:manage");
+  if (!canManagePlatform && requestedOrganizationId && requestedOrganizationId !== auth.context.organization?.id) {
+    return jsonFailure("权限不足", 403);
+  }
+
+  const database = getDatabase();
+  const targetAccountRows = await database.select().from(accounts).where(eq(accounts.id, id)).limit(1);
+  const targetAccount = targetAccountRows[0];
+  if (!targetAccount) {
+    return jsonFailure("账号不存在", 404);
+  }
+
+  if (roleId && !organizationId) {
+    return jsonFailure("请选择机构后分配角色", 400);
+  }
+
+  const organizationRows = organizationId
+    ? await database.select().from(organizations).where(eq(organizations.id, organizationId)).limit(1)
+    : [];
+  const organization = organizationRows[0];
+  if (roleId && !organization) {
+    return jsonFailure("机构不存在", 404);
+  }
+
+  try {
+    await database.transaction(async (transaction) => {
+      if (name || status) {
+        const updateValues: {
+          name?: string;
+          status?: AccountStatus;
+          updatedAt: Date;
+        } = {
+          updatedAt: new Date(),
+        };
+        if (name) {
+          updateValues.name = name;
+        }
+        if (status) {
+          updateValues.status = status;
+        }
+
+        await transaction.update(accounts).set(updateValues).where(eq(accounts.id, id));
+        if (status === "disabled") {
+          await transaction.delete(sessions).where(eq(sessions.accountId, id));
+        }
+      }
+
+      if (roleId && organizationId) {
+        const roleRows = await transaction
+          .select()
+          .from(roles)
+          .where(and(eq(roles.id, roleId), eq(roles.organizationId, organizationId), eq(roles.isEnabled, true)))
+          .limit(1);
+        const role = roleRows[0];
+        if (!role) {
+          throw new Error("角色不存在");
+        }
+
+        const membershipRows = await transaction
+          .select()
+          .from(memberships)
+          .where(and(eq(memberships.accountId, id), eq(memberships.organizationId, organizationId)))
+          .limit(1);
+        const membership = membershipRows[0];
+
+        if (membership) {
+          await transaction
+            .update(memberships)
+            .set({ roleId, status: "active", updatedAt: new Date() })
+            .where(eq(memberships.id, membership.id));
+        } else {
+          await transaction.insert(memberships).values({
+            accountId: id,
+            organizationId,
+            roleId,
+            status: "active",
+          });
+        }
+      }
+    });
+  } catch (error) {
+    const reason = error instanceof Error ? error.message : "账号更新失败";
+    return jsonFailure(reason, reason === "角色不存在" ? 404 : 400);
+  }
+
+  const updatedAccountRows = await database.select().from(accounts).where(eq(accounts.id, id)).limit(1);
+  const updatedAccount = updatedAccountRows[0];
+  if (!updatedAccount) {
+    return jsonFailure("账号不存在", 404);
+  }
+
+  const membershipRows = organizationId
+    ? await database
+        .select({ membership: memberships, role: roles })
+        .from(memberships)
+        .innerJoin(roles, eq(roles.id, memberships.roleId))
+        .where(and(eq(memberships.accountId, id), eq(memberships.organizationId, organizationId)))
+        .limit(1)
+    : [];
+  const membership = membershipRows[0];
+  const publicAccount = toPublicAccount(
+    updatedAccount,
+    membership?.role.key,
+    organization ? toOrganization(organization) : undefined,
+  );
+
+  await recordAuditLog({
+    actor: auth.context.account,
+    organizationId,
+    action: "account.update",
+    targetType: "account",
+    targetId: updatedAccount.id,
+    result: "success",
+    reason: `更新账号：${updatedAccount.email}`,
+  });
+
+  return jsonSuccess("账号已更新", { account: publicAccount });
+}
+
+export async function DELETE(_request: Request, context: RouteContext): Promise<Response> {
+  const { id } = await context.params;
+  const auth = await requirePermission("account:manage", {
+    action: "account.disable",
+    targetType: "account",
+    targetId: id,
+  });
+
+  if (!auth.success) {
+    return auth.response;
+  }
+
+  if (id === auth.context.account.id) {
+    return jsonFailure("不能停用当前登录账号", 400);
+  }
+
+  const database = getDatabase();
+  const rows = await database
+    .update(accounts)
+    .set({ status: "disabled", updatedAt: new Date() })
+    .where(eq(accounts.id, id))
+    .returning();
+  const account = rows[0];
+  if (!account) {
+    return jsonFailure("账号不存在", 404);
+  }
+  await database.delete(sessions).where(eq(sessions.accountId, id));
+
+  await recordAuditLog({
+    actor: auth.context.account,
+    organizationId: auth.context.organization?.id,
+    action: "account.disable",
+    targetType: "account",
+    targetId: account.id,
+    result: "success",
+    reason: `停用账号：${account.email}`,
+  });
+
+  return jsonSuccess("账号已停用", { account: toPublicAccount(account) });
+}

app/api/settings/accounts/route.ts

@@ -4,7 +4,7 @@ import { jsonFailure, jsonSuccess, readJsonBody } from "@/modules/core/server/ap
 import { hashPassword, normalizeEmail, requirePermission, toPublicAccount } from "@/modules/core/server/auth";
 import { recordAuditLog } from "@/modules/core/server/audit";
 import { getDatabase } from "@/modules/core/server/db";
-import { hasPermission } from "@/modules/core/server/permissions";
+import { getRoleDefinitions, hasPermission } from "@/modules/core/server/permissions";
 import { accounts, memberships, organizations, roles } from "@/modules/core/server/schema";
 import { readData } from "@/modules/core/server/store";
 
@@ -30,6 +30,9 @@ export async function GET(): Promise<Response> {
   const data = await readData();
   const canReadAllAccounts = hasPermission(auth.context.permissions, "platform:manage");
   const organizationId = auth.context.organization?.id;
+  const roleDefinitions = await getRoleDefinitions(organizationId);
+  const roleById = new Map(roleDefinitions.map((role) => [role.id, role]));
+  const organizationById = new Map(data.organizations.map((organization) => [organization.id, organization]));
   const scopedAccountIds =
     organizationId && !canReadAllAccounts
       ? new Set(
@@ -42,7 +45,17 @@ export async function GET(): Promise<Response> {
   return jsonSuccess("账号列表已加载", {
     accounts: data.accounts
       .filter((account) => !scopedAccountIds || scopedAccountIds.has(account.id))
-      .map((account) => toPublicAccount(account)),
+      .map((account) => {
+        const membership = organizationId
+          ? data.memberships.find(
+              (item) => item.accountId === account.id && item.organizationId === organizationId && item.status === "active",
+            )
+          : data.memberships.find((item) => item.accountId === account.id && item.status === "active");
+        const organization = membership ? organizationById.get(membership.organizationId) : undefined;
+        const platformRole = account.platformRoleId ? roleById.get(account.platformRoleId) : undefined;
+
+        return toPublicAccount(account, platformRole?.key ?? membership?.roleKey, organization);
+      }),
   });
 }
 

app/api/settings/roles/[id]/route.ts

@@ -0,0 +1,218 @@
+import { eq } from "drizzle-orm";
+
+import { jsonFailure, jsonSuccess, readJsonBody } from "@/modules/core/server/api";
+import { recordAuditLog } from "@/modules/core/server/audit";
+import { requirePermission } from "@/modules/core/server/auth";
+import { getDatabase } from "@/modules/core/server/db";
+import { getRoleDefinitions, hasPermission } from "@/modules/core/server/permissions";
+import { rolePermissions, roles } from "@/modules/core/server/schema";
+import { PERMISSIONS } from "@/modules/core/types";
+import type { Permission } from "@/modules/core/types";
+
+type RouteContext = {
+  params: Promise<{
+    id: string;
+  }>;
+};
+
+const PERMISSION_SET = new Set<string>(PERMISSIONS);
+
+function isRecord(value: unknown): value is Record<string, unknown> {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+
+function readString(source: Record<string, unknown>, key: string): string {
+  const value = source[key];
+  return typeof value === "string" ? value.trim() : "";
+}
+
+function readBoolean(source: Record<string, unknown>, key: string): boolean | null {
+  const value = source[key];
+  return typeof value === "boolean" ? value : null;
+}
+
+function readPermissionArray(source: Record<string, unknown>): Permission[] | null {
+  const value = source.permissions;
+  if (!Array.isArray(value)) {
+    return null;
+  }
+
+  const permissions = value.filter((item): item is string => typeof item === "string");
+  if (permissions.length !== value.length || permissions.some((permission) => !PERMISSION_SET.has(permission))) {
+    return null;
+  }
+
+  return permissions as Permission[];
+}
+
+function createRoleKey(label: string): string {
+  return label.toLowerCase().replace(/[^a-z0-9]+/g, "_").replace(/^_|_$/g, "");
+}
+
+async function getEditableRole(id: string, organizationId: string | undefined, canManagePlatform: boolean) {
+  const database = getDatabase();
+  const rows = await database.select().from(roles).where(eq(roles.id, id)).limit(1);
+  const role = rows[0];
+  if (!role) {
+    return { success: false as const, response: jsonFailure("角色不存在", 404) };
+  }
+
+  if (role.isSystem) {
+    return { success: false as const, response: jsonFailure("内置角色不可编辑", 400) };
+  }
+
+  if (!canManagePlatform && role.organizationId !== organizationId) {
+    return { success: false as const, response: jsonFailure("角色不存在", 404) };
+  }
+
+  return { success: true as const, role };
+}
+
+export async function PATCH(request: Request, context: RouteContext): Promise<Response> {
+  const { id } = await context.params;
+  const auth = await requirePermission("role:manage", {
+    action: "role.update",
+    targetType: "role",
+    targetId: id,
+  });
+
+  if (!auth.success) {
+    return auth.response;
+  }
+
+  const body = await readJsonBody(request);
+  if (!isRecord(body)) {
+    return jsonFailure("请求数据格式无效");
+  }
+
+  const organizationId = auth.context.organization?.id;
+  const editable = await getEditableRole(id, organizationId, hasPermission(auth.context.permissions, "platform:manage"));
+  if (!editable.success) {
+    return editable.response;
+  }
+
+  const label = readString(body, "label");
+  const key = readString(body, "key") || (label ? createRoleKey(label) : "");
+  const description = readString(body, "description");
+  const isEnabled = "isEnabled" in body ? readBoolean(body, "isEnabled") : null;
+  if ("isEnabled" in body && isEnabled === null) {
+    return jsonFailure("角色状态无效");
+  }
+
+  const permissions = "permissions" in body ? readPermissionArray(body) : null;
+  if ("permissions" in body && permissions === null) {
+    return jsonFailure("权限列表无效");
+  }
+
+  if (!label && !key && !description && isEnabled === null && permissions === null) {
+    return jsonFailure("请至少填写一个要更新的字段");
+  }
+
+  const updateValues: {
+    label?: string;
+    key?: string;
+    description?: string;
+    isEnabled?: boolean;
+    updatedAt: Date;
+  } = {
+    updatedAt: new Date(),
+  };
+
+  if (label) {
+    updateValues.label = label;
+  }
+  if (key) {
+    updateValues.key = key;
+  }
+  if (description) {
+    updateValues.description = description;
+  }
+  if (isEnabled !== null) {
+    updateValues.isEnabled = isEnabled;
+  }
+
+  const database = getDatabase();
+  try {
+    await database.transaction(async (transaction) => {
+      await transaction.update(roles).set(updateValues).where(eq(roles.id, id));
+      if (permissions) {
+        await transaction.delete(rolePermissions).where(eq(rolePermissions.roleId, id));
+        if (permissions.length > 0) {
+          await transaction.insert(rolePermissions).values(
+            permissions.map((permissionId) => ({
+              roleId: id,
+              permissionId,
+            })),
+          );
+        }
+      }
+    });
+  } catch (error) {
+    const message = error instanceof Error ? error.message : "";
+    if (message.includes("roles_key_organization_unique")) {
+      return jsonFailure("角色标识已存在", 409);
+    }
+
+    return jsonFailure("角色更新失败", 500);
+  }
+
+  await recordAuditLog({
+    actor: auth.context.account,
+    organizationId: editable.role.organizationId ?? organizationId,
+    action: "role.update",
+    targetType: "role",
+    targetId: id,
+    result: "success",
+    reason: `更新角色：${label || editable.role.label}`,
+  });
+
+  const roleRows = await getRoleDefinitions(editable.role.organizationId ?? organizationId);
+  const role = roleRows.find((item) => item.id === id);
+  if (!role) {
+    return jsonFailure("角色更新后读取失败", 500);
+  }
+
+  return jsonSuccess("角色已更新", { role });
+}
+
+export async function DELETE(_request: Request, context: RouteContext): Promise<Response> {
+  const { id } = await context.params;
+  const auth = await requirePermission("role:manage", {
+    action: "role.disable",
+    targetType: "role",
+    targetId: id,
+  });
+
+  if (!auth.success) {
+    return auth.response;
+  }
+
+  const organizationId = auth.context.organization?.id;
+  const editable = await getEditableRole(id, organizationId, hasPermission(auth.context.permissions, "platform:manage"));
+  if (!editable.success) {
+    return editable.response;
+  }
+
+  const database = getDatabase();
+  const rows = await database
+    .update(roles)
+    .set({ isEnabled: false, updatedAt: new Date() })
+    .where(eq(roles.id, id))
+    .returning();
+  const role = rows[0];
+  if (!role) {
+    return jsonFailure("角色不存在", 404);
+  }
+
+  await recordAuditLog({
+    actor: auth.context.account,
+    organizationId: role.organizationId ?? organizationId,
+    action: "role.disable",
+    targetType: "role",
+    targetId: role.id,
+    result: "success",
+    reason: `停用角色：${role.label}`,
+  });
+
+  return jsonSuccess("角色已停用", { role });
+}

app/globals.css

@@ -79,3 +79,47 @@ a,
 ::selection {
   background: color-mix(in oklch, var(--primary) 22%, transparent);
 }
+
+@keyframes page-enter {
+  from {
+    opacity: 0;
+    transform: translateY(6px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+@keyframes loading-progress {
+  0% {
+    transform: translateX(-100%);
+  }
+  55% {
+    transform: translateX(-18%);
+  }
+  100% {
+    transform: translateX(100%);
+  }
+}
+
+.page-enter {
+  animation: page-enter 180ms ease-out both;
+}
+
+.table-row-enter {
+  animation: page-enter 160ms ease-out both;
+}
+
+.loading-progress {
+  width: 55%;
+  animation: loading-progress 900ms ease-in-out infinite;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .page-enter,
+  .table-row-enter,
+  .loading-progress {
+    animation: none;
+  }
+}