70 lines
2.3 KiB
TypeScript
70 lines
2.3 KiB
TypeScript
/**
|
|
* ➡️ 경로 : 하수관망도 메인 페이지 (시설물 클릭) - 오른쪽 팝업창 (하수펌프장)
|
|
*
|
|
* 📄 sewagePump
|
|
* 하수펌프장 정보 컴포넌트
|
|
*
|
|
* - 빗물펌프장 및 오수펌프장 구분에 따른 자체 입력 정보 표시 및 편집 기능
|
|
* - VerticalTable을 통한 입력 폼 렌더링
|
|
* - 저장 버튼을 통한 데이터 저장 기능
|
|
*/
|
|
import { VerticalTable } from '@/components/ui/verticalTable';
|
|
import React, { useState, useEffect } from 'react'
|
|
// 빗물펌프장 자체 입력 정보
|
|
const exclnInputColumn = [
|
|
{ id: "swtrmtZoneNm", title: "배수구역", type: "input" },
|
|
{ id: "mltvDtdvNm", title: "배수분구", type: "input" },
|
|
{ id: "designFrqYr", title: "설계빈도(년)", type: "input", placeholder: "예: 10", isNumber: true, length: 4 },
|
|
]
|
|
// 오수펌프장 자체 입력 정보
|
|
const drtwInputColumn = [
|
|
{ id: "swtrmtZoneNm", title: "처리구역", type: "input" },
|
|
{ id: "mltvDtdvNm", title: "처리분구", type: "input" },
|
|
]
|
|
|
|
|
|
const sewagePump = ({ featureData, isDrtwSewagePump, onSaveClick }: { featureData: any, isDrtwSewagePump?: boolean, onSaveClick?: () => void }) => {
|
|
const [formData, setFormData] = useState<any>({});
|
|
|
|
// featureData가 변경될 때 formData 초기화
|
|
useEffect(() => {
|
|
if (featureData) {
|
|
setFormData(featureData);
|
|
}
|
|
}, [featureData]);
|
|
|
|
// 폼 데이터가 변경될 때 호출될 핸들러
|
|
const handleFormDataChange = (newFormData: any) => {
|
|
setFormData(newFormData);
|
|
};
|
|
|
|
// 저장 버튼 클릭 시 최신 formData를 부모에게 전달
|
|
const handleSaveClick = () => {
|
|
if (onSaveClick) {
|
|
// 저장 전에 formData를 부모 컴포넌트의 handleSaveClick에 전달
|
|
onSaveClick();
|
|
}
|
|
};
|
|
|
|
return (
|
|
<VerticalTable
|
|
headName='입력정보'
|
|
tableData={featureData ? [formData] : []}
|
|
headlist={isDrtwSewagePump ? drtwInputColumn : exclnInputColumn}
|
|
pageSize={0}
|
|
total={0}
|
|
children={undefined}
|
|
cellClick={undefined}
|
|
isEditable={true}
|
|
onPageChange={function (page: number): void {
|
|
throw new Error('Function not implemented.');
|
|
}}
|
|
showSaveButton={true}
|
|
onSaveClick={handleSaveClick}
|
|
onFormDataChange={handleFormDataChange} // 폼 데이터 변경 콜백 추가
|
|
/>
|
|
)
|
|
}
|
|
|
|
export default sewagePump
|