RuleGo
目录

可视化编辑器

RuleGo-Editor 是一个基于 LogicFlow (opens new window) + Element Plus + Vue 3 构建的可视化规则链编辑器，内置于 RuleGo-Server 中。

# 访问

启动 RuleGo-Server 后，浏览器访问：

http://localhost:9090/editor/
1

在线体验：

编辑器详细文档：https://editor.rulego.cc/ (opens new window)

# 核心功能

# 画布操作

  • 拖拽添加节点：从左侧组件面板拖拽节点到画布
  • 连线：拖拽节点锚点创建连接关系
  • 选中/多选：框选或 Ctrl+点击多选节点
  • 撤销/重做：Ctrl+Z / Ctrl+Y
  • 复制/粘贴：Ctrl+C / Ctrl+V
  • 删除：Delete / Backspace
  • 小地图：右下角缩略图导航
  • 全屏：画布全屏编辑模式

# 节点类型

类型 说明
开始节点 规则链入口（自动生成）
结束节点 规则链出口
处理节点 标准组件节点（过滤器、转换器、动作等）
输入端点 Endpoint 节点（HTTP、MQTT、Kafka、Cron 等）
子规则链 引用其他规则链
AI Agent AI 智能体节点
AI 编排 AI 编排节点
分组 视觉分组
注释 注释节点

# 属性编辑

双击节点或右键选择"属性"打开属性编辑抽屉：

  • 基础配置：节点名称、调试模式
  • 组件配置：根据组件类型动态渲染表单，支持：
    • 文本输入、多行文本
    • 布尔开关、滑块、数字输入
    • 下拉选择、日期/时间选择器
    • 数组、Map、Struct 编辑器
    • 代码编辑器（CodeMirror，支持 JS/Lua/SQL）
    • 表达式/条件编辑器
    • JSON Schema 编辑器
    • 规则链选择器
  • 连接关系：配置输出连接的关系类型（True/False/Success/Failure 等）

# 连线编辑

双击连线可编辑关系类型标签，支持自定义关系名称。

# 画布状态

编辑器右上角显示当前画布状态：

  • 编辑中：正常编辑模式
  • 运行中：规则链正在执行
  • 已禁用：规则链被禁用

# 规则链管理

通过工具栏操作：

操作 说明
新建 创建新的规则链
打开 搜索并打开已有规则链
保存 保存当前规则链（Ctrl+S）
编辑信息 修改规则链基础信息、输入 Schema、变量
运行 打开运行对话框，配置输入参数并执行
导入/导出 规则链 JSON 的导入导出
启动/停止 部署或停止规则链
重置 恢复到上次保存的版本

# 调试功能

# 运行对话框

点击【运行】按钮打开运行配置：

  • msgType：消息类型
  • 请求体：JSON 或基于 inputSchema 的动态表单
  • 元数据：key=value 键值对
  • 自定义请求头：HTTP 请求头
  • 起始节点：从指定节点开始执行，或仅执行单个节点
  • 执行模式：同步（execute）/异步（notify）

# 调试控制台

底部面板实时显示数据流：

  • 每个节点的 IN/OUT 数据
  • 节点执行状态（蓝色处理中、绿色成功、红色失败）
  • 执行历史回放

# 节点调试数据

点击节点查看历史调试日志面板。

图文操作指南请参见 调试规则链。

# AI 功能

编辑器集成了 AI 助手面板（对话式创建/修改规则链）、AI 一键生成和 AI Agent 对话功能，详见 AI 功能 和 AI 助手使用教程。

# 组件管理

# 组件面板

左侧可折叠的组件面板：

  • 按分类树形展示所有可用组件
  • 支持启用/禁用组件
  • 拖拽组件到画布添加节点

# 组件市场

浏览和安装在线组件，一键安装/卸载。

# 嵌入集成

@rulego/editor 是一个 Vue 3 库，宿主应用按需选择集成形态：

