fix: restore upstream canvas capabilities
This commit is contained in:
@@ -579,16 +579,17 @@
|
||||
<p><strong>2026-05-25 即梦 generate 式简化：</strong>默认首页进一步压缩为窄导航栏、会话侧栏和中央 prompt composer，不再把四入口、参考图、我的任务和结果区平铺成三栏。图片 / 视频 / 图文模式、自动设置和参考上传都收进 composer 底部的小按钮；参考图是输入框左侧倾斜上传卡；结果只用右下角浮层提示，完整沉淀交给详情页。</p>
|
||||
<p><strong>2026-05-25 三模式版：</strong>默认首页再收敛为一个中央对话框，首页和画布底部输入框只让用户选文生图、文生视频、图生视频，然后手写提示词生成。图生视频只显示“上传图片”，不再把首帧 / 首尾帧这类模型实现概念作为主入口；营销图文不再作为首页默认入口。后端 <code>/health</code> 返回可选图片 / 视频模型、图片尺寸、视频画幅和真实可用视频时长，首页按返回值显示模型和规格选择；当前 Doubao / Seedance 生产链路单条最长 15 秒，不向用户暴露 30 秒按钮。</p>
|
||||
<p><strong>2026-05-25 根域名画布版：</strong><code>https://marketing.skg.com</code> 登录后直接进入个人生成画布，不再先进入 React 单对话框首页再点画布；<code>/canvas/</code> 只保留为旧链接兼容跳转。后续优先少改成熟画布结构，只在必要时改模式文案、生成接入和结果/队列显示。</p>
|
||||
<p><strong>2026-05-25 上游能力恢复版：</strong>用户明确要求“API 没关系，其他恢复，别削弱”。因此根域名画布恢复 <code>chatfire-AI/huobao-canvas</code> 的成熟节点和工作流结构：推荐词、AI 润色、自动执行、工作流模板、首帧/尾帧/参考图节点、图片/视频/LLM 配置、多角度分镜、故事板、绘本和批量下载都保留；只继续替换品牌、路由和 API 接入。生成请求仍走 SKG 后端 <code>/api</code> 与登录 Cookie，员工不需要个人 API Key。</p>
|
||||
</div>
|
||||
<p>当前默认业务管线是“个人隔离任务 → 根域名进入个人画布 → 在画布底部选择生成方式 → 选择模型和规格 → 图生视频时上传图片 → 手写提示词 → 在画布生成图片或视频节点 → 进入详情页继续沉淀”。默认只做三件事：文生图、文生视频、图生视频。底层仍复用既有 <code>/creative/jobs/image</code>、<code>/jobs/{id}/frames/{idx}/generate</code>、<code>/jobs/{id}/frames/{idx}/storyboard/video</code>；图生视频把上传图片作为 <code>first_image</code> 提交给视频接口，但 UI 不展示“首帧”概念。生图接口现在按前端 <code>model</code> 和 <code>size</code> 字段走 <code>auto / gpt-image-2 / gemini-3-pro-image-preview</code> 与 <code>1024x1536 / 1024x1024 / 1536x1024</code> 等图片尺寸；视频接口继续按 <code>model</code> 字段走 <code>seedance / kling / veo3 / veo</code> 别名映射，并按后端返回的 <code>video_size_options</code> 与 <code>video_duration_options</code> 提交画幅和时长，实际模型和上限以服务器环境变量为准。多人互不影响依赖后端 <code>owner_id</code> 和飞书 / 备用登录会话隔离。旧 React 单对话框首页、信息流复刻链路仍保留在源码里作为回滚/高级能力，但不作为生产默认入口。</p>
|
||||
<p>当前默认业务管线是“个人隔离任务 → 根域名进入个人画布 → 用提示词、推荐词、AI 润色或工作流模板创建节点 → 画布自动执行或手动连接图片/视频/文本节点 → 生成结果沉淀在当前个人画布 → 需要时进入详情页继续编辑”。画布不再被削成三模式入口；首帧、尾帧、参考图、图生视频、多角度分镜、故事板和绘本等上游概念按节点能力保留。底层生成仍由 <code>web/canvas-app/src/hooks/useApi.js</code> 适配到本项目 <code>/creative/jobs/image</code>、<code>/jobs/{id}/frames/{idx}/generate</code>、<code>/jobs/{id}/frames/{idx}/storyboard/video</code>，并按当前登录用户写入个人 job。多人互不影响依赖后端 <code>owner_id</code> 和飞书 / 备用登录会话隔离。旧 React 单对话框首页、信息流复刻链路仍保留在源码里作为回滚/高级能力，但不作为生产默认入口。</p>
|
||||
<div class="pipeline">
|
||||
<div class="step"><div class="num">01</div><h3>个人任务</h3><p><code>GET /jobs</code> 按当前登录用户过滤；旧无 owner 任务只对备用账号可见。</p></div>
|
||||
<div class="step"><div class="num">02</div><h3>选择方式</h3><p>首页对话框只提供文生图、文生视频、图生视频三个按钮。</p></div>
|
||||
<div class="step"><div class="num">03</div><h3>选择模型和规格</h3><p><code>GET /health</code> 返回 <code>image_options</code>、<code>image_size_options</code>、<code>video_options</code>、<code>video_size_options</code> 和 <code>video_duration_options</code>；首页按当前生成方式切换模型、图片尺寸、视频画幅和视频时长。</p></div>
|
||||
<div class="step"><div class="num">04</div><h3>上传图片 / 空白任务</h3><p><code>POST /creative/jobs/image</code> 创建轻量任务；文生图和文生视频可空白创建，图生视频上传一张图片作为视频参考。</p></div>
|
||||
<div class="step"><div class="num">05</div><h3>手写提示词</h3><p>首页不再生成营销文案或自动展开产品 / 人群配置，用户直接写图片或视频提示词。</p></div>
|
||||
<div class="step"><div class="num">06</div><h3>生成图片 / 视频</h3><p><code>generateImage</code> 传 <code>mode=text</code>、图片模型和图片尺寸；<code>generateStoryboardVideo</code> 提交文本、模型、画幅、时长，图生视频额外提交 <code>first_image</code>。视频提交后先写入 <code>queued</code> 占位，再由后端队列按并发上限启动。</p></div>
|
||||
<div class="step"><div class="num">07</div><h3>结果沉淀</h3><p>首页只在对话框下方显示最新图片或视频；视频会显示排队位置、生成进度、完成播放或失败可重试状态；所有图片/视频缩略图继续复用 <code>MediaAssetTile</code>。</p></div>
|
||||
<div class="step"><div class="num">02</div><h3>进入画布</h3><p>用户直接在根域名个人画布里操作，上游项目列表、推荐词、节点菜单、工作流模板和批量下载能力保留。</p></div>
|
||||
<div class="step"><div class="num">03</div><h3>组织节点</h3><p>可通过底部 prompt、AI 润色、自动执行、手动添加节点或工作流模板创建文本、图片、视频、LLM、配置和参考图节点。</p></div>
|
||||
<div class="step"><div class="num">04</div><h3>参考素材</h3><p>首帧、尾帧、参考图和图片节点按上游节点语义保留；提交到后端时由 <code>useApi.js</code> 转成 <code>first_image</code>、<code>last_image</code> 或图片编辑参考。</p></div>
|
||||
<div class="step"><div class="num">05</div><h3>工作流执行</h3><p>自动执行会根据提示词创建文生图、图转视频、故事板、多角度分镜或绘本等节点组；手动模式下用户可自行连接节点。</p></div>
|
||||
<div class="step"><div class="num">06</div><h3>生成图片 / 视频</h3><p><code>generateImage</code> 和 <code>generateStoryboardVideo</code> 继续走 SKG 后端 <code>/api</code>；视频提交后先写入 <code>queued</code> 占位，再由后端队列按并发上限启动。</p></div>
|
||||
<div class="step"><div class="num">07</div><h3>结果沉淀</h3><p>生成图、视频 URL、任务状态和下载入口回填到画布节点；完整任务结果仍可进入 <code>/detail/?job=</code> 查看。</p></div>
|
||||
<div class="step"><div class="num">08</div><h3>详情页</h3><p><code>/detail/?job=<id></code> 展示参考图、全量生成图、视频候选、提示词和营销图文，并支持继续生成。</p></div>
|
||||
<div class="step"><div class="num">09</div><h3>高级复刻</h3><p>旧 <code>AdRecreationBoard</code> 与 <code>/agent/</code> 作为高级入口保留，不再是默认路径。</p></div>
|
||||
</div>
|
||||
@@ -604,8 +605,8 @@
|
||||
<tr><td><code>web/next.config.mjs</code></td><td>Next.js 构建配置：静态导出、图片不走优化、禁用开发环境左下角 Next Dev Indicator，并移除 Next 16 已不支持的 <code>eslint</code> 顶层配置，避免本地 dev 出现配置 Issue 提示。</td></tr>
|
||||
<tr><td><code>web/app/globals.css</code></td><td>全局主题变量、登录页视觉样式、信息流工作台玻璃拟态 token、ReactFlow 样式引用，以及本地开发态 <code>nextjs-portal</code> 遮挡隐藏规则。工作台在 <code>skg-board-theme</code> 内按 Figma 本地 MCP 参考改成黑灰玻璃系统：深灰背景、<code>#383838</code> 胶囊侧栏、<code>rgba(255,255,255,.1)</code> 玻璃面、<code>backdrop-filter: blur(5px)</code>、<code>20px</code> 圆角、<code>10px 10px 10px rgba(0,0,0,.3)</code> 阴影和绿黄状态色；新增 <code>skg-board-shell</code>、<code>skg-board-rail</code>、<code>skg-glass-card</code>、<code>skg-glass-card--flat</code>、<code>skg-status-orb</code> 等样式。侧栏改为跟随视口拉满工作台可用高度的悬停胶囊，桌面最小 600px，展开时在同一侧栏内承载素材输入抽屉。明暗主题已分开维护 shell、panel、glass、stat、action 和音频波形 token；暗色压低灰雾和面板底色，明亮模式改为暖白工作台，避免指标卡、按钮和波形继续残留黑底/白线；顶部指标卡增加紫、黄绿、琥珀、青绿、绿色光斑变量，接近原版多色玻璃卡效果。主/次按钮、指标卡和空状态继续走统一类，避免各板块散写不同玻璃效果。</td></tr>
|
||||
<tr><td><code>web/app/page.tsx</code></td><td>旧 React 单对话框生成台源码仍保留，便于以后回滚或抽能力；当前生产根域名已经由 <code>web/canvas-app/</code> 画布产物覆盖，不再把这个 React 首页作为默认首屏。该页面里的模式也已收敛为文生图、文生视频、图生视频；图生视频只显示“上传图片”，不把“首帧/首尾帧”作为用户入口。旧 TK 复刻工作台组件仍保留在 <code>web/components/ad-recreation-board.tsx</code>，但不再作为默认首页渲染。</td></tr>
|
||||
<tr><td><code>web/canvas-app/</code></td><td>SKG 内部画布应用：从 <code>chatfire-AI/huobao-canvas</code> 交互逻辑改造而来，保留 Vue Flow 节点画布、项目列表、节点连接和批量下载等核心画布能力；移除可见原品牌、GitHub 链接、本地 API Key 设置和第三方 base URL 配置，终端可见品牌收敛为 SKG logo。生产路径固定为根域名 <code>/</code>，内部路由用 <code>/p/:id?</code>；来源说明保存在 <code>THIRD_PARTY_NOTICES.md</code>，不展示给终端用户。</td></tr>
|
||||
<tr><td><code>web/canvas-app/src/views/Canvas.vue</code></td><td>画布主交互：底部悬浮 prompt composer 吸附在画布下方，提供文生图、文生视频、图生视频三种模式；图生视频只显示“上传图片”，底部不再常驻推荐提示词 chips，避免遮挡画布操作。提交后自动创建文本节点、参考图节点、图片配置节点或视频配置节点，并用 <code>autoExecute</code> 触发生成；图片连到视频节点时默认作为视频参考图。</td></tr>
|
||||
<tr><td><code>web/canvas-app/</code></td><td>SKG 内部画布应用：从 <code>chatfire-AI/huobao-canvas</code> 交互逻辑改造而来。当前策略是“保留成熟画布能力，替换品牌/路由/API”：Vue Flow 节点画布、项目列表、推荐词、AI 润色、自动执行、工作流模板、首帧/尾帧/参考图节点、图片/视频/LLM 配置节点、模型配置和批量下载都保留；可见品牌收敛为 SKG logo，不展示上游注册链接或外部品牌。生产路径固定为根域名 <code>/</code>，内部路由用 <code>/p/:id?</code>；来源说明保存在 <code>THIRD_PARTY_NOTICES.md</code>，不展示给终端用户。</td></tr>
|
||||
<tr><td><code>web/canvas-app/src/views/Canvas.vue</code></td><td>画布主交互：恢复上游底部 prompt composer、<code>AI 润色</code>、<code>自动执行</code>、推荐词、节点菜单、工作流面板、API/模型设置入口和批量下载入口。自动执行会调用 <code>useWorkflowOrchestrator</code> 分析提示词，创建文生图、图转视频、故事板、多角度分镜或绘本节点组；手动模式只创建文本节点，用户自行连接节点。</td></tr>
|
||||
<tr><td><code>web/canvas-app/src/hooks/useApi.js</code></td><td>画布到本项目后端的适配层：不再读取浏览器 API Key，而是使用当前登录会话 Cookie 调用 <code>/api</code>。文生图 / 图生图先创建轻量 creative job，再调用 <code>/frames/0/generate</code>；文生视频 / 图生视频调用 <code>/storyboard/video</code> 并轮询 <code>/jobs/{id}</code>，完成后把图片或 mp4 URL 写回画布节点。</td></tr>
|
||||
<tr><td><code>web/scripts/sync-canvas-root.mjs</code></td><td>构建桥接脚本：在 <code>next build</code> 静态导出完成后，把 Vite 画布产物 <code>web/canvas-app/dist</code> 覆盖到 <code>web/out</code> 根目录，使 <code>https://marketing.skg.com</code> 登录后直接进入画布；旧 <code>web/scripts/sync-canvas-dist.mjs</code> 保留但不再由生产构建调用。</td></tr>
|
||||
<tr><td><code>web/app/detail/page.tsx</code></td><td>任务详情页：静态导出路由 <code>/detail/?job=<id></code>，通过 query 读取 job id，调用 <code>getJob</code> 恢复同一任务。页面展示参考图、全部生成图、视频候选、营销图文方案和历史提示词，可继续调用 <code>generateImage</code>、<code>generateStoryboardVideo</code>、<code>generateCreativeCopy</code>，并支持删除图片/视频。该页继续依赖后端 owner 过滤，用户不能通过切换 URL 读取别人的任务。</td></tr>
|
||||
@@ -1114,8 +1115,8 @@ ProductRefStateItem {
|
||||
</tr>
|
||||
<tr>
|
||||
<td><span class="tag blue">内容生产画布</span></td>
|
||||
<td>承载个人自由排列的创作空间：用户在画布上用对话框生成文本、图片和视频节点，结果按节点位置沉淀，不和默认首页的单条结果卡互相挤压。画布项目先保存在浏览器本地，生成资产进入后端个人 job。</td>
|
||||
<td>当前不做团队共享画布、管理员总览、多人协同编辑或跨浏览器同步；也不让员工在浏览器里配置上游 API Key。</td>
|
||||
<td>承载个人自由排列的创作空间：用户在画布上通过提示词、推荐词、AI 润色、自动执行、工作流模板或手动节点连接生成文本、图片和视频节点，结果按节点位置沉淀。画布项目先保存在浏览器本地，生成资产进入后端个人 job。</td>
|
||||
<td>当前不做团队共享画布、管理员总览、多人协同编辑或跨浏览器同步；API 设置不能接回上游外部注册链接，生成调用必须继续走本项目后端 <code>/api</code> 和登录会话。</td>
|
||||
<td><code>web/canvas-app/</code>、<code>deploy/nginx.conf</code>、<code>web/scripts/sync-canvas-root.mjs</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
@@ -1205,6 +1206,19 @@ ProductRefStateItem {
|
||||
<h2>变更记录</h2>
|
||||
<p>这个记录不是 git log 的替代品。它记录“产品理解发生了什么变化、影响了哪些源码、你以后描述需求时该怎么说”。后续每次改功能都要补一条。</p>
|
||||
<div class="changelog">
|
||||
<article class="change">
|
||||
<header>
|
||||
<h3>2026-05-25 · 恢复上游画布能力，API 保持 SKG 接入</h3>
|
||||
<span class="tag rose">UI</span>
|
||||
<span class="tag green">Product</span>
|
||||
<span class="tag blue">Docs</span>
|
||||
</header>
|
||||
<div class="body">
|
||||
<p><strong>问题：</strong>三模式精简版把成熟画布削弱过多，用户明确要求 <code>api 没关系</code>，其他上游画布能力直接恢复，不再把早先的 SKG 简化想法强行融入当前成熟版面。</p>
|
||||
<p><strong>改动：</strong>从 <code>chatfire-AI/huobao-canvas</code> 恢复 <code>ApiSettings.vue</code>、模型/渠道/工作流配置、<code>useWorkflowOrchestrator</code>、首页、画布和图片/视频/文本/LLM 节点。保留 SKG logo-only 品牌、根路径 <code>/</code>、内部路由 <code>/p/:id?</code> 和 <code>useApi.js</code> 的 SKG 后端适配；API 设置弹窗去掉上游注册链接和外部品牌文案。</p>
|
||||
<p><strong>影响：</strong>画布重新具备推荐词、AI 润色、自动执行、工作流模板、首帧/尾帧/参考图节点、多角度分镜、故事板、绘本和批量下载等成熟能力；生成请求仍使用当前登录会话调用本项目 <code>/api</code>，员工不需要个人 API Key。</p>
|
||||
</div>
|
||||
</article>
|
||||
<article class="change">
|
||||
<header>
|
||||
<h3>2026-05-25 · 根域名直接进入个人生成画布</h3>
|
||||
|
||||
Reference in New Issue
Block a user