AI 辅助开发
功能概述
本功能目前面向表单中的单行文本字段开放，目的提供一种以对话方式，让AI自动写代码来生成一个定制展示形态与交互方式。如果你熟悉前端框架，也可以基于AI生成的代码再修改实现字段的定制开发。
使用介绍
用户在字段属性面板中进入「AI 辅助开发」抽屉，以自然语言描述需求，系统生成一份可运行的前端组件代码，并在抽屉左侧实时渲染效果。用户可在抽屉内直接修改代码并重新运行，也可切换 PC、移动、表格、卡片四种预览形态，以及查看、编辑、禁用三种字段状态。
功能入口
进入表单设计界面，选中一个单行文本字段，打开右侧属性面板。在「描述信息」下方打开「AI自定义」开关，点击「进入AI辅助开发」按钮。页面滑出全屏抽屉，标题为「AI 辅助开发」。
首次打开的空态：左侧为引导动画、说明文案与「试一试」建议，右侧为对话引导；此时工具条与模式栏均不显示
功能布局介绍
对话生成代码
以自然语言描述需求，系统逐字输出代码自动渲染预览，并加载操作界面区域与控件
| 区域 | 空间 | 说明 |
|---|---|---|
| 左侧顶部 | 页签「实时预览」、「文件名.jsx」、「文件名.css」 | 对应文件存在时才出现该页签 |
| 左侧顶部 | 运行、撤销、恢复、控制台、引用其他字段、开发指南 | 「实时预览」页签下只有运行、控制台、引用其他字段、开发指南 4 个；撤销、恢复仅在代码页签出现 |
| 左侧模式栏 | 查看、编辑、禁用 | 仅在 PC 与移动视图中出现，默认「编辑」 |
| 左侧模式栏 | PC、移动、表格、卡片 | 再次点击当前非 PC 选项时回到 PC |
| 左侧主体 | 预览舞台 | 三种形态：空态（引导动画与建议）、原生输入框、自定义组件 |
| 左侧底部 | 错误提示卡 | 标题「出了点问题」，正文「运行代码时出问题了。」，含「修正错误」与关闭按钮 |
| 左侧底部 | 控制台 | 无内容时显示「没有输出」 |
| 右侧 | 消息流、输入框、图片、语音、删除历史、发送/停止 | 生成过程中发送按钮变为停止 |
代码编辑
代码支持手动编辑
jsx 与 css 两个页签，修改后点击「运行」生效，支持撤销与恢复。
控制台
控制台模拟输出
引用其他字段：
-
将本表单其它字段的值提供给组件读取，用于展示或计算。
-
还支持在AI对话中直接@进行关联引用其他字段。
异常修复
编译或运行失败时预览置空并显示错误提示卡，可点击「修正错误」把错误信息发给 AI 继续处理。
实时预览
四种预览：PC、移动、表格、卡片；PC 与移动支持查看、编辑、禁用三种状态。每种场景可以单独和AI描述该场景需求。
PC预览
移动端预览
表格预览
卡片预览
单独控制界面展示
以表格预览为例，我想让五星评分在表格中展示，可以直接和AI进行描述。
AI交互方式
支持能力：图片上传、语音输入、历史记录翻页、清空历史、生成中断
图片上传：目前仅支持上传图片，最多5张，单张最大5MB
退出并保存
关闭抽屉后，字段配置中记录本次生成的组件，设计器画布上该字段标签左侧显示 AI 标识。保存表单后，该字段在填表页、记录详情、表格视图、卡片视图中按该组件渲染，用户输入的内容仍按单行文本类型写入数据库。
- 关闭抽屉即完成配置写入，字段标签出现 AI 标识。
- 保存表单并刷新后，标识、代码与引用关系保持不变。
- 复制字段后两个字段相互独立，修改互不影响（复制子表单时，其内部字段同样独立）。
- 删除字段并保存后，该字段及其配置一并移除，不影响其它已配置字段。
- 将代码全部清空后关闭，字段退回普通输入框且标识消失，仍可再次进入继续配置。
场景示范
根据AI自定义的AI辅助开发，我们可以将单行文本调整成图形展示，如常用的：用户评分，项目进度条，任务优先级，还有商务轨迹都调整成图形更方便和直观的展示当前状态。
PC表单展示效果：
PC画廊展示效果：
新增数据效果：
移动端效果：
动态展示：
