From 7fdf733a64670fceefc3ded35cfa581e1c458179 Mon Sep 17 00:00:00 2001 From: Einav Weiss Keidar Date: Tue, 20 Mar 2018 14:45:40 +0200 Subject: Adding Prettier and fixing up eslint version Issue-ID: SDC-1094 Change-Id: Ie83ad95a03899345dd90235daf0323cbe3bc6afd Signed-off-by: Einav Weiss Keidar --- .../components/network/NICCreation/NICCreation.js | 66 +++-- .../network/NICCreation/NICCreationActionHelper.js | 54 ++-- .../network/NICCreation/NICCreationReducer.js | 65 +++-- .../network/NICCreation/NICCreationView.jsx | 217 ++++++++------ .../network/SoftwareProductComponentsNICEditor.js | 125 +++++--- .../SoftwareProductComponentsNICEditorReducer.js | 62 ++-- .../SoftwareProductComponentsNICEditorView.jsx | 147 +++++++--- .../SoftwareProductComponentsNICListReducer.js | 26 +- ...SoftwareProductComponentsNetworkActionHelper.js | 300 +++++++++++++------- .../SoftwareProductComponentsNetworkConstants.js | 26 +- .../SoftwareProductComponentsNetworkList.js | 179 +++++++----- .../SoftwareProductComponentsNetworkListView.jsx | 313 +++++++++++++-------- .../network/nicEditorComponents/Acceptable.jsx | 142 ++++++---- .../network/nicEditorComponents/FlowLength.jsx | 22 +- .../network/nicEditorComponents/InFlowTraffic.jsx | 22 +- .../network/nicEditorComponents/IpConfig.jsx | 52 ++-- .../network/nicEditorComponents/NameAndPurpose.jsx | 70 +++-- .../network/nicEditorComponents/Network.jsx | 110 ++++---- .../network/nicEditorComponents/OutFlowTraffic.jsx | 22 +- .../network/nicEditorComponents/PacketsBytes.jsx | 93 +++--- .../network/nicEditorComponents/Protocols.jsx | 120 +++++--- .../network/nicEditorComponents/Sizing.jsx | 41 ++- 22 files changed, 1397 insertions(+), 877 deletions(-) (limited to 'openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network') diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreation.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreation.js index d4aaf7cc7e..e705618a65 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreation.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreation.js @@ -13,39 +13,55 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import {connect} from 'react-redux'; +import { connect } from 'react-redux'; import NICCreationActionHelper from './NICCreationActionHelper.js'; import NICCreationView from './NICCreationView.jsx'; import SoftwareProductComponentsNetworkActionHelper from '../SoftwareProductComponentsNetworkActionHelper.js'; -import {networkTypes, NIC_CREATION_FORM_NAME} from '../SoftwareProductComponentsNetworkConstants.js'; +import { + networkTypes, + NIC_CREATION_FORM_NAME +} from '../SoftwareProductComponentsNetworkConstants.js'; import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js'; -export const mapStateToProps = ({softwareProduct}) => { - let {softwareProductEditor: {data:currentSoftwareProduct = {}}, softwareProductComponents} = softwareProduct; - let {network: {nicCreation = {}}} = softwareProductComponents; - let {data, genericFieldInfo, formReady} = nicCreation; - data = {...data, networkType: networkTypes.EXTERNAL}; - let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo); +export const mapStateToProps = ({ softwareProduct }) => { + let { + softwareProductEditor: { data: currentSoftwareProduct = {} }, + softwareProductComponents + } = softwareProduct; + let { network: { nicCreation = {} } } = softwareProductComponents; + let { data, genericFieldInfo, formReady } = nicCreation; + data = { ...data, networkType: networkTypes.EXTERNAL }; + let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo); - return { - currentSoftwareProduct, - data, - genericFieldInfo, - isFormValid, - formReady - }; + return { + currentSoftwareProduct, + data, + genericFieldInfo, + isFormValid, + formReady + }; }; -const mapActionsToProps = (dispatch, {softwareProductId, version}) => { - return { - onDataChanged: deltaData => ValidationHelper.dataChanged(dispatch, {deltaData, formName: NIC_CREATION_FORM_NAME}), - onCancel: () => NICCreationActionHelper.close(dispatch), - onSubmit: ({nic, componentId}) => { - SoftwareProductComponentsNetworkActionHelper.createNIC(dispatch, {nic, softwareProductId, componentId, version}); - NICCreationActionHelper.close(dispatch); - }, - onValidateForm: () => ValidationHelper.validateForm(dispatch, NIC_CREATION_FORM_NAME) - }; +const mapActionsToProps = (dispatch, { softwareProductId, version }) => { + return { + onDataChanged: deltaData => + ValidationHelper.dataChanged(dispatch, { + deltaData, + formName: NIC_CREATION_FORM_NAME + }), + onCancel: () => NICCreationActionHelper.close(dispatch), + onSubmit: ({ nic, componentId }) => { + SoftwareProductComponentsNetworkActionHelper.createNIC(dispatch, { + nic, + softwareProductId, + componentId, + version + }); + NICCreationActionHelper.close(dispatch); + }, + onValidateForm: () => + ValidationHelper.validateForm(dispatch, NIC_CREATION_FORM_NAME) + }; }; export default connect(mapStateToProps, mapActionsToProps)(NICCreationView); diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationActionHelper.js index a40b32d51a..4f200ce33f 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationActionHelper.js @@ -13,35 +13,37 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import {actionTypes} from '../SoftwareProductComponentsNetworkConstants'; +import { actionTypes } from '../SoftwareProductComponentsNetworkConstants'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import {actionTypes as modalActionTypes} from 'nfvo-components/modal/GlobalModalConstants.js'; -import {modalContentMapper} from 'sdc-app/common/modal/ModalContentMapper.js'; +import { actionTypes as modalActionTypes } from 'nfvo-components/modal/GlobalModalConstants.js'; +import { modalContentMapper } from 'sdc-app/common/modal/ModalContentMapper.js'; export default { + open( + dispatch, + { softwareProductId, componentId, modalClassName, version } + ) { + dispatch({ + type: actionTypes.NICCreation.OPEN + }); - open(dispatch, {softwareProductId, componentId, modalClassName, version}) { - dispatch({ - type: actionTypes.NICCreation.OPEN - }); + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_SHOW, + data: { + modalComponentName: modalContentMapper.NIC_CREATION, + title: i18n('Create NEW NIC'), + modalClassName, + modalComponentProps: { softwareProductId, componentId, version } + } + }); + }, - dispatch({ - type: modalActionTypes.GLOBAL_MODAL_SHOW, - data: { - modalComponentName: modalContentMapper.NIC_CREATION, - title: i18n('Create NEW NIC'), - modalClassName, - modalComponentProps: {softwareProductId, componentId, version} - } - }); - }, - - close(dispatch){ - dispatch({ - type: modalActionTypes.GLOBAL_MODAL_CLOSE - }); - dispatch({ - type: actionTypes.NICCreation.CLEAR_DATA - }); - } + close(dispatch) { + dispatch({ + type: modalActionTypes.GLOBAL_MODAL_CLOSE + }); + dispatch({ + type: actionTypes.NICCreation.CLEAR_DATA + }); + } }; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationReducer.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationReducer.js index c7e2495b3d..8309c40451 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationReducer.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationReducer.js @@ -13,37 +13,40 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import {actionTypes, NIC_CREATION_FORM_NAME} from '../SoftwareProductComponentsNetworkConstants.js'; +import { + actionTypes, + NIC_CREATION_FORM_NAME +} from '../SoftwareProductComponentsNetworkConstants.js'; export default (state = {}, action) => { - switch (action.type) { - case actionTypes.NICCreation.OPEN: - return { - ...state, - data: {}, - formName: NIC_CREATION_FORM_NAME, - formReady: null, - genericFieldInfo: { - 'description' : { - isValid: true, - errorText: '', - validations: [{type: 'maxLength', data: 1000}] - }, - 'name' : { - isValid: true, - errorText: '', - validations: [{type: 'required', data : true}] - }, - 'networkDescription' : { - isValid: true, - errorText: '', - validations: [{type: 'maxLength', data: 50}] - } - } - }; - case actionTypes.NICCreation.CLEAR_DATA: - return {}; - default: - return state; - } + switch (action.type) { + case actionTypes.NICCreation.OPEN: + return { + ...state, + data: {}, + formName: NIC_CREATION_FORM_NAME, + formReady: null, + genericFieldInfo: { + description: { + isValid: true, + errorText: '', + validations: [{ type: 'maxLength', data: 1000 }] + }, + name: { + isValid: true, + errorText: '', + validations: [{ type: 'required', data: true }] + }, + networkDescription: { + isValid: true, + errorText: '', + validations: [{ type: 'maxLength', data: 50 }] + } + } + }; + case actionTypes.NICCreation.CLEAR_DATA: + return {}; + default: + return state; + } }; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationView.jsx index 258876844a..88525c051d 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/NICCreation/NICCreationView.jsx @@ -22,103 +22,136 @@ import GridSection from 'nfvo-components/grid/GridSection.jsx'; import GridItem from 'nfvo-components/grid/GridItem.jsx'; const NICPropType = PropTypes.shape({ - id: PropTypes.string, - name: PropTypes.string, - description: PropTypes.string, - networkId: PropTypes.string + id: PropTypes.string, + name: PropTypes.string, + description: PropTypes.string, + networkId: PropTypes.string }); class NICCreationView extends React.Component { + static propTypes = { + data: NICPropType, + onDataChanged: PropTypes.func.isRequired, + onSubmit: PropTypes.func.isRequired, + onCancel: PropTypes.func.isRequired + }; - static propTypes = { - data: NICPropType, - onDataChanged: PropTypes.func.isRequired, - onSubmit: PropTypes.func.isRequired, - onCancel: PropTypes.func.isRequired - }; + render() { + let { + data = {}, + onDataChanged, + genericFieldInfo, + isFormValid, + onValidateForm, + formReady + } = this.props; + let { name, description, networkDescription } = data; + return ( +
+ {genericFieldInfo && ( +
(this.form = form)} + hasButtons={true} + onSubmit={() => this.submit()} + submitButtonText={ + data.id ? i18n('Save') : i18n('Create') + } + onReset={() => this.props.onCancel()} + labledButtons={true} + isValid={isFormValid} + onValidateForm={() => onValidateForm()} + formReady={formReady}> + + + onDataChanged({ name })} + isRequired={true} + type="text" + isValid={genericFieldInfo['name'].isValid} + errorText={ + genericFieldInfo['name'].errorText + } + className="field-section" + /> + + onDataChanged({ description }) + } + isValid={ + genericFieldInfo['description'].isValid + } + errorText={ + genericFieldInfo['description'] + .errorText + } + type="textarea" + className="field-section" + /> + + + + +
+ +
+ + +
+
+ + + + onDataChanged({ networkDescription }) + } + isValid={ + genericFieldInfo['networkDescription'] + .isValid + } + errorText={ + genericFieldInfo['networkDescription'] + .errorText + } + type="text" + className="field-section" + /> + + +
+ )} +
+ ); + } - render() { - let {data = {}, onDataChanged, genericFieldInfo, isFormValid, onValidateForm, formReady} = this.props; - let {name, description, networkDescription} = data; - return ( -
- {genericFieldInfo &&
this.form = form} - hasButtons={true} - onSubmit={ () => this.submit() } - submitButtonText={data.id ? i18n('Save') : i18n('Create')} - onReset={ () => this.props.onCancel() } - labledButtons={true} - isValid={isFormValid} - onValidateForm={() => onValidateForm()} - formReady={formReady} > - - - onDataChanged({name})} - isRequired={true} - type='text' - isValid={genericFieldInfo['name'].isValid} - errorText={genericFieldInfo['name'].errorText} - className='field-section'/> - onDataChanged({description})} - isValid={genericFieldInfo['description'].isValid} - errorText={genericFieldInfo['description'].errorText} - type='textarea' - className='field-section'/> - - - - -
- -
- - -
-
- - - onDataChanged({networkDescription})} - isValid={genericFieldInfo['networkDescription'].isValid} - errorText={genericFieldInfo['networkDescription'].errorText} - type='text' - className='field-section'/> - - -
} -
- ); - } - - - submit() { - const {data: nic, componentId} = this.props; - this.props.onSubmit({nic, componentId}); - } + submit() { + const { data: nic, componentId } = this.props; + this.props.onSubmit({ nic, componentId }); + } } export default NICCreationView; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditor.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditor.js index 93bd0bd67e..d7205b46ed 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditor.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditor.js @@ -13,56 +13,93 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import {connect} from 'react-redux'; +import { connect } from 'react-redux'; import SoftwareProductComponentsNetworkActionHelper from './SoftwareProductComponentsNetworkActionHelper.js'; import SoftwareProductComponentsNICEditorView from './SoftwareProductComponentsNICEditorView.jsx'; import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js'; -import {forms} from 'sdc-app/onboarding/softwareProduct/components/SoftwareProductComponentsConstants.js'; -import {NIC_QUESTIONNAIRE} from 'sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkConstants.js'; -import {onboardingMethod as onboardingMethodTypes} from '../../SoftwareProductConstants.js'; +import { forms } from 'sdc-app/onboarding/softwareProduct/components/SoftwareProductComponentsConstants.js'; +import { NIC_QUESTIONNAIRE } from 'sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkConstants.js'; +import { onboardingMethod as onboardingMethodTypes } from '../../SoftwareProductConstants.js'; -export const mapStateToProps = ({softwareProduct, currentScreen}) => { - - let {softwareProductEditor: {data:currentSoftwareProduct = {}, isValidityData = true}, softwareProductComponents} = softwareProduct; - let {network: {nicEditor = {}}} = softwareProductComponents; - let {data, qdata, genericFieldInfo, qgenericFieldInfo, dataMap, formReady} = nicEditor; - let {props: {isReadOnlyMode}} = currentScreen; - let {onboardingMethod} = currentSoftwareProduct; - let protocols = []; - if(qdata && qdata.protocols && qdata.protocols.protocols && qdata.protocols.protocols.length){ - protocols = qdata.protocols.protocols; - } - let {version} = currentSoftwareProduct; - let isFormValid = ValidationHelper.checkFormValid(genericFieldInfo) && ValidationHelper.checkFormValid(qgenericFieldInfo); - - return { - currentSoftwareProduct, - isValidityData, - version, - data, - qdata, - dataMap, - isFormValid, - formReady, - genericFieldInfo, - qgenericFieldInfo, - isReadOnlyMode, - protocols, - isManual: onboardingMethod === onboardingMethodTypes.MANUAL - }; +export const mapStateToProps = ({ softwareProduct, currentScreen }) => { + let { + softwareProductEditor: { + data: currentSoftwareProduct = {}, + isValidityData = true + }, + softwareProductComponents + } = softwareProduct; + let { network: { nicEditor = {} } } = softwareProductComponents; + let { + data, + qdata, + genericFieldInfo, + qgenericFieldInfo, + dataMap, + formReady + } = nicEditor; + let { props: { isReadOnlyMode } } = currentScreen; + let { onboardingMethod } = currentSoftwareProduct; + let protocols = []; + if ( + qdata && + qdata.protocols && + qdata.protocols.protocols && + qdata.protocols.protocols.length + ) { + protocols = qdata.protocols.protocols; + } + let { version } = currentSoftwareProduct; + let isFormValid = + ValidationHelper.checkFormValid(genericFieldInfo) && + ValidationHelper.checkFormValid(qgenericFieldInfo); + return { + currentSoftwareProduct, + isValidityData, + version, + data, + qdata, + dataMap, + isFormValid, + formReady, + genericFieldInfo, + qgenericFieldInfo, + isReadOnlyMode, + protocols, + isManual: onboardingMethod === onboardingMethodTypes.MANUAL + }; }; -const mapActionsToProps = (dispatch, {softwareProductId, componentId, version}) => { - return { - onDataChanged: (deltaData) => ValidationHelper.dataChanged(dispatch, {deltaData, - formName: forms.NIC_EDIT_FORM}), - onSubmit: ({data, qdata}) => SoftwareProductComponentsNetworkActionHelper.saveNICDataAndQuestionnaire(dispatch, {softwareProductId, version, componentId, data, qdata}), - onCancel: () => SoftwareProductComponentsNetworkActionHelper.closeNICEditor(dispatch), - onValidateForm: () => ValidationHelper.validateForm(dispatch, forms.NIC_EDIT_FORM), - onQDataChanged: (deltaData) => ValidationHelper.qDataChanged(dispatch, {deltaData, - qName: NIC_QUESTIONNAIRE}), - }; +const mapActionsToProps = ( + dispatch, + { softwareProductId, componentId, version } +) => { + return { + onDataChanged: deltaData => + ValidationHelper.dataChanged(dispatch, { + deltaData, + formName: forms.NIC_EDIT_FORM + }), + onSubmit: ({ data, qdata }) => + SoftwareProductComponentsNetworkActionHelper.saveNICDataAndQuestionnaire( + dispatch, + { softwareProductId, version, componentId, data, qdata } + ), + onCancel: () => + SoftwareProductComponentsNetworkActionHelper.closeNICEditor( + dispatch + ), + onValidateForm: () => + ValidationHelper.validateForm(dispatch, forms.NIC_EDIT_FORM), + onQDataChanged: deltaData => + ValidationHelper.qDataChanged(dispatch, { + deltaData, + qName: NIC_QUESTIONNAIRE + }) + }; }; -export default connect(mapStateToProps, mapActionsToProps)(SoftwareProductComponentsNICEditorView); +export default connect(mapStateToProps, mapActionsToProps)( + SoftwareProductComponentsNICEditorView +); diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditorReducer.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditorReducer.js index dd37135d77..2da9b4b76b 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditorReducer.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditorReducer.js @@ -13,37 +13,37 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import {actionTypes} from './SoftwareProductComponentsNetworkConstants.js'; -import {forms} from 'sdc-app/onboarding/softwareProduct/components/SoftwareProductComponentsConstants.js'; +import { actionTypes } from './SoftwareProductComponentsNetworkConstants.js'; +import { forms } from 'sdc-app/onboarding/softwareProduct/components/SoftwareProductComponentsConstants.js'; export default (state = {}, action) => { - switch (action.type) { - case actionTypes.NICEditor.FILL_DATA: - return { - ...state, - data: action.nic, - genericFieldInfo: { - 'description' : { - isValid: true, - errorText: '', - validations: [] - }, - 'name' : { - isValid: true, - errorText: '', - validations: [{type: 'required', data : true}] - }, - 'networkDescription' : { - isValid: true, - errorText: '', - validations: [] - } - }, - formName: forms.NIC_EDIT_FORM - }; - case actionTypes.NICEditor.CLEAR_DATA: - return {}; - default: - return state; - } + switch (action.type) { + case actionTypes.NICEditor.FILL_DATA: + return { + ...state, + data: action.nic, + genericFieldInfo: { + description: { + isValid: true, + errorText: '', + validations: [] + }, + name: { + isValid: true, + errorText: '', + validations: [{ type: 'required', data: true }] + }, + networkDescription: { + isValid: true, + errorText: '', + validations: [] + } + }, + formName: forms.NIC_EDIT_FORM + }; + case actionTypes.NICEditor.CLEAR_DATA: + return {}; + default: + return state; + } }; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditorView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditorView.jsx index fbb3d53033..df2efbe39e 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditorView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditorView.jsx @@ -26,48 +26,113 @@ import Protocols from './nicEditorComponents/Protocols.jsx'; import NameAndPurpose from './nicEditorComponents/NameAndPurpose.jsx'; class SoftwareProductComponentsNetworkEditorView extends React.Component { + render() { + let { + onCancel, + onValidateForm, + isReadOnlyMode, + isFormValid, + formReady, + data = {}, + qgenericFieldInfo, + dataMap, + onDataChanged, + protocols, + onQDataChanged, + isManual, + genericFieldInfo + } = this.props; + let { + name, + description, + networkName, + networkType, + networkDescription + } = data; + let netWorkValues = [ + { + enum: networkName, + title: networkName + } + ]; + return ( +
+ {qgenericFieldInfo && ( +
{ + this.form = form; + }} + hasButtons={true} + onSubmit={() => this.submit()} + onReset={() => onCancel()} + labledButtons={true} + isReadOnlyMode={isReadOnlyMode} + isValid={isFormValid} + formReady={formReady} + onValidateForm={() => onValidateForm()} + className="vsp-components-network-editor"> +
+ + + + + + + + + +
+
+ )} +
+ ); + } - render() { - let {onCancel, onValidateForm, isReadOnlyMode, isFormValid, formReady, data = {}, qgenericFieldInfo, - dataMap, onDataChanged, protocols, onQDataChanged, isManual, genericFieldInfo} = this.props; - let {name, description, networkName, networkType, networkDescription} = data; - let netWorkValues = [{ - enum: networkName, - title: networkName - }]; - return ( -
- {qgenericFieldInfo &&
{ this.form = form; }} - hasButtons={true} - onSubmit={ () => this.submit() } - onReset={ () => onCancel() } - labledButtons={true} - isReadOnlyMode={isReadOnlyMode} - isValid={isFormValid} - formReady={formReady} - onValidateForm={() => onValidateForm() } - className='vsp-components-network-editor'> -
- - - - - - - - - -
-
} -
- ); - } - - submit() { - let {data, qdata, onSubmit} = this.props; - onSubmit({data, qdata}); - } + submit() { + let { data, qdata, onSubmit } = this.props; + onSubmit({ data, qdata }); + } } export default SoftwareProductComponentsNetworkEditorView; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICListReducer.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICListReducer.js index 5cfc88bdc9..a2e65142a2 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICListReducer.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICListReducer.js @@ -13,16 +13,22 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import {actionTypes} from './SoftwareProductComponentsNetworkConstants.js'; +import { actionTypes } from './SoftwareProductComponentsNetworkConstants.js'; export default (state = [], action) => { - switch (action.type) { - case actionTypes.NIC_LIST_UPDATE: - return [...action.response]; - case actionTypes.NIC_LIST_EDIT: - const indexForEdit = state.findIndex(nic => nic.id === action.nic.id); - return [...state.slice(0, indexForEdit), action.nic, ...state.slice(indexForEdit + 1)]; - default: - return state; - } + switch (action.type) { + case actionTypes.NIC_LIST_UPDATE: + return [...action.response]; + case actionTypes.NIC_LIST_EDIT: + const indexForEdit = state.findIndex( + nic => nic.id === action.nic.id + ); + return [ + ...state.slice(0, indexForEdit), + action.nic, + ...state.slice(indexForEdit + 1) + ]; + default: + return state; + } }; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkActionHelper.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkActionHelper.js index 1ffbc5919f..58c816134b 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkActionHelper.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkActionHelper.js @@ -17,127 +17,223 @@ import RestAPIUtil from 'nfvo-utils/RestAPIUtil.js'; import Configuration from 'sdc-app/config/Configuration.js'; import i18n from 'nfvo-utils/i18n/i18n.js'; -import {actionTypes} from './SoftwareProductComponentsNetworkConstants.js'; -import {actionTypes as GlobalModalActions} from 'nfvo-components/modal/GlobalModalConstants.js'; -import {modalContentMapper as modalPagesMapper} from 'sdc-app/common/modal/ModalContentMapper.js'; +import { actionTypes } from './SoftwareProductComponentsNetworkConstants.js'; +import { actionTypes as GlobalModalActions } from 'nfvo-components/modal/GlobalModalConstants.js'; +import { modalContentMapper as modalPagesMapper } from 'sdc-app/common/modal/ModalContentMapper.js'; import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js'; -import {NIC_QUESTIONNAIRE} from 'sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkConstants.js'; +import { NIC_QUESTIONNAIRE } from 'sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkConstants.js'; function baseUrl(softwareProductId, version, componentId) { - const versionId = version.id; - const restPrefix = Configuration.get('restPrefix'); - return `${restPrefix}/v1.0/vendor-software-products/${softwareProductId}/versions/${versionId}/components/${componentId}/nics`; + const versionId = version.id; + const restPrefix = Configuration.get('restPrefix'); + return `${restPrefix}/v1.0/vendor-software-products/${softwareProductId}/versions/${versionId}/components/${componentId}/nics`; } -function createNIC({nic, vspId, componentId, version}) { - return RestAPIUtil.post(baseUrl(vspId, version, componentId), { - name: nic.name, - description: nic.description, - networkDescription: nic.networkDescription, - networkType: nic.networkType - }); +function createNIC({ nic, vspId, componentId, version }) { + return RestAPIUtil.post(baseUrl(vspId, version, componentId), { + name: nic.name, + description: nic.description, + networkDescription: nic.networkDescription, + networkType: nic.networkType + }); } -function fetchNICQuestionnaire({softwareProductId, version, componentId, nicId}) { - return RestAPIUtil.fetch(`${baseUrl(softwareProductId, version, componentId)}/${nicId}/questionnaire`); +function fetchNICQuestionnaire({ + softwareProductId, + version, + componentId, + nicId +}) { + return RestAPIUtil.fetch( + `${baseUrl( + softwareProductId, + version, + componentId + )}/${nicId}/questionnaire` + ); } -function fetchNIC({softwareProductId, version, componentId, nicId}) { - return RestAPIUtil.fetch(`${baseUrl(softwareProductId, version, componentId)}/${nicId}`); +function fetchNIC({ softwareProductId, version, componentId, nicId }) { + return RestAPIUtil.fetch( + `${baseUrl(softwareProductId, version, componentId)}/${nicId}` + ); } -function fetchNICsList({softwareProductId, version, componentId}) { - return RestAPIUtil.fetch(`${baseUrl(softwareProductId, version, componentId)}`); +function fetchNICsList({ softwareProductId, version, componentId }) { + return RestAPIUtil.fetch( + `${baseUrl(softwareProductId, version, componentId)}` + ); } -function deleteNIC({softwareProductId, componentId, nicId, version}) { - return RestAPIUtil.destroy(`${baseUrl(softwareProductId, version, componentId)}/${nicId}`); +function deleteNIC({ softwareProductId, componentId, nicId, version }) { + return RestAPIUtil.destroy( + `${baseUrl(softwareProductId, version, componentId)}/${nicId}` + ); } -function saveNIC({softwareProductId, version, componentId, nic: {id, name, description, networkId, networkType, networkDescription}}) { - return RestAPIUtil.put(`${baseUrl(softwareProductId, version, componentId)}/${id}`,{ - name, - description, - networkId, - networkDescription, - networkType - }); +function saveNIC({ + softwareProductId, + version, + componentId, + nic: { id, name, description, networkId, networkType, networkDescription } +}) { + return RestAPIUtil.put( + `${baseUrl(softwareProductId, version, componentId)}/${id}`, + { + name, + description, + networkId, + networkDescription, + networkType + } + ); } -function saveNICQuestionnaire({softwareProductId, version, componentId, nicId, qdata}) { - return RestAPIUtil.put(`${baseUrl(softwareProductId, version, componentId)}/${nicId}/questionnaire`, qdata); +function saveNICQuestionnaire({ + softwareProductId, + version, + componentId, + nicId, + qdata +}) { + return RestAPIUtil.put( + `${baseUrl( + softwareProductId, + version, + componentId + )}/${nicId}/questionnaire`, + qdata + ); } const SoftwareProductComponentNetworkActionHelper = { - - fetchNICsList(dispatch, {softwareProductId, version, componentId}) { - return fetchNICsList({softwareProductId, version, componentId}).then((response) => { - dispatch({ - type: actionTypes.NIC_LIST_UPDATE, - response: response.results - }); - }); - }, - - openNICEditor(dispatch, {nic = {}, data = {}, softwareProductId, componentId, isReadOnlyMode, modalClassName, version}) { - dispatch({ - type: actionTypes.NICEditor.FILL_DATA, - nic: {...data, id: nic.id} - }); - dispatch({ - type: GlobalModalActions.GLOBAL_MODAL_SHOW, - data: { - modalClassName, - modalComponentProps: {softwareProductId, componentId, isReadOnlyMode, version}, - modalComponentName: modalPagesMapper.NIC_EDITOR, - title: i18n('Edit NIC') - } - }); - }, - - closeNICEditor(dispatch) { - dispatch({ - type: GlobalModalActions.GLOBAL_MODAL_CLOSE - }); - dispatch({ - type: actionTypes.NICEditor.CLEAR_DATA - }); - }, - - createNIC(dispatch, {nic, softwareProductId, componentId, version}){ - return createNIC({nic, vspId: softwareProductId, componentId, version}).then(() => { - return SoftwareProductComponentNetworkActionHelper.fetchNICsList(dispatch, {softwareProductId, componentId, version}); - }); - }, - loadNICData({softwareProductId, version, componentId, nicId}) { - return fetchNIC({softwareProductId, version, componentId, nicId}); - }, - - deleteNIC(dispatch, {softwareProductId, componentId, nicId, version}) { - return deleteNIC({softwareProductId, componentId, nicId, version}).then(() => { - return SoftwareProductComponentNetworkActionHelper.fetchNICsList(dispatch, {softwareProductId, componentId, version}); - }); - }, - loadNICQuestionnaire(dispatch, {softwareProductId, version, componentId, nicId}) { - return fetchNICQuestionnaire({softwareProductId, version, componentId, nicId}).then((response) => { - ValidationHelper.qDataLoaded(dispatch, {qName: NIC_QUESTIONNAIRE ,response: { - qdata: response.data ? JSON.parse(response.data) : {}, - qschema: JSON.parse(response.schema) - }}); - }); - }, - - saveNICDataAndQuestionnaire(dispatch, {softwareProductId, version, componentId, data, qdata}) { - SoftwareProductComponentNetworkActionHelper.closeNICEditor(dispatch); - return Promise.all([ - saveNICQuestionnaire({softwareProductId, version, componentId, nicId: data.id, qdata}), - saveNIC({softwareProductId, version, componentId, nic: data}).then(() => { - dispatch({ - type: actionTypes.NIC_LIST_EDIT, - nic: data - }); - }) - ]); - } + fetchNICsList(dispatch, { softwareProductId, version, componentId }) { + return fetchNICsList({ softwareProductId, version, componentId }).then( + response => { + dispatch({ + type: actionTypes.NIC_LIST_UPDATE, + response: response.results + }); + } + ); + }, + + openNICEditor( + dispatch, + { + nic = {}, + data = {}, + softwareProductId, + componentId, + isReadOnlyMode, + modalClassName, + version + } + ) { + dispatch({ + type: actionTypes.NICEditor.FILL_DATA, + nic: { ...data, id: nic.id } + }); + dispatch({ + type: GlobalModalActions.GLOBAL_MODAL_SHOW, + data: { + modalClassName, + modalComponentProps: { + softwareProductId, + componentId, + isReadOnlyMode, + version + }, + modalComponentName: modalPagesMapper.NIC_EDITOR, + title: i18n('Edit NIC') + } + }); + }, + + closeNICEditor(dispatch) { + dispatch({ + type: GlobalModalActions.GLOBAL_MODAL_CLOSE + }); + dispatch({ + type: actionTypes.NICEditor.CLEAR_DATA + }); + }, + + createNIC(dispatch, { nic, softwareProductId, componentId, version }) { + return createNIC({ + nic, + vspId: softwareProductId, + componentId, + version + }).then(() => { + return SoftwareProductComponentNetworkActionHelper.fetchNICsList( + dispatch, + { softwareProductId, componentId, version } + ); + }); + }, + loadNICData({ softwareProductId, version, componentId, nicId }) { + return fetchNIC({ softwareProductId, version, componentId, nicId }); + }, + + deleteNIC(dispatch, { softwareProductId, componentId, nicId, version }) { + return deleteNIC({ + softwareProductId, + componentId, + nicId, + version + }).then(() => { + return SoftwareProductComponentNetworkActionHelper.fetchNICsList( + dispatch, + { softwareProductId, componentId, version } + ); + }); + }, + loadNICQuestionnaire( + dispatch, + { softwareProductId, version, componentId, nicId } + ) { + return fetchNICQuestionnaire({ + softwareProductId, + version, + componentId, + nicId + }).then(response => { + ValidationHelper.qDataLoaded(dispatch, { + qName: NIC_QUESTIONNAIRE, + response: { + qdata: response.data ? JSON.parse(response.data) : {}, + qschema: JSON.parse(response.schema) + } + }); + }); + }, + + saveNICDataAndQuestionnaire( + dispatch, + { softwareProductId, version, componentId, data, qdata } + ) { + SoftwareProductComponentNetworkActionHelper.closeNICEditor(dispatch); + return Promise.all([ + saveNICQuestionnaire({ + softwareProductId, + version, + componentId, + nicId: data.id, + qdata + }), + saveNIC({ + softwareProductId, + version, + componentId, + nic: data + }).then(() => { + dispatch({ + type: actionTypes.NIC_LIST_EDIT, + nic: data + }); + }) + ]); + } }; export default SoftwareProductComponentNetworkActionHelper; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkConstants.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkConstants.js index 8ef8fe8c18..4e361bb1a9 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkConstants.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkConstants.js @@ -16,23 +16,23 @@ import keyMirror from 'nfvo-utils/KeyMirror.js'; export const actionTypes = keyMirror({ - NIC_LIST_EDIT: null, - NIC_LIST_UPDATE: null, + NIC_LIST_EDIT: null, + NIC_LIST_UPDATE: null, - NICEditor: { - FILL_DATA: null, - CLEAR_DATA: null, - }, - NICCreation: { - OPEN: null, - CLEAR_DATA: null, - DATA_CHANGED: null - }, + NICEditor: { + FILL_DATA: null, + CLEAR_DATA: null + }, + NICCreation: { + OPEN: null, + CLEAR_DATA: null, + DATA_CHANGED: null + } }); export const networkTypes = { - EXTERNAL: 'External', - INTERNAL: 'Internal' + EXTERNAL: 'External', + INTERNAL: 'Internal' }; export const NIC_QUESTIONNAIRE = 'nic'; export const NIC_CREATION_FORM_NAME = 'nicCreation'; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkList.js b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkList.js index bb256d5d41..ac708524cf 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkList.js +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkList.js @@ -13,79 +13,132 @@ * or implied. See the License for the specific language governing * permissions and limitations under the License. */ -import {connect} from 'react-redux'; +import { connect } from 'react-redux'; import i18n from 'nfvo-utils/i18n/i18n.js'; import SoftwareProductComponentsActionHelper from 'sdc-app/onboarding/softwareProduct/components/SoftwareProductComponentsActionHelper.js'; import SoftwareProductComponentsNetworkListView from './SoftwareProductComponentsNetworkListView.jsx'; import SoftwareProductComponentsNetworkActionHelper from './SoftwareProductComponentsNetworkActionHelper.js'; -import {COMPONENTS_QUESTIONNAIRE} from 'sdc-app/onboarding/softwareProduct/components/SoftwareProductComponentsConstants.js'; +import { COMPONENTS_QUESTIONNAIRE } from 'sdc-app/onboarding/softwareProduct/components/SoftwareProductComponentsConstants.js'; import ValidationHelper from 'sdc-app/common/helpers/ValidationHelper.js'; -import {actionTypes as GlobalModalActions} from 'nfvo-components/modal/GlobalModalConstants.js'; +import { actionTypes as GlobalModalActions } from 'nfvo-components/modal/GlobalModalConstants.js'; import NICCreationActionHelper from './NICCreation/NICCreationActionHelper.js'; -import {onboardingMethod as onboardingMethodTypes} from '../../SoftwareProductConstants.js'; +import { onboardingMethod as onboardingMethodTypes } from '../../SoftwareProductConstants.js'; +export const mapStateToProps = ({ softwareProduct }) => { + let { + softwareProductEditor: { + data: currentSoftwareProduct = {}, + isValidityData = true + }, + softwareProductComponents + } = softwareProduct; + let { + network: { nicList = [] }, + componentEditor: { + data: componentData, + qdata, + dataMap, + qgenericFieldInfo + } + } = softwareProductComponents; + let { version, onboardingMethod } = currentSoftwareProduct; + let isManual = onboardingMethod === onboardingMethodTypes.MANUAL; -export const mapStateToProps = ({softwareProduct}) => { - - let {softwareProductEditor: {data: currentSoftwareProduct = {}, isValidityData = true}, softwareProductComponents} = softwareProduct; - let {network: {nicList = []}, componentEditor: {data: componentData, qdata, dataMap, qgenericFieldInfo}} = softwareProductComponents; - let {version, onboardingMethod} = currentSoftwareProduct; - let isManual = onboardingMethod === onboardingMethodTypes.MANUAL; - - return { - version, - componentData, - qdata, - dataMap, - qgenericFieldInfo, - isValidityData, - nicList, - isManual - }; - + return { + version, + componentData, + qdata, + dataMap, + qgenericFieldInfo, + isValidityData, + nicList, + isManual + }; }; -const mapActionsToProps = (dispatch, {softwareProductId, componentId, version}) => { - return { - onQDataChanged: (deltaData) => ValidationHelper.qDataChanged(dispatch, {deltaData, - qName: COMPONENTS_QUESTIONNAIRE}), - onAddNic: () => NICCreationActionHelper.open(dispatch, {softwareProductId, componentId, modalClassName: 'network-nic-modal-create', version}), - onDeleteNic: (nic) => dispatch({ - type: GlobalModalActions.GLOBAL_MODAL_WARNING, - data:{ - msg: i18n('Are you sure you want to delete "{name}"?', {name: nic.name}), - onConfirmed: () => SoftwareProductComponentsNetworkActionHelper.deleteNIC(dispatch, {softwareProductId, - componentId, nicId: nic.id, version}) - } - }), - onEditNicClick: (nic, isReadOnlyMode) => { - Promise.all([ - SoftwareProductComponentsNetworkActionHelper.loadNICData({ - softwareProductId, - version, - componentId, - nicId: nic.id - }), - SoftwareProductComponentsNetworkActionHelper.loadNICQuestionnaire(dispatch, { - softwareProductId, - version, - componentId, - nicId: nic.id - }) - ]).then( - ([{data}]) => SoftwareProductComponentsNetworkActionHelper.openNICEditor(dispatch, {nic, data, - isReadOnlyMode, softwareProductId, componentId, modalClassName: 'network-nic-modal-edit', version}) - ); - }, - onSubmit: ({qdata}) => { return SoftwareProductComponentsActionHelper.updateSoftwareProductComponentQuestionnaire(dispatch, - {softwareProductId, version, - vspComponentId: componentId, - qdata}); - } - - - }; +const mapActionsToProps = ( + dispatch, + { softwareProductId, componentId, version } +) => { + return { + onQDataChanged: deltaData => + ValidationHelper.qDataChanged(dispatch, { + deltaData, + qName: COMPONENTS_QUESTIONNAIRE + }), + onAddNic: () => + NICCreationActionHelper.open(dispatch, { + softwareProductId, + componentId, + modalClassName: 'network-nic-modal-create', + version + }), + onDeleteNic: nic => + dispatch({ + type: GlobalModalActions.GLOBAL_MODAL_WARNING, + data: { + msg: i18n('Are you sure you want to delete "{name}"?', { + name: nic.name + }), + onConfirmed: () => + SoftwareProductComponentsNetworkActionHelper.deleteNIC( + dispatch, + { + softwareProductId, + componentId, + nicId: nic.id, + version + } + ) + } + }), + onEditNicClick: (nic, isReadOnlyMode) => { + Promise.all([ + SoftwareProductComponentsNetworkActionHelper.loadNICData({ + softwareProductId, + version, + componentId, + nicId: nic.id + }), + SoftwareProductComponentsNetworkActionHelper.loadNICQuestionnaire( + dispatch, + { + softwareProductId, + version, + componentId, + nicId: nic.id + } + ) + ]).then(([{ data }]) => + SoftwareProductComponentsNetworkActionHelper.openNICEditor( + dispatch, + { + nic, + data, + isReadOnlyMode, + softwareProductId, + componentId, + modalClassName: 'network-nic-modal-edit', + version + } + ) + ); + }, + onSubmit: ({ qdata }) => { + return SoftwareProductComponentsActionHelper.updateSoftwareProductComponentQuestionnaire( + dispatch, + { + softwareProductId, + version, + vspComponentId: componentId, + qdata + } + ); + } + }; }; -export default connect(mapStateToProps, mapActionsToProps, null, {withRef: true})(SoftwareProductComponentsNetworkListView); +export default connect(mapStateToProps, mapActionsToProps, null, { + withRef: true +})(SoftwareProductComponentsNetworkListView); diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkListView.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkListView.jsx index 4d460c722d..c631fb24c3 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkListView.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNetworkListView.jsx @@ -20,138 +20,203 @@ import Form from 'nfvo-components/input/validation/Form.jsx'; import ListEditorView from 'nfvo-components/listEditor/ListEditorView.jsx'; import ListEditorItemView from 'nfvo-components/listEditor/ListEditorItemView.jsx'; import ListEditorItemViewField from 'nfvo-components/listEditor/ListEditorItemViewField.jsx'; -import Input from'nfvo-components/input/validation/Input.jsx'; - +import Input from 'nfvo-components/input/validation/Input.jsx'; class SoftwareProductComponentsNetworkView extends React.Component { + state = { + localFilter: '' + }; - state = { - localFilter: '' - }; - - render() { - let {dataMap, qgenericFieldInfo, onQDataChanged, isReadOnlyMode} = this.props; - - return( -
-
-
-{ qgenericFieldInfo &&
this.save()} - isReadOnlyMode={isReadOnlyMode} - hasButtons={false}> -

