Configuration
# Usage
import the component through vue:
<RuleGoEditor
ref="ruleGoEditorRef"
:data="data"
:options="options"/>
<script setup>
import RuleGoEditor from './components/RuleGoEditor.vue'
import {ref} from "vue";
//reference to ruleGoEditor, which exposes methods that can be called visually
const ruleGoEditorRef = ref();
// Optional parameters
const options = ref()
// Rule chain data
const data = ref()
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
# data
attribute
RuleGo rule chain configuration, format reference: Rule Chain (opens new window) used for rendering flowcharts, If not provided, the workspace is in the initialization state.
# options
attribute
Field | Type | Required | Default Value | Description |
---|---|---|---|---|
url | string | No | - | Root path of RuleGo service interaction API |
ruleChain.id | string | No | Automatically generated UUID | Rule chain ID |
ruleChain.name | string | No | - | Rule chain name |
startX | number | No | 280 | X coordinate of the first INPUT node |
startY | number | No | 280 | Y coordinate of the first INPUT node |
toolbar | toolbar | No | - | Used to display tool bar buttons |
components | array | No | Rule Chain Node Components |
Allows setting logicFlow configuration, refer to: Documentation (opens new window)
# toolbar
Field | Type | Required | Default | Description |
---|---|---|---|---|
showTile | Boolean | No | true | Whether to display the rule chain title |
showSelection | Boolean | No | true | Whether to display the [Select] button |
showUndo | Boolean | No | true | Whether to display the [Undo] button |
showRedo | Boolean | No | true | Whether to display the [Redo/Create] button |
showMinMap | Boolean | No | true | Whether to display the [Mini Map] button |
showTest | Boolean | No | true | Whether to display the [Run] button |
showMinMap | Boolean | No | true | Whether to display the [Mini Map] button |
showSetting | Boolean | No | true | Whether to display the [Settings] button |
showFullScreen | Boolean | No | true | Whether to display the [Full Screen] button |
showNew | Boolean | No | true | Whether to display the [Settings - New] button |
showOpen | Boolean | No | true | Whether to display the [Settings - Open] button |
showEdit | Boolean | No | true | Whether to display the [Settings - Edit] button |
showIntegration | Boolean | No | true | Whether to display the [Settings - Integration] button |
showExport | Boolean | No | true | Whether to display the [Settings - Export] button |
showImport | Boolean | No | true | Whether to display the [Settings - Import] button |
showNodeMgt | Boolean | No | true | Whether to display the [Settings - Component Management] button |
showUserSetting | Boolean | No | true | Whether to display the [Settings - User Settings] button |
showAbout | Boolean | No | true | Whether to display the [Settings - About] button |
showDelete | Boolean | No | true | Whether to display the [Delete Selected] button |
showSave | Boolean | No | true | Whether to display the [Save] button |
showReset | Boolean | No | true | Whether to display the [Reset] button |
# Events
Event name | Description | Callback parameter |
---|---|---|
saveOk | saved successfully | rule chain data |
saveError | Save failed | rule chain data,e |
# Methods
Event name | Description | Calling parameter | Return parameter |
---|---|---|---|
render | Render rule chain | Rule chain data | - |
save | Trigger save | - | - |
getData | Gets the rule chain data | - | Rule chain data |
setLocales | Set Locales | Locales file | - |
lf | Get a logicFlow instance | - | logicFlow instance (opens new window) |
To use it, add a reference to the RuleGoEditor component, and then call the component method through the reference, for example:
<RuleGoEditor ref="ruleGoEditorRef"/>
<script setup>
import RuleGoEditor from './components/RuleGoEditor.vue'
import {ref,onMounted} from "vue";
//reference to ruleGoEditor, which exposes methods that can be called visually
const ruleGoEditorRef = ref();
onMounted(() => {
// Test calling component methods
const data1=ruleGoEditorRef.value.getData()
})
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
2
3
4
5
6
7
8
9
10
11
12
13
14
15
Last Updated: 2024/12/07, 10:09:49