From: Zhiting Lin <zlin035@uottawa.ca>
Date: Mon, 21 Oct 2019 08:45:54 +0000 (+0800)
Subject: shown the correct chain gas amount for chain tranctions.
X-Git-Url: http://git.osdn.net/view?p=bytom%2Fbytom-electron.git;a=commitdiff_plain;h=4679b53da65b314de3dcde1a7c766d20a4a43351

shown the correct chain gas amount for chain tranctions.
---

diff --git a/src/features/shared/components/GasField/GasField.jsx b/src/features/shared/components/GasField/GasField.jsx
index 4037aaa..0480aff 100644
--- a/src/features/shared/components/GasField/GasField.jsx
+++ b/src/features/shared/components/GasField/GasField.jsx
@@ -20,21 +20,20 @@ class GasField extends React.Component {
   render() {
     const fieldProps = pick(this.props.fieldProps, TEXT_FIELD_PROPS)
     const {touched, error} = this.props.fieldProps
+    const chainGas = this.props.chainGas || 0
 
-    return(
-      <div className={`form-group ${styles.slider}`}>
-        <span>{normalizeBTMAmountUnit(btmID, fieldProps.value* this.props.gas, this.props.btmAmountUnit)}</span>
-        <input
-               type='range'
-               min={0}
-               max={3}
-               step='1'
-               {...fieldProps} />
+    return <div className={`form-group ${styles.slider}`}>
+      <span>{normalizeBTMAmountUnit(btmID, ( chainGas + fieldProps.value * this.props.gas ), this.props.btmAmountUnit)}</span>
+      <input
+        type='range'
+        min={0}
+        max={3}
+        step='1'
+        {...fieldProps} />
 
-        {touched && error && <span className='text-danger'><strong>{error}</strong></span>}
-        {this.props.hint && <span className='help-block'>{this.props.hint}</span>}
-      </div>
-    )
+      {touched && error && <span className='text-danger'><strong>{error}</strong></span>}
+      {this.props.hint && <span className='help-block'>{this.props.hint}</span>}
+    </div>
   }
 }
 
diff --git a/src/features/transactions/components/New/ConfirmModal/ConfirmModal.jsx b/src/features/transactions/components/New/ConfirmModal/ConfirmModal.jsx
index dab5bf0..d4d67c5 100644
--- a/src/features/transactions/components/New/ConfirmModal/ConfirmModal.jsx
+++ b/src/features/transactions/components/New/ConfirmModal/ConfirmModal.jsx
@@ -26,12 +26,13 @@ class ConfirmModal extends Component {
       cancel,
       error,
       gas,
+      chainGas,
       t,
       btmAmountUnit,
       assetDecimal
     } = this.props
 
-    const fee = Number(gasLevel.value * gas)
+    const fee = Number( (chainGas||0 ) + gasLevel.value * gas )
 
     const totalAmount = sum(receivers, 'amount.value')
 
