chore: finish workspace cleanup

modules/health/components/HealthWorkspacePage.tsx

@@ -1,13 +1,52 @@
 import { redirect } from "next/navigation";
-import { HeartPulse } from "lucide-react";
+import { Activity, FileText, HeartPulse, ShieldAlert, Stethoscope } from "lucide-react";
 
+import { Badge } from "@/components/ui/badge";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import { Table } from "@/components/ui/table";
 import { getCurrentAuthContext } from "@/modules/core/server/auth";
 import { hasPermission } from "@/modules/core/server/permissions";
 import { HealthAdminClient } from "@/modules/health/components/HealthAdminClient";
 import { listHealthAdminData } from "@/modules/health/server/operations";
+import type { HealthReviewSeverity, HealthReviewStatus } from "@/modules/health/types";
+import {
+  CHRONIC_CONDITION_STATUS_LABELS,
+  HEALTH_REVIEW_SEVERITY_LABELS,
+  HEALTH_REVIEW_STATUS_LABELS,
+  VITAL_SOURCE_LABELS,
+} from "@/modules/health/types";
 import { getWorkspaceHref } from "@/modules/shared/lib/workspace-routing";
 
-export async function renderHealthWorkspacePage(): Promise<React.ReactElement> {
+type HealthPageData = {
+  canManage: boolean;
+  data: Awaited<ReturnType<typeof listHealthAdminData>>;
+};
+
+function formatDateTime(value: string | undefined): string {
+  return value ? new Date(value).toLocaleString("zh-CN") : "-";
+}
+
+function formatTenths(value: number | undefined, suffix = ""): string {
+  return value === undefined ? "-" : `${(value / 10).toFixed(1)}${suffix}`;
+}
+
+function severityBadgeVariant(severity: HealthReviewSeverity): "secondary" | "warning" | "danger" {
+  if (severity === "critical") {
+    return "danger";
+  }
+
+  return severity === "warning" ? "warning" : "secondary";
+}
+
+function reviewStatusBadgeVariant(status: HealthReviewStatus): "success" | "secondary" | "warning" {
+  if (status === "pending") {
+    return "warning";
+  }
+
+  return status === "resolved" ? "success" : "secondary";
+}
+
+async function loadHealthPageData(): Promise<HealthPageData> {
   const context = await getCurrentAuthContext();
   if (!context) {
     redirect("/login");
@@ -23,6 +62,17 @@ export async function renderHealthWorkspacePage(): Promise<React.ReactElement> {
   }
 
   const data = await listHealthAdminData(organizationId);
+  return {
+    canManage: hasPermission(context.permissions, "health:manage"),
+    data,
+  };
+}
+
+export async function renderHealthWorkspacePage(): Promise<React.ReactElement> {
+  const { data } = await loadHealthPageData();
+  const pendingReviews = data.reviews.filter((review) => review.status === "pending").slice(0, 8);
+  const recentVitals = data.vitals.slice(0, 8);
+  const activeConditions = data.chronicConditions.filter((condition) => condition.status === "active").slice(0, 8);
 
   return (
     <div className="mx-auto flex w-full max-w-7xl flex-col gap-5">
@@ -33,12 +83,172 @@ export async function renderHealthWorkspacePage(): Promise<React.ReactElement> {
           </span>
           <div className="min-w-0">
             <h1 className="truncate text-xl font-semibold tracking-normal">健康照护</h1>
-            <p className="mt-1 truncate text-sm text-muted-foreground">健康档案、生命体征、慢病管理与异常复核</p>
+            <p className="mt-1 truncate text-sm text-muted-foreground">健康概览、重点慢病、生命体征与异常复核队列</p>
           </div>
         </div>
       </section>
 
-      <HealthAdminClient canManage={hasPermission(context.permissions, "health:manage")} initialData={data} />
+      <section className="grid gap-4 md:grid-cols-2 xl:grid-cols-4">
+        <MetricCard icon={<FileText className="size-4" aria-hidden="true" />} label="健康档案" value={data.metrics.eldersWithProfiles} />
+        <MetricCard icon={<Activity className="size-4" aria-hidden="true" />} label="今日体征" value={data.metrics.vitalsToday} />
+        <MetricCard icon={<Stethoscope className="size-4" aria-hidden="true" />} label="慢病管理" value={data.metrics.activeChronicConditions} />
+        <MetricCard icon={<ShieldAlert className="size-4" aria-hidden="true" />} label="待复核" value={data.metrics.pendingReviews} />
+      </section>
+
+      <section className="grid gap-4 xl:grid-cols-[1.1fr_0.9fr]">
+        <Card>
+          <CardHeader>
+            <CardTitle>待复核健康异常</CardTitle>
+            <CardDescription>按最新异常记录展示护理复核队列。</CardDescription>
+          </CardHeader>
+          <CardContent className="overflow-x-auto">
+            <Table className="w-full min-w-[720px] 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">
+                {pendingReviews.map((review) => (
+                  <Table.Row key={review.id}>
+                    <Table.Cell className="px-4 py-3 font-medium">{review.elderName}</Table.Cell>
+                    <Table.Cell className="px-4 py-3">
+                      <p className="font-medium">{review.title}</p>
+                      <p className="text-xs text-muted-foreground">{review.description}</p>
+                    </Table.Cell>
+                    <Table.Cell className="px-4 py-3">
+                      <Badge variant={severityBadgeVariant(review.severity)}>
+                        {HEALTH_REVIEW_SEVERITY_LABELS[review.severity]}
+                      </Badge>
+                    </Table.Cell>
+                    <Table.Cell className="px-4 py-3">
+                      <Badge variant={reviewStatusBadgeVariant(review.status)}>
+                        {HEALTH_REVIEW_STATUS_LABELS[review.status]}
+                      </Badge>
+                    </Table.Cell>
+                    <Table.Cell className="px-4 py-3 text-muted-foreground">{formatDateTime(review.createdAt)}</Table.Cell>
+                  </Table.Row>
+                ))}
+                {pendingReviews.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>
+          </CardContent>
+        </Card>
+
+        <Card>
+          <CardHeader>
+            <CardTitle>慢病重点关注</CardTitle>
+            <CardDescription>持续管理中的慢病记录。</CardDescription>
+          </CardHeader>
+          <CardContent className="grid gap-2">
+            {activeConditions.map((condition) => (
+              <div className="rounded-md border p-3" key={condition.id}>
+                <div className="flex items-start justify-between gap-3">
+                  <div className="min-w-0">
+                    <p className="truncate text-sm font-medium">{condition.elderName}</p>
+                    <p className="mt-1 text-xs text-muted-foreground">{condition.name}</p>
+                  </div>
+                  <Badge variant="warning">{CHRONIC_CONDITION_STATUS_LABELS[condition.status]}</Badge>
+                </div>
+                <p className="mt-2 text-xs text-muted-foreground">{condition.followUpNotes || condition.treatmentNotes || "暂无随访备注"}</p>
+              </div>
+            ))}
+            {activeConditions.length === 0 ? <p className="text-sm text-muted-foreground">暂无持续管理慢病记录</p> : null}
+          </CardContent>
+        </Card>
+      </section>
+
+      <Card>
+        <CardHeader>
+          <CardTitle>最近生命体征</CardTitle>
+          <CardDescription>展示最新录入或采集的生命体征记录。</CardDescription>
+        </CardHeader>
+        <CardContent className="overflow-x-auto">
+          <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.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">
+              {recentVitals.map((vital) => (
+                <Table.Row key={vital.id}>
+                  <Table.Cell className="px-4 py-3 font-medium">{vital.elderName}</Table.Cell>
+                  <Table.Cell className="px-4 py-3 text-muted-foreground">{formatDateTime(vital.recordedAt)}</Table.Cell>
+                  <Table.Cell className="px-4 py-3">{VITAL_SOURCE_LABELS[vital.source]}</Table.Cell>
+                  <Table.Cell className="px-4 py-3">
+                    {vital.systolicBp && vital.diastolicBp ? `${vital.systolicBp}/${vital.diastolicBp}` : "-"}
+                  </Table.Cell>
+                  <Table.Cell className="px-4 py-3">{vital.heartRate?.toString() ?? "-"}</Table.Cell>
+                  <Table.Cell className="px-4 py-3">{formatTenths(vital.temperatureTenths, "°C")}</Table.Cell>
+                  <Table.Cell className="px-4 py-3">{vital.spo2 === undefined ? "-" : `${vital.spo2}%`}</Table.Cell>
+                  <Table.Cell className="px-4 py-3 text-muted-foreground">{vital.notes || "-"}</Table.Cell>
+                </Table.Row>
+              ))}
+              {recentVitals.length === 0 ? (
+                <Table.Row>
+                  <Table.Cell className="px-4 py-8 text-center text-muted-foreground" colSpan={8}>
+                    暂无生命体征记录
+                  </Table.Cell>
+                </Table.Row>
+              ) : null}
+            </Table.Body>
+          </Table>
+        </CardContent>
+      </Card>
     </div>
   );
 }
+
+export async function renderHealthSettingsPage(): Promise<React.ReactElement> {
+  const { canManage, data } = await loadHealthPageData();
+
+  return (
+    <div className="mx-auto flex w-full max-w-7xl flex-col gap-5">
+      <section className="flex flex-col gap-3 border-b pb-4 lg:flex-row lg:items-start lg:justify-between">
+        <div className="flex min-w-0 items-center gap-3">
+          <span className="inline-flex size-9 items-center justify-center rounded-md bg-secondary text-primary">
+            <HeartPulse className="size-4" aria-hidden="true" />
+          </span>
+          <div className="min-w-0">
+            <h1 className="truncate text-xl font-semibold tracking-normal">健康数据管理</h1>
+            <p className="mt-1 truncate text-sm text-muted-foreground">维护健康档案、生命体征、慢病记录与异常复核</p>
+          </div>
+        </div>
+      </section>
+
+      <HealthAdminClient canManage={canManage} initialData={data} />
+    </div>
+  );
+}
+
+function MetricCard({ icon, label, value }: { icon: React.ReactNode; label: string; value: number }): React.ReactElement {
+  return (
+    <Card>
+      <CardHeader className="flex flex-row items-center justify-between space-y-0">
+        <CardDescription>{label}</CardDescription>
+        <span className="text-primary">{icon}</span>
+      </CardHeader>
+      <CardContent>
+        <CardTitle className="text-3xl">{value}</CardTitle>
+      </CardContent>
+    </Card>
+  );
+}