조종사 검색기능 추가

src/components/basis/flight/plan/FlightPlanPilot.js

@@ -3,7 +3,7 @@ import {Button, Card, CardBody, Col, CustomInput, Row, FormGroup, Input, Label}
 import {Search} from 'react-feather';
 import {GridDatabase} from '../../../crud/grid/GridDatatable';
 
-const FlightPlanPilot = ({ pilotList, handleSelectPilot }) => {
+const FlightPlanPilot = ({ pilotList, handleSelectPilot, returnPilot, onClickEvent, setInputVal }) => {
     const columns = [
         {id: 'groupNm', name: '그룹 명', cell: row => (<div>{row.groupNm}</div>)},
         {id: 'memberName', name: '성명', cell: row => (<div>{row.memberName}</div>)},
@@ -33,7 +33,7 @@ const FlightPlanPilot = ({ pilotList, handleSelectPilot }) => {
                             <Button.Ripple
                                 color='primary'
                                 size='sm'
-                                // onClick={handleClickSearch}
+                                onClick={onClickEvent}
                             >
                                 <Search size={16}/>
                                 검색
@@ -57,7 +57,7 @@ const FlightPlanPilot = ({ pilotList, handleSelectPilot }) => {
                                                             id='memberName'
                                                             name='memberName'
                                                             // value={props.params.groupNm}
-                                                            // onChange={props.handlerInput}
+                                                            onChange={(e) => {setInputVal(e.target.value)}}
                                                             bsSize='sm'
                                                             // onKeyPress={props.onKeyPress}
                                                             placeholder='성명을 입력하세요'
@@ -82,7 +82,7 @@ const FlightPlanPilot = ({ pilotList, handleSelectPilot }) => {
             <div className='cont-ti d-flex justify-content-between align-items-sm-center align-items-start flex-sm-row'>
                 <div>
                     <h4>조종사 목록</h4>
-                    <span className='search-case'>검색결과 총 {!!pilotList ? pilotList.length : 0}건</span>
+                    <span className='search-case'>검색결과 총 {!!returnPilot ? [returnPilot].length : 0}건</span>
                 </div>      
                 <div className='d-flex align-items-center'></div>                  
             </div>
@@ -90,8 +90,8 @@ const FlightPlanPilot = ({ pilotList, handleSelectPilot }) => {
                 <Card>
                     <div className='invoice-list-dataTable'>
                         <GridDatabase                            
-                            data={pilotList}
+                            data={[returnPilot]}
-                            count={pilotList ? pilotList.length : 0}
+                            count={returnPilot ? [returnPilot].length : 0}
                             columns={columns}
                             // pagination={props.pagination}
                         />                                

src/containers/basis/flight/plan/FlightPlanPilotContainer.js

@@ -6,6 +6,8 @@ import FlightPlanPilot from '../../../../components/basis/flight/plan/FlightPlan
 const FlightPlanPilotContainer = ({handleModal, type}) => {
     const dispatch = useDispatch();
     const { pilotList, selectGroup } = useSelector(state => state.flightState);
+    const [returnPilot, setReturnPilot] = useState('');
+    const [inputVal , setInputVal] = useState('');
 
 
     /* 조종사 조회 */
@@ -19,7 +21,7 @@ const FlightPlanPilotContainer = ({handleModal, type}) => {
 
     /* 조종사 선택 */
     const handleSelectPilot = (cstmrSno) => {
-        handleModal({target: 'poilot', isOpen: false});
+        handleModal({target: 'pilot', isOpen: false});
 
         const pilot = pilotList.find(pilot => {
             return pilot.cstmrSno === cstmrSno;
@@ -32,11 +34,41 @@ const FlightPlanPilotContainer = ({handleModal, type}) => {
         handleSearch();
     }, [])
 
+    useEffect(()=> {
+            console.log('goToHome')
+            if(pilotList) {
+                onTest();
+            }
+    },[pilotList])
+
+
+
+    const onClickEvent= (e)=> {
+        setInputVal(e.target.value);
+        onTest();
+    }
 
+    const onTest = () => {
+        pilotList.filter((unit) =>{
+            if(inputVal==''){
+             setReturnPilot(unit)
+            }else if(unit.memberName.includes(inputVal)){
+             setReturnPilot(unit)
+             console.log("Filtered >>>>" , returnPilot)
+            }else if (inputVal != ''){
+             setReturnPilot('')
+            }
+         })
+    }
     return (
         <FlightPlanPilot 
-            pilotList = {pilotList}
             handleSelectPilot={handleSelectPilot}
+            handleSearch={handleSearch}
+            onClickEvent={onClickEvent}
+            pilotList={pilotList}
+            returnPilot={returnPilot}
+            setInputVal={setInputVal}
+            
         />        
     )
 }