From 4ccdf9ac6a2d4e90a538d5cab4aa5446a1f6b828 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?junh=5Feee=28=EC=9D=B4=EC=A4=80=ED=9D=AC=29?=
 <junh_eee@naver.com>
Date: Tue, 26 Sep 2023 11:03:30 +0900
Subject: [PATCH] =?UTF-8?q?laanc=20=EC=83=81=EC=84=B8=EC=A7=80=EB=8F=84?=
 =?UTF-8?q?=EC=97=90=EC=84=9C=20=EB=8F=84=ED=98=95=20=EC=82=AC=EB=9D=BC?=
 =?UTF-8?q?=EC=A7=80=EB=8A=94=20=ED=98=84=EC=83=81=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/map/mapbox/draw/LanncDraw.js |  7 ++++++-
 src/views/laanc/FlightArea.js               |  5 ++---
 src/views/laanc/LaancAreaMap.js             | 18 +++++++++---------
 3 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/src/components/map/mapbox/draw/LanncDraw.js b/src/components/map/mapbox/draw/LanncDraw.js
index e39c3db..9c05ee3 100644
--- a/src/components/map/mapbox/draw/LanncDraw.js
+++ b/src/components/map/mapbox/draw/LanncDraw.js
@@ -55,7 +55,12 @@ export const LanncDraw = props => {
   let dragCircleIdx;
 
   useEffect(() => {
-    if (mapControl.drawType && detailLayer) drawInit();
+    const areaType = props.areaCoordList[0].areaType;
+    const drawType = mapControl.drawType;
+
+    if (areaType !== drawType && detailLayer) {
+      drawInit();
+    }
   }, [mapControl.drawType, detailLayer]);
 
   useEffect(() => {
diff --git a/src/views/laanc/FlightArea.js b/src/views/laanc/FlightArea.js
index b12afe7..48e73af 100644
--- a/src/views/laanc/FlightArea.js
+++ b/src/views/laanc/FlightArea.js
@@ -159,10 +159,9 @@ export default function FlightArea({ centeredModal, setCenteredModal }) {
           // const ele = document.getElementById('mapboxgl-popup');
           // const eleArr = Array.from(ele);
           // eleArr?.forEach(marker => marker.remove());
-
-          mapObject.setPaintProperty('waypoint', 'circle-radius', 10);
-          mapObject.getSource('preview').setData(previewGeo);
         }
+        mapObject.setPaintProperty('waypoint', 'circle-radius', 10);
+        mapObject.getSource('preview').setData(previewGeo);
       }
     }
   };
diff --git a/src/views/laanc/LaancAreaMap.js b/src/views/laanc/LaancAreaMap.js
index 51048ca..7bf37b3 100644
--- a/src/views/laanc/LaancAreaMap.js
+++ b/src/views/laanc/LaancAreaMap.js
@@ -103,13 +103,13 @@ export default function LaancAreaMap({ centeredModal, mapContainer }) {
   };
 
   //지역 검색
-  const handlerSearch = async () => {
+  const handlerSearchRes = async () => {
     const res = await flightPlanAPI.searchArea({ query: query });
     setIsSearch(true);
     setSearchRes(res.data.items);
   };
 
-  const handlerChange = e => {
+  const handlerSearchChange = e => {
     const { name, value } = e.target;
 
     if (name == 'searchInput') {
@@ -117,13 +117,13 @@ export default function LaancAreaMap({ centeredModal, mapContainer }) {
     }
   };
 
-  const handlerEnter = e => {
+  const handlerSearchEnter = e => {
     if (e.key == 'Enter') {
-      handlerSearch();
+      handlerSearchRes();
     }
   };
 
-  const handlerCoord = (mapx, mapy) => {
+  const handlerSearchCoord = (mapx, mapy) => {
     const numberString = [mapx, mapy];
     const latlng = [];
 
@@ -220,7 +220,7 @@ export default function LaancAreaMap({ centeredModal, mapContainer }) {
                 <InputGroup className='search-feather'>
                   <InputGroupAddon addonType='prepend'>
                     <InputGroupText>
-                      <Search bssize={14} onClick={handlerSearch} />
+                      <Search bssize={14} onClick={handlerSearchRes} />
                     </InputGroupText>
                   </InputGroupAddon>
                   <Input
@@ -230,8 +230,8 @@ export default function LaancAreaMap({ centeredModal, mapContainer }) {
                     bssize='sm'
                     autoComplete='off'
                     placeholder='검색명을 입력하세요.'
-                    onChange={handlerChange}
-                    onKeyPress={handlerEnter}
+                    onChange={handlerSearchChange}
+                    onKeyPress={handlerSearchEnter}
                   />
                 </InputGroup>
                 <div className='search-result-comp'>
@@ -246,7 +246,7 @@ export default function LaancAreaMap({ centeredModal, mapContainer }) {
                           <li
                             key={search.mapx + search.mapy}
                             onClick={() =>
-                              handlerCoord(search.mapx, search.mapy)
+                              handlerSearchCoord(search.mapx, search.mapy)
                             }
                           >
                             <a>