137 lines
2.8 KiB
JavaScript
137 lines
2.8 KiB
JavaScript
import ngModule from '../../module';
|
|
import Input from '../../lib/input';
|
|
import './style.scss';
|
|
|
|
export default class InputNumber extends Input {
|
|
constructor($element, $scope, $attrs, vnTemplate) {
|
|
super($element, $scope);
|
|
this.displayControls = false;
|
|
this.hasFocus = false;
|
|
|
|
vnTemplate.normalizeInputAttrs($attrs);
|
|
this.registerEvents();
|
|
}
|
|
|
|
/**
|
|
* Registers all event emitters
|
|
*/
|
|
registerEvents() {
|
|
this.input.addEventListener('change', event => {
|
|
this.validateValue();
|
|
this.emit('change', {event});
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Gets current value
|
|
*/
|
|
get value() {
|
|
return this._value;
|
|
}
|
|
|
|
/**
|
|
* Sets input value
|
|
*
|
|
* @param {Number} value - Value
|
|
*/
|
|
set value(value) {
|
|
this.hasValue = !(value === null || value === undefined || value === '');
|
|
|
|
if (!this.hasOwnProperty('_value') && this.hasValue || value === '')
|
|
this.input.value = value;
|
|
|
|
this._value = value;
|
|
this.element.classList.toggle('not-empty', this.hasValue);
|
|
this.validateValue();
|
|
}
|
|
|
|
/**
|
|
* Gets max value
|
|
*/
|
|
get max() {
|
|
return this.input.max;
|
|
}
|
|
|
|
/**
|
|
* Sets max allowed value
|
|
*
|
|
* @param {Number} value - Value
|
|
*/
|
|
set max(value) {
|
|
if (value) this.input.max = value;
|
|
}
|
|
|
|
/**
|
|
* Gets min value
|
|
*/
|
|
get min() {
|
|
return this.input.min;
|
|
}
|
|
|
|
/**
|
|
* Sets min allowed value
|
|
*
|
|
* @param {Number} value - Value
|
|
*/
|
|
set min(value) {
|
|
if (value) this.input.min = value;
|
|
}
|
|
|
|
/**
|
|
* Gets min step value
|
|
*/
|
|
get step() {
|
|
return parseFloat(this.input.step);
|
|
}
|
|
|
|
/**
|
|
* Sets min step value
|
|
*
|
|
* @param {Number} value - Value
|
|
*/
|
|
set step(value) {
|
|
if (value) this.input.step = value;
|
|
}
|
|
|
|
/**
|
|
* Increases the input value
|
|
*/
|
|
stepUp() {
|
|
this.input.stepUp();
|
|
this.input.dispatchEvent(new Event('change'));
|
|
}
|
|
|
|
/**
|
|
* Decreases the input value
|
|
*/
|
|
stepDown() {
|
|
this.input.stepDown();
|
|
this.input.dispatchEvent(new Event('change'));
|
|
}
|
|
}
|
|
InputNumber.$inject = ['$element', '$scope', '$attrs', 'vnTemplate'];
|
|
|
|
ngModule.component('vnInputNumber', {
|
|
template: require('./index.html'),
|
|
controller: InputNumber,
|
|
transclude: {
|
|
leftIcons: '?tLeftIcons',
|
|
rightIcons: '?tRightIcons'
|
|
},
|
|
bindings: {
|
|
label: '@?',
|
|
name: '@?',
|
|
disabled: '<?',
|
|
required: '@?',
|
|
min: '<?',
|
|
max: '<?',
|
|
step: '<?',
|
|
displayControls: '<?',
|
|
rule: '@?',
|
|
value: '=model',
|
|
validate: '&',
|
|
onChange: '&',
|
|
onClear: '&'
|
|
}
|
|
});
|