diff --git a/src/pages/ContractListPage/ContractAddButtonList/ContractEditModal/ContractEditModal.tsx b/src/pages/ContractListPage/ContractAddButtonList/ContractEditModal/ContractEditModal.tsx
index ded052f..7cf637a 100644
--- a/src/pages/ContractListPage/ContractAddButtonList/ContractEditModal/ContractEditModal.tsx
+++ b/src/pages/ContractListPage/ContractAddButtonList/ContractEditModal/ContractEditModal.tsx
@@ -135,9 +135,12 @@ const ContractEditModal = ({
.filter((uid: number | null): uid is number => uid !== null)
);
+ const normalize = (str?: string) => str?.trim().replace(/\s+/g, "") ?? "";
+
const matchedProperty = allProperties.find(
- (p) => p.address === data.propertyAddress
+ (p) => normalize(p.address) === normalize(data.propertyAddress)
);
+
setPropertyUid(matchedProperty ? matchedProperty.uid : null);
setCategory(
diff --git a/src/pages/CustomerDetailPage/CustomerInfo/CustomerInfo.tsx b/src/pages/CustomerDetailPage/CustomerInfo/CustomerInfo.tsx
index 45840e3..f015066 100644
--- a/src/pages/CustomerDetailPage/CustomerInfo/CustomerInfo.tsx
+++ b/src/pages/CustomerDetailPage/CustomerInfo/CustomerInfo.tsx
@@ -80,19 +80,19 @@ function CustomerInfo({ customerId }: { customerId: string }) {
const [loading, setLoading] = useState(false);
// Consultation 관련 상태
- const [counselPage, setCounselPage] = useState(1);
+ const [counselPage, setCounselPage] = useState(0);
const [counselRowsPerPage, setCounselRowsPerPage] = useState(10);
const [counselTotalCount, setCounselTotalCount] = useState(0);
const [counselLoading, setCounselLoading] = useState(false);
// Property 관련 상태
- const [propertyPage, setPropertyPage] = useState(1);
+ const [propertyPage, setPropertyPage] = useState(0);
const [propertyRowsPerPage, setPropertyRowsPerPage] = useState(10);
const [propertyTotalCount, setPropertyTotalCount] = useState(0);
const [propertyLoading, setPropertyLoading] = useState(false);
// Contract 관련 상태
- const [contractPage, setContractPage] = useState(1);
+ const [contractPage, setContractPage] = useState(0);
const [contractRowsPerPage, setContractRowsPerPage] = useState(10);
const [contractTotalCount, setContractTotalCount] = useState(0);
const [contractLoading, setContractLoading] = useState(false);
diff --git a/src/pages/CustomerDetailPage/Tables/ContractTable.tsx b/src/pages/CustomerDetailPage/Tables/ContractTable.tsx
index 4ae184f..8941e76 100644
--- a/src/pages/CustomerDetailPage/Tables/ContractTable.tsx
+++ b/src/pages/CustomerDetailPage/Tables/ContractTable.tsx
@@ -15,6 +15,7 @@ import {
TableRow,
Chip,
CircularProgress,
+ TablePagination,
} from "@mui/material";
interface ContractTableProps {
@@ -194,31 +195,21 @@ function ContractTable({
총 {totalCount}건
-
-
- 페이지당 행
-
-
- onPageChange(newPage)}
- color="primary"
- showFirstButton
- showLastButton
- />
-
+ onPageChange(newPage)}
+ onRowsPerPageChange={(e) => {
+ onRowsPerPageChange(Number(e.target.value));
+ }}
+ rowsPerPageOptions={[10, 25, 50, 100]}
+ labelRowsPerPage="페이지당 행 수"
+ labelDisplayedRows={({ from, to, count }) =>
+ `${count}건 중 ${from}-${to}건`
+ }
+ />
);
diff --git a/src/pages/CustomerDetailPage/Tables/PropertyTable.tsx b/src/pages/CustomerDetailPage/Tables/PropertyTable.tsx
index 86b5150..7543742 100644
--- a/src/pages/CustomerDetailPage/Tables/PropertyTable.tsx
+++ b/src/pages/CustomerDetailPage/Tables/PropertyTable.tsx
@@ -15,6 +15,7 @@ import {
Paper,
Chip,
CircularProgress,
+ TablePagination,
} from "@mui/material";
import { useNavigate } from "react-router-dom";
import { formatPriceWithKorean } from "@utils/numberUtil";
@@ -192,31 +193,21 @@ function PropertyTable({
총 {totalCount}건
-
-
- 페이지당 행
-
-
- onPageChange(newPage)}
- color="primary"
- showFirstButton
- showLastButton
- />
-
+ onPageChange(newPage)}
+ onRowsPerPageChange={(e) => {
+ onRowsPerPageChange(Number(e.target.value));
+ }}
+ rowsPerPageOptions={[10, 25, 50, 100]}
+ labelRowsPerPage="페이지당 행 수"
+ labelDisplayedRows={({ from, to, count }) =>
+ `${count}건 중 ${from}-${to}건`
+ }
+ />
);