1
This commit is contained in:
parent
9cf6dde2bd
commit
ad399901d5
@ -4,7 +4,6 @@ import { Row, Col, Menu, Tabs, Card, Button, message } from 'antd';
|
|||||||
import { BetaSchemaForm, ProForm, ProFormGroup, ProFormText, ProFormTextArea } from '@ant-design/pro-form';
|
import { BetaSchemaForm, ProForm, ProFormGroup, ProFormText, ProFormTextArea } from '@ant-design/pro-form';
|
||||||
import type { NodeDesignData } from './types';
|
import type { NodeDesignData } from './types';
|
||||||
import * as service from './service';
|
import * as service from './service';
|
||||||
import { useParams, useLocation } from 'react-router-dom';
|
|
||||||
|
|
||||||
// Tab 配置
|
// Tab 配置
|
||||||
const TAB_CONFIG = [
|
const TAB_CONFIG = [
|
||||||
@ -16,7 +15,7 @@ const TAB_CONFIG = [
|
|||||||
|
|
||||||
const NodeDesignForm: React.FC = () => {
|
const NodeDesignForm: React.FC = () => {
|
||||||
// 缓存节点定义数据
|
// 缓存节点定义数据
|
||||||
const [nodeDesignData, setNodeDesignData] = useState<NodeDesignData[]>([]);
|
const [nodeDefinitions, setNodeDefinitions] = useState<NodeDesignData[]>([]);
|
||||||
const [loading, setLoading] = useState(false);
|
const [loading, setLoading] = useState(false);
|
||||||
// 当前选中的节点
|
// 当前选中的节点
|
||||||
const [selectedNode, setSelectedNode] = useState<NodeDesignData | null>(null);
|
const [selectedNode, setSelectedNode] = useState<NodeDesignData | null>(null);
|
||||||
@ -26,40 +25,39 @@ const NodeDesignForm: React.FC = () => {
|
|||||||
const formRef = useRef<any>();
|
const formRef = useRef<any>();
|
||||||
const uiFormRef = useRef<any>(); // 添加 UI 配置表单的 ref
|
const uiFormRef = useRef<any>(); // 添加 UI 配置表单的 ref
|
||||||
|
|
||||||
const { nodeCode } = useParams();
|
|
||||||
const location = useLocation();
|
|
||||||
const nodeData = location.state?.nodeData;
|
|
||||||
|
|
||||||
// 加载节点定义数据
|
// 加载节点定义数据
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const loadData = async () => {
|
const loadNodeDefinitions = async () => {
|
||||||
if (nodeCode && !nodeData) {
|
try {
|
||||||
try {
|
setLoading(true);
|
||||||
const data = await service.getNodeDesign(nodeCode);
|
const data = await service.getNodeDefinitionsDefined();
|
||||||
setSelectedNode(data);
|
setNodeDefinitions(data);
|
||||||
} catch (error) {
|
// 默认选中第一个节点
|
||||||
console.error('Failed to load node design:', error);
|
if (data.length > 0) {
|
||||||
message.error('加载节点设计失败');
|
setSelectedNode(data[0]);
|
||||||
}
|
}
|
||||||
} else if (nodeData) {
|
} catch (error) {
|
||||||
setSelectedNode(nodeData);
|
console.error('加载节点定义失败:', error);
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
loadData();
|
|
||||||
}, [nodeCode, nodeData]);
|
loadNodeDefinitions();
|
||||||
|
}, []);
|
||||||
|
|
||||||
// 获取当前节点可用的 Tab 列表
|
// 获取当前节点可用的 Tab 列表
|
||||||
const getAvailableTabs = (node: NodeDesignData | null) => {
|
const getAvailableTabs = (node: NodeDefinitionData | null) => {
|
||||||
if (!node) return [];
|
if (!node) return [];
|
||||||
return TAB_CONFIG.filter(tab => {
|
return TAB_CONFIG.filter(tab => {
|
||||||
const value = node[tab.schemaKey as keyof NodeDesignData];
|
const value = node[tab.schemaKey as keyof NodeDefinitionData];
|
||||||
return value !== null && value !== undefined;
|
return value !== null && value !== undefined;
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
// 处理节点选择
|
// 处理节点选择
|
||||||
const handleNodeSelect = (nodeCode: string) => {
|
const handleNodeSelect = (nodeCode: string) => {
|
||||||
const node = nodeDesignData.find(n => n.nodeCode === nodeCode);
|
const node = nodeDefinitions.find(n => n.nodeCode === nodeCode);
|
||||||
if (node) {
|
if (node) {
|
||||||
setSelectedNode(node);
|
setSelectedNode(node);
|
||||||
// 获取可用的 tab 列表
|
// 获取可用的 tab 列表
|
||||||
@ -349,7 +347,7 @@ const NodeDesignForm: React.FC = () => {
|
|||||||
<Menu
|
<Menu
|
||||||
mode="vertical"
|
mode="vertical"
|
||||||
selectedKeys={[selectedNode?.nodeCode || '']}
|
selectedKeys={[selectedNode?.nodeCode || '']}
|
||||||
items={nodeDesignData.map(node => ({
|
items={nodeDefinitions.map(node => ({
|
||||||
key: node.nodeCode,
|
key: node.nodeCode,
|
||||||
label: `${node.nodeName}(${node.nodeCode})`,
|
label: `${node.nodeName}(${node.nodeCode})`,
|
||||||
}))}
|
}))}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user