ONAANDALL/frontend
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

검색 화면 화면 조정

Browse Source
This commit is contained in:
yschoi
2025-07-26 20:09:41 +09:00
parent 4917084bbf
commit b2bbdb8ad4
13 changed files with 170 additions and 113 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/sn/app/(map-layout)/map/page.tsx
+17 -17
View File
@@ -41,7 +41,7 @@ const Map = () => {
const fetchData = async () => {
try {
const data = await getData('v1/map/lyrStngs/SN_NETWORK');
const data = await getData("v1/map/lyrStngs/SN_NETWORK");
setTreeData(data);
} catch (error) {
console.error("데이터 불러오기 실패:", error);
@@ -115,22 +115,22 @@ const Map = () => {
};
return (
<div className="bg-container">
<Gis
treeData={treeData}
isSearch={true}
gisMaps={gisMaps}
isMiniMap={false}
searchView={SearchModal}
detailView={FeatureClickEventPopup}
onFeatureSelect={onFeatureSelect}
setIsOpen={setIsOpen}
setFeatureData={setFeatureData}
featureData={featureData}
setIsSearchModalOpen={setIsSearchModalOpen}
isOpen={isOpen}
isSearchModalOpen={isSearchModalOpen}
onCheckedLayersChange={undefined}
/>
<Gis
treeData={treeData}
isSearch={true}
gisMaps={gisMaps}
isMiniMap={false}
searchView={SearchModal}
detailView={FeatureClickEventPopup}
onFeatureSelect={onFeatureSelect}
setIsOpen={setIsOpen}
setFeatureData={setFeatureData}
featureData={featureData}
setIsSearchModalOpen={setIsSearchModalOpen}
isOpen={isOpen}
isSearchModalOpen={isSearchModalOpen}
onCheckedLayersChange={undefined}
/>
</div>
);
};
apps/sn/app/(map-layout)/map/searchModal/basicTab.tsx
+1 -1
View File
@@ -78,7 +78,7 @@ const BasicTab: React.FC<BasicTabProps> = ({
setVar2,
}) => {
return (
<div className="relative border rounded-lg p-6 mt-4 w-full h-[10vh]">
<div className="relative border rounded-lg p-6 w-full h-[10vh]">
{/* 구분 */}
<div className="mb-3 flex items-center justify-between gap-4">
<div className="flex items-center">
apps/sn/app/(map-layout)/map/searchModal/operationTab.tsx
+1 -1
View File
@@ -109,7 +109,7 @@ const OperationTab: React.FC<OperationTabProps> = ({
setYearFilter,
}) => {
return (
<div className="relative flex flex-col border rounded-lg p-6 mt-4 w-full h-[10vh]">
<div className="relative flex flex-col border rounded-lg p-6 w-full h-[10vh]">
<div className="flex items-center mb-3">
<SelectBox
className="w-80 mr-8"
apps/sn/app/(map-layout)/map/searchModal/reportTab.tsx
+1 -1
View File
@@ -61,7 +61,7 @@ const ReportTab: React.FC<BasicTabProps> = ({
return (
<div className="relative flex flex-col border rounded-lg p-6 mt-4 w-full h-[10vh]">
<div className="relative flex flex-col border rounded-lg p-6 w-full h-[10vh]">
<div className="flex items-center mb-3">
<SelectBox
className="w-[150px] mr-8"
apps/sn/app/(map-layout)/map/searchModal/searchModal.tsx
+11 -10
View File
@@ -235,7 +235,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;
@@ -521,8 +521,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,
};
const res = await getData(`v1/bizInfo/fclts?${new URLSearchParams(RequestDTO).toString()}`);
@@ -557,7 +557,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()}`);
@@ -620,6 +620,7 @@ const SearchModal: React.FC<SearchModalProps> = ({
}))}
onValueChange={(value: string) => setActiveTab(value)}
>
</UITab>
{/* 각각의 탭 영역 */}
{/* 기본정보 탭 */}
{activeTab === 'basic' && (
@@ -681,12 +682,12 @@ const SearchModal: React.FC<SearchModalProps> = ({
/>
)}
{/* </UITab2> */}
</UITab>
{/* 📋 결과 리스트 */}
{/* 기본정보 탭, 하수도정비기본계획보고서 탭 */}
{(activeTab === 'basic' || activeTab === 'report') && (
<div className="h-[80vh] w-full overflow-hidden rounded-lg border">
<div className="h-[79vh] w-full overflow-hidden rounded-lg border">
{/* 테이블2 영역 (가로/세로 스크롤 가능) */}
<div className="flex-1 px-2 pb-2">
<LoadingOverlay isLoading={isLoading} />
@@ -711,7 +712,7 @@ const SearchModal: React.FC<SearchModalProps> = ({
{/* 운영정보 탭 */}
{activeTab === 'operation' && (
<>
<div className="h-[35vh] w-full overflow-hidden rounded-lg border">
<div className="h-[39vh] w-full overflow-hidden rounded-lg border">
<div className="flex-1 px-2 pb-2">
<LoadingOverlay isLoading={isLoading} />
<UiTable
@@ -723,7 +724,7 @@ const SearchModal: React.FC<SearchModalProps> = ({
}
tableData={tableData}
headlist={dynamicHeadlist}
pageSize={4}
pageSize={5}
total={tableCount}
cellClick={handleOperationCellClick}
onPageChange={setCurPage}
@@ -733,7 +734,7 @@ const SearchModal: React.FC<SearchModalProps> = ({
</div>
</div>
<div className="h-[35vh] w-full overflow-hidden rounded-lg border">
<div className="h-[39vh] w-full overflow-hidden rounded-lg border">
<div className="flex-1 px-2 pb-2">
<LoadingOverlay isLoading={isDetailLoading} />
<UiTable
@@ -745,7 +746,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/swageMhl.tsx
+9
View File
@@ -30,6 +30,13 @@ const SwageMhl: React.FC<SwageMhlProps> = ({
setYearFilter,
handleSearch,
}) => {
const handleEnterKey = (e: React.KeyboardEvent<HTMLInputElement>) => {
if (e.key === 'Enter') {
handleSearch();
}
};
return (
<div className="mb-3">
<div className="mb-2 flex items-center">
@@ -70,6 +77,7 @@ const SwageMhl: React.FC<SwageMhlProps> = ({
const val = e.target.value.replace(/[^0-9]/g, "");
setStart1(val);
}}
onKeyDown={handleEnterKey}
/>
<span className="mx-2 text-xl font-semibold">~</span>
<Input
@@ -81,6 +89,7 @@ const SwageMhl: React.FC<SwageMhlProps> = ({
const val = e.target.value.replace(/[^0-9]/g, "");
setEnd1(val);
}}
onKeyDown={handleEnterKey}
/>
{/* 조회 버튼 */}
<div className="flex-1 flex justify-end">
apps/sn/app/(map-layout)/map/searchModal/swagePmstn.tsx
+11
View File
@@ -31,6 +31,13 @@ const SwagePmstn: React.FC<SwagePmstnProps> = ({
setYearFilter,
handleSearch,
}) => {
const handleEnterKey = (e: React.KeyboardEvent<HTMLInputElement>) => {
if (e.key === 'Enter') {
handleSearch();
}
};
return (
<div className="mb-3">
<div className="flex items-center mb-2">
@@ -53,6 +60,7 @@ const SwagePmstn: React.FC<SwagePmstnProps> = ({
const val = e.target.value.replace(/[^0-9]/g, "");
setStart1(val);
}}
onKeyDown={handleEnterKey}
/>
<span className="mx-2 text-xl font-semibold">~</span>
<Input
@@ -64,6 +72,7 @@ const SwagePmstn: React.FC<SwagePmstnProps> = ({
const val = e.target.value.replace(/[^0-9]/g, "");
setEnd1(val);
}}
onKeyDown={handleEnterKey}
/>
{/* 양수능력 - 우수맨홀 */}
<Label className="mr-2 w-auto text-xl text-gray-600">
@@ -78,6 +87,7 @@ const SwagePmstn: React.FC<SwagePmstnProps> = ({
const val = e.target.value.replace(/[^0-9]/g, "");
setStart2(val);
}}
onKeyDown={handleEnterKey}
/>
<span className="mx-2 text-xl font-semibold">~</span>
<Input
@@ -89,6 +99,7 @@ const SwagePmstn: React.FC<SwagePmstnProps> = ({
const val = e.target.value.replace(/[^0-9]/g, "");
setEnd2(val);
}}
onKeyDown={handleEnterKey}
/>
{/* 조회 버튼 */}
<div className="flex-1 flex justify-end">
apps/sn/app/(map-layout)/map/searchModal/swagePpl.tsx
+11
View File
@@ -33,6 +33,13 @@ const SwagePpl: React.FC<SwagePplProps> = ({
setYearFilter,
handleSearch,
}) => {
const handleEnterKey = (e: React.KeyboardEvent<HTMLInputElement>) => {
if (e.key === 'Enter') {
handleSearch();
}
};
return (
<div className="mb-6">
<div className="mb-2 flex items-center">
@@ -85,6 +92,7 @@ const SwagePpl: React.FC<SwagePplProps> = ({
const val = e.target.value.replace(/[^0-9]/g, "");
setVar1(val);
}}
onKeyDown={handleEnterKey}
/>
<span className="mx-2 text-xl font-semibold">~</span>
<Input
@@ -96,6 +104,7 @@ const SwagePpl: React.FC<SwagePplProps> = ({
const val = e.target.value.replace(/[^0-9]/g, "");
setEnd1(val);
}}
onKeyDown={handleEnterKey}
/>
{/* 연장 */}
<Label className="mr-2 w-auto text-xl text-gray-600">연장(m)</Label>
@@ -108,6 +117,7 @@ const SwagePpl: React.FC<SwagePplProps> = ({
const val = e.target.value.replace(/[^0-9]/g, "");
setStart1(val);
}}
onKeyDown={handleEnterKey}
/>
<span className="mx-2 text-xl font-semibold">~</span>
<Input
@@ -119,6 +129,7 @@ const SwagePpl: React.FC<SwagePplProps> = ({
const val = e.target.value.replace(/[^0-9]/g, "");
setEnd1(val);
}}
onKeyDown={handleEnterKey}
/>
{/* 조회 버튼 */}
<div className="flex-1 flex justify-end">
apps/sn/app/(map-layout)/map/searchModal/swagePrcsFclt.tsx
+12
View File
@@ -35,6 +35,13 @@ const SwagePrcsFclt: React.FC<SwagePrcsFcltProps> = ({
setYearFilter,
handleSearch,
}) => {
const handleEnterKey = (e: React.KeyboardEvent<HTMLInputElement>) => {
if (e.key === 'Enter') {
handleSearch();
}
};
return (
<div className="mb-3">
{/* 가동개시일자 */}
@@ -64,6 +71,7 @@ const SwagePrcsFclt: React.FC<SwagePrcsFcltProps> = ({
const val = e.target.value.replace(/[^0-9]/g, "");
setStart1(val);
}}
onKeyDown={handleEnterKey}
/>
<span className="mx-2 text-xl font-semibold">~</span>
<Input
@@ -75,6 +83,7 @@ const SwagePrcsFclt: React.FC<SwagePrcsFcltProps> = ({
const val = e.target.value.replace(/[^0-9]/g, "");
setEnd1(val);
}}
onKeyDown={handleEnterKey}
/>
{/* 처리구역 면적 */}
<Label className="mr-2 w-auto text-xl text-gray-600">처리구역 면적(m²)</Label>
@@ -87,6 +96,7 @@ const SwagePrcsFclt: React.FC<SwagePrcsFcltProps> = ({
const val = e.target.value.replace(/[^0-9]/g, "");
setStart2(val);
}}
onKeyDown={handleEnterKey}
/>
<span className="mx-2 text-xl font-semibold">~</span>
<Input
@@ -98,6 +108,7 @@ const SwagePrcsFclt: React.FC<SwagePrcsFcltProps> = ({
const val = e.target.value.replace(/[^0-9]/g, "");
setEnd2(val);
}}
onKeyDown={handleEnterKey}
/>
{/* 하수처리시설명 */}
<Label className="mr-2 w-auto text-xl text-gray-600">하수처리시설명</Label>
@@ -108,6 +119,7 @@ const SwagePrcsFclt: React.FC<SwagePrcsFcltProps> = ({
onChange={(e) => {
setVar1(e.target.value);
}}
onKeyDown={handleEnterKey}
/>
{/* 조회 버튼 */}
<div className="flex-1 flex justify-end">
apps/sn/app/(map-layout)/map/searchModal/swagePrcsZone.tsx
+9
View File
@@ -27,6 +27,13 @@ const swagePrcsZone: React.FC<swagePrcsZoneProps> = ({
setSgg,
handleSearch,
}) => {
const handleEnterKey = (e: React.KeyboardEvent<HTMLInputElement>) => {
if (e.key === 'Enter') {
handleSearch();
}
};
return (
<div className="mb-3">
<div className="mb-2 flex items-center">
@@ -47,6 +54,7 @@ const swagePrcsZone: React.FC<swagePrcsZoneProps> = ({
onChange={(e) => {
setVar1(e.target.value);
}}
onKeyDown={handleEnterKey}
/>
<Label className="mr-2 w-auto text-xl text-gray-600">하수처리시설명</Label>
<Input
@@ -56,6 +64,7 @@ const swagePrcsZone: React.FC<swagePrcsZoneProps> = ({
onChange={(e) => {
setVar2(e.target.value);
}}
onKeyDown={handleEnterKey}
/>
{/* 조회 버튼 */}
<div className="flex-1 flex justify-end">
apps/sn/app/page.tsx
+2 -2
View File
@@ -7,8 +7,8 @@ import { useRouter } from "next/navigation";
export default function Home() {
const router = useRouter();
const userId = "admin1gmail";
const password = "test1234!";
const userId = "CLEANWATER";
const password = "gktneh12!@";
const checkToken = getCookie(AUTH_USER_ID);
useEffect(() => {