From 366efdec2703a253eac91c2aff7d56deeef01e81 Mon Sep 17 00:00:00 2001
From: junh_eee <junh_eee@naver.com>
Date: Mon, 11 Jul 2022 17:46:56 +0900
Subject: [PATCH] =?UTF-8?q?=EB=B9=84=ED=96=89=EA=B3=84=ED=9A=8D=EC=84=9C?=
 =?UTF-8?q?=20=EC=8B=A0=EC=B2=AD=20-=20=EA=B2=80=EC=83=89=20=ED=8F=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package-lock.json                             |  24 +
 public/index.html                             |  25 +
 .../basis/flight/plan/FlightPlanAreaForm.js   | 182 ++---
 .../basis/flight/plan/FlightPlanForm.js       | 716 +++++++++---------
 .../basis/flight/plan/FlightPlanGrid.js       |  76 +-
 .../basis/flight/plan/FlightPlanSearch.js     | 174 +++++
 .../basis/flight/plan/FlightPlanContainer.js  |  24 +-
 7 files changed, 731 insertions(+), 490 deletions(-)
 create mode 100644 src/components/basis/flight/plan/FlightPlanSearch.js

diff --git a/package-lock.json b/package-lock.json
index 059007a..f210754 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11260,6 +11260,11 @@
         "verror": "1.10.0"
       }
     },
+    "jsts": {
+      "version": "2.9.0",
+      "resolved": "https://registry.npmjs.org/jsts/-/jsts-2.9.0.tgz",
+      "integrity": "sha512-QU9aQ+qZOSkMcX+ZZQevW0nswoKGAVoFfDycmAQeeHNYMnB4PoopiCXMKE2t93mEZeM82ikUA+eGdJjfJN5AkA=="
+    },
     "jsx-ast-utils": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-3.2.0.tgz",
@@ -11865,6 +11870,11 @@
       "resolved": "https://registry.npmjs.org/methods/-/methods-1.1.2.tgz",
       "integrity": "sha1-VSmk1nZUE07cxSZmVoNbD4Ua/O4="
     },
+    "mgrs": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/mgrs/-/mgrs-1.0.0.tgz",
+      "integrity": "sha512-awNbTOqCxK1DBGjalK3xqWIstBZgN6fxsMSiXLs9/spqWkF2pAhb2rrYCFSsr1/tT7PhcDGjZndG8SWYn0byYA=="
+    },
     "microevent.ts": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/microevent.ts/-/microevent.ts-0.1.1.tgz",
@@ -18883,6 +18893,15 @@
       "resolved": "https://registry.npmjs.org/progress/-/progress-2.0.3.tgz",
       "integrity": "sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA=="
     },
+    "proj4": {
+      "version": "2.8.0",
+      "resolved": "https://registry.npmjs.org/proj4/-/proj4-2.8.0.tgz",
+      "integrity": "sha512-baC+YcD4xsSqJ+CpCZljj2gcQDhlKb+J+Zjv/2KSBwWNjk4M0pafgQsE+mWurd84tflMIsP+7j7mtIpFDHzQfQ==",
+      "requires": {
+        "mgrs": "1.0.0",
+        "wkt-parser": "^1.3.1"
+      }
+    },
     "promise": {
       "version": "7.3.1",
       "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
@@ -25216,6 +25235,11 @@
       "resolved": "https://registry.npmjs.org/wildcard/-/wildcard-1.1.2.tgz",
       "integrity": "sha1-pwIEUwhNjNLv5wup02liY94XEKU="
     },
+    "wkt-parser": {
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/wkt-parser/-/wkt-parser-1.3.2.tgz",
+      "integrity": "sha512-A26BOOo7sHAagyxG7iuRhnKMO7Q3mEOiOT4oGUmohtN/Li5wameeU4S6f8vWw6NADTVKljBs8bzA8JPQgSEMVQ=="
+    },
     "wmf": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/wmf/-/wmf-1.0.2.tgz",
diff --git a/public/index.html b/public/index.html
index abe946a..cb9247d 100644
--- a/public/index.html
+++ b/public/index.html
@@ -17,6 +17,31 @@
       type="text/javascript"
       src="https://openapi.map.naver.com/openapi/v3/maps.js?ncpClientId=5md90yszqj&submodules=geocoder,drawing"
     ></script>
+    <script
+      type="text/javascript"
+      src="https://cdnjs.cloudflare.com/ajax/libs/jsts/2.0.3/jsts.min.js"
+    ></script>
+
+    <!-- <script type="text/javascript" src="http://maps.google.com/maps/api/js?key=AIzaSyDKCsI8cbzgi4es3xCUIhElUm6NRM73QuI" ></script> -->
+
+    <!-- <script
+      type="text/javascript"
+      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDKCsI8cbzgi4es3xCUIhElUm6NRM73QuI&callback=initMap"
+    ></script> -->
+
+    <!-- <script
+      type="text/javascript"
+      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDKCsI8cbzgi4es3xCUIhElUm6NRM73QuI&callback=initMap"
+    ></script> -->
+
+<!--   
+    <script
+      type="text/javascript"
+      src="http://maps.googleapis.com/maps/api/js"
+    ></script> -->
+    <!-- <link href="resources/openlayers/ol.css"rel="stylesheet">
+    <script src="resources/openlayers/ol.js"></script>
+    <script src="resources/js/proj4.js"></script> -->
 
     <!--
       Notice the use of %PUBLIC_URL% in the tags above.
