비행이력 현황(최종본)

src/components/analysis/history/AnalysisHistorySearch.js

@@ -1,5 +1,5 @@
 import moment from 'moment';
-import { useEffect, useState } from 'react';
+import { useEffect } from 'react';
 import { Calendar, Search } from 'react-feather';
 import Flatpickr from 'react-flatpickr';
 import {
@@ -13,21 +13,25 @@ import {
 } from 'reactstrap';
 
 export const AnalysisHistorySearch = props => {
-  const [isClick, setIsClick] = useState(1);
+ 
-  const [dateType, setDateType] = useState(1);
   useEffect(() => {
+    if(props.isClick!=0){
     props.setParams({
       ...props.params,
-      stDate: moment().subtract(dateType, 'day').format('YYYY-MM-DD')
+      stDate: moment().subtract(props.dateType, 'day').format('YYYY-MM-DD'),
+      endDate: moment().subtract(0, 'day').format('YYYY-MM-DD'),
+      groupId: props.searchData.groupId
     });
-  
+    }
-  }, [dateType,props.params.groupId]);
+    else{
-
+      props.setParams({
-  const handlerClickDate = val => {
+        ...props.params,
-    setDateType(val);
+        stDate: '',
-    setIsClick(val);
+        endDate: '',
-  };
+        groupId: props.searchData.groupId
-
+      });
+    }
+  }, [props.dateType,props.isClick]);
 
 
   return (
@@ -63,6 +67,7 @@ export const AnalysisHistorySearch = props => {
                             <Col className='list-input' xl='4' md='6' sm='12'>
                               <div className='d-flex align-items-center calendar-flat'>
                                 <Flatpickr
+                                  placeholder="날짜를 선택해주세요"
                                   id='searchDate'
                                   value={[
                                     props.params.stDate,
@@ -89,32 +94,32 @@ export const AnalysisHistorySearch = props => {
                                 <Button
                                   outline
                                   size='sm'
-                                  className={isClick == 1 ? 'active' : ''}
+                                  className={props.isClick == 1 ? 'active' : ''}
-                                  onClick={e => handlerClickDate(1)}
+                                  onClick={e => props.handlerClickDate(1)}
                                 >
                                   최근1일
                                 </Button>
                                 <Button
                                   outline
-                                  className={isClick == 7 ? 'active' : ''}
+                                  className={props.isClick == 7 ? 'active' : ''}
                                   size='sm'
-                                  onClick={e => handlerClickDate(7)}
+                                  onClick={e => props.handlerClickDate(7)}
                                 >
                                   최근7일
                                 </Button>
                                 <Button
                                   outline
-                                  className={isClick == 15 ? 'active' : ''}
+                                  className={props.isClick == 15 ? 'active' : ''}
                                   size='sm'
-                                  onClick={e => handlerClickDate(15)}
+                                  onClick={e => props.handlerClickDate(15)}
                                 >
                                   최근 15일
                                 </Button>
                                 <Button
                                   outline
-                                  className={isClick == 30 ? 'active' : ''}
+                                  className={props.isClick == 30 ? 'active' : ''}
                                   size='sm'
-                                  onClick={e => handlerClickDate(30)}
+                                  onClick={e => props.handlerClickDate(30)}
                                 >
                                   최근 30일
                                 </Button>

src/containers/analysis/history/AnalysisHistoryContainer.js

@@ -8,11 +8,10 @@ import { CustomMainLayout } from '../../../components/layout/CustomMainLayout';
 import * as Actions from '../../../modules/analysis/history/actions/analysisHistoryAction';
 import FlightPlanGroupGrid from '../../../components/basis/flight/plan/FlightPlanGroupGrid';
 import { JOIN_LIST } from '../../../modules/basis/group/actions/basisGroupAction';
-import { Col, Row, Button } from 'reactstrap';
+import { Col, Row, Button, Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
 import * as FlightAction from '../../../modules/basis/flight/actions/basisFlightAction';
-import FlightPlanAprvSearch from '../../../components/basis/flight/aprv/FlightPlanAprvSearch';
-import FlightPlanAprvGrid from '../../../components/basis/flight/aprv/FlightPlanAprvGrid';
 import { useHistory } from 'react-router-dom';
+import { MessageErrorModal } from '../../../components/message/MessageErrorModal';
 
 
 export const AnalysisHistoryContainer = props => {
@@ -28,14 +27,22 @@ export const AnalysisHistoryContainer = props => {
 
   };
 
-  const history = useHistory();
   const [searchData, setSearchData] = useState(initSearchData);
-  const [selPlanSnoList, setSelPlanSnoList] = useState([]);
   const { list: aprvList, aprvProc, selectGroup } = useSelector(state => state.flightState);
   const { joinList, joinListCount } = useSelector(state => state.groupState);
   const { user } = useSelector(state => state.authState, shallowEqual);
 
-  const handleGroupSelect = ({ groupId, groupNm, groupAuthCd }) => {
+  const [isClick, setIsClick] = useState(0);
+  const [dateType, setDateType] = useState(1);
+
+  const [modal, setModal] = useState({
+    isOpen: false,
+    title: '',
+    desc: '',
+    color: ''
+  });
+
+  const handleGroupSelect = ({ groupId }) => {
     // 권한 상관 없이 모두 조회 가능
     const param = searchData;
     // param.cstmrSno = user.cstmrSno;
@@ -47,6 +54,7 @@ export const AnalysisHistoryContainer = props => {
     sessionStorage.setItem('groupId', groupId);
     sessionStorage.setItem('cstmrSno', user.cstmrSno);
 
+    setIsClick(0)
     setSearchData(prevState => {
       return {
         ...prevState,
@@ -54,19 +62,13 @@ export const AnalysisHistoryContainer = props => {
         groupId: groupId
       }
     });
-    dispatch(Actions.list.request({ searchParams: param }));
+    //dispatch(Actions.list.request({ searchParams: param }));
   }
   const handlerGroupCancel = () => {
-    dispatch(FlightAction.FLIGHT_PLAN_GROUP_SELECT({ cstmrSno: 0, groupId: '', groupNm: '' }));
+    dispatch(FlightAction.FLIGHT_PLAN_GROUP_SELECT({ cstmrSno: 0, groupId: '', groupNm: '', endDate: '', stDate: '' }));
-  }
+    setIsClick(0)
-  const handleSearch = (data) => {
-    dispatch(FlightAction.FLIGHT_APRV_LIST.request(data));
 
   }
-  const handleChangeSelected = ({ selectedRows }) => {
-    setSelPlanSnoList(selectedRows.map(item => item.planSno))
-  }
-
 
 
 
@@ -205,20 +207,20 @@ export const AnalysisHistoryContainer = props => {
     endDate: moment().subtract(-1, 'day').format('YYYY-MM-DD'),
     search1: '',
     groupId: searchData.groupId
+
   });
+  console.log(searchData.groupId);
 
   useEffect(() => {
-
-    if (searchParams) {
     setParams({
-        stDate: searchParams.stDate,
+      ...params,
-        endDate: searchParams.endDate,
+      stDate: '',
+      endDate: '',
       search1: '',
       groupId: searchData.groupId
     });
-    }
+  }, [searchData.groupId]);
-    //   handlerSearch();
+
-  }, [searchData]);
 
   useEffect(() => {
     if (data) return;
@@ -230,9 +232,26 @@ export const AnalysisHistoryContainer = props => {
     }
   };
 
-  useEffect(() => { }, [params]);
+  // useEffect(() => { }, [params]);
 
   const handlerSearch = () => {
+    if (!params.stDate || !params.endDate) {
+      setModal({
+        isOpen: true,
+        title: '필수값 입력 오류',
+        desc: '올바른 일자를 입력해 주세요.',
+        color: 'modal-danger'
+      })
+    }
+    else if (!params.groupId) {
+      setModal({
+        isOpen: true,
+        title: '필수값 입력 오류',
+        desc: '그룹 선택 해주세요.',
+        color: 'modal-danger'
+      })
+    }
+    else
       dispatch(Actions.list.request({ searchParams: params }));
   };
 
@@ -247,10 +266,14 @@ export const AnalysisHistoryContainer = props => {
           stDate: moment(val[0]).format('YYYY-MM-DD'),
           endDate: moment(val[1]).format('YYYY-MM-DD'),
         });
-        
+        setIsClick(-1)
       }
     }
   };
+  const handlerClickDate = val => {
+    setDateType(val);
+    setIsClick(val);
+  };
   return (
 
     <CustomMainLayout title={titleName}>
@@ -274,6 +297,10 @@ export const AnalysisHistoryContainer = props => {
                   params={params}
                   onKeyPress={onKeyPress}
                   setParams={setParams}
+                  isClick={isClick}
+                  dateType={dateType}
+                  handlerClickDate={handlerClickDate}
+                  searchData={searchData}
                 />
               </>
 
@@ -294,6 +321,7 @@ export const AnalysisHistoryContainer = props => {
                   excelHeaders={excelHeaders}
                   count={count}
                   pagination={true}
+
                 />
               </>
 
@@ -305,6 +333,31 @@ export const AnalysisHistoryContainer = props => {
           </Col>
         </Row>
       </div>
+      <div className='vertically-centered-modal'>
+        <Modal
+          isOpen={modal.isOpen}
+          toggle={() => setModal({ ...modal, isOpen: !modal.isOpen })}
+          modalClassName={modal.color}
+          className='modal-dialog-centered'
+        >
+          <ModalHeader
+            toggle={() => setModal({ ...modal, isOpen: !modal.isOpen })}
+          >
+            {modal.title}
+          </ModalHeader>
+          <ModalBody>{modal.desc}</ModalBody>
+          <ModalFooter>
+            <Button
+              color='danger'
+              onClick={() => setModal({ ...modal, isOpen: !modal.isOpen })}
+            >
+              확인
+            </Button>{' '}
+          </ModalFooter>
+        </Modal>
+      </div>
+      <MessageErrorModal />
     </CustomMainLayout>
+
   );
 };