|
|
@ -1,21 +1,20 @@ |
|
|
|
import $ from 'jquery'; |
|
|
|
import $ from 'jquery'; |
|
|
|
import { useEffect, useState, useLayoutEffect } from 'react'; |
|
|
|
import { useEffect, useState } from 'react'; |
|
|
|
import { useDispatch, useSelector, shallowEqual } from 'react-redux'; |
|
|
|
import { useDispatch, useSelector, shallowEqual } from 'react-redux'; |
|
|
|
import '../../../../assets/css/custom.css'; |
|
|
|
import '../../../../assets/css/custom.css'; |
|
|
|
import FlightIcon from '../../../../assets/images/airplan_org.svg'; |
|
|
|
import FlightIcon from '../../../../assets/images/airplan_org.svg'; |
|
|
|
import FlightDetailIcon from '../../../../assets/images/airplan_pp.svg'; |
|
|
|
import FlightDetailIcon from '../../../../assets/images/airplan_pp.svg'; |
|
|
|
import DronIcon from '../../../../assets/images/drone-marker-icon.png'; |
|
|
|
import DronIcon from '../../../../assets/images/drone-marker-icon.png'; |
|
|
|
import DronDetailIcon from '../../../../assets/images/drone-marker-icon-pulple.png'; |
|
|
|
import DronDetailIcon from '../../../../assets/images/drone-marker-icon-pulple.png'; |
|
|
|
import { IoMdAirplane } from 'react-icons/io'; |
|
|
|
|
|
|
|
import { |
|
|
|
import { |
|
|
|
controlGpDtlAction, |
|
|
|
controlGpDtlAction, |
|
|
|
controlGpFlightPlanAction |
|
|
|
controlGpFlightPlanAction, |
|
|
|
|
|
|
|
controlGpCountAction |
|
|
|
} from '../../../../modules/control/gp'; |
|
|
|
} from '../../../../modules/control/gp'; |
|
|
|
import { |
|
|
|
import { |
|
|
|
objectClickAction, |
|
|
|
objectClickAction, |
|
|
|
objectUnClickAction |
|
|
|
objectUnClickAction |
|
|
|
} from '../../../../modules/control/map/actions/controlMapActions'; |
|
|
|
} from '../../../../modules/control/map/actions/controlMapActions'; |
|
|
|
import { controlGroupAuthAction } from '../../../../modules/control/gp'; |
|
|
|
|
|
|
|
import { JOIN_LIST } from '../../../../modules/basis/group/actions/basisGroupAction'; |
|
|
|
import { JOIN_LIST } from '../../../../modules/basis/group/actions/basisGroupAction'; |
|
|
|
|
|
|
|
|
|
|
|
export const DronMarker = props => { |
|
|
|
export const DronMarker = props => { |
|
|
@ -34,12 +33,18 @@ export const DronMarker = props => { |
|
|
|
const { controlGpArcrftWarnList } = useSelector( |
|
|
|
const { controlGpArcrftWarnList } = useSelector( |
|
|
|
state => state.controlGpLogState |
|
|
|
state => state.controlGpLogState |
|
|
|
); |
|
|
|
); |
|
|
|
|
|
|
|
|
|
|
|
const { user } = useSelector(state => state.authState); |
|
|
|
const { user } = useSelector(state => state.authState); |
|
|
|
const { joinList } = useSelector(state => state.groupState); |
|
|
|
const { joinList } = useSelector(state => state.groupState); |
|
|
|
|
|
|
|
|
|
|
|
const [arrMarkers, setArrMarkers] = useState([]); |
|
|
|
const [arrMarkers, setArrMarkers] = useState([]); |
|
|
|
const [arrInfos, setArrInfos] = useState([]); |
|
|
|
const [arrInfos, setArrInfos] = useState([]); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const [count, setCount] = useState({ |
|
|
|
|
|
|
|
drone: [], |
|
|
|
|
|
|
|
flight: [] |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
let naver = props.naver; |
|
|
|
let naver = props.naver; |
|
|
|
let map = props.map; |
|
|
|
let map = props.map; |
|
|
|
let CustomOverlay; |
|
|
|
let CustomOverlay; |
|
|
@ -88,6 +93,26 @@ export const DronMarker = props => { |
|
|
|
// dispatch(controlGroupAuthAction.request());
|
|
|
|
// dispatch(controlGroupAuthAction.request());
|
|
|
|
// }, [controlGpList]);
|
|
|
|
// }, [controlGpList]);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
|
|
|
if (count.drone.length > 0 || count.flight.length > 0) { |
|
|
|
|
|
|
|
dispatch( |
|
|
|
|
|
|
|
controlGpCountAction.request({ |
|
|
|
|
|
|
|
count |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
); |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
const count = { |
|
|
|
|
|
|
|
drone: [], |
|
|
|
|
|
|
|
flight: [] |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
dispatch( |
|
|
|
|
|
|
|
controlGpCountAction.request({ |
|
|
|
|
|
|
|
count |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}, [count]); |
|
|
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
useEffect(() => { |
|
|
|
dispatch( |
|
|
|
dispatch( |
|
|
|
JOIN_LIST.request({ |
|
|
|
JOIN_LIST.request({ |
|
|
@ -139,6 +164,11 @@ export const DronMarker = props => { |
|
|
|
|
|
|
|
|
|
|
|
//마커를 그린다.
|
|
|
|
//마커를 그린다.
|
|
|
|
const addMarkers = (position, id, controlId, gps) => { |
|
|
|
const addMarkers = (position, id, controlId, gps) => { |
|
|
|
|
|
|
|
const gpsCnt = { |
|
|
|
|
|
|
|
gps: gps, |
|
|
|
|
|
|
|
type: '' |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
const markerOption = {}; |
|
|
|
const markerOption = {}; |
|
|
|
|
|
|
|
|
|
|
|
if (id.substring(0, 2) === 'PA') { |
|
|
|
if (id.substring(0, 2) === 'PA') { |
|
|
@ -148,10 +178,12 @@ export const DronMarker = props => { |
|
|
|
if (pal) { |
|
|
|
if (pal) { |
|
|
|
markerOption.url = DronIcon; |
|
|
|
markerOption.url = DronIcon; |
|
|
|
markerOption.type = 'DRONE'; |
|
|
|
markerOption.type = 'DRONE'; |
|
|
|
|
|
|
|
gpsCnt.type = 'drone'; |
|
|
|
} else { |
|
|
|
} else { |
|
|
|
if (user.authId === 'SUPER' || user.authId === 'ADMIN') { |
|
|
|
if (user.authId === 'SUPER' || user.authId === 'ADMIN') { |
|
|
|
markerOption.url = FlightIcon; |
|
|
|
markerOption.url = FlightIcon; |
|
|
|
markerOption.type = 'FLIGHT'; |
|
|
|
markerOption.type = 'FLIGHT'; |
|
|
|
|
|
|
|
gpsCnt.type = 'flight'; |
|
|
|
} else { |
|
|
|
} else { |
|
|
|
const terminal = joinList?.find(prev => prev.trmnlId === gps.trmnlId); |
|
|
|
const terminal = joinList?.find(prev => prev.trmnlId === gps.trmnlId); |
|
|
|
if ( |
|
|
|
if ( |
|
|
@ -160,6 +192,7 @@ export const DronMarker = props => { |
|
|
|
) { |
|
|
|
) { |
|
|
|
markerOption.url = FlightIcon; |
|
|
|
markerOption.url = FlightIcon; |
|
|
|
markerOption.type = 'FLIGHT'; |
|
|
|
markerOption.type = 'FLIGHT'; |
|
|
|
|
|
|
|
gpsCnt.type = 'flight'; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
@ -167,6 +200,7 @@ export const DronMarker = props => { |
|
|
|
if (user.authId === 'SUPER' || user.authId === 'ADMIN') { |
|
|
|
if (user.authId === 'SUPER' || user.authId === 'ADMIN') { |
|
|
|
markerOption.url = FlightIcon; |
|
|
|
markerOption.url = FlightIcon; |
|
|
|
markerOption.type = 'FLIGHT'; |
|
|
|
markerOption.type = 'FLIGHT'; |
|
|
|
|
|
|
|
gpsCnt.type = 'flight'; |
|
|
|
} else { |
|
|
|
} else { |
|
|
|
const terminal = joinList?.find(prev => prev.trmnlId === gps.trmnlId); |
|
|
|
const terminal = joinList?.find(prev => prev.trmnlId === gps.trmnlId); |
|
|
|
if ( |
|
|
|
if ( |
|
|
@ -175,10 +209,23 @@ export const DronMarker = props => { |
|
|
|
) { |
|
|
|
) { |
|
|
|
markerOption.url = FlightIcon; |
|
|
|
markerOption.url = FlightIcon; |
|
|
|
markerOption.type = 'FLIGHT'; |
|
|
|
markerOption.type = 'FLIGHT'; |
|
|
|
|
|
|
|
gpsCnt.type = 'flight'; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (gpsCnt.type === 'drone') { |
|
|
|
|
|
|
|
setCount(prev => ({ |
|
|
|
|
|
|
|
...prev, |
|
|
|
|
|
|
|
drone: [...prev.drone, gpsCnt] |
|
|
|
|
|
|
|
})); |
|
|
|
|
|
|
|
} else if (gpsCnt.type === 'flight') { |
|
|
|
|
|
|
|
setCount(prev => ({ |
|
|
|
|
|
|
|
...prev, |
|
|
|
|
|
|
|
flight: [...prev.flight, gpsCnt] |
|
|
|
|
|
|
|
})); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// if (id.substring(0, 2) === 'PA') {
|
|
|
|
// if (id.substring(0, 2) === 'PA') {
|
|
|
|
// const pal = controlGroupAuthInfo?.find(
|
|
|
|
// const pal = controlGroupAuthInfo?.find(
|
|
|
|
// prev => prev.idntfNum === gps.objectId
|
|
|
|
// prev => prev.idntfNum === gps.objectId
|
|
|
@ -342,6 +389,15 @@ export const DronMarker = props => { |
|
|
|
if (!isExists) { |
|
|
|
if (!isExists) { |
|
|
|
removeMarkers(marker); |
|
|
|
removeMarkers(marker); |
|
|
|
const arrData = arrMarkers.filter(item => item.id != marker.id); |
|
|
|
const arrData = arrMarkers.filter(item => item.id != marker.id); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const drone = count.drone.filter(d => d.gps.objectId != marker.id); |
|
|
|
|
|
|
|
const flight = count.flight.filter(d => d.gps.objectId != marker.id); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
setCount({ |
|
|
|
|
|
|
|
drone: drone, |
|
|
|
|
|
|
|
flight: flight |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
removeArrMarkers(arrData); |
|
|
|
removeArrMarkers(arrData); |
|
|
|
if (marker.controlId === objectId) { |
|
|
|
if (marker.controlId === objectId) { |
|
|
|
dispatch(objectUnClickAction()); |
|
|
|
dispatch(objectUnClickAction()); |
|
|
|