chore: finish workspace cleanup

This commit is contained in:
2026-07-03 04:04:54 -07:00
parent 901e36b7a7
commit c4d5222ddd
9 changed files with 278 additions and 175 deletions

View File

@@ -11,6 +11,7 @@ import {
HeartPulse,
LayoutDashboard,
ListChecks,
LockKeyhole,
Radio,
Settings,
ShieldAlert,
@@ -49,7 +50,15 @@ type AppSidebarNavProps = {
permissions: Permission[];
};
type SidebarNavItem = NavItem & {
canAccess: boolean;
};
function canViewNavItem(item: NavItem, permissions: readonly Permission[]): boolean {
if (permissions.includes("platform:manage")) {
return true;
}
if (item.permission && !permissions.includes(item.permission)) {
return false;
}
@@ -63,12 +72,13 @@ function canViewNavItem(item: NavItem, permissions: readonly Permission[]): bool
export function AppSidebarNav({ organizationSlug, permissions }: AppSidebarNavProps): React.ReactElement {
const pathname = usePathname();
const visibleNavGroups = navGroups
.map((group) => ({
...group,
items: group.items.filter((item) => canViewNavItem(item, permissions)),
}))
.filter((group) => group.items.length > 0);
const visibleNavGroups = navGroups.map((group): { label: string; items: SidebarNavItem[] } => ({
...group,
items: group.items.map((item) => ({
...item,
canAccess: canViewNavItem(item, permissions),
})),
}));
return (
<nav className="min-h-0 flex-1 overflow-y-auto px-3 py-4" aria-label="主导航">
@@ -80,29 +90,42 @@ export function AppSidebarNav({ organizationSlug, permissions }: AppSidebarNavPr
{group.items.map((item) => {
const Icon = iconMap[item.icon];
const href = getWorkspaceHref(organizationSlug, item.path);
const isActive = isWorkspacePathActive(pathname, item.path);
const isActive = item.canAccess && isWorkspacePathActive(pathname, item.path);
return (
<li key={item.path}>
<Link
href={href}
aria-current={isActive ? "page" : undefined}
className={cn(
"group flex min-h-11 items-center gap-3 rounded-md px-3 text-sm transition-colors",
isActive
? "bg-primary text-primary-foreground shadow-sm"
: "text-foreground hover:bg-secondary hover:text-primary",
)}
>
<Icon
{item.canAccess ? (
<Link
href={href}
aria-current={isActive ? "page" : undefined}
className={cn(
"size-4 shrink-0 transition-colors",
isActive ? "text-primary-foreground" : "text-muted-foreground group-hover:text-primary",
"group flex min-h-11 items-center gap-3 rounded-md px-3 text-sm transition-colors",
isActive
? "bg-primary text-primary-foreground shadow-sm"
: "text-foreground hover:bg-secondary hover:text-primary",
)}
aria-hidden="true"
/>
<span className="min-w-0 truncate font-medium">{item.label}</span>
</Link>
>
<Icon
className={cn(
"size-4 shrink-0 transition-colors",
isActive ? "text-primary-foreground" : "text-muted-foreground group-hover:text-primary",
)}
aria-hidden="true"
/>
<span className="min-w-0 truncate font-medium">{item.label}</span>
</Link>
) : (
<span
className="flex min-h-11 cursor-not-allowed items-center gap-3 rounded-md px-3 text-sm text-muted-foreground/70"
aria-disabled="true"
title="当前角色无权访问"
>
<Icon className="size-4 shrink-0 text-muted-foreground/60" aria-hidden="true" />
<span className="min-w-0 flex-1 truncate font-medium">{item.label}</span>
<LockKeyhole className="size-3.5 shrink-0 text-muted-foreground/55" aria-hidden="true" />
<span className="sr-only">访</span>
</span>
)}
</li>
);
})}

View File

@@ -1,52 +0,0 @@
import type { LucideIcon } from "lucide-react";
import { Database } from "lucide-react";
import { Badge } from "@/components/ui/badge";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
type ModulePageProps = {
title: string;
eyebrow: string;
description: string;
icon: LucideIcon;
phase: "待接入" | "二期预留" | "三期预留";
};
export function ModulePage({ title, eyebrow, description, icon: Icon, phase }: ModulePageProps): React.ReactElement {
return (
<div className="mx-auto flex w-full max-w-7xl flex-col gap-6">
<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">
<Icon className="size-4" aria-hidden="true" />
</span>
<div className="min-w-0">
<div className="flex items-center gap-2">
<h1 className="truncate text-xl font-semibold tracking-normal">{title}</h1>
<Badge variant="secondary">{phase}</Badge>
</div>
<p className="mt-1 truncate text-sm text-muted-foreground">{eyebrow}</p>
<p className="mt-2 max-w-3xl text-sm text-muted-foreground">{description}</p>
</div>
</div>
</section>
<section>
<Card className="max-w-3xl">
<CardHeader>
<CardTitle className="flex items-center gap-2 text-base">
<Database className="size-5 text-primary" aria-hidden="true" />
</CardTitle>
<CardDescription></CardDescription>
</CardHeader>
<CardContent>
<p className="text-sm text-muted-foreground">
Drizzle API
</p>
</CardContent>
</Card>
</section>
</div>
);
}

View File

@@ -1,51 +0,0 @@
import { Bell, Radio, TabletSmartphone, Wrench } from "lucide-react";
import { ModulePage } from "@/modules/shared/components/ModulePage";
export function DevicesModulePage(): React.ReactElement {
return (
<ModulePage
title="设备运维"
eyebrow="设备台账与维修工单"
description="待接入设备台账、故障上报、维修派单、处理记录和状态恢复数据源。"
icon={Wrench}
phase="待接入"
/>
);
}
export function FamilyModulePage(): React.ReactElement {
return (
<ModulePage
title="家属服务"
eyebrow="家属端与探访反馈"
description="二期计划接入家属授权、老人动态、探访预约和服务反馈数据源。"
icon={TabletSmartphone}
phase="二期预留"
/>
);
}
export function NoticesModulePage(): React.ReactElement {
return (
<ModulePage
title="公告通知"
eyebrow="公告发布与阅读状态"
description="待接入公告草稿、发布范围、阅读状态和通知记录数据源。"
icon={Bell}
phase="待接入"
/>
);
}
export function AlertsModulePage(): React.ReactElement {
return (
<ModulePage
title="规则预警"
eyebrow="规则中心与风险识别"
description="三期计划接入健康阈值、任务逾期、设备故障、应急事件和风险老人识别规则。"
icon={Radio}
phase="三期预留"
/>
);
}