feat(web): 记录抽屉与两层导航标准
控制台导航最多两层(侧栏一项 = 一页,页内最多一层页签 / 分段);从列表打开的
记录改成列表页上的右侧抽屉,打开的记录写在 ?open=,刷新、分享、前进后退都能还原,
后退就是关抽屉。标准写在 docs/design/console-ia.md §9,ui-controls.md 引用。
- DetailSheet 加 xl 宽度、标题下操作行;抽屉里再开的 DetailSheet 在同一抽屉里换成子视图(返回 / Esc)
- record-sheet.tsx:useRecordSheet / RecordLink / useOpenRecord / recordPath / taskPath
- 整理记录、订阅、站点(含页签)、下载、日志任务改成抽屉;旧业务任务 / 下载任务 id 在任务抽屉里换算
- 回收站并进文件管理右侧视图(?view=trash);设置左栏只列分区
- 规则组、策略版本、媒体库未识别 / 外部身份、设置实例编辑走 ?open=
- 旧地址 /console/{organize,subscriptions,sites,downloads}/:id、/tasks/:id、/files/trash 跳到列表页抽屉
- 站内链接、铃铛、命令面板、任务时间线改拼新地址;冒烟按 ?open= 检查抽屉
Co-Authored-By: Claude Opus 5.5 <[email protected]>
Claude-Session: https://claude.ai/code/session_01Cxwgnn2pbzQ7rXv3rq7fei
This commit is contained in:
1 parent
dd0f6e2c09
commit
21c55dfb3a
60 files changed
+2768
-2461
No files matched your search
@@ -1,9 +1,8 @@
|
||||
import type { CalendarEntryState, SubscriptionCalendarEntry, SubscriptionMediaKind } from "@umt/contracts";
|
||||
import { CalendarDays, ChevronLeft, ChevronRight } from "lucide-react";
|
||||
import { Link } from "react-router";
|
||||
import { useSubscriptionCalendar } from "~/api/subscriptions.ts";
|
||||
import { EmptyState, ErrorState, LoadingState } from "~/components/console/empty-state.tsx";
|
||||
import { consolePath } from "~/components/console/nav.ts";
|
||||
import { RecordLink } from "~/components/console/record-sheet.tsx";
|
||||
import { Button } from "~/components/ui/button.tsx";
|
||||
import { cn } from "~/lib/utils.ts";
|
||||
import {
|
||||
@@ -37,8 +36,9 @@ const DOT_CLS: Record<CalendarEntryState, string> = {
|
||||
|
||||
function Entry({ e }: { e: SubscriptionCalendarEntry }) {
|
||||
return (
|
||||
<Link
|
||||
to={consolePath("subscriptions", e.subscriptionId)}
|
||||
<RecordLink
|
||||
page="subscriptions"
|
||||
id={e.subscriptionId}
|
||||
title={`${e.title} ${e.label} · ${CALENDAR_STATE_LABEL[e.state]}${e.total > 1 ? ` ${e.have}/${e.total}` : ""}`}
|
||||
className={cn(
|
||||
"flex min-w-0 items-center gap-1 rounded-tight border px-1.5 py-0.5 text-meta text-foreground transition-colors duration-micro hover:bg-foreground/[0.06]",
|
||||
@@ -49,7 +49,7 @@ function Entry({ e }: { e: SubscriptionCalendarEntry }) {
|
||||
<span className="truncate">{e.title}</span>
|
||||
<span className="shrink-0 text-muted-foreground tabular-nums">{e.label}</span>
|
||||
<span className="sr-only">{CALENDAR_STATE_LABEL[e.state]}</span>
|
||||
</Link>
|
||||
</RecordLink>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -168,8 +168,9 @@ export function SubscriptionCalendarView({
|
||||
<ul className="pg-slab divide-y divide-border/60 overflow-hidden rounded-xl">
|
||||
{unknown.map((u) => (
|
||||
<li key={`${u.subscriptionId}-${u.seasonNumber ?? ""}`}>
|
||||
<Link
|
||||
to={consolePath("subscriptions", u.subscriptionId)}
|
||||
<RecordLink
|
||||
page="subscriptions"
|
||||
id={u.subscriptionId}
|
||||
className="flex min-w-0 items-center gap-2 px-3 py-2 text-sm text-foreground hover:bg-foreground/[0.04]"
|
||||
>
|
||||
<span className="truncate">{u.title}</span>
|
||||
@@ -178,7 +179,7 @@ export function SubscriptionCalendarView({
|
||||
{u.seasonNumber !== null ? ` · S${String(u.seasonNumber).padStart(2, "0")}` : ""}
|
||||
{u.episodes.length ? ` · ${u.episodes.length} 集` : ""}
|
||||
</span>
|
||||
</Link>
|
||||
</RecordLink>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
|
||||
Reference in new issue
Block a user