input time refactor #1292
This commit is contained in:
parent
49ef341eb6
commit
1e06a19884
|
@ -87,8 +87,7 @@ export default class InputNumber extends Input {
|
|||
* @param {Number} value - Value
|
||||
*/
|
||||
set min(value) {
|
||||
if (!value) value = 0;
|
||||
this.input.min = value;
|
||||
if (value) this.input.min = value;
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -104,7 +103,7 @@ export default class InputNumber extends Input {
|
|||
* @param {Number} value - Value
|
||||
*/
|
||||
set step(value) {
|
||||
this.input.step = value;
|
||||
if (value) this.input.step = value;
|
||||
}
|
||||
|
||||
get validationError() {
|
||||
|
|
|
@ -18,14 +18,6 @@
|
|||
<div class="underline"></div>
|
||||
<div class="selected underline"></div>
|
||||
<div class="suffix">
|
||||
<i class="material-icons clear"
|
||||
translate-attr="{title: 'Clear'}"
|
||||
ng-show="!$ctrl.disabled
|
||||
&& $ctrl.hasValue
|
||||
&& !$ctrl.unclearable"
|
||||
ng-click="$ctrl.clear()">
|
||||
clear
|
||||
</i>
|
||||
<i class="material-icons"
|
||||
ng-if="$ctrl.hasInfo"
|
||||
vn-tooltip="{{$ctrl.info}}">
|
||||
|
|
|
@ -3,32 +3,113 @@ import Input from '../../lib/input';
|
|||
import './style.scss';
|
||||
|
||||
export default class InputTime extends Input {
|
||||
constructor($element, $scope) {
|
||||
super($element, $scope);
|
||||
|
||||
this.registerEvents();
|
||||
}
|
||||
|
||||
/**
|
||||
* Registers all event emitters
|
||||
*/
|
||||
registerEvents() {
|
||||
this.input.addEventListener('change', event => {
|
||||
this.emit('change', {event});
|
||||
});
|
||||
|
||||
this.input.addEventListener('focus', event => {
|
||||
this.emit('focus', {event});
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Gets current value
|
||||
*/
|
||||
get value() {
|
||||
return this._value;
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets input value
|
||||
*
|
||||
* @param {Number} value - Value
|
||||
*/
|
||||
set value(value) {
|
||||
if (!value) return;
|
||||
if (this._value === undefined && value || typeof value === 'string')
|
||||
value = this.formatTime(value);
|
||||
|
||||
let newDate = new Date(value);
|
||||
newDate.setSeconds(0);
|
||||
newDate.setMilliseconds(0);
|
||||
this._value = value;
|
||||
this.hasValue = !(value === null || value === undefined);
|
||||
|
||||
this._value = newDate;
|
||||
this.hasValue = this._value !== null;
|
||||
this.input.value = this._value;
|
||||
|
||||
if (this.hasValue) this.element.classList.add('not-empty');
|
||||
|
||||
this.element.querySelector('.infix').classList.remove('invalid', 'validated');
|
||||
if (this.hasValue)
|
||||
this.element.classList.add('not-empty');
|
||||
else
|
||||
this.element.classList.remove('not-empty');
|
||||
}
|
||||
|
||||
/**
|
||||
* 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 parseInt(this.input.step);
|
||||
return this.input.step;
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets min step value
|
||||
*
|
||||
* @param {Number} value - Value
|
||||
*/
|
||||
set step(value) {
|
||||
this.input.step = value;
|
||||
if (value) this.input.step = value;
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns a formatted hour
|
||||
* @param {Date} date -a
|
||||
* @return {String} Formatted hour
|
||||
*/
|
||||
formatTime(date) {
|
||||
if (typeof date === 'string') {
|
||||
date = new Date(date);
|
||||
date.setTime(date.getTime() + (date.getTimezoneOffset() * 60000));
|
||||
}
|
||||
|
||||
date.setSeconds(null);
|
||||
date.setMilliseconds(null);
|
||||
|
||||
return date;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -46,6 +127,8 @@ ngModule.component('vnInputTime', {
|
|||
disabled: '<?',
|
||||
readonly: '<?',
|
||||
step: '<?',
|
||||
min: '<?',
|
||||
max: '<?',
|
||||
rule: '@?',
|
||||
value: '=model',
|
||||
vnTabIndex: '@?',
|
||||
|
|
|
@ -9,14 +9,13 @@ dateTime.$inject = ['$filter'];
|
|||
|
||||
export default function dateTime($filter) {
|
||||
return function(input, format) {
|
||||
let value;
|
||||
if (input) {
|
||||
value = new Date(input);
|
||||
let offset = value.getTimezoneOffset() * 60000;
|
||||
value.setTime(value.getTime() + offset);
|
||||
if (typeof input === 'string' && input) {
|
||||
input = new Date(input);
|
||||
let offset = input.getTimezoneOffset() * 60000;
|
||||
input.setTime(input.getTime() + offset);
|
||||
}
|
||||
|
||||
return $filter('date')(value, format);
|
||||
return $filter('date')(input, format);
|
||||
};
|
||||
}
|
||||
ngModule.filter('dateTime', dateTime);
|
||||
|
|
|
@ -37,8 +37,7 @@
|
|||
model="$ctrl.zone.travelingDays"
|
||||
min="0" step="1">
|
||||
</vn-input-number>
|
||||
<vn-input-time
|
||||
vn-two
|
||||
<vn-input-time vn-two
|
||||
label="Estimated hour (ETD)"
|
||||
model="$ctrl.zone.hour">
|
||||
</vn-input-time>
|
||||
|
|
|
@ -15,16 +15,14 @@
|
|||
</vn-textfield>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal>
|
||||
<vn-autocomplete
|
||||
vn-one
|
||||
<vn-autocomplete vn-one
|
||||
field="$ctrl.zone.warehouseFk"
|
||||
url="/agency/api/Warehouses"
|
||||
show-field="name"
|
||||
value-field="id"
|
||||
label="Warehouse">
|
||||
</vn-autocomplete>
|
||||
<vn-autocomplete
|
||||
vn-one
|
||||
<vn-autocomplete vn-one
|
||||
field="$ctrl.zone.agencyModeFk"
|
||||
url="/agency/api/AgencyModes/isActive"
|
||||
show-field="name"
|
||||
|
@ -33,32 +31,27 @@
|
|||
</vn-autocomplete>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal>
|
||||
<vn-input-number
|
||||
vn-two
|
||||
min="0"
|
||||
value="$ctrl.zone.travelingDays"
|
||||
step="1"
|
||||
<vn-input-number vn-two
|
||||
label="Traveling days"
|
||||
field="$ctrl.zone.travelingDays">
|
||||
model="$ctrl.zone.travelingDays"
|
||||
min="0" step="1">
|
||||
</vn-input-number>
|
||||
<vn-input-time
|
||||
vn-two
|
||||
<vn-input-time vn-two
|
||||
label="Estimated hour (ETD)"
|
||||
field="$ctrl.zone.hour">
|
||||
model="$ctrl.zone.hour"
|
||||
rule="zone.hour">
|
||||
</vn-input-time>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal>
|
||||
<vn-input-number vn-one
|
||||
label="Price"
|
||||
field="$ctrl.zone.price"
|
||||
min="0.00"
|
||||
step="0.10">
|
||||
model="$ctrl.zone.price"
|
||||
min="0" step="0.01">
|
||||
</vn-input-number>
|
||||
<vn-input-number vn-one
|
||||
label="Bonus"
|
||||
field="$ctrl.zone.bonus"
|
||||
min="0.00"
|
||||
step="0.10">
|
||||
model="$ctrl.zone.bonus"
|
||||
min="0" step="0.01">
|
||||
</vn-input-number>
|
||||
</vn-horizontal>
|
||||
<vn-horizontal>
|
||||
|
|
Loading…
Reference in New Issue