refactor(web): 技术信息折叠铺到媒体库 / 审计 / 运行状态,清理正常态徽章与解释型页描述(DEAI-2)
- 媒体库详情:作品 UUID 进技术信息;「实际路径与库根」改「文件位置」,正常态(已核验、 可访问、主位置)不加徽章;外部身份显示「TMDB 90228 · 你确认的 / 自动匹配」,修订号进悬停; 元数据字段来源默认收起(「显示来源」,跟随界面设置);别名默认只列中英文与手动加的; 「内容单元」→「季与集」,「临时单元」→「编号待确认」;侧栏与页标题统一「媒体库」 - 审计:动作列不再重复英文码,对象列显示中文类型 / 能力名,ID 只在详情;补 capability.denied - 运行状态:进程、已下线实例、趋势图与最大表收进折叠区;图例同名序列加序号,不再拼接 - 站点卡:账号正常与登录方式不加徽章,健康不显示毫秒,限流移出卡片 - 文件管理:目录「正常」徽章与重复的剩余空间去掉;已登记 → 已入库,临时文件 → 未完成 - 规则:「修订」列改「最后修改」;不支持的关键字合成一行;页签改「默认规则 / 自动收新作品 / 已忽略」; 默认规则说明去掉「带层」等算法描述 - 站点 Passkey 与登录用通行密钥区分命名;命令面板提示去重 - 删解释型页描述(审计、搜索、下载、下载计划、RSS、规则、媒体库、运行状态、站点、任务、计划、整理) Co-Authored-By: Claude Opus 5.5 <[email protected]>
This commit is contained in:
1 parent
5a717e414c
commit
57ce40168d
31 files changed
+253
-209
No files matched your search
@@ -22,7 +22,7 @@ describe("控制台导航", () => {
|
||||
["首页", "任务", "计划", "智能体会话"],
|
||||
["站点", "RSS"],
|
||||
["订阅", "规则"],
|
||||
["下载面板", "整理记录", "文件管理", "媒体概览"],
|
||||
["下载面板", "整理记录", "文件管理", "媒体库"],
|
||||
["设置", "审计", "运行状态"],
|
||||
]);
|
||||
// IA-3 逐项清单 14 项 + FE-6 计划页
|
||||
@@ -44,7 +44,7 @@ describe("控制台导航", () => {
|
||||
it("按最长前缀匹配当前项", () => {
|
||||
expect(findNavItem("/console")?.label).toBe("首页");
|
||||
expect(findNavItem("/console/")?.label).toBe("首页");
|
||||
expect(findNavItem("/console/library/abc")?.label).toBe("媒体概览");
|
||||
expect(findNavItem("/console/library/abc")?.label).toBe("媒体库");
|
||||
expect(findNavItem("/console/tasks/r1")?.label).toBe("任务");
|
||||
expect(findNavItem("/console/schedules")?.label).toBe("计划");
|
||||
expect(findNavItem("/console/downloads")?.label).toBe("下载面板");
|
||||
|
||||
@@ -46,19 +46,19 @@ export const NAV_GROUPS: NavGroup[] = [
|
||||
to: "/console",
|
||||
label: "首页",
|
||||
icon: House,
|
||||
description: "正在进行、需要处理、计划、最近结果与运行状态",
|
||||
description: "在忙什么、要我处理什么、最近入库了什么",
|
||||
},
|
||||
{
|
||||
to: "/console/tasks",
|
||||
label: "任务",
|
||||
icon: ListTodo,
|
||||
description: "每次运行都是一条任务:定时、事件、手动、智能体触发都在这里",
|
||||
description: "最近处理了什么、有没有失败",
|
||||
},
|
||||
{
|
||||
to: "/console/schedules",
|
||||
label: "计划",
|
||||
icon: CalendarCog,
|
||||
description: "定时任务的开关、间隔和下次运行:自动任务与智能体巡检",
|
||||
description: "智能体巡检与自动任务的开关和间隔",
|
||||
},
|
||||
{
|
||||
to: "/console/agent",
|
||||
@@ -75,7 +75,7 @@ export const NAV_GROUPS: NavGroup[] = [
|
||||
to: "/console/sites",
|
||||
label: "站点",
|
||||
icon: Globe,
|
||||
description: "站点、凭证、账号数据与健康;资源、抓取与 RSS",
|
||||
description: "站点账号、资源与 RSS",
|
||||
},
|
||||
{ to: "/console/sources", label: "RSS", icon: Rss, description: "全部 RSS 与抓取状态" },
|
||||
],
|
||||
@@ -90,7 +90,7 @@ export const NAV_GROUPS: NavGroup[] = [
|
||||
{
|
||||
title: "整理",
|
||||
items: [
|
||||
{ to: "/console/downloads", label: "下载面板", icon: Download, description: "下载任务、下载计划与缓存水位" },
|
||||
{ to: "/console/downloads", label: "下载面板", icon: Download, description: "下载任务、下载计划与下载盘" },
|
||||
{
|
||||
to: "/console/organize",
|
||||
label: "整理记录",
|
||||
@@ -101,13 +101,13 @@ export const NAV_GROUPS: NavGroup[] = [
|
||||
to: "/console/files",
|
||||
label: "文件管理",
|
||||
icon: FolderTree,
|
||||
description: "浏览登记目录,改名、移动、删除与整理",
|
||||
description: "浏览下载目录和媒体库,改名、移动、删除与整理",
|
||||
},
|
||||
{
|
||||
to: "/console/library",
|
||||
label: "媒体概览",
|
||||
label: "媒体库",
|
||||
icon: Library,
|
||||
description: "作品、季 / 集、收录版本、外部身份与未识别资源",
|
||||
description: "作品、季与集、未识别资源",
|
||||
},
|
||||
],
|
||||
},
|
||||
@@ -130,7 +130,7 @@ export const NAV_GROUPS: NavGroup[] = [
|
||||
to: "/console/status",
|
||||
label: "运行状态",
|
||||
icon: Gauge,
|
||||
description: "进程心跳、事件循环、数据库、磁盘与挂载根",
|
||||
description: "服务是否正常、磁盘与数据库",
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
@@ -1049,7 +1049,7 @@ export function RefreshMetadataDialog({ items, onClose }: { items: FileEntry[];
|
||||
{s.reason === "not_registered"
|
||||
? "没有已入库文件"
|
||||
: s.reason === "no_entity"
|
||||
? "不属于任何已登记作品"
|
||||
? "不属于媒体库里的作品"
|
||||
: s.reason === "not_found"
|
||||
? "作品不存在"
|
||||
: s.reason}
|
||||
|
||||
@@ -2,7 +2,7 @@ import { ChevronRight, Download, Folder, FolderOpen, HardDrive, LoaderCircle, Tr
|
||||
import { useEffect, useState } from "react";
|
||||
import { type FileRoot, useDirChildren } from "~/api/files.ts";
|
||||
import { healthLabel } from "~/lib/labels.ts";
|
||||
import { cn, formatBytes } from "~/lib/utils.ts";
|
||||
import { cn } from "~/lib/utils.ts";
|
||||
import { groupRoots, joinRel, segments } from "./model.ts";
|
||||
|
||||
type Loc = { root: string; path: string };
|
||||
@@ -140,19 +140,13 @@ function RootNode({
|
||||
{h.tone !== "neutral" ? <TriangleAlert className="h-3 w-3" /> : null}
|
||||
{h.label}
|
||||
</span>
|
||||
) : (
|
||||
<span className="inline-flex items-center gap-1 text-success">
|
||||
<span aria-hidden className="h-1.5 w-1.5 rounded-full bg-success" />
|
||||
正常
|
||||
</span>
|
||||
)}
|
||||
) : null}
|
||||
{root.pendingCount ? (
|
||||
<span className="shrink-0 text-warning">
|
||||
未识别 {root.pendingCount}
|
||||
{root.pendingPartial ? "+" : ""}
|
||||
</span>
|
||||
) : null}
|
||||
{root.usage ? <span className="truncate">剩余 {formatBytes(root.usage.freeBytes, 1)}</span> : null}
|
||||
{!root.writable && root.kind === "library" ? <span>只读</span> : null}
|
||||
</span>
|
||||
</span>
|
||||
|
||||
@@ -123,7 +123,7 @@ export function FileDetail({
|
||||
value:
|
||||
e.type === "dir"
|
||||
? e.dirSummary
|
||||
? `${e.dirSummary.videoCount}${e.dirSummary.partial ? "+" : ""} 个视频 · ${e.dirSummary.registeredCount} 个已登记`
|
||||
? `${e.dirSummary.videoCount}${e.dirSummary.partial ? "+" : ""} 个视频 · ${e.dirSummary.registeredCount} 个已入库`
|
||||
: "—"
|
||||
: formatBytes(e.size, 2),
|
||||
},
|
||||
|
||||
@@ -89,7 +89,7 @@ const base = {
|
||||
|
||||
describe("状态与禁用原因", () => {
|
||||
it("状态徽标带文字,H&R 未满足为 warning,逃逸为 destructive", () => {
|
||||
expect(entryStatusView({ ...base, status: "registered" })?.label).toBe("已登记");
|
||||
expect(entryStatusView({ ...base, status: "registered" })?.label).toBe("已入库");
|
||||
expect(
|
||||
entryStatusView({
|
||||
...base,
|
||||
@@ -228,7 +228,7 @@ describe("v2 菜单与副行", () => {
|
||||
type: "dir" as const,
|
||||
dirSummary: { videoCount: 13, registeredCount: 0, partial: false },
|
||||
})?.text,
|
||||
).toBe("13 视频 · 0 已登记");
|
||||
).toBe("13 个视频 · 未入库");
|
||||
// 没有 parsedHint(服务端解析不出标题)时不显示副行,前端不自己解析
|
||||
expect(entrySubline({ ...video, parsedHint: null })).toBeNull();
|
||||
});
|
||||
|
||||
@@ -19,14 +19,14 @@ export function entryStatusView(e: Pick<FileEntry, "status" | "download" | "esca
|
||||
const s: FileStatus = e.status;
|
||||
switch (s) {
|
||||
case "temp":
|
||||
return { label: "临时文件", tone: "neutral", hint: "下载器或整理过程中的未完成文件" };
|
||||
return { label: "未完成", tone: "neutral", hint: "下载器或整理过程中的未完成文件" };
|
||||
case "downloading":
|
||||
return {
|
||||
label: e.download?.progress != null ? `下载中 ${Math.floor(e.download.progress * 100)}%` : "下载中",
|
||||
tone: "neutral",
|
||||
};
|
||||
case "registered":
|
||||
return { label: "已登记", tone: "success" };
|
||||
return { label: "已入库", tone: "success" };
|
||||
case "seeding":
|
||||
return e.download?.hnr === "unsatisfied"
|
||||
? { label: "做种中·H&R 未满足", tone: "warning", hint: "H&R 满足前不能改名、删除或移动" }
|
||||
@@ -42,9 +42,9 @@ export const FILTER_CHIPS = [
|
||||
{ value: "", label: "全部" },
|
||||
{ value: "video", label: "视频" },
|
||||
{ value: "unidentified", label: "未识别" },
|
||||
{ value: "registered", label: "已登记" },
|
||||
{ value: "registered", label: "已入库" },
|
||||
{ value: "downloading", label: "下载中" },
|
||||
{ value: "temp", label: "临时文件" },
|
||||
{ value: "temp", label: "未完成下载" },
|
||||
] as const;
|
||||
|
||||
export const SORT_OPTIONS = [
|
||||
@@ -81,7 +81,7 @@ export function opDisabledReason(op: FileOp, e: FileEntry, root: Pick<FileRoot,
|
||||
case "rename":
|
||||
if (!rootWritable) return "只读目录,不能改名";
|
||||
if (seeding) return "做种中,H&R 满足前不能改名";
|
||||
if (e.status === "temp") return "临时文件不能改名";
|
||||
if (e.status === "temp") return "未完成的文件不能改名";
|
||||
return null;
|
||||
case "move":
|
||||
if (!rootWritable) return "只读目录,不能移出。可以复制";
|
||||
@@ -93,7 +93,7 @@ export function opDisabledReason(op: FileOp, e: FileEntry, root: Pick<FileRoot,
|
||||
return null;
|
||||
case "organize":
|
||||
case "identify":
|
||||
if (e.status === "temp") return "临时文件不能整理";
|
||||
if (e.status === "temp") return "未完成的文件不能整理";
|
||||
if (e.type === "file" && e.fileKind !== "video") return "只有视频或目录能整理";
|
||||
return null;
|
||||
case "scrape":
|
||||
@@ -449,7 +449,10 @@ export function entrySubline(e: FileEntry): { text: string; tone: "link" | "hint
|
||||
if (e.type === "dir" && e.dirSummary) {
|
||||
const s = e.dirSummary;
|
||||
if (!s.videoCount && !s.registeredCount) return null;
|
||||
return { text: `${s.videoCount}${s.partial ? "+" : ""} 视频 · ${s.registeredCount} 已登记`, tone: "meta" };
|
||||
return {
|
||||
text: `${s.videoCount}${s.partial ? "+" : ""} 个视频${s.registeredCount ? ` · ${s.registeredCount} 个已入库` : s.videoCount ? " · 未入库" : ""}`,
|
||||
tone: "meta",
|
||||
};
|
||||
}
|
||||
if (e.parsedHint) return { text: e.parsedHint, tone: "hint" };
|
||||
return null;
|
||||
|
||||
@@ -101,11 +101,11 @@ export function RuleGroupTable({
|
||||
},
|
||||
{ key: "refs", header: "引用", cell: (g) => <RefsCell g={g} refs={refs} />, hideBelow: "lg" },
|
||||
{
|
||||
key: "rev",
|
||||
header: "修订",
|
||||
key: "updated",
|
||||
header: "最后修改",
|
||||
cell: (g) => (
|
||||
<span className="text-meta text-muted-foreground tabular-nums" title={`更新于 ${relTime(g.updatedAt)}`}>
|
||||
r{g.revision}
|
||||
<span className="text-meta whitespace-nowrap text-muted-foreground" title={`r${g.revision}`}>
|
||||
{relTime(g.updatedAt)}
|
||||
</span>
|
||||
),
|
||||
hideBelow: "md",
|
||||
|
||||
@@ -339,21 +339,26 @@ export function AtomsTab() {
|
||||
onRowClick={(a) => setDialog({ open: true, atom: a })}
|
||||
empty={{ icon: FlaskConical, title: "还没有自定义条件", description: "内置关键字覆盖不到时再新建。" }}
|
||||
/>
|
||||
<Panel title="内置关键字" description="对齐 MoviePilot;判定依据按解析字段优先">
|
||||
<Panel title="内置关键字">
|
||||
{keywords.isPending ? (
|
||||
<LoadingState rows={3} />
|
||||
) : keywords.isError ? (
|
||||
<ErrorState plain error={keywords.error} onRetry={() => keywords.refetch()} />
|
||||
) : (
|
||||
<ul className="grid gap-x-6 gap-y-2 sm:grid-cols-2">
|
||||
{builtins.map((k) => (
|
||||
<li key={k.id} className="flex min-w-0 items-baseline gap-2 text-caption">
|
||||
<span className="w-16 shrink-0 font-mono font-medium text-foreground">{k.id}</span>
|
||||
<span className="min-w-0 text-muted-foreground">
|
||||
{k.supported ? k.description || k.name : "不支持,规则串里出现会报错"}
|
||||
</span>
|
||||
{builtins
|
||||
.filter((k) => k.supported)
|
||||
.map((k) => (
|
||||
<li key={k.id} className="flex min-w-0 items-baseline gap-2 text-caption">
|
||||
<span className="w-16 shrink-0 font-mono font-medium text-foreground">{k.id}</span>
|
||||
<span className="min-w-0 text-muted-foreground">{k.description || k.name}</span>
|
||||
</li>
|
||||
))}
|
||||
{builtins.some((k) => !k.supported) ? (
|
||||
<li className="text-meta text-muted-foreground sm:col-span-2">
|
||||
另有 {builtins.filter((k) => !k.supported).length} 个关键字暂不支持,写进规则串会报错
|
||||
</li>
|
||||
))}
|
||||
) : null}
|
||||
</ul>
|
||||
)}
|
||||
</Panel>
|
||||
@@ -385,7 +390,7 @@ export function DefaultsTab({ groups }: { groups: RuleGroup[] | undefined }) {
|
||||
<div className="space-y-4">
|
||||
<div className="flex flex-wrap items-center justify-between gap-2">
|
||||
<p className="text-caption text-muted-foreground">
|
||||
订阅和收录版本没指定规则组时用这里的链。链上的组按顺序串联,任一组拒绝即拒绝,优先级取最后一个带层的组。
|
||||
订阅和收录版本没指定规则组时用这里的链。按顺序检查,任一组不通过就不下载。
|
||||
</p>
|
||||
<div className="flex items-center gap-2">
|
||||
{dirty ? <StatusBadge tone="warning">未保存</StatusBadge> : null}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { type SearchAction, type SearchWork, tmdbImageUrl } from "@umt/contracts";
|
||||
import { ArrowRight, CornerDownLeft, Film, Globe, LoaderCircle, type LucideIcon, Search } from "lucide-react";
|
||||
import { CornerDownLeft, Film, Globe, LoaderCircle, type LucideIcon, Search } from "lucide-react";
|
||||
import { type ReactNode, useEffect, useId, useMemo, useRef, useState } from "react";
|
||||
import { Link, useNavigate } from "react-router";
|
||||
import { useSearch } from "~/api/search.ts";
|
||||
@@ -111,7 +111,6 @@ function PaletteBody({ initial }: { initial: string }) {
|
||||
查看「<span className="font-medium">{term}</span>」的全部结果
|
||||
</span>
|
||||
),
|
||||
meta: "作品卡上可以选站点搜资源",
|
||||
hint: "打开",
|
||||
run: () => go(searchPagePath(term)),
|
||||
});
|
||||
@@ -254,10 +253,6 @@ function PaletteBody({ initial }: { initial: string }) {
|
||||
<div className="hidden items-center gap-4 border-t border-border/70 px-4 py-2 text-meta text-muted-foreground sm:flex">
|
||||
<span>↑↓ 选择</span>
|
||||
<span>↵ 打开</span>
|
||||
<span className="ml-auto inline-flex items-center gap-1">
|
||||
<ArrowRight className="h-3 w-3" />
|
||||
搜资源在作品详情页
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -196,7 +196,7 @@ export function PasskeyBlock({ disabled }: { disabled: boolean }) {
|
||||
<SettingsBlock
|
||||
section="account"
|
||||
anchor="passkeys"
|
||||
title="Passkey"
|
||||
title="通行密钥(Passkey)"
|
||||
description="用指纹、面容或安全钥匙直接登录,不用输密码和验证码。可以登记多把。"
|
||||
>
|
||||
{body}
|
||||
|
||||
@@ -239,7 +239,7 @@ function PasskeyForm({ site, label, has }: { site: SiteListItem; label: string;
|
||||
}
|
||||
}}
|
||||
>
|
||||
<h2 className="text-lead font-semibold text-foreground">Passkey</h2>
|
||||
<h2 className="text-lead font-semibold text-foreground">站点 Passkey(RSS 与下载链接用)</h2>
|
||||
<p className="mb-3 text-caption text-muted-foreground">
|
||||
用于 RSS 和下载链接,不参与登录。{has ? "已保存;再次保存会替换。" : "还没有保存。"}
|
||||
</p>
|
||||
|
||||
@@ -27,7 +27,6 @@ import { cn } from "~/lib/utils.ts";
|
||||
import type { SiteDialog, useSiteChecks } from "./site-dialogs.tsx";
|
||||
import {
|
||||
ACCOUNT_OVERALL,
|
||||
AUTH_KIND_LABEL,
|
||||
bytes,
|
||||
dataAccount,
|
||||
healthLine,
|
||||
@@ -36,7 +35,6 @@ import {
|
||||
loginFailureText,
|
||||
overallStatus,
|
||||
primaryAccount,
|
||||
rateLimitText,
|
||||
ratioText,
|
||||
} from "./site-fields.ts";
|
||||
|
||||
@@ -197,21 +195,8 @@ function CheckButtons({ site, checks, compact }: Omit<Props, "onDialog"> & { com
|
||||
|
||||
function AccountBadges({ site }: { site: SiteListItem }) {
|
||||
const st = ACCOUNT_OVERALL[overallStatus(site)];
|
||||
const acc = primaryAccount(site.accounts);
|
||||
const hasPasskey = site.accounts?.some((a) => a.hasPasskey || a.authKind === "passkey");
|
||||
return (
|
||||
<>
|
||||
<StatusBadge tone={st.tone}>账号{st.label}</StatusBadge>
|
||||
{acc && acc.authKind !== "passkey" ? (
|
||||
<span className="rounded-full border border-border px-2 py-0.5 text-meta text-muted-foreground">
|
||||
{AUTH_KIND_LABEL[acc.authKind]}
|
||||
</span>
|
||||
) : null}
|
||||
{hasPasskey ? (
|
||||
<span className="rounded-full border border-border px-2 py-0.5 text-meta text-muted-foreground">Passkey</span>
|
||||
) : null}
|
||||
</>
|
||||
);
|
||||
// 正常不标;登录方式不做徽章(DEAI-2)
|
||||
return st.tone === "success" ? null : <StatusBadge tone={st.tone}>账号{st.label}</StatusBadge>;
|
||||
}
|
||||
|
||||
function Stat({ label, children, className }: { label: string; children: ReactNode; className?: string }) {
|
||||
@@ -307,14 +292,14 @@ export function SiteCard({ site, checks, onDialog }: Props) {
|
||||
<dd className="text-foreground">{relTime(acc?.lastLoginAt)}</dd>
|
||||
</div>
|
||||
<div className="min-w-0">
|
||||
<dt className="text-meta text-muted-foreground">健康检测</dt>
|
||||
<dt className="text-meta text-muted-foreground">状态</dt>
|
||||
<dd className="truncate" title={hmsg ?? undefined}>
|
||||
<StatusDot tone={health.tone} />
|
||||
{health.text}
|
||||
</dd>
|
||||
</div>
|
||||
<div className="min-w-0">
|
||||
<dt className="text-meta text-muted-foreground">抓取</dt>
|
||||
<dt className="text-meta text-muted-foreground">资源更新</dt>
|
||||
<dd className={cn("text-foreground", stale && "text-warning")}>
|
||||
{!site.snapshotEnabled
|
||||
? "未开启"
|
||||
@@ -323,10 +308,6 @@ export function SiteCard({ site, checks, onDialog }: Props) {
|
||||
: "还没抓取过"}
|
||||
</dd>
|
||||
</div>
|
||||
<div className="min-w-0">
|
||||
<dt className="text-meta text-muted-foreground">限流</dt>
|
||||
<dd className="truncate text-foreground">{rateLimitText(site.rateLimit)}</dd>
|
||||
</div>
|
||||
</dl>
|
||||
|
||||
<footer className="mt-4 flex flex-wrap items-center justify-end gap-2 border-t border-border/60 pt-3">
|
||||
@@ -441,7 +422,7 @@ export function SiteTable({
|
||||
},
|
||||
{
|
||||
key: "health",
|
||||
header: "健康检测",
|
||||
header: "状态",
|
||||
hideBelow: "md",
|
||||
cell: (s) => {
|
||||
const h = healthLine(s.lastHealth, s.lastHealthAt);
|
||||
@@ -455,7 +436,7 @@ export function SiteTable({
|
||||
},
|
||||
{
|
||||
key: "snapshot",
|
||||
header: "抓取",
|
||||
header: "资源更新",
|
||||
hideBelow: "lg",
|
||||
cell: (s) => (
|
||||
<span className={s.snapshotEnabled && snapshotStale(s) ? "text-warning" : "text-muted-foreground"}>
|
||||
|
||||
@@ -121,7 +121,7 @@ const HEALTH_STATUS_TEXT: Record<string, string> = {
|
||||
export function healthLine(h: SiteLastHealth | null, at: string | null): { text: string; tone: StatusTone } {
|
||||
if (!h) return { text: "未检测", tone: "neutral" };
|
||||
const parts = [HEALTH_STATUS_TEXT[h.status] ?? h.status];
|
||||
if (h.latencyMs !== null) parts.push(`${h.latencyMs} ms`);
|
||||
// 延迟毫秒数不上屏(DEAI-2),需要时看站点详情
|
||||
parts.push(relTime(at));
|
||||
const tone: StatusTone = h.ok ? "success" : h.status.startsWith("auth_") ? "destructive" : "warning";
|
||||
return { text: parts.join(" · "), tone };
|
||||
|
||||
@@ -48,6 +48,16 @@ export function HistoryChart({
|
||||
return [...m.values()].sort((a, b) => String(a.at).localeCompare(String(b.at)));
|
||||
}, [series, metric]);
|
||||
|
||||
// 同名序列(容器重建后 pid 相同)加序号区分,图例不再重复拼接
|
||||
const labels = new Map<string, string>();
|
||||
const seen = new Map<string, number>();
|
||||
for (const s of series) {
|
||||
const base = seriesLabel(s);
|
||||
const n = (seen.get(base) ?? 0) + 1;
|
||||
seen.set(base, n);
|
||||
labels.set(s.instanceId, n > 1 ? `${base}(${n})` : base);
|
||||
}
|
||||
|
||||
if (rows.length === 0) return <EmptyState plain title="这段时间没有采样" className="py-8" />;
|
||||
|
||||
return (
|
||||
@@ -80,13 +90,19 @@ export function HistoryChart({
|
||||
}}
|
||||
cursor={{ stroke: "var(--color-muted-foreground)", strokeDasharray: "3 3" }}
|
||||
/>
|
||||
{series.length > 1 ? <Legend iconType="plainline" wrapperStyle={{ fontSize: 12 }} /> : null}
|
||||
{series.length > 1 ? (
|
||||
<Legend
|
||||
iconType="plainline"
|
||||
wrapperStyle={{ fontSize: 12, paddingTop: 4 }}
|
||||
formatter={(v) => <span className="mr-3 text-muted-foreground">{String(v)}</span>}
|
||||
/>
|
||||
) : null}
|
||||
{series.map((s, i) => (
|
||||
<Line
|
||||
key={s.instanceId}
|
||||
type="monotone"
|
||||
dataKey={s.instanceId}
|
||||
name={seriesLabel(s)}
|
||||
name={labels.get(s.instanceId) ?? seriesLabel(s)}
|
||||
stroke="var(--color-foreground)"
|
||||
strokeOpacity={OPACITY[i % OPACITY.length]}
|
||||
strokeDasharray={DASH[i % DASH.length]}
|
||||
|
||||
@@ -12,6 +12,7 @@ import { useStorageCleanup, useSystemStorage } from "~/api/system.ts";
|
||||
import { DataTable } from "~/components/console/data-table.tsx";
|
||||
import { ErrorState, LoadingState } from "~/components/console/empty-state.tsx";
|
||||
import { StatusBadge, type StatusTone } from "~/components/console/status-badge.tsx";
|
||||
import { TechInfo } from "~/components/console/tech-info.tsx";
|
||||
import { Button } from "~/components/ui/button.tsx";
|
||||
import { errorMessage } from "~/lib/api.ts";
|
||||
import { formatRelative } from "~/lib/labels.ts";
|
||||
@@ -257,52 +258,56 @@ export function StorageSection({ health }: { health: SystemHealth }) {
|
||||
</ul>
|
||||
|
||||
<div className="grid gap-6 xl:grid-cols-2">
|
||||
<Panel title={`体积最大的表(前 ${TOP_TABLES})`} note="含索引与 TOAST">
|
||||
<DataTable<TableRow>
|
||||
rows={s.db.tables.slice(0, TOP_TABLES)}
|
||||
rowKey={(t) => `${t.schema}.${t.name}`}
|
||||
empty={{ title: "取不到表体积" }}
|
||||
columns={[
|
||||
{
|
||||
key: "name",
|
||||
header: "表",
|
||||
cell: (t) => (
|
||||
<span className="font-mono text-caption break-all">
|
||||
{t.schema === "public" ? t.name : `${t.schema}.${t.name}`}
|
||||
</span>
|
||||
),
|
||||
},
|
||||
{
|
||||
key: "total",
|
||||
header: "合计",
|
||||
align: "right",
|
||||
cell: (t) => <span className="whitespace-nowrap tabular-nums">{formatBytes(t.totalBytes, 1)}</span>,
|
||||
},
|
||||
{
|
||||
key: "idx",
|
||||
header: "索引",
|
||||
align: "right",
|
||||
hideBelow: "md",
|
||||
cell: (t) => (
|
||||
<span className="whitespace-nowrap tabular-nums text-muted-foreground">
|
||||
{formatBytes(t.indexBytes, 1)}
|
||||
</span>
|
||||
),
|
||||
},
|
||||
{
|
||||
key: "rows",
|
||||
header: "估算行数",
|
||||
align: "right",
|
||||
hideBelow: "sm",
|
||||
cell: (t) => (
|
||||
<span className="tabular-nums text-muted-foreground">
|
||||
{t.rowsEstimate === null ? "—" : t.rowsEstimate.toLocaleString("zh-CN")}
|
||||
</span>
|
||||
),
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</Panel>
|
||||
<TechInfo title={`数据库里最大的 ${TOP_TABLES} 张表`} columns={1}>
|
||||
<Panel title={`体积最大的表(前 ${TOP_TABLES})`} note="含索引与 TOAST">
|
||||
<DataTable<TableRow>
|
||||
rows={s.db.tables.slice(0, TOP_TABLES)}
|
||||
rowKey={(t) => `${t.schema}.${t.name}`}
|
||||
empty={{ title: "取不到表体积" }}
|
||||
columns={[
|
||||
{
|
||||
key: "name",
|
||||
header: "表",
|
||||
cell: (t) => (
|
||||
<span className="font-mono text-caption break-all">
|
||||
{t.schema === "public" ? t.name : `${t.schema}.${t.name}`}
|
||||
</span>
|
||||
),
|
||||
},
|
||||
{
|
||||
key: "total",
|
||||
header: "合计",
|
||||
align: "right",
|
||||
cell: (t) => (
|
||||
<span className="whitespace-nowrap tabular-nums">{formatBytes(t.totalBytes, 1)}</span>
|
||||
),
|
||||
},
|
||||
{
|
||||
key: "idx",
|
||||
header: "索引",
|
||||
align: "right",
|
||||
hideBelow: "md",
|
||||
cell: (t) => (
|
||||
<span className="whitespace-nowrap tabular-nums text-muted-foreground">
|
||||
{formatBytes(t.indexBytes, 1)}
|
||||
</span>
|
||||
),
|
||||
},
|
||||
{
|
||||
key: "rows",
|
||||
header: "估算行数",
|
||||
align: "right",
|
||||
hideBelow: "sm",
|
||||
cell: (t) => (
|
||||
<span className="tabular-nums text-muted-foreground">
|
||||
{t.rowsEstimate === null ? "—" : t.rowsEstimate.toLocaleString("zh-CN")}
|
||||
</span>
|
||||
),
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</Panel>
|
||||
</TechInfo>
|
||||
<div className="space-y-6">
|
||||
<Panel title="缓存" note="条数含尚未清理的过期条目">
|
||||
<DataTable<KvRow>
|
||||
|
||||
@@ -127,7 +127,7 @@ export function CoverageMatrix({
|
||||
key={c.unitKey}
|
||||
scope="col"
|
||||
title={
|
||||
[c.airDate ? `播出 ${c.airDate}` : null, c.temporary ? "临时单元" : null]
|
||||
[c.airDate ? `播出 ${c.airDate}` : null, c.temporary ? "编号待确认" : null]
|
||||
.filter(Boolean)
|
||||
.join(" · ") || undefined
|
||||
}
|
||||
@@ -275,7 +275,7 @@ export function CellSheet({
|
||||
items={[
|
||||
{ label: "单元", value: sel.col.unitKey, mono: true },
|
||||
...(sel.col.airDate ? [{ label: "播出日期", value: sel.col.airDate }] : []),
|
||||
...(sel.col.temporary ? [{ label: "临时单元", value: "还没有正式的内容单元" }] : []),
|
||||
...(sel.col.temporary ? [{ label: "编号待确认", value: "这一集的编号还没确认" }] : []),
|
||||
{
|
||||
label: "质量",
|
||||
value:
|
||||
|
||||
Reference in new issue
Block a user