- {mapObject && viewCoordObj.length > 0 ? (
-
- {/* {console.log(viewCoordObj, '----')} */}
- {viewCoordObj?.map((obj, i) => {
- let coord =
- obj.properties.id === 'LINE'
- ? obj.geometry.coordinates
- : obj.geometry.coordinates[0];
- if (obj.properties.id === 'POLYGON') {
- coord = coord.slice(0, coord.length - 1);
- } else if (obj.properties.id === 'CIRCLE') {
- coord = [obj.properties.center];
- }
-
- return (
-
{
- const allObj = drawObj
- .getAll()
- .features.filter(o => o.properties.id !== 'BUFFER');
-
- drawObj.changeMode('direct_select', {
- featureId: allObj[i].id
- });
- }}
- >
-
비행구역 {i + 1}
-
- {coord?.map((co, idx) => {
- if (idx % 2 === 0) {
- const fCoord = FormattingCoord(co);
- const current = fCoord.join(', ');
- if (idx !== coord.length - 1) {
- const next = FormattingCoord(coord[idx + 1]).join(
- ', '
- );
-
- return (
-
-
- {current}
- /
- {next}
-
-
- );
- } else {
- return (
-
-
- {current}
-
-
- );
- }
+ {viewCoordObj?.map((obj, i) => {
+ let coord =
+ obj.properties.id === 'LINE'
+ ? obj.geometry.coordinates
+ : obj.geometry.coordinates[0];
+ if (obj.properties.id === 'POLYGON') {
+ coord = coord.slice(0, coord.length - 1);
+ } else if (obj.properties.id === 'CIRCLE') {
+ coord = [obj.properties.center];
+ }
+
+ return (
+
{
+ const allObj = drawObj
+ .getAll()
+ .features.filter(o => o.properties.id !== 'BUFFER');
+
+ drawObj.changeMode('direct_select', {
+ featureId: allObj[i].id
+ });
+ }}
+ >
+
+
비행구역 {i + 1}
+
+ {coord?.map((co, idx) => {
+ if (idx % 2 === 0) {
+ const fCoord = FormattingCoord(co);
+ const current = fCoord.join(', ');
+ if (idx !== coord.length - 1) {
+ const next = FormattingCoord(coord[idx + 1]).join(
+ ', '
+ );
+
+ return (
+
+
+ {current}
+ /
+ {next}
+
+
+ );
} else {
- return null;
+ return (
+
+
+ {current}
+
+
+ );
}
- })}
-
+ } else {
+ return null;
+ }
+ })}
- );
- })}
-
- ) : null}
+
+
+ );
+ })}
+
- {modal ? (
+ {/* {modal ? (
- ) : null}
+ ) : null} */}
>
) : null}
diff --git a/src/components/laanc/map/LaancDrawControl.js b/src/components/laanc/map/LaancDrawControl.js
index ea6dddc..abba619 100644
--- a/src/components/laanc/map/LaancDrawControl.js
+++ b/src/components/laanc/map/LaancDrawControl.js
@@ -357,8 +357,10 @@ export const LaancDrawControl = props => {
const remainObj = drawObj
.getAll()
.features.filter(o => o.properties.id !== 'BUFFER' && o.id !== id);
+
if (remainObj.length === 0) {
props.handlerSaveCheck(false);
+ dispatch(drawTypeChangeAction('RESET'));
} else {
props.handlerSaveCheck(true);
}
diff --git a/src/components/map/mapbox/draw/LaancModal.js b/src/components/laanc/map/LaancDrawModal.js
similarity index 93%
rename from src/components/map/mapbox/draw/LaancModal.js
rename to src/components/laanc/map/LaancDrawModal.js
index c3761dc..c97c27d 100644
--- a/src/components/map/mapbox/draw/LaancModal.js
+++ b/src/components/laanc/map/LaancDrawModal.js
@@ -1,6 +1,6 @@
import { Button, Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
-export default function LaancModal({ modal, handler }) {
+export default function LaancDrawModal({ modal, handler }) {
const handlerDroneOneStop = () => {
window.open('https://drone.onestop.go.kr/', '드론원스탑');
handler();
diff --git a/src/views/statistics/FlightView.js b/src/views/statistics/FlightView.js
index 950ff29..fc1d41e 100644
--- a/src/views/statistics/FlightView.js
+++ b/src/views/statistics/FlightView.js
@@ -7,20 +7,182 @@ import {
Col,
Row,
Card,
+ CardHeader,
+ CardTitle,
CardBody,
FormGroup,
Input,
CustomInput,
Label
} from 'reactstrap';
-import { Search } from 'react-feather';
+import {
+ Search,
+ Calendar,
+ Monitor,
+ Tablet,
+ ArrowDown,
+ ArrowUp
+} from 'react-feather';
import { FcAlarmClock, FcWorkflow, FcBarChart } from 'react-icons/fc';
+import { Bar, Doughnut, Polar } from 'react-chartjs-2';
+import Flatpickr from 'react-flatpickr';
-export default function Flight() {
+export default function Flight({
+ tooltipShadow,
+ gridLineColor,
+ labelColor,
+ successColorShade,
+ warningLightColor,
+ primary
+}) {
const titleName = '비행 통계';
+ const options = {
+ elements: {
+ rectangle: {
+ borderWidth: 2,
+ borderSkipped: 'bottom'
+ }
+ },
+ responsive: true,
+ maintainAspectRatio: false,
+ responsiveAnimationDuration: 500,
+ legend: {
+ display: false
+ },
+ tooltips: {
+ // Updated default tooltip UI
+ shadowOffsetX: 1,
+ shadowOffsetY: 1,
+ shadowBlur: 8,
+ shadowColor: tooltipShadow,
+ backgroundColor: '#fff',
+ titleFontColor: '#000',
+ bodyFontColor: '#000'
+ },
+ scales: {
+ xAxes: [
+ {
+ display: true,
+ gridLines: {
+ display: true,
+ color: gridLineColor,
+ zeroLineColor: gridLineColor
+ },
+ scaleLabel: {
+ display: false
+ },
+ ticks: {
+ fontColor: labelColor
+ }
+ }
+ ],
+ yAxes: [
+ {
+ display: true,
+ gridLines: {
+ color: gridLineColor,
+ zeroLineColor: gridLineColor
+ },
+ ticks: {
+ stepSize: 100,
+ min: 0,
+ max: 400,
+ fontColor: labelColor
+ }
+ }
+ ]
+ }
+ },
+ data = {
+ labels: [
+ '7/12',
+ '8/12',
+ '9/12',
+ '10/12',
+ '11/12',
+ '12/12',
+ '13/12',
+ '14/12',
+ '15/12',
+ '16/12',
+ '17/12'
+ ],
+ datasets: [
+ {
+ data: [275, 90, 190, 205, 125, 85, 55, 87, 127, 150, 230, 280, 190],
+ backgroundColor: '#00bcd4',
+ borderColor: '#00bcd4',
+ barThickness: 15
+ }
+ ]
+ };
+
+ const options2 = {
+ responsive: true,
+ maintainAspectRatio: true,
+ responsiveAnimationDuration: 500,
+ cutoutPercentage: 60,
+ legend: {
+ position: 'bottom',
+ labels: {
+ usePointStyle: true,
+ padding: 18,
+ boxWidth: 8,
+ fontColor: labelColor,
+ fontSize: 14,
+ fontWeight: 500,
+ fontFamily: ['Rubik', 'Montserrat', 'NotoSansKR']
+ }
+ },
+ tooltips: {
+ callbacks: {
+ label(tooltipItem, data) {
+ const label = data.datasets[0].labels[tooltipItem.index] || '',
+ value = data.datasets[0].data[tooltipItem.index];
+ const output = ` ${label} : ${value} %`;
+ return output;
+ }
+ },
+ shadowOffsetX: 1,
+ shadowOffsetY: 1,
+ shadowBlur: 8,
+ shadowColor: tooltipShadow,
+ backgroundColor: '#fff',
+ titleFontColor: '#000',
+ bodyFontColor: '#000'
+ }
+ },
+ data2 = {
+ labels: ['PA0001', 'PA0002', 'PA0003', 'PA0004', 'PA0005'],
+ datasets: [
+ {
+ labels: ['PA0001', 'PA0002', 'PA0003', 'PA0004', 'PA0005'],
+ data: [10, 20, 30, 40, 80],
+ //레드버전
+ // backgroundColor: [
+ // '#ffe8d1',
+ // '#ffb59e',
+ // '#f0826b',
+ // '#Bd4f38',
+ // '#8a1c05'
+ // ],
+
+ backgroundColor: [
+ '#ccffff',
+ '#99ffff',
+ '#66ffff',
+ '#33efff',
+ '#00bcd4'
+ ],
+ borderWidth: 0,
+ pointStyle: 'rectRounded'
+ }
+ ]
+ };
+
return (
-
+
@@ -160,6 +322,90 @@ export default function Flight() {
+
+
+
+
+
+ 비행 시간 통계
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {/*
+
*/}
+
+
+
+
+
+
+
+
+
+
+
+
+ 비행시간 TOP5
+
+
+
+
+
+ {/* */}
+
+
+
+
+
);