diff --git a/src/components/basis/flight/plan/FlightPlanAreaForm.js b/src/components/basis/flight/plan/FlightPlanAreaForm.js
index 50ef001..4e9f1c0 100644
--- a/src/components/basis/flight/plan/FlightPlanAreaForm.js
+++ b/src/components/basis/flight/plan/FlightPlanAreaForm.js
@@ -17,98 +17,98 @@ import {
 const FlightPlanAreaForm = (props) => {    
 
     return (        
-        <Card>
-            <CardBody>                        
-                <div className='search-cont search-info pd-0'>
-                    <div className='cont-ti mb-1 d-flex justify-content-between align-items-sm-center align-items-start flex-sm-row'>
-                        <div>
-                        <h4>상세 정보</h4>
-                        </div>
-                        <div className='final'>
-                        {/* {props.type === 'update' ? (
-                            <span>최종 수정일자 : {props.updateDt}</span>
-                        ) : null} */}
-                        </div>
-                    </div>
+      <Card>
+        <CardBody>                        
+          <div className='search-cont search-info pd-0'>
+            <div className='cont-ti mb-1 d-flex justify-content-between align-items-sm-center align-items-start flex-sm-row'>
+              <div>
+                <h4>상세 정보</h4>
+              </div>
+              <div className='final'>
+              {/* {props.type === 'update' ? (
+                  <span>최종 수정일자 : {props.updateDt}</span>
+              ) : null} */}
+              </div>
+            </div>
+              
+            <dl>
+              <dt>                                                                                    
+                <div className='search-info-box'>
+                  <Row>
+                    <Col className='list-input' lg={6} md={6} sm={12}>
+                      <FormGroup>
+                        <Label for='test'>
+                          <span className='necessary'></span>반경(m)
+                        </Label>
+                        <Input
+                          type='text'
+                          id='radius'
+                          name='radius'                                                    
+                          size='sm'
+                          placeholder='' 
+                          innerRef={props.data}                                                                                      
+                        />                                            
+                      </FormGroup>
+                    </Col>   
+                  </Row>
+                </div> 
+                <div className='search-info-box'>
+                  <Row>
+                    <Col className='list-input' lg={6} md={6} sm={12}>
+                      <FormGroup className='m_ft'>
+                        <div className='m_ft_box'>
+                          <Label for='test'>
+                            <span className='necessary'></span>고도(m/ft)
+                          </Label>
+                          <Input
+                            type='text'
+                            id='altitude_m'
+                            name='altitude_m'                                                    
+                            size='sm'
+                            placeholder='m'       
+                            innerRef={props.data}                                                     
+                            />        
+                        </div>         
+                        <div className='m_ft_box'>                              
+                          <Input
+                            type='text'
+                            id='altitude'
+                            name='altitude'                                                    
+                            size='sm'
+                            placeholder='ft'     
+                            innerRef={props.data}                                                
+                          />
+                        </div>                                                
+                      </FormGroup>                                                
+                    </Col>    
+                  </Row>
+                </div>  
 
-                    <dl>
-                        <dt>                                                                                    
-                            <div className='search-info-box'>
-                                <Row>
-                                    <Col className='list-input' lg={6} md={6} sm={12}>
-                                        <FormGroup>
-                                        <Label for='test'>
-                                            <span className='necessary'></span>반경(m)
-                                        </Label>
-                                        <Input
-                                            type='text'
-                                            id='radius'
-                                            name='radius'                                                    
-                                            size='sm'
-                                            placeholder='' 
-                                            innerRef={props.data}                                                                                      
-                                        />                                            
-                                        </FormGroup>
-                                    </Col>   
-                                </Row>
-                            </div> 
-                            <div className='search-info-box'>
-                                <Row>
-                                    <Col className='list-input' lg={6} md={6} sm={12}>
-                                        <FormGroup className='m_ft'>
-                                            <div className='m_ft_box'>
-                                            <Label for='test'>
-                                                <span className='necessary'></span>고도(m/ft)
-                                            </Label>
-                                            <Input
-                                                type='text'
-                                                id='altitude_m'
-                                                name='altitude_m'                                                    
-                                                size='sm'
-                                                placeholder='m'       
-                                                innerRef={props.data}                                                     
-
-                                            />        
-                                            </div>         
-                                            <div className='m_ft_box'>                              
-                                            <Input
-                                                type='text'
-                                                id='altitude'
-                                                name='altitude'                                                    
-                                                size='sm'
-                                                placeholder='ft'     
-                                                innerRef={props.data}                                                
-                                            />
-                                            </div>                                                
-                                        </FormGroup>                                                
-                                    </Col>    
-                                </Row>
-                            </div>  
-                            <Button.Ripple
-                                className='mr-1'
-                                color='primary'
-                                size='sm'
-                                onClick={
-                                    props.submit
-                                }
-                            >
-                                확인
-                            </Button.Ripple>
-                            <Button.Ripple
-                                className='mr-1'
-                                color='danger'
-                                size='sm'
-                                onClick={() => 
-                                    props.setModal({ ...props.modal, isOpen: !props.modal.isOpen })
-                                }
-                            >
-                                취소
-                            </Button.Ripple>
-                        </dt>
-                    </dl>
-                </div>                                                
-            </CardBody>
-        </Card>
+                <Button.Ripple
+                  className='mr-1'
+                  color='primary'
+                  size='sm'
+                  onClick={
+                    props.submit
+                  }
+                >
+                  확인
+                </Button.Ripple>
+                <Button.Ripple
+                  className='mr-1'
+                  color='danger'
+                  size='sm'
+                  onClick={() => 
+                      props.setModal({ ...props.modal, isOpen: !props.modal.isOpen })
+                  }
+                >
+                  취소
+                </Button.Ripple>
+              </dt>
+            </dl>
+          </div>                                                
+        </CardBody>
+      </Card>
     )
 }
 
diff --git a/src/components/basis/flight/plan/FlightPlanForm.js b/src/components/basis/flight/plan/FlightPlanForm.js
index 2df3b01..26e633e 100644
--- a/src/components/basis/flight/plan/FlightPlanForm.js
+++ b/src/components/basis/flight/plan/FlightPlanForm.js
@@ -14,373 +14,373 @@ import '@styles/react/libs/flatpickr/flatpickr.scss';
 
 
 const FlightPlanForm = (props) => {
-    return (
-        <Row>
-            <Col sm='12'>
+  return (
+    <Row>
+      <Col sm='12'>
+        <Card>
+          <CardBody className='pt-2 card-body-tab-cont'>                                        
+            <Row>
+              <Col>
                 <Card>
-                <CardBody className='pt-2 card-body-tab-cont'>                                        
-                <Row>
-                    <Col>
-                        <Card>
-                        <CardBody className='pal-card-body'>
-                            <div className='search-cont search-info pd-0'>
-                            <div className='cont-ti mb-1 d-flex justify-content-between align-items-sm-center align-items-start flex-sm-row'>
-                                <div>
-                                <h4> 상세정보</h4>
-                                </div>
-                                <div className='final'>
-                                {/* {props.type === 'update' ? (
-                                    <span>최종 수정일자 : {props.updateDt}</span>
-                                ) : null} */}
-                                </div>
-                            </div>
+                  <CardBody className='pal-card-body'>
+                    <div className='search-cont search-info pd-0'>
+                      <div className='cont-ti mb-1 d-flex justify-content-between align-items-sm-center align-items-start flex-sm-row'>
+                        <div>
+                          <h4> 상세정보</h4>
+                        </div>
+                        <div className='final'>
+                        {/* {props.type === 'update' ? (
+                            <span>최종 수정일자 : {props.updateDt}</span>
+                        ) : null} */}
+                        </div>
+                      </div>
 
-                            <dl>
-                                <dt>
-                                <div className='search-info-ti d-flex justify-content-between'>
-                                    <h4 className='ti'>신청인 정보</h4>
-                                </div>
-                                <div className='search-info-box'>
-                                    <Row>
-                                        <Col className='list-input' lg={4} md={6} sm={12}>
-                                            <FormGroup>
-                                            <Label for='test'><span className='necessary'>*</span>성명</Label>
-                                            <Input
-                                                type='text'
-                                                id='applicantNm'
-                                                name='applicantNm'
-                                                size='sm'
-                                                // innerRef={props.data}                                                
-                                                placeholder=''
-                                            />
-                                            </FormGroup>
-                                        </Col>
-                                        <Col className='list-input' lg={4} md={6} sm={12}>
-                                            <FormGroup>
-                                            <Label for='test'><span className='necessary'>*</span>생년월일</Label>
-                                            <Input
-                                                type='text'
-                                                id='applicantBirthDt'
-                                                name='applicantBirthDt'
-                                                size='sm'                                                
-                                                // innerRef={props.data}
-                                                placeholder=''
-                                            />
-                                            </FormGroup>
-                                        </Col>                                        
-                                    </Row>    
-                                </div>
-                                <div className='search-info-box'>
-                                    <Row>
-                                        <Col className='list-input' lg={4} md={6} sm={12}>
-                                            <FormGroup>
-                                            <Label for='test'><span className='necessary'>*</span>전화 번호</Label>
-                                            <Input
-                                                type='text'
-                                                id='applicantPhone'
-                                                name='applicantPhone'
-                                                size='sm'                                                
-                                                // innerRef={props.data}
-                                                placeholder=''
-                                            />
-                                            </FormGroup>
-                                        </Col>
-                                        <Col className='list-input' lg={4} md={6} sm={12}>
-                                            <FormGroup>
-                                            <Label for='test'><span className='necessary'></span>팩스 번호</Label>
-                                            <Input
-                                                type='text'
-                                                id='applicantPhone'
-                                                name='applicantPhone'
-                                                size='sm'                                                
-                                                // innerRef={props.data}
-                                                placeholder=''
-                                            />
-                                            </FormGroup>
-                                        </Col>
-                                    </Row>
-                                </div>                          
+                      <dl>
+                        <dt>
+                          <div className='search-info-ti d-flex justify-content-between'>
+                            <h4 className='ti'>신청인 정보</h4>
+                          </div>
+                          <div className='search-info-box'>
+                            <Row>
+                              <Col className='list-input' lg={4} md={6} sm={12}>
+                                <FormGroup>
+                                  <Label for='test'><span className='necessary'>*</span>성명</Label>
+                                  <Input
+                                    type='text'
+                                    id='applicantNm'
+                                    name='applicantNm'
+                                    size='sm'
+                                    // innerRef={props.data}                                                
+                                    placeholder=''
+                                    />
+                                  </FormGroup>
+                              </Col>
+                              <Col className='list-input' lg={4} md={6} sm={12}>
+                                <FormGroup>
+                                  <Label for='test'><span className='necessary'>*</span>생년월일</Label>
+                                  <Input
+                                    type='text'
+                                    id='applicantBirthDt'
+                                    name='applicantBirthDt'
+                                    size='sm'
+                                    // innerRef={props.data}
+                                    placeholder=''
+                                  />
+                                </FormGroup>
+                              </Col>                                        
+                            </Row>    
+                          </div>
+                          <div className='search-info-box'>
+                            <Row>
+                              <Col className='list-input' lg={4} md={6} sm={12}>
+                                <FormGroup>
+                                  <Label for='test'><span className='necessary'>*</span>전화 번호</Label>
+                                  <Input
+                                    type='text'
+                                    id='applicantPhone'
+                                    name='applicantPhone'
+                                    size='sm'
+                                    // innerRef={props.data}
+                                    placeholder=''
+                                  />
+                                </FormGroup>
+                              </Col>
+                              <Col className='list-input' lg={4} md={6} sm={12}>
+                                <FormGroup>
+                                  <Label for='test'><span className='necessary'></span>팩스 번호</Label>
+                                  <Input
+                                    type='text'
+                                    id='applicantPhone'
+                                    name='applicantPhone'
+                                    size='sm'
+                                    // innerRef={props.data}
+                                    placeholder=''
+                                  />
+                                </FormGroup>
+                              </Col>
+                            </Row>
+                          </div>                          
                                 
 
-                                {/* <div className='search-info-box'>
-                                    <Row>
-                                        <Col className='list-input' lg={4} md={6} sm={12}>
-                                            <FormGroup>
-                                            <Label for='test'><span className='necessary'>*</span>주소</Label>
-                                            <Input
-                                                type='text'
-                                                id='applicantAddress'
-                                                name='applicantAddress'
-                                                size='sm'                                                
-                                                // innerRef={props.data}
-                                                placeholder=''
-                                            />
-                                            </FormGroup>
-                                        </Col>
-                                        <Col className='list-input' lg={4} md={6} sm={12}>
-                                            <FormGroup>
-                                            <Label for='test'><span className='necessary'>*</span>상세 주소</Label>
-                                            <Input
-                                                type='text'
-                                                id='applicantAddress'
-                                                name='applicantAddress'
-                                                size='sm'                                                
-                                                // innerRef={props.data}
-                                                placeholder=''
-                                            />
-                                            </FormGroup>
-                                        </Col>                                        
-                                    </Row>
-                                </div> */}
-                                </dt>
+                          {/* <div className='search-info-box'>
+                              <Row>
+                                  <Col className='list-input' lg={4} md={6} sm={12}>
+                                      <FormGroup>
+                                      <Label for='test'><span className='necessary'>*</span>주소</Label>
+                                      <Input
+                                          type='text'
+                                          id='applicantAddress'
+                                          name='applicantAddress'
+                                          size='sm'                                                
+                                          // innerRef={props.data}
+                                          placeholder=''
+                                      />
+                                      </FormGroup>
+                                  </Col>
+                                  <Col className='list-input' lg={4} md={6} sm={12}>
+                                      <FormGroup>
+                                      <Label for='test'><span className='necessary'>*</span>상세 주소</Label>
+                                      <Input
+                                          type='text'
+                                          id='applicantAddress'
+                                          name='applicantAddress'
+                                          size='sm'                                                
+                                          // innerRef={props.data}
+                                          placeholder=''
+                                      />
+                                      </FormGroup>
+                                  </Col>                                        
+                              </Row>
+                          </div> */}
+                        </dt>
 
-                                <dt>
-                                <div className='search-info-ti d-flex justify-content-between'>
-                                    <h4 className='ti'>비행 계획 정보</h4>
-                                </div>
-                                <div className='search-info-box'>
-                                    <Row>
-                                        <Col className='list-input' lg={4} md={6} sm={12}>
-                                            <FormGroup>                                                
-                                                <Label for='test'>
-                                                    <span className='necessary'>*</span>시작 기간
-                                                </Label>
-                                                <Flatpickr size='sm' className='form-control calendar-flat' />                                                                                        
-                                            </FormGroup>
-                                        </Col>
-                                        <Col className='list-input' lg={4} md={6} sm={12}>
-                                            <FormGroup>
-                                                <Label for='test'>
-                                                    <span className='necessary'>*</span>종료 기간
-                                                </Label>
-                                                <Flatpickr size='sm' className='form-control calendar-flat' />   
-                                            </FormGroup>
-                                        </Col>
-                                    </Row>
-                                </div>
-                                <div className='search-info-box'>
-                                    <Row>
-                                        <Col className='list-input' lg={4} md={6} sm={12}>
-                                            <FormGroup>
-                                                <Label for='test'>
-                                                    <span className='necessary'>*</span>비행 장치
-                                                </Label>
-                                                <Input
-                                                    type='select'
-                                                    name='arcrftTypeCd'
-                                                    id='arcrftTypeCd'
-                                                    size='sm'
-                                                    // innerRef={props.data}                                            
-                                                    // className={classnames({
-                                                    // 'is-invalid': props.errors.arcrftTypeCd
-                                                    // })}
-                                                >
-                                                    <option value=''>= 선택 =</option>
-                                                    {/* CDNOT 코드연동 필요 */}
-                                                    {/* {ARCTFT_TYPE_CD.map(item => {
-                                                    return (
-                                                        <option
-                                                        value={item.code}
-                                                        selected={
-                                                            props.data.arcrftTypeCd === item.code
-                                                            ? true
-                                                            : false
-                                                        }
-                                                        >
-                                                        {item.codeNm}
-                                                        </option>
-                                                    );
-                                                    })} */}
-                                                </Input>
-                                            </FormGroup>
-                                        </Col>
-                                        <Col className='list-input' lg={4} md={6} sm={12}>
-                                            <FormGroup>
-                                                <Label for='test'>
-                                                    <span className='necessary'>*</span>비행 목적
-                                                </Label>
-                                                <Input
-                                                    type='select'
-                                                    name='arcrftTypeCd'
-                                                    id='arcrftTypeCd'
-                                                    size='sm'
-                                                    // innerRef={props.data}                                            
-                                                    // className={classnames({
-                                                    // 'is-invalid': props.errors.arcrftTypeCd
-                                                    // })}
-                                                >
-                                                    <option value=''>= 선택 =</option>
-                                                    {/* CDNOT 코드연동 필요 */}
-                                                    {/* {ARCTFT_TYPE_CD.map(item => {
-                                                    return (
-                                                        <option
-                                                        value={item.code}
-                                                        selected={
-                                                            props.data.arcrftTypeCd === item.code
-                                                            ? true
-                                                            : false
-                                                        }
-                                                        >
-                                                        {item.codeNm}
-                                                        </option>
-                                                    );
-                                                    })} */}
-                                                </Input>
-                                            </FormGroup>
-                                        </Col>
-                                        <Col className='list-input' lg={4} md={6} sm={12}>
-                                            <FormGroup>
-                                                <Label for='test'>
-                                                    <span className='necessary'></span>비행 방식
-                                                </Label>
-                                                <Input
-                                                    type='text'
-                                                    id='arcrftModelNm'
-                                                    name='arcrftModelNm'
-                                                    // innerRef={props.data}
-                                                    size='sm'
-                                                    placeholder=''
-                                                    // className={classnames({
-                                                    // 'is-invalid': props.errors.arcrftModelNm
-                                                    // })}
-                                                />
-                                                {/* {props.errors && props.errors.arcrftModelNm && (
-                                                    <FormFeedback>
-                                                    {props.errors.arcrftModelNm.message}
-                                                    </FormFeedback>
-                                                )} */}
-                                            </FormGroup>
-                                        </Col>
-                                    </Row>
-                                </div>                                
-                                </dt>
+                        <dt>
+                          <div className='search-info-ti d-flex justify-content-between'>
+                            <h4 className='ti'>비행 계획 정보</h4>
+                          </div>
+                          <div className='search-info-box'>
+                            <Row>
+                              <Col className='list-input' lg={4} md={6} sm={12}>
+                                <FormGroup>                                                
+                                  <Label for='test'>
+                                    <span className='necessary'>*</span>시작 기간
+                                  </Label>
+                                  <Flatpickr size='sm' className='form-control calendar-flat' />                                                                                        
+                                </FormGroup>
+                              </Col>
+                              <Col className='list-input' lg={4} md={6} sm={12}>
+                                <FormGroup>
+                                  <Label for='test'>
+                                    <span className='necessary'>*</span>종료 기간
+                                  </Label>
+                                  <Flatpickr size='sm' className='form-control calendar-flat' />   
+                                </FormGroup>
+                              </Col>
+                            </Row>
+                          </div>
+                          <div className='search-info-box'>
+                            <Row>
+                              <Col className='list-input' lg={4} md={6} sm={12}>
+                                <FormGroup>
+                                  <Label for='test'>
+                                    <span className='necessary'>*</span>비행 장치
+                                  </Label>
+                                  <Input
+                                    type='select'
+                                    name='arcrftTypeCd'
+                                    id='arcrftTypeCd'
+                                    size='sm'
+                                    // innerRef={props.data}                                            
+                                    // className={classnames({
+                                    // 'is-invalid': props.errors.arcrftTypeCd
+                                    // })}
+                                  >
+                                  <option value=''>= 선택 =</option>
+                                  {/* CDNOT 코드연동 필요 */}
+                                  {/* {ARCTFT_TYPE_CD.map(item => {
+                                  return (
+                                      <option
+                                      value={item.code}
+                                      selected={
+                                          props.data.arcrftTypeCd === item.code
+                                          ? true
+                                          : false
+                                      }
+                                      >
+                                      {item.codeNm}
+                                      </option>
+                                  );
+                                  })} */}
+                                  </Input>
+                                </FormGroup>
+                              </Col>
+                              <Col className='list-input' lg={4} md={6} sm={12}>
+                                <FormGroup>
+                                  <Label for='test'>
+                                    <span className='necessary'>*</span>비행 목적
+                                  </Label>
+                                  <Input
+                                    type='select'
+                                    name='arcrftTypeCd'
+                                    id='arcrftTypeCd'
+                                    size='sm'
+                                    // innerRef={props.data}                                            
+                                    // className={classnames({
+                                    // 'is-invalid': props.errors.arcrftTypeCd
+                                    // })}
+                                  >
+                                  <option value=''>= 선택 =</option>
+                                  {/* CDNOT 코드연동 필요 */}
+                                  {/* {ARCTFT_TYPE_CD.map(item => {
+                                  return (
+                                      <option
+                                      value={item.code}
+                                      selected={
+                                          props.data.arcrftTypeCd === item.code
+                                          ? true
+                                          : false
+                                      }
+                                      >
+                                      {item.codeNm}
+                                      </option>
+                                  );
+                                  })} */}
+                                  </Input>
+                                </FormGroup>
+                              </Col>
+                              <Col className='list-input' lg={4} md={6} sm={12}>
+                                <FormGroup>
+                                  <Label for='test'>
+                                    <span className='necessary'></span>비행 방식
+                                  </Label>
+                                  <Input
+                                    type='text'
+                                    id='arcrftModelNm'
+                                    name='arcrftModelNm'
+                                    // innerRef={props.data}
+                                    size='sm'
+                                    placeholder=''
+                                    // className={classnames({
+                                    // 'is-invalid': props.errors.arcrftModelNm
+                                    // })}
+                                  />
+                                  {/* {props.errors && props.errors.arcrftModelNm && (
+                                      <FormFeedback>
+                                      {props.errors.arcrftModelNm.message}
+                                      </FormFeedback>
+                                  )} */}
+                                </FormGroup>
+                              </Col>
+                            </Row>
+                          </div>                                
+                        </dt>
 
-                                <dt>
-                                    <div className='search-info-ti d-flex justify-content-between'>
-                                        <h4 className='ti'>비행 구역 정보</h4>
-                                        <Button.Ripple 
-                                            color="primary"
-                                            onClick={props.openModal}
-                                        >
-                                            비행 구역 설정
-                                        </Button.Ripple>
-                                    </div>
-                                    <div className='search-info-box'>
-                                        <Row>
-                                            <Col className='list-input' lg={4} md={6} sm={12}>
-                                                <FormGroup>
-                                                <Label for='test'>
-                                                    <span className='necessary'>*</span>주소
-                                                </Label>
-                                                <Input
-                                                    type='text'
-                                                    id='ownerNm'
-                                                    name='ownerNm'                                                    
-                                                    size='sm'
-                                                    placeholder=''        
-                                                    readOnly
-                                                />
-                                                </FormGroup>
-                                            </Col>
-                                            <Col className='list-input' lg={4} md={6} sm={12}>
-                                                <FormGroup>
-                                                <Label for='test'>
-                                                    <span className='necessary'>*</span>좌표
-                                                </Label>
-                                                <Input
-                                                    type='text'
-                                                    id='ownerNm'
-                                                    name='ownerNm'                                                    
-                                                    size='sm'
-                                                    placeholder=''    
-                                                    readOnly                                               
-                                                />
-                                                </FormGroup>
-                                            </Col>
-                                        </Row>
-                                    </div>
-                                    <div className='search-info-box'>
-                                        <Row>
-                                            <Col className='list-input' lg={4} md={6} sm={12}>
-                                                <FormGroup>
-                                                <Label for='test'>
-                                                    <span className='necessary'>*</span>반경(m)
-                                                </Label>
-                                                <Input
-                                                    type='text'
-                                                    id='ownerNm'
-                                                    name='ownerNm'                                                    
-                                                    size='sm'
-                                                    placeholder=''  
-                                                    readOnly                                                 
-                                                />
-                                                </FormGroup>
-                                            </Col>                                            
-                                            <Col className='list-input' lg={4} md={6} sm={12}>
-                                                <FormGroup className='m_ft'>
-                                                    <div className='m_ft_box'>
-                                                    <Label for='test'>
-                                                        <span className='necessary'>*</span>고도(m/ft)
-                                                    </Label>
-                                                    <Input
-                                                        type='text'
-                                                        id='ownerNm'
-                                                        name='ownerNm'                                                    
-                                                        size='sm'
-                                                        placeholder='m'    
-                                                        readOnly                                                      
-                                                    />
-                                                    </div>
-                                                    <div className='m_ft_box'>
-                                                    <Input
-                                                        type='text'
-                                                        id='ownerNm'
-                                                        name='ownerNm'                                                    
-                                                        size='sm'
-                                                        placeholder='ft'   
-                                                        readOnly                                                
-                                                    />
-                                                    </div>
-                                                </FormGroup>
-                                            
-                                            </Col>                                                                                        
-                                        </Row>
-                                    </div>
-                                </dt>
+                        <dt>
+                          <div className='search-info-ti d-flex justify-content-between'>
+                            <h4 className='ti'>비행 구역 정보</h4>
+                              <Button.Ripple 
+                                color="primary"
+                                onClick={props.openModal}
+                              >
+                              비행 구역 설정
+                              </Button.Ripple>
+                          </div>
+                          <div className='search-info-box'>
+                            <Row>
+                              <Col className='list-input' lg={4} md={6} sm={12}>
+                                <FormGroup>
+                                  <Label for='test'>
+                                    <span className='necessary'>*</span>주소
+                                  </Label>
+                                  <Input
+                                    type='text'
+                                    id='ownerNm'
+                                    name='ownerNm'                                                    
+                                    size='sm'
+                                    placeholder=''        
+                                    readOnly
+                                  />
+                                </FormGroup>
+                              </Col>
+                              <Col className='list-input' lg={4} md={6} sm={12}>
+                                <FormGroup>
+                                  <Label for='test'>
+                                    <span className='necessary'>*</span>좌표
+                                  </Label>
+                                <Input
+                                  type='text'
+                                  id='ownerNm'
+                                  name='ownerNm'                                                    
+                                  size='sm'
+                                  placeholder=''    
+                                  readOnly                                               
+                                />
+                                </FormGroup>
+                              </Col>
+                            </Row>
+                          </div>
+                          <div className='search-info-box'>
+                            <Row>
+                              <Col className='list-input' lg={4} md={6} sm={12}>
+                                <FormGroup>
+                                  <Label for='test'>
+                                    <span className='necessary'>*</span>반경(m)
+                                  </Label>
+                                <Input
+                                  type='text'
+                                  id='ownerNm'
+                                  name='ownerNm'                                                    
+                                  size='sm'
+                                  placeholder=''  
+                                  readOnly                                                 
+                                />
+                                </FormGroup>
+                              </Col>                                            
+                              <Col className='list-input' lg={4} md={6} sm={12}>
+                                <FormGroup className='m_ft'>
+                                  <div className='m_ft_box'>
+                                    <Label for='test'>
+                                      <span className='necessary'>*</span>고도(m/ft)
+                                    </Label>
+                                    <Input
+                                      type='text'
+                                      id='ownerNm'
+                                      name='ownerNm'                                                    
+                                      size='sm'
+                                      placeholder='m'    
+                                      readOnly                                                      
+                                    />
+                                  </div>
+                                  <div className='m_ft_box'>
+                                    <Input
+                                      type='text'
+                                      id='ownerNm'
+                                      name='ownerNm'                                                    
+                                      size='sm'
+                                      placeholder='ft'   
+                                      readOnly                                                
+                                    />
+                                  </div>
+                                </FormGroup>
                                 
-                                <div className='d-flex align-items-center'>
-                                    <Button.Ripple
-                                        className='mr-1'
-                                        color='primary'
-                                        size='sm'
-                                        // onClick={
-                                        //     pageType === 'create'
-                                        //     ? handleSubmit(handlerCreate)
-                                        //     : handleSubmit(handlerUpdate)
-                                        // }
-                                    >
-                                        저장
-                                    </Button.Ripple>
-                                    <Button.Ripple 
-                                        color='danger' 
-                                        size='sm'
-                                        // onClick={handlerDelete}
-                                    >
-                                        삭제
-                                    </Button.Ripple>
-                                </div>
+                              </Col>                                                                                        
+                            </Row>
+                          </div>
+                        </dt>
                                 
-                            </dl>
-                            </div>                            
-                        </CardBody>
-                        </Card>
-                        
-                    </Col>
-                    </Row>
-                </CardBody>
+                        <div className='d-flex align-items-center'>
+                          <Button.Ripple
+                            className='mr-1'
+                            color='primary'
+                            size='sm'
+                            // onClick={
+                            //     pageType === 'create'
+                            //     ? handleSubmit(handlerCreate)
+                            //     : handleSubmit(handlerUpdate)
+                            // }
+                          >
+                            저장
+                          </Button.Ripple>
+                          <Button.Ripple 
+                            color='danger' 
+                            size='sm'
+                            // onClick={handlerDelete}
+                          >
+                            삭제
+                          </Button.Ripple>
+                        </div>
+                                
+                      </dl>
+                    </div>                            
+                  </CardBody>
                 </Card>
-            </Col>
-        </Row>
+                      
+              </Col>
+            </Row>
+          </CardBody>
+        </Card>
+      </Col>
+    </Row>
     )
 }
 
diff --git a/src/components/basis/flight/plan/FlightPlanGrid.js b/src/components/basis/flight/plan/FlightPlanGrid.js
index 8e7bb6e..062c220 100644
--- a/src/components/basis/flight/plan/FlightPlanGrid.js
+++ b/src/components/basis/flight/plan/FlightPlanGrid.js
@@ -19,44 +19,48 @@ import {
     CustomInput,
     FormGroup
   } from 'reactstrap';
+import { GridDatabase } from '../../../crud/grid/GridDatatable';
 
 const FlightPlanGrid = (props) => {
-    return (
-        <div className='pal-card-box'>
-            <Row>
-                <Col>
-                <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'>검색결과 총 0건</span>
-                    </div>
-                    <div className='d-flex align-items-center'>
-                    <Button.Ripple
-                        color='primary'
-                        size='sm'
-                        onClick={props.moveFlightPlan}
-                    >
-                        계획서 생성
-                    </Button.Ripple>
-                    </div>
-                </div>
-                <div className='invoice-list-wrapper'>
-                    <Card>
-                    <div className='invoice-list-dataTable'>
-                        {/* <GridDatabase
-                        title={'비행이력'}
-                        // data={props.data}
-                        // count={props.count}
-                        // columns={props.columns}
-                        // pagination={props.pagination}
-                        /> */}
-                    </div>
-                    </Card>
-                </div>
-                </Col>
-            </Row>
-        </div>
-    )
+  return (
+    <div className='pal-card-box'>
+      <Row>
+        <Col>
+          <div className='cont-ti d-flex justify-content-between align-items-sm-center align-items-start flex-sm-row'>
+            <div>
+              {/* <h4>{"비행 계획"} 목록</h4> */}
+              <h4>{"비행계획서 신청"} 목록</h4>
+              <span className='search-case'>검색결과 총 0건</span>
+            </div>
+            <div className='d-flex align-items-center'>
+              <Button.Ripple
+                  color='primary'
+                  size='sm'
+                  onClick={props.moveFlightPlan}
+              >
+                  {/* 계획서 생성 */}
+                  비행계획서 신청
+              </Button.Ripple>
+            </div>
+          </div>
+          <div className='invoice-list-wrapper'>
+            <Card>
+            <div className='invoice-list-dataTable'>
+              <GridDatabase
+              title={'비행이력'}
+              // data={props.data}
+              count={0}
+              // columns={props.columns}
+              // pagination={props.pagination}
+              />
+              {/* 검색된 데이터가 없습니다. */}
+            </div>
+            </Card>
+          </div>
+        </Col>
+      </Row>
+    </div>
+  )
 }
 
 export default FlightPlanGrid;
\ No newline at end of file
diff --git a/src/components/basis/flight/plan/FlightPlanSearch.js b/src/components/basis/flight/plan/FlightPlanSearch.js
new file mode 100644
index 0000000..2bbcb88
--- /dev/null
+++ b/src/components/basis/flight/plan/FlightPlanSearch.js
@@ -0,0 +1,174 @@
+import React, { useEffect, useState } from 'react';
+import {
+    Row,
+    Col,
+    Table,
+    Badge,
+    UncontrolledDropdown,
+    DropdownMenu,
+    DropdownItem,
+    DropdownToggle,
+    Card,
+    CardHeader,
+    CardBody,
+    CardTitle,
+    CardSubtitle,
+    ButtonGroup,
+    Button,
+    Input,
+    CustomInput,
+    FormGroup
+  } from 'reactstrap';
+import { Calendar, Search } from 'react-feather';
+import Flatpickr from 'react-flatpickr';
+
+
+const FlightPlanSearch = (props) => {
+
+  const [isCheck, setIsCheck] = useState({
+    all: true,
+    yes: false,
+    no: false
+  });
+
+  useEffect(() => {
+    let aprvYn = '';
+
+    if (!isCheck.all) {
+      if (isCheck.yes) {
+        aprvYn = 'Y';
+      } else if (isCheck.no) {
+        aprvYn = 'N';
+      } else {
+        aprvYn = '-';
+      }
+    }
+
+    // props.setParams({
+    //   ...props.params,
+    //   aprvYn: aprvYn
+    // });
+  }, [isCheck]);
+
+  return (
+    <div className='pal-card-box'>
+      <Row>
+        <Col>
+          <div className='cont-ti d-flex justify-content-between align-items-sm-center align-items-start flex-sm-row'>
+            <div>
+              <h4>검색조건</h4>
+            </div>
+            <div className='d-flex align-items-center'>
+              <Button.Ripple
+                color='primary'
+                size='sm'
+                onClick={e => props.handlerSearch()}
+              >
+                <Search size={16} />
+                검색
+              </Button.Ripple>
+            </div>
+          </div>
+          <Card>
+            <CardBody className='pal-card-body'>
+              <div className='search-cont'>
+                <dl>
+                  <dt>
+                    <div className='search-box'>
+                      <div className='search-list-ti'>신청일</div>
+                      <div className='search-list'>
+                        <div className='search-list-cont'>
+                          <Row>
+                            <Col className='list-input' xl='4' md='6' sm='12'>
+                              <div className='d-flex align-items-center calendar-flat'>
+                                <Flatpickr
+                                  id='searchDate'
+                                  value={[
+                                    props.params.stDate,
+                                    props.params.endDate
+                                  ]}
+                                  options={{
+                                    mode: 'range',
+                                    defaultDate: [
+                                      props.params.stDate,
+                                      props.params.endDate
+                                    ]
+                                  }}
+                                  onChange={val =>
+                                    props.handlerInput('searchDate', val)
+                                  }
+                                  onKeyPress={props.onKeyPress}
+                                  className='form-control flat-picker bg-transparent border-0 shadow-none'
+                                />
+                              </div>
+                            </Col>
+                          </Row>
+                        </div>
+                      </div>
+                    </div>
+                  </dt>
+
+                  <dt>
+                    <div className='search-box'>
+                      <div className='search-list-ti'>승인여부</div>
+                      <div className='search-list'>
+                        {/* <div className="search-list-cont">
+                            <Input size='sm'/>
+                          </div> */}
+                        <div className='search-list-cont'>
+                          <CustomInput
+                            inline
+                            type='checkbox'
+                            id='exampleCustomCheckbox'
+                            label='전체'
+                            checked={isCheck.all}
+                            onClick={() =>
+                              setIsCheckBox({
+                                all: !isCheck.all,
+                                yes: !isCheck.all,
+                                no: !isCheck.all
+                              })
+                            }
+                          />
+                          <CustomInput
+                            inline
+                            type='checkbox'
+                            id='exampleCustomCheckbox2'
+                            label='승인'
+                            checked={isCheck.yes || isCheck.all}
+                            onClick={() =>
+                              setIsCheckBox({
+                                all: false,
+                                yes: !isCheck.yes
+                              })
+                            }
+                          />
+                          <CustomInput
+                            inline
+                            type='checkbox'
+                            id='exampleCustomCheckbox3'
+                            label='미승인'
+                            checked={isCheck.no || isCheck.all}
+                            onClick={() =>
+                              setIsCheckBox({
+                                all: false,
+                                no: !isCheck.no
+                              })
+                            }
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </dt>
+                </dl>
+              </div>
+            </CardBody>
+          </Card>
+          
+        </Col>
+      </Row>
+    </div>
+  )
+}
+
+export default FlightPlanSearch;
\ No newline at end of file
diff --git a/src/containers/basis/flight/plan/FlightPlanContainer.js b/src/containers/basis/flight/plan/FlightPlanContainer.js
index 980e913..51f71b2 100644
--- a/src/containers/basis/flight/plan/FlightPlanContainer.js
+++ b/src/containers/basis/flight/plan/FlightPlanContainer.js
@@ -1,7 +1,9 @@
-import React, { } from 'react';
+import React, { useState } from 'react';
+import moment from 'moment';
 import { Link, useHistory } from 'react-router-dom';
 import FlightPlanGrid from '../../../../components/basis/flight/plan/FlightPlanGrid';
 import { CustomMainLayout } from '../../../../components/layout/CustomMainLayout';
+import FlightPlanSearch from '../../../../components/basis/flight/plan/FlightPlanSearch';
 
 const FlightPlanContainer = () => {
 
@@ -11,12 +13,24 @@ const FlightPlanContainer = () => {
         history.push('/basis/flight/plan/create');
     };
 
+    const [times, setTimes] = useState({
+      stDate: moment().subtract(1, 'day').format('YYYY-MM-DD'),
+      endDate: moment().subtract(-1, 'day').format('YYYY-MM-DD'),
+      search1: ''
+    })
+
+    // console.log(history, 'history')
+
 
     return (
-        <CustomMainLayout title={"비행 계획 관리"}>
-            <FlightPlanGrid 
-                moveFlightPlan={moveFlightPlan}
-            />
+        // <CustomMainLayout title={"비행 계획 관리"}>
+        <CustomMainLayout title={"비행계획서 신청"}>
+          <FlightPlanSearch 
+            params={times}
+          />
+          <FlightPlanGrid 
+            moveFlightPlan={moveFlightPlan}
+          />
         </CustomMainLayout>
     )
 }