openecomp-ui/src/sdc-app/onboarding/softwareProduct/components/network/SoftwareProductComponentsNICEditorView.jsx

   1 /*
   2  * Copyright © 2016-2018 European Support Limited
   3  *
   4  * Licensed under the Apache License, Version 2.0 (the "License");
   5  * you may not use this file except in compliance with the License.
   6  * You may obtain a copy of the License at
   7  *
   8  *      http://www.apache.org/licenses/LICENSE-2.0
   9  *
  10  * Unless required by applicable law or agreed to in writing, software
  11  * distributed under the License is distributed on an "AS IS" BASIS,
  12  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13  * See the License for the specific language governing permissions and
  14  * limitations under the License.
  15  */
  16 import React from 'react';
  17 import Form from 'nfvo-components/input/validation/Form.jsx';
  18 import Acceptable from './nicEditorComponents/Acceptable.jsx';
  19 import FlowLength from './nicEditorComponents/FlowLength.jsx';
  20 import OutFlowTraffic from './nicEditorComponents/OutFlowTraffic.jsx';
  21 import InFlowTraffic from './nicEditorComponents/InFlowTraffic.jsx';
  22 import Sizing from './nicEditorComponents/Sizing.jsx';
  23 import Network from './nicEditorComponents/Network.jsx';
  24 import IpConfig from './nicEditorComponents/IpConfig.jsx';
  25 import Protocols from './nicEditorComponents/Protocols.jsx';
  26 import NameAndPurpose from './nicEditorComponents/NameAndPurpose.jsx';
  27
  28 class SoftwareProductComponentsNetworkEditorView extends React.Component {
  29     render() {
  30         let {
  31             onCancel,
  32             onValidateForm,
  33             isReadOnlyMode,
  34             isFormValid,
  35             formReady,
  36             data = {},
  37             qgenericFieldInfo,
  38             dataMap,
  39             onDataChanged,
  40             protocols,
  41             onQDataChanged,
  42             isManual,
  43             genericFieldInfo
  44         } = this.props;
  45         let {
  46             name,
  47             description,
  48             networkName,
  49             networkType,
  50             networkDescription
  51         } = data;
  52         let netWorkValues = [
  53             {
  54                 enum: networkName,
  55                 title: networkName
  56             }
  57         ];
  58         return (
  59             <div>
  60                 {qgenericFieldInfo && (
  61                     <Form
  62                         ref={form => {
  63                             this.form = form;
  64                         }}
  65                         hasButtons={true}
  66                         btnClassName="sdc-modal__footer"
  67                         onSubmit={() => this.submit()}
  68                         onReset={() => onCancel()}
  69                         labledButtons={true}
  70                         isReadOnlyMode={isReadOnlyMode}
  71                         isValid={isFormValid}
  72                         formReady={formReady}
  73                         onValidateForm={() => onValidateForm()}
  74                         className="vsp-components-network-editor">
  75                         <div className="editor-data">
  76                             <NameAndPurpose
  77                                 isManual={isManual}
  78                                 name={name}
  79                                 description={description}
  80                                 onDataChanged={onDataChanged}
  81                                 isReadOnlyMode={isReadOnlyMode}
  82                                 genericFieldInfo={genericFieldInfo}
  83                             />
  84                             <Protocols
  85                                 protocols={protocols}
  86                                 qgenericFieldInfo={qgenericFieldInfo}
  87                                 dataMap={dataMap}
  88                                 onQDataChanged={onQDataChanged}
  89                             />
  90                             <IpConfig
  91                                 dataMap={dataMap}
  92                                 onQDataChanged={onQDataChanged}
  93                             />
  94                             <Network
  95                                 networkDescription={networkDescription}
  96                                 onDataChanged={onDataChanged}
  97                                 networkValues={netWorkValues}
  98                                 isReadOnlyMode={isReadOnlyMode}
  99                                 networkType={networkType}
 100                             />
 101                             <Sizing
 102                                 qgenericFieldInfo={qgenericFieldInfo}
 103                                 dataMap={dataMap}
 104                                 onQDataChanged={onQDataChanged}
 105                             />
 106                             <InFlowTraffic
 107                                 qgenericFieldInfo={qgenericFieldInfo}
 108                                 dataMap={dataMap}
 109                                 onQDataChanged={onQDataChanged}
 110                             />
 111                             <OutFlowTraffic
 112                                 qgenericFieldInfo={qgenericFieldInfo}
 113                                 dataMap={dataMap}
 114                                 onQDataChanged={onQDataChanged}
 115                             />
 116                             <FlowLength
 117                                 qgenericFieldInfo={qgenericFieldInfo}
 118                                 dataMap={dataMap}
 119                                 onQDataChanged={onQDataChanged}
 120                             />
 121                             <Acceptable
 122                                 qgenericFieldInfo={qgenericFieldInfo}
 123                                 dataMap={dataMap}
 124                                 onQDataChanged={onQDataChanged}
 125                             />
 126                         </div>
 127                     </Form>
 128                 )}
 129             </div>
 130         );
 131     }
 132
 133     submit() {
 134         let { data, qdata, onSubmit } = this.props;
 135         onSubmit({ data, qdata });
 136     }
 137 }
 138
 139 export default SoftwareProductComponentsNetworkEditorView;