@ -1,7 +1,7 @@
import React from 'react' ;
import { translate } from '../../translate/translate' ;
//import { } from '../../actions/actionCreators';
//import Store from '../../store';
import { sendToAddress } from '../../actions/actionCreators' ;
import Store from '../../store' ;
// TODO: implement logic
@ -10,17 +10,65 @@ class SendCoin extends React.Component {
super ( props ) ;
this . state = {
currentStep : 0 ,
sendFrom : this . props . Dashboard && this . props . Dashboard . activeHandle ? this . props . Dashboard . activeHandle [ this . props . ActiveCoin . coin ] : null ,
sendFromAmount : 0 ,
sendTo : null ,
amount : 0 ,
fee : 0.0001 ,
sendSig : false ,
} ;
this . updateInput = this . updateInput . bind ( this ) ;
this . handleSubmit = this . handleSubmit . bind ( this ) ;
this . toggleSendSig = this . toggleSendSig . bind ( this ) ;
}
changeSendCoinStep ( step ) {
this . setState ( Object . assign ( { } , this . state , {
currentStep : step ,
} ) ) ;
if ( step === 2 ) {
Store . dispatch ( sendToAddress ( this . props . ActiveCoin . coin , this . state ) ) ;
}
}
toggleSendSig ( ) {
this . setState ( Object . assign ( { } , this . state , {
sendSig : ! this . state . sendSig ,
} ) ) ;
}
updateInput ( e ) {
this . setState ( {
[ e . target . name ] : e . target . value ,
} ) ;
console . log ( this . state ) ;
}
handleSubmit ( ) {
Store . dispatch ( sendNativeTx ( this . props . ActiveCoin . coin , this . state ) ) ;
setTimeout ( function ( ) {
Store . dispatch ( getKMDOPID ( null , this . props . ActiveCoin . coin ) ) ;
} , 1000 ) ;
}
renderSendCoinResponse ( ) {
if ( this . props . ActiveCoin . lastSendToResponse ) {
return Object . keys ( this . props . ActiveCoin . lastSendToResponse ) . map ( ( key , index ) =>
< tr key = { key } >
< td > { key } < / t d >
< td > { key === 'signedtx' ? (
this . props . ActiveCoin . lastSendToResponse [ key ] . substring ( 0 , this . props . ActiveCoin . lastSendToResponse [ key ] . length / 3 ) + ' ' +
this . props . ActiveCoin . lastSendToResponse [ key ] . substring ( this . props . ActiveCoin . lastSendToResponse [ key ] . length / 3 , this . props . ActiveCoin . lastSendToResponse [ key ] . length * 2 / 3 ) ) : this . props . ActiveCoin . lastSendToResponse [ key ] } < / t d >
< / t r >
) ;
} else {
return null ;
}
}
render ( ) {
if ( this . props && this . props . send && this . props . mode !== 'native' ) {
if ( this . props . ActiveCoin && this . props . ActiveCoin . send && this . props . ActiveCoin . mode !== 'native' ) {
return (
< div className = "col-sm-12 padding-top-10" data - edexcoin = "COIN" id = "edexcoin_send" >
< div className = "col-xlg-12 col-md-12 col-sm-12 col-xs-12" >
@ -51,49 +99,44 @@ class SendCoin extends React.Component {
< div className = { this . state . currentStep === 0 ? 'panel' : 'panel hide' } id = "edexcoin-send-screen" >
< div className = "panel-heading" >
< h3 data - edexcoin = "COIN" className = "panel-title" >
{ translate ( 'INDEX.SEND' ) } < span data - edexcoin = "COIN" > < / s p a n >
{ translate ( 'INDEX.SEND' ) } { this . props . ActiveCoin . coin }
< / h 3 >
< div className = "panel-actions" >
< a href = "javascript:void(0)" className = "dropdown-toggle white btn-xs btn-info btn_refresh_edexcoin_send" data - edexcoin = "COIN" aria - expanded = "false" role = "button" >
< i className = "icon fa-refresh margin-right-10" aria - hidden = "true" > < / i > { t r a n s l a t e ( ' I N D E X . R E F R E S H _ F U N D S ' ) }
< / a >
< / d i v >
< / d i v >
< div className = "panel-body container-fluid" >
< form className = "edexcoin-send-form" data - edexcoin = "COIN" method = "post" role = "form" autoComplete = "off" >
< div className = "row" >
< div className = "col-xlg-12 form-group form-material edexcoin_send_from_for_basilisk" >
< div className = { this . props . ActiveCoin . mode === 'basilisk' ? 'col-xlg-12 form-group form-material' : 'hide' } >
< label className = "control-label" data - edexcoin = "COIN" htmlFor = "edexcoin_send_from" > { translate ( 'INDEX.SEND_FROM' ) } < / l a b e l >
< select className = "form-control form-material showedexcoinaddrs show-tick" data - edexcoin = "COIN" id = "edexcoin_send_from" title = "Select Transparent or Private Address" data - size = "5" > < / s e l e c t >
< select className = "form-control form-material showedexcoinaddrs show-tick" data - edexcoin = "COIN" id = "edexcoin_send_from" onChange = { this . updateInput } title = "Select Transparent or Private Address" data - size = "5" > < / s e l e c t >
< / d i v >
< div className = "col-xlg-12 form-group form-material" >
< label className = "control-label" data - edexcoin = "COIN" htmlFor = "edexcoin_sendto" > { translate ( 'INDEX.SEND_TO' ) } < / l a b e l >
< input type = "text" className = "form-control" data - edexcoin = "COIN" id = "edexcoin_sendto" name = "edexcoin_sendt o" placeholder = "Enter address" autoComplete = "off" required / >
< input type = "text" className = "form-control" data - edexcoin = "COIN" id = "edexcoin_sendto" name = "sendT o" placeholder = "Enter address" autoComplete = "off" onChange = { this . updateInput } required / >
< / d i v >
< div className = "col-lg-6 form-group form-material" >
< label className = "control-label" htmlFor = "edexcoin_amount" data - edexcoin = "COIN" id = "edexcoin_amount_label" >
< span data - edexcoin = "COIN" > < / s p a n >
{ this . props . ActiveCoin . coin }
< / l a b e l >
< input type = "text" className = "form-control" data - edexcoin = "COIN" id = "edexcoin_amount" name = "edexcoin_ amount" placeholder = "0.000" autoComplete = "off" / >
< input type = "text" className = "form-control" data - edexcoin = "COIN" id = "edexcoin_amount" name = "amount" placeholder = "0.000" autoComplete = "off" onChange = { this . updateInput } / >
< / d i v >
< div className = "col-lg-6 form-group form-material" >
< label className = "control-label" data - edexcoin = "COIN" htmlFor = "edexcoin_fee" > { translate ( 'INDEX.FEE' ) } < / l a b e l >
< input type = "text" className = "form-control" data - edexcoin = "COIN" id = "edexcoin_fee" name = "edexcoin_fee" placeholder = "0.000" autoComplete = "off" / >
< input type = "text" className = "form-control" data - edexcoin = "COIN" id = "edexcoin_fee" name = "fee" defaultValue = { this . state . fee } placeholder = "0.000" autoComplete = "off" onChange = { this . updateInput } / >
< / d i v >
< div className = "col-lg-12" >
< span data - edexcoin = "KMD" >
< b > { translate ( 'INDEX.TOTAL' ) } ( < span data - edexcoin = "COIN" > { translate ( 'INDEX.AMOUNT_SM' ) } < / s p a n > - t x f e e ) : < / b > < s p a n d a t a - e d e x c o i n = " C O I N " i d = " e d e x c o i n _ t o t a l _ v a l u e " > 0 . 0 0 0 < / s p a n > < s p a n d a t a - e d e x c o i n = " C O I N " i d = " e d e x c o i n _ t o t a l _ c o i n n a m e " d a t a - e d e x c o i n = " C O I N " > < / s p a n >
< b > { translate ( 'INDEX.TOTAL' ) } ( < span data - edexcoin = "COIN" > { translate ( 'INDEX.AMOUNT_SM' ) } < / s p a n > - t x f e e ) : < / b > < s p a n d a t a - e d e x c o i n = " C O I N " i d = " e d e x c o i n _ t o t a l _ v a l u e " > { N u m b e r ( t h i s . s t a t e . a m o u n t ) - N u m b e r ( t h i s . s t a t e . f e e ) } < / s p a n > { t h i s . p r o p s . A c t i v e C o i n . c o i n }
< / s p a n >
< / d i v >
< div className = "col-lg-10 margin-top-10" >
< div className = "pull-left margin-right-10" >
< input type = "checkbox" id = "edexcoin_send_sig" name = "edexcoin_send_sig" data - plugin = "switchery" data - size = "small" / >
< input type = "checkbox" id = "edexcoin_send_sig" onClick = { this . toggleSendSig } data - plugin = "switchery" data - size = "small" / >
< / d i v >
< label className = "padding-top-3" htmlFor = "edexcoin_send_sig" > { translate ( 'INDEX.DONT_SEND' ) } < / l a b e l >
< label className = "padding-top-3" htmlFor = "edexcoin_send_sig" onClick = { this . toggleSendSig } > { translate ( 'INDEX.DONT_SEND' ) } < / l a b e l >
< / d i v >
< div className = "col-lg-2" >
< button type = "button" className = "btn btn-primary waves-effect waves-light pull-right edexcoin_send_coins_btn_step1" onClick = { ( ) => this . changeSendCoinStep ( 1 ) } >
{ translate ( 'INDEX.SEND' ) } < span data - edexcoin = "COIN" > < / s p a n >
{ translate ( 'INDEX.SEND' ) } { Number ( this . state . amount ) - Number ( this . state . fee ) } { this . props . ActiveCoin . coin }
< / b u t t o n >
< / d i v >
< / d i v >
@ -109,13 +152,13 @@ class SendCoin extends React.Component {
< div className = "col-xs-12" >
< b > { translate ( 'INDEX.TO' ) } < / b >
< / d i v >
< div className = "col-lg-6 col-sm-6 col-xs-12" id = "mdl_confirm_currency_sendto_addr" > [ coin - address - goes - here ] < / d i v >
< div className = "col-lg-6 col-sm-6 col-xs-12" id = "mdl_confirm_currency_sendto_addr" > { this . state . sendTo } < / d i v >
< div className = "col-lg-6 col-sm-6 col-xs-6" >
< span id = "mdl_confirm_currency_send_amount" > 0.00000000 < / s p a n > < s p a n i d = " m d l _ c o n f i r m _ c u r r e n c y _ c o i n n a m e " > [ C O I N ] < / s p a n >
< span id = "mdl_confirm_currency_send_amount" > { this . state . amount } < / s p a n > { t h i s . p r o p s . A c t i v e C o i n . c o i n }
< / d i v >
< div className = "col-lg-6 col-sm-6 col-xs-12" > { translate ( 'INDEX.TX_FEE_REQ' ) } < / d i v >
< div className = "col-lg-6 col-sm-6 col-xs-6" >
< span id = "mdl_confirm_currency_send_fee" > 0.00000000 < / s p a n > < s p a n i d = " m d l _ c o n f i r m _ c u r r e n c y _ c o i n n a m e _ f e e " > [ C O I N ] < / s p a n >
< span id = "mdl_confirm_currency_send_fee" > { this . state . fee } < / s p a n > { t h i s . p r o p s . A c t i v e C o i n . c o i n }
< / d i v >
< / d i v >
< br / >
@ -124,9 +167,9 @@ class SendCoin extends React.Component {
< div className = "col-xs-12" >
< b > { translate ( 'INDEX.FROM' ) } < / b >
< / d i v >
< div className = "col-lg-6 col-sm-6 col-xs-12" id = "mdl_confirm_currency_sendfrom_addr" > [ coin - address - goes - here ] < / d i v >
< div className = "col-lg-6 col-sm-6 col-xs-12" id = "mdl_confirm_currency_sendfrom_addr" > { this . props . Dashboard . activeHandle [ this . props . ActiveCoin . coin ] } < / d i v >
< div className = "col-lg-6 col-sm-6 col-xs-6" style = { { color : '#f44336' } } >
< span id = "mdl_confirm_currency_sendfrom_total_dedcut" > - 0.00000000 < / s p a n > < s p a n i d = " m d l _ c o n f i r m _ c u r r e n c y _ c o i n n a m e _ t o t a l " > [ C O I N ] < / s p a n >
< span id = "mdl_confirm_currency_sendfrom_total_dedcut" > { Number ( this . state . amount ) - Number ( this . state . fee ) } < / s p a n > { t h i s . p r o p s . A c t i v e C o i n . c o i n }
< / d i v >
< / d i v >
< div className = "widget-body-footer" >
@ -151,6 +194,7 @@ class SendCoin extends React.Component {
< / t r >
< / t h e a d >
< tbody >
{ this . renderSendCoinResponse ( ) }
< / t b o d y >
< / t a b l e >
< div className = "widget-body-footer" >
pbca26
8 years ago