[IMP] web: update datepicker syntax with the new guidelines
This commit is contained in:
@@ -345,7 +345,7 @@ var FieldDate = InputField.extend({
|
|||||||
* @private
|
* @private
|
||||||
*/
|
*/
|
||||||
_doDebouncedAction: function () {
|
_doDebouncedAction: function () {
|
||||||
this.datewidget.change_datetime();
|
this.datewidget.changeDatetime();
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -354,7 +354,7 @@ var FieldDate = InputField.extend({
|
|||||||
* @private
|
* @private
|
||||||
*/
|
*/
|
||||||
_getValue: function () {
|
_getValue: function () {
|
||||||
return this.datewidget.get_value();
|
return this.datewidget.getValue();
|
||||||
},
|
},
|
||||||
/**
|
/**
|
||||||
* @override
|
* @override
|
||||||
@@ -383,7 +383,7 @@ var FieldDate = InputField.extend({
|
|||||||
* @private
|
* @private
|
||||||
*/
|
*/
|
||||||
_renderEdit: function () {
|
_renderEdit: function () {
|
||||||
this.datewidget.set_value(this.value);
|
this.datewidget.setValue(this.value);
|
||||||
this.$input = this.datewidget.$input;
|
this.$input = this.datewidget.$input;
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -412,7 +412,7 @@ var FieldDateTime = FieldDate.extend({
|
|||||||
* @private
|
* @private
|
||||||
*/
|
*/
|
||||||
_getValue: function () {
|
_getValue: function () {
|
||||||
var value = this.datewidget.get_value();
|
var value = this.datewidget.getValue();
|
||||||
return value && value.add(-this.getSession().tzOffset, 'minutes');
|
return value && value.add(-this.getSession().tzOffset, 'minutes');
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -435,7 +435,7 @@ var FieldDateTime = FieldDate.extend({
|
|||||||
*/
|
*/
|
||||||
_renderEdit: function () {
|
_renderEdit: function () {
|
||||||
var value = this.value && this.value.clone().add(this.getSession().tzOffset, 'minutes');
|
var value = this.value && this.value.clone().add(this.getSession().tzOffset, 'minutes');
|
||||||
this.datewidget.set_value(value);
|
this.datewidget.setValue(value);
|
||||||
this.$input = this.datewidget.$input;
|
this.$input = this.datewidget.$input;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
@@ -12,10 +12,13 @@ var DateWidget = Widget.extend({
|
|||||||
template: "web.datepicker",
|
template: "web.datepicker",
|
||||||
type_of_date: "date",
|
type_of_date: "date",
|
||||||
events: {
|
events: {
|
||||||
'dp.change': 'change_datetime',
|
'dp.change': 'changeDatetime',
|
||||||
'dp.show': 'set_datetime_default',
|
'dp.show': '_onShow',
|
||||||
'change .o_datepicker_input': 'change_datetime',
|
'change .o_datepicker_input': 'changeDatetime',
|
||||||
},
|
},
|
||||||
|
/**
|
||||||
|
* @override
|
||||||
|
*/
|
||||||
init: function(parent, options) {
|
init: function(parent, options) {
|
||||||
this._super.apply(this, arguments);
|
this._super.apply(this, arguments);
|
||||||
|
|
||||||
@@ -41,6 +44,9 @@ var DateWidget = Widget.extend({
|
|||||||
keyBinds: null,
|
keyBinds: null,
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
/**
|
||||||
|
* @override
|
||||||
|
*/
|
||||||
start: function() {
|
start: function() {
|
||||||
this.$input = this.$('input.o_datepicker_input');
|
this.$input = this.$('input.o_datepicker_input');
|
||||||
this.$input.focus(function(e) {
|
this.$input.focus(function(e) {
|
||||||
@@ -49,67 +55,120 @@ var DateWidget = Widget.extend({
|
|||||||
this.$input.datetimepicker(this.options);
|
this.$input.datetimepicker(this.options);
|
||||||
this.picker = this.$input.data('DateTimePicker');
|
this.picker = this.$input.data('DateTimePicker');
|
||||||
this.$input.click(this.picker.toggle.bind(this.picker));
|
this.$input.click(this.picker.toggle.bind(this.picker));
|
||||||
this.set_readonly(false);
|
this._setReadonly(false);
|
||||||
},
|
},
|
||||||
set_value: function(value) {
|
/**
|
||||||
this.set({'value': value});
|
* @override
|
||||||
var formatted_value = value ? this.format_client(value) : null;
|
*/
|
||||||
this.$input.val(formatted_value);
|
destroy: function() {
|
||||||
if (this.picker) {
|
this.picker.destroy();
|
||||||
this.picker.date(value || null);
|
this._super.apply(this, arguments);
|
||||||
|
},
|
||||||
|
|
||||||
|
//--------------------------------------------------------------------------
|
||||||
|
// Public
|
||||||
|
//--------------------------------------------------------------------------
|
||||||
|
|
||||||
|
/**
|
||||||
|
* set datetime value
|
||||||
|
*/
|
||||||
|
changeDatetime: function () {
|
||||||
|
if(this.isValid()) {
|
||||||
|
this._setValueFromUi();
|
||||||
|
this.trigger("datetime_changed");
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
get_value: function() {
|
/**
|
||||||
|
* @returns {Moment|false}
|
||||||
|
*/
|
||||||
|
getValue: function () {
|
||||||
var value = this.get('value');
|
var value = this.get('value');
|
||||||
return value && value.clone();
|
return value && value.clone();
|
||||||
},
|
},
|
||||||
set_value_from_ui: function() {
|
/**
|
||||||
var value = this.$input.val() || false;
|
* @returns {boolean}
|
||||||
this.set_value(this.parse_client(value));
|
*/
|
||||||
},
|
isValid: function () {
|
||||||
set_readonly: function(readonly) {
|
|
||||||
this.readonly = readonly;
|
|
||||||
this.$input.prop('readonly', this.readonly);
|
|
||||||
},
|
|
||||||
is_valid: function() {
|
|
||||||
var value = this.$input.val();
|
var value = this.$input.val();
|
||||||
if(value === "") {
|
if(value === "") {
|
||||||
return true;
|
return true;
|
||||||
} else {
|
} else {
|
||||||
try {
|
try {
|
||||||
this.parse_client(value);
|
this._parseClient(value);
|
||||||
return true;
|
return true;
|
||||||
} catch(e) {
|
} catch(e) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
parse_client: function(v) {
|
/**
|
||||||
return field_utils.parse[this.type_of_date](v, null, {timezone: false});
|
* @param {Moment|false}
|
||||||
|
*/
|
||||||
|
setValue: function (value) {
|
||||||
|
this.set({'value': value});
|
||||||
|
var formatted_value = value ? this._formatClient(value) : null;
|
||||||
|
this.$input.val(formatted_value);
|
||||||
|
if (this.picker) {
|
||||||
|
this.picker.date(value || null);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
format_client: function(v) {
|
|
||||||
|
//--------------------------------------------------------------------------
|
||||||
|
// Private
|
||||||
|
//--------------------------------------------------------------------------
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @private
|
||||||
|
* @param {Moment}
|
||||||
|
* @returns {string}
|
||||||
|
*/
|
||||||
|
_formatClient: function (v) {
|
||||||
return field_utils.format[this.type_of_date](v, null, {timezone: false});
|
return field_utils.format[this.type_of_date](v, null, {timezone: false});
|
||||||
},
|
},
|
||||||
set_datetime_default: function() {
|
/**
|
||||||
|
* @private
|
||||||
|
* @param {string|false}
|
||||||
|
* @returns {Moment}
|
||||||
|
*/
|
||||||
|
_parseClient: function (v) {
|
||||||
|
return field_utils.parse[this.type_of_date](v, null, {timezone: false});
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* @private
|
||||||
|
* @param {boolean}
|
||||||
|
*/
|
||||||
|
_setReadonly: function (readonly) {
|
||||||
|
this.readonly = readonly;
|
||||||
|
this.$input.prop('readonly', this.readonly);
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* set the value from the input value
|
||||||
|
*
|
||||||
|
* @private
|
||||||
|
*/
|
||||||
|
_setValueFromUi: function() {
|
||||||
|
var value = this.$input.val() || false;
|
||||||
|
this.setValue(this._parseClient(value));
|
||||||
|
},
|
||||||
|
|
||||||
|
//--------------------------------------------------------------------------
|
||||||
|
// Handlers
|
||||||
|
//--------------------------------------------------------------------------
|
||||||
|
|
||||||
|
/**
|
||||||
|
* set the date of the picker by the current date or the today date
|
||||||
|
*
|
||||||
|
* @private
|
||||||
|
*/
|
||||||
|
_onShow: function () {
|
||||||
//when opening datetimepicker the date and time by default should be the one from
|
//when opening datetimepicker the date and time by default should be the one from
|
||||||
//the input field if any or the current day otherwise
|
//the input field if any or the current day otherwise
|
||||||
var value = moment().second(0);
|
var value = moment().second(0);
|
||||||
if(this.$input.val().length !== 0 && this.is_valid()) {
|
if(this.$input.val().length !== 0 && this.isValid()) {
|
||||||
value = this.parse_client(this.$input.val());
|
value = this._parseClient(this.$input.val());
|
||||||
}
|
}
|
||||||
|
|
||||||
this.picker.date(value);
|
this.picker.date(value);
|
||||||
},
|
},
|
||||||
change_datetime: function() {
|
|
||||||
if(this.is_valid()) {
|
|
||||||
this.set_value_from_ui();
|
|
||||||
this.trigger("datetime_changed");
|
|
||||||
}
|
|
||||||
},
|
|
||||||
destroy: function() {
|
|
||||||
this.picker.destroy();
|
|
||||||
this._super.apply(this, arguments);
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
|
|
||||||
var DateTimeWidget = DateWidget.extend({
|
var DateTimeWidget = DateWidget.extend({
|
||||||
|
|||||||
@@ -660,9 +660,9 @@ var DomainLeaf = DomainNode.extend({
|
|||||||
this.valueWidget = new (selectedField.type === "datetime" ? datepicker.DateTimeWidget : datepicker.DateWidget)(this);
|
this.valueWidget = new (selectedField.type === "datetime" ? datepicker.DateTimeWidget : datepicker.DateWidget)(this);
|
||||||
wDefs.push(this.valueWidget.appendTo("<div/>").then((function () {
|
wDefs.push(this.valueWidget.appendTo("<div/>").then((function () {
|
||||||
this.valueWidget.$el.addClass("o_domain_leaf_value_input");
|
this.valueWidget.$el.addClass("o_domain_leaf_value_input");
|
||||||
this.valueWidget.set_value(moment(this.value));
|
this.valueWidget.setValue(moment(this.value));
|
||||||
this.valueWidget.on("datetime_changed", this, function () {
|
this.valueWidget.on("datetime_changed", this, function () {
|
||||||
this._changeValue(this.valueWidget.get_value());
|
this._changeValue(this.valueWidget.getValue());
|
||||||
});
|
});
|
||||||
}).bind(this)));
|
}).bind(this)));
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user