add the asset decimal function in transaction page.

diff --git a/src/features/shared/components/AmountInputMask/AmountInputMask.jsx b/src/features/shared/components/AmountInputMask/AmountInputMask.jsx
new file mode 100644 (file)
index 0000000..f5e403c
--- /dev/null
+++ b/src/features/shared/components/AmountInputMask/AmountInputMask.jsx
@@ -0,0 +1,74 @@
+import React from 'react'
+import { parseBTMAmount, formatBTMAmount, addZeroToDecimalPosition } from 'utility/buildInOutDisplay'
+import { FieldLabel } from 'features/shared/components'
+import pick from 'lodash/pick'
+
+
+const TEXT_FIELD_PROPS = [
+  'value',
+  'onBlur',
+  'onChange',
+  'onFocus',
+  'name'
+]
+
+class AmountInputMask extends React.Component {
+  constructor(props) {
+    super(props)
+
+    this.state = {
+      value: props.fieldProps.value,
+    }
+
+    this.handleChange = this.handleChange.bind(this)
+    this.handleBlur = this.handleBlur.bind(this)
+  }
+
+
+  handleBlur(event) {
+    const value = event.target.value
+    this.setState({ value: addZeroToDecimalPosition( value, this.props.decimal ) })
+    if (this.props.fieldProps.onBlur) {
+      // Swallow the event to prevent Redux Form from
+      // extracting the form value
+      this.props.fieldProps.onBlur()
+    }
+  }
+
+  handleChange(event) {
+    const value = event.target.value
+    // Update the internal state to trigger a re-render
+    // using the formatted value
+    this.setState({ value: value })
+    if (this.props.fieldProps.onChange) {
+      // Notify the normalized value
+      this.props.fieldProps.onChange(
+        parseBTMAmount(value, this.props.decimal )
+      )
+    }
+  }
+
+  render() {
+    const fieldProps = pick(this.props.fieldProps, TEXT_FIELD_PROPS)
+    const {touched, error} = this.props.fieldProps
+
+    return(
+      <div className='form-group'>
+        {this.props.title && <FieldLabel>{this.props.title}</FieldLabel>}
+          <input className='form-control'
+            type={'text'}
+            {...fieldProps}
+            value={formatBTMAmount(this.state.value, this.props.decimal)}
+            placeholder={this.props.placeholder}
+            autoFocus={!!this.props.autoFocus}
+            onBlur={this.handleBlur}
+            onChange={this.handleChange}
+          />
+        {touched && error && <span className='text-danger'><strong>{error}</strong></span>}
+        {this.props.hint && <span className='help-block'>{this.props.hint}</span>}
+      </div>
+    )
+  }
+}
+
+export default AmountInputMask

diff --git a/src/features/shared/components/index.js b/src/features/shared/components/index.js
index 52745ab..d2d8a1d 100644 (file)
--- a/src/features/shared/components/index.js
+++ b/src/features/shared/components/index.js
@@ -1,4 +1,5 @@
 import AmountUnitField from './AmountUnitField/AmountUnitField'
+import AmountInputMask from './AmountInputMask/AmountInputMask'
 import CheckboxField from './CheckboxField/CheckboxField'
 import Autocomplete from './Autocomplete'
 import BaseUpdate from './BaseUpdate'
