diff --git a/src/views/control/alarm/ControlAlarmDetail.js b/src/views/control/alarm/ControlAlarmDetail.js index b7c1e68..ccf0753 100644 --- a/src/views/control/alarm/ControlAlarmDetail.js +++ b/src/views/control/alarm/ControlAlarmDetail.js @@ -1,56 +1,56 @@ -import { useState, useEffect } from 'react'; -import { Button, Modal, ModalHeader, ModalBody, ModalFooter, Card } from 'reactstrap' +import { Button, Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap'; -const ControlAlarmDetail = ({ historyModal, setHistoryModal, controlGpWarnLog }) => { - return ( - setHistoryModal(!historyModal)} - className='modal-dialog-centered historyModal' - > - setHistoryModal(!historyModal)}> -
- {controlGpWarnLog?.idntfNum} - 알림내역 -
-
+const ControlAlarmDetail = ({ + historyModal, + setHistoryModal, + controlGpWarnLog +}) => { + return ( + setHistoryModal(!historyModal)} + className='modal-dialog-centered historyModal' + > + setHistoryModal(!historyModal)}> +
+ {controlGpWarnLog?.idntfNum} + 알림내역 +
+
- - - - - - - - - {controlGpWarnLog ? - controlGpWarnLog.map((p, i) => { - return ( - - - - - - - ) - }) - : - - - - } -
번호식별번호날짜내용
{i + 1}{p.idntfNum}{p.createDt}{p.warnType}
데이터가 없습니다.
-
- - - -
- ) -} + + + + + + + + + {controlGpWarnLog ? ( + controlGpWarnLog.map((p, i) => { + return ( + + + + + + + ); + }) + ) : ( + + + + )} +
번호식별번호날짜내용
{i + 1}{p.idntfNum}{p.createDt}{p.warnType}
데이터가 없습니다.
+
+ + + +
+ ); +}; -export default ControlAlarmDetail; \ No newline at end of file +export default ControlAlarmDetail; diff --git a/src/views/control/alarm/ControlAlarmList.js b/src/views/control/alarm/ControlAlarmList.js index 8701e72..f57a796 100644 --- a/src/views/control/alarm/ControlAlarmList.js +++ b/src/views/control/alarm/ControlAlarmList.js @@ -1,175 +1,151 @@ import { useEffect, useState } from 'react'; import { X } from 'react-feather'; import { useDispatch, useSelector } from 'react-redux'; -import { controlGpArcrftWarnAction, controlGpLogAction } from '../../../modules/control/gp/actions/controlGpAction'; +import { controlGpLogAction } from '../../../modules/control/gp/actions/controlGpAction'; import ControlAlarmDetail from './ControlAlarmDetail'; import { Badge } from 'reactstrap'; const ControlAlarmList = props => { - const dispatch = useDispatch(); - - const [historyModal, setHistoryModal] = useState(false); + const dispatch = useDispatch(); + // 비정상상황 상세 히스토리 모달 + const [historyModal, setHistoryModal] = useState(false); - const { controlGpList } = useSelector(state => state.controlGpState); - const { controlGpArcrftWarnList } = useSelector(state => state.controlGpLogState); - const { controlGpWarnLog } = useSelector(state => state.controlGpLogState); - const { objectId, isClickObject } = useSelector(state => state.controlMapReducer); + // 비정상상황 상세 히스토리 + const { controlGpWarnLog } = useSelector(state => state.controlGpLogState); - - const [total, setTotal] = useState({ - totalDroneCnt: 0, - totalWarnCnt: 0, - warnList: [] - }); + // 비정상상황 기체 목록 + const { controlGpArcrftWarnList } = useSelector( + state => state.controlGpLogState + ); - const handleWarnDetail = (cntrlId) => { - setHistoryModal(prev => !prev); + // 클릭한 기체 Id, 비행중인 기체 클릭 여부 + const { objectId, isClickObject } = useSelector( + state => state.controlMapReducer + ); - dispatch(controlGpLogAction.request({id : cntrlId})); - } + // 전체 드론, 비정상 드론 개수 + const [total, setTotal] = useState({ + totalDroneCnt: 0, + totalWarnCnt: 0, + warnList: [] + }); - useEffect(() => { - if(isClickObject) { - props.setOpenAlarmList(false); - } + // 비정상상황 상세 히스토리 모달 표출 + const handleWarnDetail = cntrlId => { + setHistoryModal(prev => !prev); + dispatch(controlGpLogAction.request({ id: cntrlId })); + }; - }, [objectId, isClickObject]) + // 비행중인 기체 클릭 시 비정상상황 사이드메뉴 닫힘 + useEffect(() => { + if (isClickObject) { + props.setOpenAlarmList(false); + } + }, [objectId, isClickObject]); - useEffect(() => { - if(controlGpArcrftWarnList) { - let totalWarnCnt = 0; + // 비정상상황 기체 개수 계산 + useEffect(() => { + if (controlGpArcrftWarnList) { + let totalWarnCnt = 0; - if(controlGpArcrftWarnList.length > 0) { - controlGpArcrftWarnList.forEach(warn => { - totalWarnCnt += warn.warnCount; - }); - } + if (controlGpArcrftWarnList.length > 0) { + controlGpArcrftWarnList.forEach(warn => { + totalWarnCnt += warn.warnCount; + }); + } - setTotal(total => { - return { - totalDroneCnt : controlGpArcrftWarnList.length, - totalWarnCnt : totalWarnCnt, - warnList : controlGpArcrftWarnList - } - }) - } + setTotal(total => { + return { + totalDroneCnt: controlGpArcrftWarnList.length, + totalWarnCnt: totalWarnCnt, + warnList: controlGpArcrftWarnList + }; + }); + } + }, [controlGpArcrftWarnList]); - }, [controlGpArcrftWarnList]); - - return ( -
-
-
-

실시간 비정상 알림 정보

- -
-
-
-
-
-
드론 현황
-
- - {total? total.totalDroneCnt: 0}대 비행 중 - -
-
-
-
-
-
비정상 알림 전체
-
- - {total? total.totalWarnCnt : 0}건 - -
-
-
-
+ return ( +
+
+
+

실시간 비정상 알림 정보

+ +
+
+
+
+
+
드론 현황
+
+ + {total ? total.totalDroneCnt : 0}대 비행 중 +
-
-
-
-

알림 목록

+
+
+
+
+
비정상 알림 전체
+
+ + {total ? total.totalWarnCnt : 0}건 +
- {total?.warnList.map((warn, i) => { - const warnContent = warn.warnType === 'PLAN' ? '비행 경로 이탈' : '비정상 상황 발생' +
+
+
+
+
+
+
+

알림 목록

+
+ {total?.warnList.map((warn, i) => { + const warnContent = + warn.warnType === 'PLAN' ? '비행 경로 이탈' : '비정상 상황 발생'; - return ( -
handleWarnDetail(warn.cntrlId)}> -
-
-
-
{warn.idntfNum}
-
{warn.occurDt ? warn.occurDt : '-'}
-
-
-
{warnContent ? warnContent : '-'}
-
{warn.warnCount ? warn.warnCount : '-'}건
-
-
-
-
- ) - })} - {/*
-
-
-
-
PAV-001
-
2022. 09. 02 10:00:30
-
-
-
비행 경로 이탈
-
22건
-
-
-
-
-
-
-
-
-
PAV-002
-
2022. 09. 02 11:23:52
-
-
-
비행 경로 이탈
-
10건
-
-
-
-
-
-
-
-
-
PAV-003
-
-
-
-
-
-
-
0건
-
-
-
-
*/} + return ( +
handleWarnDetail(warn.cntrlId)} + > +
+
+
+
{warn.idntfNum}
+
+ {warn.occurDt ? warn.occurDt : '-'} +
+
+
+
+ {warnContent ? warnContent : '-'} +
+
+ {warn.warnCount ? warn.warnCount : '-'}건 +
+
+
+
+ ); + })} +
- -
- ); + +
+ ); }; export default ControlAlarmList; diff --git a/src/views/control/alarm/ControlAlarmNotice.js b/src/views/control/alarm/ControlAlarmNotice.js deleted file mode 100644 index 9c01ad4..0000000 --- a/src/views/control/alarm/ControlAlarmNotice.js +++ /dev/null @@ -1,45 +0,0 @@ -import { Bell, ChevronDown, ChevronUp } from "react-feather"; -import { ReactComponent as DroneMenuIcon } from '../../../assets/images/drone_menu_icon.svg'; - -const ControlAlarmNotice = () => { - {} - return( - -
- {/*
-
- -
-
-
-
- 2021-06-17 12:00:00AVSF123 장애물 - 지역에 접근하였습니다111. -
-
- 2021-06-30 13:00:00AVSF123 - 비행금지구역에 접근하였습니다. -
-
- 2021-08-20 14:00:00AVSF123 - 국립공원구역에 접근하였습니다. -
-
-
-
- - -
-
*/} - -
- - - ) -} - -export default ControlAlarmNotice; diff --git a/src/views/control/main/ControlMain.js b/src/views/control/main/ControlMain.js index 24fd640..4a0fb6f 100644 --- a/src/views/control/main/ControlMain.js +++ b/src/views/control/main/ControlMain.js @@ -11,7 +11,6 @@ import { Cloud, CloudRain, CloudSnow, - Moon, Grid } from 'react-feather'; @@ -19,7 +18,6 @@ import { AiOutlinePoweroff } from 'react-icons/ai'; import { IoAlertOutline } from 'react-icons/io5'; import { ReactComponent as DroneMenuIcon } from '../../../assets/images/drone_menu_icon.svg'; import { Card } from 'reactstrap'; -import ControlAlarmNotice from '../alarm/ControlAlarmNotice'; import ControlReportList from '../report/ControlReportList'; import ControlReportDetail from '../report/ControlReportDetail'; import ControlAlarmList from '../alarm/ControlAlarmList'; @@ -28,71 +26,51 @@ import WebsocketClient from '../../../components/websocket/WebsocketClient'; import { useDispatch, useSelector } from 'react-redux'; import { controlweatherAction } from '../../../modules/control/gp/actions/controlGpAction'; import * as Actions from '../../../modules/account/login/actions/authAction'; -import { - ctrlDrawTypeChangeAction, - objectUnClickAction -} from '../../../modules/control/map/actions/controlMapActions'; +import { objectUnClickAction } from '../../../modules/control/map/actions/controlMapActions'; const ControlMain = () => { const dispatch = useDispatch(); + const history = useHistory(); + // 비행중인 기체 클릭 여부 const { isClickObject } = useSelector(state => state.controlMapReducer); - const { controlGpList, controlGroupAuthInfo } = useSelector( - state => state.controlGpState - ); + + // 비행중인 기체 정보 + const { controlGpList } = useSelector(state => state.controlGpState); + + // 기체 상세 정보 const { controlDetail, controlWheather } = useSelector( state => state.controlGpDtlState ); + + // 드론 기체 갯수 (드론 + uam) const { controlGpCountDrone, controlGpCountFlight } = useSelector( state => state.controlGpCountState ); - // pav박람회 -> uam, 드론 구별을 위한 임시 코드 - // (이 작업으로 고도화 하려면 추후에 서버에서 uam타입을 새로 더 받아 작업해야 함) + // 드론, uam 기체 갯수 const [droneCount, setDroneCount] = useState(0); const [uamCount, setUamCount] = useState(0); + // 비정상상황 여부 const [alarm, setAlarm] = useState(false); - const { user } = useSelector(state => state.authState); - const [oepnReportList, setOpenReportList] = useState(false); - // const [openReportDetail, setOpenReportDetail] = useState(false); - // const [openWeatherList, setOpenWeatherList] = useState(false); - const [openAlarmList, setOpenAlarmList] = useState(false); + // 오른쪽 사이드 메뉴 표출 여부 const [openSetting, setOpenSetting] = useState(true); - const history = useHistory(); - const openMenu = val => { - if (val === 'reportList') { - setOpenReportList(true); - // setOpenReportDetail(false); - // setOpenWeatherList(false); - setOpenAlarmList(false); - } else if (val === 'weatherList') { - setOpenReportList(false); - // setOpenReportDetail(false); - // setOpenWeatherList(true); - setOpenAlarmList(false); - } else if (val === 'alarmList') { - dispatch(objectUnClickAction()); - - setOpenReportList(false); - // setOpenReportDetail(false); - // setOpenWeatherList(false); - setOpenAlarmList(true); - - setAlarm(false); - } - }; + // 왼쪽 드론 정보 사이드 메뉴 표출 여부 + const [oepnReportList, setOpenReportList] = useState(false); - // const openReportDetailParam = val => { - // setOpenReportDetail(true); - // }; + // 왼쪽 드론 비정상상황 알림 사이드 메뉴 표출 여부 + const [openAlarmList, setOpenAlarmList] = useState(false); - const handlerLogout = () => { - dispatch(Actions.logout.request()); + // 김포공항 좌표 + const rq = { + nx: 37.558522, + ny: 126.793722 }; + // 드론 비정상상황일 시 왼쪽 사이드 메뉴 알람 표시 아이콘 변경 useEffect(() => { if (controlGpList) { const warnGps = controlGpList.find(gps => { @@ -105,6 +83,7 @@ const ControlMain = () => { } }, [controlGpList]); + // 비행중인 기체 클릭 시 열려있는 사이드 메뉴 닫기 useEffect(() => { if (isClickObject) { setOpenReportList(false); @@ -112,6 +91,7 @@ const ControlMain = () => { } }, [isClickObject]); + // 드론, uam 기체 갯수 계산 useEffect(() => { if (controlGpCountDrone) { const uamCnt = controlGpCountDrone.filter(i => @@ -126,19 +106,43 @@ const ControlMain = () => { } }, [controlGpCountDrone]); + // 김포공항 날씨 API호출 + useEffect(() => { + dispatch(controlweatherAction.request(rq)); + }, []); + + // 화면 왼쪽 사이드 메뉴 오픈 시 다른 메뉴 닫기 + const openMenu = val => { + console.log(val, '--'); + if (val === 'reportList') { + setOpenReportList(true); + setOpenAlarmList(false); + } else if (val === 'weatherList') { + setOpenReportList(false); + setOpenAlarmList(false); + } else if (val === 'alarmList') { + dispatch(objectUnClickAction()); + + setOpenReportList(false); + setOpenAlarmList(true); + + setAlarm(false); + } + }; + + // 로그아웃 + const handlerLogout = () => { + dispatch(Actions.logout.request()); + }; + + // 드론 상세정보 창 닫기 const handlerClose = () => { setOpenReportList(true); dispatch(objectUnClickAction()); }; - //날씨 API - const rq = { - nx: 37.558522, - ny: 126.793722 - }; - useEffect(() => { - dispatch(controlweatherAction.request(rq)); - }, []); - function weathericon() { + + // 김포공항 날씨 아이콘 설정 + const weathericon = () => { if (controlWheather) { let wheatherDetail = controlWheather.items.item; let skyDetail = wheatherDetail[6].fcstValue; @@ -150,24 +154,10 @@ const ControlMain = () => { return ; } else return ; } - } - - const handlerDrawType = val => { - dispatch(ctrlDrawTypeChangeAction(val)); - }; - - const ThemeToggler = () => { - if (skin === 'dark') { - return setSkin('light')} />; - } else { - return setSkin('dark')} />; - } }; return ( <> - -

@@ -283,12 +273,6 @@ const ControlMain = () => {
드론 - {/* {controlGpList ? controlGpList.length : 0} */} - {/* - {controlGpCountDrone?.length > 0 - ? controlGpCountDrone?.length - : 0} - */} {droneCount}
@@ -297,7 +281,6 @@ const ControlMain = () => {
항공기 - {/* 2147대 */} {controlGpCountFlight?.length > 0 ? controlGpCountFlight?.length @@ -307,30 +290,10 @@ const ControlMain = () => {
- {/*
- -
- 화재경보 -
-
-
- handlerDrawType('CIRCLE')}> - 화재구역설정 - -
-
- handlerDrawType('RESET')}>초기화 -
-
-
-
*/}

{oepnReportList ? ( - + ) : (
)} @@ -339,11 +302,6 @@ const ControlMain = () => { ) : (
)} - {/* {openWeatherList ? ( - - ) : ( -
- )} */} {openAlarmList ? ( diff --git a/src/views/control/report/ControlReportDetail.js b/src/views/control/report/ControlReportDetail.js index 7ce80f7..732c48f 100644 --- a/src/views/control/report/ControlReportDetail.js +++ b/src/views/control/report/ControlReportDetail.js @@ -1,45 +1,51 @@ import moment from 'moment'; -import React, { useMemo } from 'react'; import { useState, useEffect } from 'react'; import { X } from 'react-feather'; import { useDispatch, useSelector } from 'react-redux'; import drone_img from '../../../assets/images/drone.jpg'; import uam_img from '../../../assets/images/uam_img.jpg'; import drone_yellow from '../../../assets/images/drone_yellow.png'; -import { IMG_PATH } from '../../../configs/constants'; -import { objectUnClickAction } from '../../../modules/control/map/actions/controlMapActions'; import { GET_ARCTFT_TYPE_CD, GET_WGHT_TYPE_CD } from '../../../utility/CondeUtil'; -import { - controlGpLogAction, - controlweatherAction -} from '../../../modules/control/gp'; +import { controlGpLogAction } from '../../../modules/control/gp'; import ControlAlarmDetail from '../alarm/ControlAlarmDetail'; -import axios from '../../../modules/utils/customAxiosUtil'; import { Navigation2, - Search, Compass, Sun, Cloud, CloudRain, CloudSnow } from 'react-feather'; -import { WHEATHER_KEY } from '../../../configs/constants'; import { Table } from 'reactstrap'; + const ControlReportDetail = props => { const dispatch = useDispatch(); + + // 비정상상황 모달 const [historyModal, setHistoryModal] = useState(false); + // 기체 상세정보 const { controlGpDetail, controlDetail } = useSelector( state => state.controlGpDtlState ); - //const { controlWheather } = useSelector(state => state.ControlGpWeatherState); + + // 비정상상황 히스토리 내역 const { controlGpWarnLog } = useSelector(state => state.controlGpLogState); - function weathericon() { + // 해당 드론의 비정상상황 알림내역 불러옴 + useEffect(() => { + if (historyModal) { + if (controlGpDetail) { + dispatch(controlGpLogAction.request({ id: controlGpDetail.controlId })); + } + } + }, [historyModal]); + + // 날씨 아이콘 표출 + const weathericon = () => { if (controlDetail) { let wheatherDetail = controlDetail.items.item; let skyDetail = wheatherDetail[6].fcstValue; @@ -51,16 +57,9 @@ const ControlReportDetail = props => { return ; } else return ; } - } - - useEffect(() => { - if (historyModal) { - if (controlGpDetail) { - dispatch(controlGpLogAction.request({ id: controlGpDetail.controlId })); - } - } - }, [historyModal]); + }; + // 상세정보에 내역이 없으면 -로 표출 const nullMessage = val => { if (val) { return val; @@ -68,6 +67,7 @@ const ControlReportDetail = props => { return '-'; } }; + return (
@@ -76,7 +76,6 @@ const ControlReportDetail = props => {
- {/* {controlDetail?.imageUrl ? ( - - ) : ( - - )} */} {controlGpDetail?.objectId.includes('UAM') ? ( ) : ( @@ -138,18 +132,6 @@ const ControlReportDetail = props => { {GET_ARCTFT_TYPE_CD(controlDetail?.arcrftTypeCd)}
- {/*
-
배터리 잔량
-
- {controlGpDetail?.betteryLevel} % -
-
-
-
배터리 전압
-
- {controlGpDetail?.betteryVoltage} volt -
-
*/}
@@ -177,12 +159,6 @@ const ControlReportDetail = props => { : '-'}
- {/*
-
현재위치
-
- 인천광역시 부평구 안남로 272 -
-
*/}
속도
@@ -207,25 +183,12 @@ const ControlReportDetail = props => { : '-'}
- {/*
-
비행거리
-
- {nullMessage(controlGpDetail?.moveDistance)}{' '} - {controlGpDetail?.moveDistanceType} -
-
*/}
헤딩 방위각
{nullMessage(controlGpDetail?.heading)}
- {/*
-
상태
-
- {nullMessage(controlGpDetail?.dronStatus)} -
-
*/}
위치정보 수신 시간
@@ -248,10 +211,6 @@ const ControlReportDetail = props => {
- {/*
-
소속기관
-
팔네트웍스
-
*/}
담당자 이름
diff --git a/src/views/control/report/ControlReportList.js b/src/views/control/report/ControlReportList.js index 5dd5d63..6fd9459 100644 --- a/src/views/control/report/ControlReportList.js +++ b/src/views/control/report/ControlReportList.js @@ -3,27 +3,24 @@ import { useState } from 'react'; import { Search, X } from 'react-feather'; import { useDispatch, useSelector } from 'react-redux'; import { Badge, Button, Input, InputGroup } from 'reactstrap'; -import { - controlGpDtlAction, - controlGpFlightPlanAction -} from '../../../modules/control/gp'; +import { controlGpDtlAction } from '../../../modules/control/gp'; import { objectClickAction } from '../../../modules/control/map/actions/controlMapActions'; -import { NavLink } from 'react-router-dom'; const ControlReportList = props => { + const dispatch = useDispatch(); + + // 비행중인 기체 정보 리스트 const { controlGpList } = useSelector(state => state.controlGpState); - const [filterId, setFilterId] = useState(''); - const dispatch = useDispatch(); + // 검색한 식별번호 + const [filterId, setFilterId] = useState(''); + // 기체 상세정보 표출 const handlerDetail = item => { dispatch(objectClickAction(item.controlId)); dispatch(controlGpDtlAction.request(item.controlId)); - // dispatch(controlGpFlightPlanAction.request(item.objectId)); }; - // useEffect(() => {}, [filterId]); - return (
@@ -97,34 +94,6 @@ const ControlReportList = props => { {item.dronStatus ? item.dronStatus : '-'}
- - {item.objectId.includes('NAMWON') ? ( -
-
- - 실시간 영상보기 - -
-
- ) : ( - <> - )} - - {/*
- -
*/}
); diff --git a/src/views/control/setting/ControlSetting.js b/src/views/control/setting/ControlSetting.js index 162ef1d..60b1ef6 100644 --- a/src/views/control/setting/ControlSetting.js +++ b/src/views/control/setting/ControlSetting.js @@ -4,15 +4,17 @@ import { Button, ButtonGroup, CustomInput } from 'reactstrap'; import * as Actions from '../../../modules/menu/actions/menuAction'; import { areaClickAction, - mapTypeChangeAction, - sensorClickAction + mapTypeChangeAction } from '../../../modules/control/map/actions/controlMapActions'; const ControlSetting = props => { const dispatch = useDispatch(); const history = useHistory(); + + // 지도, 지도타입, 공역 타입 컨트롤 const mapControl = useSelector(state => state.controlMapReducer); + // 지도 유형 변경 const handlerMapType = val => { if (val === mapControl.mapType) return; if (val === 'TERRAIN') { @@ -35,24 +37,16 @@ const ControlSetting = props => { dispatch(mapTypeChangeAction(val)); }; + // 공역 표출 const handlerAreaClick = val => { dispatch(areaClickAction(val)); }; - const handlerSensorClick = (val, isChecked) => { - if (isChecked) { - dispatch(sensorClickAction(val)); - } else { - dispatch(sensorClickAction('')); - } - }; - return (

지도유형

- {/* */}
@@ -270,103 +264,8 @@ const ControlSetting = props => {
- {/*
-
-

환경지표

-
-
-
-
-
-
- 미세먼지(DUST) -
-
- handlerSensorClick('dust', e.target.checked)} - className='custom-control-primary' - type='switch' - id='sensorDust' - name='sensorDust' - inline - checked={mapControl.sensor === 'dust'} - // defaultChecked={mapControl.sensor === 'dust'} - /> -
-
-
-
- 오존(O3) -
-
- handlerSensorClick('o3', e.target.checked)} - className='custom-control-primary' - type='switch' - id='sensorO3' - name='sensorO3' - inline - checked={mapControl.sensor === 'o3'} - // defaultChecked={mapControl.sensor === 'o3'} - /> -
-
-
-
- 이산화질소(No2) -
-
- handlerSensorClick('no2', e.target.checked)} - className='custom-control-primary' - type='switch' - id='sensorNo2' - name='sensorNo2' - inline - checked={mapControl.sensor === 'no2'} - // defaultChecked={mapControl.sensor === 'no2'} - /> -
-
-
-
- 일산화탄소(Co) -
-
- handlerSensorClick('co', e.target.checked)} - className='custom-control-primary' - type='switch' - id='sensorCo' - name='sensorCo' - inline - checked={mapControl.sensor === 'co'} - // defaultChecked={mapControl.sensor === 'co'} - /> -
-
-
-
- 아황산가스(So2) -
-
- handlerSensorClick('so2', e.target.checked)} - className='custom-control-primary' - type='switch' - id='sensorSo2' - name='sensorSo2' - inline - checked={mapControl.sensor === 'so2'} - // defaultChecked={mapControl.sensor === 'so2'} - /> -
-
-
-
-
-
*/}
); }; + export default ControlSetting;