forked from M-Labs/web2019
feat(place-order): Formats number to be money currency like
This commit is contained in:
parent
389552e308
commit
708d209768
@ -160,7 +160,7 @@ button {
|
||||
font-size: .8rem;
|
||||
|
||||
table {
|
||||
max-width: 350px;
|
||||
max-width: 450px;
|
||||
}
|
||||
|
||||
.summary-remove-all {
|
||||
|
@ -108,6 +108,24 @@ const nbrOccupiedSlotsInCrate = (items) => {
|
||||
}, 0);
|
||||
};
|
||||
|
||||
function formatMoney(amount, decimalCount = 2, decimal = ".", thousands = ",") {
|
||||
// https://stackoverflow.com/questions/149055/how-can-i-format-numbers-as-currency-string-in-javascript
|
||||
// changes: return amount if error in order to avoid empty value
|
||||
try {
|
||||
decimalCount = Math.abs(decimalCount);
|
||||
decimalCount = isNaN(decimalCount) ? 2 : decimalCount;
|
||||
|
||||
const negativeSign = amount < 0 ? "-" : "";
|
||||
|
||||
let i = parseInt(amount = Math.abs(Number(amount) || 0).toFixed(decimalCount)).toString();
|
||||
let j = (i.length > 3) ? i.length % 3 : 0;
|
||||
|
||||
return negativeSign + (j ? i.substr(0, j) + thousands : '') + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + thousands) + (decimalCount ? decimal + Math.abs(amount - i).toFixed(decimalCount).slice(2) : "");
|
||||
} catch (e) {
|
||||
return amount;
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Component that provides a base layout (aside/main) for the page.
|
||||
@ -196,7 +214,7 @@ class ProductItem extends React.PureComponent {
|
||||
<div className="content">
|
||||
<h3>{name}</h3>
|
||||
|
||||
<div className="price">{`${currency} ${price}`}</div>
|
||||
<div className="price">{`${currency} ${formatMoney(price)}`}</div>
|
||||
|
||||
{render_specs}
|
||||
</div>
|
||||
@ -892,7 +910,7 @@ class OrderSumary extends React.PureComponent {
|
||||
<td className="item-card-name">{mode.name}</td>
|
||||
<td className="price">
|
||||
<div>
|
||||
{`${currency} ${mode.price}`}
|
||||
{`${currency} ${formatMoney(mode.price)}`}
|
||||
|
||||
<button style={{'opacity': '0', 'cursor': 'initial'}}>
|
||||
<img src="/images/shop/icon-remove.svg" />
|
||||
@ -934,7 +952,7 @@ class OrderSumary extends React.PureComponent {
|
||||
|
||||
<td className="price">
|
||||
<div>
|
||||
{`${currency} ${item.price}`}
|
||||
{`${currency} ${formatMoney(item.price)}`}
|
||||
|
||||
<button onClick={this.handleOnDeleteItem.bind(this, index)}>
|
||||
<img src="/images/shop/icon-remove.svg" />
|
||||
@ -965,19 +983,26 @@ class OrderSumary extends React.PureComponent {
|
||||
<tr>
|
||||
<td className="item-card-name">Price estimate</td>
|
||||
<td className="price">
|
||||
<div>
|
||||
{summary.length ? (
|
||||
`${currency} ${summary.reduce(
|
||||
`${currency} ${formatMoney(summary.reduce(
|
||||
(prev, next) => {
|
||||
return prev + next.price;
|
||||
}, 0
|
||||
) + mode.price}`
|
||||
) + mode.price)}`
|
||||
) : (
|
||||
`${currency} ${mode.price}`
|
||||
`${currency} ${formatMoney(mode.price)}`
|
||||
)}
|
||||
|
||||
<button style={{'opacity': '0', 'cursor': 'initial'}}>
|
||||
<img src="/images/shop/icon-remove.svg" alt="icon remove"/>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<span style={{
|
||||
'display': 'inline-block',
|
||||
'width': '30px',
|
||||
}}> </span>
|
||||
</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
|
Loading…
Reference in New Issue
Block a user