feat(web): W3-1 login, session shell, home dashboard, settings, engine panel and audit pages

- /login: setup/login/TOTP states driven by server error codes, fixed-height error slot - console layout: GET /auth/session gate, redirect to /login, account popover (change password, logout) - home: six dashboard sections with SSE-driven refresh, automation switch and read-only reconcile toggle - settings tabs: downloaders, media servers, library roots, path mappings, site credentials, API keys (one-time plaintext), Pi upstream, cache/organize/retention/budget, automation - engine: runs list (status/name filters, cursor paging, stats tiles), run detail (step timeline, json payloads, signals, cancel) - audit: filterable list with detail sheet - vite: allow repo root in server.fs so deno-installed deps under node_modules/.deno load in dev Co-Authored-By: Claude Opus 5.5 <[email protected]>
2026-09-27 20:40:41 +08:00
1 parent ef73abe3df
commit 0dec0854df
@@ -1,6 +1,64 @@
-import { WorkspacePlaceholder } from "~/components/console/workspace-placeholder.tsx";
+import { Bot, FolderTree, HardDrive, KeyRound, Link2, Server, Tv, UserCog, Zap } from "lucide-react";
+import { useSearchParams } from "react-router";
+import { PageHeader } from "~/components/console/page-header.tsx";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "~/components/ui/tabs.tsx";
+import {
+  DownloadersSection,
+  LibraryRootsSection,
+  MediaServersSection,
+  PathMappingsSection,
+} from "./settings/instances-tab.tsx";
+import { ApiKeysSection, SiteCredentialsSection } from "./settings/keys-tab.tsx";
+import { AutomationTab, PiTab, StorageTab } from "./settings/prefs-tab.tsx";
+
+export const meta = () => [{ title: "系统设置 · UHD 媒体自动化控制台" }];
+
+const TABS = [
+  { value: "automation", label: "自动化", icon: Zap, render: () => <AutomationTab /> },
+  { value: "downloaders", label: "下载器", icon: Server, render: () => <DownloadersSection /> },
+  { value: "media-servers", label: "媒体服务器", icon: Tv, render: () => <MediaServersSection /> },
+  { value: "library-roots", label: "库根", icon: FolderTree, render: () => <LibraryRootsSection /> },
+  { value: "path-mappings", label: "路径映射", icon: Link2, render: () => <PathMappingsSection /> },
+  { value: "site-credentials", label: "站点凭证", icon: UserCog, render: () => <SiteCredentialsSection /> },
+  { value: "api-keys", label: "API Key", icon: KeyRound, render: () => <ApiKeysSection /> },
+  { value: "pi", label: "Pi 上游", icon: Bot, render: () => <PiTab /> },
+  { value: "storage", label: "缓存与入库", icon: HardDrive, render: () => <StorageTab /> },
+] as const;

-// 占位:标题与说明取自 components/console/nav.ts
 export default function SettingsPage() {
-  return <WorkspacePlaceholder />;
+  const [params, setParams] = useSearchParams();
+  const raw = params.get("tab");
+  const tab = TABS.some((t) => t.value === raw) ? (raw as string) : "automation";
+
+  return (
+    <>
+      <PageHeader title="系统设置" description="实例、路径、凭证、密钥、模型上游与自动化开关。凭证一律只写，不回显。" />
+      <Tabs
+        value={tab}
+        onValueChange={(v) =>
+          setParams(
+            (p) => {
+              p.set("tab", v);
+              return p;
+            },
+            { replace: true },
+          )
+        }
+      >
+        <TabsList aria-label="设置分节">
+          {TABS.map((t) => (
+            <TabsTrigger key={t.value} value={t.value}>
+              <t.icon />
+              {t.label}
+            </TabsTrigger>
+          ))}
+        </TabsList>
+        {TABS.map((t) => (
+          <TabsContent key={t.value} value={t.value}>
+            {tab === t.value ? t.render() : null}
+          </TabsContent>
+        ))}
+      </Tabs>
+    </>
+  );
 }