feat: complete admission workspace
This commit is contained in:
578
modules/facilities/components/BedsWorkspace.tsx
Normal file
578
modules/facilities/components/BedsWorkspace.tsx
Normal file
@@ -0,0 +1,578 @@
|
||||
"use client";
|
||||
|
||||
import { FormEvent, useMemo, useState } from "react";
|
||||
import { BedDouble, DoorOpen, History, MoveRight, UserCheck, UserMinus, Wrench } from "lucide-react";
|
||||
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
import { Textarea } from "@/components/ui/input";
|
||||
import { Select, type SelectOption } from "@/components/ui/select";
|
||||
import { Table } from "@/components/ui/table";
|
||||
import type { ApiResult } from "@/modules/core/server/api";
|
||||
import type { Admission, BedStatus, FacilityBed, Permission, Room } from "@/modules/core/types";
|
||||
import type { Elder } from "@/modules/elders/types";
|
||||
|
||||
type BedsWorkspaceProps = {
|
||||
initialRooms: Room[];
|
||||
initialBeds: FacilityBed[];
|
||||
initialAdmissions: Admission[];
|
||||
initialElders: Elder[];
|
||||
permissions: Permission[];
|
||||
};
|
||||
|
||||
type WorkspaceTab = "overview" | "operations" | "history";
|
||||
|
||||
const bedStatusLabels: Record<BedStatus, string> = {
|
||||
available: "空闲",
|
||||
occupied: "占用",
|
||||
maintenance: "维修",
|
||||
disabled: "停用",
|
||||
};
|
||||
|
||||
const admissionStatusLabels: Record<Admission["status"], string> = {
|
||||
active: "在住",
|
||||
transferred: "已换床",
|
||||
discharged: "已退住",
|
||||
};
|
||||
|
||||
function formatDateTime(value: string): string {
|
||||
return new Date(value).toLocaleString("zh-CN");
|
||||
}
|
||||
|
||||
function bedBadgeVariant(status: BedStatus): "success" | "secondary" | "warning" | "danger" {
|
||||
switch (status) {
|
||||
case "available":
|
||||
return "success";
|
||||
case "occupied":
|
||||
return "secondary";
|
||||
case "maintenance":
|
||||
return "warning";
|
||||
case "disabled":
|
||||
return "danger";
|
||||
}
|
||||
}
|
||||
|
||||
function admissionBedLabel(admission: Admission): string {
|
||||
return `${admission.roomName}-${admission.bedCode}`;
|
||||
}
|
||||
|
||||
function makeSelectOptions(items: Array<{ id: string; label: string }>, emptyLabel: string): SelectOption[] {
|
||||
return [
|
||||
{ value: "", label: emptyLabel, disabled: true },
|
||||
...items.map((item) => ({ value: item.id, label: item.label })),
|
||||
];
|
||||
}
|
||||
|
||||
export function BedsWorkspace({
|
||||
initialRooms,
|
||||
initialBeds,
|
||||
initialAdmissions,
|
||||
initialElders,
|
||||
permissions,
|
||||
}: BedsWorkspaceProps): React.ReactElement {
|
||||
const [rooms, setRooms] = useState(initialRooms);
|
||||
const [beds, setBeds] = useState(initialBeds);
|
||||
const [admissions, setAdmissions] = useState(initialAdmissions);
|
||||
const [elders, setElders] = useState(initialElders);
|
||||
const [activeTab, setActiveTab] = useState<WorkspaceTab>("overview");
|
||||
const [message, setMessage] = useState("");
|
||||
const [isPending, setIsPending] = useState(false);
|
||||
const [admitElderId, setAdmitElderId] = useState("");
|
||||
const [admitBedId, setAdmitBedId] = useState("");
|
||||
const [admitNotes, setAdmitNotes] = useState("");
|
||||
const [transferAdmissionId, setTransferAdmissionId] = useState("");
|
||||
const [transferBedId, setTransferBedId] = useState("");
|
||||
const [transferNotes, setTransferNotes] = useState("");
|
||||
const [dischargeAdmissionId, setDischargeAdmissionId] = useState("");
|
||||
const [dischargeNotes, setDischargeNotes] = useState("");
|
||||
|
||||
const canManageAdmissions = permissions.includes("admission:manage");
|
||||
const activeAdmissions = useMemo(() => admissions.filter((admission) => admission.status === "active"), [admissions]);
|
||||
const activeElderIds = useMemo(() => new Set(activeAdmissions.map((admission) => admission.elderId)), [activeAdmissions]);
|
||||
const availableBeds = useMemo(() => beds.filter((bed) => bed.status === "available"), [beds]);
|
||||
const occupiedBeds = beds.filter((bed) => bed.status === "occupied").length;
|
||||
const maintenanceBeds = beds.filter((bed) => bed.status === "maintenance").length;
|
||||
const occupancyRate = beds.length > 0 ? Math.round((occupiedBeds / beds.length) * 100) : 0;
|
||||
const admissionEligibleElders = elders.filter((elder) => !activeElderIds.has(elder.id));
|
||||
|
||||
const elderOptions = makeSelectOptions(
|
||||
admissionEligibleElders.map((elder) => ({ id: elder.id, label: `${elder.name} / ${elder.phone}` })),
|
||||
"选择老人",
|
||||
);
|
||||
const bedOptions = makeSelectOptions(
|
||||
availableBeds.map((bed) => ({ id: bed.id, label: `${bed.roomName}-${bed.code}` })),
|
||||
"选择空闲床位",
|
||||
);
|
||||
const activeAdmissionOptions = makeSelectOptions(
|
||||
activeAdmissions.map((admission) => ({
|
||||
id: admission.id,
|
||||
label: `${admission.elderName} / ${admissionBedLabel(admission)}`,
|
||||
})),
|
||||
"选择在住记录",
|
||||
);
|
||||
|
||||
async function refreshData(): Promise<void> {
|
||||
const [eldersResponse, roomsResponse, bedsResponse, admissionsResponse] = await Promise.all([
|
||||
fetch("/api/elders"),
|
||||
fetch("/api/facilities/rooms"),
|
||||
fetch("/api/facilities/beds"),
|
||||
fetch("/api/admissions"),
|
||||
]);
|
||||
const [eldersResult, roomsResult, bedsResult, admissionsResult] = (await Promise.all([
|
||||
eldersResponse.json(),
|
||||
roomsResponse.json(),
|
||||
bedsResponse.json(),
|
||||
admissionsResponse.json(),
|
||||
])) as [
|
||||
ApiResult<{ elders: Elder[] }>,
|
||||
ApiResult<{ rooms: Room[] }>,
|
||||
ApiResult<{ beds: FacilityBed[] }>,
|
||||
ApiResult<{ admissions: Admission[] }>,
|
||||
];
|
||||
|
||||
if (eldersResult.success) {
|
||||
setElders(eldersResult.elders);
|
||||
}
|
||||
if (roomsResult.success) {
|
||||
setRooms(roomsResult.rooms);
|
||||
}
|
||||
if (bedsResult.success) {
|
||||
setBeds(bedsResult.beds);
|
||||
}
|
||||
if (admissionsResult.success) {
|
||||
setAdmissions(admissionsResult.admissions);
|
||||
}
|
||||
}
|
||||
|
||||
async function submitAdmission(event: FormEvent<HTMLFormElement>): Promise<void> {
|
||||
event.preventDefault();
|
||||
if (!canManageAdmissions) {
|
||||
setMessage("当前角色无权办理入住");
|
||||
return;
|
||||
}
|
||||
if (!admitElderId || !admitBedId) {
|
||||
setMessage("请选择老人和空闲床位");
|
||||
return;
|
||||
}
|
||||
|
||||
setIsPending(true);
|
||||
setMessage("");
|
||||
const response = await fetch("/api/admissions", {
|
||||
method: "POST",
|
||||
headers: { "content-type": "application/json" },
|
||||
body: JSON.stringify({ elderId: admitElderId, bedId: admitBedId, notes: admitNotes }),
|
||||
});
|
||||
const result = (await response.json()) as ApiResult<{ admission: Admission }>;
|
||||
setIsPending(false);
|
||||
|
||||
if (!result.success) {
|
||||
setMessage(result.reason);
|
||||
return;
|
||||
}
|
||||
|
||||
setAdmitElderId("");
|
||||
setAdmitBedId("");
|
||||
setAdmitNotes("");
|
||||
await refreshData();
|
||||
setMessage(result.reason);
|
||||
}
|
||||
|
||||
async function submitTransfer(event: FormEvent<HTMLFormElement>): Promise<void> {
|
||||
event.preventDefault();
|
||||
const admission = activeAdmissions.find((item) => item.id === transferAdmissionId);
|
||||
if (!canManageAdmissions) {
|
||||
setMessage("当前角色无权办理换床");
|
||||
return;
|
||||
}
|
||||
if (!admission || !transferBedId) {
|
||||
setMessage("请选择在住记录和新床位");
|
||||
return;
|
||||
}
|
||||
|
||||
setIsPending(true);
|
||||
setMessage("");
|
||||
const response = await fetch("/api/admissions", {
|
||||
method: "POST",
|
||||
headers: { "content-type": "application/json" },
|
||||
body: JSON.stringify({ elderId: admission.elderId, bedId: transferBedId, notes: transferNotes || "办理换床" }),
|
||||
});
|
||||
const result = (await response.json()) as ApiResult<{ admission: Admission }>;
|
||||
setIsPending(false);
|
||||
|
||||
if (!result.success) {
|
||||
setMessage(result.reason);
|
||||
return;
|
||||
}
|
||||
|
||||
setTransferAdmissionId("");
|
||||
setTransferBedId("");
|
||||
setTransferNotes("");
|
||||
await refreshData();
|
||||
setMessage("换床已办理");
|
||||
}
|
||||
|
||||
async function submitDischarge(event: FormEvent<HTMLFormElement>): Promise<void> {
|
||||
event.preventDefault();
|
||||
if (!canManageAdmissions) {
|
||||
setMessage("当前角色无权办理退住");
|
||||
return;
|
||||
}
|
||||
if (!dischargeAdmissionId) {
|
||||
setMessage("请选择在住记录");
|
||||
return;
|
||||
}
|
||||
|
||||
setIsPending(true);
|
||||
setMessage("");
|
||||
const response = await fetch(`/api/admissions/${dischargeAdmissionId}`, {
|
||||
method: "PATCH",
|
||||
headers: { "content-type": "application/json" },
|
||||
body: JSON.stringify({ notes: dischargeNotes }),
|
||||
});
|
||||
const result = (await response.json()) as ApiResult<{ admission: Admission }>;
|
||||
setIsPending(false);
|
||||
|
||||
if (!result.success) {
|
||||
setMessage(result.reason);
|
||||
return;
|
||||
}
|
||||
|
||||
setDischargeAdmissionId("");
|
||||
setDischargeNotes("");
|
||||
await refreshData();
|
||||
setMessage(result.reason);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="mx-auto flex w-full max-w-7xl flex-col gap-5">
|
||||
<section className="flex flex-col gap-4 border-b pb-5 lg:flex-row lg:items-end lg:justify-between">
|
||||
<div>
|
||||
<Badge variant="success">床位工作区</Badge>
|
||||
<h1 className="mt-3 text-3xl font-semibold tracking-normal">床位房间</h1>
|
||||
<p className="mt-2 text-sm text-muted-foreground">查看占用、办理入住、换床和退住。</p>
|
||||
</div>
|
||||
<div className="flex flex-wrap gap-2" role="tablist" aria-label="床位工作区">
|
||||
{[
|
||||
{ value: "overview", label: "概览" },
|
||||
{ value: "operations", label: "办理" },
|
||||
{ value: "history", label: "记录" },
|
||||
].map((tab) => (
|
||||
<Button
|
||||
aria-selected={activeTab === tab.value}
|
||||
key={tab.value}
|
||||
onClick={() => setActiveTab(tab.value as WorkspaceTab)}
|
||||
type="button"
|
||||
variant={activeTab === tab.value ? "default" : "outline"}
|
||||
>
|
||||
{tab.label}
|
||||
</Button>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{message ? (
|
||||
<p className="rounded-md bg-secondary px-3 py-2 text-sm text-secondary-foreground" role="status">
|
||||
{message}
|
||||
</p>
|
||||
) : null}
|
||||
|
||||
{activeTab === "overview" ? (
|
||||
<>
|
||||
<section className="grid gap-4 md:grid-cols-2 xl:grid-cols-4">
|
||||
<Card>
|
||||
<CardHeader className="flex flex-row items-center justify-between space-y-0">
|
||||
<div>
|
||||
<CardDescription>房间</CardDescription>
|
||||
<CardTitle className="mt-2 text-3xl">{rooms.length}</CardTitle>
|
||||
</div>
|
||||
<DoorOpen className="size-5 text-primary" aria-hidden="true" />
|
||||
</CardHeader>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader className="flex flex-row items-center justify-between space-y-0">
|
||||
<div>
|
||||
<CardDescription>床位</CardDescription>
|
||||
<CardTitle className="mt-2 text-3xl">{beds.length}</CardTitle>
|
||||
</div>
|
||||
<BedDouble className="size-5 text-primary" aria-hidden="true" />
|
||||
</CardHeader>
|
||||
<CardContent className="pt-0">
|
||||
<p className="text-sm text-muted-foreground">占用率 {occupancyRate}%</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
<Card className={maintenanceBeds > 0 ? "border-amber-200 bg-amber-50/70" : undefined}>
|
||||
<CardHeader className="flex flex-row items-center justify-between space-y-0">
|
||||
<div>
|
||||
<CardDescription className={maintenanceBeds > 0 ? "text-amber-700" : undefined}>维修床位</CardDescription>
|
||||
<CardTitle className={maintenanceBeds > 0 ? "mt-2 text-3xl text-amber-700" : "mt-2 text-3xl"}>
|
||||
{maintenanceBeds}
|
||||
</CardTitle>
|
||||
</div>
|
||||
<Wrench className={maintenanceBeds > 0 ? "size-5 text-amber-700" : "size-5 text-primary"} aria-hidden="true" />
|
||||
</CardHeader>
|
||||
</Card>
|
||||
<Card>
|
||||
<CardHeader className="flex flex-row items-center justify-between space-y-0">
|
||||
<div>
|
||||
<CardDescription>在住</CardDescription>
|
||||
<CardTitle className="mt-2 text-3xl">{activeAdmissions.length}</CardTitle>
|
||||
</div>
|
||||
<History className="size-5 text-primary" aria-hidden="true" />
|
||||
</CardHeader>
|
||||
</Card>
|
||||
</section>
|
||||
|
||||
<section className="grid gap-4 xl:grid-cols-[0.9fr_1.1fr]">
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>房间台账</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="overflow-x-auto rounded-md border">
|
||||
<Table className="w-full min-w-[620px] text-sm">
|
||||
<Table.Header className="bg-secondary text-left text-xs text-muted-foreground">
|
||||
<Table.Row>
|
||||
<Table.Head className="px-4 py-3 font-medium">房间</Table.Head>
|
||||
<Table.Head className="px-4 py-3 font-medium">编号</Table.Head>
|
||||
<Table.Head className="px-4 py-3 font-medium">容量</Table.Head>
|
||||
<Table.Head className="px-4 py-3 font-medium">床位</Table.Head>
|
||||
<Table.Head className="px-4 py-3 font-medium">状态</Table.Head>
|
||||
</Table.Row>
|
||||
</Table.Header>
|
||||
<Table.Body className="divide-y bg-card">
|
||||
{rooms.map((room) => (
|
||||
<Table.Row key={room.id}>
|
||||
<Table.Cell className="px-4 py-3 font-medium">{room.name}</Table.Cell>
|
||||
<Table.Cell className="px-4 py-3 text-muted-foreground">{room.code}</Table.Cell>
|
||||
<Table.Cell className="px-4 py-3">{room.capacity}</Table.Cell>
|
||||
<Table.Cell className="px-4 py-3">
|
||||
{room.occupiedBedCount}/{room.bedCount}
|
||||
</Table.Cell>
|
||||
<Table.Cell className="px-4 py-3">
|
||||
<Badge variant={room.status === "active" ? "success" : "danger"}>{room.status}</Badge>
|
||||
</Table.Cell>
|
||||
</Table.Row>
|
||||
))}
|
||||
{rooms.length === 0 ? (
|
||||
<Table.Row>
|
||||
<Table.Cell className="px-4 py-8 text-center text-muted-foreground" colSpan={5}>
|
||||
暂无房间主数据
|
||||
</Table.Cell>
|
||||
</Table.Row>
|
||||
) : null}
|
||||
</Table.Body>
|
||||
</Table>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>床位状态</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="overflow-x-auto rounded-md border">
|
||||
<Table className="w-full min-w-[700px] text-sm">
|
||||
<Table.Header className="bg-secondary text-left text-xs text-muted-foreground">
|
||||
<Table.Row>
|
||||
<Table.Head className="px-4 py-3 font-medium">房间</Table.Head>
|
||||
<Table.Head className="px-4 py-3 font-medium">床位</Table.Head>
|
||||
<Table.Head className="px-4 py-3 font-medium">状态</Table.Head>
|
||||
<Table.Head className="px-4 py-3 font-medium">当前老人</Table.Head>
|
||||
<Table.Head className="px-4 py-3 font-medium">备注</Table.Head>
|
||||
</Table.Row>
|
||||
</Table.Header>
|
||||
<Table.Body className="divide-y bg-card">
|
||||
{beds.map((bed) => (
|
||||
<Table.Row key={bed.id}>
|
||||
<Table.Cell className="px-4 py-3">{bed.roomName}</Table.Cell>
|
||||
<Table.Cell className="px-4 py-3 font-medium">{bed.code}</Table.Cell>
|
||||
<Table.Cell className="px-4 py-3">
|
||||
<Badge variant={bedBadgeVariant(bed.status)}>{bedStatusLabels[bed.status]}</Badge>
|
||||
</Table.Cell>
|
||||
<Table.Cell className="px-4 py-3">{bed.currentElderName ?? "-"}</Table.Cell>
|
||||
<Table.Cell className="px-4 py-3 text-muted-foreground">{bed.notes || "-"}</Table.Cell>
|
||||
</Table.Row>
|
||||
))}
|
||||
{beds.length === 0 ? (
|
||||
<Table.Row>
|
||||
<Table.Cell className="px-4 py-8 text-center text-muted-foreground" colSpan={5}>
|
||||
暂无床位主数据
|
||||
</Table.Cell>
|
||||
</Table.Row>
|
||||
) : null}
|
||||
</Table.Body>
|
||||
</Table>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</section>
|
||||
</>
|
||||
) : null}
|
||||
|
||||
{activeTab === "operations" ? (
|
||||
<section className="grid gap-4 xl:grid-cols-3">
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<UserCheck className="size-5 text-primary" aria-hidden="true" />
|
||||
办理入住
|
||||
</CardTitle>
|
||||
<CardDescription>选择未在住老人和空闲床位。</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<form className="grid gap-3" onSubmit={(event) => void submitAdmission(event)}>
|
||||
<Select
|
||||
aria-label="入住老人"
|
||||
disabled={!canManageAdmissions || isPending}
|
||||
onValueChange={setAdmitElderId}
|
||||
options={elderOptions}
|
||||
value={admitElderId}
|
||||
/>
|
||||
<Select
|
||||
aria-label="入住房间床位"
|
||||
disabled={!canManageAdmissions || isPending}
|
||||
onValueChange={setAdmitBedId}
|
||||
options={bedOptions}
|
||||
value={admitBedId}
|
||||
/>
|
||||
<Textarea
|
||||
aria-label="入住备注"
|
||||
disabled={!canManageAdmissions || isPending}
|
||||
onChange={(event) => setAdmitNotes(event.target.value)}
|
||||
placeholder="备注"
|
||||
value={admitNotes}
|
||||
/>
|
||||
<Button disabled={!canManageAdmissions || isPending} type="submit">
|
||||
<UserCheck className="size-4" aria-hidden="true" />
|
||||
办理入住
|
||||
</Button>
|
||||
</form>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<MoveRight className="size-5 text-primary" aria-hidden="true" />
|
||||
办理换床
|
||||
</CardTitle>
|
||||
<CardDescription>换床会释放原床位并占用新床位。</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<form className="grid gap-3" onSubmit={(event) => void submitTransfer(event)}>
|
||||
<Select
|
||||
aria-label="换床入住记录"
|
||||
disabled={!canManageAdmissions || isPending}
|
||||
onValueChange={setTransferAdmissionId}
|
||||
options={activeAdmissionOptions}
|
||||
value={transferAdmissionId}
|
||||
/>
|
||||
<Select
|
||||
aria-label="换床新床位"
|
||||
disabled={!canManageAdmissions || isPending}
|
||||
onValueChange={setTransferBedId}
|
||||
options={bedOptions}
|
||||
value={transferBedId}
|
||||
/>
|
||||
<Textarea
|
||||
aria-label="换床备注"
|
||||
disabled={!canManageAdmissions || isPending}
|
||||
onChange={(event) => setTransferNotes(event.target.value)}
|
||||
placeholder="备注"
|
||||
value={transferNotes}
|
||||
/>
|
||||
<Button disabled={!canManageAdmissions || isPending} type="submit" variant="outline">
|
||||
<MoveRight className="size-4" aria-hidden="true" />
|
||||
办理换床
|
||||
</Button>
|
||||
</form>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<UserMinus className="size-5 text-primary" aria-hidden="true" />
|
||||
办理退住
|
||||
</CardTitle>
|
||||
<CardDescription>退住会关闭入住记录并释放床位。</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<form className="grid gap-3" onSubmit={(event) => void submitDischarge(event)}>
|
||||
<Select
|
||||
aria-label="退住入住记录"
|
||||
disabled={!canManageAdmissions || isPending}
|
||||
onValueChange={setDischargeAdmissionId}
|
||||
options={activeAdmissionOptions}
|
||||
value={dischargeAdmissionId}
|
||||
/>
|
||||
<Textarea
|
||||
aria-label="退住备注"
|
||||
disabled={!canManageAdmissions || isPending}
|
||||
onChange={(event) => setDischargeNotes(event.target.value)}
|
||||
placeholder="备注"
|
||||
value={dischargeNotes}
|
||||
/>
|
||||
<Button disabled={!canManageAdmissions || isPending} type="submit" variant="destructive">
|
||||
<UserMinus className="size-4" aria-hidden="true" />
|
||||
办理退住
|
||||
</Button>
|
||||
</form>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</section>
|
||||
) : null}
|
||||
|
||||
{activeTab === "history" ? (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>入住、换床与退住记录</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="overflow-x-auto rounded-md border">
|
||||
<Table className="w-full min-w-[820px] text-sm">
|
||||
<Table.Header className="bg-secondary text-left text-xs text-muted-foreground">
|
||||
<Table.Row>
|
||||
<Table.Head className="px-4 py-3 font-medium">老人</Table.Head>
|
||||
<Table.Head className="px-4 py-3 font-medium">床位</Table.Head>
|
||||
<Table.Head className="px-4 py-3 font-medium">状态</Table.Head>
|
||||
<Table.Head className="px-4 py-3 font-medium">入住时间</Table.Head>
|
||||
<Table.Head className="px-4 py-3 font-medium">结束时间</Table.Head>
|
||||
<Table.Head className="px-4 py-3 font-medium">备注</Table.Head>
|
||||
</Table.Row>
|
||||
</Table.Header>
|
||||
<Table.Body className="divide-y bg-card">
|
||||
{admissions.map((admission) => (
|
||||
<Table.Row key={admission.id}>
|
||||
<Table.Cell className="px-4 py-3 font-medium">{admission.elderName}</Table.Cell>
|
||||
<Table.Cell className="px-4 py-3">{admissionBedLabel(admission)}</Table.Cell>
|
||||
<Table.Cell className="px-4 py-3">
|
||||
<Badge variant={admission.status === "active" ? "success" : "secondary"}>
|
||||
{admissionStatusLabels[admission.status]}
|
||||
</Badge>
|
||||
</Table.Cell>
|
||||
<Table.Cell className="px-4 py-3 text-muted-foreground">{formatDateTime(admission.admittedAt)}</Table.Cell>
|
||||
<Table.Cell className="px-4 py-3 text-muted-foreground">
|
||||
{admission.dischargedAt ? formatDateTime(admission.dischargedAt) : "-"}
|
||||
</Table.Cell>
|
||||
<Table.Cell className="px-4 py-3 text-muted-foreground">{admission.notes || "-"}</Table.Cell>
|
||||
</Table.Row>
|
||||
))}
|
||||
{admissions.length === 0 ? (
|
||||
<Table.Row>
|
||||
<Table.Cell className="px-4 py-8 text-center text-muted-foreground" colSpan={6}>
|
||||
暂无入住记录
|
||||
</Table.Cell>
|
||||
</Table.Row>
|
||||
) : null}
|
||||
</Table.Body>
|
||||
</Table>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
) : null}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user