Skip to content

Commit c43d296

Browse files
xlornexlorne
committed
fix flow
1 parent 3677d81 commit c43d296

File tree

5 files changed

+177
-228
lines changed

5 files changed

+177
-228
lines changed

‎admin-pro-ui/src/components/flow/domain/FlowPanelContext.ts

Lines changed: 168 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
import React from "react";
22
import {LogicFlow} from "@logicflow/core";
3-
import {NodeButtonProperties, NodeProperties, NodeType} from "@/components/flow/types";
3+
import {CustomButtonType, NodeButtonProperties, NodeProperties, NodeType} from "@/components/flow/types";
44
import {message} from "antd";
55
import {isEmpty} from "lodash-es";
6-
import {CustomButtonType} from "@/components/flow/flow/types";
76
import NodeData = LogicFlow.NodeData;
87
import RegisterConfig = LogicFlow.RegisterConfig;
98
import GraphConfigData = LogicFlow.GraphConfigData;
9+
import GroovyScript from "@/components/flow/utils/script";
1010

1111
// 节点移动距离
1212
const TRANSLATION_DISTANCE = 40
@@ -87,6 +87,9 @@ class FlowPanelContext {
8787
return this.buttonEventOptions.find(item => item.value === value)?.label;
8888
}
8989

90+
/**
91+
* 获取按钮事件选项
92+
*/
9093
getButtonEventOptions() {
9194
return this.buttonEventOptions;
9295
}
@@ -155,6 +158,31 @@ class FlowPanelContext {
155158
return []
156159
}
157160

161+
162+
/**
163+
* 删除节点按钮
164+
* @param nodeId 节点id
165+
* @param buttonId 按钮id
166+
*/
167+
deleteButton(nodeId:string,buttonId:string){
168+
const data = this.getGraphData();
169+
if(data) {
170+
//@ts-ignore
171+
const nodes = data.nodes;
172+
const getNode = (nodeId: String) => {
173+
for (const node of nodes) {
174+
if (node.id === nodeId) {
175+
return node;
176+
}
177+
}
178+
}
179+
const node = getNode(nodeId);
180+
const buttons = node.properties.buttons || [];
181+
node.properties.buttons = buttons.filter((item: any) => item.id !== buttonId);
182+
this.render(data as GraphConfigData);
183+
}
184+
}
185+
158186
/**
159187
* 更新节点按钮数据
160188
*/
@@ -213,6 +241,144 @@ class FlowPanelContext {
213241
}
214242

215243

