diff --git a/src/containers/statistics/FlightResultContainer.js b/src/containers/statistics/FlightResultContainer.js index fe66ab7..2647d62 100644 --- a/src/containers/statistics/FlightResultContainer.js +++ b/src/containers/statistics/FlightResultContainer.js @@ -84,30 +84,29 @@ export default function ResultContainer({ // 그래프 타이틀 handler const handlerTitleName = category => { const categoryMappings = { - TIME: '비행 실적', - DISTANCE: '비행 계획', - FLT_COUNT: '비행 승인' + FLT_RESULT: '비행 실적', + FLT_PLAN: '비행 계획', + FLT_PLAN_APRVN: '비행 승인' }; return categoryMappings[category]; }; + // Bar Graph handler const handlerBarTicks = () => { - const data = resultSearch.topData.map(i => i.value); - const max = Math.max(...data); - const min = Math.min(...data); + const data = resultSearch.graphData.map(i => i.value); + const max = Math.ceil(Math.max(...data) / 10) * 10; const stepSize = handlerStepSize(max); - return { max, min, stepSize }; + return { max, stepSize }; }; const handlerStepSize = max => { - if (max <= 1000) { - return 100; - } else if (max <= 5000) { - return 500; - } else { - return 1000; - } + const exponent = Math.ceil(Math.log10(max)); + return 10 ** (exponent - 1); + }; + + const addCommasToNumber = number => { + return number.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ','); }; const options = { @@ -159,6 +158,7 @@ export default function ResultContainer({ }, ticks: { ...handlerBarTicks(), + min: 0, fontColor: labelColor } } @@ -166,10 +166,10 @@ export default function ResultContainer({ } }, data = { - labels: resultSearch?.topData.map(i => i.name), + labels: resultSearch.graphData.map(i => i.name), datasets: [ { - data: resultSearch?.topData.map(i => i.value), + data: resultSearch.graphData.map(i => i.value), backgroundColor: '#00bcd4', borderColor: '#00bcd4', barThickness: 15 @@ -199,7 +199,7 @@ export default function ResultContainer({ label(tooltipItem, data) { const label = data.datasets[0].labels[tooltipItem.index] || '', value = data.datasets[0].data[tooltipItem.index]; - const output = ` ${label} : ${value} %`; + const output = ` ${label} : ${value}건`; return output; } }, @@ -213,11 +213,11 @@ export default function ResultContainer({ } }, data2 = { - labels: resultSearch?.graphData.map(i => i.name), + labels: resultSearch?.topData.map(i => i.name), datasets: [ { - labels: resultSearch?.graphData.map(i => i.name), - data: resultSearch?.graphData.map(i => i.value), + labels: resultSearch?.topData.map(i => i.name), + data: resultSearch?.topData.map(i => i.value), // 레드버전 // backgroundColor: [ // '#ffe8d1', @@ -245,93 +245,62 @@ export default function ResultContainer({
- -
- - - - - - - - - -
- - - - 비행 실적 - PA0001 - - - 8일 10시간 35분 12초 -
- - 1일 35분 12초 - - - 35분 12초 -
-
- - -
- - - - - - - - - -
- - - - 비행 계획 - PA0002 - - - 10,845m -
- - 1,201m - - - 53m -
-
- - -
- - - - - - - - - -
- - - - 비행 승인 - PA0002 - - - 1,024,845건 -
- - 111,201건 - - - 153건 -
-
- + {result.map((i, idx) => ( + +
+ + + + + + + + + +
+ {idx === 0 ? ( + <> + + + + 비행 실적 + + ) : idx === 1 ? ( + <> + + + + 비행 계획 + + ) : ( + <> + + + + 비행 승인 + + )} + + {i.name} + + + + {addCommasToNumber(i.year)}건 + +
+ + + {addCommasToNumber(i.month)}건 + + + + + {addCommasToNumber(i.day)}건 + +
+
+ + ))}