diff options
Diffstat (limited to 'gui-clamp')
5 files changed, 73 insertions, 18 deletions
diff --git a/gui-clamp/ui-react/src/api/ACMService.js b/gui-clamp/ui-react/src/api/ACMService.js index 405d222..393741f 100644 --- a/gui-clamp/ui-react/src/api/ACMService.js +++ b/gui-clamp/ui-react/src/api/ACMService.js @@ -27,7 +27,7 @@ export default class ACMService { return response } - static async createInstanceProperties(instanceName, instancePropertiesTemplate) { + static async createInstanceProperties(instancePropertiesTemplate) { const response = await fetch(window.location.pathname + 'restservices/clds/v2/acm/postToscaInstanceProperties', { diff --git a/gui-clamp/ui-react/src/components/dialogs/ACM/InstancePropertiesModal.js b/gui-clamp/ui-react/src/components/dialogs/ACM/InstancePropertiesModal.js index 8d0023b..2dc2cb3 100644 --- a/gui-clamp/ui-react/src/components/dialogs/ACM/InstancePropertiesModal.js +++ b/gui-clamp/ui-react/src/components/dialogs/ACM/InstancePropertiesModal.js @@ -25,6 +25,8 @@ import ACMService from "../../../api/ACMService"; import Alert from "react-bootstrap/Alert"; import * as PropTypes from "prop-types"; import InstantiationUtils from "./utils/InstantiationUtils"; +import Row from "react-bootstrap/Row"; +import Form from "react-bootstrap/Form"; const ModalStyled = styled(Modal)` @media (min-width: 800px) { @@ -66,6 +68,8 @@ const InstancePropertiesModal = (props) => { const [instanceName, setInstanceName] = useState('') useEffect(async () => { + setJsonEditor(null); + const toscaTemplateResponse = await ACMService.getToscaTemplate(templateName, templateVersion) .catch(error => error.message); @@ -100,27 +104,44 @@ const InstancePropertiesModal = (props) => { props.history.push('/'); } + const handleInstanceName = (event) => { + console.log('handleInstanceName called'); + + setInstanceName(event.target.value); + } + const handleSave = async () => { console.log("handleSave called"); + if (instanceName !== '' || instanceName.length > 0) { - setInstanceName(instanceName); + console.log("instanceName to be saved is: " + instanceName); - console.log("instanceName to be saved is: " + instanceName); + if (jsonEditor != null) { + setToscaFullTemplate(InstantiationUtils.updateTemplate(instanceName, jsonEditor.getValue(), toscaFullTemplate)); + } - if (jsonEditor != null) { - setToscaFullTemplate(InstantiationUtils.updateTemplate(jsonEditor.getValue(), toscaFullTemplate)); - } + const response = await ACMService.createInstanceProperties(toscaFullTemplate) + .catch(error => error.message); - const response = await ACMService.createInstanceProperties(instanceName, toscaFullTemplate) - .catch(error => error.message); - - if (response.ok) { - successAlert(); + if (response.ok) { + successAlert(); + } else { + await errorAlert(response); + } } else { - await errorAlert(response); + await warningAlert(); } } + const warningAlert = async () => { + console.log("warningAlert called"); + setAlertMessage(<Alert variant="warning"> + <Alert.Heading>Instantiation Properties Warning</Alert.Heading> + <p>Instance name cannot be empty</p> + <hr/> + </Alert>); + } + const successAlert = () => { console.log("successAlert called"); setAlertMessage(<Alert variant="success"> @@ -152,6 +173,13 @@ const InstancePropertiesModal = (props) => { </Modal.Header> <div style={ { padding: '5px 5px 0 5px' } }> <Modal.Body> + <Form.Group as={ Row } controlId="formPlaintextEmail"> + <Form.Label column sm="2">Instance Name:</Form.Label> + <input sm="5" type="text" style={ { width: '50%' } } + value={ instanceName } + onChange={ handleInstanceName } + /> + </Form.Group> <div id="editor"/> <AlertStyled show={ !serviceTemplateResponseOk } variant="danger">Can't get service template:<br/>{ JSON.stringify(toscaFullTemplate, null, 2) }</AlertStyled> diff --git a/gui-clamp/ui-react/src/components/dialogs/ACM/InstantiationManagementModal.js b/gui-clamp/ui-react/src/components/dialogs/ACM/InstantiationManagementModal.js index 78c2685..4b97748 100644 --- a/gui-clamp/ui-react/src/components/dialogs/ACM/InstantiationManagementModal.js +++ b/gui-clamp/ui-react/src/components/dialogs/ACM/InstantiationManagementModal.js @@ -56,8 +56,6 @@ const InstantiationManagementModal = (props) => { const instantiationListJson = await response.json(); - console.log(instantiationListJson); - const parsedInstantiationList = InstantiationUtils.parseInstantiationList(instantiationListJson['automationCompositionList']); setInstantiationList(parsedInstantiationList); @@ -74,8 +72,6 @@ const InstantiationManagementModal = (props) => { const deleteInstantiationHandler = async (index, instantiation) => { console.log("deleteInstantiationHandler called"); - console.log(instantiation); - if (instantiation.disableDelete) { return; } diff --git a/gui-clamp/ui-react/src/components/dialogs/ACM/__snapshots__/InstancePropertiesModal.test.js.snap b/gui-clamp/ui-react/src/components/dialogs/ACM/__snapshots__/InstancePropertiesModal.test.js.snap index d655b08..a4fea2a 100644 --- a/gui-clamp/ui-react/src/components/dialogs/ACM/__snapshots__/InstancePropertiesModal.test.js.snap +++ b/gui-clamp/ui-react/src/components/dialogs/ACM/__snapshots__/InstancePropertiesModal.test.js.snap @@ -24,6 +24,37 @@ exports[`Verify InstancePropertiesModal renders correctly 1`] = ` } > <ModalBody> + <FormGroup + as={ + Object { + "$$typeof": Symbol(react.forward_ref), + "defaultProps": Object { + "noGutters": false, + }, + "render": [Function], + } + } + controlId="formPlaintextEmail" + > + <FormLabel + column={true} + sm="2" + srOnly={false} + > + Instance Name: + </FormLabel> + <input + onChange={[Function]} + sm="5" + style={ + Object { + "width": "50%", + } + } + type="text" + value="" + /> + </FormGroup> <div id="editor" /> diff --git a/gui-clamp/ui-react/src/components/dialogs/ACM/utils/InstantiationUtils.js b/gui-clamp/ui-react/src/components/dialogs/ACM/utils/InstantiationUtils.js index aaaa1bd..f430b32 100644 --- a/gui-clamp/ui-react/src/components/dialogs/ACM/utils/InstantiationUtils.js +++ b/gui-clamp/ui-react/src/components/dialogs/ACM/utils/InstantiationUtils.js @@ -24,7 +24,6 @@ import { JSONEditor } from "@json-editor/json-editor"; const InstantiationUtils = { parseInstantiationList: (acmList) => { - console.log(acmList); const parsedAcmList = []; acmList.map((instance, index) => { @@ -156,7 +155,7 @@ const InstantiationUtils = { }); }, - updateTemplate: (jsonEditorValues, fullTemplate) => { + updateTemplate: (instanceName, jsonEditorValues, fullTemplate) => { const nodeTemplates = fullTemplate.topology_template.node_templates; const instanceDataProperties = Object.entries(jsonEditorValues); @@ -168,6 +167,7 @@ const InstantiationUtils = { }); fullTemplate.topology_template.node_templates = nodeTemplates; + fullTemplate.name = instanceName; return fullTemplate; } |