好用的低代码可视化表单设计器 FcDesigner 是一款基于 Vue 的开源工具（设计器项目名 form-create-designer），通过数据驱动表单渲染。可以拖拽生成表单规则，再由配套渲染器 form-create 加载 JSON 并渲染。面向政务、OA、ERP、电商、流程管理里要做动态表单的开发者和业务配置同学。

审批单不想从空白画布拖、录入页字段要用中文改、OA 里有的配置页开 AI 有的必须藏——这些都是 AI 表单助理。FcDesigner 用 

 打开 AI 面板，业务同学在面板里描述需求，助理服务生成或修改 FormCreate 规则并写回画布。能力包括智能表单生成、表单修改优化、流式对话（实时显示思考过程和执行步骤）、消息历史（自动保存，支持清除和恢复）。Token 通过访问官网申请 API token，把文档占位符 

 换成你从官网获取的有效 token。私有化把开源助理跑在自己的机器上，启动后把 

http://localhost:3001/api/chat/completions

截图是打开 AI 面板后的设计器：左侧竖条底部「AI」高亮，中间对话区标题是「AI FormCreate 智能表单助理」，右侧是画布。对话区有欢迎语和「你可以试着问我」提示卡片；中间已经有两轮对话，用户先发「生成一个就诊满意度问卷表单」，助理回「已处理完毕！」；再发「让姓名字段必填」，再回「已处理完毕！」。底部输入框占位「请描述您的需求」，旁边有发送。画布上是就诊满意度问卷，含就诊满意度、联系方式、意见反馈、是否推荐、服务满意度、带红星必填的「您的姓名」、就诊日期、流程满意度星级。顶部有导入、导出、绿色「保存」、蓝色「预览」、红色「清空」。点「预览」只按当前画布渲染表单；真正改表是在 AI 面板发出提示词之后，画布会跟着更新。

FcDesigner AI 表单助理靠哪几个配置开关？

 组件上的方法）。整块不显示写 

。Token 通过访问官网申请 API token；文档里的 

 是占位符，必须换成有效 token，不要当密钥用。请求头里的 token 优先，没有再落到服务端 

。助理服务根据自然语言生成或修改 FormCreate 规则；设计器用户只在 AI 面板里说话。

流式对话会依次露出思考步骤：分析需求、生成方案、执行操作、验证结果。消息右下角可以复制、删除；AI 面板头部可以清除对话。历史自动存本地存储，刷新页面还能恢复。

FcDesigner 怎么用 config.ai.token 打开 AI 表单助理？审批单怎么对话改表？

基本示例：审批单配置页写 config.ai.token

 审批单配置页。业务同学要用自然语言出表，先把 AI 面板打开。

<template>
    <fc-designer ref="designer" :config="config" />
</template>
<script setup>
    const config = {
        ai: {
            token: 'Bearer fc-d8ed***************ffab0'  // 请使用您从官网获取的有效 token
        }
    }
</script>


预览后：左侧出现 AI 入口，点开就是 AI 面板。此时还没发提示词，画布可以仍是空的。Token 无效时面板在，但发消息不会改表。点「预览」看到的是当前画布，和 AI 对话是两件事。

再一个示例：对话生成建议收集表单再追加字段

 录入页要一张建议收集表，生成后再补一块用户信息，用中文提示词在 AI 面板发，不要自己拖字段。

生成一个用户注册表单，包含：
- 用户名（必填，3-20个字符）
- 邮箱（必填，邮箱格式验证）
- 密码（必填，至少8位）
- 确认密码（必填，与密码一致）
- 手机号（可选，11位数字）


复杂需求拆开说：先结构，再校验，最后样式。官方提示词也可以直接用，例如：

创建一个建议收集表单，包含联系人、联系邮箱、分类和建议内容
追加一个用户信息表单
删除商品简介字段
商品价格字段使用数字输入框组件
当单选框选择 "选项1" 时，显示输入框组件
根据出生日期自动计算年龄
设置输入框为必填，并限制长度必须大于13
添加手机号格式验证
添加自定义验证：确认密码必须与密码一致
添加一个标签组件，显示文本为 "Tag"


发送后：第一句会在画布生成建议收集（或注册）字段；第二句「追加一个用户信息表单」会在已有规则上继续加，不用重头生成。流式过程里能看到分析需求、生成方案、执行操作、验证结果。点「预览」看到的就是改完后的表单。消息右下角复制、删除；面板头部清除。刷新后历史还在，因为存在本地存储。

私有化怎么 clone form-create-assistant？设计器怎么指到 localhost？

基本示例：仓库、写 .env、启动服务

 内网审批单不能走官网 token，要在自己的服务器跑助理，上游用 DeepSeek。

git clone form-create-assistant
cd form-create-assistant
pnpm install