{i18n('Network Capacity')}

-
-
-
- { - const selectedIndex = e.target.selectedIndex; - const val = e.target.options[selectedIndex].value; - onQDataChanged({'network/networkCapacity/protocolWithHighestTrafficProfileAcrossAllNICs' : val});} - }> - - { qgenericFieldInfo['network/networkCapacity/protocolWithHighestTrafficProfileAcrossAllNICs'].enum.map(proto => - ) } - -
-
- onQDataChanged({'network/networkCapacity/networkTransactionsPerSecond' : ntps})} - isValid={qgenericFieldInfo['network/networkCapacity/networkTransactionsPerSecond'].isValid} - errorText={qgenericFieldInfo['network/networkCapacity/networkTransactionsPerSecond'].errorText} - value={dataMap['network/networkCapacity/networkTransactionsPerSecond']} /> -
-
-
-
- - } -
- {this.renderNicList()} -
- -
- ); - } - - renderNicList() { - const {localFilter} = this.state; - let {isReadOnlyMode, onAddNic, isManual} = this.props; - return ( - this.setState({localFilter: value})} - onAdd={isManual ? onAddNic : null} - plusButtonTitle={i18n('Add NIC')} - twoColumns> - {this.filterList().map(nic => this.renderNicListItem(nic, isReadOnlyMode))} - - ); - } + render() { + let { + dataMap, + qgenericFieldInfo, + onQDataChanged, + isReadOnlyMode + } = this.props; - renderNicListItem(nic, isReadOnlyMode) { - let {id, name, description, networkName = ''} = nic; - let {onEditNicClick, version, isManual, onDeleteNic} = this.props; - return ( - onEditNicClick(nic, version, isReadOnlyMode)} - onDelete={isManual ? () => onDeleteNic(nic, version) : null}> + return ( +
+
+
+ {qgenericFieldInfo && ( +
this.save()} + isReadOnlyMode={isReadOnlyMode} + hasButtons={false}> +

+ {i18n('Network Capacity')} +

+
+
+
+ { + const selectedIndex = + e.target.selectedIndex; + const val = + e.target.options[ + selectedIndex + ].value; + onQDataChanged({ + 'network/networkCapacity/protocolWithHighestTrafficProfileAcrossAllNICs': val + }); + }}> + + {qgenericFieldInfo[ + 'network/networkCapacity/protocolWithHighestTrafficProfileAcrossAllNICs' + ].enum.map(proto => ( + + ))} + +
+
+ + onQDataChanged({ + 'network/networkCapacity/networkTransactionsPerSecond': ntps + }) + } + isValid={ + qgenericFieldInfo[ + 'network/networkCapacity/networkTransactionsPerSecond' + ].isValid + } + errorText={ + qgenericFieldInfo[ + 'network/networkCapacity/networkTransactionsPerSecond' + ].errorText + } + value={ + dataMap[ + 'network/networkCapacity/networkTransactionsPerSecond' + ] + } + /> +
+
+
+
+ + )} +
+ {this.renderNicList()} +
+
+ ); + } - -
{name}
- - -
-
{i18n('Purpose of NIC')}
- {description &&
{description}
} -
- {!isManual &&
-
{i18n('Network')}
-
{networkName}
-
} - + renderNicList() { + const { localFilter } = this.state; + let { isReadOnlyMode, onAddNic, isManual } = this.props; + return ( + this.setState({ localFilter: value })} + onAdd={isManual ? onAddNic : null} + plusButtonTitle={i18n('Add NIC')} + twoColumns> + {this.filterList().map(nic => + this.renderNicListItem(nic, isReadOnlyMode) + )} + + ); + } - - ); - } + renderNicListItem(nic, isReadOnlyMode) { + let { id, name, description, networkName = '' } = nic; + let { onEditNicClick, version, isManual, onDeleteNic } = this.props; + return ( + onEditNicClick(nic, version, isReadOnlyMode)} + onDelete={isManual ? () => onDeleteNic(nic, version) : null}> + +
{name}
+ + +
+
+ {i18n('Purpose of NIC')} +
+ {description && ( +
+ {description} +
+ )} +
+ {!isManual && ( +
+
{i18n('Network')}
+
{networkName}
+
+ )} + + + ); + } - filterList() { - let {nicList} = this.props; - let {localFilter} = this.state; - if (localFilter.trim()) { - const filter = new RegExp(escape(localFilter), 'i'); - return nicList.filter(({name = '', description = ''}) => { - return escape(name).match(filter) || escape(description).match(filter); - }); - } - else { - return nicList; - } - } + filterList() { + let { nicList } = this.props; + let { localFilter } = this.state; + if (localFilter.trim()) { + const filter = new RegExp(escape(localFilter), 'i'); + return nicList.filter(({ name = '', description = '' }) => { + return ( + escape(name).match(filter) || + escape(description).match(filter) + ); + }); + } else { + return nicList; + } + } - save() { - let {onSubmit, qdata, version} = this.props; - return onSubmit({qdata, version}); - } + save() { + let { onSubmit, qdata, version } = this.props; + return onSubmit({ qdata, version }); + } } export default SoftwareProductComponentsNetworkView; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Acceptable.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Acceptable.jsx index 0fc7404c56..0b2783ebe7 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Acceptable.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Acceptable.jsx @@ -19,57 +19,97 @@ import Input from 'nfvo-components/input/validation/Input.jsx'; import GridSection from 'nfvo-components/grid/GridSection.jsx'; import GridItem from 'nfvo-components/grid/GridItem.jsx'; -const Acceptable = ({qgenericFieldInfo, dataMap, onQDataChanged}) => { - return( - - -
{i18n('Acceptable Jitter')}
- - -
{i18n('Allow Packet Loss')}
- - - onQDataChanged({'sizing/acceptableJitter/mean' : val})} /> - - - onQDataChanged({'sizing/acceptableJitter/max' : val})} /> - - - onQDataChanged({'sizing/acceptableJitter/variable' : val})} /> - - - onQDataChanged({'sizing/acceptablePacketLoss' : val})} /> - - - ); +const Acceptable = ({ qgenericFieldInfo, dataMap, onQDataChanged }) => { + return ( + + +
+ {i18n('Acceptable Jitter')} +
+ + +
+ {i18n('Allow Packet Loss')} +
+ + + + onQDataChanged({ 'sizing/acceptableJitter/mean': val }) + } + /> + + + + onQDataChanged({ 'sizing/acceptableJitter/max': val }) + } + /> + + + + onQDataChanged({ + 'sizing/acceptableJitter/variable': val + }) + } + /> + + + + onQDataChanged({ 'sizing/acceptablePacketLoss': val }) + } + /> + + + ); }; export default Acceptable; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/FlowLength.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/FlowLength.jsx index 3745fc7c2e..32a5516eb4 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/FlowLength.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/FlowLength.jsx @@ -18,18 +18,20 @@ import i18n from 'nfvo-utils/i18n/i18n.js'; import PacketsBytes from './PacketsBytes.jsx'; const pointers = [ - {label: 'Peak', value: 'sizing/flowLength/packets/peak'}, - {label: 'Avg', value: 'sizing/flowLength/packets/avg'}, - {label: 'Peak', value: 'sizing/flowLength/bytes/peak'}, - {label: 'Avg', value: 'sizing/flowLength/bytes/avg'}, + { label: 'Peak', value: 'sizing/flowLength/packets/peak' }, + { label: 'Avg', value: 'sizing/flowLength/packets/avg' }, + { label: 'Peak', value: 'sizing/flowLength/bytes/peak' }, + { label: 'Avg', value: 'sizing/flowLength/bytes/avg' } ]; -const FlowLength = (props) => { - return( - - ); +const FlowLength = props => { + return ( + + ); }; export default FlowLength; - - diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/InFlowTraffic.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/InFlowTraffic.jsx index 5476ed90e6..150e58af52 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/InFlowTraffic.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/InFlowTraffic.jsx @@ -18,18 +18,20 @@ import i18n from 'nfvo-utils/i18n/i18n.js'; import PacketsBytes from './PacketsBytes.jsx'; const pointers = [ - {label: 'Peak', value: 'sizing/inflowTrafficPerSecond/packets/peak'}, - {label: 'Avg', value: 'sizing/inflowTrafficPerSecond/packets/avg'}, - {label: 'Peak', value: 'sizing/inflowTrafficPerSecond/bytes/peak'}, - {label: 'Avg', value: 'sizing/inflowTrafficPerSecond/bytes/avg'}, + { label: 'Peak', value: 'sizing/inflowTrafficPerSecond/packets/peak' }, + { label: 'Avg', value: 'sizing/inflowTrafficPerSecond/packets/avg' }, + { label: 'Peak', value: 'sizing/inflowTrafficPerSecond/bytes/peak' }, + { label: 'Avg', value: 'sizing/inflowTrafficPerSecond/bytes/avg' } ]; -const InFlowTraffic = (props) => { - return( - - ); +const InFlowTraffic = props => { + return ( + + ); }; export default InFlowTraffic; - - diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/IpConfig.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/IpConfig.jsx index b3a5d21625..695835606b 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/IpConfig.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/IpConfig.jsx @@ -19,27 +19,37 @@ import Input from 'nfvo-components/input/validation/Input.jsx'; import GridSection from 'nfvo-components/grid/GridSection.jsx'; import GridItem from 'nfvo-components/grid/GridItem.jsx'; -const IpConfig = ({dataMap, onQDataChanged}) => { - return ( - - - onQDataChanged({'ipConfiguration/ipv4Required' : value})} - data-test-id='ipConfiguration-ipv4Required' - value={dataMap['ipConfiguration/ipv4Required']} /> - - - onQDataChanged({'ipConfiguration/ipv6Required' : value})} - value={dataMap['ipConfiguration/ipv6Required']} /> - - - ); +const IpConfig = ({ dataMap, onQDataChanged }) => { + return ( + + + + onQDataChanged({ + 'ipConfiguration/ipv4Required': value + }) + } + data-test-id="ipConfiguration-ipv4Required" + value={dataMap['ipConfiguration/ipv4Required']} + /> + + + + onQDataChanged({ + 'ipConfiguration/ipv6Required': value + }) + } + value={dataMap['ipConfiguration/ipv6Required']} + /> + + + ); }; export default IpConfig; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/NameAndPurpose.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/NameAndPurpose.jsx index 06a2bb445c..5a89239dc6 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/NameAndPurpose.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/NameAndPurpose.jsx @@ -20,40 +20,48 @@ import Input from 'nfvo-components/input/validation/Input.jsx'; import GridSection from 'nfvo-components/grid/GridSection.jsx'; import GridItem from 'nfvo-components/grid/GridItem.jsx'; -const NameAndPurpose = ({onDataChanged, genericFieldInfo, isReadOnlyMode, name, description, isManual}) => { - - return ( - - - onDataChanged({name})} - isValid={genericFieldInfo['name'].isValid} - errorText={genericFieldInfo['name'].errorText} - type='text' /> - - - onDataChanged({description})} - disabled={isReadOnlyMode} - type='textarea' /> - - - ); +const NameAndPurpose = ({ + onDataChanged, + genericFieldInfo, + isReadOnlyMode, + name, + description, + isManual +}) => { + return ( + + + onDataChanged({ name })} + isValid={genericFieldInfo['name'].isValid} + errorText={genericFieldInfo['name'].errorText} + type="text" + /> + + + onDataChanged({ description })} + disabled={isReadOnlyMode} + type="textarea" + /> + + + ); }; NameAndPurpose.PropTypes = { - name: PropTypes.string, - description: PropTypes.array, - onDataChanged: PropTypes.func, - isReadOnlyMode: PropTypes.bool, + name: PropTypes.string, + description: PropTypes.array, + onDataChanged: PropTypes.func, + isReadOnlyMode: PropTypes.bool }; export default NameAndPurpose; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Network.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Network.jsx index 7e6712cb5e..c440d2fbd3 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Network.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Network.jsx @@ -21,56 +21,70 @@ import GridSection from 'nfvo-components/grid/GridSection.jsx'; import GridItem from 'nfvo-components/grid/GridItem.jsx'; import { networkTypes } from '../SoftwareProductComponentsNetworkConstants.js'; -const Network = ({networkValues, networkType, networkDescription, onDataChanged, isReadOnlyMode}) => { - const isExternal = networkType === networkTypes.EXTERNAL; - return ( - - - - - - - - - { - isExternal ? - onDataChanged({networkDescription})} - disabled={isReadOnlyMode} - type='text' /> - : - - {networkValues.map(val => )} - - } - - - ); +const Network = ({ + networkValues, + networkType, + networkDescription, + onDataChanged, + isReadOnlyMode +}) => { + const isExternal = networkType === networkTypes.EXTERNAL; + return ( + + + + + + + + + {isExternal ? ( + + onDataChanged({ networkDescription }) + } + disabled={isReadOnlyMode} + type="text" + /> + ) : ( + + {networkValues.map(val => ( + + ))} + + )} + + + ); }; Network.PropTypes = { - networkValues: PropTypes.array + networkValues: PropTypes.array }; -export default Network; +export default Network; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/OutFlowTraffic.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/OutFlowTraffic.jsx index 80a3d1579b..7173294536 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/OutFlowTraffic.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/OutFlowTraffic.jsx @@ -18,18 +18,20 @@ import i18n from 'nfvo-utils/i18n/i18n.js'; import PacketsBytes from './PacketsBytes.jsx'; const pointers = [ - {label: 'Peak', value: 'sizing/outflowTrafficPerSecond/packets/peak'}, - {label: 'Avg', value: 'sizing/outflowTrafficPerSecond/packets/avg'}, - {label: 'Peak', value: 'sizing/outflowTrafficPerSecond/bytes/peak'}, - {label: 'Avg', value: 'sizing/outflowTrafficPerSecond/bytes/avg'}, + { label: 'Peak', value: 'sizing/outflowTrafficPerSecond/packets/peak' }, + { label: 'Avg', value: 'sizing/outflowTrafficPerSecond/packets/avg' }, + { label: 'Peak', value: 'sizing/outflowTrafficPerSecond/bytes/peak' }, + { label: 'Avg', value: 'sizing/outflowTrafficPerSecond/bytes/avg' } ]; -const OutFlowTraffic = (props) => { - return( - - ); +const OutFlowTraffic = props => { + return ( + + ); }; export default OutFlowTraffic; - - diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/PacketsBytes.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/PacketsBytes.jsx index f5f28aea59..070ac816ad 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/PacketsBytes.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/PacketsBytes.jsx @@ -20,47 +20,74 @@ import Input from 'nfvo-components/input/validation/Input.jsx'; import GridSection from 'nfvo-components/grid/GridSection.jsx'; import GridItem from 'nfvo-components/grid/GridItem.jsx'; -const PointerInput = ({label, value, onQDataChanged, qgenericFieldInfo, dataMap, lastColInRow}) => { - return ( - - onQDataChanged({[value]: val})} /> - - ); +const PointerInput = ({ + label, + value, + onQDataChanged, + qgenericFieldInfo, + dataMap, + lastColInRow +}) => { + return ( + + onQDataChanged({ [value]: val })} + /> + + ); }; PointerInput.PropTypes = { - label: PropTypes.string, - value: PropTypes.string + label: PropTypes.string, + value: PropTypes.string }; -const PacketsBytes = ({title, pointers = [], qgenericFieldInfo, dataMap, onQDataChanged}) => { - return( - - -
{i18n('Packets')}
- - -
{i18n('Bytes')}
- - {pointers.map((pointer, i) => {return ();})} - - ); +const PacketsBytes = ({ + title, + pointers = [], + qgenericFieldInfo, + dataMap, + onQDataChanged +}) => { + return ( + + +
+ {i18n('Packets')} +
+ + +
{i18n('Bytes')}
+ + {pointers.map((pointer, i) => { + return ( + + ); + })} + + ); }; PacketsBytes.PropTypes = { - title: PropTypes.string, - pointers: PropTypes.array, - onQDataChanged: PropTypes.function, - dataMap: PropTypes.object, - qgenericFieldInfo: PropTypes.object + title: PropTypes.string, + pointers: PropTypes.array, + onQDataChanged: PropTypes.function, + dataMap: PropTypes.object, + qgenericFieldInfo: PropTypes.object }; export default PacketsBytes; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Protocols.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Protocols.jsx index be4093da59..eb762b11b2 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Protocols.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Protocols.jsx @@ -21,55 +21,83 @@ import InputOptions from 'nfvo-components/input/validation/InputOptions.jsx'; import GridSection from 'nfvo-components/grid/GridSection.jsx'; import GridItem from 'nfvo-components/grid/GridItem.jsx'; -const Protocols = ({protocols, qgenericFieldInfo, dataMap, onQDataChanged}) => { - return ( - - - {}} - onEnumChange={protocols => { - onQDataChanged({'protocols/protocols' : protocols});} - } - multiSelectedEnum={dataMap['protocols/protocols']} - clearable={false} - values={qgenericFieldInfo['protocols/protocols'].enum}/> - - - { - const selectedIndex = e.target.selectedIndex; - const val = e.target.options[selectedIndex].value; - onQDataChanged({'protocols/protocolWithHighestTrafficProfile' : val});} - }> - {(protocols.length === 0) && - - } - {protocols.map(protocol => )} - - - - ); +const Protocols = ({ + protocols, + qgenericFieldInfo, + dataMap, + onQDataChanged +}) => { + return ( + + + {}} + onEnumChange={protocols => { + onQDataChanged({ 'protocols/protocols': protocols }); + }} + multiSelectedEnum={dataMap['protocols/protocols']} + clearable={false} + values={qgenericFieldInfo['protocols/protocols'].enum} + /> + + + { + const selectedIndex = e.target.selectedIndex; + const val = e.target.options[selectedIndex].value; + onQDataChanged({ + 'protocols/protocolWithHighestTrafficProfile': val + }); + }}> + {protocols.length === 0 && ( + + )} + {protocols.map(protocol => ( + + ))} + + + + ); }; Protocols.PropTypes = { - protocols: PropTypes.array, - onQDataChanged: PropTypes.function, - dataMap: PropTypes.object, - qgenericFieldInfo: PropTypes.object + protocols: PropTypes.array, + onQDataChanged: PropTypes.function, + dataMap: PropTypes.object, + qgenericFieldInfo: PropTypes.object }; export default Protocols; diff --git a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Sizing.jsx b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Sizing.jsx index 202d458f25..f9ec7261ac 100644 --- a/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Sizing.jsx +++ b/openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/nicEditorComponents/Sizing.jsx @@ -19,21 +19,32 @@ import Input from 'nfvo-components/input/validation/Input.jsx'; import GridSection from 'nfvo-components/grid/GridSection.jsx'; import GridItem from 'nfvo-components/grid/GridItem.jsx'; -const Sizing = ({qgenericFieldInfo, dataMap, onQDataChanged}) => { - return( - - - onQDataChanged({'sizing/describeQualityOfService' : val}) }/> - - - ); +const Sizing = ({ qgenericFieldInfo, dataMap, onQDataChanged }) => { + return ( + + + + onQDataChanged({ + 'sizing/describeQualityOfService': val + }) + } + /> + + + ); }; export default Sizing; -- cgit 1.2.3-korg