模版解析正确
This commit is contained in:
parent
e96e19ca01
commit
49a711356b
@ -16,7 +16,7 @@ import './index.module.less';
|
|||||||
import NodePanel from './components/NodePanel';
|
import NodePanel from './components/NodePanel';
|
||||||
import NodeConfig from './components/NodeConfig';
|
import NodeConfig from './components/NodeConfig';
|
||||||
import Toolbar from './components/Toolbar';
|
import Toolbar from './components/Toolbar';
|
||||||
import { NodeType } from './service';
|
import { NodeType, getNodeTypes } from './service';
|
||||||
|
|
||||||
const {Sider, Content} = Layout;
|
const {Sider, Content} = Layout;
|
||||||
|
|
||||||
@ -24,7 +24,10 @@ interface NodeData {
|
|||||||
type: string;
|
type: string;
|
||||||
name?: string;
|
name?: string;
|
||||||
description?: string;
|
description?: string;
|
||||||
config: Record<string, any>;
|
config: {
|
||||||
|
executor?: string;
|
||||||
|
[key: string]: any;
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
const FlowDesigner: React.FC = () => {
|
const FlowDesigner: React.FC = () => {
|
||||||
@ -39,8 +42,27 @@ const FlowDesigner: React.FC = () => {
|
|||||||
const [configVisible, setConfigVisible] = useState(false);
|
const [configVisible, setConfigVisible] = useState(false);
|
||||||
const [currentNode, setCurrentNode] = useState<Node>();
|
const [currentNode, setCurrentNode] = useState<Node>();
|
||||||
const [currentNodeType, setCurrentNodeType] = useState<NodeType>();
|
const [currentNodeType, setCurrentNodeType] = useState<NodeType>();
|
||||||
|
const [nodeTypes, setNodeTypes] = useState<NodeType[]>([]);
|
||||||
const [form] = Form.useForm();
|
const [form] = Form.useForm();
|
||||||
|
|
||||||
|
// 获取所有节点类型
|
||||||
|
const fetchNodeTypes = async () => {
|
||||||
|
try {
|
||||||
|
const types = await getNodeTypes({ enabled: true });
|
||||||
|
setNodeTypes(types);
|
||||||
|
return types;
|
||||||
|
} catch (error) {
|
||||||
|
console.error('获取节点类型失败:', error);
|
||||||
|
message.error('获取节点类型失败');
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 首次加载获取节点类型
|
||||||
|
useEffect(() => {
|
||||||
|
fetchNodeTypes();
|
||||||
|
}, []);
|
||||||
|
|
||||||
// 初始化图形
|
// 初始化图形
|
||||||
const initGraph = () => {
|
const initGraph = () => {
|
||||||
if (!containerRef.current) return;
|
if (!containerRef.current) return;
|
||||||
@ -234,17 +256,20 @@ const FlowDesigner: React.FC = () => {
|
|||||||
const data = node.getData() as NodeData;
|
const data = node.getData() as NodeData;
|
||||||
if (data) {
|
if (data) {
|
||||||
// 获取节点类型
|
// 获取节点类型
|
||||||
const nodeType = draggedNodeRef.current;
|
const nodeType = nodeTypes.find(type => type.code === data.type);
|
||||||
if (nodeType && nodeType.code === data.type) {
|
if (nodeType) {
|
||||||
setCurrentNodeType(nodeType);
|
setCurrentNodeType(nodeType);
|
||||||
}
|
// 设置表单值,包括基本信息和配置信息
|
||||||
// 设置表单值
|
|
||||||
form.setFieldsValue({
|
form.setFieldsValue({
|
||||||
name: data.name,
|
name: data.name || nodeType.name,
|
||||||
description: data.description,
|
description: data.description,
|
||||||
...data.config,
|
executor: data.config?.executor,
|
||||||
|
...data.config
|
||||||
});
|
});
|
||||||
setConfigVisible(true);
|
setConfigVisible(true);
|
||||||
|
} else {
|
||||||
|
message.error('未找到对应的节点类型');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -352,7 +377,7 @@ const FlowDesigner: React.FC = () => {
|
|||||||
data: {
|
data: {
|
||||||
type: nodeType.code,
|
type: nodeType.code,
|
||||||
name: nodeType.name,
|
name: nodeType.name,
|
||||||
config: {},
|
config: {} as any,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user