diff --git a/app/javascript/components/automate-method-form/automateModal.jsx b/app/javascript/components/automate-method-form/automateModal.jsx
index 00063a46a4d..08f15f3aaf3 100644
--- a/app/javascript/components/automate-method-form/automateModal.jsx
+++ b/app/javascript/components/automate-method-form/automateModal.jsx
@@ -1,12 +1,26 @@
-import React from 'react';
+import React, { useState } from 'react';
import { Modal } from 'carbon-components-react';
import MiqFormRenderer from '@@ddf';
-const AutomateModal = ({ isOpen, onClose, modalLabel, schema }) => {
+const AutomateModal = ({ isOpen, onClose, modalLabel, schema, callBack }) => {
+
+ const [data, setData] = useState();
+
+ const onSubmit = (values) => {
+ const formData = {
+ type:values.type,
+ selectInput: values.selectInput,
+ defaultValue: values.defaultValue,
+ }
+ console.log("data=",formData)
+ callBack(formData);
+ onClose();
+ }
return (
-
+
);
};
diff --git a/app/javascript/components/automate-method-form/index.jsx b/app/javascript/components/automate-method-form/index.jsx
index fc90ab8b0a5..c59369b926a 100644
--- a/app/javascript/components/automate-method-form/index.jsx
+++ b/app/javascript/components/automate-method-form/index.jsx
@@ -6,6 +6,8 @@ import InputParams from './method-input-parameters';
import AutomateModal from './automateModal';
import { inputParameterSchema } from './method-input-parameters/helper';
import ReactCodeMirror from './codeMirror';
+import mapper from '../../forms/mappers/componentMapper';
+import enhancedSelect from '../../helpers/enhanced-select';
const MainInfo = ({ options, selectedOption, handleSelect, ansibleSchema }) => (
@@ -24,6 +26,7 @@ const MainInfo = ({ options, selectedOption, handleSelect, ansibleSchema }) => (
const AutomateMethodForm = (props) => {
const [selectedOption, setSelectedOption] = useState(null);
const [isModalOpen, setIsModalOpen] = useState(undefined);
+ const [inputParamsFormData, setInputParamsFormData] = useState(null);
const handleSelect = (selectedItem) => {
setSelectedOption(selectedItem);
@@ -42,11 +45,19 @@ const AutomateMethodForm = (props) => {
let modalSchema;
modalSchema = isModalOpen === 'inputParameter' ? inputParameterSchema : undefined;
+ const componentMapper = {
+ ...mapper,
+ 'enhanced-select': enhancedSelect,
+ };
+
return (
<>
{selectedOption && shouldRenderForm(selectedOption) && (
-
+
)}
{selectedOption && shouldRenderForm(selectedOption) && (
<>
@@ -71,14 +82,19 @@ const AutomateMethodForm = (props) => {
>
)}
-
+
>
)}
+ schema={ modalSchema }
+ callBack={(formData) => {
+ console.log(formData);
+ setInputParamsFormData(formData);
+ }}
+ />
>
);
};
diff --git a/app/javascript/components/automate-method-form/method-input-parameters/helper.js b/app/javascript/components/automate-method-form/method-input-parameters/helper.js
index 59cf5922b71..6a7152ec13d 100644
--- a/app/javascript/components/automate-method-form/method-input-parameters/helper.js
+++ b/app/javascript/components/automate-method-form/method-input-parameters/helper.js
@@ -1,5 +1,10 @@
import { componentTypes } from '@@ddf';
+const options = [
+ { id: 'option1', name: 'Option 1', label: 'Option 1'},
+ { id: 'option2', name: 'Option 2', label: 'Option 2' },
+ { id: 'option3', name: 'Option 3', label: 'Option 3' },
+]
export const inputParameterSchema = {
fields: [
{
@@ -13,16 +18,12 @@ export const inputParameterSchema = {
id: 'selectInput',
name: 'selectInput',
label: __('Choose'),
- options: [
- { id: 'option1', text: 'Option 1' },
- { id: 'option2', text: 'Option 2' },
- { id: 'option3', text: 'Option 3' },
- ],
+ options: options,
},
{
component: componentTypes.TEXT_FIELD,
- id: 'DefaultValue',
- name: 'DefaultValue',
+ id: 'defaultValue',
+ name: 'defaultValue',
label: __('Default Value'),
},
],
diff --git a/app/javascript/components/automate-method-form/method-input-parameters/index.js b/app/javascript/components/automate-method-form/method-input-parameters/index.js
index b5e0007dcf6..f67c2056117 100644
--- a/app/javascript/components/automate-method-form/method-input-parameters/index.js
+++ b/app/javascript/components/automate-method-form/method-input-parameters/index.js
@@ -1,45 +1,28 @@
import React from 'react';
-import { DataTable } from 'carbon-components-react';
+import MiqDataTable from '../../miq-data-table';
-const InputParams = () => {
- const data = [
- { id: '1', inputName: 'username', dataType: 'string', defaultValue: 'guest', actions: 'Edit, Delete' },
- { id: '2', inputName: 'password', dataType: 'password', defaultValue: '********', actions: 'Edit, Delete' },
- ];
+const InputParams = (props) => {
+ const { formData: { defaultValue, type } } = props;
- const headers = [
+ const row = {
+ inputName: 'Input Name',
+ dataType: type,
+ defaultValue: defaultValue,
+ };
+
+ const headers = inputParams.length > 0 ? [
{ key: 'inputName', header: 'Input Name' },
{ key: 'dataType', header: 'Data Type' },
{ key: 'defaultValue', header: 'Default Value' },
- { key: 'actions', header: 'Actions' },
- ];
+ ] : [];
return (
- (
-
-
-
- {headers.map((header) => (
-
- {header.header}
- |
- ))}
-
-
-
- {rows.map((row) => (
-
- {headers.map((header) => (
- {row[header.key]} |
- ))}
-
- ))}
-
-
- )}
+ rows={[row]}
+ onCellClick={(selectedRow) => onSelect(selectedRow)}
+ mode="button-group-list"
+ isSortable={false}
/>
);
};