feat: complete user management workflow
This commit is contained in:
@@ -10,6 +10,7 @@ import { Button } from "@/components/ui/button";
|
||||
import { Card } from "@/components/ui/card";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import type { ApiResult } from "@/modules/core/server/api";
|
||||
import type { Organization } from "@/modules/core/types";
|
||||
|
||||
type AuthMode = "login" | "register" | "setup";
|
||||
|
||||
@@ -30,6 +31,7 @@ function AuthPanelContent({ mode }: AuthPanelProps): React.ReactElement {
|
||||
const [message, setMessage] = useState("");
|
||||
const [isPending, setIsPending] = useState(false);
|
||||
const [hasAccounts, setHasAccounts] = useState<boolean | null>(null);
|
||||
const [organizations, setOrganizations] = useState<Organization[]>([]);
|
||||
|
||||
const copy = modeCopy[mode];
|
||||
const isSetup = mode === "setup";
|
||||
@@ -39,17 +41,23 @@ function AuthPanelContent({ mode }: AuthPanelProps): React.ReactElement {
|
||||
let isMounted = true;
|
||||
|
||||
async function loadState(): Promise<void> {
|
||||
const [bootstrapResponse, sessionResponse] = await Promise.all([
|
||||
const [bootstrapResponse, sessionResponse, organizationsResponse] = await Promise.all([
|
||||
fetch("/api/auth/bootstrap"),
|
||||
fetch("/api/auth/session"),
|
||||
fetch("/api/organizations"),
|
||||
]);
|
||||
const bootstrap = (await bootstrapResponse.json()) as ApiResult<{ setupRequired: boolean }>;
|
||||
const session = (await sessionResponse.json()) as ApiResult<{ account: unknown | null }>;
|
||||
const organizationsResult = (await organizationsResponse.json()) as ApiResult<{ organizations: Organization[] }>;
|
||||
|
||||
if (!isMounted || !bootstrap.success || !session.success) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (organizationsResult.success) {
|
||||
setOrganizations(organizationsResult.organizations);
|
||||
}
|
||||
|
||||
const initialized = !bootstrap.setupRequired;
|
||||
setHasAccounts(initialized);
|
||||
|
||||
@@ -97,6 +105,7 @@ function AuthPanelContent({ mode }: AuthPanelProps): React.ReactElement {
|
||||
const email = String(formData.get("email") ?? "");
|
||||
const password = String(formData.get("password") ?? "");
|
||||
const organization = String(formData.get("organization") ?? "");
|
||||
const organizationId = String(formData.get("organizationId") ?? "");
|
||||
|
||||
const endpoint = isLogin ? "/api/auth/login" : isSetup ? "/api/auth/setup" : "/api/auth/register";
|
||||
const response = await fetch(endpoint, {
|
||||
@@ -107,9 +116,10 @@ function AuthPanelContent({ mode }: AuthPanelProps): React.ReactElement {
|
||||
email,
|
||||
password,
|
||||
organization,
|
||||
organizationId,
|
||||
}),
|
||||
});
|
||||
const result = (await response.json()) as ApiResult<{ account: unknown }>;
|
||||
const result = (await response.json()) as ApiResult<{ account: unknown; pendingApproval?: boolean }>;
|
||||
setIsPending(false);
|
||||
|
||||
if (!result.success) {
|
||||
@@ -117,6 +127,11 @@ function AuthPanelContent({ mode }: AuthPanelProps): React.ReactElement {
|
||||
return;
|
||||
}
|
||||
|
||||
if (result.pendingApproval) {
|
||||
setMessage(result.reason);
|
||||
return;
|
||||
}
|
||||
|
||||
router.refresh();
|
||||
router.replace(isLogin ? redirectTo : "/app/dashboard");
|
||||
}
|
||||
@@ -180,6 +195,23 @@ function AuthPanelContent({ mode }: AuthPanelProps): React.ReactElement {
|
||||
</label>
|
||||
) : null}
|
||||
|
||||
{mode === "register" && organizations.length > 0 ? (
|
||||
<label className="block space-y-2">
|
||||
<span className="text-sm font-medium">申请加入机构</span>
|
||||
<select
|
||||
className="h-11 w-full rounded-md border bg-background px-3 text-sm outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring"
|
||||
name="organizationId"
|
||||
>
|
||||
<option value="">暂不加入机构</option>
|
||||
{organizations.map((organization) => (
|
||||
<option key={organization.id} value={organization.id}>
|
||||
{organization.name}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</label>
|
||||
) : null}
|
||||
|
||||
{!isLogin ? (
|
||||
<label className="block space-y-2">
|
||||
<span className="text-sm font-medium">姓名</span>
|
||||
|
||||
@@ -251,7 +251,7 @@ export async function createRegistration(input: {
|
||||
email: string;
|
||||
password: string;
|
||||
organizationId?: string;
|
||||
}): Promise<{ account: PublicAccount; session: Session }> {
|
||||
}): Promise<{ account: PublicAccount; session?: Session }> {
|
||||
const database = getDatabase();
|
||||
const password = hashPassword(input.password);
|
||||
const expiresAt = new Date(Date.now() + SESSION_MAX_AGE_SECONDS * 1000);
|
||||
@@ -278,18 +278,16 @@ export async function createRegistration(input: {
|
||||
throw new Error("账号创建失败");
|
||||
}
|
||||
|
||||
const sessionRows = await transaction
|
||||
.insert(sessions)
|
||||
.values({
|
||||
accountId: account.id,
|
||||
activeOrganizationId: input.organizationId,
|
||||
expiresAt,
|
||||
})
|
||||
.returning();
|
||||
const sessionRows = input.organizationId
|
||||
? []
|
||||
: await transaction
|
||||
.insert(sessions)
|
||||
.values({
|
||||
accountId: account.id,
|
||||
expiresAt,
|
||||
})
|
||||
.returning();
|
||||
const session = sessionRows[0];
|
||||
if (!session) {
|
||||
throw new Error("会话创建失败");
|
||||
}
|
||||
|
||||
if (input.organizationId) {
|
||||
await transaction.insert(joinRequests).values({
|
||||
@@ -308,7 +306,7 @@ export async function createRegistration(input: {
|
||||
}
|
||||
|
||||
const publicAccount = toPublicAccount(created.account);
|
||||
const session = toSession(created.session);
|
||||
const session = created.session ? toSession(created.session) : undefined;
|
||||
await recordAuditLog({
|
||||
actor: publicAccount,
|
||||
organizationId: input.organizationId,
|
||||
@@ -334,7 +332,7 @@ export async function loginWithPassword(input: {
|
||||
.limit(1);
|
||||
const account = accountRows[0];
|
||||
|
||||
if (!account || account.status === "disabled" || !verifyPassword(input.password, account)) {
|
||||
if (!account || account.status !== "active" || !verifyPassword(input.password, account)) {
|
||||
throw new Error("邮箱或密码错误");
|
||||
}
|
||||
|
||||
|
||||
@@ -7,6 +7,7 @@ import {
|
||||
admissions,
|
||||
beds,
|
||||
elders,
|
||||
joinRequests,
|
||||
memberships,
|
||||
organizations,
|
||||
roles,
|
||||
@@ -14,7 +15,18 @@ import {
|
||||
sessions,
|
||||
systemIncidents,
|
||||
} from "@/modules/core/server/schema";
|
||||
import type { Account, Admission, AppData, FacilityBed, Membership, Organization, Room, Session, SystemIncident } from "@/modules/core/types";
|
||||
import type {
|
||||
Account,
|
||||
Admission,
|
||||
AppData,
|
||||
FacilityBed,
|
||||
JoinRequest,
|
||||
Membership,
|
||||
Organization,
|
||||
Room,
|
||||
Session,
|
||||
SystemIncident,
|
||||
} from "@/modules/core/types";
|
||||
import type { Elder } from "@/modules/elders/types";
|
||||
|
||||
function iso(value: Date): string {
|
||||
@@ -27,6 +39,7 @@ export async function readData(): Promise<AppData> {
|
||||
organizationRows,
|
||||
accountRows,
|
||||
membershipRows,
|
||||
joinRequestRows,
|
||||
sessionRows,
|
||||
elderRows,
|
||||
roomRows,
|
||||
@@ -38,6 +51,17 @@ export async function readData(): Promise<AppData> {
|
||||
database.select().from(organizations).orderBy(desc(organizations.createdAt)),
|
||||
database.select().from(accounts).orderBy(desc(accounts.createdAt)),
|
||||
database.select({ membership: memberships, role: roles }).from(memberships).innerJoin(roles, eq(roles.id, memberships.roleId)),
|
||||
database
|
||||
.select({
|
||||
request: joinRequests,
|
||||
accountName: accounts.name,
|
||||
accountEmail: accounts.email,
|
||||
organizationName: organizations.name,
|
||||
})
|
||||
.from(joinRequests)
|
||||
.innerJoin(accounts, eq(accounts.id, joinRequests.accountId))
|
||||
.innerJoin(organizations, eq(organizations.id, joinRequests.organizationId))
|
||||
.orderBy(desc(joinRequests.createdAt)),
|
||||
database.select().from(sessions).orderBy(desc(sessions.createdAt)),
|
||||
database.select().from(elders).orderBy(desc(elders.createdAt)),
|
||||
database.select().from(rooms).orderBy(desc(rooms.createdAt)),
|
||||
@@ -120,6 +144,20 @@ export async function readData(): Promise<AppData> {
|
||||
};
|
||||
});
|
||||
|
||||
const joinRequestsData: JoinRequest[] = joinRequestRows.map((row) => ({
|
||||
id: row.request.id,
|
||||
accountId: row.request.accountId,
|
||||
accountName: row.accountName,
|
||||
accountEmail: row.accountEmail,
|
||||
organizationId: row.request.organizationId,
|
||||
organizationName: row.organizationName,
|
||||
status: row.request.status,
|
||||
reason: row.request.reason,
|
||||
reviewedByAccountId: row.request.reviewedByAccountId ?? undefined,
|
||||
reviewedAt: row.request.reviewedAt ? iso(row.request.reviewedAt) : undefined,
|
||||
createdAt: iso(row.request.createdAt),
|
||||
}));
|
||||
|
||||
const sessionsData: Session[] = sessionRows.map((row) => ({
|
||||
id: row.id,
|
||||
accountId: row.accountId,
|
||||
@@ -204,6 +242,7 @@ export async function readData(): Promise<AppData> {
|
||||
organizations: organizationsData,
|
||||
accounts: accountsData,
|
||||
memberships: membershipsData,
|
||||
joinRequests: joinRequestsData,
|
||||
sessions: sessionsData,
|
||||
elders: eldersData,
|
||||
rooms: roomsData,
|
||||
|
||||
@@ -86,6 +86,22 @@ export type Membership = {
|
||||
updatedAt: string;
|
||||
};
|
||||
|
||||
export type JoinRequestStatus = "pending" | "approved" | "rejected";
|
||||
|
||||
export type JoinRequest = {
|
||||
id: string;
|
||||
accountId: string;
|
||||
accountName: string;
|
||||
accountEmail: string;
|
||||
organizationId: string;
|
||||
organizationName: string;
|
||||
status: JoinRequestStatus;
|
||||
reason: string;
|
||||
reviewedByAccountId?: string;
|
||||
reviewedAt?: string;
|
||||
createdAt: string;
|
||||
};
|
||||
|
||||
export type Account = {
|
||||
id: string;
|
||||
platformRoleId?: string;
|
||||
@@ -189,6 +205,7 @@ export type AppData = {
|
||||
organizations: Organization[];
|
||||
accounts: Account[];
|
||||
memberships: Membership[];
|
||||
joinRequests: JoinRequest[];
|
||||
sessions: Session[];
|
||||
elders: Elder[];
|
||||
rooms: Room[];
|
||||
|
||||
@@ -2,8 +2,17 @@ import { Activity, Building2, Server, ShieldCheck, Users } from "lucide-react";
|
||||
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
import type { AuditLog, Membership, Organization, PublicAccount, RoleDefinition, SystemIncident } from "@/modules/core/types";
|
||||
import type {
|
||||
AuditLog,
|
||||
JoinRequest,
|
||||
Membership,
|
||||
Organization,
|
||||
PublicAccount,
|
||||
RoleDefinition,
|
||||
SystemIncident,
|
||||
} from "@/modules/core/types";
|
||||
import { ROLE_LABELS } from "@/modules/core/types";
|
||||
import { UserManagementClient } from "@/modules/settings/components/UserManagementClient";
|
||||
import type { RoleId } from "@/modules/core/types";
|
||||
|
||||
type SettingsOverviewProps = {
|
||||
@@ -12,6 +21,7 @@ type SettingsOverviewProps = {
|
||||
auditLogs: AuditLog[];
|
||||
organizations: Organization[];
|
||||
memberships: Membership[];
|
||||
joinRequests: JoinRequest[];
|
||||
incidents: SystemIncident[];
|
||||
};
|
||||
|
||||
@@ -29,6 +39,7 @@ export function SettingsOverview({
|
||||
auditLogs,
|
||||
organizations,
|
||||
memberships,
|
||||
joinRequests,
|
||||
incidents,
|
||||
}: SettingsOverviewProps): React.ReactElement {
|
||||
const activeAccountCount = accounts.filter((account) => account.status === "active").length;
|
||||
@@ -171,6 +182,8 @@ export function SettingsOverview({
|
||||
</Card>
|
||||
</section>
|
||||
|
||||
<UserManagementClient organizations={organizations} roles={roles} joinRequests={joinRequests} />
|
||||
|
||||
<section className="grid gap-4 xl:grid-cols-[0.9fr_1.1fr]">
|
||||
<Card>
|
||||
<CardHeader>
|
||||
|
||||
224
modules/settings/components/UserManagementClient.tsx
Normal file
224
modules/settings/components/UserManagementClient.tsx
Normal file
@@ -0,0 +1,224 @@
|
||||
"use client";
|
||||
|
||||
import { FormEvent, useMemo, useState } from "react";
|
||||
import { Check, Plus, X } from "lucide-react";
|
||||
import { useRouter } from "next/navigation";
|
||||
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import type { ApiResult } from "@/modules/core/server/api";
|
||||
import type { JoinRequest, Organization, RoleDefinition } from "@/modules/core/types";
|
||||
|
||||
type UserManagementClientProps = {
|
||||
organizations: Organization[];
|
||||
roles: RoleDefinition[];
|
||||
joinRequests: JoinRequest[];
|
||||
};
|
||||
|
||||
function getOrganizationRoles(roles: RoleDefinition[], organizationId: string): RoleDefinition[] {
|
||||
return roles.filter((role) => role.scope === "organization" && role.organizationId === organizationId && role.isEnabled);
|
||||
}
|
||||
|
||||
function getDefaultOrganizationId(organizations: Organization[]): string {
|
||||
return organizations[0]?.id ?? "";
|
||||
}
|
||||
|
||||
export function UserManagementClient({
|
||||
organizations,
|
||||
roles,
|
||||
joinRequests,
|
||||
}: UserManagementClientProps): React.ReactElement {
|
||||
const router = useRouter();
|
||||
const [selectedOrganizationId, setSelectedOrganizationId] = useState(() => getDefaultOrganizationId(organizations));
|
||||
const [message, setMessage] = useState("");
|
||||
const [isPending, setIsPending] = useState(false);
|
||||
|
||||
const organizationRoles = useMemo(
|
||||
() => getOrganizationRoles(roles, selectedOrganizationId),
|
||||
[roles, selectedOrganizationId],
|
||||
);
|
||||
const pendingJoinRequests = joinRequests.filter((request) => request.status === "pending");
|
||||
|
||||
async function handleCreateAccount(event: FormEvent<HTMLFormElement>): Promise<void> {
|
||||
event.preventDefault();
|
||||
setMessage("");
|
||||
setIsPending(true);
|
||||
|
||||
const formData = new FormData(event.currentTarget);
|
||||
const response = await fetch("/api/settings/accounts", {
|
||||
method: "POST",
|
||||
headers: { "content-type": "application/json" },
|
||||
body: JSON.stringify({
|
||||
organizationId: String(formData.get("organizationId") ?? ""),
|
||||
roleId: String(formData.get("roleId") ?? ""),
|
||||
name: String(formData.get("name") ?? ""),
|
||||
email: String(formData.get("email") ?? ""),
|
||||
password: String(formData.get("password") ?? ""),
|
||||
}),
|
||||
});
|
||||
const result = (await response.json()) as ApiResult<{ account: unknown }>;
|
||||
setIsPending(false);
|
||||
|
||||
if (!result.success) {
|
||||
setMessage(result.reason);
|
||||
return;
|
||||
}
|
||||
|
||||
setMessage(result.reason);
|
||||
event.currentTarget.reset();
|
||||
router.refresh();
|
||||
}
|
||||
|
||||
async function reviewJoinRequest(requestId: string, decision: "approved" | "rejected", roleId: string): Promise<void> {
|
||||
setMessage("");
|
||||
setIsPending(true);
|
||||
const response = await fetch(`/api/settings/join-requests/${requestId}`, {
|
||||
method: "PATCH",
|
||||
headers: { "content-type": "application/json" },
|
||||
body: JSON.stringify({ decision, roleId }),
|
||||
});
|
||||
const result = (await response.json()) as ApiResult<{ joinRequest: unknown }>;
|
||||
setIsPending(false);
|
||||
|
||||
if (!result.success) {
|
||||
setMessage(result.reason);
|
||||
return;
|
||||
}
|
||||
|
||||
setMessage(result.reason);
|
||||
router.refresh();
|
||||
}
|
||||
|
||||
return (
|
||||
<section className="grid gap-4 xl:grid-cols-[0.9fr_1.1fr]">
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>创建机构用户</CardTitle>
|
||||
<CardDescription>管理员创建账号后立即分配到机构和角色。</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<form className="grid gap-3" onSubmit={handleCreateAccount}>
|
||||
<label className="grid gap-2 text-sm">
|
||||
<span className="font-medium">机构</span>
|
||||
<select
|
||||
className="h-11 w-full rounded-md border bg-background px-3 text-sm outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring"
|
||||
name="organizationId"
|
||||
onChange={(event) => setSelectedOrganizationId(event.target.value)}
|
||||
value={selectedOrganizationId}
|
||||
>
|
||||
{organizations.map((organization) => (
|
||||
<option key={organization.id} value={organization.id}>
|
||||
{organization.name}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</label>
|
||||
|
||||
<label className="grid gap-2 text-sm">
|
||||
<span className="font-medium">角色</span>
|
||||
<select
|
||||
className="h-11 w-full rounded-md border bg-background px-3 text-sm outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring"
|
||||
name="roleId"
|
||||
required
|
||||
>
|
||||
{organizationRoles.map((role) => (
|
||||
<option key={role.id} value={role.id}>
|
||||
{role.label}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</label>
|
||||
|
||||
<label className="grid gap-2 text-sm">
|
||||
<span className="font-medium">姓名</span>
|
||||
<Input name="name" required />
|
||||
</label>
|
||||
<label className="grid gap-2 text-sm">
|
||||
<span className="font-medium">邮箱</span>
|
||||
<Input name="email" required type="email" />
|
||||
</label>
|
||||
<label className="grid gap-2 text-sm">
|
||||
<span className="font-medium">初始密码</span>
|
||||
<Input minLength={6} name="password" required type="password" />
|
||||
</label>
|
||||
|
||||
<Button disabled={isPending || organizationRoles.length === 0} type="submit">
|
||||
<Plus className="size-4" aria-hidden="true" />
|
||||
创建用户
|
||||
</Button>
|
||||
</form>
|
||||
{message ? (
|
||||
<p className="mt-3 rounded-md bg-secondary px-3 py-2 text-sm text-secondary-foreground" role="status">
|
||||
{message}
|
||||
</p>
|
||||
) : null}
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>加入申请审批</CardTitle>
|
||||
<CardDescription>公开注册选择机构后进入这里审批。</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-3">
|
||||
{pendingJoinRequests.map((request) => {
|
||||
const requestRoles = getOrganizationRoles(roles, request.organizationId);
|
||||
const defaultRoleId = requestRoles.find((role) => role.key === "caregiver")?.id ?? requestRoles[0]?.id ?? "";
|
||||
|
||||
return (
|
||||
<div key={request.id} className="rounded-md border p-3">
|
||||
<div className="flex flex-col gap-3 lg:flex-row lg:items-start lg:justify-between">
|
||||
<div>
|
||||
<p className="font-medium">{request.accountName}</p>
|
||||
<p className="text-xs text-muted-foreground">{request.accountEmail}</p>
|
||||
<p className="mt-2 text-sm text-muted-foreground">{request.organizationName}</p>
|
||||
</div>
|
||||
<Badge variant="warning">待审批</Badge>
|
||||
</div>
|
||||
<div className="mt-3 grid gap-2 sm:grid-cols-[1fr_auto_auto]">
|
||||
<select
|
||||
className="h-10 w-full rounded-md border bg-background px-3 text-sm outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring"
|
||||
defaultValue={defaultRoleId}
|
||||
id={`role-${request.id}`}
|
||||
>
|
||||
{requestRoles.map((role) => (
|
||||
<option key={role.id} value={role.id}>
|
||||
{role.label}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
<Button
|
||||
disabled={isPending || !defaultRoleId}
|
||||
onClick={() => {
|
||||
const element = document.getElementById(`role-${request.id}`);
|
||||
const roleId = element instanceof HTMLSelectElement ? element.value : defaultRoleId;
|
||||
void reviewJoinRequest(request.id, "approved", roleId);
|
||||
}}
|
||||
size="sm"
|
||||
type="button"
|
||||
>
|
||||
<Check className="size-4" aria-hidden="true" />
|
||||
通过
|
||||
</Button>
|
||||
<Button
|
||||
disabled={isPending}
|
||||
onClick={() => void reviewJoinRequest(request.id, "rejected", "")}
|
||||
size="sm"
|
||||
type="button"
|
||||
variant="outline"
|
||||
>
|
||||
<X className="size-4" aria-hidden="true" />
|
||||
拒绝
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
{pendingJoinRequests.length === 0 ? <p className="text-sm text-muted-foreground">暂无待审批申请</p> : null}
|
||||
</CardContent>
|
||||
</Card>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user