From 26eba9e0558e07f54aafc5d69d42a3513692e1fa Mon Sep 17 00:00:00 2001 From: mertsincan Date: Wed, 25 Aug 2021 17:51:25 +0300 Subject: [PATCH] Fixed #1441 and #1136 - Improve decimal separator behavior on InputNumber --- src/components/inputnumber/InputNumber.vue | 59 +++++++++++++++++++--- 1 file changed, 52 insertions(+), 7 deletions(-) diff --git a/src/components/inputnumber/InputNumber.vue b/src/components/inputnumber/InputNumber.vue index 9f7e82b431..be4688eafd 100755 --- a/src/components/inputnumber/InputNumber.vue +++ b/src/components/inputnumber/InputNumber.vue @@ -430,16 +430,25 @@ export default { this._decimal.lastIndex = 0; if (this.isNumeralChar(deleteChar)) { + const decimalLength = this.getDecimalLength(inputValue); + if (this._group.test(deleteChar)) { this._group.lastIndex = 0; newValueStr = inputValue.slice(0, selectionStart - 2) + inputValue.slice(selectionStart - 1); } else if (this._decimal.test(deleteChar)) { this._decimal.lastIndex = 0; - this.$refs.input.$el.setSelectionRange(selectionStart - 1, selectionStart - 1); + + if (decimalLength) { + this.$refs.input.$el.setSelectionRange(selectionStart - 1, selectionStart - 1); + } + else { + newValueStr = inputValue.slice(0, selectionStart - 1) + inputValue.slice(selectionStart); + } } else if (decimalCharIndex > 0 && selectionStart > decimalCharIndex) { - newValueStr = inputValue.slice(0, selectionStart - 1) + '0' + inputValue.slice(selectionStart); + const insertedText = (this.minFractionDigits || 0) < decimalLength ? '' : '0'; + newValueStr = inputValue.slice(0, selectionStart - 1) + insertedText + inputValue.slice(selectionStart); } else if (decimalCharIndex > 0 && decimalCharIndex === 1) { newValueStr = inputValue.slice(0, selectionStart - 1) + '0' + inputValue.slice(selectionStart); @@ -470,16 +479,25 @@ export default { this._decimal.lastIndex = 0; if (this.isNumeralChar(deleteChar)) { + const decimalLength = this.getDecimalLength(inputValue); + if (this._group.test(deleteChar)) { this._group.lastIndex = 0; newValueStr = inputValue.slice(0, selectionStart) + inputValue.slice(selectionStart + 2); } else if (this._decimal.test(deleteChar)) { this._decimal.lastIndex = 0; - this.$refs.input.$el.setSelectionRange(selectionStart + 1, selectionStart + 1); + + if (decimalLength) { + this.$refs.input.$el.setSelectionRange(selectionStart + 1, selectionStart + 1); + } + else { + newValueStr = inputValue.slice(0, selectionStart) + inputValue.slice(selectionStart + 1); + } } else if (decimalCharIndex > 0 && selectionStart > decimalCharIndex) { - newValueStr = inputValue.slice(0, selectionStart) + '0' + inputValue.slice(selectionStart + 1); + const insertedText = (this.minFractionDigits || 0) < decimalLength ? '' : '0'; + newValueStr = inputValue.slice(0, selectionStart) + insertedText + inputValue.slice(selectionStart + 1); } else if (decimalCharIndex > 0 && decimalCharIndex === 1) { newValueStr = inputValue.slice(0, selectionStart) + '0' + inputValue.slice(selectionStart + 1); @@ -576,6 +594,10 @@ export default { newValueStr = this.insertText(inputValue, text, selectionStart, selectionEnd); this.updateValue(event, newValueStr, text, 'insert'); } + else if (decimalCharIndex === -1 && this.maxFractionDigits) { + newValueStr = this.insertText(inputValue, text, selectionStart, selectionEnd); + this.updateValue(event, newValueStr, text, 'insert'); + } } else { const maxFractionDigits = this.numberFormat.resolvedOptions().maximumFractionDigits; @@ -594,7 +616,7 @@ export default { } }, insertText(value, text, start, end) { - let textSplit = text.split('.'); + let textSplit = text === '.' ? text : text.split('.'); if (textSplit.length === 2) { const decimalCharIndex = value.slice(start, end).search(this._decimal); @@ -696,7 +718,7 @@ export default { if (valueStr != null) { newValue = this.parseValue(valueStr); - this.updateInput(newValue, insertedValueStr, operation); + this.updateInput(newValue, insertedValueStr, operation, valueStr); this.handleOnInput(event, currentValue, newValue); } @@ -733,13 +755,17 @@ export default { return value; }, - updateInput(value, insertedValueStr, operation) { + updateInput(value, insertedValueStr, operation, valueStr) { insertedValueStr = insertedValueStr || ''; let inputValue = this.$refs.input.$el.value; let newValue = this.formatValue(value); let currentLength = inputValue.length; + if (newValue !== valueStr) { + newValue = this.concatValues(newValue, valueStr); + } + if (currentLength === 0) { this.$refs.input.$el.value = newValue; this.$refs.input.$el.setSelectionRange(0, 0); @@ -800,6 +826,25 @@ export default { this.$refs.input.$el.setAttribute('aria-valuenow', value); }, + concatValues(val1, val2) { + if (val1 !== null && val2 !== null) { + let decimalCharIndex = val2.search(this._decimal); + this._decimal.lastIndex = 0; + + return val1.split(this._decimal)[0] + (decimalCharIndex !== -1 ? val2.slice(decimalCharIndex) : ''); + } + + return val1; + }, + getDecimalLength(value) { + if (value) { + const valueSplit = value.split(this._decimal); + + return valueSplit.length === 2 ? valueSplit[1].length : 0; + } + + return 0; + }, updateModel(event, value) { this.$emit('update:modelValue', value); },