상단수정

src/assets/css/custom.css

@@ -1271,4 +1271,7 @@ caption {overflow: hidden; line-height: 0;text-indent: -2000px;}
 .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}
+.distance-check .text p .finish{display:block;margin-top:-4px;font-weight:400;color:#0090d8}
+
+.list-input .form-group label{font-size: .875rem;font-weight: 500;}
+.list-input .form-group{margin-bottom:0;}

src/components/flight/NewFlightApprovalsReport.js

@@ -1,6 +1,6 @@
 import { useState, useEffect, useRef } from 'react';
 import Flatpickr from 'react-flatpickr';
-import { Button, Input, CustomInput, Col, Row } from '@component/ui';
+import { Button, Input, CustomInput, Col, Row, FormGroup, Label } from '@component/ui';
 import { Search, Calendar } from 'react-feather';
 import dayjs from 'dayjs';
 import {
@@ -54,10 +54,9 @@ export default function NewFlightApprovalsReport(props) {
         <div className='input-n'>
           <div className='list-input'>
             <div className='layer-content'>
-              <div className='layer-ti'>
-                <h4>신청일자</h4>
-              </div>
-              <div className='calendar-flat'>
+              <FormGroup>
+                <Label for='searchDate'>신청일자</Label>
+                <div className='calendar-flat'>
                 <Flatpickr
                   ref={flatPickerRef}
                   placeholder='날짜를 선택해주세요'
@@ -76,49 +75,50 @@ export default function NewFlightApprovalsReport(props) {
                 />
                 <Calendar size={14} />
               </div>
+              </FormGroup>
             </div>
           </div>
 
           <div className='list-input'>
             <div className='layer-content'>
-              <div className='layer-ti'>
-                <h4>신청번호</h4>
-              </div>
-              <Input
-                type='text'
-                bsSize='sm'
-                placeholder='신청번호 또는 검토결과를 입력해주세요.'
-                value={props.filterId}
-                onChange={e => props.setFilterId(e.target.value)}
-                onKeyPress={handleKeyDown}
-              />
+              <FormGroup>
+                  <Label for=''>신청번호</Label>
+                  <Input
+                    type='text'
+                    bsSize='sm'
+                    placeholder='신청번호 또는 검토결과를 입력해주세요.'
+                    value={props.filterId}
+                    onChange={e => props.setFilterId(e.target.value)}
+                    onKeyPress={handleKeyDown}
+                  />
+                </FormGroup>
             </div>
           </div>
 
           <div className='list-input'>
             <div className='layer-content'>
-              <div className='layer-ti'>
-                <h4>검토결과</h4>
-              </div>
-              <CustomInput
-                type='select'
-                bsSize='sm'
-                id='reviewedType'
-                placeholder='확인결과를 입력해주세요.'
-                value={props.reviewedType}
-                onChange={e => props.setReviewedType(e.target.value)}
-                onKeyPress={handleKeyDown}
-              >
-                {Object.values(
-                  props.pageName === 'control'
-                    ? FlightCategory.Control
-                    : FlightCategory.Operation
-                ).map(item => (
-                  <option key={item} value={item}>
-                    {item}
-                  </option>
-                ))}
-              </CustomInput>
+             <FormGroup>
+                <Label for='reviewedType'>검토결과</Label>
+                <CustomInput
+                  type='select'
+                  bsSize='sm'
+                  id='reviewedType'
+                  placeholder='확인결과를 입력해주세요.'
+                  value={props.reviewedType}
+                  onChange={e => props.setReviewedType(e.target.value)}
+                  onKeyPress={handleKeyDown}
+                >
+                  {Object.values(
+                    props.pageName === 'control'
+                      ? FlightCategory.Control
+                      : FlightCategory.Operation
+                  ).map(item => (
+                    <option key={item} value={item}>
+                      {item}
+                    </option>
+                  ))}
+                </CustomInput>
+              </FormGroup>
             </div>
           </div>
         </div>