laanc 스텝1 유효성검사 추가(반경)

src/containers/laanc/LaancPlanContainer.js

@@ -23,14 +23,19 @@ import {
   Label,
   Input
 } from 'reactstrap';
-import { AREA_DETAIL_INIT } from '../../modules/basis/flight/actions/basisFlightAction';
+import {
-import { useDispatch } from 'react-redux';
+  AREA_DETAIL_INIT,
+  FLIGHT_PLAN_AREA_BUFFER_LIST
+} from '../../modules/basis/flight/actions/basisFlightAction';
+import { useDispatch, useSelector } from 'react-redux';
 
 export default function LaancPlanContainer({
   currentParm,
   disabledAnimation,
   setDisabledAnimation
 }) {
+  const { areaCoordList } = useSelector(state => state.flightState);
+
   const dispatch = useDispatch();
   const [step, setStep] = useState(1);
   const [detailData, setDetailData] = useState(initFlightBas.initDetail);
@@ -217,6 +222,25 @@ export default function LaancPlanContainer({
     }
   };
 
+  const handlerBufferApply = () => {
+    if (areaCoordList) {
+      if (areaCoordList[0].coordList.length > 0) {
+        const array = [];
+        const copy = { ...areaCoordList[0] };
+        copy.bufferZone = detailData.areaList[0].bufferZone;
+        array.push(copy);
+
+        dispatch(FLIGHT_PLAN_AREA_BUFFER_LIST.request(array));
+      }
+    } else {
+      setModal2({
+        isOpen: true,
+        title: '필수값 입력 오류',
+        desc: '비행 구역을 설정해 주세요.'
+      });
+    }
+  };
+
   const handlerLaancClose = () => {
     setDisabledAnimation(!disabledAnimation);
     dispatch(AREA_DETAIL_INIT());
@@ -246,6 +270,7 @@ export default function LaancPlanContainer({
                 setCenteredModal={setCenteredModal}
                 currentParm={currentParm}
                 handlerLaancClose={handlerLaancClose}
+                handlerBufferApply={handlerBufferApply}
               />
             </>
           )}

src/views/laanc/LaancStep1.js

@@ -30,7 +30,6 @@ import {
 } from 'reactstrap';
 
 import FlightArea from './FlightArea';
-import { FLIGHT_PLAN_AREA_BUFFER_LIST } from '../../modules/basis/flight/actions/basisFlightAction';
 
 export default function LaancStep1({
   handleChange,
@@ -42,13 +41,12 @@ export default function LaancStep1({
   centeredModal,
   setCenteredModal,
   currentParm,
-  handlerLaancClose
+  handlerLaancClose,
+  handlerBufferApply
 }) {
   const { user } = useSelector(state => state.authState);
-  const { areaCoordList } = useSelector(state => state.flightState);
 
   const history = useHistory();
-  const dispatch = useDispatch();
 
   const location = useLocation();
   const queryParams = new URLSearchParams(location.search);
@@ -59,10 +57,6 @@ export default function LaancStep1({
     if (!currentParm) setCenteredModal(mapParam);
   }, [location]);
 
-  useEffect(() => {
-    console.log(areaCoordList, '저장상태');
-  }, [areaCoordList]);
-
   // console.log('>', data);
   return (
     <>
@@ -225,24 +219,7 @@ export default function LaancStep1({
             <Col className='list-input' md='12'>
               <div className='ti'>
                 비행 구역 정보
-                <Button
+                <Button size='sm' onClick={handlerBufferApply}>
-                  size='sm'
-                  onClick={() => {
-                    if (areaCoordList) {
-                      if (areaCoordList[0].coordList.length > 0) {
-                        const array = [];
-                        const copy = { ...areaCoordList[0] };
-                        copy.bufferZone = data.areaList[0].bufferZone;
-
-                        array.push(copy);
-
-                        dispatch(FLIGHT_PLAN_AREA_BUFFER_LIST.request(array));
-                      }
-                    } else {
-                      alert('비행 구역 설정 후 적용 가능합니다.');
-                    }
-                  }}
-                >
                   적용
                 </Button>
               </div>