greuge shipped with time

This commit is contained in:
Daniel Herrero 2018-01-10 10:48:02 +01:00
parent 027cc84d6f
commit 9d5ae5a665
3 changed files with 42 additions and 14 deletions

View File

@ -11,7 +11,12 @@
<vn-title vn-one margin-large-bottom>Add Greuge</vn-title> <vn-title vn-one margin-large-bottom>Add Greuge</vn-title>
<vn-horizontal> <vn-horizontal>
<vn-textfield vn-one margin-medium-right label="Amount" field="$ctrl.greuge.amount" type="number" vn-focus></vn-textfield> <vn-textfield vn-one margin-medium-right label="Amount" field="$ctrl.greuge.amount" type="number" vn-focus></vn-textfield>
<vn-date-picker vn-one label="Date" model="$ctrl.greuge.shipped"></vn-date-picker> <vn-date-picker vn-one
label="Date"
model="$ctrl.greuge.shipped"
ini-options="{enableTime: true, dateFormat: 'd-m-Y h:i:s', time_24hr: true}"
>
</vn-date-picker>
</vn-horizontal> </vn-horizontal>
<vn-horizontal> <vn-horizontal>
<vn-textfield vn-one margin-medium-right label="Comment" field="$ctrl.greuge.description"></vn-textfield> <vn-textfield vn-one margin-medium-right label="Comment" field="$ctrl.greuge.description"></vn-textfield>

View File

@ -5,7 +5,7 @@ class ClientGreugeCreate {
this.$ = $scope; this.$ = $scope;
this.$state = $state; this.$state = $state;
this.greuge = { this.greuge = {
shipped: $filter('date')(new Date(), 'yyyy-MM-dd') shipped: $filter('date')(new Date(), 'yyyy-MM-dd HH:mm:ss')
}; };
} }
onSubmit() { onSubmit() {

View File

@ -30,6 +30,7 @@ class DatePicker extends Component {
this._modelView = null; this._modelView = null;
this._model = undefined; this._model = undefined;
this._optionsChecked = false; this._optionsChecked = false;
this._waitingInit = 0;
this.hasFocus = false; this.hasFocus = false;
this.hasMouseIn = false; this.hasMouseIn = false;
componentHandler.upgradeElement($element[0].firstChild); componentHandler.upgradeElement($element[0].firstChild);
@ -39,12 +40,27 @@ class DatePicker extends Component {
return this._model; return this._model;
} }
set model(value) { set model(value) {
this._model = value; if (this._optionsChecked) {
if (value && !this.modelView) { this._waitingInit = 0;
let options = this._getOptions(); this._model = value;
let initialDateFormat = (options && options.dateFormat) ? options.dateFormat : 'Y-m-d'; if (value && !this.modelView) {
let format = this._formatFlat2Angular(initialDateFormat); let initialDateFormat = this.$translate.use() === 'es' ? 'd-m-Y' : 'Y-m-d';
this.modelView = this.$filter('date')(value, format); if (this.iniOptions.enableTime) {
initialDateFormat += ' H:i:s';
}
let format = this._formatFlat2Angular(initialDateFormat);
this._modelView = this.$filter('date')(new Date(value), format);
this.mdlUpdate();
}
} else if (this._waitingInit < 4) {
this._waitingInit++;
this.$timeout(() => {
this.model = value;
}, 250);
} else {
this.model = null;
this.modelView = '';
this._waitingInit = 0;
} }
} }
get modelView() { get modelView() {
@ -54,10 +70,9 @@ class DatePicker extends Component {
this._modelView = value; this._modelView = value;
this.input.value = value; this.input.value = value;
this._setModel(value); this._setModel(value);
this.$timeout(() => { this.mdlUpdate();
this.mdlUpdate();
}, 500);
} }
onClear() { onClear() {
this.modelView = null; this.modelView = null;
} }
@ -67,9 +82,11 @@ class DatePicker extends Component {
} }
} }
mdlUpdate() { mdlUpdate() {
let mdlField = this.element.firstChild.MaterialTextfield; this.$timeout(() => {
if (mdlField) let mdlField = this.element.firstChild.MaterialTextfield;
mdlField.updateClasses_(); if (mdlField)
mdlField.updateClasses_();
}, 500);
} }
_formatFlat2Angular(string) { // change string Flatpickr format to angular format (d-m-Y -> dd-MM-yyyy) _formatFlat2Angular(string) { // change string Flatpickr format to angular format (d-m-Y -> dd-MM-yyyy)
@ -193,6 +210,12 @@ class DatePicker extends Component {
this.vp = undefined; this.vp = undefined;
} }
$onChanges(objChange) {
if (objChange.iniOptions && objChange.iniOptions.currentValue) {
this.iniOptions = Object.assign(this.iniOptions, objChange.iniOptions.currentValue);
}
}
$onInit() { $onInit() {
this.initPicker(); this.initPicker();
} }