This commit is contained in:
dengqichen 2024-12-20 14:21:20 +08:00
parent e76af9b8f5
commit a6f0fb89a0

View File

@ -1,5 +1,5 @@
import React, {useEffect, ReactNode} from 'react'; import React, {useEffect, ReactNode} from 'react';
import {Drawer, Form, Input, Select, Button, Space, Divider, Tooltip} from 'antd'; import {Drawer, Form, Input, Select, Button, Space, Tabs, Tooltip} from 'antd';
import {InfoCircleOutlined} from '@ant-design/icons'; import {InfoCircleOutlined} from '@ant-design/icons';
import {Cell} from '@antv/x6'; import {Cell} from '@antv/x6';
import {NodeDefinitionResponse} from "@/pages/Workflow/NodeDesign/types"; import {NodeDefinitionResponse} from "@/pages/Workflow/NodeDesign/types";
@ -27,7 +27,7 @@ const NodeConfigDrawer: React.FC<NodeConfigDrawerProps> = ({
nodeDefinition, nodeDefinition,
onOk, onOk,
onCancel, onCancel,
}) => { }) => {
const [form] = Form.useForm(); const [form] = Form.useForm();
useEffect(() => { useEffect(() => {
@ -54,7 +54,7 @@ const NodeConfigDrawer: React.FC<NodeConfigDrawerProps> = ({
onCancel(); onCancel();
}; };
const renderFormItem = (key: string, property: SchemaProperty, required: boolean) => { const renderFormItem = (key: string, property: SchemaProperty, required: boolean, isReadOnly: boolean) => {
const baseProps = { const baseProps = {
name: key, name: key,
label: ( label: (
@ -70,6 +70,14 @@ const NodeConfigDrawer: React.FC<NodeConfigDrawerProps> = ({
rules: [{required, message: `请输入${property.title}`}], rules: [{required, message: `请输入${property.title}`}],
}; };
if (isReadOnly) {
return (
<Form.Item key={key} {...baseProps}>
<Input disabled value={property.default}/>
</Form.Item>
);
}
switch (property.type) { switch (property.type) {
case 'string': case 'string':
if (property.enum) { if (property.enum) {
@ -140,41 +148,6 @@ const NodeConfigDrawer: React.FC<NodeConfigDrawerProps> = ({
return formItems; return formItems;
}; };
// 显示节点详细信息
const renderNodeDetails = () => {
if (!nodeDefinition?.graphConfig.details) return null;
const {details} = nodeDefinition.graphConfig;
return (
<>
<Divider orientation="left"></Divider>
{/*<div style={{ marginBottom: 16 }}>*/}
{/* <p>{details.description}</p>*/}
{/* {details.features && details.features.length > 0 && (*/}
{/* <div>*/}
{/* <strong>功能特点:</strong>*/}
{/* <ul>*/}
{/* {details.features.map((feature, index) => (*/}
{/* <li key={index}>{feature}</li>*/}
{/* ))}*/}
{/* </ul>*/}
{/* </div>*/}
{/* )}*/}
{/* {details.scenarios && details.scenarios.length > 0 && (*/}
{/* <div>*/}
{/* <strong>适用场景:</strong>*/}
{/* <ul>*/}
{/* {details.scenarios.map((scenario, index) => (*/}
{/* <li key={index}>{scenario}</li>*/}
{/* ))}*/}
{/* </ul>*/}
{/* </div>*/}
{/* )}*/}
{/*</div>*/}
</>
);
};
return ( return (
<Drawer <Drawer
title={`编辑节点 - ${nodeDefinition?.nodeName || ''}`} title={`编辑节点 - ${nodeDefinition?.nodeName || ''}`}
@ -191,25 +164,24 @@ const NodeConfigDrawer: React.FC<NodeConfigDrawerProps> = ({
</Space> </Space>
} }
> >
{/*{renderNodeDetails()}*/} <Tabs>
<Divider orientation="left"></Divider> {nodeDefinition?.panelVariablesSchema && (
<Form <Tabs.TabPane tab="面板变量" key="panel">
form={form} {Object.entries(nodeDefinition.panelVariablesSchema.properties).map(([key, property]) => {
layout="vertical"
initialValues={{}}
>
<Form.Item name="code" hidden>
<Input/>
</Form.Item>
<Form.Item name="delegate" hidden>
<Input/>
</Form.Item>
{nodeDefinition?.panelVariablesSchema &&
Object.entries(nodeDefinition.panelVariablesSchema.properties).map(([key, property]) => {
const required = nodeDefinition.panelVariablesSchema?.properties.required?.includes(key) || false; const required = nodeDefinition.panelVariablesSchema?.properties.required?.includes(key) || false;
return renderFormItem(key, property as SchemaProperty, required); return renderFormItem(key, property as SchemaProperty, required, false);
})} })}
</Form> </Tabs.TabPane>
)}
{nodeDefinition?.localVariablesSchema && (
<Tabs.TabPane tab="环境变量" key="local">
{Object.entries(nodeDefinition.localVariablesSchema.properties).map(([key, property]) => {
const required = nodeDefinition.localVariablesSchema?.properties.required?.includes(key) || false;
return renderFormItem(key, property as SchemaProperty, required, true);
})}
</Tabs.TabPane>
)}
</Tabs>
</Drawer> </Drawer>
); );
}; };