UPDATE: VERSION-20260315

2026-03-15 19:32:20 +08:00
parent 83a38c6db8
commit f2e81c6e5c
16 changed files with 197 additions and 178 deletions
--- a/modeler/src/views/decision/builder/index.ts
+++ b/modeler/src/views/decision/builder/index.ts
@@ -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';
--- a/modeler/src/views/decision/communication/api.ts
+++ b/modeler/src/views/decision/communication/api.ts
@@ -8,7 +8,7 @@
 */

 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';

 const req = HttpRequestClient.create<BasicResponse>({
@@ -24,5 +24,9 @@ export const deleteOneScenarioById = (id: number): Promise<BasicResponse> => {
 };

 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);
 };
--- a/modeler/src/views/decision/communication/communication.vue
+++ b/modeler/src/views/decision/communication/communication.vue
@@ -6,7 +6,7 @@
        <div class="ks-model-builder-body">
          <div class="ks-model-builder-left">
            <PlatformCard
-              ref="treesCardRef"
+              ref="scenariosCardRef"
              @create="handleCreate"
              @select="handleSelect"
            />
@@ -52,21 +52,19 @@ import { Wrapper } from '@/components/wrapper';
 import { safePreventDefault, safeStopPropagation } from '@/utils/event';
 import Header from '../header.vue';

-import type { Scenario } from './types';
-import { createLineOptions } from '../builder/line';
-import type { GraphTaskElement, NodeGraph } from '../builder/element';
-import { useGraphCanvas } from '../builder/hooks';
-import { registerNodeElement } from '../builder/register';
-import { createTree, findOneTreeById, updateTree } from '../designer/api';
-import { createGraphTaskElement, hasElements, hasRootElementNode, resolveNodeGraph } from '../builder/utils';
-import { createGraphTaskElementFromTemplate } from '../utils/node';
+import type { PlatformWithComponents, Scenario } from './types';
+import { createGraphTaskElement, createLineOptions, type GraphContainer, type GraphTaskElement, hasElements, hasRootElementNode, resolveGraph, useGraphCanvas } from '../graph';
+
+import { registerScenarioElement } from './register';
+import { createGraphTaskElementFromScenario } from './utils';

 import PlatformCard from './platform-card.vue';
 import NodesCard from './nodes-card.vue';
+import { saveScenario } from '@/views/decision/communication/api.ts';

 const TeleportContainer = defineComponent(getTeleport());

