fix: #261 q-numeric with 0.1 step lacks rounding

Add "max-decimals" prop.
quasarframework · Dec 18, 2016 · 23d1a4d · 23d1a4d
1 parent 25cd706
commit 23d1a4d
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 3 deletions.
diff --git a/dev/components/form/numeric.vue b/dev/components/form/numeric.vue
@@ -5,9 +5,15 @@
         Model <span class="right-detail"><em>{{number}}</em> &nbsp;&nbsp;({{min}}-{{max}})</span>
       </div>
 
-      <p class="caption">Standalone</p>
+      <p class="caption">Default</p>
       <q-numeric v-model="number" :min="min" :max="max"></q-numeric>
 
+      <p class="caption">With Step 4</p>
+      <q-numeric v-model="number" :min="min" :max="max" :step="4"></q-numeric>
+
+      <p class="caption">With Step 0.2 & Maximum decimals 2</p>
+      <q-numeric v-model="numberPrecision" :min="min" :max="max" :step="0.2" :max-decimals="2"></q-numeric>
+
       <p class="caption">Disabled State</p>
       <q-numeric v-model="number" :min="min" :max="max" disable></q-numeric>
 
@@ -44,6 +50,7 @@ export default {
   data () {
     return {
       number: 3,
+      numberPrecision: 5.15,
       min: 1,
       max: 1017
     }

diff --git a/src/vue-components/numeric/Numeric.vue b/src/vue-components/numeric/Numeric.vue
@@ -33,7 +33,11 @@ export default {
     min: Number,
     max: Number,
     readonly: Boolean,
-    disable: Boolean
+    disable: Boolean,
+    maxDecimals: {
+      type: Number,
+      default: 0
+    }
   },
   watch: {
     value () {
@@ -53,7 +57,8 @@ export default {
       else if (typeof this.max === 'number' && value > this.max) {
         return this.max
       }
-      return value
+
+      return parseFloat(this.maxDecimals ? parseFloat(value).toFixed(this.maxDecimals) : value)
     },
     __updateValue () {
       this.model = this.__normalize(this.model)