244+
/**
245+
* 获取节点下的边
246+
* @param nodeId 节点id
247+
*/
248+
getEdges(nodeId: String) {
249+
const data = this.getGraphData() as any;
250+
const list = []
251+
if(data) {
252+
const nodes = data.nodes;
253+
const getNodeProperties = (nodeId: String) => {
254+
for (const node of nodes) {
255+
if (node.id === nodeId) {
256+
return node.properties;
257+
}
258+
}
259+
}
260+
261+
let update = false;
262+
263+
let order = 0;
264+
if (data && data.edges) {
265+
const edges = data.edges;
266+
for (const index in edges) {
267+
const edge = edges[index];
268+
if (edge.sourceNodeId === nodeId) {
269+
order++;
270+
if (!edge.properties.outTrigger) {
271+
edge.properties = {
272+
...edge.properties,
273+
outTrigger: GroovyScript.defaultOutTrigger,
274+
order: order,
275+
back: false
276+
}
277+
update = true;
278+
}
279+
280+
list.push({
281+
id: edge.id,
282+
name: edge.properties.name,
283+
source: getNodeProperties(edge.sourceNodeId),
284+
target: getNodeProperties(edge.targetNodeId),
285+
outTrigger: edge.properties.outTrigger,
286+
back: edge.properties.back,
287+
order: edge.properties.order,
288+
edge
289+
});
290+
}
291+
}
292+
}
293+
294+
if (update) {
295+
this.render(data);
296+
}
297+
}
298+
299+
return list;
300+
}
301+
302+
303+
/**
304+
* 修改边的名称
305+
* @param edgeId 边id
306+
* @param name 名称
307+
*/
308+
changeEdgeName(edgeId:string,name:string){
309+
const data = this.getGraphData() as any;
310+
if (data && data.edges) {
311+
const edges = data.edges;
312+
for (const index in edges) {
313+
const edge = edges[index];
314+
if (edge.id === edgeId) {
315+
edge.properties.name = name;
316+
this.render(data);
317+
}
318+
}
319+
}
320+
}
321+
322+
323+
/**
324+
* 修改边的排序
325+
* @param edgeId 边id
326+
* @param order 排序
327+
*/
328+
changeEdgeOrder(edgeId:string,order:number){
329+
const data = this.getGraphData() as any;
330+
if (data && data.edges) {
331+
const edges = data.edges;
332+
for (const index in edges) {
333+
const edge = edges[index];
334+
if (edge.id === edgeId) {
335+
edge.properties.order = order;
336+
this.render(data);
337+
}
338+
}
339+
}
340+
}
341+
342+
/**
343+
* 修改边的退回属性
344+
* @param edgeId 边id
345+
* @param back 是否退回
346+
*/
347+
changeEdgeBack(edgeId:string,back:boolean){
348+
const data = this.getGraphData() as any;
349+
if (data && data.edges) {
350+
const edges = data.edges;
351+
for (const index in edges) {
352+
const edge = edges[index];
353+
if (edge.id === edgeId) {
354+
edge.properties.back = back;
355+
this.render(data);
356+
}
357+
}
358+
}
359+
}
360+
361+
362+
/**
363+
* 修改边的触发器
364+
* @param edgeId 边id
365+
* @param outTrigger 触发器
366+
*/
367+
changeEdgeOutTrigger(edgeId:string,outTrigger:string){
368+
const data = this.getGraphData() as any;
369+
if (data && data.edges) {
370+
const edges = data.edges;
371+
for (const index in edges) {
372+
const edge = edges[index];
373+
if (edge.id === edgeId) {
374+
edge.properties.outTrigger = outTrigger;
375+
this.render(data);
376+
}
377+
}
378+
}
379+
}
380+
381+
216382
/**
217383
* 复制节点 控制位置的偏移
218384
* @param nodeData

‎admin-pro-ui/src/components/flow/nodes/panel/ButtonPanel.tsx

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import React from "react";
22
import {ActionType, ModalForm, ProColumns, ProForm, ProFormText, ProTable} from "@ant-design/pro-components";
33
import {Button, ColorPicker, Popconfirm, Space} from "antd";
4-
import FlowUtils from "@/components/flow/utils";
54
import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
65
import {EyeOutlined} from "@ant-design/icons";
76
import FlowContext from "@/components/flow/domain/FlowContext";
@@ -83,7 +82,7 @@ const ButtonPanel: React.FC<ButtonPanelProps> = (props) => {
8382
key={"delete"}
8483
title={"确认要删除吗？"}
8584
onConfirm={() => {
86-
FlowUtils.deleteButton(props.id, record.id);
85+
flowContext.getFlowPanelContext()?.deleteButton(props.id, record.id);
8786
actionRef.current?.reload();
8887
}}>
8988
<a>删除</a>
@@ -218,7 +217,6 @@ const ButtonPanel: React.FC<ButtonPanelProps> = (props) => {
218217

219218
<ScriptModal
220219
onFinish={(values) => {
221-
console.log('values', values);
222220
form.setFieldsValue({
223221
'groovy': values.script
224222
});

‎admin-pro-ui/src/components/flow/nodes/panel/EdgePanel.tsx

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@ import React from "react";
22
import {ActionType, ProForm, ProTable} from "@ant-design/pro-components";
33
import {Input, InputNumber, Popconfirm, Space} from "antd";
44
import {CheckOutlined, EditOutlined, SettingOutlined} from "@ant-design/icons";
5-
import FlowUtils from "@/components/flow/utils";
65
import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
6+
import FlowContext from "@/components/flow/domain/FlowContext";
77

88
interface EdgePanelProps {
99
id?: string;
@@ -20,23 +20,25 @@ const EdgePanel: React.FC<EdgePanelProps> = (props) => {
2020
const [groovyForm] = ProForm.useForm();
2121
const actionRef = React.useRef<ActionType>();
2222

23+
const flowContext = FlowContext.getInstance();
24+
2325
const handlerChangeName = (id: any) => {
24-
FlowUtils.changeEdgeName(id, name);
26+
flowContext.getFlowPanelContext()?.changeEdgeName(id, name);
2527
actionRef.current?.reload();
2628
}
2729

2830
const handlerChangeOrder = (id: any) => {
29-
FlowUtils.changeEdgeOrder(id, order);
31+
flowContext.getFlowPanelContext()?.changeEdgeOrder(id, order);
3032
actionRef.current?.reload();
3133
}
3234

3335
const handlerChangeBack = (id: any, back: boolean) => {
34-
FlowUtils.changeEdgeBack(id, back);
36+
flowContext.getFlowPanelContext()?.changeEdgeBack(id, back);
3537
actionRef.current?.reload();
3638
}
3739

3840
const handlerChangeOutTrigger = (id: any, outTrigger: string) => {
39-
FlowUtils.changeEdgeOutTrigger(id, outTrigger);
41+
flowContext.getFlowPanelContext()?.changeEdgeOutTrigger(id, outTrigger);
4042
actionRef.current?.reload();
4143
}
4244

@@ -169,7 +171,7 @@ const EdgePanel: React.FC<EdgePanelProps> = (props) => {
169171
options={false}
170172
pagination={false}
171173
request={async () => {
172-
const data = props.id ? FlowUtils.getEdges(props.id) : [];
174+
const data = props.id ? flowContext.getFlowPanelContext()?.getEdges(props.id) as any[] : [];
173175
return {
174176
data: data.sort((a: any, b: any) => {
175177
return a.order - b.order;

0 commit comments

Comments
 (0)