From c8c6444676c249778dc175efde6c0969b737496a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EB=B0=95=EC=83=81=ED=98=84?= <gus516@palnet.co.kr>
Date: Wed, 13 Dec 2023 11:47:53 +0900
Subject: [PATCH] =?UTF-8?q?=ED=9A=8C=EC=9B=90=EA=B4=80=EB=A6=AC=20?=
 =?UTF-8?q?=EC=A3=BC=EC=84=9D=20=EC=A7=84=ED=96=89=EC=A4=91=20laanc=20?=
 =?UTF-8?q?=EB=B9=84=ED=96=89=20=ED=83=80=EC=9E=85=20=EB=B2=84=ED=8A=BC=20?=
 =?UTF-8?q?=ED=95=9C=EA=B8=80=ED=99=94?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../account/mypage/AccountMypageForm.js       |  5 +--
 .../account/mypage/AccountMypagePwForm.js     | 15 +++++----
 src/components/laanc/map/FlightArea.js        |  6 ++--
 src/components/statistics/StatisticsSearch.js | 15 ++++++++-
 src/components/statistics/StatisticsTotal.js  |  2 ++
 .../account/mypage/AccountMypageContainer.js  | 31 +++++++++++++++++--
 .../statistics/AbnormalSituationContainer.js  | 11 ++++++-
 src/containers/statistics/FlightContainer.js  | 12 ++++++-
 .../statistics/FlightResultContainer.js       | 10 +++++-
 9 files changed, 90 insertions(+), 17 deletions(-)

diff --git a/src/components/account/mypage/AccountMypageForm.js b/src/components/account/mypage/AccountMypageForm.js
index 083db71..6c6ee5c 100644
--- a/src/components/account/mypage/AccountMypageForm.js
+++ b/src/components/account/mypage/AccountMypageForm.js
@@ -43,9 +43,10 @@ const AccountMypageForm = ({
 }) => {
   const history = useHistory();
 
-  function handleUseHitory() {
+  // 취소 헨들러
+  const handleUseHitory = () => {
     history.push('/');
-  }
+  };
 
   return (
     <Row className='app-user-edit'>
diff --git a/src/components/account/mypage/AccountMypagePwForm.js b/src/components/account/mypage/AccountMypagePwForm.js
index b81b88f..32ac5b6 100644
--- a/src/components/account/mypage/AccountMypagePwForm.js
+++ b/src/components/account/mypage/AccountMypagePwForm.js
@@ -76,11 +76,13 @@ const AccountMypagePwForm = ({ activeTab }) => {
     });
   };
 
-  function handleUseHitory() {
+  // 취소 헨들러
+  const handleUseHitory = () => {
     history.push('/');
-  }
+  };
 
