diff options
author | 2020-03-17 19:03:08 +0000 | |
---|---|---|
committer | 2020-03-17 19:03:08 +0000 | |
commit | fdbbb38dfbc907fb0ecbfe69ee53b3e58f04a323 (patch) | |
tree | 2581ff6856c5b16d46db424f9e1519d0d9a73794 /ui-react/src/components/dialogs/Policy/PolicyModal.js | |
parent | 1b4f20dfda1c5dad80640571e13de53772f2cce1 (diff) | |
parent | e18ed70c2c2475e7cb7eba74bbb3e74c47740960 (diff) |
Merge "Update policy model UI"
Diffstat (limited to 'ui-react/src/components/dialogs/Policy/PolicyModal.js')
-rw-r--r-- | ui-react/src/components/dialogs/Policy/PolicyModal.js | 66 |
1 files changed, 65 insertions, 1 deletions
diff --git a/ui-react/src/components/dialogs/Policy/PolicyModal.js b/ui-react/src/components/dialogs/Policy/PolicyModal.js index 428e443cf..8b49d9150 100644 --- a/ui-react/src/components/dialogs/Policy/PolicyModal.js +++ b/ui-react/src/components/dialogs/Policy/PolicyModal.js @@ -30,7 +30,9 @@ import Select from 'react-select'; import Modal from 'react-bootstrap/Modal'; import styled from 'styled-components'; import LoopService from '../../../api/LoopService'; +import LoopCache from '../../../api/LoopCache'; import JSONEditor from '@json-editor/json-editor'; +import Alert from 'react-bootstrap/Alert'; const ModalStyled = styled(Modal)` background-color: transparent; @@ -49,7 +51,9 @@ export default class PolicyModal extends React.Component { pdpGroupList: [], pdpSubgroupList: [], chosenPdpGroup: '', - chosenPdpSubgroup: '' + chosenPdpSubgroup: '', + showSucAlert: false, + showFailAlert: false }; constructor(props, context) { @@ -60,6 +64,8 @@ export default class PolicyModal extends React.Component { this.handlePdpGroupChange = this.handlePdpGroupChange.bind(this); this.handlePdpSubgroupChange = this.handlePdpSubgroupChange.bind(this); this.createJsonEditor = this.createJsonEditor.bind(this); + this.handleRefresh = this.handleRefresh.bind(this); + this.disableAlert = this.disableAlert.bind(this); } handleSave() { @@ -195,12 +201,67 @@ export default class PolicyModal extends React.Component { this.setState({ chosenPdpSubgroup: e.value }); } + handleRefresh() { + var newLoopCache, toscaModel, editorData; + if (this.state.policyInstanceType === 'MICRO-SERVICE-POLICY') { + LoopService.refreshMicroServicePolicyJson(this.state.loopCache.getLoopName(),this.state.policyName).then(data => { + newLoopCache = new LoopCache(data); + toscaModel = newLoopCache.getMicroServiceJsonRepresentationForName(this.state.policyName); + editorData = newLoopCache.getMicroServicePropertiesForName(this.state.policyName); + document.getElementById("editor").innerHTML = ""; + this.setState({ + loopCache: newLoopCache, + jsonEditor: this.createJsonEditor(toscaModel,editorData), + showSucAlert: true, + showMessage: "Successfully refreshed" + }); + }) + .catch(error => { + console.error("Error while refreshing the Operational Policy Json Representation"); + this.setState({ + showFailAlert: true, + showMessage: "Refreshing of UI failed" + }); + }); + } else if (this.state.policyInstanceType === 'OPERATIONAL-POLICY') { + LoopService.refreshOperationalPolicyJson(this.state.loopCache.getLoopName(),this.state.policyName).then(data => { + var newLoopCache = new LoopCache(data); + toscaModel = newLoopCache.getOperationalPolicyJsonRepresentationForName(this.state.policyName); + editorData = newLoopCache.getOperationalPolicyPropertiesForName(this.state.policyName); + document.getElementById("editor").innerHTML = ""; + this.setState({ + loopCache: newLoopCache, + jsonEditor: this.createJsonEditor(toscaModel,editorData), + showSucAlert: true, + showMessage: "Successfully refreshed" + }); + }) + .catch(error => { + console.error("Error while refreshing the Operational Policy Json Representation"); + this.setState({ + showFailAlert: true, + showMessage: "Refreshing of UI failed" + }); + }); + } + } + + disableAlert() { + this.setState ({ showSucAlert: false, showFailAlert: false }); + } + render() { return ( <ModalStyled size="xl" show={this.state.show} onHide={this.handleClose}> <Modal.Header closeButton> <Modal.Title>Edit the policy</Modal.Title> </Modal.Header> + <Alert variant="success" show={this.state.showSucAlert} onClose={this.disableAlert} dismissible> + {this.state.showMessage} + </Alert> + <Alert variant="danger" show={this.state.showFailAlert} onClose={this.disableAlert} dismissible> + {this.state.showMessage} + </Alert> <Modal.Body> <div id="editor" /> <Form.Group as={Row} controlId="formPlaintextEmail"> @@ -220,6 +281,9 @@ export default class PolicyModal extends React.Component { <Button variant="primary" onClick={this.handleSave}> Save Changes </Button> + <Button variant="primary" onClick={this.handleRefresh}> + Refresh + </Button> </Modal.Footer> </ModalStyled> |