形态 组件 TopBar 多 Tab 规则链生命周期 适用场景
A：单链嵌入 RuleGoShell + RuleGoEditor 关 无 宿主自管 宿主已有外壳（列表页/侧边栏/路由），只缺一块画布
B：工作区 RuleGoWorkspace mode:'app' 开 开 workspace 自管 独立部署 / 开箱即用 IDE
B-lite：单链工作区 RuleGoWorkspace 关 topbar/tabs 关 无 workspace 自管 iframe 嵌入 / 无外壳宿主想要单链 + dock 面板

# 形态 A：单链嵌入（宿主自管）

宿主自己加载规则链 DSL、处理保存与导航，editor 只当画布用：

<template>
  <RuleGoShell :ctx="ctx" :capabilities="{ workspace: { topBar: false, tabs: false, explorer: false } }" :chain-info="chainInfo" :lf="lf">
    <RuleGoEditor ref="editorRef" :data="dsl" :options="{ url, toolbar: { showSave: true } }" @saveOk="onSaved" />
  </RuleGoShell>
</template>

<script setup>
import { RuleGoEditor, RuleGoShell, useSingleChainShell } from '@rulego/editor'
import '@rulego/editor/style.css'

const editorRef = ref()
const { ctx, lf } = useSingleChainShell(editorRef)
// 宿主自行加载 DSL：dsl.value = await fetchRuleChain(id)
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14

# 形态 B：工作区（开箱即用 IDE）

一行接入，自带 tab 池 / 资源树 / 顶栏 / 部署 / 搜索 / 会话恢复：

<template>
  <RuleGoWorkspace :options="options" />
</template>

<script setup>
import { RuleGoWorkspace } from '@rulego/editor'
import '@rulego/editor/style.css'

const options = {
  mode: 'app',
  url: 'http://127.0.0.1:9090',  // 同源部署可省略
}
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13

能力开关（options.capabilities.workspace.*）可细粒度覆盖：topBar、tabs、explorer、palette、runDebug、dock、chainSwitcher、globalSearch、drafts、sessionRestore、admin 等。形态 B-lite 即通过关闭 topBar/tabs 等开关实现。

# iframe 嵌入（零前端代码）

editor 支持通过 iframe 嵌入到任何宿主页面（React / Angular / 原生 HTML 等），直接在 src 中传参：

<iframe
  src="http://your-server:9090/?mode=single&chainId=xxx&token=xxx"
  style="width:100%;height:100vh;border:none"
></iframe>
1
2
3
4
参数 说明
mode=single 切单链形态（默认 app，全功能工作区）
chainId=xxx 打开指定规则链
token=xxx 鉴权 key，自动带 Authorization: Bearer 头
apiBase=xxx 显式指定后端地址（跨域部署时必填，同源可省略）

跨源部署时后端需开启 CORS（allow_cors = true，默认已开启），且不要设置 X-Frame-Options: DENY。

# 实例方法（通过 ref 调用）

RuleGoEditor（单画布）：

方法 / 属性 说明
render(data) 渲染一条规则链（清空画布、重置 undo）
save() 保存画布（校验 → 诊断确认 → 调后端）
getData() 获取当前画布 DSL
openChain(idOrData) 命令式打开：传 id 走后端拉取，传 DSL 直接渲染
invokeAction(id, ...args) 触发已注册动作（如 core:save / core:run）
addAction() / removeAction() / listActions() 自定义动作管理
isDirty 画布是否有未保存修改
setLocales(locales) 注入自定义语言包
reloadComponents() 重新拉取组件列表

RuleGoWorkspace（工作区）：openChain(id)、saveActive()、saveAll()、pool（tab 池）等。

完整集成指南（能力开关、token 注入、主题样式、导出清单）见 rulego-editor/docs/guide.md (opens new window)。

在 GitHub 上编辑此页 (opens new window)
上次更新: 2026/08/13, 09:22:24
规则链部署与调用
AI 助手使用教程

← AI 助手使用教程→

Theme by Vdoing | Copyright © 2023-2026 RuleGo Team | Apache 2.0 License