Commit c991dede authored by Alfred Malone's avatar Alfred Malone

change number format / max length set to 6 for repsonsivenes for now

parent 045fbd1e
......@@ -4,6 +4,81 @@ import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import * as row from "../redux/actions/expenseAction";
function numFormat(value) {
const n = value.toString();
let num = n;
if (n.length === 5) {
num = n[0] + n[1] + "," + n[2] + n[3] + n[4];
return num;
} else if (n.length === 6) {
num = n[0] + n[1] + n[2] + "," + n[3] + n[4] + n[5];
return num;
} else if (n.length === 7) {
num = n[0] + "," + n[1] + n[2] + n[3] + "," + n[4] + n[5] + n[6];
return num;
} else if (n.length === 8) {
num = n[0] + n[1] + "," + n[2] + n[3] + n[4] + "," + n[5] + n[6] + n[6];
return num;
} else if (n.length === 9) {
num =
n[0] + n[1] + n[2] + "," + n[3] + n[4] + n[5] + "," + n[6] + n[7] + n[8];
return num;
} else if (n.length === 10) {
num =
n[0] +
"," +
n[1] +
n[2] +
n[3] +
"," +
n[4] +
n[5] +
n[6] +
"," +
n[7] +
n[8] +
n[9];
return num;
} else if (n.length === 11) {
num =
n[0] +
n[1] +
"," +
n[2] +
n[3] +
n[4] +
"," +
n[5] +
n[6] +
n[7] +
"," +
n[8] +
n[9] +
n[10];
return num;
} else if (n.length === 12) {
num =
n[0] +
n[1] +
n[2] +
"," +
n[3] +
n[4] +
n[5] +
"," +
n[6] +
n[7] +
n[8] +
"," +
n[9] +
n[10] +
n[11];
return num;
} else {
return n;
}
}
const Expense = props => {
return (
<div className="mb-5">
......@@ -53,7 +128,7 @@ const Expense = props => {
</div>
<div className="p-2 bd-highlight">
<div className="h4 cHeader">
<strong>${props.total}</strong>
<strong>${numFormat(props.total)}</strong>
</div>
</div>
</div>
......
import React from "react";
import propTypes from "prop-types";
import Row from "./table/row";
import { connect } from "react-redux";
import { bindActionCreators } from "redux";
import * as row from "../redux/actions/incomeAction";
function numFormat(value) {
const n = value.toString();
let num = n;
if (n.length === 5) {
num = n[0] + n[1] + "," + n[2] + n[3] + n[4];
return num;
} else if (n.length === 6) {
num = n[0] + n[1] + n[2] + "," + n[3] + n[4] + n[5];
return num;
} else if (n.length === 7) {
num = n[0] + "," + n[1] + n[2] + n[3] + "," + n[4] + n[5] + n[6];
return num;
} else if (n.length === 8) {
num = n[0] + n[1] + "," + n[2] + n[3] + n[4] + "," + n[5] + n[6] + n[6];
return num;
} else if (n.length === 9) {
num =
n[0] + n[1] + n[2] + "," + n[3] + n[4] + n[5] + "," + n[6] + n[7] + n[8];
return num;
} else if (n.length === 10) {
num =
n[0] +
"," +
n[1] +
n[2] +
n[3] +
"," +
n[4] +
n[5] +
n[6] +
"," +
n[7] +
n[8] +
n[9];
return num;
} else if (n.length === 11) {
num =
n[0] +
n[1] +
"," +
n[2] +
n[3] +
n[4] +
"," +
n[5] +
n[6] +
n[7] +
"," +
n[8] +
n[9] +
n[10];
return num;
} else if (n.length === 12) {
num =
n[0] +
n[1] +
n[2] +
"," +
n[3] +
n[4] +
n[5] +
"," +
n[6] +
n[7] +
n[8] +
"," +
n[9] +
n[10] +
n[11];
return num;
} else {
return n;
}
}
const Income = props => {
return (
<div className="mb-5">
......@@ -53,7 +129,7 @@ const Income = props => {
</div>
<div className="p-2 bd-highlight">
<div className="h4 cHeader">
<strong>${props.total}</strong>
<strong>${numFormat(props.total)}</strong>
</div>
</div>
</div>
......@@ -72,6 +148,11 @@ function mapDispatcheProps(dispatch) {
return bindActionCreators(row, dispatch);
}
Income.propTypes = {
total: propTypes.number,
handleChange: propTypes.func
};
export default connect(
mapStateProps,
mapDispatcheProps
......
import React from "react";
function numFormat(value) {
const n = value.toString();
let num = n;
if (n.length === 5) {
num = n[0] + n[1] + "," + n[2] + n[3] + n[4];
return num;
} else if (n.length === 6) {
num = n[0] + n[1] + n[2] + "," + n[3] + n[4] + n[5];
return num;
} else if (n.length === 7) {
num = n[0] + "," + n[1] + n[2] + n[3] + "," + n[4] + n[5] + n[6];
return num;
} else if (n.length === 8) {
num = n[0] + n[1] + "," + n[2] + n[3] + n[4] + "," + n[5] + n[6] + n[6];
return num;
} else if (n.length === 9) {
num =
n[0] + n[1] + n[2] + "," + n[3] + n[4] + n[5] + "," + n[6] + n[7] + n[8];
return num;
} else if (n.length === 10) {
num =
n[0] +
"," +
n[1] +
n[2] +
n[3] +
"," +
n[4] +
n[5] +
n[6] +
"," +
n[7] +
n[8] +
n[9];
return num;
} else if (n.length === 11) {
num =
n[0] +
n[1] +
"," +
n[2] +
n[3] +
n[4] +
"," +
n[5] +
n[6] +
n[7] +
"," +
n[8] +
n[9] +
n[10];
return num;
} else if (n.length === 12) {
num =
n[0] +
n[1] +
n[2] +
"," +
n[3] +
n[4] +
n[5] +
"," +
n[6] +
n[7] +
n[8] +
"," +
n[9] +
n[10] +
n[11];
return num;
} else {
return n;
}
}
const Row = props => {
return (
<tr>
......@@ -27,6 +102,7 @@ const Row = props => {
name="price"
onChange={props.change}
value={props.value}
maxlength="6"
aria-label="Sizing example input"
aria-describedby="inputGroup-sizing-sm"
placeholder="$0.00"
......@@ -45,7 +121,7 @@ const Row = props => {
*/}
</div>
</td>
<td className="d-flex justify-content-end">${props.value}</td>
<td className="d-flex justify-content-end">${numFormat(props.value)}</td>
</tr>
);
};
......
......@@ -30,7 +30,12 @@ export default function expenseReducer(state = initialState, action) {
(accumulator, currentValue) =>
Number(accumulator) + Number(currentValue)
);
return { ...state, row: rows, total: total, input: rows[action.idx] };
return {
...state,
row: rows,
total: Number(total),
input: rows[action.idx]
};
//Object.assign({}, state, { total: action.total.income });
default:
return state;
......
......@@ -30,7 +30,12 @@ export default function incomeReducer(state = initialState, action) {
(accumulator, currentValue) =>
Number(accumulator) + Number(currentValue)
);
return { ...state, row: rows, total: total, input: rows[action.idx] };
return {
...state,
row: rows,
total: Number(total),
input: rows[action.idx]
};
default:
return state;
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment