메인 수정

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;}

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'>
+      <CardHeader className=''>
-        <CardTitle tag='h4'>{titles[`${props.title}`]}</CardTitle>
+        <div className='w-100 d-flex justify-content-between'>
-        {/* <div className='d-flex align-items-center'>
+          <CardTitle tag='h4'>{titles[`${props.title}`]}</CardTitle>
-          <Calendar size={14} />
+          {/* <div className='d-flex align-items-center'>
-          <Flatpickr
+            <Calendar size={14} />
-              options={{
+            <Flatpickr
-              mode: 'single',
+                options={{
-              dateFormat: "Y-m-d",
+                mode: 'single',
-              defaultDate: ['today'],
+                dateFormat: "Y-m-d",
-            }}
+                defaultDate: ['today'],
-            className='form-control flat-picker bg-transparent border-0 shadow-none'
+              }}
-          />
+              className='form-control flat-picker bg-transparent border-0 shadow-none'
-        </div> */}
+            />
-        {props.title === 'flightsRegion' && (
+          </div> */}
-          <>
+          <div className='d-flex align-items-center'>
-            <div className='datepicker-border-sm'>
+            {props.title === 'flightsRegion' && (
-              <div className='datepicker-custom'>
+              <>
-                <Calendar size={14} />
+                <div className='datepicker-border-sm'>
-                <DatePicker
+                  <div className='datepicker-custom'>
-                  locale={ko}
+                    <Calendar size={14} />
-                  selected={props.startDate}
+                    <DatePicker
-                  onChange={date => props.setStartDate(date)}
+                      locale={ko}
-                  dateFormat='yyy / MMMM'
+                      selected={props.startDate}
-                  showMonthYearPicker
+                      onChange={date => props.setStartDate(date)}
-                  showFullMonthYearPicker
+                      dateFormat='yyy / MMMM'
-                  showFourColumnMonthYearPicker
+                      showMonthYearPicker
-                  className='form-control bg-transparent border-0 shadow-none'
+                      showFullMonthYearPicker
-                />
+                      showFourColumnMonthYearPicker
-              </div>
+                      className='form-control bg-transparent border-0 shadow-none'
-            </div>
+                    />
-            <button onClick={e => {}}>
+                  </div>
-              <Plus />
+                </div>
-            </button>
+                <button onClick={e => {}} style={{ marginLeft: '8px' }}>
-          </>
+                  <Plus />
-        )}
+                </button>
+              </>
+            )}
+          </div>
+        </div>
       </CardHeader>
       <CardBody>
         <div style={{ height: '275px' }}>

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='w-100 d-flex justify-content-between'>
-        <div className='datepicker-border-sm'>
+          <CardTitle tag='h4'>일 별 비행횟수 통계</CardTitle>
-          <div className='datepicker-custom'>
+          <div className='d-flex align-items-center'>
-            <Calendar size={14} />
+            <div className='datepicker-border-sm'>
-            <DatePicker
+              <div className='datepicker-custom'>
-              locale={ko}
+                <Calendar size={14} />
-              selected={startDate}
+                <DatePicker
-              onChange={date => setStartDate(date)}
+                  locale={ko}
-              dateFormat='yyy / MMMM'
+                  selected={startDate}
-              showMonthYearPicker
+                  onChange={date => setStartDate(date)}
-              showFullMonthYearPicker
+                  dateFormat='yyy / MMMM'
-              showFourColumnMonthYearPicker
+                  showMonthYearPicker
-              className='form-control bg-transparent border-0 shadow-none'
+                  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' }}>

src/components/dashboard/DroneFlightSchedule.js

@@ -77,15 +77,17 @@ export default function DroneFlightSchedule({ pageMove, data }) {
   return (
     <Card>
       <CardHeader className=''>
-        <CardTitle tag='h4'>드론 별 비행운항 목록</CardTitle>
+        <div className='w-100 d-flex justify-content-between'>
-        <Col className='list-input' xs='2'>
+          <CardTitle tag='h4'>드론 별 비행운항 목록</CardTitle>
-          <Input type='select'>
+          <div className='d-flex align-items-center'>
-            <option>그룹선택</option>
+            <Input type='select' size='sm' style={{ minWidth: '120px' }}>
-          </Input>
+              <option>그룹선택</option>
-          <button onClick={e => {}}>
+            </Input>
-            <Plus />
+            <button onClick={e => {}} style={{ marginLeft: '8px' }}>
-          </button>
+              <Plus />
-        </Col>
+            </button>
+          </div>
+        </div>
       </CardHeader>
       <CardBody>
         <GridDatabase