blob: 3bad147117dd706580e790670d9180ae427b1601 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
|
import React from 'react';
import i18n from 'nfvo-utils/i18n/i18n.js';
import ValidationForm from 'nfvo-components/input/validation/ValidationForm.jsx';
import ValidationInput from'nfvo-components/input/validation/ValidationInput.jsx';
class SoftwareProductComponentComputeView extends React.Component {
static propTypes = {
qdata: React.PropTypes.object,
qschema: React.PropTypes.object,
isReadOnlyMode: React.PropTypes.bool,
minNumberOfVMsSelectedByUser: React.PropTypes.number,
onQDataChanged: React.PropTypes.func.isRequired,
onSubmit: React.PropTypes.func.isRequired
};
render() {
let {qdata, qschema, isReadOnlyMode, minNumberOfVMsSelectedByUser, onQDataChanged, onSubmit} = this.props;
return (
<div className='vsp-component-questionnaire-view'>
<ValidationForm
ref='computeValidationForm'
hasButtons={false}
onSubmit={() => onSubmit({qdata})}
className='component-questionnaire-validation-form'
isReadOnlyMode={isReadOnlyMode}
onDataChanged={onQDataChanged}
data={qdata}
schema={qschema}>
<div className='section-title'>{i18n('VM Sizing')}</div>
<div className='rows-section'>
<div className='row-flex-components input-row'>
<div className='single-col'>
<ValidationInput
type='text'
label={i18n('Number of CPUs')}
pointer={'/compute/vmSizing/numOfCPUs'}/>
</div>
<div className='single-col'>
<ValidationInput
type='text'
label={i18n('File System Size (GB)')}
pointer={'/compute/vmSizing/fileSystemSizeGB'}/>
</div>
<div className='single-col'>
<ValidationInput
type='text'
label={i18n('Persistent Storage/Volume Size (GB)')}
pointer={'/compute/vmSizing/persistentStorageVolumeSize'}/>
</div>
<ValidationInput
type='text'
label={i18n('I/O Operations (per second)')}
pointer={'/compute/vmSizing/IOOperationsPerSec'}/>
</div>
</div>
<div className='section-title'>{i18n('Number of VMs')}</div>
<div className='rows-section'>
<div className='row-flex-components input-row'>
<div className='single-col'>
<ValidationInput
type='text'
label={i18n('Minimum')}
pointer={'/compute/numOfVMs/minimum'}/>
</div>
<div className='single-col'>
<ValidationInput
type='text'
label={i18n('Maximum')}
pointer={'/compute/numOfVMs/maximum'}
validations={{minValue: minNumberOfVMsSelectedByUser}}/>
</div>
<div className='single-col'>
<ValidationInput
type='select'
label={i18n('CPU Oversubscription Ratio')}
pointer={'/compute/numOfVMs/CpuOverSubscriptionRatio'}/>
</div>
<ValidationInput
type='select'
label={i18n('Memory - RAM')}
pointer={'/compute/numOfVMs/MemoryRAM'}/>
</div>
</div>
<div className='section-title'>{i18n('Guest OS')}</div>
<div className='rows-section'>
<div className='section-field row-flex-components input-row'>
<div className='two-col'>
<ValidationInput
label={i18n('Guest OS')}
type='text'
pointer={'/compute/guestOS/name'}/>
</div>
<div className='empty-two-col'/>
</div>
<div className='vertical-flex input-row'>
<label key='label' className='control-label'>{i18n('OS Bit Size')}</label>
<div className='radio-options-content-row input-row'>
<ValidationInput
type='radiogroup'
pointer={'/compute/guestOS/bitSize'}
className='radio-field'/>
</div>
</div>
<div className='section-field row-flex-components input-row'>
<div className='two-col'>
<ValidationInput
type='textarea'
label={i18n('Guest OS Tools:')}
pointer={'/compute/guestOS/tools'}/>
</div>
<div className='empty-two-col'/>
</div>
</div>
</ValidationForm>
</div>
);
}
save(){
return this.refs.computeValidationForm.handleFormSubmit(new Event('dummy'));
}
}
export default SoftwareProductComponentComputeView;
|
