AI 生成页面

UI 编辑器内置 AI 助手，可根据文字描述自动生成页面布局，再人工微调后保存。

UI 编辑器内置 AI 助手，可根据文字描述自动生成页面布局，再人工微调后保存。

UI管理 → 页面配置 → 设计 → AI 面板·运营 / UI 编辑人员

• AI 中台模块已开通（未配置时面板不可用，见下文）
• 账号具备页面配置编辑权限

入口

• 宽屏：右侧或独立栏 AI 面板
• 手机管理端：底部 Tab 切换到 AI

未配置 AI 中台时

AI 面板依赖全站 AI 中台；未配通前运营侧无法生成布局。

侧栏没有「AI中台」= 模块未开通或账号无权限，需联系站点管理员或交付方开通，不是 UI 编辑器自身故障。

界面表现生成按钮置灰或点击后提示「AI 服务不可用」「无可用模型」等；部分版本 AI Tab 直接隐藏

管理员需完成AI中台 → 供应商管理（Key 连通/拨测）→ 模型管理 → 场景路由绑定 UI 页面生成场景

运营可先做不依赖 AI：按组件手册手搭；或请管理员配好中台后再用 AI 加速冷启动

AI 中台配置文档

我的模块文档

使用步骤

重大改版或已启用页面上试 AI：先复制一条配置草稿，在副本里生成，满意后再启用替换线上版本。

1. 0
   导出 JSON 备份（强烈建议）顶栏「导出 JSON」下载当前画布 — 应用 AI 方案会覆盖全部组件，误操作可导入恢复
2. 1
   描述需求用自然语言说明想要的页面，如：校园首页 + 轮播 + 4 列金刚区 + 热门话题 + 笔记列表
3. 2
   生成点击生成，等待 AI 返回布局方案（需 AI 中台已配通且场景路由可用）
4. 3
   预览与应用确认方案后「应用到画布」— 再次提醒：将清空当前画布已有内容；已有线上版本务必先完成第 0 步备份
5. 4
   人工微调替换图片素材、检查点击动作、确认筛选标签联动 Key、样式 Tab 微调间距颜色
6. 5
   保存并启用与普通编辑相同：保存 → 列表启用

AI 中台文档

适用场景

适合快速搭首页框架；新站点冷启动；复制相似结构到新区

不太适合精细像素级视觉稿；复杂表单计价逻辑；圈子页头区专属配置

注意事项

• AI 使用的是当前页面类型允许的组件子集（例如服务表单页不会生成轮播图）
• 生成内容中的示例图片、文案需替换为真实运营素材
• 笔记列表等数据组件在编辑器中为演示数据，客户端会拉取真实 API
• AI 调用计入 AI 用量，可在 AI中台 → 用量与日志 查看

与 AI 中台的关系

未配置 AI 中台时，AI 面板不可用或报错，请先在 AI中台 → 供应商管理 添加可用模型并完成场景路由。

AI 中台配置模型、密钥、场景路由（管理员一次性配置）

UI 编辑器 AI 面板运营人员日常生成页面布局

用量与排障AI中台 → 用量与日志：查看 ui 页面生成类调用是否成功、失败原因

常见问题

生成按钮点不了AI 中台未开通或未配场景路由；见上文「未配置 AI 中台时」。

应用后想撤销若生成前已导出 JSON：顶栏导入 JSON 恢复；否则用撤销（仅会话内有效）或列表「复制」回退到旧配置。

生成结果缺组件或报灰AI 遵守当前页面类型可用组件子集；服务表单页不会生成轮播等。

相关文档

AI 中台编辑器界面说明导入导出与备份组件手册