diff --git a/src/features/transactions/components/New/NormalTransactionForm.jsx b/src/features/transactions/components/New/NormalTransactionForm.jsx
index 9de7074..d48e3b4 100644
--- a/src/features/transactions/components/New/NormalTransactionForm.jsx
+++ b/src/features/transactions/components/New/NormalTransactionForm.jsx
@@ -23,6 +23,7 @@ class NormalTxForm extends React.Component {
     this.connection = chainClient().connection
     this.state = {
       estimateGas:null,
+      chainGas: 0,
       counter: 1
     }
 
@@ -58,6 +59,7 @@ class NormalTxForm extends React.Component {
         cancel={this.props.closeModal}
         onSubmit={this.submitWithValidation}
         gas={this.state.estimateGas}
+        chainGas={this.state.chainGas}
         btmAmountUnit={this.props.btmAmountUnit}
         assetDecimal={assetDecimal}
         asset={this.props.asset}
@@ -105,27 +107,48 @@ class NormalTxForm extends React.Component {
     const noAccount = !accountAlias && !accountId
     const noAsset = !assetAlias && !assetId
 
-    if ( addresses.includes('') || amounts.includes(0)|| noAccount || noAsset) {
+    if ( addresses.includes('') || amounts.includes(NaN)|| amounts.includes(0)|| noAccount || noAsset) {
       this.setState({estimateGas: null})
       return
     }
 
+    const isBTM = (assetAlias==='BTM') || (assetId === btmID)
+
     const actions = normalTxActionBuilder(transaction, Math.pow(10, 7), 'amount' )
 
     const body = {actions, ttl: 1}
-    this.connection.request('/build-transaction', body).then(resp => {
-      return this.connection.request('/estimate-transaction-gas', {
-        transactionTemplate: resp.data
-      }).then(resp => {
-        this.setState({estimateGas: Math.ceil(resp.data.totalNeu/100000)*100000})
-      }).catch(err =>{
-        throw err
+    if(isBTM){
+      this.connection.request('/build-chain-transactions', body).then(resp => {
+        return this.connection.request('/estimate-chain-transaction-gas', {
+          transactionTemplates: resp.data
+        }).then(resp => {
+          this.setState({
+            estimateGas: Math.ceil(resp.data.totalNeu/100000)*100000,
+            chainGas: Math.ceil(resp.data.chainTxNeu/100000)*100000
+          })
+        }).catch(err =>{
+          throw err
+        })
+      }).catch(err=>{
+        this.setState({estimateGas: null, address: null})
+        const errorMsg =  err.code && i18n.exists(`btmError.${err.code}`) && t(`btmError.${err.code}`) || err.msg
+        this.props.showError(new Error(errorMsg))
       })
-    }).catch(err=>{
-      this.setState({estimateGas: null, address: null})
-      const errorMsg =  err.code && i18n.exists(`btmError.${err.code}`) && t(`btmError.${err.code}`) || err.msg
-      this.props.showError(new Error(errorMsg))
-    })
+    }else{
+      this.connection.request('/build-transaction', body).then(resp => {
+        return this.connection.request('/estimate-transaction-gas', {
+          transactionTemplate: resp.data
+        }).then(resp => {
+          this.setState({estimateGas: Math.ceil(resp.data.totalNeu/100000)*100000})
+        }).catch(err =>{
+          throw err
+        })
+      }).catch(err=>{
+        this.setState({estimateGas: null, address: null})
+        const errorMsg =  err.code && i18n.exists(`btmError.${err.code}`) && t(`btmError.${err.code}`) || err.msg
+        this.props.showError(new Error(errorMsg))
+      })
+    }
   }
 
   render() {
@@ -154,46 +177,46 @@ class NormalTxForm extends React.Component {
     const showBtmAmountUnit = (assetAlias.value === 'BTM' || assetId.value === btmID)
 
     return (
-          <TxContainer
-            error={error}
-            onSubmit={e => this.confirmedTransaction(e, assetDecimal)}
-            submitting={submitting}
-            submitLabel= {submitLabel}
-            disabled={this.disableSubmit()}
-            className={styles.container}
-          >
-          <div className={styles.borderBottom}>
-            <label className={styles.title}>{t('transaction.normal.from')}</label>
-            <div className={`${styles.mainBox} `}>
+      <TxContainer
+        error={error}
+        onSubmit={e => this.confirmedTransaction(e, assetDecimal)}
+        submitting={submitting}
+        submitLabel= {submitLabel}
+        disabled={this.disableSubmit()}
+        className={styles.container}
+      >
+        <div className={styles.borderBottom}>
+          <label className={styles.title}>{t('transaction.normal.from')}</label>
+          <div className={`${styles.mainBox} `}>
+            <ObjectSelectorField
+              key='account-selector-field'
+              keyIndex='normaltx-account'
+              title={t('form.account')}
+              aliasField={Autocomplete.AccountAlias}
+              fieldProps={{
+                id: accountId,
+                alias: accountAlias
+              }}
+            />
+            <div>
               <ObjectSelectorField
-                key='account-selector-field'
-                keyIndex='normaltx-account'
-                title={t('form.account')}
-                aliasField={Autocomplete.AccountAlias}
+                key='asset-selector-field'
+                keyIndex='normaltx-asset'
+                title={ t('form.asset')}
+                aliasField={Autocomplete.AssetAlias}
                 fieldProps={{
-                  id: accountId,
-                  alias: accountAlias
+                  id: assetId,
+                  alias: assetAlias
                 }}
               />
-              <div>
-                <ObjectSelectorField
-                  key='asset-selector-field'
-                  keyIndex='normaltx-asset'
-                  title={ t('form.asset')}
-                  aliasField={Autocomplete.AssetAlias}
-                  fieldProps={{
-                    id: assetId,
-                    alias: assetAlias
-                  }}
-                />
-                {showAvailableBalance && availableBalance &&
+              {showAvailableBalance && availableBalance &&
                 <small className={styles.balanceHint}>{t('transaction.normal.availableBalance')} {availableBalance}</small>}
-              </div>
             </div>
+          </div>
 
-            <label className={styles.title}>{t('transaction.normal.to')}</label>
+          <label className={styles.title}>{t('transaction.normal.to')}</label>
 
-            <div className={styles.mainBox}>
+          <div className={styles.mainBox}>
             {receivers.map((receiver, index) =>
               <div
                 className={this.props.tutorialVisible? styles.tutorialItem: styles.subjectField}
@@ -223,26 +246,27 @@ class NormalTxForm extends React.Component {
                 </button>
               </div>
             )}
-              <button
-                type='button'
-                className='btn btn-default'
-                onClick={this.addReceiverItem}
-              >
-                {t('commonWords.addField')}
-              </button>
-            </div>
+            <button
+              type='button'
+              className='btn btn-default'
+              onClick={this.addReceiverItem}
+            >
+              {t('commonWords.addField')}
+            </button>
+          </div>
 
-            <label className={styles.title}>{t('transaction.normal.selectFee')}</label>
-            <div className={styles.txFeeBox}>
-              <GasField
-                gas={this.state.estimateGas}
-                fieldProps={gasLevel}
-                btmAmountUnit={this.props.btmAmountUnit}
-              />
-              <span className={styles.feeDescription}> {t('transaction.normal.feeDescription')}</span>
-            </div>
+          <label className={styles.title}>{t('transaction.normal.selectFee')}</label>
+          <div className={styles.txFeeBox}>
+            <GasField
+              gas={this.state.estimateGas}
+              chainGas={this.state.chainGas}
+              fieldProps={gasLevel}
+              btmAmountUnit={this.props.btmAmountUnit}
+            />
+            <span className={styles.feeDescription}> {t('transaction.normal.feeDescription')}</span>
           </div>
-        </TxContainer>
+        </div>
+      </TxContainer>
     )
   }
 }