zouju/auto-solution
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UPDATE: VERSION-20260315

Browse Source
This commit is contained in:
libertyspy
2026-03-15 19:32:20 +08:00
parent 83a38c6db8
commit f2e81c6e5c
16 changed files with 197 additions and 178 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
modeler/src/views/decision/builder/index.ts
View File

@@ -1,11 +0,0 @@
/*
* This file is part of the kernelstudio package.
*
* (c) 2014-2025 zlin <admin@kernelstudio.com>
*
* For the full copyright and license information, please view the LICENSE file
* that was distributed with this source code.
*/
export { createGraphCanvas } from './graph';
export * from './hooks';

8
modeler/src/views/decision/communication/api.ts
View File

@@ -8,7 +8,7 @@
*/ */
import { HttpRequestClient } from '@/utils/request'; import { HttpRequestClient } from '@/utils/request';
import type { PlatformWithComponentsResponse, ScenarioPageableResponse, ScenarioRequest } from './types'; import type { PlatformWithComponentsResponse, ScenarioPageableResponse, ScenarioRequest, Scenario } from './types';
import type { BasicResponse } from '@/types'; import type { BasicResponse } from '@/types';
const req = HttpRequestClient.create<BasicResponse>({ const req = HttpRequestClient.create<BasicResponse>({
@@ -24,5 +24,9 @@ export const deleteOneScenarioById = (id: number): Promise<BasicResponse> => {
}; };
export const findPlatformWithComponents = (id: number): Promise<PlatformWithComponentsResponse> => { export const findPlatformWithComponents = (id: number): Promise<PlatformWithComponentsResponse> => {
return req.get(`system/firerule/platforms/${id}`); return req.get(`/system/firerule/platforms/${id}`);
};
export const saveScenario = (scenario: Scenario): Promise<BasicResponse> => {
return req.get(`/system/scene/saveSceneConfig`,scenario);
}; };

142
modeler/src/views/decision/communication/communication.vue
View File

@@ -6,7 +6,7 @@
<div class="ks-model-builder-body"> <div class="ks-model-builder-body">
<div class="ks-model-builder-left"> <div class="ks-model-builder-left">
<PlatformCard <PlatformCard
ref="treesCardRef" ref="scenariosCardRef"
@create="handleCreate" @create="handleCreate"
@select="handleSelect" @select="handleSelect"
/> />
@@ -52,21 +52,19 @@ import { Wrapper } from '@/components/wrapper';
import { safePreventDefault, safeStopPropagation } from '@/utils/event'; import { safePreventDefault, safeStopPropagation } from '@/utils/event';
import Header from '../header.vue'; import Header from '../header.vue';
import type { Scenario } from './types'; import type { PlatformWithComponents, Scenario } from './types';
import { createLineOptions } from '../builder/line'; import { createGraphTaskElement, createLineOptions, type GraphContainer, type GraphTaskElement, hasElements, hasRootElementNode, resolveGraph, useGraphCanvas } from '../graph';
import type { GraphTaskElement, NodeGraph } from '../builder/element';
import { useGraphCanvas } from '../builder/hooks'; import { registerScenarioElement } from './register';
import { registerNodeElement } from '../builder/register'; import { createGraphTaskElementFromScenario } from './utils';
import { createTree, findOneTreeById, updateTree } from '../designer/api';
import { createGraphTaskElement, hasElements, hasRootElementNode, resolveNodeGraph } from '../builder/utils';
import { createGraphTaskElementFromTemplate } from '../utils/node';
import PlatformCard from './platform-card.vue'; import PlatformCard from './platform-card.vue';
import NodesCard from './nodes-card.vue'; import NodesCard from './nodes-card.vue';
import { saveScenario } from '@/views/decision/communication/api.ts';
const TeleportContainer = defineComponent(getTeleport()); const TeleportContainer = defineComponent(getTeleport());
registerNodeElement(); registerScenarioElement();
export default defineComponent({ export default defineComponent({
components: { components: {
@@ -84,15 +82,15 @@ export default defineComponent({
const canvas = ref<HTMLDivElement | null>(null); const canvas = ref<HTMLDivElement | null>(null);
const graph = ref<Graph | null>(null); const graph = ref<Graph | null>(null);
const currentZoom = ref<number>(1); const currentZoom = ref<number>(1);
const draggedNodeData = ref<Scenario | null>(null); const draggedNodeData = ref<PlatformWithComponents | null>(null);
const isDraggingOver = ref(false); const isDraggingOver = ref(false);
const currentTreeEditing = ref<boolean>(false); const currentScenarioEditing = ref<boolean>(false);
const currentScenario = ref<Scenario | null>(null); const currentScenario = ref<Scenario | null>(null);
const currentNodeGraph = ref<NodeGraph | null>(null); const currentGraph = ref<GraphContainer | null>(null);
const selectedModelNode = ref<Node<NodeProperties> | null>(null); const selectedModelNode = ref<Node<NodeProperties> | null>(null);
const selectedNodeTaskElement = ref<GraphTaskElement | null>(null); const selectedNodeTaskElement = ref<GraphTaskElement | null>(null);
const changed = ref<boolean>(false); const changed = ref<boolean>(false);
const treesCardRef = ref<InstanceType<typeof PlatformCard> | null>(null); const scenariosCardRef = ref<InstanceType<typeof PlatformCard> | null>(null);
const { const {
handleGraphEvent, handleGraphEvent,
@@ -105,7 +103,7 @@ export default defineComponent({
} = useGraphCanvas(); } = useGraphCanvas();
// 处理拖动开始 // 处理拖动开始
const handleDragStart = (nm: Scenario) => { const handleDragStart = (nm: PlatformWithComponents) => {
draggedNodeData.value = nm; draggedNodeData.value = nm;
}; };
@@ -142,10 +140,10 @@ export default defineComponent({
safePreventDefault(e); safePreventDefault(e);
safeStopPropagation(e); safeStopPropagation(e);
isDraggingOver.value = false; isDraggingOver.value = false;
currentTreeEditing.value = false; currentScenarioEditing.value = false;
if (!currentScenario.value) { if (!currentScenario.value) {
message.error('请先选择或者创建行为树.'); message.error('请先选择或者创建场景.');
return; return;
} }
@@ -156,17 +154,17 @@ export default defineComponent({
try { try {
// 获取拖动的数据 // 获取拖动的数据
const template = draggedNodeData.value as Scenario; const pwc = draggedNodeData.value as PlatformWithComponents;
if (!hasElements(graph.value as Graph)) { // if (!hasElements(graph.value as Graph)) {
message.error('请先添加根节点.'); // message.error('请先添加根节点.');
return; // return;
} // }
if (hasRootElementNode(graph.value as Graph)) { // if (hasRootElementNode(graph.value as Graph)) {
message.error('根节点已经存在.'); // message.error('根节点已经存在.');
return; // return;
} // }
// 计算相对于画布的位置（考虑缩放） // 计算相对于画布的位置（考虑缩放）
const rect = canvas.value.getBoundingClientRect(); const rect = canvas.value.getBoundingClientRect();
@@ -174,12 +172,12 @@ export default defineComponent({
const x = (e.clientX - rect.left) / scale; const x = (e.clientX - rect.left) / scale;
const y = (e.clientY - rect.top) / scale; const y = (e.clientY - rect.top) / scale;
console.log('放置节点:', { ...template, x, y }); console.log('放置节点:', { ...pwc, x, y });
// 创建节点数据 // 创建节点数据
const settingTaskElement: GraphTaskElement = createGraphTaskElementFromTemplate(template, { x, y }); const settingTaskElement: GraphTaskElement = createGraphTaskElementFromScenario(pwc, { x, y });
// 创建节点 // 创建节点
const settingTaskNode = createGraphTaskElement(settingTaskElement); const settingTaskNode = createGraphTaskElement(settingTaskElement, 250, 120, 'scenario');
console.info('create settingTaskNode: ', settingTaskElement, settingTaskNode); console.info('create settingTaskNode: ', settingTaskElement, settingTaskNode);
// 将节点添加到画布 // 将节点添加到画布
@@ -193,32 +191,27 @@ export default defineComponent({
} }
}; };
const handleSelect = (tree: Scenario) => { const handleSelect = (scenario: Scenario) => {
console.info('handleSelect', tree); console.info('handleSelect', scenario);
findOneTreeById(tree.id).then(r => { let nodeGraph: GraphContainer | null = null;
if (r.data) { try {
let nodeGraph: NodeGraph | null = null; nodeGraph = JSON.parse(scenario.communicationGraph as unknown as string) as unknown as GraphContainer;
try { } catch (e: any) {
nodeGraph = JSON.parse(r.data?.xmlContent as unknown as string) as unknown as NodeGraph; console.error('parse error,cause:', e);
} catch (e: any) { }
console.error('parse error,cause:', e); if (!nodeGraph) {
} nodeGraph = {
if (!nodeGraph) { nodes: [],
nodeGraph = { edges: [],
nodes: [], };
edges: [], }
}; currentScenario.value = {
} ...scenario,
currentScenario.value = { graph: nodeGraph,
...r.data, };
graph: nodeGraph, currentScenarioEditing.value = true;
}; createElements();
currentTreeEditing.value = true;
createElements();
} else {
message.error(r.msg ?? '行为树不存在.');
}
});
}; };
const createElements = () => { const createElements = () => {
@@ -257,18 +250,15 @@ export default defineComponent({
const handleCreate = () => { const handleCreate = () => {
currentScenario.value = { currentScenario.value = {
id: 0, id: 0,
name: '行为树', name: null,
description: null, description: null,
englishName: null, communicationGraph: null,
xmlContent: null,
createdAt: null,
graph: { graph: {
edges: [], edges: [],
nodes: [], nodes: [],
}, }
updatedAt: null,
}; };
currentNodeGraph.value = { currentGraph.value = {
edges: [], edges: [],
nodes: [], nodes: [],
}; };
@@ -298,7 +288,7 @@ export default defineComponent({
handleGraphEvent('blank:click', () => { handleGraphEvent('blank:click', () => {
selectedModelNode.value = null; selectedModelNode.value = null;
selectedNodeTaskElement.value = null; selectedNodeTaskElement.value = null;
currentTreeEditing.value = null !== currentScenario.value; currentScenarioEditing.value = null !== currentScenario.value;
}); });
handleGraphEvent('node:click', (args: any) => { handleGraphEvent('node:click', (args: any) => {
@@ -348,34 +338,30 @@ export default defineComponent({
}; };
const handleSave = () => { const handleSave = () => {
const graphData: NodeGraph = resolveNodeGraph(graph.value as Graph); const graphData: GraphContainer = resolveGraph(graph.value as Graph);
console.info('handleSave', graphData); console.info('handleSave', graphData);
if (!currentScenario.value) { if (!currentScenario.value) {
message.error('当前决策树不存在'); message.error('当前决策树不存在');
return; return;
} }
const newTree: currentScenario = { const newScenario: Scenario = {
...currentScenario.value, ...currentScenario.value,
graph: graphData, graph: graphData,
xmlContent: JSON.stringify(graphData), communicationGraph: JSON.stringify(graphData),
}; };
if (!newTree.name) { if (!newScenario.name) {
message.error('行为树名称不能为空.'); message.error('场景名称不能为空.');
return;
}
if (!newTree.englishName) {
message.error('行为树英文名称不能为空.');
return; return;
} }
let res = null; let res = null;
if (currentScenario.value.id > 0) { if (currentScenario.value.id > 0) {
res = createTree(newTree); res = saveScenario(newScenario);
} else { } else {
res = updateTree(newTree); res = saveScenario(newScenario);
} }
res.then(r => { res.then(r => {
if (r.code === 200) { if (r.code === 200) {
treesCardRef.value?.refresh(); scenariosCardRef.value?.refresh();
message.success(r.msg ?? '操作成功.'); message.success(r.msg ?? '操作成功.');
} else { } else {
message.error(r.msg ?? '操作失败.'); message.error(r.msg ?? '操作失败.');
@@ -403,11 +389,11 @@ export default defineComponent({
}); });
return { return {
treesCardRef, scenariosCardRef,
handleCreate, handleCreate,
currentTreeEditing, currentScenarioEditing,
currentScenario, currentScenario,
currentNodeGraph, currentGraph,
selectedNodeTaskElement, selectedNodeTaskElement,
selectedModelNode, selectedModelNode,
graph, graph,

8
modeler/src/views/decision/communication/graph.ts
View File

@@ -1,8 +0,0 @@
/*
* This file is part of the kernelstudio package.
*
* (c) 2014-2026 zlin <admin@kernelstudio.com>
*
* For the full copyright and license information, please view the LICENSE file
* that was distributed with this source code.
*/

67
modeler/src/views/decision/builder/node.vue → modeler/src/views/decision/communication/node.vue
View File

@@ -2,28 +2,27 @@
<a-dropdown :trigger="['contextmenu']" @openChange="handleVisibleChange"> <a-dropdown :trigger="['contextmenu']" @openChange="handleVisibleChange">
<a-card <a-card
:class="[ :class="[
'ks-designer-node', 'ks-scenario-node',
`ks-designer-${element?.category ?? 'model'}-node`, `ks-scenario-${element?.category ?? 'model'}-node`,
`ks-designer-group-${element?.group ?? 'general'}` `ks-scenario-group-${element?.group ?? 'general'}`
]" ]"
hoverable hoverable
> >
<template #title> <template #title>
<a-space> <a-space>
<!-- <span class="ks-designer-node-icon"></span>--> <span class="ks-scenario-node-title">{{ element?.name ?? '-' }}</span>
<span class="ks-designer-node-title">{{ element?.name ?? '-' }}</span>
</a-space> </a-space>
</template> </template>
<div class="port port-in" data-port="in-0" magnet="passive"> <div class="port port-in" data-port="in-0" magnet="passive">
<div class="triangle-left"></div> <div class="triangle-left"></div>
</div> </div>
<div class="w-full ks-designer-node-text"> <div class="w-full ks-scenario-node-text">
<a-tooltip > <a-tooltip >
<template #title> <template #title>
{{ element?.description ?? element?.name }} {{ element?.description ?? element?.name }}
</template> </template>
<p class="ks-designer-node-label"> <p class="ks-scenario-node-label">
{{ substring(element?.name ?? (element?.name ?? '-'), 40) }} {{ substring(element?.name ?? (element?.name ?? '-'), 40) }}
</p> </p>
</a-tooltip> </a-tooltip>
@@ -48,8 +47,8 @@
<script lang="ts"> <script lang="ts">
import { defineComponent, onMounted, onUnmounted, ref } from 'vue'; import { defineComponent, onMounted, onUnmounted, ref } from 'vue';
import { elementProps } from './props'; import { elementProps, type ModelElement } from '../graph';
import type { ModelElement } from './element';
import { DeleteOutlined, SettingOutlined } from '@ant-design/icons-vue'; import { DeleteOutlined, SettingOutlined } from '@ant-design/icons-vue';
import type { Graph } from '@antv/x6'; import type { Graph } from '@antv/x6';
import { substring } from '@/utils/strings'; import { substring } from '@/utils/strings';
@@ -131,7 +130,7 @@ export default defineComponent({
</script> </script>
<style lang="less"> <style lang="less">
.ks-designer-node { .ks-scenario-node {
background: linear-gradient(150deg, rgba(108, 99, 255) 1%, rgba(108, 99, 255) 100%); background: linear-gradient(150deg, rgba(108, 99, 255) 1%, rgba(108, 99, 255) 100%);
border-radius: 8px; border-radius: 8px;
width: 100%; width: 100%;
@@ -165,7 +164,7 @@ export default defineComponent({
//background: linear-gradient(to bottom, rgb(234 234 234 / 20%), rgb(191 191 191 / 58%)); //background: linear-gradient(to bottom, rgb(234 234 234 / 20%), rgb(191 191 191 / 58%));
} }
.ks-designer-node-icon { .ks-scenario-node-icon {
width: 15px; width: 15px;
height: 15px; height: 15px;
display: block; display: block;
@@ -175,7 +174,7 @@ export default defineComponent({
background: url('@/assets/icons/icon-node.svg') center / 100% 100%; background: url('@/assets/icons/icon-node.svg') center / 100% 100%;
} }
.ks-designer-node-title { .ks-scenario-node-title {
font-size: 12px; font-size: 12px;
color: #fff; color: #fff;
margin-top: -7px; margin-top: -7px;
@@ -203,14 +202,14 @@ export default defineComponent({
// 连接桩容器样式 // 连接桩容器样式
.ks-designer-node-content { .ks-scenario-node-content {
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 4px; gap: 4px;
} }
.ks-designer-node-row { .ks-scenario-node-row {
width: 100%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
@@ -296,7 +295,7 @@ export default defineComponent({
} }
// 节点文本样式 // 节点文本样式
.ks-designer-node-name { .ks-scenario-node-name {
flex: 1; flex: 1;
line-height: 24px; line-height: 24px;
overflow: hidden; overflow: hidden;
@@ -304,41 +303,41 @@ export default defineComponent({
//white-space: nowrap; //white-space: nowrap;
} }
&.ks-designer-root-node{ &.ks-scenario-root-node{
.ks-designer-node-icon { .ks-scenario-node-icon {
background: url('@/assets/icons/icon-root.svg') center / 100% 100%; background: url('@/assets/icons/icon-root.svg') center / 100% 100%;
} }
} }
&.ks-designer-action-node{ &.ks-scenario-action-node{
.ant-card-head { .ant-card-head {
background: url('@/assets/icons/card-head-red.png') center / 100% 100%; background: url('@/assets/icons/card-head-red.png') center / 100% 100%;
} }
.ks-designer-node-icon { .ks-scenario-node-icon {
background: url('@/assets/icons/icon-action.svg') center / 100% 100%; background: url('@/assets/icons/icon-action.svg') center / 100% 100%;
} }
} }
&.ks-designer-sequence-node{ &.ks-scenario-sequence-node{
.ks-designer-node-icon { .ks-scenario-node-icon {
background: url('@/assets/icons/icon-sequence.svg') center / 100% 100%; background: url('@/assets/icons/icon-sequence.svg') center / 100% 100%;
} }
} }
&.ks-designer-parallel-node{ &.ks-scenario-parallel-node{
.ks-designer-node-icon { .ks-scenario-node-icon {
background: url('@/assets/icons/icon-parallel.svg') center / 100% 100%; background: url('@/assets/icons/icon-parallel.svg') center / 100% 100%;
} }
} }
&.ks-designer-precondition-node{ &.ks-scenario-precondition-node{
.ks-designer-node-icon { .ks-scenario-node-icon {
background: url('@/assets/icons/icon-branch.svg') center / 100% 100%; background: url('@/assets/icons/icon-branch.svg') center / 100% 100%;
} }
} }
&.ks-designer-group-control, &.ks-scenario-group-control,
&.ks-designer-group-condition { &.ks-scenario-group-condition {
.ant-card-head{ .ant-card-head{
display:none; display:none;
} }
@@ -348,24 +347,24 @@ export default defineComponent({
background: url('@/assets/icons/card-head-gray.png') center / 100% 100%; background: url('@/assets/icons/card-head-gray.png') center / 100% 100%;
} }
&.ks-designer-root-node{ &.ks-scenario-root-node{
.ant-card-body { .ant-card-body {
background: url('@/assets/icons/card-head-dark.png') center / 100% 100%; background: url('@/assets/icons/card-head-dark.png') center / 100% 100%;
} }
} }
&.ks-designer-sequence-node{ &.ks-scenario-sequence-node{
.ant-card-body { .ant-card-body {
background: url('@/assets/icons/card-head-green.png') center / 100% 100%; background: url('@/assets/icons/card-head-green.png') center / 100% 100%;
} }
} }
&.ks-designer-parallel-node{ &.ks-scenario-parallel-node{
.ant-card-body { .ant-card-body {
background: url('@/assets/icons/card-head-blue.png') center / 100% 100%; background: url('@/assets/icons/card-head-blue.png') center / 100% 100%;
} }
} }
&.ks-designer-precondition-node{ &.ks-scenario-precondition-node{
.ant-card-body { .ant-card-body {
background: url('@/assets/icons/card-head-dark.png') center / 100% 100%; background: url('@/assets/icons/card-head-dark.png') center / 100% 100%;
} }
@@ -375,12 +374,12 @@ export default defineComponent({
.port-out { .port-out {
top: 40%; top: 40%;
} }
.ks-designer-node-text{ .ks-scenario-node-text{
line-height: 38px; line-height: 38px;
} }
} }
//&.ks-designer-precondition-node{ //&.ks-scenario-precondition-node{
// border:0; // border:0;
// box-shadown:none; // box-shadown:none;
// &:hover{ // &:hover{
@@ -401,7 +400,7 @@ export default defineComponent({
// display: none; // display: none;
// } // }
// //
// .ks-designer-node-label { // .ks-scenario-node-label {
// width: 40px; /* 保留原有宽度 */ // width: 40px; /* 保留原有宽度 */
// text-align: center; /* 保留文字居中 */ // text-align: center; /* 保留文字居中 */
// /* 核心修改：取消固定行高，重置换行相关属性 */ // /* 核心修改：取消固定行高，重置换行相关属性 */

6
modeler/src/views/decision/builder/register.ts → modeler/src/views/decision/communication/register.ts
View File

@@ -18,10 +18,10 @@
import { register } from '@antv/x6-vue-shape'; import { register } from '@antv/x6-vue-shape';
import ModelElement from './node.vue'; import ModelElement from './node.vue';
export const registerNodeElement = () => { export const registerScenarioElement = () => {
console.info('registerNodeElement'); console.info('registerScenarioElement');
register({ register({
shape: 'task', shape: 'scenario',
component: ModelElement, component: ModelElement,
width: 120, width: 120,
attrs: { attrs: {

2
modeler/src/views/decision/communication/types.ts
View File

@@ -9,6 +9,7 @@
import type { ApiDataResponse, NullableString, PageableResponse } from '@/types'; import type { ApiDataResponse, NullableString, PageableResponse } from '@/types';
import type { GraphContainer } from '../graph';
export interface Scenario { export interface Scenario {
id: number, id: number,
@@ -16,6 +17,7 @@ export interface Scenario {
description: NullableString, description: NullableString,
// 用于存储场景中的通讯关系 // 用于存储场景中的通讯关系
communicationGraph: NullableString, communicationGraph: NullableString,
graph: GraphContainer
} }
export interface ScenarioRequest extends Scenario { export interface ScenarioRequest extends Scenario {

42
modeler/src/views/decision/communication/utils.ts Normal file
View File

@@ -0,0 +1,42 @@
/*
* This file is part of the kernelstudio package.
*
* (c) 2014-2026 zlin <admin@kernelstudio.com>
*
* For the full copyright and license information, please view the LICENSE file
* that was distributed with this source code.
*/
import type { GraphRect, GraphTaskElement } from '../graph';
import { generateKey } from '@/utils/strings';
import type { PlatformWithComponents } from './types';
export const createGraphTaskElementFromScenario = (
platform: PlatformWithComponents,
rect?: GraphRect,
): GraphTaskElement => {
let realRect = { width: 120, height: 80, x: 0, y: 0, ...rect || {} };
console.info('rect', rect);
return {
id: 0,
key: generateKey(),
type: 'scenario',
template: platform.id,
templateType: null,
name: null,
category: null,
group: null,
description: platform.description,
order: 0,
position: {
x: realRect.x ?? 0,
y: realRect.y ?? 0,
},
width: realRect.width,
height: realRect.height,
inputs: null,
outputs: null,
parameters: [],
variables: [],
} as GraphTaskElement;
};

3
modeler/src/views/decision/builder/graph.ts → modeler/src/views/decision/graph/canvas.ts
View File

@@ -8,9 +8,8 @@
*/ */
import { Edge, Graph, Path, Selection } from '@antv/x6'; import { Edge, Graph, Path, Selection } from '@antv/x6';
import type { ModelElement } from './element'; import { createLineOptions, type ModelElement } from '../graph';
import type { Connecting } from '@antv/x6/lib/graph/options'; import type { Connecting } from '@antv/x6/lib/graph/options';
import { createLineOptions } from './line';
Graph.registerConnector( Graph.registerConnector(
'sequenceFlowConnector', 'sequenceFlowConnector',

67
modeler/src/views/decision/builder/element.ts → modeler/src/views/decision/graph/element.ts
View File

@@ -7,22 +7,49 @@
* that was distributed with this source code. * that was distributed with this source code.
*/ */
import type { NullableString } from '@/types'; import type { NullableString } from '@/types';
export interface DraggableElement { export interface GraphPosition {
x: number;
y: number;
}
export interface GraphRect {
width?: number;
height?: number;
x?: number;
y?: number;
}
export interface GraphDraggableElement {
id: number | null, id: number | null,
key?: NullableString, key?: NullableString,
name: NullableString, name: NullableString,
description: NullableString, description: NullableString,
category: NullableString, category: NullableString,
draggable: boolean, draggable: boolean,
parent?: DraggableElement, parent?: GraphDraggableElement,
children: DraggableElement[] children: GraphDraggableElement[]
[key: string]: unknown;
}
export interface GraphBaseElement {
id: number;
key: NullableString;
name: NullableString;
description: NullableString;
type: NullableString;
width: number;
height: number;
position: GraphPosition;
category: NullableString;
element?: GraphDraggableElement;
[key: string]: unknown; [key: string]: unknown;
} }
export type ElementStatus = 'default' | 'success' | 'failed' | 'running' | string | null
export interface ElementParameter { export interface ElementParameter {
id: number, id: number,
@@ -34,10 +61,6 @@ export interface ElementParameter {
templateType: NullableString, templateType: NullableString,
} }
export interface GraphPosition {
x: number;
y: number;
}
export interface ElementVariable { export interface ElementVariable {
key: NullableString; key: NullableString;
@@ -47,29 +70,7 @@ export interface ElementVariable {
unit: NullableString; unit: NullableString;
} }
export interface GraphTaskRect { export interface GraphTaskElement extends GraphBaseElement {
width?: number;
height?: number;
x?: number;
y?: number;
}
export interface BaseElement {
id: number;
key: NullableString;
name: NullableString;
description: NullableString;
type: NullableString;
width: number;
height: number;
position: GraphPosition;
category: NullableString;
element?: DraggableElement;
[key: string]: unknown;
}
export interface GraphTaskElement extends BaseElement {
template: number; template: number;
templateType: NullableString, templateType: NullableString,
inputs: any; inputs: any;
@@ -82,7 +83,7 @@ export interface GraphTaskElement extends BaseElement {
[key: string]: unknown; [key: string]: unknown;
} }
export interface ModelElement extends BaseElement { export interface ModelElement extends GraphBaseElement {
edges: GraphEdgeElement[]; edges: GraphEdgeElement[];
} }
@@ -98,7 +99,7 @@ export interface GraphEdgeElement {
[key: string]: unknown; [key: string]: unknown;
} }
export interface NodeGraph { export interface GraphContainer {
edges: GraphEdgeElement[]; edges: GraphEdgeElement[];
nodes: GraphTaskElement[]; nodes: GraphTaskElement[];
} }

2
modeler/src/views/decision/builder/hooks.ts → modeler/src/views/decision/graph/hooks.ts
View File

@@ -10,7 +10,7 @@
import { computed, type ComputedRef, ref, type Ref } from 'vue'; import { computed, type ComputedRef, ref, type Ref } from 'vue';
import { type Dom, Graph, Node } from '@antv/x6'; import { type Dom, Graph, Node } from '@antv/x6';
import type { NodeViewPositionEventArgs } from '@antv/x6/es/view/node/type'; import type { NodeViewPositionEventArgs } from '@antv/x6/es/view/node/type';
import { createGraphCanvas } from './graph'; import { createGraphCanvas } from './canvas';
import { EventListener } from '@/utils/event'; import { EventListener } from '@/utils/event';
import type { ModelElement } from './element'; import type { ModelElement } from './element';

9
modeler/src/views/decision/types/index.ts → modeler/src/views/decision/graph/index.ts
View File

@@ -7,5 +7,10 @@
* that was distributed with this source code. * that was distributed with this source code.
*/ */
export * from './tree'; export * from './line'
export * from './template'; export * from './ports'
export * from './element'
export * from './canvas'
export * from './hooks'
export * from './props'
export * from './utils'

0
modeler/src/views/decision/builder/line.ts → modeler/src/views/decision/graph/line.ts
View File

0
modeler/src/views/decision/builder/ports.ts → modeler/src/views/decision/graph/ports.ts
View File

0
modeler/src/views/decision/builder/props.ts → modeler/src/views/decision/graph/props.ts
View File

8
modeler/src/views/decision/builder/utils.ts → modeler/src/views/decision/graph/utils.ts
View File

@@ -6,14 +6,14 @@
* For the full copyright and license information, please view the LICENSE file * For the full copyright and license information, please view the LICENSE file
* that was distributed with this source code. * that was distributed with this source code.
*/ */
import type { GraphEdgeElement, GraphTaskElement, NodeGraph } from './element'; import type { GraphContainer, GraphEdgeElement, GraphTaskElement } from '../graph';
import { Edge, Graph, Node } from '@antv/x6'; import { Edge, Graph, Node } from '@antv/x6';
export const defaultHeight: Record<string, number> = { export const defaultHeight: Record<string, number> = {
component: 110, component: 110,
}; };
export const createGraphTaskElement = (element: GraphTaskElement, width: number = 250, height: number = 120): any => { export const createGraphTaskElement = (element: GraphTaskElement, width: number = 250, height: number = 120, shape: string = 'task'): any => {
let realHeight = defaultHeight[element.category as string]; let realHeight = defaultHeight[element.category as string];
if (!realHeight) { if (!realHeight) {
realHeight = 120; realHeight = 120;
@@ -22,7 +22,7 @@ export const createGraphTaskElement = (element: GraphTaskElement, width: number
realHeight = 60; realHeight = 60;
} }
return { return {
shape: 'task', shape: shape ?? 'task',
id: element.key, id: element.key,
position: { position: {
x: element.position?.x || 0, x: element.position?.x || 0,
@@ -86,7 +86,7 @@ export const resolveGraphEdgeElements = (graph: Graph): GraphEdgeElement[] => {
return edgeElements; return edgeElements;
}; };
export const resolveNodeGraph = (graph: Graph): NodeGraph => { export const resolveGraph = (graph: Graph): GraphContainer => {
const nodes: GraphTaskElement[] = resolveGraphTaskElements(graph); const nodes: GraphTaskElement[] = resolveGraphTaskElements(graph);
const edges: GraphEdgeElement[] = resolveGraphEdgeElements(graph); const edges: GraphEdgeElement[] = resolveGraphEdgeElements(graph);
return { return {