MG-02-006 交互与接口
状态:范围、普通配置无二次确认、单管理员密码/会话及 D08 渠道编辑布局已确认;接口字段/技术映射为建议稿。现代 UI 的目标是减少填写、切换与理解成本;复用旧表单和结果组件的可用行为,同时重整交互,不直接复制全部旧页面。
导航与页面职责
| 一级入口 | 主要内容 | 操作位置 |
|---|---|---|
| 总览 | 最近生成、可用/待验证供给、错误与队列、需要处理事项 | 点击直达渠道或记录详情 |
| 渠道 | 渠道列表 → 单渠道的连接与型号/规格 | 新建、维护、发现、验证、启停、归档 |
| 模型与调度 | 标准模型/独立别名 → 引用供给与策略 | 选择供给、排序、模拟/真实路由测试、保存生效 |
| 生成记录 | API/测试记录、旧视频历史与只读档案、详情及结果 | 筛选、播放、下载、核对、恢复取结果 |
| 设置 | 单管理员密码/会话、服务接入、存储健康、版本和永久历史保留 | 有效配置与说明;高级项按需展开 |
健康、容量和错误首先就近展示;详细运维放在总览/设置中,不要求管理员为了改一个型号先逛多个后台模块。内部 API 文档从设置或帮助进入,不占常用主导航。
渠道详情使用面包屑、固定标题/状态,连接设置与型号列表有清晰分区。型号可以折叠规格,但常见参数和价格不能藏在层层弹窗。记录详情可独立深链接,返回保留筛选和滚动位置。桌面表格适合比较,窄屏改为可操作摘要与独立详情,不要求横向找到最末列按钮。
视频渠道左右布局(MG-NAV-05)
视频渠道页与视频调度采用相同的两级浏览结构:桌面左侧为渠道导航,右侧为所选渠道标题、状态与图标操作、筛选和型号目录。渠道选择即时切换右侧内容并重置型号筛选,保留channel_id/supply_id深链;查看与切换不写配置。目录独立滚动,导航和筛选保持可见。窄屏改为上方渠道选择、下方目录,表格横向滚动限制在目录区域。既有编辑、JSON草稿保护、测试与启停流程沿用。
渠道名称修改(MG-CHANNEL-03)
视频渠道标题旁的编辑图标打开名称弹窗;保存名称直接调用既有渠道PATCH,回读后同步渠道导航及详情,不再等待页面保存。名称去首尾空白、不能为空、不能与其他渠道重复;取消不写入。请求携带明确版本,失败保留输入,版本冲突需显式读取最新版本再保存;不覆盖连接、凭据、状态、供给或调度设置。视频渠道更多菜单不再提供图片渠道跳转,仍可通过主导航进入图片渠道。
渠道详情与共享编辑草稿
D08 已确认采用“型号组 → 规格表”,不要求每个型号进入独立编辑页。页面顶部为渠道名称、状态和连接摘要;连接设置展开后在自己的编辑范围保存。下方型号区支持搜索/折叠,规格并排比较。型号/规格区只有一份草稿和一个持续可见的保存主按钮,侧边区不再放第二个保存或发布按钮。
| 编辑位置 | 内容 | 行为 |
|---|---|---|
| 型号组标题 | 显示名、共享参数摘要、配置/验证状态、参数入口 | 展开规格;打开当前型号参数侧边区 |
| 规格表 | 分辨率、上游原始型号、上游分辨率映射、计价方式、金额、币种 | 常用字段直接编辑;标签和单位清楚,价格来源/核验状态就近显示 |
| 型号参数侧边区 | 提示词要求、时长枚举/范围、比例、素材数量/首尾帧、音频模式 | 编辑型号共享默认;高级 seed/增强/真人限制按需展开 |
| 规格例外/复杂采购侧边区 | 与组默认不同的参数、分档价/附加费等 | 明确当前规格及继承/覆盖来源;表格显示有效摘要 |
| 规格状态与测试入口 | 停用/待验证/已验证、健康/容量、已有测试记录 | 状态分开表达;真实测试独立明确提交,不随编辑触发 |
同一渠道可以连续修改多个型号组和规格后一次保存。02 保存与生效 定义全部变更的原子范围和暂停/生效条件。路由页只引用这些供给,不再填写上游型号、能力或采购价格。
表格输入、侧边输入和页内参数摘要读取同一草稿。关闭侧边区、按 Esc 或切换到另一型号保留本页未保存修改,再次打开显示修改后的值;关闭不是取消或丢弃。只有离开有未保存变化的编辑范围、刷新/关闭页面时提示处理草稿;本轮不承诺刷新后持久恢复草稿,也不在浏览器存储真实凭据。
保存前就在行/字段附近显示错误和受影响规格。复杂字段错误提供定位入口,打开侧边区定位到对应字段;隐藏分组也应在标题标错。失败或版本冲突保留全部草稿,展示服务器安全差异供管理员处理,不自动覆盖重试;成功以有效版本回读并清除已保存变化,不再弹“成功确认”。
打开页面、输入、切换参数和保存配置均不自动请求 Provider 生成。真实测试引用明确保存后的配置版本;有相关未保存修改时行内提示先保存,再由管理员点击“提交付费测试”,不把保存和付费合成一次隐含操作。固定供给测试可使用停用但已保存的草稿版本,测试完成不自动启用。
窄屏规格行保留常用字段和摘要,参数侧边区可占满可用宽度,仍使用同一草稿和保存流程。表格/侧边区都有可读标签、键盘焦点及错误关联,关闭后焦点返回触发入口;不要求在多个嵌套弹窗里完成一行配置。
表单与反馈
字段标签用业务名称,必要处显示单位和示例;分辨率/素材/计价方式决定相关条件字段。常用项优先,协议覆盖、罕见限制等折叠为高级项。复用旧参数预设及校验,但预设填入后仍可修改,不是额外确认流程。
一种配置只有一个编辑草稿;主按钮根据动作写“保存”“保存并生效”“保存并暂停受影响供给”。改变关键字段时行内显示影响,不在点击每个字段时弹确认。输入校验定位字段并保留值;服务器安全错误放在相关区域。异步检查行内显示处理中与结果。
普通成功使用不阻塞的简短反馈与真实数据回读,不能“保存确认 → 成功弹窗确认 → 发布确认”串联。必要的多步接入表示工作阶段,可在同一页面完成,不强制用户按向导顺序反复返回。
未保存修改离开时才提示保存/放弃;已保存或未修改离开不提示。保存期间按钮防重复,失败保留草稿。发现/连接检查可以重试只读调用;配置写入冲突不能自动换版本重提。
视觉与可用性规则
沿用 React/TypeScript 与现有组件基础,统一表格、输入、选择器、按钮、标签、加载/空态,不混用多套后台控件。视觉层级以页面标题、业务分区、字段和辅助文字组织,状态有明确文本及语义颜色,不能只靠红绿点表达。
渠道/规格用适合比较的紧凑表格;编辑用有足够间距的标签与输入,不把所有高级字段堆成一长页,也不把业务数据默认展示为 JSON。主操作固定且唯一,次要操作收进合理菜单;危险操作有明确名称与范围,不用无标签图标掩盖后果。价格单位、时间、比例格式统一,未知值不显示成空白或 0。
所有字段有可读标签、错误关联与键盘焦点;抽屉/对话框可键盘关闭并回到触发位置。提交后的任务可以离开页面继续运行,不锁住整个平台直到生成结束。桌面/窄屏、长名称、多规格、无结果及大列表都要验证;动画克制并尊重减少动态效果设置。
操作确认矩阵
| 操作 | 是否额外确认 | 目标行为 |
|---|---|---|
| 打开页面、查看详情、筛选、展开、预览、下载 | 否 | 直接执行授权 GET |
| 普通编辑、保存参数/价格、调整路由顺序 | 否 | 一个明确主按钮;行内显示生效/受影响范围 |
| 检查连接、读取目录、模拟选路 | 否 | 行内进度与结果,无付费提交 |
| 导入选中的目录/应用差异 | 否 | 当前差异界面是可审阅操作;选中后一次应用 |
| 启用通过门禁的单规格、停用 | 否 | 明确动作与范围;门禁不足说明原因,不二次弹窗 |
| 关键配置导致暂停 | 否 | 保存前行内影响清楚,按钮注明后果;不能暗中停用 |
| 付费生成/供给测试 | 一次明确付费操作 | 在提交表单直接显示规格与预计采购费,按钮“提交付费测试”;已知则展示估价,未知明确标记待核实,不层叠弹窗 |
| 归档渠道/批量停用等大范围动作 | 一次 | 列出受影响对象与在途处理;完成不再弹成功确认 |
| 恢复已归档渠道 | 否 | 明确恢复为停用,行内反馈 |
| 历史记录硬删除、按期清理历史结果 | 无此日常操作 | 全部历史保留,不因渠道归档删除 |
| 密钥撤销、未引用临时文件大范围清理 | 一次 | 审阅影响与引用,服务端校验 |
| 保存后“成功” | 否 | Toast/行内状态与回读结果 |
| 离开未保存草稿 | 有条件 | 仅存在实际未保存变化时提示 |
付费操作要求使用者明确知道提交收费;不要求每次先勾框再点按钮再确认弹窗。费用未知仍须明确上游可能收费,不能在非付费名称下隐含提交。双击与跨标签防重复依靠服务端持久 token,前端禁用只是辅助。
站内真实调用测试
不新增日常生成工作台。渠道规格“真实测试”固定 Supply,模型“真实调用测试”走有效路由;填写提示词/参数/素材,明确提交按钮直接发起调用,无多层确认。固定测试可验证草稿但不自动启用;路由测试验证 x 及失败后 B/x。只读模拟与真实测试名称和收费说明清楚区分。
提交后进入统一详情,离开/刷新可恢复;使用实际后端链。参数、错误、A/B 顺序、采购费用和实际播放结果全部可查。
独立管理会话
D03 已确认首轮一个管理员账号,密码登录,采用独立身份及可撤销的同源 HttpOnly、Secure 会话,刷新/直接打开记录链接可恢复授权;退出后会话与媒体读取失效。首个管理员在受控部署中初始化,密码用强不可逆哈希,不提交仓库/普通日志;改密码/退出撤销会话。会话有界,刷新在有效期内恢复;忘记密码由受控服务器操作重置。具体有效期/限速作为部署参数,不导入旧密码/钱包。
管理会话不能自动取得服务调用权限。服务 Key、管理身份、Provider 凭据、TOS 凭据分别处理;不把任一种真实密钥塞进 localStorage、URL 或播放器。Cookie 写操作须同源/CSRF 保护,登录/登出及错误跳转不泄露密钥。首轮不扩展员工多账号/角色;内容授权与审计仍有明确管理员主体。
历史管理 Bearer API 如保留,用于获准运维程序,不要求浏览器每次刷新再输入长管理 Key。新增会话不是复活旧客户账号/销售模块。
API:现有事实与目标切片
以下是最小管理切片建议,新增路径仅为草案,不是已存在端点。OpenAI/ModelArk 公共入口继续兼容,管理 API 不假装所有消费方已联调。
| 能力 | 已有代码/入口 | 目标与差异 |
|---|---|---|
| 服务视频 API | POST/GET /v1/videos、/v1/videos/{id}/content;ModelArk task API | 保留响应形状,补跨重启/Unknown 语义与契约测试 |
| 管理认证 | GET /admin/v1/access,管理 Bearer | 拟新增 /admin/v1/session 创建/读取/撤销;支持浏览器刷新与内容权限 |
| 渠道 | /admin/v1/channels、credentials、test-connection、discover-models、discover-prices、models/sync/import | 复用服务;同步只产出差异,导入不自动验证/启用 |
| 供给配置 | /admin/v1/supplies/{id}、video-capability、cost-rules、procurement-terms 分别操作 | 拟聚合同一渠道的已修改型号组/规格保存与版本读取;参数/成本/来源同一原子提交 |
| 标准模型 | /admin/v1/public-models 及 bindings、dispatch-policy、publish、simulate | 拟聚合模型配置保存/生效;编辑有效模型不造成强制全停;simulate 复用真实决策 |
| 真实测试 | /admin/v1/supplies/{id}/test,同步证据路径 | 拟异步创建固定供给与模型完整路由任务;固定不换供给,路由按配置重试,保留真实结果 |
| 记录 | /admin/v1/records 与 /{requestID} | 扩充分页/筛选/摘要,详情复用 Attempt 和结果;快照可按需加载 |
| 内容 | /v1/content/{outputID},服务 Bearer | 拟新增管理同源内容入口,GET/HEAD/Range 使用会话和对象授权 |
| 运维/设置 | /admin/v1/dashboard、capacity、queues、alerts、settings | 合理投影到页面,不增加额外日常维护副本 |
渠道内型号/规格聚合路径在领域存储映射后命名;不能先在前端发明接口或从旧 /api/channel/* 把调用路径照搬。每个实现任务必须列出现有消费者、兼容期、实际响应字段及错误映射。
写入与异步契约
配置写入带 If-Match/version,返回生效版本、影响范围、字段状态和审计关联 ID;不含秘密。冲突返回明确 409/412 语义及安全差异;旧 API 已采用的状态码在兼容期保留。配置事务失败不产生部分生效;同一渠道的编辑提交返回每个受影响型号/规格的版本与字段错误关联,连接编辑保持独立范围。
既有公开端点的字段/状态、可选幂等键及错误码在兼容期保持;若新增强制字段需版本化并明确消费者迁移,不能在此次 UI 重做中静默破坏。管理真实测试带稳定 operation token、请求指纹、模式及版本,明确上游收费;固定供给最多一次,路由按配置首次加最多一次。服务端先原子占用操作,再创建普通任务;重复 token 返回同一任务,不再 POST Provider。同 token 不同输入冲突。请求断开后客户端可按操作标识找回任务。
异步接口返回被持久接受的任务 ID/查询入口,不用长连接等生成完。状态查询返回产品阶段、Provider 事实和可安全执行的动作;GET 只读,不隐式提交。公共协议的既有状态字段维持兼容,内部 Unknown/结果恢复细节通过管理投影或明确扩展字段表达。
记录列表增加 next_cursor/has_more、时间/渠道/用途等过滤;对象详情返回平台 output ID、授权内容路径、可用性与过期信息。费用字段显式区分 estimated/actual/refund/unknown,金额字符串附 currency/source。列表不携带完整敏感请求或签名 URL。
错误有稳定业务 code、相关字段、safe message、trace ID、是否允许当前动作;不能把所有 200 响应写“成功”,也不能把任意报错通通称为网络失败。未知受理错误必须带“先查询/核对”的含义,不能诱导通用自动重试。
实现约束
React/TypeScript、现有组件体系和 Go/chi 沿用;旧表单、素材校验、播放器和详情行为按 06 提取。全页大文件可拆组件,但不因“现代 UI”另造动态插件、可视化工作流或并行配置域。请求缓存失效、真实回读、状态恢复和对象权限一起验收,不能只验静态截图。
2026-10-14 更新:新渠道优先使用 new-api 视频插件兼容层,保留本页 Go 内核与既有原生能力。此前禁止插件的接入描述由新决定取代;没有部署或切流。
渠道编辑与型号删除(MG-CHANNEL-04)
渠道标题编辑图标及更多菜单“编辑渠道”统一打开名称、API地址、并发上限、请求/价格协议和备注表单,直接保存并回读,供应商类型只读。已启用渠道先停用再改连接地址/协议,凭据与启停可从该表单进入原有操作。保留未展示的连接设置,不将凭据明文放入普通表单。
型号行使用删除图标,确认说明将从目录移除并停用全部相关规格、保留历史与调度引用。型号状态筛选可查看“已删除”,提供恢复图标;恢复回目录但规格保持停用。重新拉取目录不恢复人工删除。普通查看/取消不写入,保存/删除失败保留错误,409不自动重试。删除不会修改标准模型或清除既有在途任务。