diff --git a/src/pages/CustomerListPage/CustomerFilterModal/CustomerFilterModal.tsx b/src/pages/CustomerListPage/CustomerFilterModal/CustomerFilterModal.tsx index 885598e..3bde4eb 100644 --- a/src/pages/CustomerListPage/CustomerFilterModal/CustomerFilterModal.tsx +++ b/src/pages/CustomerListPage/CustomerFilterModal/CustomerFilterModal.tsx @@ -45,9 +45,9 @@ interface FilterState { interface CustomerFilterModalProps { open: boolean; onClose: () => void; - filters: any; // ๐Ÿ”ฅ ๋ถ€๋ชจ์—์„œ ๊ด€๋ฆฌํ•˜๋Š” ํ•„ํ„ฐ - setFilters: (filters: any) => void; // ๐Ÿ”ฅ ๋ถ€๋ชจ setter - onApply: (filters: any) => void; // ๐Ÿ”ฅ ์ ์šฉ ์‹œ ํ˜ธ์ถœ + filters: any; + setFilters: (filters: any) => void; + onApply: (filters: any) => void; } const CustomerFilterModal = ({ open, onClose, filters, setFilters, onApply }: CustomerFilterModalProps) => { @@ -67,7 +67,7 @@ const CustomerFilterModal = ({ open, onClose, filters, setFilters, onApply }: Cu const [labels, setLabels] = useState([]); const [selectedLabels, setSelectedLabels] = useState([]); - // ๋ผ๋ฒจ ๋ชฉ๋ก ๋ถˆ๋Ÿฌ์˜ค๊ธฐ + const fetchLabels = async () => { try { const response = await apiClient.get("/labels"); @@ -92,15 +92,6 @@ const CustomerFilterModal = ({ open, onClose, filters, setFilters, onApply }: Cu ); setSelectedLabels(selectedLabelsData); } - } else { - setRegion({ - sido: [], - sigungu: [], - dong: [], - selectedSido: null, - selectedSigungu: null, - selectedDong: null, - }); } }, [open, filters]); @@ -221,6 +212,15 @@ const CustomerFilterModal = ({ open, onClose, filters, setFilters, onApply }: Cu return Number(price.replace(/[^0-9]/g, '')); }; + let regionCode: string | undefined; + if (region.selectedDong) { + regionCode = String(region.selectedDong); + } else if (region.selectedSigungu) { + regionCode = String(region.selectedSigungu).slice(0, 5); + } else if (region.selectedSido) { + regionCode = String(region.selectedSido).slice(0, 2); + } + const filterData = { ...filtersTemp, minPrice: parsePrice(filtersTemp.minPrice as string), @@ -229,7 +229,7 @@ const CustomerFilterModal = ({ open, onClose, filters, setFilters, onApply }: Cu maxDeposit: parsePrice(filtersTemp.maxDeposit as string), minRent: parsePrice(filtersTemp.minRent as string), maxRent: parsePrice(filtersTemp.maxRent as string), - regionCode: region.selectedDong || region.selectedSigungu || region.selectedSido || undefined, + regionCode, labelUids: selectedLabels.length > 0 ? selectedLabels.map(label => label.uid) : undefined, }; @@ -254,6 +254,33 @@ const CustomerFilterModal = ({ open, onClose, filters, setFilters, onApply }: Cu onClose(); }; + // ํ•„ํ„ฐ ์ดˆ๊ธฐํ™” ํ•จ์ˆ˜ + const handleReset = () => { + setFiltersTemp({ + tenant: false, + landlord: false, + buyer: false, + seller: false, + noRole: false, + minPrice: "", + maxPrice: "", + minDeposit: "", + maxDeposit: "", + minRent: "", + maxRent: "", + labelUids: [], + }); + setSelectedLabels([]); + setRegion({ + sido: [], + sigungu: [], + dong: [], + selectedSido: null, + selectedSigungu: null, + selectedDong: null, + }); + }; + return ( - + diff --git a/src/pages/CustomerListPage/CustomerListPage.tsx b/src/pages/CustomerListPage/CustomerListPage.tsx index a5d7e63..c1e6620 100644 --- a/src/pages/CustomerListPage/CustomerListPage.tsx +++ b/src/pages/CustomerListPage/CustomerListPage.tsx @@ -260,7 +260,7 @@ const CustomerListPage = () => { sx={{ width: 250, "& .MuiOutlinedInput-root": { - borderRadius: "14px", + borderRadius: "14px", boxShadow: "0 2px 6px rgba(0, 0, 0, 0.05)", "&:hover .MuiOutlinedInput-notchedOutline": { borderColor: "rgba(0, 0, 0, 0.25)", @@ -272,6 +272,7 @@ const CustomerListPage = () => { onClick={() => setFilterModalOpen(true)} sx={{ borderRadius: "14px", + padding: "5px", border: "1px solid rgba(0, 0, 0, 0.23)", "&:hover": { backgroundColor: "#F5F5F5", diff --git a/src/pages/PrivatePropertyListPage/PrivatePropertyListPage.tsx b/src/pages/PrivatePropertyListPage/PrivatePropertyListPage.tsx index f6a6f5b..59496df 100644 --- a/src/pages/PrivatePropertyListPage/PrivatePropertyListPage.tsx +++ b/src/pages/PrivatePropertyListPage/PrivatePropertyListPage.tsx @@ -27,6 +27,7 @@ import { MenuItem, SelectChangeEvent } from "@mui/material"; import PropertyAddButtonList from "./PropertyAddButtonList"; import { Box } from "@mui/material"; import { useNavigate } from "react-router-dom"; +import FilterListIcon from "@mui/icons-material/FilterList"; export interface PropertyItem { uid: number; @@ -373,13 +374,25 @@ function PrivatePropertyListPage() { - setFilterModalOpen(true)} - > - ์ƒ์„ธ ํ•„ํ„ฐ - - + setFilterModalOpen(true)} + sx={{ + // ๊ธฐ์กด ์Šคํƒ€์ผ ์œ ์ง€ + border: "1px solid #164F9E", + color: "#164F9E", + minWidth: "40px", + padding: "5px", + borderRadius: "14px", + "&:hover": { + backgroundColor: "#F5F5F5", + border: "1px solid #164F9E", + }, + }} + > + + + diff --git a/src/pages/PrivatePropertyListPage/PropertyTable/PropertyTable.tsx b/src/pages/PrivatePropertyListPage/PropertyTable/PropertyTable.tsx index 1c4aca6..d770e43 100644 --- a/src/pages/PrivatePropertyListPage/PropertyTable/PropertyTable.tsx +++ b/src/pages/PrivatePropertyListPage/PropertyTable/PropertyTable.tsx @@ -167,7 +167,11 @@ const PropertyTable = ({ {formatArea(property.netArea)} - {property.details ?? "-"} + {property.details + ? property.details.length > 20 + ? property.details.slice(0, 20) + "..." + : property.details + : "-"} )) diff --git a/src/pages/PublicPropertyListPage/PublicPropertyFilterModal/PublicPropertyFilterModal.tsx b/src/pages/PublicPropertyListPage/PublicPropertyFilterModal/PublicPropertyFilterModal.tsx index d0725d0..6f5149f 100644 --- a/src/pages/PublicPropertyListPage/PublicPropertyFilterModal/PublicPropertyFilterModal.tsx +++ b/src/pages/PublicPropertyListPage/PublicPropertyFilterModal/PublicPropertyFilterModal.tsx @@ -240,8 +240,15 @@ const PublicPropertyFilterModal = ({ }; const handleApply = () => { - // Create filter object with region code - const regionCode = region.selectedDong || region.selectedSigungu || region.selectedSido || undefined; + let regionCode: string | undefined; + if (region.selectedDong) { + regionCode = String(region.selectedDong); + } else if (region.selectedSigungu) { + regionCode = String(region.selectedSigungu).slice(0, 5); + } else if (region.selectedSido) { + regionCode = String(region.selectedSido).slice(0, 2); + } + const updatedFilters = { ...localFilters, regionCode, diff --git a/src/pages/PublicPropertyListPage/PublicPropertyListPage.tsx b/src/pages/PublicPropertyListPage/PublicPropertyListPage.tsx index 078678b..c9079c5 100644 --- a/src/pages/PublicPropertyListPage/PublicPropertyListPage.tsx +++ b/src/pages/PublicPropertyListPage/PublicPropertyListPage.tsx @@ -457,8 +457,8 @@ function PublicPropertyListPage() { {/* ์ƒ๋‹จ ํ•„ํ„ฐ ๋ฐ” ์ปจํ…Œ์ด๋„ˆ */} - - + + ๊ณต๊ฐœ ๋งค๋ฌผ ๊ฒ€์ƒ‰ ๊ฒฐ๊ณผ : {totalElements} ๊ฑด