Merge pull request #592 from dod-ccpo/clin-decimals-fixes

CLIN Input field bugfixes

js/components/text_input.js

@@ -1,5 +1,6 @@
 import MaskedInput, { conformToMask } from 'vue-text-mask'
 import inputValidations from '../lib/input_validations'
+import { formatDollars } from '../lib/dollars'
 
 export default {
   name: 'textinput',
@@ -78,6 +79,9 @@ export default {
     onChange: function(e) {
       // Only invalidate the field when it blurs
       this._checkIfValid({ value: e.target.value, invalidate: true })
+      if (this.validation === 'dollars') {
+        this.value = formatDollars(this._rawValue(e.target.value))
+      }
     },
 
     //

js/lib/dollars.js

@@ -1,8 +1,14 @@
 export const formatDollars = (value, cents = true) => {
   if (typeof value === 'number') {
-    return cents
-      ? `$${value.toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,')}`
-      : `$${value.toFixed(0).replace(/\d(?=(\d{3})+(?!\d))/g, '$&,')}`
+    return value.toLocaleString('us-US', {
+      style: 'currency',
+      currency: 'USD',
+    })
+  } else if (typeof value === 'string') {
+    return parseFloat(value).toLocaleString('us-US', {
+      style: 'currency',
+      currency: 'USD',
+    })
   }
   return ''
 }