-registerNodeElement();
+registerScenarioElement();

 export default defineComponent({
  components: {
@@ -84,15 +82,15 @@ export default defineComponent({
    const canvas = ref<HTMLDivElement | null>(null);
    const graph = ref<Graph | null>(null);
    const currentZoom = ref<number>(1);
-    const draggedNodeData = ref<Scenario | null>(null);
+    const draggedNodeData = ref<PlatformWithComponents | null>(null);
    const isDraggingOver = ref(false);
-    const currentTreeEditing = ref<boolean>(false);
+    const currentScenarioEditing = ref<boolean>(false);
    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 selectedNodeTaskElement = ref<GraphTaskElement | null>(null);
    const changed = ref<boolean>(false);
-    const treesCardRef = ref<InstanceType<typeof PlatformCard> | null>(null);
+    const scenariosCardRef = ref<InstanceType<typeof PlatformCard> | null>(null);

    const {
      handleGraphEvent,
@@ -105,7 +103,7 @@ export default defineComponent({
    } = useGraphCanvas();

    // 处理拖动开始
-    const handleDragStart = (nm: Scenario) => {
+    const handleDragStart = (nm: PlatformWithComponents) => {
      draggedNodeData.value = nm;
    };

@@ -142,10 +140,10 @@ export default defineComponent({
      safePreventDefault(e);
      safeStopPropagation(e);
      isDraggingOver.value = false;
-      currentTreeEditing.value = false;
+      currentScenarioEditing.value = false;

      if (!currentScenario.value) {
-        message.error('请先选择或者创建行为树.');
+        message.error('请先选择或者创建场景.');
        return;
      }

@@ -156,17 +154,17 @@ export default defineComponent({

      try {
        // 获取拖动的数据
-        const template = draggedNodeData.value as Scenario;
+        const pwc = draggedNodeData.value as PlatformWithComponents;

-        if (!hasElements(graph.value as Graph)) {
-          message.error('请先添加根节点.');
-          return;
-        }
+        // if (!hasElements(graph.value as Graph)) {
+        //   message.error('请先添加根节点.');
+        //   return;
+        // }

-        if (hasRootElementNode(graph.value as Graph)) {
-          message.error('根节点已经存在.');
-          return;
-        }
+        // if (hasRootElementNode(graph.value as Graph)) {
+        //   message.error('根节点已经存在.');
+        //   return;
+        // }

        // 计算相对于画布的位置（考虑缩放）
        const rect = canvas.value.getBoundingClientRect();
@@ -174,12 +172,12 @@ export default defineComponent({
        const x = (e.clientX - rect.left) / 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);

        // 将节点添加到画布
@@ -193,32 +191,27 @@ export default defineComponent({
      }
    };

-    const handleSelect = (tree: Scenario) => {
-      console.info('handleSelect', tree);
-      findOneTreeById(tree.id).then(r => {
-        if (r.data) {
-          let nodeGraph: NodeGraph | null = null;
-          try {
-            nodeGraph = JSON.parse(r.data?.xmlContent as unknown as string) as unknown as NodeGraph;
-          } catch (e: any) {
-            console.error('parse error,cause:', e);
-          }
-          if (!nodeGraph) {
-            nodeGraph = {
-              nodes: [],
-              edges: [],
-            };
-          }
-          currentScenario.value = {
-            ...r.data,
-            graph: nodeGraph,
-          };
-          currentTreeEditing.value = true;
-          createElements();
-        } else {
-          message.error(r.msg ?? '行为树不存在.');
-        }
-      });
+    const handleSelect = (scenario: Scenario) => {
+      console.info('handleSelect', scenario);
+      let nodeGraph: GraphContainer | null = null;
+      try {
+        nodeGraph = JSON.parse(scenario.communicationGraph as unknown as string) as unknown as GraphContainer;
+      } catch (e: any) {
+        console.error('parse error,cause:', e);
+      }
+      if (!nodeGraph) {
+        nodeGraph = {
+          nodes: [],
+          edges: [],
+        };
+      }
+      currentScenario.value = {
+        ...scenario,
+        graph: nodeGraph,
+      };
+      currentScenarioEditing.value = true;
+      createElements();
+
    };

    const createElements = () => {
@@ -257,18 +250,15 @@ export default defineComponent({
    const handleCreate = () => {
      currentScenario.value = {
        id: 0,
-        name: '行为树',
+        name: null,
        description: null,
-        englishName: null,
-        xmlContent: null,
-        createdAt: null,
+        communicationGraph: null,
        graph: {
          edges: [],
          nodes: [],
-        },
-        updatedAt: null,
+        }
      };
-      currentNodeGraph.value = {
+      currentGraph.value = {
        edges: [],
        nodes: [],
      };
@@ -298,7 +288,7 @@ export default defineComponent({
        handleGraphEvent('blank:click', () => {
          selectedModelNode.value = null;
          selectedNodeTaskElement.value = null;
-          currentTreeEditing.value = null !== currentScenario.value;
+          currentScenarioEditing.value = null !== currentScenario.value;
        });

        handleGraphEvent('node:click', (args: any) => {
@@ -348,34 +338,30 @@ export default defineComponent({
    };

    const handleSave = () => {
-      const graphData: NodeGraph = resolveNodeGraph(graph.value as Graph);
+      const graphData: GraphContainer = resolveGraph(graph.value as Graph);
      console.info('handleSave', graphData);
      if (!currentScenario.value) {
        message.error('当前决策树不存在');
        return;
      }
-      const newTree: currentScenario = {
+      const newScenario: Scenario = {
        ...currentScenario.value,
        graph: graphData,
-        xmlContent: JSON.stringify(graphData),
+        communicationGraph: JSON.stringify(graphData),
      };
-      if (!newTree.name) {
-        message.error('行为树名称不能为空.');
-        return;
-      }
-      if (!newTree.englishName) {
-        message.error('行为树英文名称不能为空.');
+      if (!newScenario.name) {
+        message.error('场景名称不能为空.');
        return;
      }
      let res = null;
      if (currentScenario.value.id > 0) {
-        res = createTree(newTree);
+        res = saveScenario(newScenario);
      } else {
-        res = updateTree(newTree);
+        res = saveScenario(newScenario);
      }
      res.then(r => {
        if (r.code === 200) {
-          treesCardRef.value?.refresh();
+          scenariosCardRef.value?.refresh();
          message.success(r.msg ?? '操作成功.');
        } else {
          message.error(r.msg ?? '操作失败.');
@@ -403,11 +389,11 @@ export default defineComponent({
    });

    return {
-      treesCardRef,
+      scenariosCardRef,
      handleCreate,
-      currentTreeEditing,
+      currentScenarioEditing,
      currentScenario,
-      currentNodeGraph,
+      currentGraph,
      selectedNodeTaskElement,
      selectedModelNode,
      graph,
--- a/modeler/src/views/decision/communication/graph.ts
+++ b/modeler/src/views/decision/communication/graph.ts
@@ -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.
- */
--- a/modeler/src/views/decision/communication/node.vue
+++ b/modeler/src/views/decision/communication/node.vue
@@ -2,28 +2,27 @@
  <a-dropdown :trigger="['contextmenu']" @openChange="handleVisibleChange">
    <a-card
      :class="[
-        'ks-designer-node',
-        `ks-designer-${element?.category ?? 'model'}-node`,
-        `ks-designer-group-${element?.group ?? 'general'}`
+        'ks-scenario-node',
+        `ks-scenario-${element?.category ?? 'model'}-node`,
+        `ks-scenario-group-${element?.group ?? 'general'}`
      ]"
      hoverable
    >
      <template #title>
        <a-space>
-<!--          <span class="ks-designer-node-icon"></span>-->
-          <span class="ks-designer-node-title">{{ element?.name ?? '-' }}</span>
+          <span class="ks-scenario-node-title">{{ element?.name ?? '-' }}</span>
        </a-space>
      </template>

      <div class="port port-in"  data-port="in-0" magnet="passive">
        <div class="triangle-left"></div>
      </div>
-      <div class="w-full ks-designer-node-text">
+      <div class="w-full ks-scenario-node-text">
        <a-tooltip >
          <template #title>
            {{ element?.description ?? element?.name }}
          </template>
-          <p class="ks-designer-node-label">
+          <p class="ks-scenario-node-label">
            {{ substring(element?.name ?? (element?.name ?? '-'), 40) }}
          </p>
        </a-tooltip>
@@ -48,8 +47,8 @@

 <script lang="ts">
 import { defineComponent, onMounted, onUnmounted, ref } from 'vue';
-import { elementProps } from './props';
-import type { ModelElement } from './element';
+import { elementProps, type ModelElement } from '../graph';
+
 import { DeleteOutlined, SettingOutlined } from '@ant-design/icons-vue';
 import type { Graph } from '@antv/x6';
 import { substring } from '@/utils/strings';
@@ -131,7 +130,7 @@ export default defineComponent({
 </script>

 <style lang="less">
-.ks-designer-node {
+.ks-scenario-node {
  background: linear-gradient(150deg, rgba(108, 99, 255) 1%, rgba(108, 99, 255) 100%);
  border-radius: 8px;
  width: 100%;
@@ -165,7 +164,7 @@ export default defineComponent({
    //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;
    height: 15px;
    display: block;
@@ -175,7 +174,7 @@ export default defineComponent({
    background: url('@/assets/icons/icon-node.svg') center / 100% 100%;
  }

-  .ks-designer-node-title {
+  .ks-scenario-node-title {
    font-size: 12px;
    color: #fff;
    margin-top: -7px;
@@ -203,14 +202,14 @@ export default defineComponent({


  // 连接桩容器样式
-  .ks-designer-node-content {
+  .ks-scenario-node-content {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 4px;
  }

-  .ks-designer-node-row {
+  .ks-scenario-node-row {
    width: 100%;
    display: flex;
    align-items: center;
@@ -296,7 +295,7 @@ export default defineComponent({
  }

  // 节点文本样式
-  .ks-designer-node-name {
+  .ks-scenario-node-name {
    flex: 1;
    line-height: 24px;
    overflow: hidden;
@@ -304,41 +303,41 @@ export default defineComponent({
    //white-space: nowrap;
  }

-  &.ks-designer-root-node{
-    .ks-designer-node-icon {
+  &.ks-scenario-root-node{
+    .ks-scenario-node-icon {
      background: url('@/assets/icons/icon-root.svg') center / 100% 100%;
    }
  }

-  &.ks-designer-action-node{
+  &.ks-scenario-action-node{
    .ant-card-head {
      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%;
    }
  }

-  &.ks-designer-sequence-node{
-    .ks-designer-node-icon {
+  &.ks-scenario-sequence-node{
+    .ks-scenario-node-icon {
      background: url('@/assets/icons/icon-sequence.svg') center / 100% 100%;
    }
  }

-  &.ks-designer-parallel-node{
-    .ks-designer-node-icon {
+  &.ks-scenario-parallel-node{
+    .ks-scenario-node-icon {
      background: url('@/assets/icons/icon-parallel.svg') center / 100% 100%;
    }
  }

-  &.ks-designer-precondition-node{
-    .ks-designer-node-icon {
+  &.ks-scenario-precondition-node{
+    .ks-scenario-node-icon {
      background: url('@/assets/icons/icon-branch.svg') center / 100% 100%;
    }
  }

-  &.ks-designer-group-control,
-  &.ks-designer-group-condition {
+  &.ks-scenario-group-control,
+  &.ks-scenario-group-condition {
    .ant-card-head{
      display:none;
    }
@@ -348,24 +347,24 @@ export default defineComponent({
      background: url('@/assets/icons/card-head-gray.png') center / 100% 100%;
    }

-    &.ks-designer-root-node{
+    &.ks-scenario-root-node{
      .ant-card-body {
        background: url('@/assets/icons/card-head-dark.png') center / 100% 100%;
      }
    }
-    &.ks-designer-sequence-node{
+    &.ks-scenario-sequence-node{
      .ant-card-body {
        background: url('@/assets/icons/card-head-green.png') center / 100% 100%;
      }
    }

-    &.ks-designer-parallel-node{
+    &.ks-scenario-parallel-node{
      .ant-card-body {
        background: url('@/assets/icons/card-head-blue.png') center / 100% 100%;
      }
    }

-    &.ks-designer-precondition-node{
+    &.ks-scenario-precondition-node{
      .ant-card-body {
        background: url('@/assets/icons/card-head-dark.png') center / 100% 100%;
      }
@@ -375,12 +374,12 @@ export default defineComponent({
    .port-out {
      top: 40%;
    }
-    .ks-designer-node-text{
+    .ks-scenario-node-text{
      line-height: 38px;
    }
  }

-  //&.ks-designer-precondition-node{
+  //&.ks-scenario-precondition-node{
  //  border:0;
  //  box-shadown:none;
  //  &:hover{
@@ -401,7 +400,7 @@ export default defineComponent({
  //    display: none;
  //  }
  //
-  //  .ks-designer-node-label {
+  //  .ks-scenario-node-label {
  //    width: 40px;          /* 保留原有宽度 */
  //    text-align: center;   /* 保留文字居中 */
  //    /* 核心修改：取消固定行高，重置换行相关属性 */
--- a/modeler/src/views/decision/communication/register.ts
+++ b/modeler/src/views/decision/communication/register.ts
@@ -18,10 +18,10 @@
 import { register } from '@antv/x6-vue-shape';
 import ModelElement from './node.vue';

-export const registerNodeElement = () => {
-  console.info('registerNodeElement');
+export const registerScenarioElement = () => {
+  console.info('registerScenarioElement');
  register({
-    shape: 'task',
+    shape: 'scenario',
    component: ModelElement,
    width: 120,
    attrs: {
--- a/modeler/src/views/decision/communication/types.ts
+++ b/modeler/src/views/decision/communication/types.ts
@@ -9,6 +9,7 @@


 import type { ApiDataResponse, NullableString, PageableResponse } from '@/types';
+import type { GraphContainer } from '../graph';

 export interface Scenario {
  id: number,
@@ -16,6 +17,7 @@ export interface Scenario {
  description: NullableString,
  // 用于存储场景中的通讯关系
  communicationGraph: NullableString,
+  graph: GraphContainer
 }

 export interface ScenarioRequest extends Scenario {
--- a/modeler/src/views/decision/communication/utils.ts
+++ b/modeler/src/views/decision/communication/utils.ts
@@ -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;
+};
--- a/modeler/src/views/decision/builder/graph.ts
+++ b/modeler/src/views/decision/builder/graph.ts
@@ -8,9 +8,8 @@
 */

 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 { createLineOptions } from './line';

 Graph.registerConnector(
  'sequenceFlowConnector',
--- a/modeler/src/views/decision/builder/element.ts
+++ b/modeler/src/views/decision/builder/element.ts
@@ -7,22 +7,49 @@
 * that was distributed with this source code.
 */

+
 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,
  key?: NullableString,
  name: NullableString,
  description: NullableString,
  category: NullableString,
  draggable: boolean,
-  parent?: DraggableElement,
-  children: DraggableElement[]
+  parent?: GraphDraggableElement,
+  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;
 }

-export type ElementStatus = 'default' | 'success' | 'failed' | 'running' | string | null

 export interface ElementParameter {
  id: number,
@@ -34,10 +61,6 @@ export interface ElementParameter {
  templateType: NullableString,
 }

-export interface GraphPosition {
-  x: number;
-  y: number;
-}

 export interface ElementVariable {
  key: NullableString;
@@ -47,29 +70,7 @@ export interface ElementVariable {
  unit: NullableString;
 }

-export interface GraphTaskRect {
-  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 {
+export interface GraphTaskElement extends GraphBaseElement {
  template: number;
  templateType: NullableString,
  inputs: any;
@@ -82,7 +83,7 @@ export interface GraphTaskElement extends BaseElement {
  [key: string]: unknown;
 }

-export interface ModelElement extends BaseElement {
+export interface ModelElement extends GraphBaseElement {
  edges: GraphEdgeElement[];
 }

@@ -98,7 +99,7 @@ export interface GraphEdgeElement {
  [key: string]: unknown;
 }

-export interface NodeGraph {
+export interface GraphContainer {
  edges: GraphEdgeElement[];
  nodes: GraphTaskElement[];
 }
--- a/modeler/src/views/decision/builder/hooks.ts
+++ b/modeler/src/views/decision/builder/hooks.ts
@@ -10,7 +10,7 @@
 import { computed, type ComputedRef, ref, type Ref } from 'vue';
 import { type Dom, Graph, Node } from '@antv/x6';
 import type { NodeViewPositionEventArgs } from '@antv/x6/es/view/node/type';
-import { createGraphCanvas } from './graph';
+import { createGraphCanvas } from './canvas';
 import { EventListener } from '@/utils/event';
 import type { ModelElement } from './element';

--- a/modeler/src/views/decision/graph/index.ts
+++ b/modeler/src/views/decision/graph/index.ts
@@ -7,5 +7,10 @@
 * that was distributed with this source code.
 */

-export * from './tree';
-export * from './template';
+export * from './line'
+export * from './ports'
+export * from './element'
+export * from './canvas'
+export * from './hooks'
+export * from './props'
+export * from './utils'
--- a/modeler/src/views/decision/builder/line.ts
+++ b/modeler/src/views/decision/builder/line.ts
--- a/modeler/src/views/decision/builder/ports.ts
+++ b/modeler/src/views/decision/builder/ports.ts
--- a/modeler/src/views/decision/builder/props.ts
+++ b/modeler/src/views/decision/builder/props.ts
--- a/modeler/src/views/decision/builder/utils.ts
+++ b/modeler/src/views/decision/builder/utils.ts
@@ -6,14 +6,14 @@
 * For the full copyright and license information, please view the LICENSE file
 * 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';

 export const defaultHeight: Record<string, number> = {
  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];
  if (!realHeight) {
    realHeight = 120;
@@ -22,7 +22,7 @@ export const createGraphTaskElement = (element: GraphTaskElement, width: number
    realHeight = 60;
  }
  return {
-    shape: 'task',
+    shape: shape ?? 'task',
    id: element.key,
    position: {
      x: element.position?.x || 0,
@@ -86,7 +86,7 @@ export const resolveGraphEdgeElements = (graph: Graph): GraphEdgeElement[] => {
  return edgeElements;
 };

-export const resolveNodeGraph = (graph: Graph): NodeGraph => {
+export const resolveGraph = (graph: Graph): GraphContainer => {
  const nodes: GraphTaskElement[] = resolveGraphTaskElements(graph);
  const edges: GraphEdgeElement[] = resolveGraphEdgeElements(graph);
  return {