@@ -34,6 +35,7 @@ import XpubField from './XpubField/XpubField'
 
 export {
   AmountUnitField,
+  AmountInputMask,
   CheckboxField,
   Autocomplete,
   BaseUpdate,

diff --git a/src/features/transactions/components/New/New.jsx b/src/features/transactions/components/New/New.jsx
index bab6956..015c896 100644 (file)
--- a/src/features/transactions/components/New/New.jsx
+++ b/src/features/transactions/components/New/New.jsx
@@ -6,7 +6,8 @@ import {
   TextField,
   Autocomplete,
   ObjectSelectorField,
-  AmountUnitField
+  AmountUnitField,
+  AmountInputMask
 } from 'features/shared/components'
 import {DropdownButton, MenuItem} from 'react-bootstrap'
 import {reduxForm} from 'redux-form'
@@ -14,7 +15,7 @@ import ActionItem from './FormActionItem'
 import React from 'react'
 import styles from './New.scss'
 import actions from 'actions'
-import { normalizeBTMAmountUnit } from 'utility/buildInOutDisplay'
+import { normalizeBTMAmountUnit, converIntToDec } from 'utility/buildInOutDisplay'
 
 const rangeOptions = [
   {
@@ -68,7 +69,7 @@ class Form extends React.Component {
     this.props.fields.normalTransaction.gas.price.onChange(rangeOptions[0].value)
   }
 
-  balanceAmount(normalTransaction) {
+  balanceAmount(normalTransaction, assetdecimal) {
     let balances = this.props.balances
     let filteredBalances = balances
     if (normalTransaction.accountAlias.value) {
@@ -84,7 +85,17 @@ class Form extends React.Component {
       filteredBalances = filteredBalances.filter(balance => balance.assetId === normalTransaction.assetId.value)
     }
 
-    return filteredBalances.length === 1 ? normalizeBTMAmountUnit(filteredBalances[0].assetId, filteredBalances[0].amount, this.props.btmAmountUnit) : null
+    if(filteredBalances.length === 1){
+      if (filteredBalances[0].assetId === btmID){
+        return normalizeBTMAmountUnit(filteredBalances[0].assetId, filteredBalances[0].amount, this.props.btmAmountUnit)
+      }else if( assetdecimal ){
+        return converIntToDec(filteredBalances[0].amount, assetdecimal)
+      }else{
+        return filteredBalances[0].amount
+      }
+    }else {
+      return null
+    }
   }
 
   assetDecimal(normalTransaction) {
@@ -182,14 +193,16 @@ class Form extends React.Component {
       const range = rangeOptions.find(item => item.label === event.target.value)
       normalTransaction.gas.price.onChange(range.value)
     }
+    const assetDecimal = this.assetDecimal(normalTransaction)
 
     const showAvailableBalance = (normalTransaction.accountAlias.value || normalTransaction.accountId.value) &&
       (normalTransaction.assetAlias.value || normalTransaction.assetId.value)
-    const availableBalance = this.balanceAmount(normalTransaction)
+    const availableBalance = this.balanceAmount(normalTransaction, assetDecimal)
 
     const showBtmAmountUnit = (normalTransaction.assetAlias.value === 'BTM' ||
       normalTransaction.assetId.value === 'ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff')
 
+
     return (
       <FormContainer
         error={error}
@@ -250,9 +263,12 @@ class Form extends React.Component {
           <label className={styles.title}>{lang === 'zh' ? '至' : 'To'}</label>
           <div className={styles.main}>
             <TextField title={lang === 'zh' ? '地址' : 'Address'} fieldProps={normalTransaction.address}/>
-            {!showBtmAmountUnit &&
+            {!showBtmAmountUnit && !assetDecimal &&
             <TextField title={lang === 'zh' ? '数量' : 'Amount'} fieldProps={normalTransaction.amount}
             />}
+            {!showBtmAmountUnit && assetDecimal &&
+            <AmountInputMask title={lang === 'zh' ? '数量' : 'Amount'} fieldProps={normalTransaction.amount} decimal={assetDecimal}
+            />}
             {showBtmAmountUnit &&
             <AmountUnitField title={lang === 'zh' ? '数量' : 'Amount'} fieldProps={normalTransaction.amount}/>
             }

diff --git a/src/utility/buildInOutDisplay.js b/src/utility/buildInOutDisplay.js
index 726da18..30ffc40 100644 (file)
--- a/src/utility/buildInOutDisplay.js
+++ b/src/utility/buildInOutDisplay.js
@@ -135,8 +135,8 @@ const buildDisplay = (item, fields, btmAmountUnit, lang) => {
 
 const addZeroToDecimalPos = (src,pos) => {
   if(src != null ){
-    let srcString = src.toString()
-    var rs = srcString.indexOf('.')
+    let srcString = (src == '') ?  '0' : src.toString()
+    let rs = srcString.indexOf('.')
     if (rs < 0) {
       rs = srcString.length
       srcString += '.'
@@ -152,8 +152,13 @@ const addZeroToDecimalPos = (src,pos) => {
 const formatIntNumToPosDecimal = (neu,pos) => {
   if(neu != null ){
     let neuString = neu.toString()
-    if(neuString.length<=8){
-      return addZeroToDecimalPos((neu/Math.pow(10, pos)), pos)
+    let neuLength = neuString.length
+    if(neuLength <= pos){
+      let zeros = ''
+      while(zeros.length < pos - neuLength){
+        zeros += '0'
+      }
+      return '0.'+ zeros + neuString
     }else {
       return neuString.slice(0, -pos) + '.' + neuString.slice(-pos)
     }