feat: add Node/Edge API types, designer route, design button
This commit is contained in:
parent
9a50d06752
commit
209c0be5e1
@ -120,6 +120,139 @@ export function disableWorkflowDefinitionApi(id: string) {
|
|||||||
return workflowRequestClient.post(`/workflow-definitions/${id}/disable`);
|
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 ---
|
// --- Workflow Instances ---
|
||||||
|
|
||||||
export function getWorkflowInstancesApi(params?: {
|
export function getWorkflowInstancesApi(params?: {
|
||||||
|
|||||||
@ -55,6 +55,15 @@ const routes: RouteRecordRaw[] = [
|
|||||||
title: '流程监控',
|
title: '流程监控',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
name: 'WorkflowDesigner',
|
||||||
|
path: '/workflow/designer/:id',
|
||||||
|
component: () => import('#/views/workflow/designer/index.vue'),
|
||||||
|
meta: {
|
||||||
|
title: '流程设计器',
|
||||||
|
hideInMenu: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|||||||
@ -1,6 +1,8 @@
|
|||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { h, onMounted, ref } from 'vue';
|
import { h, onMounted, ref } from 'vue';
|
||||||
|
|
||||||
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
import { Page } from '@vben/common-ui';
|
import { Page } from '@vben/common-ui';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
@ -27,6 +29,12 @@ import {
|
|||||||
type WorkflowDefinitionDto,
|
type WorkflowDefinitionDto,
|
||||||
} from '#/api/core';
|
} from '#/api/core';
|
||||||
|
|
||||||
|
const router = useRouter();
|
||||||
|
|
||||||
|
function openDesigner(record: WorkflowDefinitionDto) {
|
||||||
|
router.push(`/workflow/designer/${record.id}`);
|
||||||
|
}
|
||||||
|
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const data = ref<WorkflowDefinitionDto[]>([]);
|
const data = ref<WorkflowDefinitionDto[]>([]);
|
||||||
const total = ref(0);
|
const total = ref(0);
|
||||||
@ -69,7 +77,7 @@ const columns = [
|
|||||||
customRender: ({ record }: { record: WorkflowDefinitionDto }) =>
|
customRender: ({ record }: { record: WorkflowDefinitionDto }) =>
|
||||||
h(Tag, { color: record.isEnabled ? 'green' : 'default' }, () => record.isEnabled ? '是' : '否'),
|
h(Tag, { color: record.isEnabled ? 'green' : 'default' }, () => record.isEnabled ? '是' : '否'),
|
||||||
},
|
},
|
||||||
{ title: '操作', key: 'actions', width: 280 },
|
{ title: '操作', key: 'actions', width: 340 },
|
||||||
];
|
];
|
||||||
|
|
||||||
async function loadData() {
|
async function loadData() {
|
||||||
@ -206,6 +214,9 @@ onMounted(() => loadData());
|
|||||||
<template #bodyCell="{ column, record: record }">
|
<template #bodyCell="{ column, record: record }">
|
||||||
<template v-if="column.key === 'actions'">
|
<template v-if="column.key === 'actions'">
|
||||||
<Space>
|
<Space>
|
||||||
|
<Button size="small" @click="openDesigner(record as WorkflowDefinitionDto)">
|
||||||
|
设计
|
||||||
|
</Button>
|
||||||
<Button
|
<Button
|
||||||
v-if="(record as WorkflowDefinitionDto).status === DefinitionStatus.Published && (record as WorkflowDefinitionDto).isEnabled"
|
v-if="(record as WorkflowDefinitionDto).status === DefinitionStatus.Published && (record as WorkflowDefinitionDto).isEnabled"
|
||||||
size="small"
|
size="small"
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user