aboutsummaryrefslogtreecommitdiffstats
path: root/openecomp-ui/src/nfvo-components/input/validation/Input.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'openecomp-ui/src/nfvo-components/input/validation/Input.jsx')
-rw-r--r--openecomp-ui/src/nfvo-components/input/validation/Input.jsx44
1 files changed, 38 insertions, 6 deletions
diff --git a/openecomp-ui/src/nfvo-components/input/validation/Input.jsx b/openecomp-ui/src/nfvo-components/input/validation/Input.jsx
index 59c35d7993..eef8fee1ce 100644
--- a/openecomp-ui/src/nfvo-components/input/validation/Input.jsx
+++ b/openecomp-ui/src/nfvo-components/input/validation/Input.jsx
@@ -22,6 +22,7 @@ import FormGroup from 'react-bootstrap/lib/FormGroup.js';
import FormControl from 'react-bootstrap/lib/FormControl.js';
import Overlay from 'react-bootstrap/lib/Overlay.js';
import Tooltip from 'react-bootstrap/lib/Tooltip.js';
+import Datepicker from 'nfvo-components/datepicker/Datepicker.jsx';
class Input extends React.Component {
@@ -29,13 +30,14 @@ class Input extends React.Component {
value: this.props.value,
checked: this.props.checked,
selectedValues: []
- }
+ };
render() {
const {label, isReadOnlyMode, value, onBlur, onKeyDown, type, disabled, checked, name} = this.props;
// eslint-disable-next-line no-unused-vars
- const {groupClassName, isValid = true, errorText, isRequired, ...inputProps} = this.props;
- let wrapperClassName = (type !== 'radio') ? 'validation-input-wrapper' : 'form-group';
+ const {groupClassName, isValid = true, errorText, isRequired, overlayPos, ...inputProps} = this.props;
+ const {dateFormat, startDate, endDate, selectsStart, selectsEnd} = this.props; // Date Props
+ let wrapperClassName = (type !== 'radio') ? 'validation-input-wrapper' : 'validation-radio-wrapper';
if (disabled) {
wrapperClassName += ' disabled';
}
@@ -43,7 +45,7 @@ class Input extends React.Component {
<div className={wrapperClassName}>
<FormGroup className={classNames('form-group', [groupClassName], {'required' : isRequired , 'has-error' : !isValid})} >
{(label && (type !== 'checkbox' && type !== 'radio')) && <label className='control-label'>{label}</label>}
- {(type === 'text' || type === 'number') &&
+ {type === 'text' &&
<FormControl
bsClass={'form-control input-options-other'}
onChange={(e) => this.onChange(e)}
@@ -54,6 +56,17 @@ class Input extends React.Component {
inputRef={(input) => this.input = input}
type={type}
data-test-id={this.props['data-test-id']}/>}
+ {type === 'number' &&
+ <FormControl
+ bsClass={'form-control input-options-other'}
+ onChange={(e) => this.onChange(e)}
+ disabled={isReadOnlyMode || Boolean(disabled)}
+ onBlur={onBlur}
+ onKeyDown={onKeyDown}
+ value={(value !== undefined) ? value : ''}
+ inputRef={(input) => this.input = input}
+ type={type}
+ data-test-id={this.props['data-test-id']}/>}
{type === 'textarea' &&
<FormControl
@@ -81,6 +94,7 @@ class Input extends React.Component {
disabled={isReadOnlyMode || Boolean(disabled)}
value={value}
onChange={(e)=>this.onChangeRadio(e)}
+ inputRef={(input) => this.input = input}
data-test-id={this.props['data-test-id']}>{label}</Radio>}
{type === 'select' &&
<FormControl onClick={ (e) => this.optionSelect(e) }
@@ -88,6 +102,18 @@ class Input extends React.Component {
inputRef={(input) => this.input = input}
name={name} {...inputProps}
data-test-id={this.props['data-test-id']}/>}
+ {type === 'date' &&
+ <Datepicker
+ date={value}
+ format={dateFormat}
+ startDate={startDate}
+ endDate={endDate}
+ inputRef={(input) => this.input = input}
+ onChange={this.props.onChange}
+ disabled={isReadOnlyMode || Boolean(disabled)}
+ data-test-id={this.props['data-test-id']}
+ selectsStart={selectsStart}
+ selectsEnd={selectsEnd} />}
</FormGroup>
{ this.renderErrorOverlay() }
</div>
@@ -116,7 +142,11 @@ class Input extends React.Component {
const {onChange, type} = this.props;
let value = e.target.value;
if (type === 'number') {
- value = Number(value);
+ if (value === '') {
+ value = undefined;
+ } else {
+ value = Number(value);
+ }
}
this.setState({
value
@@ -154,7 +184,9 @@ class Input extends React.Component {
else if (type === 'text'
|| type === 'email'
|| type === 'number'
- || type === 'password') {
+ || type === 'radio'
+ || type === 'password'
+ || type === 'date') {
position = 'bottom';
}