diff --git a/src/components/basis/flight/plan/FlightPlanAreaDetailForm.js b/src/components/basis/flight/plan/FlightPlanAreaDetailForm.js index f9dbf7c..9697c1b 100644 --- a/src/components/basis/flight/plan/FlightPlanAreaDetailForm.js +++ b/src/components/basis/flight/plan/FlightPlanAreaDetailForm.js @@ -177,6 +177,7 @@ const FlightPlanAreaDetailForm = ({ handleSave, handleClose, handleChange, handl className='mr-1' color='primary' onClick={e => handleSave()} + disabled={!coordList[0].lat ? true : false } > 등록 diff --git a/src/components/map/naver/NaverMap.js b/src/components/map/naver/NaverMap.js index 8dbe69d..fd98985 100644 --- a/src/components/map/naver/NaverMap.js +++ b/src/components/map/naver/NaverMap.js @@ -39,7 +39,7 @@ export const NaverCustomMap = () => { center: new naver.maps.LatLng(36.56793936069445, 127.85101412107547), zoom: 10, zoomControl: true, - mapTypeId: naver.maps.MapTypeId.NORMAL, + mapTypeId: naver.maps.MapTypeId.HYBRID, zoomControlOptions: { position: naver.maps.Position.TOP_LEFT, diff --git a/src/components/map/naver/draw/FlightPlanDraw.js b/src/components/map/naver/draw/FlightPlanDraw.js index 5d36d0b..23c4c84 100644 --- a/src/components/map/naver/draw/FlightPlanDraw.js +++ b/src/components/map/naver/draw/FlightPlanDraw.js @@ -2,6 +2,7 @@ import $ from 'jquery'; import { useEffect, useState } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import * as Actions from '../../../../modules/basis/flight/actions/basisFlightAction'; +import { InfoModal } from '../../../modal/InfoModal'; export const FlightPlanDraw = props => { const dispatch = useDispatch(); @@ -20,10 +21,16 @@ export const FlightPlanDraw = props => { const [areaDetail, setAreaDetail] = useState(); + const [alertModal, setAlertModal] = useState({ + isOpen: false, + title: '', + desc: '' + }) + const naver = props.naver; const map = props.map; let mode = props.mode; - + let areaInfo; let lastDistance; @@ -188,6 +195,12 @@ export const FlightPlanDraw = props => { setPolyline(polyline); setAreaInfo(polypaths); } else { + setAlertModal({ + isOpen: true, + title: '우회 여부 확인', + desc: '좌표를 두 개 점으로 이어주세요.' + }) + polyline.setMap(null); polyline = ''; } @@ -204,7 +217,7 @@ export const FlightPlanDraw = props => { lastDistance = guideline.getDistance(); guideline.getPath().push(polygonpaths[0]); var distance = guideline.getDistance(); - addMileStone(polygonpaths[0], fromMetersToText(distance - lastDistance)); + // addMileStone(polygonpaths[0], fromMetersToText(distance - lastDistance)); setMarker(distanceMarker); distanceMarker.forEach(c => c.setMap(null)) @@ -254,7 +267,8 @@ export const FlightPlanDraw = props => { polyline.getPath().push(coord); var distance = polyline.getDistance(); - addMileStone(coord, fromMetersToText(distance - lastDistance)); + // addMileStone(coord, fromMetersToText(distance - lastDistance)); + addMileStone(polyline.getPath()._array, fromMetersToText(distance - lastDistance)); lastDistance = distance; } } @@ -303,8 +317,13 @@ export const FlightPlanDraw = props => { polygon.getPath().push(coord); guideline.getPath().push(coord); + // console.log(polygon.getPath()._array, 'polygon') + // console.log(guideline.getPath()._array.length, 'guide') + // console.log(polygon.getPath()._array.length) + var distance = guideline.getDistance(); - addMileStone(coord, fromMetersToText(distance - lastDistance)); + // addMileStone(coord, fromMetersToText(distance - lastDistance)); + addMileStone(guideline.getPath()._array, fromMetersToText(distance - lastDistance)); lastDistance = distance; } } @@ -638,7 +657,7 @@ export const FlightPlanDraw = props => { position: paths[i], icon: { content: '
'+ 'Start' +'
', - anchor: new naver.maps.Point(-5, -5) + anchor: new naver.maps.Point(45, 35) }, map: map }) ) @@ -648,9 +667,14 @@ export const FlightPlanDraw = props => { let text = fromMetersToText(r); + let dis1 = paths[i-1] + let dis2 = paths[i] + let midPoint = new naver.maps.LatLng((dis1.y + dis2.y)/2, (dis1.x + dis2.x)/2); + distanceMarker.push( new naver.maps.Marker({ - position: paths[i], + // position: paths[i], + position: midPoint, icon: { content: '
'+ text +'
', anchor: new naver.maps.Point(-5, -5) @@ -705,48 +729,58 @@ export const FlightPlanDraw = props => { } for(let i = 0; i < paths.length+1; i++) { + //start if(i == 0) { distanceMarker.push( new naver.maps.Marker({ - position: paths[i], + position: paths[0], icon: { - content: '
'+ 'Start' +'
', - anchor: new naver.maps.Point(-5, -5) + content: '
'+ 'Start' +'
', + anchor: new naver.maps.Point(45, 35) }, map: map }) ) + //첫좌표이자 마지막 좌표 } else if(i == paths.length) { var proj = map.getProjection(), r = proj.getDistance(paths[0], paths[i-1]); let text = fromMetersToText(r); + let dis1 = paths[0] + let dis2 = paths[i-1] + let midPoint = new naver.maps.LatLng((dis1.y + dis2.y)/2, (dis1.x + dis2.x)/2); + distanceMarker.push( new naver.maps.Marker({ - position: paths[0], + // position: paths[0], + position: midPoint, icon: { content: '
'+ text +'
', - anchor: new naver.maps.Point(45, 35) + anchor: new naver.maps.Point(0, 35) }, map: map }) ) - } else if(i == paths.length-1) { - // let tt = new naver.maps.EPSG3857.getDistance(paths[i], paths[]) - + //그 외 나머지 } else { var proj = map.getProjection(), r = proj.getDistance(paths[i-1], paths[i]); let text = fromMetersToText(r); + let dis1 = paths[i-1] + let dis2 = paths[i] + let midPoint = new naver.maps.LatLng((dis1.y + dis2.y)/2, (dis1.x + dis2.x)/2); + distanceMarker.push( new naver.maps.Marker({ - position: paths[i], + // position: paths[i], + position: midPoint, icon: { content: '
'+ text +'
', - anchor: new naver.maps.Point(-5, -5) + anchor: new naver.maps.Point(20, 35) }, map: map }) @@ -801,17 +835,25 @@ export const FlightPlanDraw = props => { //div로 보여주기 const addMileStone = (coord, text) => { let content; + let midPoint; + let anchor; if(text == 'Start') { - content = '
'+ text +'
' + content = '
'+ text +'
' + midPoint = coord + anchor = new naver.maps.Point(45, 35) } else { content = '
'+ text +'
' + let dis1 = coord[coord.length-2]; + let dis2 = coord[coord.length-1]; + midPoint = new naver.maps.LatLng((dis1.y + dis2.y)/2, (dis1.x + dis2.x)/2); + anchor = new naver.maps.Point(20, 35) } var marker = new naver.maps.Marker({ - position: coord, + position: midPoint, icon: { content: content, - anchor: new naver.maps.Point(-5, -5) + anchor: anchor }, // map: map }); @@ -832,14 +874,19 @@ export const FlightPlanDraw = props => { var km = 1000, text = meters; + + text = parseFloat(meters.toFixed(1)) + 'm'; + - if(meters >= km) { - text = parseFloat((meters / km).toFixed(1)) + 'km'; - } else { - text = parseFloat(meters.toFixed(1)) + 'm'; - } + // if(meters >= km) { + // text = parseFloat((meters / km).toFixed(1)) + 'km'; + // } else { + // text = parseFloat(meters.toFixed(1)) + 'm'; + // } return text; } - return null; + return( + + ) }; \ No newline at end of file diff --git a/src/components/map/naver/dron/DronMarker.js b/src/components/map/naver/dron/DronMarker.js index e6e78c2..f61ab98 100644 --- a/src/components/map/naver/dron/DronMarker.js +++ b/src/components/map/naver/dron/DronMarker.js @@ -45,7 +45,7 @@ export const DronMarker = props => { hideProgressBar: true, position: toast.POSITION.BOTTOM_RIGHT, onClick: props => { - if(marker) handlerDronClick(marker); + if(marker) handlerDronClick(marker); } } ) @@ -91,8 +91,13 @@ export const DronMarker = props => { title: id, id: id, controlId: controlId, - icon: { - url: DronIcon, + 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), } @@ -104,16 +109,17 @@ export const DronMarker = props => { handlerDronClick(marker); }); - // drone 정보 창 - // markerInfoWindow(marker); - setArrMarkers(m => [...m, marker]); }; const handlerDronClick = marker => { const idntfNum = marker.id; - const contorlId = marker.controlId; - + const contorlId = marker.controlId; + + // 클릭한 식별번호 정보를 가진 그룹 추출 + // const group = controlGroupAuthInfo.find(group => group.idntfNum === idntfNum); + + //히스토리 불러오기 dispatch(objectClickAction(contorlId)); dispatch(controlGpDtlAction.request(contorlId)); dispatch(controlGpFlightPlanAction.request(idntfNum)); @@ -163,10 +169,10 @@ export const DronMarker = props => { if (isExists) { moveMarkers(isExists, position); } else { - addMarkers(position, item.objectId, item.controlId); + addMarkers(position, item.objectId, item.controlId); } } else { - addMarkers(position, item.objectId, item.controlId); + addMarkers(position, item.objectId, item.controlId); } }); } @@ -176,43 +182,5 @@ export const DronMarker = props => { setArrMarkers(arrData); }; - const markerInfoWindow = (marker) => { - controlGpList.forEach(gps => { - - const contents = [ - `
`, - `
`, - ` ${marker.id}`, - `
`, - `
`, - `
`, - ` ${gps.speed}${gps.speedType}`, - `
`, - `
`, - ` ${gps.elev}${gps.elevType}`, - `
`, - `
`, - ` ${gps.heading}`, - `
`, - `
`, - `
` - ].join(''); - - const info = new naver.maps.InfoWindow({ - id: marker.id, - content: contents, - backgroundColor: '#283046', //박스안쪽영역 컬러 - anchorSize: new props.naver.maps.Size(30, -10), - anchorSkew: false, - anchorColor: '#283046', - pixelOffset: new props.naver.maps.Point(20, -20) - }); - - console.log(info); - - info.open(props.map, marker); - }); - } - return null; }; diff --git a/src/containers/basis/dron/BasisIdntfContainer.js b/src/containers/basis/dron/BasisIdntfContainer.js index 5e67cc9..3932da7 100644 --- a/src/containers/basis/dron/BasisIdntfContainer.js +++ b/src/containers/basis/dron/BasisIdntfContainer.js @@ -3,7 +3,7 @@ import { useDispatch, useSelector } from 'react-redux'; import { Card, CardBody, Col, Row } from 'reactstrap'; import { BasisIdntfForm } from '../../../components/basis/dron/BasisIdntform'; import * as Actions from '../../../modules/basis/dron/actions/basisDronAction'; - +import { ErrorModal } from '../../../components/modal/ErrorModal'; export const BasisIdntfContainer = props => { const { listIdntf, idntfCount, detail, isRefreshIdntf } = useSelector( state => state.dronState @@ -18,6 +18,12 @@ export const BasisIdntfContainer = props => { hpno:'', isSave: false }); + //모달 관련 설정 + const [modal, setModal] = useState({ + isOpen: false, + title: '', + desc: '' + }); const [idntDataList, setIdntfDataList] = useState([]); @@ -50,16 +56,60 @@ export const BasisIdntfContainer = props => { dispatch(Actions.IDNTF_LIST.request(props.id)); }; - const handlerCreate = async data => { + const handlerCreate = async () => { console.log('idntDataList>>>', idntDataList); - let saveArr = idntDataList.filter(item => item.isSave === false); - dispatch( - Actions.IDNTF_CREATE.request({ - arcrftSno: detail?.arcrftSno, - data: saveArr - }) - ); + + if (saveArr.length > 0) { + let checking = true; + + saveArr.forEach(idntf => { + + if (!idntf.idntfNum && idntf.idntfNum === '') { + setModal({ + isOpen: true, + title: '필수값 입력 오류', + desc: '식별번호를 입력해주세요.' + }); + checking = false; + return false; + } + if(!idntf.ownerNm && idntf.ownerNm === '') { + setModal({ + isOpen: true, + title: '필수값 입력 오류', + desc: '소유자명을 입력해주세요.' + }); + checking = false; + return false; + } + if(!idntf.hpno && idntf.hpno === '') { + setModal({ + isOpen: true, + title: '필수값 입력 오류', + desc: '연락처를 입력해주세요.' + }); + checking = false; + return false; + } + }); + + if (!checking) return false; + + dispatch( + Actions.IDNTF_CREATE.request({ + arcrftSno: detail?.arcrftSno, + data: saveArr + }) + ); + } else { + setModal({ + isOpen: true, + title: '필수값 입력 오류', + desc: '식별장치 정보를 입력해주세요.' + }); + return false; + } }; const handlerDelete = async data => { @@ -104,6 +154,8 @@ export const BasisIdntfContainer = props => { ) : ( + + { handlerSave={handlerCreate} handlerDelete={handlerDelete} /> + + + ); }; diff --git a/src/modules/control/gp/sagas/controlGpSaga.ts b/src/modules/control/gp/sagas/controlGpSaga.ts index 0fa2f7c..7a9c37b 100644 --- a/src/modules/control/gp/sagas/controlGpSaga.ts +++ b/src/modules/control/gp/sagas/controlGpSaga.ts @@ -34,6 +34,8 @@ function* getControlGpSaga( } }); } + + console.log('gps ', gpsData); yield put( Actions.controlGpAction.success({ @@ -54,20 +56,17 @@ function* getControlGpSaga( yield put(Actions.controlGpRtDtlAction.request(detailData)); - // History Push + // History Push if(controlGpHistory) { - const stateHistory = controlGpHistory.concat(); + const stateHistory = controlGpHistory; + const history = stateHistory.map((h) => { + return { + ...h, + detailData + } + }); - const hisObj = { - lat: detailData.lat, - lng: detailData.lng, - objectId: detailData.objectId - } - stateHistory.push(hisObj); - - yield put(Actions.controlGpHisAction.success({ - controlGpHistory: stateHistory - })); + yield put(Actions.controlGpHisAction.success(history)); } } } catch (error) { diff --git a/src/modules/control/map/reducers/controlMapReducer.ts b/src/modules/control/map/reducers/controlMapReducer.ts index 116007a..0eb82f5 100644 --- a/src/modules/control/map/reducers/controlMapReducer.ts +++ b/src/modules/control/map/reducers/controlMapReducer.ts @@ -1,6 +1,6 @@ // ** Initial State const initialState = { - mapType: 'NORMAL', + mapType: 'HYBRID', objectId: null, isClickObject: false, area0001: true, // 비행금지 구역