fix: add label of component (#1847)

This commit is contained in:
Dreammy23
2024-08-20 09:00:38 +08:00
committed by GitHub

View File

@@ -34,6 +34,19 @@ const NodeParamHandler: React.FC<NodeParamHandlerProps> = ({ node, data, label,
data.value = value;
}
function renderLabelWithTooltip(data: IFlowNodeParameter) {
return (
<div>
{data.label}:<RequiredIcon optional={data.optional} />
{data.description && (
<Tooltip title={data.description}>
<InfoCircleOutlined className="ml-2 cursor-pointer" />
</Tooltip>
)}
</div>
);
}
// render node parameters based on AWEL1.0
function renderNodeWithoutUiParam(data: IFlowNodeParameter) {
let defaultValue = data.value ?? data.default;
@@ -43,14 +56,7 @@ const NodeParamHandler: React.FC<NodeParamHandlerProps> = ({ node, data, label,
case 'float':
return (
<div className="text-sm">
<p>
{data.label}:<RequiredIcon optional={data.optional} />
{data.description && (
<Tooltip title={data.description}>
<InfoCircleOutlined className="ml-2 cursor-pointer" />
</Tooltip>
)}
</p>
{renderLabelWithTooltip(data)}
<InputNumber
className="w-full"
defaultValue={defaultValue}
@@ -63,14 +69,7 @@ const NodeParamHandler: React.FC<NodeParamHandlerProps> = ({ node, data, label,
case 'str':
return (
<div className="text-sm">
<p>
{data.label}:<RequiredIcon optional={data.optional} />
{data.description && (
<Tooltip title={data.description}>
<InfoCircleOutlined className="ml-2 cursor-pointer" />
</Tooltip>
)}
</p>
{renderLabelWithTooltip(data)}
{data.options?.length > 0 ? (
<Select
className="w-full nodrag"
@@ -94,32 +93,21 @@ const NodeParamHandler: React.FC<NodeParamHandlerProps> = ({ node, data, label,
defaultValue = defaultValue === 'True' ? true : defaultValue;
return (
<div className="text-sm">
<p>
{data.label}:<RequiredIcon optional={data.optional} />
{data.description && (
<Tooltip title={data.description}>
<InfoCircleOutlined className="ml-2 cursor-pointer" />
</Tooltip>
)}
<Checkbox
className="ml-2"
defaultChecked={defaultValue}
onChange={(e) => {
onChange(e.target.checked);
}}
/>
</p>
{renderLabelWithTooltip(data)}
<Checkbox
className="ml-2"
defaultChecked={defaultValue}
onChange={(e) => {
onChange(e.target.checked);
}}
/>
</div>
);
}
}
// render node parameters based on AWEL2.0
function renderNodeWithUiParam(data: IFlowNodeParameter) {
let defaultValue = data.value ?? data.default;
const props = { data, defaultValue, onChange };
switch (data?.ui?.ui_type) {
function renderComponentByType(type: string, props?: any) {
switch (type) {
case 'select':
return <RenderSelect {...props} />;
case 'cascader':
@@ -144,8 +132,8 @@ const NodeParamHandler: React.FC<NodeParamHandlerProps> = ({ node, data, label,
return <RenderPassword {...props} />;
case 'upload':
return <RenderUpload {...props} />;
case 'variables':
return <RenderVariables {...props} />;
case 'variables':
return <RenderVariables {...props} />;
case 'code_editor':
return <RenderCodeEditor {...props} />;
default:
@@ -153,6 +141,19 @@ const NodeParamHandler: React.FC<NodeParamHandlerProps> = ({ node, data, label,
}
}
// render node parameters based on AWEL2.0
function renderNodeWithUiParam(data: IFlowNodeParameter) {
let defaultValue = data.value ?? data.default;
const props = { data, defaultValue, onChange };
return (
<div>
{renderLabelWithTooltip(data)}
{renderComponentByType(data?.ui?.ui_type, props)}
</div>
);
}
if (data.category === 'resource') {
return <NodeHandler node={node} data={data} type="target" label={label} index={index} />;
} else if (data.category === 'common') {
@@ -160,4 +161,4 @@ const NodeParamHandler: React.FC<NodeParamHandlerProps> = ({ node, data, label,
}
};
export default NodeParamHandler;
export default NodeParamHandler;