From 209c0be5e168686a3b4b1118d6c682c05bdb6e5e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=91=E5=AE=81?= <1772105645@qq.com>
Date: Thu, 21 May 2026 14:52:49 +0800
Subject: [PATCH] feat: add Node/Edge API types, designer route, design button

---
 apps/web-antd/src/api/core/workflow.ts        | 133 ++++++++++++++++++
 .../src/router/routes/modules/workflow.ts     |   9 ++
 .../src/views/workflow/definitions/index.vue  |  13 +-
 3 files changed, 154 insertions(+), 1 deletion(-)

diff --git a/apps/web-antd/src/api/core/workflow.ts b/apps/web-antd/src/api/core/workflow.ts
index 93a1c70..b966bdf 100644
--- a/apps/web-antd/src/api/core/workflow.ts
+++ b/apps/web-antd/src/api/core/workflow.ts
@@ -120,6 +120,139 @@ export function disableWorkflowDefinitionApi(id: string) {
   return workflowRequestClient.post(`/workflow-definitions/${id}/disable`);
 }
 
+// --- Enums ---
+
+export enum NodeType {
+  Start = 0,
+  End = 1,
+  Approval = 2,
+  Cc = 3,
+  Condition = 4,
+  Parallel = 5,
+  SubProcess = 6,
+}
+
+export enum EdgeType {
+  Normal = 0,
+  Approved = 1,
+  Rejected = 2,
+}
+
+// --- Types ---
+
+export interface WorkflowNodeDto {
+  id: string;
+  nodeType: NodeType;
+  name: string;
+  config: string | null;
+  positionX: number;
+  positionY: number;
+}
+
+export interface WorkflowEdgeDto {
+  id: string;
+  sourceNodeId: string;
+  targetNodeId: string;
+  edgeType: EdgeType;
+  label: string | null;
+  condition: string | null;
+  order: number;
+}
+
+export interface WorkflowDefinitionDetailDto extends WorkflowDefinitionDto {
+  nodes: WorkflowNodeDto[];
+  edges: WorkflowEdgeDto[];
+}
+
+// --- Definition Detail ---
+
+export function getWorkflowDefinitionDetailApi(id: string) {
+  return workflowRequestClient.get<WorkflowDefinitionDetailDto>(
+    `/workflow-definitions/${id}`,
+  );
+}
+
+// --- Workflow Nodes ---
+
+export function createNodeApi(
+  definitionId: string,
+  data: {
+    nodeType: NodeType;
+    name: string;
+    config?: string;
+    positionX: number;
+    positionY: number;
+  },
+) {
+  return workflowRequestClient.post<WorkflowNodeDto>(
+    `/workflow-definitions/${definitionId}/nodes`,
+    data,
+  );
+}
+
+export function updateNodeApi(
+  definitionId: string,
+  nodeId: string,
+  data: {
+    name: string;
+    config?: string;
+    positionX: number;
+    positionY: number;
+  },
+) {
+  return workflowRequestClient.put<WorkflowNodeDto>(
+    `/workflow-definitions/${definitionId}/nodes/${nodeId}`,
+    data,
+  );
+}
+
+export function deleteNodeApi(definitionId: string, nodeId: string) {
+  return workflowRequestClient.delete(
+    `/workflow-definitions/${definitionId}/nodes/${nodeId}`,
+  );
+}
+
+// --- Workflow Edges ---
+
+export function createEdgeApi(
+  definitionId: string,
+  data: {
+    sourceNodeId: string;
+    targetNodeId: string;
+    edgeType: EdgeType;
+    label?: string;
+    condition?: string;
+    order: number;
+  },
+) {
+  return workflowRequestClient.post<WorkflowEdgeDto>(
+    `/workflow-definitions/${definitionId}/edges`,
+    data,
+  );
+}
+
+export function updateEdgeApi(
+  definitionId: string,
+  edgeId: string,
+  data: {
+    edgeType: EdgeType;
+    label?: string;
+    condition?: string;
+    order: number;
+  },
+) {
+  return workflowRequestClient.put<WorkflowEdgeDto>(
+    `/workflow-definitions/${definitionId}/edges/${edgeId}`,
+    data,
+  );
+}
+
+export function deleteEdgeApi(definitionId: string, edgeId: string) {
+  return workflowRequestClient.delete(
+    `/workflow-definitions/${definitionId}/edges/${edgeId}`,
+  );
+}
+
 // --- Workflow Instances ---
 
 export function getWorkflowInstancesApi(params?: {
diff --git a/apps/web-antd/src/router/routes/modules/workflow.ts b/apps/web-antd/src/router/routes/modules/workflow.ts
index 95c08a6..b5b8a71 100644
--- a/apps/web-antd/src/router/routes/modules/workflow.ts
+++ b/apps/web-antd/src/router/routes/modules/workflow.ts
@@ -55,6 +55,15 @@ const routes: RouteRecordRaw[] = [
           title: '流程监控',
         },
       },
+      {
+        name: 'WorkflowDesigner',
+        path: '/workflow/designer/:id',
+        component: () => import('#/views/workflow/designer/index.vue'),
+        meta: {
+          title: '流程设计器',
+          hideInMenu: true,
+        },
+      },
     ],
   },
 ];
diff --git a/apps/web-antd/src/views/workflow/definitions/index.vue b/apps/web-antd/src/views/workflow/definitions/index.vue
index 70ea395..49c0569 100644
--- a/apps/web-antd/src/views/workflow/definitions/index.vue
+++ b/apps/web-antd/src/views/workflow/definitions/index.vue
@@ -1,6 +1,8 @@
 <script lang="ts" setup>
 import { h, onMounted, ref } from 'vue';
 
+import { useRouter } from 'vue-router';
+
 import { Page } from '@vben/common-ui';
 
 import {
@@ -27,6 +29,12 @@ import {
   type WorkflowDefinitionDto,
 } from '#/api/core';
 
+const router = useRouter();
+
+function openDesigner(record: WorkflowDefinitionDto) {
+  router.push(`/workflow/designer/${record.id}`);
+}
+
 const loading = ref(false);
 const data = ref<WorkflowDefinitionDto[]>([]);
 const total = ref(0);
@@ -69,7 +77,7 @@ const columns = [
     customRender: ({ record }: { record: WorkflowDefinitionDto }) =>
       h(Tag, { color: record.isEnabled ? 'green' : 'default' }, () => record.isEnabled ? '是' : '否'),
   },
-  { title: '操作', key: 'actions', width: 280 },
+  { title: '操作', key: 'actions', width: 340 },
 ];
 
 async function loadData() {
@@ -206,6 +214,9 @@ onMounted(() => loadData());
       <template #bodyCell="{ column, record: record }">
         <template v-if="column.key === 'actions'">
           <Space>
+            <Button size="small" @click="openDesigner(record as WorkflowDefinitionDto)">
+              设计
+            </Button>
             <Button
               v-if="(record as WorkflowDefinitionDto).status === DefinitionStatus.Published && (record as WorkflowDefinitionDto).isEnabled"
               size="small"