fix, refactor:

- 기본검색 하수관로의 Input 컴포넌트 변수 중복 에러 수정
- 운영정보 검색 테이블 개수 5개로 수정

apps/sn/app/(map-layout)/map/searchModal/basicTab.tsx

@@ -102,12 +102,16 @@ const BasicTab: React.FC<BasicTabProps> = ({
           var1={var1}
           var2={var2}
           start1={start1}
+          start2={start2}
           end1={end1}
+          end2={end2}
           yearFilter={yearFilter}
           setVar1={setVar1}
           setVar2={setVar2}
           setStart1={setStart1}
+          setStart2={setStart2}
           setEnd1={setEnd1}
+          setEnd2={setEnd2}
           setYearFilter={setYearFilter}
           handleSearch={handleSearch}
         />

apps/sn/app/(map-layout)/map/searchModal/searchModal.tsx

@@ -225,7 +225,7 @@ const SearchModal: React.FC<SearchModalProps> = ({
       } else if (activeTab === 'operation') {
         const RequestDTO: Record<string, string> = {
           page: `${curPage - 1}`,
-          size: '4',
+          size: '5',
         };
         if (var1) RequestDTO.bizNm = var1;
         if (var2 != '0' && var2) RequestDTO.bizTyCd = var2;
@@ -261,7 +261,7 @@ const SearchModal: React.FC<SearchModalProps> = ({
           const matched = BIZ_TY_CD.find(code => code.lwpoCd === item.bizTyCd);
           return {
             ...formattedItem,
-            rowNumber: (curPage - 1) * 4 + index + 1, // 1부터 시작하는 일련번호 추가
+            rowNumber: (curPage - 1) * 5 + index + 1, // 1부터 시작하는 일련번호 추가
             bizTyCd: matched ? matched.lwpoCdNm : item.bizTyCd,
           };
         });
@@ -472,8 +472,8 @@ const SearchModal: React.FC<SearchModalProps> = ({
       try {
         const RequestDTO: Record<string, string> = {
           page: `${detailCurPage - 1}`,
-          size: '4',
-          bizId: tableData[index % 4].bizId,
+          size: '5',
+          bizId: tableData[index % 5].bizId,
         };
 
         RequestDTO.workTypes = JSON.parse(workType.replace(/'/g, '"'));
@@ -490,7 +490,7 @@ const SearchModal: React.FC<SearchModalProps> = ({
           const mqltCdObj = MS_SWAGE_PPL_CODES.find(code => code.val === item.mqltCd.trim());
           return {
             ...formattedItem,
-            rowNumber: (detailCurPage - 1) * 4 + detailIndex + 1,
+            rowNumber: (detailCurPage - 1) * 5 + detailIndex + 1,
             usgCd: usgCdObj ? usgCdObj.text : item.usgCd,
             mqltCd: mqltCdObj ? mqltCdObj.text : item.mqltCd,
           };
@@ -516,7 +516,7 @@ const SearchModal: React.FC<SearchModalProps> = ({
       try {
         const RequestDTO: Record<string, string> = {
           page: `${detailCurPage - 1}`,
-          size: '4',
+          size: '5',
           bizId: String(detailBizId),
         };
         const res = await getData(`v1/bizInfo/fclts?${new URLSearchParams(RequestDTO).toString()}`);
@@ -528,7 +528,7 @@ const SearchModal: React.FC<SearchModalProps> = ({
           const mqltCdObj = MS_SWAGE_PPL_CODES.find(code => code.val === item.mqltCd.trim());
           return {
             ...formattedItem,
-            rowNumber: (detailCurPage - 1) * 4 + detailIndex + 1,
+            rowNumber: (detailCurPage - 1) * 5 + detailIndex + 1,
             usgCd: usgCdObj ? usgCdObj.text : item.usgCd,
             mqltCd: mqltCdObj ? mqltCdObj.text : item.mqltCd,
           };
@@ -648,7 +648,7 @@ const SearchModal: React.FC<SearchModalProps> = ({
                 }
                 tableData={tableData}
                 headlist={dynamicHeadlist}
-                pageSize={4}
+                pageSize={5}
                 total={tableCount}
                 cellClick={handleOperationCellClick}
                 onPageChange={setCurPage}
@@ -671,7 +671,7 @@ const SearchModal: React.FC<SearchModalProps> = ({
                 }
                 tableData={detailTableData}
                 headlist={dynamicHeadlist2}
-                pageSize={4}
+                pageSize={5}
                 total={detailTableCount}
                 cellClick={undefined}
                 onPageChange={setDetailCurPage}

apps/sn/app/(map-layout)/map/searchModal/swagePpl.tsx

@@ -10,12 +10,16 @@ interface SwagePplProps {
   var1: string;
   var2: string;
   start1: string;
+  start2: string;
   end1: string;
+  end2: string;
   yearFilter: { start: string; end: string };
   setVar1: (value: string) => void;
   setVar2: (value: string) => void;
   setStart1: (value: string) => void;
+  setStart2: (value: string) => void;
   setEnd1: (value: string) => void;
+  setEnd2: (value: string) => void;
   setYearFilter: (filter: { start: string; end: string }) => void;
   handleSearch: () => void;
 }
@@ -24,12 +28,16 @@ const SwagePpl: React.FC<SwagePplProps> = ({
   var1,
   var2,
   start1,
+  start2,
   end1,
+  end2,
   yearFilter,
   setVar1,
   setVar2,
   setStart1,
+  setStart2,
   setEnd1,
+  setEnd2,
   setYearFilter,
   handleSearch,
 }) => {
@@ -79,41 +87,6 @@ const SwagePpl: React.FC<SwagePplProps> = ({
         />
         {/* 관경 */}
         <Label className="text-xl text-gray-600 font-medium whitespace-nowrap mr-2">관경(mm)</Label>
-        <Input
-          className="w-[60px] !text-xl placeholder:text-center"
-          placeholder="입력"
-          value={var1}
-          onChange={(e) => {
-            // 숫자만 입력 허용
-            const val = e.target.value.replace(/[^0-9]/g, "");
-            setVar1(val);
-          }}
-          onKeyDown={(e) => {
-            if (e.key === 'Enter') {
-              e.preventDefault(); // Enter 키 기본 동작 방지
-              handleSearch();
-            }
-          }}
-        />
-        <span className="mx-2 text-xl font-semibold">~</span>
-        <Input
-          className="mr-8 w-[60px] !text-xl placeholder:text-center"
-          placeholder="입력"
-          value={end1}
-          onChange={(e) => {
-            // 숫자만 입력 허용
-            const val = e.target.value.replace(/[^0-9]/g, "");
-            setEnd1(val);
-          }}
-          onKeyDown={(e) => {
-            if (e.key === 'Enter') {
-              e.preventDefault(); // Enter 키 기본 동작 방지
-              handleSearch();
-            }
-          }}
-        />
-        {/* 연장 */}
-        <Label className="text-xl text-gray-600 font-medium whitespace-nowrap mr-2">연장(m)</Label>
         <Input
           className="w-[60px] !text-xl placeholder:text-center"
           placeholder="입력"
@@ -147,6 +120,41 @@ const SwagePpl: React.FC<SwagePplProps> = ({
             }
           }}
         />
+        {/* 연장 */}
+        <Label className="text-xl text-gray-600 font-medium whitespace-nowrap mr-2">연장(m)</Label>
+        <Input
+          className="w-[60px] !text-xl placeholder:text-center"
+          placeholder="입력"
+          value={start2}
+          onChange={(e) => {
+            // 숫자만 입력 허용
+            const val = e.target.value.replace(/[^0-9]/g, "");
+            setStart2(val);
+          }}
+          onKeyDown={(e) => {
+            if (e.key === 'Enter') {
+              e.preventDefault(); // Enter 키 기본 동작 방지
+              handleSearch();
+            }
+          }}
+        />
+        <span className="mx-2 text-xl font-semibold">~</span>
+        <Input
+          className="mr-8 w-[60px] !text-xl placeholder:text-center"
+          placeholder="입력"
+          value={end2}
+          onChange={(e) => {
+            // 숫자만 입력 허용
+            const val = e.target.value.replace(/[^0-9]/g, "");
+            setEnd2(val);
+          }}
+          onKeyDown={(e) => {
+            if (e.key === 'Enter') {
+              e.preventDefault(); // Enter 키 기본 동작 방지
+              handleSearch();
+            }
+          }}
+        />
         {/* 조회 버튼 */}
         <div className="flex-1 flex justify-end">
           <Button className="text-base py-2" onClick={handleSearch}>조회</Button>