diff --git a/src/assets/css/custom.css b/src/assets/css/custom.css index c84e8a1..08254ec 100644 --- a/src/assets/css/custom.css +++ b/src/assets/css/custom.css @@ -842,4 +842,7 @@ background-size: 75% auto; .layer-weather-address{display:flex;align-items:center;justify-content:space-between;} .box_4n{display:flex;flex-wrap: wrap;} -.box_4n div{width:50%;height:50vh;} \ No newline at end of file +.box_4n div{width:50%;height:50vh;} + +.modal-video{display:flex;align-items: center;justify-content: center;} +.modal-video>.modal-content{height:90vh;} \ No newline at end of file diff --git a/src/views/control/report/ControlReportList.js b/src/views/control/report/ControlReportList.js index e745dce..34e90bf 100644 --- a/src/views/control/report/ControlReportList.js +++ b/src/views/control/report/ControlReportList.js @@ -1,15 +1,52 @@ import moment from 'moment'; -import { useState } from 'react'; +import { useEffect, useState } from 'react'; import { Search, X } from 'react-feather'; import { useDispatch, useSelector } from 'react-redux'; -import { Badge, Button, Input, InputGroup } from 'reactstrap'; +import { + Badge, + Button, + Input, + InputGroup, + Modal, + ModalHeader, + ModalBody +} from 'reactstrap'; import { controlGpDtlAction, controlGpFlightPlanAction } from '../../../modules/control/gp'; import { objectClickAction } from '../../../modules/control/map/actions/controlMapActions'; -import { NavLink } from 'react-router-dom'; +const HandlerModal = ({ modal, handler }) => { + return ( +
+ + 실시간 영상보기 + + <> + + + + +
+ ); +}; const ControlReportList = props => { const { controlGpList } = useSelector(state => state.controlGpState); const [filterId, setFilterId] = useState(''); @@ -24,6 +61,12 @@ const ControlReportList = props => { // useEffect(() => {}, [filterId]); + const [modal, setModal] = useState(false); + + const handler = () => { + setModal(false); + }; + return (
@@ -100,7 +143,12 @@ const ControlReportList = props => { {item.objectId.includes('NAMWON') ? (
-
+
{ + setModal(true); + }} + > {/* { > 실시간 영상보기 */} - - 실시간 영상보기 - + + 실시간 영상보기 + {/* */}
) : ( @@ -138,6 +188,7 @@ const ControlReportList = props => { } })}
+ {modal ? : <>}
); };