[elsa] 并行节点特性添加 (#114)

* [elsa] 提交并行节点代码框架

* [elsa] 并行节点特性添加

* [elsa] 检视意见修改

Author: RonnyChan96

framework/elsa/fit-elsa-react/src/common/Consts.js

@@ -191,7 +191,7 @@ export const RENDER_TYPE = {
   LABEL: 'Label',
 };
 
-export const DEFAULT_LOOP_NODE_CONTEXT = {
+export const DEFAULT_ADD_TOOL_NODE_CONTEXT = {
   id: uuidv4(),
   name: 'context',
   type: DATA_TYPES.OBJECT,

framework/elsa/fit-elsa-react/src/components/asserts/icon-parallel.svg

@@ -13,7 +13,8 @@ import {JadeInputTree} from '@/components/common/JadeInputTree.jsx';
 
 _InvokeInput.propTypes = {
     inputData: PropTypes.array,
-    shapeStatus: PropTypes.object
+    shapeStatus: PropTypes.object,
+    parentId: PropTypes.string,
 }
 
 /**
@@ -25,9 +26,10 @@ _InvokeInput.propTypes = {
  * @param radioValue Radio对应的值.
  * @param radioTitle Radio对应的展示信息.
  * @param radioRuleMessage Radio没填时的报错信息.
+ * @param parentId 输入入参上层所属id，非必填.
  * @returns {JSX.Element}
  */
-function _InvokeInput({inputData, shapeStatus, showRadio = false, radioValue, radioTitle, radioRuleMessage}) {
+function _InvokeInput({inputData, shapeStatus, showRadio = false, radioValue, radioTitle, radioRuleMessage, parentId}) {
     const dispatch = useDispatch();
 
     /**
@@ -37,7 +39,7 @@ function _InvokeInput({inputData, shapeStatus, showRadio = false, radioValue, ra
      * @param changes 需要改变的属性.
      */
     const updateItem = (id, changes) => {
-        dispatch({type: 'update', id, changes});
+        dispatch({type: 'update', id, changes, parentId});
     };
 
     /**

framework/elsa/fit-elsa-react/src/components/common/InvokeInput.jsx

@@ -22,10 +22,11 @@ JadeInputTreeCollapse.propTypes = {
  *
  * @param data 数据.
  * @param children 子组件列表.
+ * @param props 参数。
  * @return {JSX.Element}
  * @constructor
  */
-export default function JadeInputTreeCollapse({data, children}) {
+export default function JadeInputTreeCollapse({data, children, ...props}) {
     const { t } = useTranslation();
 
     const getContent = () => {
@@ -50,7 +51,7 @@ export default function JadeInputTreeCollapse({data, children}) {
     const content = getContent();
 
     return (<>
-        <JadeCollapse defaultActiveKey={['jadeInputTreePanel']}>
+        <JadeCollapse defaultActiveKey={['jadeInputTreePanel']} {...props}>
             <Panel
                 key={'jadeInputTreePanel'}
                 header={

framework/elsa/fit-elsa-react/src/components/common/JadeInputTreeCollapse.jsx

@@ -4,7 +4,7 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-import {DATA_TYPES, FROM_TYPE} from '@/common/Consts.js';
+import {DATA_TYPES, DEFAULT_ADD_TOOL_NODE_CONTEXT, FROM_TYPE} from '@/common/Consts.js';
 import {v4 as uuidv4} from 'uuid';
 
 export const DEFAULT_INPUT_PARAMS = [
@@ -29,4 +29,5 @@ export const DEFAULT_INPUT_PARAMS = [
     from: FROM_TYPE.INPUT,
     value: {},
   },
+  DEFAULT_ADD_TOOL_NODE_CONTEXT
 ];

framework/elsa/fit-elsa-react/src/components/loopNode/LoopConsts.js

@@ -9,6 +9,7 @@ import {InvokeOutput} from '@/components/common/InvokeOutput.jsx';
 import {SkillForm} from '@/components/loopNode/SkillForm.jsx';
 import {useDataContext, useDispatch} from '@/components/DefaultRoot.jsx';
 import {TOOL_TYPE} from '@/common/Consts.js';
+import PropTypes from 'prop-types';
 
 /**
  * 循环节点Wrapper
@@ -28,12 +29,10 @@ const LoopWrapper = ({shapeStatus}) => {
   const filterArgs = isWaterFlow ? args.find(arg => arg.name === 'inputParams')?.value ?? args : args;
   const filterRadioValue = isWaterFlow && radioValue ? radioValue.replace(/^inputParams\./, '') : radioValue;
 
-
-  const handlePluginChange = (entity, returnSchema, uniqueName, name, tags) => {
+  const handlePluginChange = (entity, uniqueName, name, tags) => {
     dispatch({
       type: 'changePluginByMetaData',
       entity: entity,
-      returnSchema: returnSchema,
       uniqueName: uniqueName,
       pluginName: name,
       tags: tags,
@@ -60,4 +59,8 @@ const LoopWrapper = ({shapeStatus}) => {
   </>);
 };
 
+LoopWrapper.propTypes = {
+  shapeStatus: PropTypes.object,
+};
+
 export default LoopWrapper;

framework/elsa/fit-elsa-react/src/components/loopNode/LoopWrapper.jsx

@@ -12,6 +12,7 @@ import {convertParameter, convertReturnFormat} from '@/components/util/MethodMet
 import {useTranslation} from 'react-i18next';
 import {MinusCircleOutlined} from '@ant-design/icons';
 import PropTypes from 'prop-types';
+import {recursive} from '@/components/util/ReferenceUtil.js';
 
 /**
  * 循环节点插件折叠区域组件
@@ -51,7 +52,7 @@ const _SkillForm = ({plugin, data = undefined, handlePluginChange, handlePluginD
     const outputParams = convertReturnFormat(selectedData.schema.return);
     outputParams.type = 'Array';
     entity.outputParams = [outputParams];
-    handlePluginChange(entity, selectedData.schema.return, selectedData.uniqueName, selectedData.name, selectedData.tags);
+    handlePluginChange(entity, selectedData.uniqueName, selectedData.name, selectedData.tags);
   };
 
   const pluginSelectEvent = {
@@ -63,17 +64,6 @@ const _SkillForm = ({plugin, data = undefined, handlePluginChange, handlePluginD
     },
   };
 
-  const recursive = (params, parent, action) => {
-    params.forEach(p => {
-      if (p.type === 'Object') {
-        recursive(p.value, p, action);
-        action(p, parent);
-      } else {
-        action(p, parent);
-      }
-    });
-  };
-
   const deregisterObservables = () => {
     if (data) {
       recursive(data, null, (p) => {
@@ -150,9 +140,9 @@ const _SkillForm = ({plugin, data = undefined, handlePluginChange, handlePluginD
           >
             {plugin && plugin.id && <Row key={`pluginRow-${plugin.id}`}>
               <div className={`jade-custom-multi-select-with-slider-div item-hover ${pluginInValid ? 'jade-error-border' : ''}`}>
-            <span className={'jade-custom-multi-select-item'}>
-                {plugin?.name ?? ''}
-            </span>
+                <span className={'jade-custom-multi-select-item'}>
+                    {plugin?.name ?? ''}
+                </span>
                 {renderDeleteIcon(plugin.id)}
               </div>
             </Row>}

framework/elsa/fit-elsa-react/src/components/loopNode/SkillForm.jsx

@@ -9,7 +9,7 @@ import {ChangeFlowMetaReducer} from '@/components/common/reducers/commonReducers
 import {ChangePluginByMetaDataReducer, DeletePluginReducer, UpdateInputReducer, UpdateRadioInfoReducer} from '@/components/loopNode/reducers/reducers.js';
 import {defaultComponent} from '@/components/defaultComponent.js';
 import {v4 as uuidv4} from 'uuid';
-import {DATA_TYPES, DEFAULT_LOOP_NODE_CONTEXT, FROM_TYPE} from '@/common/Consts.js';
+import {DATA_TYPES, DEFAULT_ADD_TOOL_NODE_CONTEXT, FROM_TYPE} from '@/common/Consts.js';
 
 export const loopComponent = (jadeConfig, shape) => {
   const self = defaultComponent(jadeConfig);
@@ -50,7 +50,7 @@ export const loopComponent = (jadeConfig, shape) => {
           from: FROM_TYPE.INPUT,
           value: {},
         },
-        DEFAULT_LOOP_NODE_CONTEXT,
+        DEFAULT_ADD_TOOL_NODE_CONTEXT,
       ],
       outputParams: [],
     };

framework/elsa/fit-elsa-react/src/components/loopNode/loopComponent.jsx

@@ -8,7 +8,7 @@ import {updateInput} from '@/components/util/JadeConfigUtils.js';
 import {DEFAULT_INPUT_PARAMS} from '@/components/loopNode/LoopConsts.js';
 import {TOOL_TYPE} from '@/common/Consts.js';
 
-export const ChangePluginByMetaDataReducer = (shape) => {
+export const ChangePluginByMetaDataReducer = () => {
   const self = {};
   self.type = 'changePluginByMetaData';
 
@@ -39,19 +39,18 @@ export const ChangePluginByMetaDataReducer = (shape) => {
       }
     });
 
+    const updateToolInfo = (toolInfo = {}) => {
+      return {
+        ...toolInfo,
+        params: newConfig.inputParams?.find(param => param.name === 'args')?.value?.map(({name}) => ({name})) || [],
+        uniqueName: action.uniqueName,
+        return: { type: 'array' },
+        pluginName: action.pluginName,
+        tags: action.tags
+      };
+    };
 
-    function updateToolInfo() {
-      newToolInfo.params = newConfig.inputParams.find(param => param.name === 'args').value.map(property => {
-        return {name: property.name};
-      });
-      newToolInfo.uniqueName = action.uniqueName;
-      newToolInfo.return = {};
-      newToolInfo.return.type = 'array';
-      newToolInfo.pluginName = action.pluginName;
-      newToolInfo.tags = action.tags;
-    }
-    let newToolInfo = {};
-    updateToolInfo();
+    const newToolInfo = updateToolInfo();
 
     Object.entries(newConfig).forEach(([key, value]) => {
       if (key === 'inputParams') {
@@ -69,12 +68,9 @@ export const ChangePluginByMetaDataReducer = (shape) => {
         newConfig[key] = value;
       }
     });
-
     return newConfig;
   };
 
-
-
   return self;
 };
 
@@ -134,7 +130,6 @@ export const UpdateInputReducer = () => {
         newConfig[key] = value;
       }
     });
-
     return newConfig;
   };
 

framework/elsa/fit-elsa-react/src/components/loopNode/reducers/reducers.js

@@ -13,6 +13,7 @@ import {convertParameter, convertReturnFormat} from '@/components/util/MethodMet
 import {useTranslation} from 'react-i18next';
 import {EyeOutlined, MinusCircleOutlined} from '@ant-design/icons';
 import PropTypes from 'prop-types';
+import {recursive} from '@/components/util/ReferenceUtil.js';
 
 /**
  * 人工检查节点折叠区域组件
@@ -87,17 +88,6 @@ const _ManualCheckForm = ({form, data = undefined, handleFormChange, handleFormD
     },
   };
 
-  const recursive = (params, parent, action) => {
-    params.forEach(p => {
-      if (p.type === 'Object') {
-        recursive(p.value, p, action);
-        action(p, parent);
-      } else {
-        action(p, parent);
-      }
-    });
-  };
-
   const deregisterObservables = () => {
     if (data) {
       recursive(data, null, (p) => {