-  function pwSubmit() {
+  // 비밀번호 변경
+  const pwSubmit = () => {
     const reg_pw =
       /^(?=.*[A-Za-z])(?=.*[0-9])(?=.*[@$!%*#?&])[A-Za-z0-9@$!%*#?&]{8,20}$/;
     if (!reg_pw.test(inputs.newPswd && inputs.newPswdConfirm)) {
@@ -98,11 +100,12 @@ const AccountMypagePwForm = ({ activeTab }) => {
     } else {
       dispatch(pwUpdateAction.request(inputs));
     }
-  }
+  };
 
-  function pwok() {
+  // 비밀번호 확인
+  const pwok = () => {
     dispatch(pwCheckAction.request(userPswd));
-  }
+  };
 
   return (
     <Card>
diff --git a/src/components/laanc/map/FlightArea.js b/src/components/laanc/map/FlightArea.js
index bc079e1..64fa6c0 100644
--- a/src/components/laanc/map/FlightArea.js
+++ b/src/components/laanc/map/FlightArea.js
@@ -538,7 +538,7 @@ export default function FlightArea({
                     handlerDrawType('LINE');
                   }}
                 >
-                  WayPoint
+                  선
                 </Button>
                 <Button
                   color='primary'
@@ -547,7 +547,7 @@ export default function FlightArea({
                     handlerDrawType('CIRCLE');
                   }}
                 >
-                  Circle
+                  원
                 </Button>
                 <Button
                   color='primary'
@@ -558,7 +558,7 @@ export default function FlightArea({
                     handlerDrawType('POLYGON');
                   }}
                 >
-                  Polygon
+                  다각형
                 </Button>
                 <Button
                   color='primary'
diff --git a/src/components/statistics/StatisticsSearch.js b/src/components/statistics/StatisticsSearch.js
index 32fe947..21de47c 100644
--- a/src/components/statistics/StatisticsSearch.js
+++ b/src/components/statistics/StatisticsSearch.js
@@ -11,6 +11,7 @@ import { Search } from 'react-feather';
 import { Bar, Doughnut } from 'react-chartjs-2';
 import { useEffect, useState } from 'react';
 
+// 그룹명 리스트
 const competentAgency = [
   {
     text: '서울지방항공청(항공운항과)',
@@ -69,13 +70,17 @@ export default function StatisticsSearch({
   user
   // entireGroupList
 }) {
+  // 전체 데이터
   const [total, setTotal] = useState([]);
+  // TOP5 데이터
   const [top, setTop] = useState([]);
 
+  // 검색조건 변경시 데이터 초기화
   useEffect(() => {
     chartInit();
   }, [searchData]);
 
+  // 초를 시간으로 변환
   const parseTimeToSeconds = timeArr => {
     return timeArr.map(time => {
       const [hours, minutes, seconds] = String(time).split(':').map(Number);
@@ -83,14 +88,19 @@ export default function StatisticsSearch({
     });
   };
 
+  // 데이터 초기화
   const chartInit = () => {
+    // 검색조건이 변경되면 데이터 초기화
     const { topData, graphData } = searchData;
-
+    // 데이터가 없는 경우 'NoData'로 표시되기 때문에 필터링
     const filteredData = data => data.filter(i => i && i !== 'NoData');
 
+    // 데이터 변환
     const graph = filteredData(graphData.map(i => i.value));
+    // TOP5 데이터 변환
     const top = filteredData(topData.map(i => i.value));
 
+    // 시간 데이터인 경우 초 단위로 변경
     if (searchType.category === 'TIME') {
       // ['00:00:00', '12:34:56'] -> [0,45296] 초 단위로 변경
       const totalValue = parseTimeToSeconds(graph);
@@ -111,6 +121,7 @@ export default function StatisticsSearch({
     }
   };
 
+  // bar 그래프 옵션
   const barOptions = {
       elements: {
         rectangle: {
@@ -204,6 +215,7 @@ export default function StatisticsSearch({
       ]
     };
 
+  // 도넛 그래프 옵션
   const doughnutOptions = {
       responsive: true,
       maintainAspectRatio: true,
@@ -275,6 +287,7 @@ export default function StatisticsSearch({
       ]
     };
 
+  // 그래프에 데이터가 없을 경우 표시할 텍스트
   const plugins = chartData => {
     return [
       {
diff --git a/src/components/statistics/StatisticsTotal.js b/src/components/statistics/StatisticsTotal.js
index 0a87613..5b8b8cf 100644
--- a/src/components/statistics/StatisticsTotal.js
+++ b/src/components/statistics/StatisticsTotal.js
@@ -10,12 +10,14 @@ export default function StatisticsTotal({
   formatNumber,
   formatDistance
 }) {
+  // 비행 통계 아이콘 3개 (알람, 워크플로우, 바차트)
   const renderIcon = idx => {
     if (idx === 0) return <FcAlarmClock />;
     if (idx === 1) return <FcWorkflow />;
     return <FcBarChart />;
   };
 
+  // 비행 통계 데이터 건수
   const renderData = (data, titleName, idx) => {
     if (titleName) {
       if (idx === 0) return formatTimeString(data);
diff --git a/src/containers/account/mypage/AccountMypageContainer.js b/src/containers/account/mypage/AccountMypageContainer.js
index 9a5c96a..9225494 100644
--- a/src/containers/account/mypage/AccountMypageContainer.js
+++ b/src/containers/account/mypage/AccountMypageContainer.js
@@ -30,32 +30,48 @@ import { ConfirmModal } from '../../../components/modal/ConfirmModal';
 
 // ** Function to toggle tabs
 const AccountMypageContainer = () => {
+  // tab 관리
   const [activeTab, setActiveTab] = useState('1');
   const dispatch = useDispatch();
   // { id } = useParams();
 
+  // tab 관리
   const toggle = tab => {
     return setActiveTab(tab);
   };
+  // 모달 관리
   const [formModal, setFormModal] = useState(false);
+  // 회원 정보 조회
   const { userPage } = useSelector(state => state.UserPageState);
+  // 로그인 정보 조회
   const { user } = useSelector(state => state.authState);
 
+  // 회원 정보
   const [userInfo, setUserInfo] = useState();
 
+  // 휴대폰 번호 변경
   const [inputHpno, setInputHpno] = useState('');
+  // 인증번호
   const [inputCrtfy, setInputCrtfy] = useState('');
 
+  // 타이머 분
   const [minutes_Counter, setMinutes_Counter] = useState('03');
+  // 타이머 초
   const [seconds_Counter, setSeconds_Counter] = useState('00');
+  // 타이머
   const [timer, setTimer] = useState(null);
+  // 타이머 실행 여부
   const [isRunning, setIsRunning] = useState(false);
+  // 인증번호 발송 횟수
   const [sendCount, setSendCount] = useState(0);
+  // 인증번호 발송 여부
   const [isCrtfy, setIsCrtfy] = useState(false);
-
+  // 전화번호 변경 여부
   const [okinput, setOkinput] = useState(false);
+  // 전화번호 업데이트 여부
   const [okcheck, setOkcheck] = useState('');
 
+  // 모달 관리
   const [modal, setModal] = useState({
     isOpen: false,
     title: '',
@@ -68,6 +84,7 @@ const AccountMypageContainer = () => {
     desc: '',
     color: ''
   });
+  // 타이머
   const timerStart = count => {
     let minutes, seconds;
 
@@ -101,6 +118,7 @@ const AccountMypageContainer = () => {
       clearInterval(timer);
     };
   };
+  //
   useEffect(() => {
     if (userInfo) {
       setOkcheck(!okinput ? userInfo.hpno : inputHpno);
@@ -179,6 +197,7 @@ const AccountMypageContainer = () => {
     // handlerSmsSend();
   };
 
+  // 타이머 언마운트시 종료
   useEffect(() => {
     // setIsRunning(true);
     if (isRunning) {
@@ -243,10 +262,12 @@ const AccountMypageContainer = () => {
     setIsCrtfy(true);
   };
 
+  // userInfo에 회원 정보 값 넣기
   useEffect(() => {
     if (userPage) setUserInfo(userPage[0]);
   }, [userPage]);
 
+  // input 헨들러
   const handlerInput = e => {
     const { name, value } = e.target;
     setUserInfo({
@@ -254,19 +275,22 @@ const AccountMypageContainer = () => {
       [name]: value
     });
   };
-
+  // 회원 정보 조회
   useEffect(() => {
     if (user) {
       dispatch(userPageAction.request(user.cstmrSno));
     }
   }, []);
 
+  // 휴대폰 번호 변경 모달 헨들러
   const handler = () => {
     setFormModal(!formModal);
   };
 
   let hpno = '';
   let crtfyhp = '';
+
+  // 휴대폰 번호 변경 input 헨들러
   const handlerChange = e => {
     const { name, value } = e.target;
 
@@ -284,6 +308,7 @@ const AccountMypageContainer = () => {
       }
     }
   };
+
   //업데이트
   const handlerUpdate = () => {
     const reg_email =
@@ -306,6 +331,7 @@ const AccountMypageContainer = () => {
     }
   };
 
+  // 탈퇴 모달
   const handlerTest = () => {
     setQuite({
       isOpen: true,
@@ -314,6 +340,7 @@ const AccountMypageContainer = () => {
     });
   };
 
+  // 탈퇴
   const waitwait = () => {
     dispatch(userDeleteAction.request(user.cstmrSno));
   };
diff --git a/src/containers/statistics/AbnormalSituationContainer.js b/src/containers/statistics/AbnormalSituationContainer.js
index 290175d..3605f1c 100644
--- a/src/containers/statistics/AbnormalSituationContainer.js
+++ b/src/containers/statistics/AbnormalSituationContainer.js
@@ -9,12 +9,14 @@ import StatisticsTotal from '../../components/statistics/StatisticsTotal';
 export default function AbnormalSituationContainer() {
   const dispatch = useDispatch();
 
+  // 비정상상황 통계 (비행경로이탈, 비정상고도, 충돌위험), 비정상상황 통계 카테고리별 검색
   const { abnormal, abnormalSearch } = useSelector(
     state => state.statisticsState
   );
+  // 회원 정보 조회
   const { user } = useSelector(state => state.authState);
-  // const { entireGroupList } = useSelector(state => state.groupState);
 
+  // 검색 타입
   const [searchType, setSearchType] = useState({
     category: 'PLAN',
     dateType: 'year',
@@ -23,13 +25,18 @@ export default function AbnormalSituationContainer() {
     month: new Date().getMonth() + 1,
     day: new Date().getDate()
   });
+
+  // 해당 월에 맞는 요일
   const [dateLists, setDateLists] = useState({
     month: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
     day: []
   });
 
+  // 타이틀
   const titleName = '비정상상황 통계';
+  // 전체 타이틀
   const totalTitle = ['비행경로이탈', '비정상고도', '충돌위험'];
+  // 카테고리 타입
   const categoryTypeOptions = {
     PLAN: '비행경로이탈',
     ALTITUDE: '비정상고도',
@@ -101,11 +108,13 @@ export default function AbnormalSituationContainer() {
     return { max, stepSize };
   };
 
+  // 최대값 계산
   const calculateMax = data => {
     const max = Math.max(...data);
     return Math.ceil(max / 5) * 5;
   };
 
+  // 막대 그래프의 y축 간격(step size)를 계산
   const handlerStepSize = max => {
     const step = Math.ceil(max / 5);
 
diff --git a/src/containers/statistics/FlightContainer.js b/src/containers/statistics/FlightContainer.js
index a7dc31f..acc4ede 100644
--- a/src/containers/statistics/FlightContainer.js
+++ b/src/containers/statistics/FlightContainer.js
@@ -9,10 +9,13 @@ import StatisticsSearch from '../../components/statistics/StatisticsSearch';
 export default function FlightContainer() {
   const dispatch = useDispatch();
 
+  // 비행 통계 (비행시간, 비행거리, 비행횟수), 비행 통계 카테고리별 검색
   const { flight, flightSearch } = useSelector(state => state.statisticsState);
+  // 회원 정보 조회
   const { user } = useSelector(state => state.authState);
   // const { entireGroupList } = useSelector(state => state.groupState);
 
+  // 검색 타입
   const [searchType, setSearchType] = useState({
     category: 'TIME',
     dateType: 'year',
@@ -21,13 +24,17 @@ export default function FlightContainer() {
     month: new Date().getMonth() + 1,
     day: new Date().getDate()
   });
+  // 해당 월에 맞는 요일
   const [dateLists, setDateLists] = useState({
     month: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
     day: []
   });
 
+  // 타이틀
   const titleName = '비행 통계';
+  // 전체 타이틀
   const totalTitle = ['총 비행시간', '총 비행거리', '총 비행횟수'];
+  // 카테고리 타입
   const categoryTypeOptions = {
     TIME: '비행 시간',
     DISTANCE: '비행 거리',
@@ -99,11 +106,12 @@ export default function FlightContainer() {
     return { max, stepSize };
   };
 
+  // 최대값 계산
   const calculateMax = data => {
     const max = Math.max(...data);
     return Math.ceil(max / 5) * 5;
   };
-
+  // 막대 그래프의 y축 간격(step size)를 계산
   const handlerStepSize = max => {
     const step = Math.ceil(max / 5);
 
@@ -148,6 +156,7 @@ export default function FlightContainer() {
     return number.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
   };
 
+  // 함수 단위 포멧팅
   const formatPart = (value, unit, isLastIndex) => {
     return value > 0 || isLastIndex ? `${value}${unit}` : '';
   };
@@ -182,6 +191,7 @@ export default function FlightContainer() {
     return parts.join(' ');
   };
 
+  // 975 -> { days: 0, hours: 0, minutes: 16, seconds: 15 }
   const secondsToDHMS = time => {
     const days = Math.floor(time / (24 * 3600));
     const hours = Math.floor((time % (24 * 3600)) / 3600);
diff --git a/src/containers/statistics/FlightResultContainer.js b/src/containers/statistics/FlightResultContainer.js
index 38b6291..cb6dc3f 100644
--- a/src/containers/statistics/FlightResultContainer.js
+++ b/src/containers/statistics/FlightResultContainer.js
@@ -9,10 +9,13 @@ import StatisticsSearch from '../../components/statistics/StatisticsSearch';
 export default function ResultContainer() {
   const dispatch = useDispatch();
 
+  // 비행 실적 통계 (비행실적, 비행계획, 비행승인), 비행 실적 통계 카테고리별 검색
   const { result, resultSearch } = useSelector(state => state.statisticsState);
+  // 회원 정보 조회
   const { user } = useSelector(state => state.authState);
   // const { entireGroupList } = useSelector(state => state.groupState);
 
+  // 검색 타입
   const [searchType, setSearchType] = useState({
     category: 'FLT_RESULT',
     dateType: 'year',
@@ -21,13 +24,16 @@ export default function ResultContainer() {
     month: new Date().getMonth() + 1,
     day: new Date().getDate()
   });
+  // 해당 월에 맞는 요일
   const [dateLists, setDateLists] = useState({
     month: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
     day: []
   });
-
+  // 타이틀
   const titleName = '비행 실적 통계';
+  // 전체 타이틀
   const totalTitle = ['비행 실적', '비행 계획', '비행 승인'];
+  // 카테고리 타입
   const categoryTypeOptions = {
     FLT_RESULT: '비행 실적',
     FLT_PLAN: '비행 계획',
@@ -99,11 +105,13 @@ export default function ResultContainer() {
     return { max, stepSize };
   };
 
+  // 최대값 계산
   const calculateMax = data => {
     const max = Math.max(...data);
     return Math.ceil(max / 5) * 5;
   };
 
+  // 막대 그래프의 y축 간격(step size)를 계산
   const handlerStepSize = max => {
     const step = Math.ceil(max / 5);