Skip to content

Commit

Permalink
feat: 修复分支节点创建时限制逻辑
Browse files Browse the repository at this point in the history
  • Loading branch information
@xiaojunnanya
xiaojunnanya committed Dec 4, 2024
1 parent 7a5f341 commit b3d1562
Show file tree
Hide file tree
Showing 3 changed files with 6,007 additions and 4,738 deletions.
142 changes: 81 additions & 61 deletions packages/editor/src/components/FlowNode/FlowNode.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,8 @@ import { message } from '@/utils/AntdGlobal';
import NodeEdit from './NodeEdit';
import ActionModal from '../EventConfig/ActionModal/ActionModal';
import './index.less';
import { findNodeIndexAndParent } from '@/utils/util';
import { cloneDeep } from 'lodash-es';

export type NodeType = {
id: string;
Expand Down Expand Up @@ -132,59 +134,78 @@ function FlowNode(_: any, ref: any) {
createNode('');
}

/**
* 不能创建节点的情况
* 1. 开始节点后第一个节点不能添加分支节点
* 2. 分支节点后第一个节点不能添加分支节点
* 3. 分支节点前第一个节点不能添加分支节点
*/
function createNode(title: string) {
const nodeList = JSON.parse(JSON.stringify(list));
const nodeList = cloneDeep(list);
const node = findNodeIndexAndParent(nodeList, id);
if (!node) return;

const parentNode = node.parentNode;

// 拿到点击创建的当前节点，查看当前节点的下一个节点是否为是条件节点
const nestNode = (parentNode ? parentNode.children : nodeList)[node.index + 1];
if (nestNode.type === 'condition' && type === 'condition') {
message.error('分支节点前一个节点不能添加分支节点');
return;
}

// 创建一个普通节点
const taskNode = {
id: generateId(),
type,
title,
content: '行为配置',
content: '编排节点',
config: {},
children: [],
};
if (!node.parentNode) {
if (type === 'normal') {
nodeList.splice(node.index + 1, 0, taskNode);
} else {
if (node.selfNode.type === 'start') {
message.error('开始节点后第一个不能添加分支节点');
return;

const parentNodeType: 'condition' | 'success' | 'fail' | 'normal' | undefined = parentNode?.type;

switch (parentNodeType) {
case undefined:
if (type === 'normal') {
nodeList.splice(node.index + 1, 0, taskNode);
} else {
if (node.selfNode.type === 'start') {
message.error('开始节点后第一个节点不能添加分支节点');
return;
}
if (node.selfNode.type === 'condition') {
message.error('分支节点后第一个节点不能添加分支节点');
return;
}
nodeList.splice(node.index + 1, 0, {
...taskNode,
children: [
{
id: generateId(),
type: 'success',
children: [],
title: '成功',
content: '成功时执行此流程',
},
{
id: generateId(),
type: 'fail',
title: '失败',
content: '失败时执行此流程',
children: [],
},
],
});
}
if (node.selfNode.type === 'condition') {
message.error('分支节点后第一个不能添加分支节点');
break;
case 'success':
case 'fail':
if (node.selfNode.type === 'condition' && type === 'condition') {
message.error('分支节点后第一个节点不能添加分支节点');
return;
}
nodeList.splice(node.index + 1, 0, {
...taskNode,
children: [
{
id: generateId(),
type: 'success',
children: [],
title: '成功',
content: '成功时执行此流程',
},
{
id: generateId(),
type: 'fail',
title: '失败',
content: '失败时执行此流程',
children: [],
},
],
});
}
} else if (node?.parentNode?.type === 'condition') {
if (type === 'condition') {
message.error('分支节点后第一个不能添加分支节点');
return;
}
node.parentNode.children[node.index].children.unshift(taskNode);
} else if (['normal', 'success', 'fail'].includes(node?.parentNode?.type)) {
if (type === 'normal') {
node.parentNode.children.splice(node.index + 1, 0, taskNode);
} else {
node.parentNode.children.splice(node.index + 1, 0, {
...taskNode,
children: [
Expand All @@ -206,23 +227,36 @@ function FlowNode(_: any, ref: any) {
},
],
});
}
break;
case 'normal':
node.parentNode.children.splice(node.index + 1, 0, taskNode);
break;
case 'condition':
if (type === 'condition') {
message.error('分支节点后第一个节点不能添加分支节点');
return;
}
node.parentNode.children[node.index].children.unshift(taskNode);
break;
}

setList(() => [...nodeList]);
}
};

// 删除节点
const handleDelNode = (event: React.MouseEvent, id: string) => {
event.stopPropagation();
const nodeList = JSON.parse(JSON.stringify(list));
const nodeList = cloneDeep(list);
const node = findNodeIndexAndParent(nodeList, id);
if (!node) return;
if (!node.parentNode) {
nodeList.splice(node.index, 1);
} else if (['success', 'fail', 'normal'].includes(node?.parentNode?.type)) {
node.parentNode.children.splice(node.index, 1);
} else if (node?.parentNode?.type === 'condition') {
const parentNode = findNodeIndexAndParent(nodeList, node?.parentNode?.id);
if (!parentNode) return;
if (parentNode.parentNode) {
parentNode.parentNode.children.splice(parentNode.index, 1);
} else {
Expand All @@ -239,8 +273,9 @@ function FlowNode(_: any, ref: any) {
return;
}
nodeRef.current?.open(node.title, (title) => {
const nodeList = JSON.parse(JSON.stringify(list)) as NodeType[];
const nodeList = cloneDeep(list) as NodeType[];
const editNode = findNodeIndexAndParent(nodeList, node.id);
if (!editNode) return;
editNode.selfNode.title = title;
setList(() => [...nodeList]);
});
Expand All @@ -253,8 +288,9 @@ function FlowNode(_: any, ref: any) {
return;
}
actionRef.current?.open(node.config, (values: any) => {
const nodeList = JSON.parse(JSON.stringify(list)) as NodeType[];
const nodeList = cloneDeep(list) as NodeType[];
const editNode = findNodeIndexAndParent(nodeList, node.id);
if (!editNode) return;
editNode.selfNode.content = values.actionName;
editNode.selfNode.config = values;
setList(() => [...nodeList]);
Expand Down Expand Up @@ -309,20 +345,4 @@ function FlowNode(_: any, ref: any) {
);
}

// 查找节点的索引及其父节点
export function findNodeIndexAndParent(children: any, nodeId: string, parentNode = null): any {
for (let i = 0; i < children.length; i++) {
if (children[i].id === nodeId) {
return { index: i, parentNode, selfNode: children[i] };
}
if (children[i].children) {
const result = findNodeIndexAndParent(children[i].children, nodeId, children[i]);
if (result) {
return result;
}
}
}
return null;
}

export default forwardRef(FlowNode);
34 changes: 34 additions & 0 deletions packages/editor/src/utils/util.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -231,3 +231,37 @@ export async function saveFile(name: string, content: string) {
return false;
}
}

/**
*
* @param children 组件树
* @param nodeId 节点id
* @param parentNode 父节点
* @returns {
* index: number, // 节点在父节点中的索引
* parentNode: any, // 父节点
* selfNode: any // 当前节点
* }
*/
export function findNodeIndexAndParent(
children: any,
nodeId: string,
parentNode = null,
): {
index: number;
parentNode: any;
selfNode: any;
} | null {
for (let i = 0; i < children.length; i++) {
if (children[i].id === nodeId) {
return { index: i, parentNode, selfNode: children[i] };
}
if (children[i].children) {
const result = findNodeIndexAndParent(children[i].children, nodeId, children[i]);
if (result) {
return result;
}
}
}
return null;
}
Loading

0 comments on commit b3d1562

Please sign in to comment.