From 345139f44cb2d8e015c4c53d56dd4b33a256bb93 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?scnoh=28=EB=85=B8=EC=8A=B9=EC=B2=A0=29?= Date: Mon, 8 Aug 2022 18:09:55 +0900 Subject: [PATCH] =?UTF-8?q?[=EB=B9=84=ED=96=89=EA=B4=80=EC=A0=9C]=20?= =?UTF-8?q?=EB=B9=84=EC=A0=95=EC=83=81=20=EC=83=81=ED=99=A9=20=EC=9E=91?= =?UTF-8?q?=EC=97=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/map/naver/NaverMap.js | 147 ++++++---- src/components/map/naver/dron/DronHistory.js | 115 ++++---- src/components/map/naver/dron/DronMarker.js | 276 +++++++++--------- src/components/map/naver/dron/DronPlan.js | 17 ++ src/components/map/naver/dron/DronToast.js | 46 +++ src/components/websocket/WebsocketClient.js | 2 + .../control/gp/actions/controlGpAction.ts | 19 +- src/modules/control/gp/apis/controlGpApi.ts | 24 +- .../control/gp/models/controlGpModel.ts | 17 +- .../control/gp/reducers/controlGpReducer.ts | 12 +- src/modules/control/gp/sagas/controlGpSaga.ts | 266 ++++++++++------- 11 files changed, 553 insertions(+), 388 deletions(-) create mode 100644 src/components/map/naver/dron/DronToast.js diff --git a/src/components/map/naver/NaverMap.js b/src/components/map/naver/NaverMap.js index 695f6a2..1445e08 100644 --- a/src/components/map/naver/NaverMap.js +++ b/src/components/map/naver/NaverMap.js @@ -11,71 +11,94 @@ import geoJson from '../geojson/airArea.json'; import SensorZone from "./sensor/SensorZone"; import { controlGroupAuthAction } from '../../../modules/control/gp'; import DronPlan from './dron/DronPlan'; +import DronToast from './dron/DronToast'; +import { toast } from 'react-toastify'; export const NaverCustomMap = () => { - const dispatch = useDispatch(); - const naver = window.naver; - - const [isMapLoad, setIsMapLoad] = useState(false); - const [mapObject, setMapObject] = useState(null); - - let arrMarkers = []; // 마커 배열 - let arrPolyline = []; // 폴리라인 배열 - let features = geoJson.features; - - useEffect(() => { - NaverMapInit(); - dispatch(controlGroupAuthAction.request()); - }, []); - - useEffect(() => { - }, [mapObject]); - - const NaverMapInit = () => { - const mapOptions = { - center: new naver.maps.LatLng(36.56793936069445, 127.85101412107547), - zoom: 10, - zoomControl: true, - mapTypeId: naver.maps.MapTypeId.HYBRID, - zoomControlOptions: { - position: naver.maps.Position.TOP_LEFT, - - style: naver.maps.ZoomControlStyle.SMALL - } + const dispatch = useDispatch(); + const naver = window.naver; + + // const { controlGpContains } = useSelector(state => state.controlGpFltPlanState); + + const [isMapLoad, setIsMapLoad] = useState(false); + const [mapObject, setMapObject] = useState(null); + const [arrPolyline, setArrPolyline] = useState([]); + + let arrMarkers = []; // 마커 배열 + // let arrPolyline = []; // 폴리라인 배열 + let features = geoJson.features; + + useEffect(() => { + NaverMapInit(); + dispatch(controlGroupAuthAction.request()); + }, []); + + useEffect(() => { + }, [mapObject]); + + // useEffect(() => { + // if (controlGpContains) { + // if(!controlGpContains.contains) { + // toast.info(, { + // autoClose: 3000, + // hideProgressBar: true, + // position: toast.POSITION.BOTTOM_RIGHT, + // }) + // } + + // } + // }, [controlGpContains]) + + const NaverMapInit = () => { + const mapOptions = { + center: new naver.maps.LatLng(36.56793936069445, 127.85101412107547), + zoom: 10, + zoomControl: true, + mapTypeId: naver.maps.MapTypeId.HYBRID, + zoomControlOptions: { + position: naver.maps.Position.TOP_LEFT, + + style: naver.maps.ZoomControlStyle.SMALL + } + }; + + setMapObject(new naver.maps.Map('map', mapOptions)); }; - - setMapObject(new naver.maps.Map('map', mapOptions)); - }; - - return ( - <> -
- {mapObject != null ? ( + + const handleHistoryInit = (line) => { + setArrPolyline([...arrPolyline, line]) + } + + return ( <> - - - - - - - - - - - - ) : null} +
+ {mapObject != null ? ( + <> + + - {/* */} - - ); + + + + + + + + + ) : null} + + {/* */} + + ); }; diff --git a/src/components/map/naver/dron/DronHistory.js b/src/components/map/naver/dron/DronHistory.js index f83006e..3a46316 100644 --- a/src/components/map/naver/dron/DronHistory.js +++ b/src/components/map/naver/dron/DronHistory.js @@ -3,61 +3,62 @@ import { useDispatch, useSelector } from 'react-redux'; import { controlGpHisAction } from '../../../../modules/control/gp'; export const DronHistory = props => { - const { controlGpHistory } = useSelector(state => state.controlGpHisState); - const { objectId, isClickObject } = useSelector( - state => state.controlMapReducer - ); - - let naver = props.naver; - let polyline; - let polylinePath = []; - - const dispatch = useDispatch(); - - useEffect(() => { - // console.log('>>>', controlGpHistory); - polylineRemove(); - polylineInit(); - }, [controlGpHistory]); - - useEffect(() => { - if (isClickObject) { - dispatch(controlGpHisAction.request({ id: objectId })); - } else { - polylineRemove(); - } - }, [objectId, isClickObject]); - - const polylineRemove = () => { - if (props.arrPolyline) { - props.arrPolyline.map(item => { - item.setMap(null); - }); - } - }; - const polylineInit = () => { - if (controlGpHistory) { - polyline = new naver.maps.Polyline({ - clickable: false, - strokeColor: '#ff4961', - strokeStyle: 'solid', - strokeOpacity: 5, - strokeWeight: 1.5 - }); - - controlGpHistory.map(item => { - if (item.lat > 0 && item.lng > 0) { - const position = new naver.maps.LatLng(item.lat, item.lng); - polylinePath.push(position); - } - // console.log('>>>>>>>>>>>', item); - }); - - polyline.setPath(polylinePath); - polyline.setMap(props.map); - props.arrPolyline.push(polyline); - } - }; - - return null; + const { controlGpHistory } = useSelector(state => state.controlGpHisState); + const { objectId, isClickObject } = useSelector( + state => state.controlMapReducer + ); + + let naver = props.naver; + let polyline; + let polylinePath = []; + + const dispatch = useDispatch(); + + useEffect(() => { + // console.log('>>>', controlGpHistory); + // polylineRemove(); + polylineInit(); + }, [controlGpHistory]); + + useEffect(() => { + if (isClickObject) { + dispatch(controlGpHisAction.request({ id: objectId })); + } else { + polylineRemove(); + } + }, [objectId, isClickObject]); + + const polylineRemove = () => { + console.log(props.arrPolyline); + if (props.arrPolyline) { + props.arrPolyline.map(item => { + item.setMap(null); + }); + } + }; + const polylineInit = () => { + if (controlGpHistory) { + polyline = new naver.maps.Polyline({ + clickable: false, + strokeColor: '#ff4961', + strokeStyle: 'solid', + strokeOpacity: 5, + strokeWeight: 1.5 + }); + + controlGpHistory.map(item => { + if (item.lat > 0 && item.lng > 0) { + const position = new naver.maps.LatLng(item.lat, item.lng); + polylinePath.push(position); + } + // console.log('>>>>>>>>>>>', item); + }); + + polyline.setPath(polylinePath); + polyline.setMap(props.map); + props.handleHistoryInit(polyline); + } + }; + + return null; }; diff --git a/src/components/map/naver/dron/DronMarker.js b/src/components/map/naver/dron/DronMarker.js index bef63b9..4bdb826 100644 --- a/src/components/map/naver/dron/DronMarker.js +++ b/src/components/map/naver/dron/DronMarker.js @@ -7,151 +7,151 @@ import { controlGpDtlAction, controlGpHisAction, controlDbHisAction, controlGpFl import { objectClickAction, objectUnClickAction } from '../../../../modules/control/map/actions/controlMapActions'; export const DronMarker = props => { - const dispatch = useDispatch(); - - const { controlGpList } = useSelector(state => state.controlGpState); - const { controlGroupAuthInfo } = useSelector(state => state.controlGroupAuthState); - const { objectId, isClickObject } = useSelector(state => state.controlMapReducer); - - const [arrMarkers, setArrMarkers] = useState([]); - - let naver = props.naver; - - var contentString = ['
dddd', '
'].join(''); - var infowindow = new naver.maps.InfoWindow({ - content: contentString - }); - - - useEffect(() => { - markerInit(); - }, [controlGpList]); - - useEffect(() => { - arrMarkers.map(clickMarker => { - if (objectId === clickMarker.id && isClickObject) { - // clickMarker.setIcon(DronIconPulple); - clickMarker.setIcon({ - url: DronIconPulple, - origin: new naver.maps.Point(0, 0), - anchor: new naver.maps.Point(15, 15), + const dispatch = useDispatch(); + + const { controlGpList } = useSelector(state => state.controlGpState); + const { controlGroupAuthInfo } = useSelector(state => state.controlGroupAuthState); + const { objectId, isClickObject } = useSelector(state => state.controlMapReducer); + + const [arrMarkers, setArrMarkers] = useState([]); + + let naver = props.naver; + + var contentString = ['
dddd', '
'].join(''); + var infowindow = new naver.maps.InfoWindow({ + content: contentString + }); + + + useEffect(() => { + markerInit(); + }, [controlGpList]); + + useEffect(() => { + arrMarkers.map(clickMarker => { + if (objectId === clickMarker.id && isClickObject) { + // clickMarker.setIcon(DronIconPulple); + clickMarker.setIcon({ + url: DronIconPulple, + origin: new naver.maps.Point(0, 0), + anchor: new naver.maps.Point(15, 15), + }); + } else { + clickMarker.setIcon({ + url: DronIcon, + origin: new naver.maps.Point(0, 0), + anchor: new naver.maps.Point(15, 15), + }); + } }); - } else { - clickMarker.setIcon({ - url: DronIcon, - origin: new naver.maps.Point(0, 0), - anchor: new naver.maps.Point(15, 15), + }, [objectId, isClickObject]); + + useEffect(() => { + arrMarkers.map(clickMarker => { + if (objectId === clickMarker.id) { + props.map.setCenter(clickMarker.getPosition()); + props.map.setZoom(13, true); + } + }); + }, [objectId]); + + //마커를 그린다. + const addMarkers = (position, id, controlId) => { + var marker = new naver.maps.Marker({ + position: position, + title: id, + id: id, + controlId: controlId, + icon: { + // content: [ + // '
dddd
', + + // ].join(''), + url: DronIcon, + // size: new naver.maps.Size(50, 50), + origin: new naver.maps.Point(0, 0), + anchor: new naver.maps.Point(15, 15), + } }); - } - }); - }, [objectId, isClickObject]); - - useEffect(() => { - arrMarkers.map(clickMarker => { - if (objectId === clickMarker.id) { - props.map.setCenter(clickMarker.getPosition()); - props.map.setZoom(13, true); - } - }); - }, [objectId]); - - //마커를 그린다. - const addMarkers = (position, id, controlId) => { - var marker = new naver.maps.Marker({ - position: position, - title: id, - id: id, - controlId: controlId, - icon: { - // content: [ - // '
dddd
', - - // ].join(''), - url: DronIcon, - // size: new naver.maps.Size(50, 50), - origin: new naver.maps.Point(0, 0), - anchor: new naver.maps.Point(15, 15), - } - }); - marker.setMap(props.map); + marker.setMap(props.map); - naver.maps.Event.addListener(marker, 'click', function (e) { - handlerDronClick(marker); - }); + naver.maps.Event.addListener(marker, 'click', function (e) { + handlerDronClick(marker); + }); - setArrMarkers(m => [...m, marker]); - }; - - const handlerDronClick = marker => { - const idntfNum = marker.id; - const contorlId = marker.controlId; - - // 클릭한 식별번호 정보를 가진 그룹 추출 (1건만 존재해야하는게 맞는 듯) - const group = controlGroupAuthInfo.find(group => group.idntfNum === idntfNum); - - //히스토리 불러오기 - dispatch(objectClickAction(contorlId)); - dispatch(controlGpDtlAction.request(contorlId)); - dispatch(controlGpFlightPlanAction.request(group)); - }; - - //마커를 삭제 한다. - const removeMarkers = marker => { - marker.setMap(null); - }; - - //마커에 위치를 이동한다. - const moveMarkers = (marker, position) => { - marker.setPosition(position); - }; - - //데이터가 없는 마커를 모두 삭제 한다. - const allRemoveMarkers = () => { - if (arrMarkers && controlGpList) { - arrMarkers.map(marker => { - const isExists = controlGpList.find( - item => item.objectId === marker.id - ); - if (!isExists) { - removeMarkers(marker); - const arrData = arrMarkers.filter( - item => item.id != marker.id - ); - removeArrMarkers(arrData); - - dispatch(objectUnClickAction()); + setArrMarkers(m => [...m, marker]); + }; + + const handlerDronClick = marker => { + const idntfNum = marker.id; + const contorlId = marker.controlId; + + // 클릭한 식별번호 정보를 가진 그룹 추출 + // const group = controlGroupAuthInfo.find(group => group.idntfNum === idntfNum); + + //히스토리 불러오기 + dispatch(objectClickAction(contorlId)); + dispatch(controlGpDtlAction.request(contorlId)); + dispatch(controlGpFlightPlanAction.request(idntfNum)); + }; + + //마커를 삭제 한다. + const removeMarkers = marker => { + marker.setMap(null); + }; + + //마커에 위치를 이동한다. + const moveMarkers = (marker, position) => { + marker.setPosition(position); + }; + + //데이터가 없는 마커를 모두 삭제 한다. + const allRemoveMarkers = () => { + if (arrMarkers && controlGpList) { + arrMarkers.map(marker => { + const isExists = controlGpList.find( + item => item.objectId === marker.id + ); + if (!isExists) { + removeMarkers(marker); + const arrData = arrMarkers.filter( + item => item.id != marker.id + ); + removeArrMarkers(arrData); + + dispatch(objectUnClickAction()); + } + }); } - }); - } - }; - - //마커를 셋팅 한다. - const markerInit = () => { - if (controlGpList) { - allRemoveMarkers(); - controlGpList.map(item => { - const position = new naver.maps.LatLng(item.lat, item.lng); - - if (arrMarkers) { - const isExists = arrMarkers.find( - ele => ele.id === item.objectId - ); - if (isExists) { - moveMarkers(isExists, position); - } else { - addMarkers(position, item.objectId, item.controlId); - } - } else { - addMarkers(position, item.objectId, item.controlId); + }; + + //마커를 셋팅 한다. + const markerInit = () => { + if (controlGpList) { + allRemoveMarkers(); + controlGpList.map(item => { + const position = new naver.maps.LatLng(item.lat, item.lng); + + if (arrMarkers) { + const isExists = arrMarkers.find( + ele => ele.id === item.objectId + ); + if (isExists) { + moveMarkers(isExists, position); + } else { + addMarkers(position, item.objectId, item.controlId); + } + } else { + addMarkers(position, item.objectId, item.controlId); + } + }); } - }); - } - }; + }; - const removeArrMarkers = arrData => { - setArrMarkers(arrData); - }; + const removeArrMarkers = arrData => { + setArrMarkers(arrData); + }; - return null; + return null; }; diff --git a/src/components/map/naver/dron/DronPlan.js b/src/components/map/naver/dron/DronPlan.js index 56dc12c..2a28aae 100644 --- a/src/components/map/naver/dron/DronPlan.js +++ b/src/components/map/naver/dron/DronPlan.js @@ -1,6 +1,8 @@ import { useEffect, useState } from 'react'; import { useSelector, useDispatch } from 'react-redux'; import { controlGpFlightPlanInitAction } from '../../../../modules/control/gp'; +import DronToast from './DronToast'; +import { toast } from 'react-toastify'; const DronPlan = ({ naver, map }) => { @@ -9,6 +11,8 @@ const DronPlan = ({ naver, map }) => { const { controlGpList } = useSelector(state => state.controlGpState); const { controlGpFltPlanList } = useSelector(state => state.controlGpFltPlanState); const { objectId, isClickObject } = useSelector(state => state.controlMapReducer); + const { controlGpContains } = useSelector(state => state.controlGpFltPlanState); + const [area, setArea] = useState(); // 비행 구역 관리 const [buffer, setBuffer] = useState(); // 버퍼 구역 관리 @@ -45,6 +49,19 @@ const DronPlan = ({ naver, map }) => { } }, [controlGpList]) + useEffect(() => { + if (controlGpContains) { + if(!controlGpContains.contains) { + toast.info(, { + autoClose: 3000, + hideProgressBar: true, + position: toast.POSITION.BOTTOM_RIGHT, + }) + } + + } + }, [controlGpContains]) + /* 비행 구역 그리기. */ const init = () => { diff --git a/src/components/map/naver/dron/DronToast.js b/src/components/map/naver/dron/DronToast.js new file mode 100644 index 0000000..3b2bea5 --- /dev/null +++ b/src/components/map/naver/dron/DronToast.js @@ -0,0 +1,46 @@ +import React, { useEffect, useState } from 'react'; +import { useSelector, useDispatch } from 'react-redux'; +import { Fragment } from 'react'; +import { toast } from 'react-toastify'; +import Avatar from '../../../../@core/components/avatar'; +import { Bell, Check, X, AlertTriangle, Info } from 'react-feather' +import { + Card, + CardHeader, + CardBody, + CardTitle, + Button, + Toast, + ToastBody, + ToastHeader, + Row, + Col, +} from 'reactstrap'; +import log from '../../../../assets/images/logo/logo.png'; + + +const DronToast = ({ title, message }) => { + + return ( + +
+
+ } /> +
+ {title} +
+
+
+ +
+ + {message} + +
+ + ) + +} + + +export default DronToast; \ No newline at end of file diff --git a/src/components/websocket/WebsocketClient.js b/src/components/websocket/WebsocketClient.js index a0d976d..2816032 100644 --- a/src/components/websocket/WebsocketClient.js +++ b/src/components/websocket/WebsocketClient.js @@ -25,6 +25,8 @@ const WebsocketClient = () => { websocket.onmessage = e => { const data = e.data; const controlGpList = JSON.parse(data); + + // console.log('gps ', controlGpList) dispatch(Actions.controlGpAction.request(controlGpList)); }; diff --git a/src/modules/control/gp/actions/controlGpAction.ts b/src/modules/control/gp/actions/controlGpAction.ts index 71ee65c..2699804 100644 --- a/src/modules/control/gp/actions/controlGpAction.ts +++ b/src/modules/control/gp/actions/controlGpAction.ts @@ -5,9 +5,10 @@ import { ControlDetailData, ControlGpData, ControlGpDtlState, - ControlGpFlightPlanDataList, - ControlGpFlightPlanRQ, + ControlGpFlightPlanDataList, ControlGpHisState, + ControlGpPlanContainsRQ, + ControlGpPlanContainsRS, ControlGpState, ControlGroupAuthState } from '../models/controlGpModel'; @@ -40,6 +41,11 @@ const CONTROL_FLIGHT_PLAN_FAILURE = 'control/gp/flight/plan/CONTROL_FLIGHT_PLAN_ const CONTROL_FLIGHT_PLAN_INIT = 'control/gp/flight/plan/CONTROL_FLIGHT_PLAN_INIT'; +// [관제] 비행 구역 비정상 여부 체크 +const CONTROL_FLIGHT_PLAN_WARN_REQUEST = 'control/gp/flight/plan/CONTROL_FLIGHT_PLAN_WARN_REQUEST'; +const CONTROL_FLIGHT_PLAN_WARN_SUCCESS = 'control/gp/flight/plan/CONTROL_FLIGHT_PLAN_WARN_SUCCESS'; +const CONTROL_FLIGHT_PLAN_WARN_FAILURE = 'control/gp/flight/plan/CONTROL_FLIGHT_PLAN_WARN_FAILURE'; + export const controlGpAction = createAsyncAction( CONTROL_GP_REQUEST, CONTROL_GP_SUCCESS, @@ -74,7 +80,13 @@ export const controlGpFlightPlanAction = createAsyncAction( CONTROL_FLIGHT_PLAN_REQUEST, CONTROL_FLIGHT_PLAN_SUCCESS, CONTROL_FLIGHT_PLAN_FAILURE, -)(); +)(); + +export const controlGpFlightPlanWarnAction = createAsyncAction( + CONTROL_FLIGHT_PLAN_WARN_REQUEST, + CONTROL_FLIGHT_PLAN_WARN_SUCCESS, + CONTROL_FLIGHT_PLAN_WARN_FAILURE, +)(); export const controlGpFlightPlanInitAction = createAction(CONTROL_FLIGHT_PLAN_INIT)(); @@ -85,6 +97,7 @@ const actions = { controlGpRtDtlAction, controlGroupAuthAction, controlGpFlightPlanAction, + controlGpFlightPlanWarnAction, controlGpFlightPlanInitAction }; diff --git a/src/modules/control/gp/apis/controlGpApi.ts b/src/modules/control/gp/apis/controlGpApi.ts index 3bfaa83..46d3ed6 100644 --- a/src/modules/control/gp/apis/controlGpApi.ts +++ b/src/modules/control/gp/apis/controlGpApi.ts @@ -1,5 +1,5 @@ import axios from '../../../utils/customAxiosUtil'; -import { ReponseControlGpHistory, ControlGroupAuthData, ResponseControlGroupAuth, ControlGpFlightPlanRQ } from '../models/controlGpModel'; +import { ReponseControlGpHistory, ControlGroupAuthData, ResponseControlGroupAuth, ControlGpPlanContainsRQ} from '../models/controlGpModel'; import qs from 'qs'; export const controlGpApi = { @@ -26,20 +26,26 @@ export const controlGpApi = { ); return data; }, - getFlightPlan: async (rq: ControlGpFlightPlanRQ) => { - if (!rq.idntfNum) { + getFlightPlan: async (idntfNum: string) => { + if (!idntfNum) { return null; } - const queryString = qs.stringify(rq, { - addQueryPrefix: true, - arrayFormat: 'repeat' - }); - const { data } = await axios.get( - `api/ctr/cntrl/flight_plan${queryString}` + `api/ctr/cntrl/flight_plan/${idntfNum}` ); + return data; + }, + checkPlanContains: async (rq: ControlGpPlanContainsRQ) => { + if(!rq.idntfNum) { + return null; + } + + const { data } = await axios.post( + `api/ctr/cntrl/contains`, rq + ); + return data; } }; diff --git a/src/modules/control/gp/models/controlGpModel.ts b/src/modules/control/gp/models/controlGpModel.ts index 2ec8f97..7b2caca 100644 --- a/src/modules/control/gp/models/controlGpModel.ts +++ b/src/modules/control/gp/models/controlGpModel.ts @@ -1,9 +1,12 @@ +import { FlightPlanData } from "../../../basis/flight/models/basisFlightModel"; + export interface ControlGpState { controlGpList: ControlGpData[] | undefined; } export interface ControlGpFlightPlanState { controlGpFltPlanList: ControlGpFlightPlanDataList | undefined; + controlGpContains: ControlGpPlanContainsRS | undefined; } export interface ControlGpHisState { @@ -13,6 +16,7 @@ export interface ControlGpHisState { export interface ControlGpDtlState { controlGpDetail: ControlGpDtlData | undefined; controlDetail: ControlDetailData | undefined; + } export interface ControlGroupAuthState { @@ -151,10 +155,16 @@ export interface FlightPlanAreaCoordData { // docState: string } -export interface ControlGpFlightPlanRQ { +export interface ControlGpPlanContainsRQ { + idntfNum: string, + lat: number, + lon: number, + planList: FlightPlanData[] +} + +export interface ControlGpPlanContainsRS { + contains: boolean, idntfNum: string, - groupId: string, - cstmrSno: number, // 흠 } export interface ReponseControlGpHistory { @@ -172,4 +182,5 @@ export const initiaResponseControlGpData = { controlDetail: undefined, controlGroupAuthInfo: undefined, controlGpFltPlanList: undefined, + controlGpContains: undefined }; diff --git a/src/modules/control/gp/reducers/controlGpReducer.ts b/src/modules/control/gp/reducers/controlGpReducer.ts index 6415bdf..5279030 100644 --- a/src/modules/control/gp/reducers/controlGpReducer.ts +++ b/src/modules/control/gp/reducers/controlGpReducer.ts @@ -6,6 +6,7 @@ import { controlGpDtlAction, controlGpFlightPlanAction, controlGpFlightPlanInitAction, + controlGpFlightPlanWarnAction, controlGpHisAction, controlGpRtDtlAction, controlGroupAuthAction @@ -24,8 +25,7 @@ export const controlGpReducer = createReducer( initiaResponseControlGpData ).handleAction(controlGpAction.success, (state, action) => produce(state, draft => { - const { controlGpList } = action.payload; - console.log('gps ', controlGpList) + const { controlGpList } = action.payload; draft.controlGpList = controlGpList; }) ) @@ -43,6 +43,12 @@ export const controlGpFltPlanReducer = createReducer + produce(state, draft => { + const data = action.payload; + draft.controlGpContains = data; + }) +); export const controlGpHisReducer = createReducer< @@ -74,7 +80,7 @@ export const controlGpDtlReducer = createReducer< draft.controlDetail = data; }) - ); + ) export const controlGroupAuthReducer = createReducer< ControlGroupAuthState, diff --git a/src/modules/control/gp/sagas/controlGpSaga.ts b/src/modules/control/gp/sagas/controlGpSaga.ts index 14e45ee..eea77a0 100644 --- a/src/modules/control/gp/sagas/controlGpSaga.ts +++ b/src/modules/control/gp/sagas/controlGpSaga.ts @@ -8,151 +8,191 @@ import decode from 'jwt-decode'; import { ControlGpData } from '../models/controlGpModel'; function* getControlGpSaga( - action: ActionType + action: ActionType ) { - try { - const data = action.payload; - const state = yield select(); - const { objectId, isClickObject } = state.controlMapReducer; - const { controlGroupAuthInfo } = state.controlGroupAuthState; - - let gpsData: ControlGpData[] = []; + try { + const data = action.payload; + const state = yield select(); + const { objectId, isClickObject } = state.controlMapReducer; + const { controlGroupAuthInfo } = state.controlGroupAuthState; + const { controlGpFltPlanList } = state.controlGpFltPlanState; + const { controlGpHistory } = state.controlGpHisState; + + let gpsData: ControlGpData[] = []; + + if (controlGroupAuthInfo.length > 0) { + controlGroupAuthInfo.forEach((auth) => { + if (auth.groupAuthCd === 'CREATER' || auth.groupAuthCd === 'ADMIN') { + if (gpsData.length > 0) return false; + + gpsData = data.filter(gps => auth.idntfNum === gps.objectId); + } + + if (auth.groupAuthCd === 'USER') { + if (gpsData.length > 0) return false; + + gpsData.filter(gps => auth.createUserId && auth.idntfNum === gps.objectId); + } + }); + } - if(controlGroupAuthInfo.length > 0) { - controlGroupAuthInfo.forEach((auth) => { - if(auth.groupAuthCd === 'CREATER' || auth.groupAuthCd === 'ADMIN') { - if(gpsData.length > 0) return false; + yield put( + Actions.controlGpAction.success({ + controlGpList: gpsData + }) + ); - gpsData = data.filter(gps => auth.idntfNum === gps.objectId); - } - if(auth.groupAuthCd === 'USER') { - if(gpsData.length > 0) return false; + if (objectId && isClickObject) { + let detailData; - gpsData.filter(gps => auth.createUserId && auth.idntfNum === gps.objectId); - } - }); - } - - yield put( - Actions.controlGpAction.success({ - controlGpList: gpsData - }) - ); - - - if (objectId && isClickObject) { - let detailData; - - //History 호출 - yield put(Actions.controlGpHisAction.request({ id: objectId })); - - //상세 정보에서 실시간 데이터 호출 - data.map(item => { - if (item.controlId === objectId) { - detailData = item; + //상세 정보에서 실시간 데이터 호출 + gpsData.map(item => { + if (item.controlId === objectId) { + detailData = item; + } + }); + + yield put(Actions.controlGpRtDtlAction.request(detailData)); + + // History Push + if(controlGpHistory) { + const stateHistory = controlGpHistory; + const history = stateHistory.map((h) => { + return { + ...h, + detailData + } + }); + + yield put(Actions.controlGpHisAction.success(history)); + } + + // 비행구역 contains check + if(controlGpFltPlanList) { + const containsRQ = { + idntfNum: detailData.objectId, + lat: detailData.lat, + lon: detailData.lng, + planList: controlGpFltPlanList + } + + yield put(Actions.controlGpFlightPlanWarnAction.request(containsRQ)); + } } - }); - - yield put(Actions.controlGpRtDtlAction.request(detailData)); + } catch (error) { + yield put(Actions.controlGpAction.failure(error)); } - } catch (error) { - yield put(Actions.controlGpAction.failure(error)); - } } function* getControlGpHistorySaga( - action: ActionType + action: ActionType ) { - try { - const { id } = action.payload; - - const data = yield call(controlGpApi.getHistory, id); - - yield put( - Actions.controlGpHisAction.success({ - controlGpHistory: data - }) - ); - } catch (error) { - yield put(Actions.controlGpHisAction.failure(error)); - } + try { + const { id } = action.payload; + + const data = yield call(controlGpApi.getHistory, id); + + yield put( + Actions.controlGpHisAction.success({ + controlGpHistory: data + }) + ); + } catch (error) { + yield put(Actions.controlGpHisAction.failure(error)); + } } function* controlGpRtDtlSaga( - action: ActionType + action: ActionType ) { - try { - const controlGpDetail = action.payload; - - // console.log(controlGpDetail); - yield put( - Actions.controlGpRtDtlAction.success({ - controlDetail: undefined, - controlGpDetail: controlGpDetail - }) - ); - } catch (error) { - yield put(Actions.controlGpRtDtlAction.failure(error)); - } + try { + const controlGpDetail = action.payload; + + // console.log(controlGpDetail); + yield put( + Actions.controlGpRtDtlAction.success({ + controlDetail: undefined, + controlGpDetail: controlGpDetail + }) + ); + } catch (error) { + yield put(Actions.controlGpRtDtlAction.failure(error)); + } } function* controlDtlSaga( - action: ActionType + action: ActionType ) { - try { - const controlId = action.payload; - - const { data } = yield call(controlGpApi.getDetail, controlId); - console.log('data>>>>>>>>>>>>>>>>>>>>>', data); - yield put(Actions.controlGpDtlAction.success(data)); - } catch (error) { - yield put(Actions.controlGpRtDtlAction.failure(error)); - } + try { + const controlId = action.payload; + + const { data } = yield call(controlGpApi.getDetail, controlId); + console.log('data>>>>>>>>>>>>>>>>>>>>>', data); + yield put(Actions.controlGpDtlAction.success(data)); + } catch (error) { + yield put(Actions.controlGpDtlAction.failure(error)); + } } -function* controlGroupAuthSaga ( - action: ActionType +function* controlGroupAuthSaga( + action: ActionType ) { - const token = cookieStorage.getCookie(COOKIE_ACCESS_TOKEN); + const token = cookieStorage.getCookie(COOKIE_ACCESS_TOKEN); + + try { + if (token) { + const user = decode(token); + const data = yield call(controlGpApi.getGroupAuth, user.cstmrSno); - try { - if(token) { - const user = decode(token); - const data = yield call(controlGpApi.getGroupAuth, user.cstmrSno); - - yield put(Actions.controlGroupAuthAction.success({ - controlGroupAuthInfo: data - })); + yield put(Actions.controlGroupAuthAction.success({ + controlGroupAuthInfo: data + })); + } + } catch (error) { + yield put(Actions.controlGroupAuthAction.failure(error)); + } +} + +function* controlGpFlightPlanSaga( + action: ActionType +) { + try { + const idntfNum = action.payload; + + const list = yield call(controlGpApi.getFlightPlan, idntfNum); + + console.log("flight plan list : ", list); + + yield put(Actions.controlGpFlightPlanAction.success(list)); + + } catch (error) { + yield put(Actions.controlGpFlightPlanAction.failure(error)); } - } catch (error) { - yield put(Actions.controlGroupAuthAction.failure(error)); - } } -function* controlGpFlightPlanSaga ( - action: ActionType +function* controlGpFlightPlanWarnSaga( + action: ActionType ) { - try { - const rq = action.payload; + try { + const idntfNum = action.payload; - const list = yield call(controlGpApi.getFlightPlan, rq); + const rs = yield call(controlGpApi.checkPlanContains, idntfNum); - console.log("flight plan list : ", list); + yield put(Actions.controlGpFlightPlanWarnAction.success(rs)); - yield put(Actions.controlGpFlightPlanAction.success(list)); - - } catch (error) { - yield put(Actions.controlGpFlightPlanAction.failure(error)); - } + } catch (error) { + yield put(Actions.controlGpFlightPlanWarnAction.failure(error)); + } } export function* controlGpSaga() { - yield takeEvery(Actions.controlGpAction.request, getControlGpSaga); - yield takeEvery(Actions.controlGpHisAction.request, getControlGpHistorySaga); - yield takeEvery(Actions.controlGpRtDtlAction.request, controlGpRtDtlSaga); - yield takeEvery(Actions.controlGpDtlAction.request, controlDtlSaga); - yield takeEvery(Actions.controlGroupAuthAction.request, controlGroupAuthSaga); - yield takeEvery(Actions.controlGpFlightPlanAction.request, controlGpFlightPlanSaga); + yield takeEvery(Actions.controlGpAction.request, getControlGpSaga); + yield takeEvery(Actions.controlGpHisAction.request, getControlGpHistorySaga); + yield takeEvery(Actions.controlGpRtDtlAction.request, controlGpRtDtlSaga); + yield takeEvery(Actions.controlGpDtlAction.request, controlDtlSaga); + yield takeEvery(Actions.controlGroupAuthAction.request, controlGroupAuthSaga); + yield takeEvery(Actions.controlGpFlightPlanAction.request, controlGpFlightPlanSaga); + yield takeEvery(Actions.controlGpFlightPlanWarnAction.request, controlGpFlightPlanWarnSaga); }