입력폼변경

src/assets/css/custom.css

@@ -1222,9 +1222,10 @@ caption {overflow: hidden; line-height: 0;text-indent: -2000px;}
 .flight-approval-layer .react-dataTable .rdt_TableHead .rdt_TableHeadRow{height:auto}
 .flight-approval-in-table .rdt_TableRow:last-child{border-bottom:1px solid rgba(0, 0, 0, .12);}
 
-.input-btn-2n{display:flex;}
-.input-btn-2n .list-input, .input-btn-2n .list-input-btn{flex:1}
-.input-btn-2n .list-input-btn{margin-left:1rem}
+.input-n{display:flex;}
+.input-n .list-input, .input-btn-n .list-input-btn{flex:1}
+.input-n .list-input + .list-input{margin-left:0.5rem}
+
 .search-download{display:flex;justify-content: space-between;align-items: baseline;margin-bottom:0.5rem}
 .search-download .search-case{margin-left:0;}
 .search-download .download button + button{margin-left:0.5rem}

src/components/flight/NewFlightApprovalsReport.js

@@ -40,43 +40,67 @@ export default function NewFlightApprovalsReport(props) {
         검색일자 또는 신청번호/검토결과를 입력해주세요.
       </div>
       <div className='layer-search layer-search-form'>
-        <div className='calendar-flat'>
-          <Flatpickr
-            placeholder='날짜를 선택해주세요'
-            id='searchDate'
-            options={{
-              mode: 'range',
-              defaultDate: [searchDate.startDate, searchDate.endDate]
-            }}
-            onChange={date => {
-              setSearchDate({
-                startDate: dayjs(date[0]).format('YYYY-MM-DD'),
-                endDate: dayjs(date[1]).format('YYYY-MM-DD')
-              });
-            }}
-            className='form-control flat-picker bg-transparent border-0 shadow-none'
-          />
-          <Calendar size={14} />
-        </div>
-        <div className='list-input'>
-          <Input
-            type='text'
-            bsSize='sm'
-            placeholder='신청번호 또는 검토결과를 입력해주세요.'
-            value={props.filterId}
-            onChange={e => props.setFilterId(e.target.value)}
-            onKeyPress={handleKeyDown}
-          />
+        <div className='input-n'>
+          <div className='list-input'>
+            <div className='calendar-flat'>
+              <Flatpickr
+                placeholder='날짜를 선택해주세요'
+                id='searchDate'
+                options={{
+                  mode: 'range',
+                  defaultDate: [searchDate.startDate, searchDate.endDate]
+                }}
+                onChange={date => {
+                  setSearchDate({
+                    startDate: dayjs(date[0]).format('YYYY-MM-DD'),
+                    endDate: dayjs(date[1]).format('YYYY-MM-DD')
+                  });
+                }}
+                className='form-control flat-picker bg-transparent border-0 shadow-none'
+              />
+              <Calendar size={14} />
+            </div>
+          </div>
+          <div className='list-input'>
+            <Input
+              type='text'
+              bsSize='sm'
+              placeholder='신청번호 또는 검토결과를 입력해주세요.'
+              value={props.filterId}
+              onChange={e => props.setFilterId(e.target.value)}
+              onKeyPress={handleKeyDown}
+            />
+          </div>
+          <div className='list-input'>
+            <Input
+              type='text'
+              bsSize='sm'
+              placeholder='주소를 입력해주세요.'
+              value={props.filterId}
+              onChange={e => props.setFilterId(e.target.value)}
+              onKeyPress={handleKeyDown}
+            />
+          </div>
         </div>
-
         <div className='layer-content'>
           <div className='layer-ti'>
             <h4>지역</h4>
           </div>
-          <div className='input-btn-2n'>
+          <div className='input-n'>
+            <div className='list-input'>
+              <CustomInput
+                type='select'
+                id='filterArea'
+                bsSize='sm'
+                value={props.filterArea}
+                onChange={e => props.setFilterArea(e.target.value)}
+              >
+                <option value=''>전체</option>
+                <option value='gimpo'>김포공항 관제권</option>
+              </CustomInput>
+            </div>
             <div className='list-input'>
               <CustomInput
-                inline
                 type='select'
                 id='filterArea'
                 bsSize='sm'
@@ -87,7 +111,7 @@ export default function NewFlightApprovalsReport(props) {
                 <option value='gimpo'>김포공항 관제권</option>
               </CustomInput>
             </div>
-            <div className='list-input-btn'>
+            <div className='list-input list-input-btn'>
               <Button
                 color='primary'
                 onClick={() =>