From a07cb5ef38d4d341ccfc6b3fd16e7fb71ddcbd82 Mon Sep 17 00:00:00 2001 From: Yuri Kuznetsov Date: Mon, 10 Apr 2023 15:17:06 +0300 Subject: [PATCH] range fields autonumeric --- .../metadata/fields/rangeCurrency.json | 12 ++- .../Resources/metadata/fields/rangeFloat.json | 12 ++- .../Resources/metadata/fields/rangeInt.json | 12 ++- client/src/views/fields/currency.js | 48 ------------ client/src/views/fields/float.js | 15 ---- client/src/views/fields/int.js | 15 ---- client/src/views/fields/range-currency.js | 59 +++++++++++---- client/src/views/fields/range-float.js | 30 +++++--- client/src/views/fields/range-int.js | 73 +++++++++++++------ 9 files changed, 145 insertions(+), 131 deletions(-) diff --git a/application/Espo/Resources/metadata/fields/rangeCurrency.json b/application/Espo/Resources/metadata/fields/rangeCurrency.json index d879b0c34c..6a12d9d839 100644 --- a/application/Espo/Resources/metadata/fields/rangeCurrency.json +++ b/application/Espo/Resources/metadata/fields/rangeCurrency.json @@ -5,10 +5,18 @@ ], "fields": { "from": { - "type": "currency" + "type": "currency", + "layoutAvailabilityList": [ + "filters", + "massUpdate" + ] }, "to": { - "type": "currency" + "type": "currency", + "layoutAvailabilityList": [ + "filters", + "massUpdate" + ] } }, "naming": "prefix", diff --git a/application/Espo/Resources/metadata/fields/rangeFloat.json b/application/Espo/Resources/metadata/fields/rangeFloat.json index c418801ace..b88813700e 100644 --- a/application/Espo/Resources/metadata/fields/rangeFloat.json +++ b/application/Espo/Resources/metadata/fields/rangeFloat.json @@ -5,10 +5,18 @@ ], "fields": { "from": { - "type": "float" + "type": "float", + "layoutAvailabilityList": [ + "filters", + "massUpdate" + ] }, "to": { - "type": "float" + "type": "float", + "layoutAvailabilityList": [ + "filters", + "massUpdate" + ] } }, "naming": "prefix", diff --git a/application/Espo/Resources/metadata/fields/rangeInt.json b/application/Espo/Resources/metadata/fields/rangeInt.json index 8bd09d1a98..b491f591df 100644 --- a/application/Espo/Resources/metadata/fields/rangeInt.json +++ b/application/Espo/Resources/metadata/fields/rangeInt.json @@ -5,10 +5,18 @@ ], "fields": { "from": { - "type": "int" + "type": "int", + "layoutAvailabilityList": [ + "filters", + "massUpdate" + ] }, "to": { - "type": "int" + "type": "int", + "layoutAvailabilityList": [ + "filters", + "massUpdate" + ] } }, "naming": "prefix", diff --git a/client/src/views/fields/currency.js b/client/src/views/fields/currency.js index 8ed9f5ad7d..ab72aff189 100644 --- a/client/src/views/fields/currency.js +++ b/client/src/views/fields/currency.js @@ -158,54 +158,6 @@ function (Dep, /** module:ui/select*/Select) { return this.formatNumberDetail(value); }, - /** - * @todo Remove. Used in range. - */ - formatNumberEdit: function (value) { - let currencyDecimalPlaces = this.decimalPlaces; - - if (value !== null) { - var parts = value.toString().split("."); - - parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, this.thousandSeparator); - - if (parts.length > 1) { - if ( - currencyDecimalPlaces && - parts[1].length < currencyDecimalPlaces - ) { - var limit = currencyDecimalPlaces - parts[1].length; - - for (var i = 0; i < limit; i++) { - parts[1] += '0'; - } - } - - if ( - this.params.decimal && - currencyDecimalPlaces && - parts[1].length > currencyDecimalPlaces - ) { - let i = parts[1].length - 1; - - while (i >= currencyDecimalPlaces) { - if (parts[1][i] !== '0') { - break; - } - - i--; - } - - parts[1] = parts[1].substring(0, i + 1); - } - } - - return parts.join(this.decimalMark); - } - - return ''; - }, - formatNumberDetail: function (value) { if (value !== null) { let currencyDecimalPlaces = this.decimalPlaces; diff --git a/client/src/views/fields/float.js b/client/src/views/fields/float.js index 9e5d360721..bc02272d4f 100644 --- a/client/src/views/fields/float.js +++ b/client/src/views/fields/float.js @@ -101,21 +101,6 @@ define('views/fields/float', ['views/fields/int'], function (Dep) { return this.formatNumberDetail(value); }, - /** - * @todo Remove. Used in range. - */ - formatNumberEdit: function (value) { - if (value === null) { - return ''; - } - - let parts = value.toString().split("."); - - parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, this.thousandSeparator); - - return parts.join(this.decimalMark); - }, - formatNumberDetail: function (value) { if (value === null) { return ''; diff --git a/client/src/views/fields/int.js b/client/src/views/fields/int.js index f9a777c286..9db95b3fcc 100644 --- a/client/src/views/fields/int.js +++ b/client/src/views/fields/int.js @@ -203,21 +203,6 @@ define('views/fields/int', ['views/fields/base', 'lib!autonumeric'], function (D return stringValue; }, - /** - * @todo Remove. Used in range. - */ - formatNumberEdit: function (value) { - if (value === null) { - return ''; - } - - let stringValue = value.toString(); - - stringValue = stringValue.replace(/\B(?=(\d{3})+(?!\d))/g, this.thousandSeparator); - - return stringValue; - }, - setupSearch: function () { this.events = _.extend({ 'change select.search-type': (e) => { diff --git a/client/src/views/fields/range-currency.js b/client/src/views/fields/range-currency.js index c5d9226fb0..63c17f8988 100644 --- a/client/src/views/fields/range-currency.js +++ b/client/src/views/fields/range-currency.js @@ -26,7 +26,8 @@ * these Appropriate Legal Notices must retain the display of the "EspoCRM" word. ************************************************************************/ -define('views/fields/range-currency', ['views/fields/range-float'], function (Dep, Float) { +define('views/fields/range-currency', +['views/fields/range-float', 'views/fields/currency', 'ui/select'], function (Dep, Currency, Select) { return Dep.extend({ @@ -55,46 +56,74 @@ define('views/fields/range-currency', ['views/fields/range-float'], function (De this.currencyField = this.name + 'Currency'; this.currencyList = this.getConfig().get('currencyList') || ['USD']; + this.decimalPlaces = this.getConfig().get('currencyDecimalPlaces'); + }, + + setupAutoNumericOptions: function () { + this.autoNumericOptions = { + digitGroupSeparator: this.thousandSeparator || '', + decimalCharacter: this.decimalMark, + modifyValueOnWheel: false, + selectOnFocus: false, + decimalPlaces: this.decimalPlaces, + allowDecimalPadding: true, + showWarnings: false, + formulaMode: true, + }; + + if (this.decimalPlaces === null) { + this.autoNumericOptions.decimalPlaces = this.decimalPlacesRawValue; + this.autoNumericOptions.decimalPlacesRawValue = this.decimalPlacesRawValue; + this.autoNumericOptions.allowDecimalPadding = false; + } }, afterRender: function () { Dep.prototype.afterRender.call(this); - if (this.mode === 'edit') { + if (this.mode === this.MODE_EDIT) { this.$currency = this.$el.find('[data-name="' + this.currencyField + '"]'); + + Select.init(this.$currency); } }, + formatNumber: function (value) { + return Currency.prototype.formatNumberDetail.call(this, value); + }, + getValueForDisplay: function () { - var fromValue = this.model.get(this.fromField); - var toValue = this.model.get(this.toField); + let fromValue = this.model.get(this.fromField); + let toValue = this.model.get(this.toField); fromValue = isNaN(fromValue) ? null : fromValue; toValue = isNaN(toValue) ? null : toValue; - var currencyValue = this.model.get(this.fromCurrencyField) || + let currencyValue = this.model.get(this.fromCurrencyField) || this.model.get(this.toCurrencyField); + let symbol = this.getMetadata().get(['app', 'currency', 'symbolMap', currencyValue]) || currencyValue; + if (fromValue !== null && toValue !== null) { return this.formatNumber(fromValue) + ' – ' + - this.formatNumber(toValue) + ' ' + currencyValue + ''; + this.formatNumber(toValue) + ' ' + symbol + ''; } - else if (fromValue) { - return '>= ' + this.formatNumber(fromValue) + ' '+currencyValue+''; + + if (fromValue) { + return '>= ' + this.formatNumber(fromValue) + ' ' + symbol+''; } - else if (toValue) { - return '<= ' + this.formatNumber(toValue) + ' '+currencyValue+''; - } - else { - return this.translate('None'); + + if (toValue) { + return '<= ' + this.formatNumber(toValue) + ' ' + symbol+''; } + + return this.translate('None'); }, fetch: function () { var data = Dep.prototype.fetch.call(this); - var currencyValue = this.$currency.val(); - + let currencyValue = this.$currency.val(); if (data[this.fromField] !== null) { data[this.fromCurrencyField] = currencyValue; diff --git a/client/src/views/fields/range-float.js b/client/src/views/fields/range-float.js index a3d7df393f..3724cde423 100644 --- a/client/src/views/fields/range-float.js +++ b/client/src/views/fields/range-float.js @@ -34,10 +34,26 @@ define('views/fields/range-float', ['views/fields/range-int', 'views/fields/floa validations: ['required', 'float', 'range', 'order'], + decimalPlacesRawValue: 10, + + setupAutoNumericOptions: function () { + this.autoNumericOptions = { + digitGroupSeparator: this.thousandSeparator || '', + decimalCharacter: this.decimalMark, + modifyValueOnWheel: false, + selectOnFocus: false, + decimalPlaces: this.decimalPlacesRawValue, + decimalPlacesRawValue: this.decimalPlacesRawValue, + allowDecimalPadding: false, + showWarnings: false, + formulaMode: true, + }; + }, + validateFloat: function () { - var validate = (name) => { + let validate = (name) => { if (isNaN(this.model.get(name))) { - var msg = this.translate('fieldShouldBeFloat', 'messages') + let msg = this.translate('fieldShouldBeFloat', 'messages') .replace('{field}', this.getLabelText()); this.showValidationMessage(msg, '[data-name="'+name+'"]'); @@ -46,7 +62,7 @@ define('views/fields/range-float', ['views/fields/range-int', 'views/fields/floa } }; - var result = false; + let result = false; result = validate(this.fromField) || result; result = validate(this.toField) || result; @@ -59,16 +75,8 @@ define('views/fields/range-float', ['views/fields/range-int', 'views/fields/floa }, formatNumber: function (value) { - return Float.prototype.formatNumber.call(this, value); - }, - - formatNumberDetail: function (value) { return Float.prototype.formatNumberDetail.call(this, value); }, - - formatNumberEdit: function (value) { - return Float.prototype.formatNumberEdit.call(this, value); - }, }); }); diff --git a/client/src/views/fields/range-int.js b/client/src/views/fields/range-int.js index 69d4eeec34..72991462fd 100644 --- a/client/src/views/fields/range-int.js +++ b/client/src/views/fields/range-int.js @@ -26,22 +26,21 @@ * these Appropriate Legal Notices must retain the display of the "EspoCRM" word. ************************************************************************/ -define('views/fields/range-int', ['views/fields/base', 'views/fields/int'], function (Dep, Int) { +define('views/fields/range-int', +['views/fields/base', 'views/fields/int', 'lib!autonumeric'], function (Dep, Int, AutoNumeric) { return Dep.extend({ type: 'rangeInt', listTemplate: 'fields/range-int/detail', - detailTemplate: 'fields/range-int/detail', - editTemplate: 'fields/range-int/edit', validations: ['required', 'int', 'range', 'order'], data: function () { - var data = Dep.prototype.data.call(this); + let data = Dep.prototype.data.call(this); data.ucName = Espo.Utils.upperCaseFirst(this.name); data.fromValue = this.model.get(this.fromField); @@ -60,8 +59,8 @@ define('views/fields/range-int', ['views/fields/base', 'views/fields/int'], func }, getValueForDisplay: function () { - var fromValue = this.model.get(this.fromField); - var toValue = this.model.get(this.toField); + let fromValue = this.model.get(this.fromField); + let toValue = this.model.get(this.toField); fromValue = isNaN(fromValue) ? null : fromValue; toValue = isNaN(toValue) ? null : toValue; @@ -100,10 +99,37 @@ define('views/fields/range-int', ['views/fields/base', 'views/fields/int'], func } }, + setupFinal: function () { + Dep.prototype.setupFinal.call(this); + + this.setupAutoNumericOptions(); + }, + + /** + * @protected + */ + setupAutoNumericOptions: function () { + let separator = (!this.disableFormatting ? this.thousandSeparator : null) || ''; + let decimalCharacter = '.'; + + if (separator === '.') { + decimalCharacter = ','; + } + + this.autoNumericOptions = { + digitGroupSeparator: separator, + decimalCharacter: decimalCharacter, + modifyValueOnWheel: false, + decimalPlaces: 0, + selectOnFocus: false, + formulaMode: true, + }; + }, + afterRender: function () { Dep.prototype.afterRender.call(this); - if (this.mode === 'edit') { + if (this.mode === this.MODE_EDIT) { this.$from = this.$el.find('[data-name="' + this.fromField + '"]'); this.$to = this.$el.find('[data-name="' + this.toField + '"]'); @@ -114,6 +140,11 @@ define('views/fields/range-int', ['views/fields/base', 'views/fields/int'], func this.$to.on('change', () => { this.trigger('change'); }); + + if (this.autoNumericOptions) { + this.autoNumericInstance1 = new AutoNumeric(this.$from.get(0), this.autoNumericOptions); + this.autoNumericInstance2 = new AutoNumeric(this.$to.get(0), this.autoNumericOptions); + } } }, @@ -131,7 +162,7 @@ define('views/fields/range-int', ['views/fields/base', 'views/fields/int'], func } }; - var result = false; + let result = false; result = validate(this.fromField) || result; result = validate(this.toField) || result; @@ -140,7 +171,7 @@ define('views/fields/range-int', ['views/fields/base', 'views/fields/int'], func }, validateInt: function () { - var validate = (name) => { + let validate = (name) => { if (isNaN(this.model.get(name))) { var msg = this.translate('fieldShouldBeInt', 'messages') .replace('{field}', this.getLabelText()); @@ -151,7 +182,7 @@ define('views/fields/range-int', ['views/fields/base', 'views/fields/int'], func } }; - var result = false; + let result = false; result = validate(this.fromField) || result; result = validate(this.toField) || result; @@ -160,7 +191,7 @@ define('views/fields/range-int', ['views/fields/base', 'views/fields/int'], func }, validateRange: function () { - var validate = (name) => { + let validate = (name) => { var value = this.model.get(name); if (value === null) { @@ -172,7 +203,7 @@ define('views/fields/range-int', ['views/fields/base', 'views/fields/int'], func if (minValue !== null && maxValue !== null) { if (value < minValue || value > maxValue ) { - var msg = this.translate('fieldShouldBeBetween', 'messages') + let msg = this.translate('fieldShouldBeBetween', 'messages') .replace('{field}', this.translate(name, 'fields', this.model.name)) .replace('{min}', minValue) .replace('{max}', maxValue); @@ -184,7 +215,7 @@ define('views/fields/range-int', ['views/fields/base', 'views/fields/int'], func } else { if (minValue !== null) { if (value < minValue) { - var msg = this.translate('fieldShouldBeLess', 'messages') + let msg = this.translate('fieldShouldBeLess', 'messages') .replace('{field}', this.translate(name, 'fields', this.model.name)) .replace('{value}', minValue); @@ -194,7 +225,7 @@ define('views/fields/range-int', ['views/fields/base', 'views/fields/int'], func } } else if (maxValue !== null) { if (value > maxValue) { - var msg = this.translate('fieldShouldBeGreater', 'messages') + let msg = this.translate('fieldShouldBeGreater', 'messages') .replace('{field}', this.translate(name, 'fields', this.model.name)) .replace('{value}', maxValue); @@ -206,7 +237,7 @@ define('views/fields/range-int', ['views/fields/base', 'views/fields/int'], func } }; - var result = false; + let result = false; result = validate(this.fromField) || result; result = validate(this.toField) || result; @@ -215,12 +246,12 @@ define('views/fields/range-int', ['views/fields/base', 'views/fields/int'], func }, validateOrder: function () { - var fromValue = this.model.get(this.fromField); - var toValue = this.model.get(this.toField); + let fromValue = this.model.get(this.fromField); + let toValue = this.model.get(this.toField); if (fromValue !== null && toValue !== null) { if (fromValue > toValue) { - var msg = this.translate('fieldShouldBeGreater', 'messages') + let msg = this.translate('fieldShouldBeGreater', 'messages') .replace('{field}', this.translate(this.toField, 'fields', this.model.name)) .replace('{value}', this.translate(this.fromField, 'fields', this.model.name)); @@ -241,11 +272,11 @@ define('views/fields/range-int', ['views/fields/base', 'views/fields/int'], func }, formatNumber: function (value) { - return value; + return Int.prototype.formatNumberDetail.call(this, value); }, - fetch: function (form) { - var data = {}; + fetch: function () { + let data = {}; data[this.fromField] = this.parse(this.$from.val().trim()); data[this.toField] = this.parse(this.$to.val().trim());