From 6c54019bfc95a1138fcf898a77fdfb09925cc451 Mon Sep 17 00:00:00 2001
From: geun <1416geun@naver.com>
Date: Thu, 16 Nov 2023 17:04:29 +0900
Subject: [PATCH] =?UTF-8?q?=EB=A9=94=EC=9D=B8=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/css/custom.css                     |  4 +-
 src/components/dashboard/DashboardStcsArea.js | 74 ++++++++++---------
 src/components/dashboard/DashboardStcsDay.js  | 38 +++++-----
 .../dashboard/DroneFlightSchedule.js          | 20 ++---
 4 files changed, 74 insertions(+), 62 deletions(-)

diff --git a/src/assets/css/custom.css b/src/assets/css/custom.css
index 5f5ada2..0cca245 100644
--- a/src/assets/css/custom.css
+++ b/src/assets/css/custom.css
@@ -352,6 +352,7 @@ h1.logo span{display:block;color:#8a1c05;font-weight:bold;letter-spacing:2px;fon
   }
   
 /*메인 대시보드*/
+.main-dashboard{padding-bottom:2rem}
 .main-dashboard .card{margin-bottom:0px;}
 .dashboard-section + .dashboard-section{margin-top:2rem;}
 .menu-page div{height:120px;}
@@ -362,8 +363,9 @@ h1.logo span{display:block;color:#8a1c05;font-weight:bold;letter-spacing:2px;fon
 .menu-list04{background:url('../../assets/images/menu004.png')#ddd;background-size:cover;background-position:50% 50%;}
 .dashboard-list-ti{font-weight: 500;font-size: 1.285rem;font-size:1.125rem;border-bottom:1px solid #404656;margin:0 1rem;padding:1rem;}
 .dashboard-list-ti svg{margin-top:-3px;margin-right:10px;}
-.dashboard-list-cont .card{padding:1rem;}
+.dashboard-list-cont .card{padding:1rem}
 .dashboard-section .card-header svg{color:#bbb;}
+.dashboard-section .card{min-height:265px}
 .dashboard-chart .card{height:520px;}
 .dashboard-chart .card .card-title{margin:10px 0;}
 .doughnut-chart-list{display: flex;flex-wrap: wrap;justify-content: space-evenly;margin-top:4rem;margin-bottom:1rem;}
diff --git a/src/components/dashboard/DashboardStcsArea.js b/src/components/dashboard/DashboardStcsArea.js
index 8aa727d..195e6b5 100644
--- a/src/components/dashboard/DashboardStcsArea.js
+++ b/src/components/dashboard/DashboardStcsArea.js
@@ -92,41 +92,45 @@ export const DashboardStcsArea = props => {
 
   return (
     <Card>
-      <CardHeader className='d-flex justify-content-between align-items-sm-center align-items-start flex-sm-row flex-column'>
-        <CardTitle tag='h4'>{titles[`${props.title}`]}</CardTitle>
-        {/* <div className='d-flex align-items-center'>
-          <Calendar size={14} />
-          <Flatpickr
-              options={{
-              mode: 'single',
-              dateFormat: "Y-m-d",
-              defaultDate: ['today'],
-            }}
-            className='form-control flat-picker bg-transparent border-0 shadow-none'
-          />
-        </div> */}
-        {props.title === 'flightsRegion' && (
-          <>
-            <div className='datepicker-border-sm'>
-              <div className='datepicker-custom'>
-                <Calendar size={14} />
-                <DatePicker
-                  locale={ko}
-                  selected={props.startDate}
-                  onChange={date => props.setStartDate(date)}
-                  dateFormat='yyy / MMMM'
-                  showMonthYearPicker
-                  showFullMonthYearPicker
-                  showFourColumnMonthYearPicker
-                  className='form-control bg-transparent border-0 shadow-none'
-                />
-              </div>
-            </div>
-            <button onClick={e => {}}>
-              <Plus />
-            </button>
-          </>
-        )}
+      <CardHeader className=''>
+        <div className='w-100 d-flex justify-content-between'>
+          <CardTitle tag='h4'>{titles[`${props.title}`]}</CardTitle>
+          {/* <div className='d-flex align-items-center'>
+            <Calendar size={14} />
+            <Flatpickr
+                options={{
+                mode: 'single',
+                dateFormat: "Y-m-d",
+                defaultDate: ['today'],
+              }}
+              className='form-control flat-picker bg-transparent border-0 shadow-none'
+            />
+          </div> */}
+          <div className='d-flex align-items-center'>
+            {props.title === 'flightsRegion' && (
+              <>
+                <div className='datepicker-border-sm'>
+                  <div className='datepicker-custom'>
+                    <Calendar size={14} />
+                    <DatePicker
+                      locale={ko}
+                      selected={props.startDate}
+                      onChange={date => props.setStartDate(date)}
+                      dateFormat='yyy / MMMM'
+                      showMonthYearPicker
+                      showFullMonthYearPicker
+                      showFourColumnMonthYearPicker
+                      className='form-control bg-transparent border-0 shadow-none'
+                    />
+                  </div>
+                </div>
+                <button onClick={e => {}} style={{ marginLeft: '8px' }}>
+                  <Plus />
+                </button>
+              </>
+            )}
+          </div>
+        </div>
       </CardHeader>
       <CardBody>
         <div style={{ height: '275px' }}>
diff --git a/src/components/dashboard/DashboardStcsDay.js b/src/components/dashboard/DashboardStcsDay.js
index 50cb0e9..559b9bd 100644
--- a/src/components/dashboard/DashboardStcsDay.js
+++ b/src/components/dashboard/DashboardStcsDay.js
@@ -103,25 +103,29 @@ export const DashboardStcsDay = ({ startDate, setStartDate, data }) => {
   return (
     <Card>
       <CardHeader className='d-flex justify-content-between align-items-sm-center align-items-start flex-sm-row flex-column'>
-        <CardTitle tag='h4'>일 별 비행횟수 통계</CardTitle>
-        <div className='datepicker-border-sm'>
-          <div className='datepicker-custom'>
-            <Calendar size={14} />
-            <DatePicker
-              locale={ko}
-              selected={startDate}
-              onChange={date => setStartDate(date)}
-              dateFormat='yyy / MMMM'
-              showMonthYearPicker
-              showFullMonthYearPicker
-              showFourColumnMonthYearPicker
-              className='form-control bg-transparent border-0 shadow-none'
-            />
+        <div className='w-100 d-flex justify-content-between'>
+          <CardTitle tag='h4'>일 별 비행횟수 통계</CardTitle>
+          <div className='d-flex align-items-center'>
+            <div className='datepicker-border-sm'>
+              <div className='datepicker-custom'>
+                <Calendar size={14} />
+                <DatePicker
+                  locale={ko}
+                  selected={startDate}
+                  onChange={date => setStartDate(date)}
+                  dateFormat='yyy / MMMM'
+                  showMonthYearPicker
+                  showFullMonthYearPicker
+                  showFourColumnMonthYearPicker
+                  className='form-control bg-transparent border-0 shadow-none'
+                />
+              </div>
+            </div>
+            <button onClick={e => {}} style={{ marginLeft: '8px' }}>
+              <Plus />
+            </button>
           </div>
         </div>
-        <button onClick={e => {}}>
-          <Plus />
-        </button>
       </CardHeader>
       <CardBody>
         <div style={{ height: '400px' }}>
diff --git a/src/components/dashboard/DroneFlightSchedule.js b/src/components/dashboard/DroneFlightSchedule.js
index 067cf95..98f3b7f 100644
--- a/src/components/dashboard/DroneFlightSchedule.js
+++ b/src/components/dashboard/DroneFlightSchedule.js
@@ -77,15 +77,17 @@ export default function DroneFlightSchedule({ pageMove, data }) {
   return (
     <Card>
       <CardHeader className=''>
-        <CardTitle tag='h4'>드론 별 비행운항 목록</CardTitle>
-        <Col className='list-input' xs='2'>
-          <Input type='select'>
-            <option>그룹선택</option>
-          </Input>
-          <button onClick={e => {}}>
-            <Plus />
-          </button>
-        </Col>
+        <div className='w-100 d-flex justify-content-between'>
+          <CardTitle tag='h4'>드론 별 비행운항 목록</CardTitle>
+          <div className='d-flex align-items-center'>
+            <Input type='select' size='sm' style={{ minWidth: '120px' }}>
+              <option>그룹선택</option>
+            </Input>
+            <button onClick={e => {}} style={{ marginLeft: '8px' }}>
+              <Plus />
+            </button>
+          </div>
+        </div>
       </CardHeader>
       <CardBody>
         <GridDatabase