feat: isolate BossAI website with Next.js

website/app/page.tsx

@@ -0,0 +1,284 @@
+import Image from "next/image";
+import Link from "next/link";
+
+const platformItems = [
+  {
+    title: "统一 API 网关",
+    eyebrow: "Gateway",
+    body: "OpenAI、Claude Messages、Gemini、方舟、图像和视频接口统一到一套下游协议。",
+    metric: "/v1",
+  },
+  {
+    title: "智能模型路由",
+    eyebrow: "Routing",
+    body: "按站点、账号、令牌、模型和失败冷却自动调度，保留真实日志和计费链路。",
+    metric: "Auto",
+  },
+  {
+    title: "Comfy 工作流",
+    eyebrow: "Workflow",
+    body: "使用熟悉的 ComfyUI 前端，接入 Cloud、RunningHub、External 或 BoosAPI 执行器。",
+    metric: "Canvas",
+  },
+  {
+    title: "创作应用生产",
+    eyebrow: "Studio",
+    body: "生图助手、视频助手、数字人、短视频工厂和工作空间复用同一套模型能力。",
+    metric: "Media",
+  },
+];
+
+const routes = [
+  { type: "Chat", model: "gpt-5.4", state: "已路由", tone: "hot" },
+  { type: "Image", model: "gpt-image-2", state: "生成中", tone: "lime" },
+  { type: "Video", model: "seedance", state: "排队中", tone: "blue" },
+  { type: "Claude", model: "/v1/messages", state: "流式", tone: "white" },
+];
+
+const workflowModes = [
+  ["cloud", "Comfy Cloud API 后端"],
+  ["runninghub", "RunningHub API 后端"],
+  ["external", "外部完整版 ComfyUI"],
+  ["boosapi", "Rust API-native 执行器"],
+];
+
+const productionModules = [
+  "模型广场",
+  "使用日志",
+  "工作空间",
+  "数字人",
+  "短视频工厂",
+  "站点公告",
+  "下游密钥",
+  "PostgreSQL",
+];
+
+function FlowGlyph() {
+  return (
+    <svg className="flow-glyph" viewBox="0 0 520 360" role="img" aria-label="BossAI 工作流动态图形">
+      <defs>
+        <linearGradient id="lineGradient" x1="0" x2="1" y1="0" y2="1">
+          <stop offset="0%" stopColor="#D7FF4D" />
+          <stop offset="55%" stopColor="#8BF6FF" />
+          <stop offset="100%" stopColor="#FFFFFF" />
+        </linearGradient>
+        <filter id="softGlow" x="-30%" y="-30%" width="160%" height="160%">
+          <feGaussianBlur stdDeviation="6" result="blur" />
+          <feMerge>
+            <feMergeNode in="blur" />
+            <feMergeNode in="SourceGraphic" />
+          </feMerge>
+        </filter>
+      </defs>
+      <path className="flow-line flow-line-a" d="M48 180 C130 62 232 62 314 180 S438 298 488 154" />
+      <path className="flow-line flow-line-b" d="M58 236 C154 318 222 286 274 184 S358 24 462 92" />
+      <path className="flow-line flow-line-c" d="M92 108 C178 164 214 180 260 180 S330 174 424 250" />
+      <g filter="url(#softGlow)">
+        <circle className="flow-dot dot-a" cx="48" cy="180" r="7" />
+        <circle className="flow-dot dot-b" cx="260" cy="180" r="9" />
+        <circle className="flow-dot dot-c" cx="488" cy="154" r="7" />
+      </g>
+      <rect className="node node-a" x="72" y="58" width="128" height="68" rx="18" />
+      <rect className="node node-b" x="242" y="146" width="140" height="76" rx="20" />
+      <rect className="node node-c" x="352" y="248" width="120" height="62" rx="17" />
+    </svg>
+  );
+}
+
+function HeroConsole() {
+  return (
+    <div className="hero-console" aria-label="BossAI 路由状态预览">
+      <div className="console-orbit" />
+      <div className="console-bar">
+        <span>Unified Gateway</span>
+        <strong>路由在线</strong>
+      </div>
+      <div className="route-list">
+        {routes.map((route) => (
+          <div className="route-row" data-tone={route.tone} key={route.type}>
+            <span>{route.type}</span>
+            <strong>{route.model}</strong>
+            <em>{route.state}</em>
+          </div>
+        ))}
+      </div>
+      <div className="mini-grid">
+        <div>
+          <span>Workspace</span>
+          <strong>只归档产出</strong>
+        </div>
+        <div>
+          <span>Billing</span>
+          <strong>日志计费</strong>
+        </div>
+      </div>
+      <FlowGlyph />
+    </div>
+  );
+}
+
+export default function Home() {
+  return (
+    <main className="site-shell">
+      <div className="site-noise" aria-hidden="true" />
+      <header className="site-nav">
+        <Link className="brand-mark" href="/" aria-label="BossAI 首页">
+          <Image src="/logo.png" width={38} height={38} alt="" priority />
+          <span>BossAI</span>
+        </Link>
+        <nav className="nav-links" aria-label="官网导航">
+          <a href="#platform">平台能力</a>
+          <a href="#workflow">工作流</a>
+          <a href="#factory">短视频工厂</a>
+          <a href="#deploy">部署</a>
+        </nav>
+        <div className="nav-actions">
+          <Link className="ghost-link" href="/user/login">
+            用户登录
+          </Link>
+          <Link className="solid-link" href="/boos">
+            进入后台
+          </Link>
+        </div>
+      </header>
+
+      <section className="hero-section">
+        <div className="hero-copy">
+          <div className="section-kicker">
+            <span className="pulse-dot" />
+            多模型 · 多模态 · 工作流
+          </div>
+          <h1>
+            聚合多模型
+            <span>多模态的 AI 应用平台</span>
+          </h1>
+          <p>
+            BossAI 把统一 API 网关、智能路由、Comfy 工作流、数字人和短视频工厂收进一个清晰后台，让团队专注生产，而不是到处切系统。
+          </p>
+          <div className="hero-actions">
+            <Link className="primary-cta" href="/user/register">
+              开始使用
+            </Link>
+            <Link className="secondary-cta" href="#workflow">
+              查看工作流
+            </Link>
+          </div>
+        </div>
+        <HeroConsole />
+      </section>
+
+      <section id="platform" className="platform-section">
+        <div className="section-heading">
+          <span>Platform</span>
+          <h2>一套后台，接住 API、工作流和创作应用</h2>
+        </div>
+        <div className="capability-grid">
+          {platformItems.map((item, index) => (
+            <article className="capability-card" key={item.title} style={{ ["--index" as string]: index }}>
+              <div className="card-top">
+                <span>{item.eyebrow}</span>
+                <strong>{item.metric}</strong>
+              </div>
+              <h3>{item.title}</h3>
+              <p>{item.body}</p>
+            </article>
+          ))}
+        </div>
+      </section>
+
+      <section id="workflow" className="workflow-section">
+        <div className="workflow-panel">
+          <div className="section-heading">
+            <span>Workflow</span>
+            <h2>使用完整版 ComfyUI 前端，后端按你的模式切换</h2>
+          </div>
+          <p>
+            官网和管理台隔离后，Workflow 继续作为产品内能力维护。BossAI 可以代理官方 Cloud、RunningHub、外部 ComfyUI，也能执行 API-native 节点。
+          </p>
+          <div className="mode-list">
+            {workflowModes.map(([key, label]) => (
+              <div key={key}>
+                <code>{key}</code>
+                <span>{label}</span>
+              </div>
+            ))}
+          </div>
+        </div>
+        <div className="node-board" aria-label="工作流节点预览">
+          <div className="node-card wide">
+            <span>Prompt</span>
+            <strong>文案、角色、镜头、商品信息</strong>
+          </div>
+          <div className="node-card">
+            <span>Image</span>
+            <strong>生图</strong>
+          </div>
+          <div className="node-card">
+            <span>Video</span>
+            <strong>视频</strong>
+          </div>
+          <div className="node-card">
+            <span>Voice</span>
+            <strong>TTS</strong>
+          </div>
+          <div className="node-card">
+            <span>Archive</span>
+            <strong>工作空间</strong>
+          </div>
+        </div>
+      </section>
+
+      <section id="factory" className="factory-section">
+        <div className="factory-copy">
+          <span>Creation OS</span>
+          <h2>从提示词到短视频，从素材到数字人</h2>
+          <p>
+            生图助手、视频助手和短视频工厂共享 BoosAPI 模型路由。产出文件自动归档，用户之间隔离，管理员可查看团队级用量与成本。
+          </p>
+        </div>
+        <div className="module-strip">
+          {productionModules.map((module) => (
+            <span key={module}>{module}</span>
+          ))}
+        </div>
+      </section>
+
+      <section id="deploy" className="deploy-section">
+        <div>
+          <span>Deploy</span>
+          <h2>远程模型优先，本机不必有 GPU</h2>
+          <p>
+            当图像、视频、语音走上游 API、Comfy Cloud 或 RunningHub 时，BossAI 服务器只负责网关、鉴权、数据库、日志和 Workflow UI 代理。
+          </p>
+        </div>
+        <div className="deploy-stack">
+          <div>
+            <small>Backend</small>
+            <strong>Rust 二进制</strong>
+          </div>
+          <div>
+            <small>Database</small>
+            <strong>SQLite / PostgreSQL</strong>
+          </div>
+          <div>
+            <small>Website</small>
+            <strong>Next.js 独立部署</strong>
+          </div>
+        </div>
+      </section>
+
+      <section className="final-section">
+        <h2>把模型、工作流和创作应用收进一个平台</h2>
+        <p>适合自建 AI 中转、团队模型管理、多模态创作和商业化用户面板。</p>
+        <div className="hero-actions">
+          <Link className="primary-cta" href="/user/register">
+            开始使用
+          </Link>
+          <Link className="secondary-cta" href="/boos">
+            进入后台
+          </Link>
+        </div>
+      </section>
+    </main>
+  );
+}