From e97b63a4d4f347fa34b8e791397018c336a4b597 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B0=A8=E6=AC=A3?= Date: Thu, 8 Aug 2024 19:27:52 +0800 Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=E7=BC=96=E6=8E=92=E7=94=BB?= =?UTF-8?q?=E5=B8=83=E6=96=B0=E5=A2=9E=E5=9F=BA=E4=BA=8EAWEL2.0=E7=9A=84Se?= =?UTF-8?q?lect=E7=B1=BB=E5=9E=8B=E8=8A=82=E7=82=B9=E6=B8=B2=E6=9F=93?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/components/flow/node-param-handler.tsx | 36 ++++++++++++++----- .../flow/node-renderer/cascader.tsx | 3 ++ web/components/flow/node-renderer/index.ts | 2 ++ web/components/flow/node-renderer/select.tsx | 21 +++++++++++ web/types/flow.ts | 9 +++++ 5 files changed, 62 insertions(+), 9 deletions(-) create mode 100644 web/components/flow/node-renderer/cascader.tsx create mode 100644 web/components/flow/node-renderer/index.ts create mode 100644 web/components/flow/node-renderer/select.tsx diff --git a/web/components/flow/node-param-handler.tsx b/web/components/flow/node-param-handler.tsx index c617369cf..d86da6653 100644 --- a/web/components/flow/node-param-handler.tsx +++ b/web/components/flow/node-param-handler.tsx @@ -4,6 +4,7 @@ import React from 'react'; import RequiredIcon from './required-icon'; import NodeHandler from './node-handler'; import { InfoCircleOutlined } from '@ant-design/icons'; +import { RenderSelect, RenderCascader } from './node-renderer'; interface NodeParamHandlerProps { node: IFlowNode; @@ -14,14 +15,14 @@ interface NodeParamHandlerProps { // render node parameters item const NodeParamHandler: React.FC = ({ node, data, label, index }) => { - function handleChange(value: any) { + function onChange(value: any) { data.value = value; } - if (data.category === 'resource') { - return ; - } else if (data.category === 'common') { + // 基于AWEL1.0的流程设计器，对节点参数的渲染 + function renderNodeWithoutUiParam(data: IFlowNodeParameter) { let defaultValue = data.value !== null && data.value !== undefined ? data.value : data.default; + switch (data.type_name) { case 'int': case 'float': @@ -39,7 +40,7 @@ const NodeParamHandler: React.FC = ({ node, data, label, className="w-full" defaultValue={defaultValue} onChange={(value: number | null) => { - handleChange(value); + onChange(value); }} /> @@ -60,20 +61,20 @@ const NodeParamHandler: React.FC = ({ node, data, label, className="w-full nodrag" defaultValue={defaultValue} options={data.options.map((item: any) => ({ label: item.label, value: item.value }))} - onChange={handleChange} + onChange={onChange} /> ) : ( { - handleChange(e.target.value); + onChange(e.target.value); }} /> )} ); - case 'bool': + case 'checkbox': defaultValue = defaultValue === 'False' ? false : defaultValue; defaultValue = defaultValue === 'True' ? true : defaultValue; return ( @@ -89,7 +90,7 @@ const NodeParamHandler: React.FC = ({ node, data, label, className="ml-2" defaultChecked={defaultValue} onChange={(e) => { - handleChange(e.target.checked); + onChange(e.target.checked); }} />

@@ -97,6 +98,23 @@ const NodeParamHandler: React.FC = ({ node, data, label, ); } } + + // 基于AWEL2.0的流程设计器，对节点参数的渲染 + function renderNodeWithUiParam(data: IFlowNodeParameter) { + let defaultValue = data.value !== null && data.value !== undefined ? data.value : data.default; + + // TODO: 根据ui_type渲染不同的组件 + switch (data?.ui?.ui_type) { + case 'select': + return ; + } + } + + if (data.category === 'resource') { + return ; + } else if (data.category === 'common') { + return data?.ui ? renderNodeWithUiParam(data) : renderNodeWithoutUiParam(data); + } }; export default NodeParamHandler; diff --git a/web/components/flow/node-renderer/cascader.tsx b/web/components/flow/node-renderer/cascader.tsx new file mode 100644 index 000000000..605105a93 --- /dev/null +++ b/web/components/flow/node-renderer/cascader.tsx @@ -0,0 +1,3 @@ +import { IFlowNodeParameter } from '@/types/flow'; + +export const RenderCascader = (props: IFlowNodeParameter) => {}; diff --git a/web/components/flow/node-renderer/index.ts b/web/components/flow/node-renderer/index.ts new file mode 100644 index 000000000..d9d116497 --- /dev/null +++ b/web/components/flow/node-renderer/index.ts @@ -0,0 +1,2 @@ +export * from "./select"; +export * from "./cascader"; \ No newline at end of file diff --git a/web/components/flow/node-renderer/select.tsx b/web/components/flow/node-renderer/select.tsx new file mode 100644 index 000000000..897d18522 --- /dev/null +++ b/web/components/flow/node-renderer/select.tsx @@ -0,0 +1,21 @@ +import { IFlowNodeParameter } from "@/types/flow"; +import { Select } from "antd"; + +type SelectProps = { + data: IFlowNodeParameter; + defaultValue: any; + onChange: (value: any) => void; +} + +export const RenderSelect = (params: SelectProps) => { + const { data, defaultValue, onChange } = params; + + return data.options?.length > 0 && ( +