junh_eee(이준희)
10 months ago
1 changed files with 93 additions and 0 deletions
@ -0,0 +1,93 @@
|
||||
import { useEffect, useState } from 'react'; |
||||
import { useDispatch, useSelector } from 'react-redux'; |
||||
import useAudio from '../../../../utility/hooks/useAudio'; |
||||
import warning from '../../../../assets/sounds/warning.mp3'; |
||||
import { toast } from 'react-toastify'; |
||||
import { Fragment } from 'react'; |
||||
import { objectClickAction } from '../../../../modules/control/map/actions/controlMapActions'; |
||||
import { |
||||
controlGpDtlAction, |
||||
controlGpFlightPlanAction |
||||
} from '../../../../modules/control/gp'; |
||||
|
||||
export default function DronToast() { |
||||
const dispatch = useDispatch(); |
||||
const [playing, toggle] = useAudio(warning); |
||||
const { controlGpArcrftWarnList } = useSelector( |
||||
state => state.controlGpLogState |
||||
); |
||||
const [toastId, setToastId] = useState(); |
||||
|
||||
let warningList = []; |
||||
|
||||
useEffect(() => { |
||||
if (controlGpArcrftWarnList) { |
||||
if (!toastId) { |
||||
for (let i = 0; i < controlGpArcrftWarnList.length; i++) { |
||||
if (controlGpArcrftWarnList[i].controlWarnCd) { |
||||
const id = toast.info( |
||||
toastRender( |
||||
`${controlGpArcrftWarnList[i].idntfNum} 비정상 상황 알림`, |
||||
`경로 상에 비행 구역을 이탈했습니다.` |
||||
), |
||||
{ |
||||
autoClose: false, |
||||
hideProgressBar: true, |
||||
position: toast.POSITION.BOTTOM_RIGHT, |
||||
onClick: () => { |
||||
handlerToastClick( |
||||
controlGpArcrftWarnList[i].cntrlId, |
||||
controlGpArcrftWarnList[i].idntfNum |
||||
); |
||||
// setToastId(null);
|
||||
}, |
||||
onClose: () => { |
||||
// setIs(true);
|
||||
toggle(false); |
||||
setToastId(null); |
||||
} |
||||
} |
||||
); |
||||
|
||||
setToastId(id); |
||||
break; |
||||
} |
||||
} |
||||
} |
||||
for (let i = 0; i < controlGpArcrftWarnList.length; i++) { |
||||
warningList.push(controlGpArcrftWarnList[i].controlWarnCd); |
||||
} |
||||
|
||||
warningList.find(i => i) ? toggle(true) : toggle(false); |
||||
} |
||||
}, [controlGpArcrftWarnList]); |
||||
|
||||
const handlerToastClick = (controlId, idntfNum) => { |
||||
dispatch(objectClickAction(controlId)); |
||||
dispatch(controlGpDtlAction.request(controlId)); |
||||
dispatch(controlGpFlightPlanAction.request(idntfNum)); |
||||
}; |
||||
|
||||
const toastRender = (title, message) => { |
||||
return ( |
||||
<Fragment> |
||||
<div className='toastify-header'> |
||||
<div className='title-wrapper'> |
||||
<Avatar size='sm' color='info' icon={<Info size={10} />} /> |
||||
<h6 className='text-info ml-50 mb-0' style={{ fontSize: 'small' }}> |
||||
{title} |
||||
</h6> |
||||
</div> |
||||
</div> |
||||
|
||||
<div className='toastify-body'> |
||||
<span>{message}</span> |
||||
</div> |
||||
</Fragment> |
||||
); |
||||
}; |
||||
|
||||
return null; |
||||
|
||||
return <div>DronToast</div>; |
||||
} |
Loading…
Reference in new issue