diff options
Diffstat (limited to 'cmd/web/js/balance.jsx')
-rw-r--r-- | cmd/web/js/balance.jsx | 19 |
1 files changed, 12 insertions, 7 deletions
diff --git a/cmd/web/js/balance.jsx b/cmd/web/js/balance.jsx index 1915511..429538d 100644 --- a/cmd/web/js/balance.jsx +++ b/cmd/web/js/balance.jsx | |||
@@ -11,14 +11,19 @@ class CurrencyLogo extends React.Component { | |||
11 | } | 11 | } |
12 | } | 12 | } |
13 | 13 | ||
14 | var formatVariation = (variation) => { | 14 | var formatVariation = (variation, isPercent) => { |
15 | var variationAbs = Math.abs(variation); | 15 | var variationAbs = Math.abs(variation); |
16 | var suffix = ''; | ||
17 | if (isPercent === true) { | ||
18 | suffix = '%'; | ||
19 | } | ||
20 | |||
16 | if (variation === 0.0) { | 21 | if (variation === 0.0) { |
17 | return <span>{variationAbs}%</span>; | 22 | return <span>{variationAbs}{suffix}</span>; |
18 | } else if (variation > 0) { | 23 | } else if (variation > 0) { |
19 | return <span className="performance-up">+{variationAbs}%</span>; | 24 | return <span className="performance-up">+{variationAbs}{suffix}</span>; |
20 | } | 25 | } |
21 | return <span className="performance-down">-{variationAbs}%</span>; | 26 | return <span className="performance-down">-{variationAbs}{suffix}</span>; |
22 | }; | 27 | }; |
23 | 28 | ||
24 | 29 | ||
@@ -46,7 +51,7 @@ class CurrencyRate extends React.Component { | |||
46 | <div className="d-inline col-2">{this.props.quantity}</div> | 51 | <div className="d-inline col-2">{this.props.quantity}</div> |
47 | <div className="d-inline col-2">{this.props.BTCValue}</div> | 52 | <div className="d-inline col-2">{this.props.BTCValue}</div> |
48 | <div className="d-inline col-2">{this.props.weight}%</div> | 53 | <div className="d-inline col-2">{this.props.weight}%</div> |
49 | <div className="d-inline col-2">{formatVariation(this.props.positionPerformanceP)}</div> | 54 | <div className="d-inline col-2">{formatVariation(this.props.positionPerformanceP, true)}</div> |
50 | </div> | 55 | </div> |
51 | </React.Fragment>; | 56 | </React.Fragment>; |
52 | } | 57 | } |
@@ -87,7 +92,7 @@ class PFBalance extends React.Component { | |||
87 | <em>since {date}</em> | 92 | <em>since {date}</em> |
88 | </div> | 93 | </div> |
89 | <div className="col-4 variation text-center"> | 94 | <div className="col-4 variation text-center"> |
90 | <strong>{formatVariation(this.props.variationP)}</strong> | 95 | <strong>{formatVariation(this.props.variationP, true)}</strong> |
91 | </div> | 96 | </div> |
92 | </div> | 97 | </div> |
93 | </div> | 98 | </div> |
@@ -100,7 +105,7 @@ class PFBalanceMinimal extends React.Component { | |||
100 | return <React.Fragment> | 105 | return <React.Fragment> |
101 | <div className="balance"> | 106 | <div className="balance"> |
102 | <div className="col-12"> | 107 | <div className="col-12"> |
103 | <CurrencyLogo currency="BTC" /> <span><strong>{this.props.balance}</strong> <strong>{formatVariation(this.props.variationP)}</strong></span> | 108 | <CurrencyLogo currency="BTC" /> <span><strong>{this.props.balance}</strong> <strong>{formatVariation(this.props.variationP, this.props.isPercent)}</strong></span> |
104 | </div> | 109 | </div> |
105 | </div> | 110 | </div> |
106 | </React.Fragment>; | 111 | </React.Fragment>; |