rounded subtotals in cardsummary of dashboard to integer (no decimals)

pull/12/MERGE
13621160019@163.com 2021-03-08 18:15:03 +08:00
parent 753fa733e5
commit 1fcfacf366
1 changed files with 34 additions and 34 deletions

View File

@ -40,17 +40,17 @@ const Dashboard = ({ setRedirect, setRedirectUrl, t }) => {
const [spaceCostLineChartLabels, setSpaceCostLineChartLabels] = useState([]); const [spaceCostLineChartLabels, setSpaceCostLineChartLabels] = useState([]);
const [spaceCostLineChartData, setSpaceCostLineChartData] = useState({}); const [spaceCostLineChartData, setSpaceCostLineChartData] = useState({});
const [spaceCostLineChartOptions, setSpaceCostLineChartOptions] = useState([]); const [spaceCostLineChartOptions, setSpaceCostLineChartOptions] = useState([]);
const [parameterLineChartLabels, setParameterLineChartLabels] = useState([]); const [parameterLineChartLabels, setParameterLineChartLabels] = useState([]);
const [parameterLineChartData, setParameterLineChartData] = useState({}); const [parameterLineChartData, setParameterLineChartData] = useState({});
const [parameterLineChartOptions, setParameterLineChartOptions] = useState([]); const [parameterLineChartOptions, setParameterLineChartOptions] = useState([]);
const [detailedDataTableData, setDetailedDataTableData] = useState([]); const [detailedDataTableData, setDetailedDataTableData] = useState([]);
const [detailedDataTableColumns, setDetailedDataTableColumns] = useState([{dataField: 'startdatetime', text: t('Datetime'), sort: true}]); const [detailedDataTableColumns, setDetailedDataTableColumns] = useState([{dataField: 'startdatetime', text: t('Datetime'), sort: true}]);
const [childSpacesTableData, setChildSpacesTableData] = useState([]); const [childSpacesTableData, setChildSpacesTableData] = useState([]);
const [childSpacesTableColumns, setChildSpacesTableColumns] = useState([{dataField: 'name', text: t('Child Spaces'), sort: true }]); const [childSpacesTableColumns, setChildSpacesTableColumns] = useState([{dataField: 'name', text: t('Child Spaces'), sort: true }]);
useEffect(() => { useEffect(() => {
let is_logged_in = getCookieValue('is_logged_in'); let is_logged_in = getCookieValue('is_logged_in');
@ -71,14 +71,14 @@ const Dashboard = ({ setRedirect, setRedirectUrl, t }) => {
createCookie('token', token, 1000 * 60 * 60 * 8); createCookie('token', token, 1000 * 60 * 60 * 8);
let isResponseOK = false; let isResponseOK = false;
if (!fetchSuccess) { if (!fetchSuccess) {
toast( toast(
<Fragment> <Fragment>
{t("Welcome to MyEMS")}!<br /> {t("Welcome to MyEMS")}!<br />
{t("An Industry Leading Open Source Energy Management System")} {t("An Industry Leading Open Source Energy Management System")}
</Fragment> </Fragment>
); );
fetch(APIBaseURL + '/reports/dashboard?' + fetch(APIBaseURL + '/reports/dashboard?' +
'useruuid=' + user_uuid + 'useruuid=' + user_uuid +
'&periodtype=' + periodType + '&periodtype=' + periodType +
@ -108,7 +108,7 @@ const Dashboard = ({ setRedirect, setRedirectUrl, t }) => {
let cardSummaryItem = {} let cardSummaryItem = {}
cardSummaryItem['name'] = json['reporting_period_input']['names'][index]; cardSummaryItem['name'] = json['reporting_period_input']['names'][index];
cardSummaryItem['unit'] = json['reporting_period_input']['units'][index]; cardSummaryItem['unit'] = json['reporting_period_input']['units'][index];
cardSummaryItem['subtotal'] = json['reporting_period_input']['subtotals'][index]; cardSummaryItem['subtotal'] = json['reporting_period_input']['subtotals'][index].toFixed();
cardSummaryItem['increment_rate'] = parseFloat(json['reporting_period_input']['increment_rates'][index] * 100).toFixed(2) + "%"; cardSummaryItem['increment_rate'] = parseFloat(json['reporting_period_input']['increment_rates'][index] * 100).toFixed(2) + "%";
cardSummaryItem['subtotal_per_unit_area'] = json['reporting_period_input']['subtotals_per_unit_area'][index]; cardSummaryItem['subtotal_per_unit_area'] = json['reporting_period_input']['subtotals_per_unit_area'][index];
inputCardSummaryArray.push(cardSummaryItem); inputCardSummaryArray.push(cardSummaryItem);
@ -120,7 +120,7 @@ const Dashboard = ({ setRedirect, setRedirectUrl, t }) => {
let cardSummaryItem = {} let cardSummaryItem = {}
cardSummaryItem['name'] = json['reporting_period_cost']['names'][index]; cardSummaryItem['name'] = json['reporting_period_cost']['names'][index];
cardSummaryItem['unit'] = json['reporting_period_cost']['units'][index]; cardSummaryItem['unit'] = json['reporting_period_cost']['units'][index];
cardSummaryItem['subtotal'] = json['reporting_period_cost']['subtotals'][index]; cardSummaryItem['subtotal'] = json['reporting_period_cost']['subtotals'][index].toFixed();
cardSummaryItem['increment_rate'] = parseFloat(json['reporting_period_cost']['increment_rates'][index] * 100).toFixed(2) + "%"; cardSummaryItem['increment_rate'] = parseFloat(json['reporting_period_cost']['increment_rates'][index] * 100).toFixed(2) + "%";
cardSummaryItem['subtotal_per_unit_area'] = json['reporting_period_cost']['subtotals_per_unit_area'][index]; cardSummaryItem['subtotal_per_unit_area'] = json['reporting_period_cost']['subtotals_per_unit_area'][index];
costCardSummaryArray.push(cardSummaryItem); costCardSummaryArray.push(cardSummaryItem);
@ -137,7 +137,7 @@ const Dashboard = ({ setRedirect, setRedirectUrl, t }) => {
timeOfUseItem['value'] = json['reporting_period_input']['toppeaks'][index]; timeOfUseItem['value'] = json['reporting_period_input']['toppeaks'][index];
timeOfUseItem['color'] = "#"+((1<<24)*Math.random()|0).toString(16); timeOfUseItem['color'] = "#"+((1<<24)*Math.random()|0).toString(16);
timeOfUseArray.push(timeOfUseItem); timeOfUseArray.push(timeOfUseItem);
timeOfUseItem = {} timeOfUseItem = {}
timeOfUseItem['id'] = 2; timeOfUseItem['id'] = 2;
timeOfUseItem['name'] = t('On-Peak'); timeOfUseItem['name'] = t('On-Peak');
@ -161,7 +161,7 @@ const Dashboard = ({ setRedirect, setRedirectUrl, t }) => {
} }
}); });
setTimeOfUseShareData(timeOfUseArray); setTimeOfUseShareData(timeOfUseArray);
let totalInTCE = {}; let totalInTCE = {};
totalInTCE['value'] = json['reporting_period_input']['total_in_kgce'] / 1000; // convert from kg to t totalInTCE['value'] = json['reporting_period_input']['total_in_kgce'] / 1000; // convert from kg to t
totalInTCE['increment_rate'] = parseFloat(json['reporting_period_input']['increment_rate_in_kgce'] * 100).toFixed(2) + "%"; totalInTCE['increment_rate'] = parseFloat(json['reporting_period_input']['increment_rate_in_kgce'] * 100).toFixed(2) + "%";
totalInTCE['value_per_unit_area'] = json['reporting_period_input']['total_in_kgce_per_unit_area'] / 1000; // convert from kg to t totalInTCE['value_per_unit_area'] = json['reporting_period_input']['total_in_kgce_per_unit_area'] / 1000; // convert from kg to t
@ -178,7 +178,7 @@ const Dashboard = ({ setRedirect, setRedirectUrl, t }) => {
}); });
setCostShareData(costDataArray); setCostShareData(costDataArray);
let totalInTCO2E = {}; let totalInTCO2E = {};
totalInTCO2E['value'] = json['reporting_period_input']['total_in_kgco2e'] / 1000; // convert from kg to t totalInTCO2E['value'] = json['reporting_period_input']['total_in_kgco2e'] / 1000; // convert from kg to t
totalInTCO2E['increment_rate'] = parseFloat(json['reporting_period_input']['increment_rate_in_kgco2e'] * 100).toFixed(2) + "%"; totalInTCO2E['increment_rate'] = parseFloat(json['reporting_period_input']['increment_rate_in_kgco2e'] * 100).toFixed(2) + "%";
totalInTCO2E['value_per_unit_area'] = json['reporting_period_input']['total_in_kgco2e_per_unit_area'] / 1000; // convert from kg to t totalInTCO2E['value_per_unit_area'] = json['reporting_period_input']['total_in_kgco2e_per_unit_area'] / 1000; // convert from kg to t
@ -211,13 +211,13 @@ const Dashboard = ({ setRedirect, setRedirectUrl, t }) => {
timestamps['a' + index] = currentValue; timestamps['a' + index] = currentValue;
}); });
setSpaceInputLineChartLabels(timestamps); setSpaceInputLineChartLabels(timestamps);
let values = {} let values = {}
json['reporting_period_input']['values'].forEach((currentValue, index) => { json['reporting_period_input']['values'].forEach((currentValue, index) => {
values['a' + index] = currentValue; values['a' + index] = currentValue;
}); });
setSpaceInputLineChartData(values); setSpaceInputLineChartData(values);
let names = Array(); let names = Array();
json['reporting_period_input']['names'].forEach((currentValue, index) => { json['reporting_period_input']['names'].forEach((currentValue, index) => {
let unit = json['reporting_period_input']['units'][index]; let unit = json['reporting_period_input']['units'][index];
@ -230,13 +230,13 @@ const Dashboard = ({ setRedirect, setRedirectUrl, t }) => {
timestamps['a' + index] = currentValue; timestamps['a' + index] = currentValue;
}); });
setSpaceCostLineChartLabels(timestamps); setSpaceCostLineChartLabels(timestamps);
values = {} values = {}
json['reporting_period_cost']['values'].forEach((currentValue, index) => { json['reporting_period_cost']['values'].forEach((currentValue, index) => {
values['a' + index] = currentValue; values['a' + index] = currentValue;
}); });
setSpaceCostLineChartData(values); setSpaceCostLineChartData(values);
names = Array(); names = Array();
json['reporting_period_cost']['names'].forEach((currentValue, index) => { json['reporting_period_cost']['names'].forEach((currentValue, index) => {
let unit = json['reporting_period_cost']['units'][index]; let unit = json['reporting_period_cost']['units'][index];
@ -255,17 +255,17 @@ const Dashboard = ({ setRedirect, setRedirectUrl, t }) => {
values['a' + index] = currentValue; values['a' + index] = currentValue;
}); });
setParameterLineChartData(values); setParameterLineChartData(values);
names = Array(); names = Array();
json['parameters']['names'].forEach((currentValue, index) => { json['parameters']['names'].forEach((currentValue, index) => {
if (currentValue.startsWith('TARIFF-')) { if (currentValue.startsWith('TARIFF-')) {
currentValue = t('Tariff') + currentValue.replace('TARIFF-', '-'); currentValue = t('Tariff') + currentValue.replace('TARIFF-', '-');
} }
names.push({ 'value': 'a' + index, 'label': currentValue }); names.push({ 'value': 'a' + index, 'label': currentValue });
}); });
setParameterLineChartOptions(names); setParameterLineChartOptions(names);
let detailed_value_list = []; let detailed_value_list = [];
if (json['reporting_period_input']['timestamps'].length > 0 ) { if (json['reporting_period_input']['timestamps'].length > 0 ) {
json['reporting_period_input']['timestamps'][0].forEach((currentTimestamp, timestampIndex) => { json['reporting_period_input']['timestamps'][0].forEach((currentTimestamp, timestampIndex) => {
@ -287,7 +287,7 @@ const Dashboard = ({ setRedirect, setRedirectUrl, t }) => {
}); });
detailed_value_list.push(detailed_value); detailed_value_list.push(detailed_value);
setDetailedDataTableData(detailed_value_list); setDetailedDataTableData(detailed_value_list);
let detailed_column_list = []; let detailed_column_list = [];
detailed_column_list.push({ detailed_column_list.push({
dataField: 'startdatetime', dataField: 'startdatetime',
@ -350,7 +350,7 @@ const Dashboard = ({ setRedirect, setRedirectUrl, t }) => {
}; };
}, ); }, );
return ( return (
<Fragment> <Fragment>
@ -359,8 +359,8 @@ const Dashboard = ({ setRedirect, setRedirectUrl, t }) => {
<CardSummary key={uuid()} <CardSummary key={uuid()}
rate={cardSummaryItem['increment_rate']} rate={cardSummaryItem['increment_rate']}
title={t("This Month's Consumption CATEGORY VALUE UNIT", { 'CATEGORY': cardSummaryItem['name'], 'VALUE': null, 'UNIT': '(' + cardSummaryItem['unit'] + ')' })} title={t("This Month's Consumption CATEGORY VALUE UNIT", { 'CATEGORY': cardSummaryItem['name'], 'VALUE': null, 'UNIT': '(' + cardSummaryItem['unit'] + ')' })}
color="success" color="success"
footnote={t('Per Unit Area')} footnote={t('Per Unit Area')}
footvalue={cardSummaryItem['subtotal_per_unit_area']} footvalue={cardSummaryItem['subtotal_per_unit_area']}
footunit={"(" + cardSummaryItem['unit'] + "/M²)"} > footunit={"(" + cardSummaryItem['unit'] + "/M²)"} >
{cardSummaryItem['subtotal'] && <CountUp end={cardSummaryItem['subtotal']} duration={2} prefix="" separator="," decimal="." decimals={2} />} {cardSummaryItem['subtotal'] && <CountUp end={cardSummaryItem['subtotal']} duration={2} prefix="" separator="," decimal="." decimals={2} />}
@ -370,28 +370,28 @@ const Dashboard = ({ setRedirect, setRedirectUrl, t }) => {
<CardSummary key={uuid()} <CardSummary key={uuid()}
rate={cardSummaryItem['increment_rate']} rate={cardSummaryItem['increment_rate']}
title={t("This Month's Costs CATEGORY VALUE UNIT", { 'CATEGORY': cardSummaryItem['name'], 'VALUE': null, 'UNIT': '(' + cardSummaryItem['unit'] + ')' })} title={t("This Month's Costs CATEGORY VALUE UNIT", { 'CATEGORY': cardSummaryItem['name'], 'VALUE': null, 'UNIT': '(' + cardSummaryItem['unit'] + ')' })}
color="success" color="success"
footnote={t('Per Unit Area')} footnote={t('Per Unit Area')}
footvalue={cardSummaryItem['subtotal_per_unit_area']} footvalue={cardSummaryItem['subtotal_per_unit_area']}
footunit={"(" + cardSummaryItem['unit'] + "/M²)"} > footunit={"(" + cardSummaryItem['unit'] + "/M²)"} >
{cardSummaryItem['subtotal'] && <CountUp end={cardSummaryItem['subtotal']} duration={2} prefix="" separator="," decimal="." decimals={2} />} {cardSummaryItem['subtotal'] && <CountUp end={cardSummaryItem['subtotal']} duration={2} prefix="" separator="," decimal="." decimals={2} />}
</CardSummary> </CardSummary>
))} ))}
<CardSummary <CardSummary
rate={totalInTCE['increment_rate'] || ''} rate={totalInTCE['increment_rate'] || ''}
title={t("This Month's Consumption CATEGORY VALUE UNIT", { 'CATEGORY': t('Ton of Standard Coal'), 'UNIT': '(TCE)' })} title={t("This Month's Consumption CATEGORY VALUE UNIT", { 'CATEGORY': t('Ton of Standard Coal'), 'UNIT': '(TCE)' })}
color="warning" color="warning"
footnote={t('Per Unit Area')} footnote={t('Per Unit Area')}
footvalue={totalInTCE['value_per_unit_area']} footvalue={totalInTCE['value_per_unit_area']}
footunit="(TCE/M²)"> footunit="(TCE/M²)">
{totalInTCE['value'] && <CountUp end={totalInTCE['value']} duration={2} prefix="" separator="," decimal="." decimals={2} />} {totalInTCE['value'] && <CountUp end={totalInTCE['value']} duration={2} prefix="" separator="," decimal="." decimals={2} />}
</CardSummary> </CardSummary>
<CardSummary <CardSummary
rate={totalInTCO2E['increment_rate'] || ''} rate={totalInTCO2E['increment_rate'] || ''}
title={t("This Month's Consumption CATEGORY VALUE UNIT", { 'CATEGORY': t('Ton of Carbon Dioxide Emissions'), 'UNIT': '(TCO2E)' })} title={t("This Month's Consumption CATEGORY VALUE UNIT", { 'CATEGORY': t('Ton of Carbon Dioxide Emissions'), 'UNIT': '(TCO2E)' })}
color="warning" color="warning"
footnote={t('Per Unit Area')} footnote={t('Per Unit Area')}
footvalue={totalInTCO2E['value_per_unit_area']} footvalue={totalInTCO2E['value_per_unit_area']}
footunit="(TCO2E/M²)"> footunit="(TCO2E/M²)">
{totalInTCO2E['value'] && <CountUp end={totalInTCO2E['value']} duration={2} prefix="" separator="," decimal="." decimals={2} />} {totalInTCO2E['value'] && <CountUp end={totalInTCO2E['value']} duration={2} prefix="" separator="," decimal="." decimals={2} />}
</CardSummary> </CardSummary>