layer-content 수정

src/components/flight/NewFlightApprovalsReport.js

@@ -37,125 +37,128 @@ export default function NewFlightApprovalsReport(props) {
   };
 
   return (
-    <div className='layer-content' onDragEnd={props.handleDragEnd} draggable>
+    <>
-      <div className='layer-ti'>
+      <div className='layer-content'>
-        <h4>비행승인 신청 검토결과 현황</h4>
+        <div className='layer-ti'>
-      </div>
+          <h4>비행승인 신청 검토결과 현황</h4>
-      <div className='layer-ti-sub'>
-        검색일자 또는 신청번호/검토결과를 입력해주세요.
-      </div>
-      <div className='layer-search layer-search-form'>
-        <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>
-        <div className='layer-content'>
+        <div className='layer-ti-sub'>
-          <div className='layer-ti'>
+          검색일자 또는 신청번호/검토결과를 입력해주세요.
-            <h4>지역</h4>
+        </div>
-          </div>
+        <div className='layer-search layer-search-form'>
           <div className='input-n'>
             <div className='list-input'>
-              <CustomInput
+              <div className='calendar-flat'>
-                type='select'
+                <Flatpickr
-                id='filterArea'
+                  placeholder='날짜를 선택해주세요'
-                bsSize='sm'
+                  id='searchDate'
-                value={props.filterArea.ctprvn}
+                  options={{
-                onChange={e =>
+                    mode: 'range',
-                  props.setFilterArea({
+                    defaultDate: [searchDate.startDate, searchDate.endDate]
-                    ...props.filterArea,
+                  }}
-                    ctprvn: e.target.value,
+                  onChange={date => {
-                    sig: '전체'
+                    setSearchDate({
-                  })
+                      startDate: dayjs(date[0]).format('YYYY-MM-DD'),
-                }
+                      endDate: dayjs(date[1]).format('YYYY-MM-DD')
-              >
+                    });
-                {Object.values(CityCategories).map(city => (
+                  }}
-                  <option key={city} value={city}>
+                  className='form-control flat-picker bg-transparent border-0 shadow-none'
-                    {city}
+                />
-                  </option>
+                <Calendar size={14} />
-                ))}
+              </div>
-              </CustomInput>
-            </div>
-            <div className='list-input'>
-              <CustomInput
-                type='select'
-                id='district'
-                bsSize='sm'
-                value={props.filterArea.sig}
-                onChange={e =>
-                  props.setFilterArea({
-                    ...props.filterArea,
-                    sig: e.target.value
-                  })
-                }
-              >
-                {DistrictCategories[props.filterArea.ctprvn]?.map(district => (
-                  <option key={district} value={district}>
-                    {district}
-                  </option>
-                ))}
-              </CustomInput>
             </div>
             <div className='list-input'>
               <Input
                 type='text'
                 bsSize='sm'
-                placeholder='주소를 입력해주세요.'
+                placeholder='신청번호 또는 검토결과를 입력해주세요.'
-                value={props.filterArea.address}
+                value={props.filterId}
-                onChange={e =>
+                onChange={e => props.setFilterId(e.target.value)}
-                  props.setFilterArea({
-                    ...props.filterArea,
-                    address: e.target.value
-                  })
-                }
                 onKeyPress={handleKeyDown}
               />
             </div>
-            <div className='list-input list-input-btn'>
-              <Button
-                color='primary'
-                onClick={() =>
-                  props.handlerSearch(
-                    props.filterId,
-                    searchDate,
-                    props.filterArea
-                  )
-                }
-                size='sm'
-              >
-                검색
-              </Button>
-            </div>
           </div>
         </div>
       </div>
-    </div>
+
+      <div className='layer-content'>
+        <div className='layer-ti'>
+          <h4>지역</h4>
+        </div>
+        <div className='input-n'>
+          <div className='list-input'>
+            <CustomInput
+              type='select'
+              id='filterArea'
+              bsSize='sm'
+              value={props.filterArea.ctprvn}
+              onChange={e =>
+                props.setFilterArea({
+                  ...props.filterArea,
+                  ctprvn: e.target.value,
+                  sig: '전체'
+                })
+              }
+            >
+              {Object.values(CityCategories).map(city => (
+                <option key={city} value={city}>
+                  {city}
+                </option>
+              ))}
+            </CustomInput>
+          </div>
+          <div className='list-input'>
+            <CustomInput
+              type='select'
+              id='district'
+              bsSize='sm'
+              value={props.filterArea.sig}
+              onChange={e =>
+                props.setFilterArea({
+                  ...props.filterArea,
+                  sig: e.target.value
+                })
+              }
+            >
+              {DistrictCategories[props.filterArea.ctprvn]?.map(district => (
+                <option key={district} value={district}>
+                  {district}
+                </option>
+              ))}
+            </CustomInput>
+          </div>
+          <div className='list-input'>
+            <Input
+              type='text'
+              bsSize='sm'
+              placeholder='주소를 입력해주세요.'
+              value={props.filterArea.address}
+              onChange={e =>
+                props.setFilterArea({
+                  ...props.filterArea,
+                  address: e.target.value
+                })
+              }
+              onKeyPress={handleKeyDown}
+            />
+          </div>
+          <div className='list-input list-input-btn'>
+            <Button
+              color='primary'
+              onClick={() =>
+                props.handlerSearch(
+                  props.filterId,
+                  searchDate,
+                  props.filterArea
+                )
+              }
+              size='sm'
+            >
+              검색
+            </Button>
+          </div>
+        </div>
+      </div>
+    </>
   );
 }

src/containers/flight/ControlApprovalsContainer.js

@@ -688,7 +688,7 @@ export default function ControlApprovalsContainer({ mode }) {
             className='right-layer active flight-approval-layer'
             ref={rightMenuRef}
           >
-            <div className='layer-content'>
+            <div className='' onDragEnd={handleDragEnd} draggable>
               <NewFlightApprovalsReport
                 handlerSearch={handlerSearch}
                 handleDragEnd={handleDragEnd}

src/containers/flight/OperationApprovalsContainer.js

@@ -779,7 +779,7 @@ export default function OperationApprovalsContainer({ mode }) {
             className='right-layer active flight-approval-layer'
             ref={rightMenuRef}
           >
-            <div className='layer-content'>
+            <div className='' onDragEnd={handleDragEnd} draggable>
               <NewFlightApprovalsReport
                 handlerSearch={handlerSearch}
                 handleDragEnd={handleDragEnd}