From 024b2ff177922e70f3158b438bdef2690964e487 Mon Sep 17 00:00:00 2001
From: geun <1416geun@naver.com>
Date: Fri, 12 Jul 2024 14:28:05 +0900
Subject: [PATCH] =?UTF-8?q?=EC=B8=A1=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/css/custom.css                     |  6 +++++
 .../flight/OperationApprovalsContainer.js     | 25 ++++++++++++++++++-
 2 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/src/assets/css/custom.css b/src/assets/css/custom.css
index b7018934..427374f9 100644
--- a/src/assets/css/custom.css
+++ b/src/assets/css/custom.css
@@ -1266,3 +1266,9 @@ caption {overflow: hidden; line-height: 0;text-indent: -2000px;}
 .pal-table-warp .success{color:#0090d8;font-weight:400;}
 .pal-table-warp .fail{color:#ed1125;font-weight:400;}
 
+.distance-check .btn-box{margin-top:6px}
+.distance-check .btn-box button + button{margin-left:0.4rem}
+.distance-check .btn-box .btn-icon:hover{box-shadow:none;}
+.distance-check .text{margin-top:6px}
+.distance-check .text p{font-weight:400;}
+.distance-check .text p .finish{display:block;margin-top:-4px;font-weight:400;color:#0090d8}
\ No newline at end of file
diff --git a/src/containers/flight/OperationApprovalsContainer.js b/src/containers/flight/OperationApprovalsContainer.js
index 6edc0313..c2bf536a 100644
--- a/src/containers/flight/OperationApprovalsContainer.js
+++ b/src/containers/flight/OperationApprovalsContainer.js
@@ -37,7 +37,8 @@ import {
   ModalFooter,
   Table
 } from '@component/ui';
-import { FiUsers, FiFileText } from 'react-icons/fi';
+import { FiUsers, FiFileText, FiRotateCw, FiCornerUpLeft  } from 'react-icons/fi';
+import { X } from 'react-feather'
 
 import mapboxgl from 'mapbox-gl';
 import * as turf from '@turf/turf';
@@ -726,6 +727,28 @@ export default function OperationApprovalsContainer({ mode }) {
                   </ButtonGroup>
                 </div>
               </div>
+              <div className='data-box-btn-list'>
+                <h4>측정</h4>
+                <div className='distance-check'>
+                  <div class='btn-box'>
+                    <Button className='btn-icon rounded-circle' color='primary' size='sm'>
+                      <FiRotateCw size={16} />
+                    </Button>
+                    <Button className='btn-icon rounded-circle' color='primary' size='sm'>
+                      <FiCornerUpLeft  size={16} />
+                    </Button>
+                    <Button className='btn-icon rounded-circle' color='dark' size='sm'>
+                      <X size={16} />
+                    </Button>
+                  </div>
+                  <div className='text'>
+                    <p>
+                      지도에서 지점을 클릭하여 거리를 측정하세요.
+                      <span className='finish'>총 거리 : 1050.24m</span>
+                    </p>
+                  </div>
+                </div>
+              </div>
             </Card>
           </div>
         </div>