# .env
PORT=3001
DEFAULT_AGENT=deepseek
DEFAULT_MODEL=deepseek-chat
DEFAULT_TOKEN=your-api-key-here
AGENT_TIMEOUT=180000


 只在请求头没带密钥时生效。此时还没有打开设计器 AI 面板，下一步要把 

再一个示例：设计器 config.ai.api 指向 /api/chat/completions

 审批单配置页已经能打开，但 AI 要打你们自己的助理，而不是官网默认地址。

<template>
    <fc-designer ref="designer" :config="config" />
</template>
<script setup>
    const config = {
        ai: {
            api: 'http://localhost:3001/api/chat/completions',
            token: 'Bearer your-api-key-here' // 服务端已配 DEFAULT_TOKEN 时可省略
        }
    }
</script>


const config = {
    ai: {
        api: 'http://localhost:3001/api/chat/completions',
        token: 'Bearer your-api-key-here'
    }
}


发送后：AI 面板的对话打到你们的 

。Token 优先用请求头；没带才用 

。画布规则仍由助理服务改写，业务同学不用自己调工具。把主机名换成内网域名即可嵌进 OA。

OA 里怎么用 showAi 隐藏 AI？DEFAULT_AGENT=other 怎么接自定义接口？

基本示例：OA 配置页 config.showAi = false

 设计器嵌进 OA。这页给业务同学拖字段，不能出现 AI 面板。

<template>
    <fc-designer ref="designer" :config="config" />
</template>
<script setup>
    const config = {
        showAi: false
    }
</script>


预览后：AI 模块被藏起来，左侧没有 AI 入口，对话区不会出现。画布、预览、拖拽仍可用。这只影响设计器展示，不会替你关掉已经启动的助理进程。

再一个示例：DEFAULT_AGENT=other + AGENT_API

 公司已有 OpenAI 兼容对话接口，助理不要走 DeepSeek / ZhipuAI / Qwen 默认地址。

# .env
DEFAULT_AGENT=other
AGENT_API=https://api.example.com/v1/chat/completions
DEFAULT_TOKEN=your-custom-api-key


启动后：助理收到设计器的对话，再转发到 

 才走这个变量。设计器侧字段还是 

Q: token 从哪申请？文档里的 Bearer fc-d8ed

A: Token 通过访问官网申请 API token。

 是占位符，必须换成从官网获取的有效 token，不要当真实密钥，也不要自己拼申请路径。云端启用只写 

Q: config.ai.token 和 config.ai.api 有什么区别？请求头和 DEFAULT

 负责启用并把密钥放进请求头。

 只在私有化时写，值是助理服务的 

，不是设计器组件方法。私有化先启动助理，再让设计器指向这个地址。密钥优先用请求头；请求没带 Authorization 时，才用服务端 

Q: 对话怎么写？历史存在哪？复制、删除、清除怎么点？

A: 提示词要写成字段清单，不要只说「做一个注册表单」。可先「创建一个建议收集表单，包含联系人、联系邮箱、分类和建议内容」，再「追加一个用户信息表单」；改错用「这个字段应该是数字类型」。发完后画布更新，点「预览」看渲染结果。流式步骤是分析需求、生成方案、执行操作、验证结果。消息右下角复制、删除；AI 面板头部清除。历史自动存本地存储，刷新可恢复。用户只在 AI 面板说话，不要自己去调助理内部工具。

A: 给业务同学、不需要助理的页面写 

，AI 入口和面板都会藏掉；需要助理的审批单配置页不要共用这份配置。私有化 

 的 OpenAI 兼容接口）。设计器始终连 

开源 JSON 表单设计器 FcDesigner：AI 表单助理 token 配置与私有化部署实战

FcDesigner 的 AI 表单助理教程：用 config.ai.token 打开 AI 面板，自然语言生成与修改表单；并介绍私有化部署 form-create-assistant、把 config.ai.api 指向本地服务。

人工智能

FcDesigner是基于Vue的开源低代码可视化表单设计器，通过拖拽生成表单规则，配合form-create渲染器加载JSON。支持AI表单助理，通过config.ai.token启用，可智能生成、修改表单，支持流式对话和消息历史。私有化部署需配置config.ai.api指向本地服务，showAi=false可隐藏AI面板。适用于政务、OA、ERP等场景的动态表单配置。

服务器

DeepSeek

JSON

热销域名限时优惠，新客首年免费！


domain

文章

问答

视频

教程

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

EdgeOne AI 安全实战专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

社区新版编辑器体验调研

FcDesigner是基于Vue的开源低代码可视化表单设计器，通过拖拽生成表单规则，配合form-create渲染器加载JSON。支持AI表单助理，通过config.ai.token启用，可智能生成、修改表单，支持流式对话和消息历史。私有化部署需配置config.ai.api指向本地服务，showAi=false可隐藏...

开源 JSON 表单设计器 FcDesigner：AI 表单助理 token 配置与私有化部署实战

开源 JSON 表单设计器 FcDesigner：AI 表单助理 token 配置与私有化部署实战

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