From 7fddf65026a6c7140648bf31473c5a3b9f01ff0e Mon Sep 17 00:00:00 2001 From: Ehsan Date: Fri, 16 May 2025 17:19:38 +0330 Subject: [PATCH] change component file & set data in url & handle remove all variable --- app/component/element/AutoCompleteSelect.js | 5 +- components/doctors/index.js | 18 ++++--- components/doctors/modal/Content.js | 54 ++++++++++----------- components/doctors/modal/FilterModal.js | 23 ++++++++- components/doctors/search/index.js | 4 +- 5 files changed, 62 insertions(+), 42 deletions(-) diff --git a/app/component/element/AutoCompleteSelect.js b/app/component/element/AutoCompleteSelect.js index ecfb3a4..3630664 100644 --- a/app/component/element/AutoCompleteSelect.js +++ b/app/component/element/AutoCompleteSelect.js @@ -10,7 +10,8 @@ function AutoCompleteSelect({ name, label, disabled = false, - listboxProps + listboxProps, + sendAll }) { return ( { - updateData && updateData(newValue || "", name); + updateData && updateData((newValue && sendAll) ? newValue : (newValue && !sendAll) && newValue.label || "", name); }} sx={{ ...styleTextSelectRight, diff --git a/components/doctors/index.js b/components/doctors/index.js index e8d1127..4200226 100644 --- a/components/doctors/index.js +++ b/components/doctors/index.js @@ -8,6 +8,14 @@ import ListDoctors from "./listDoctors"; import LocationD from "../icons/LocationD"; import ModalSearchCity from "@/app/component/modalSearchCity"; +const defaultData = { + category: "", + expertise: "", + turn: true, + gender: "هر دو", + degree: "متخصص", +} + function DoctorsPage({ params, matchedCity, matchedState }) { const [loading, setLoading] = useState(true); const [open, setOpen] = useState(false); @@ -16,13 +24,7 @@ function DoctorsPage({ params, matchedCity, matchedState }) { city: matchedCity?.name || params?.city, }); - const [data, setData] = useState({ - category: "", - expertise: "", - turn: true, - gender: "خانم", - degree: "فوق تخصص", - }); + const [data, setData] = useState(defaultData); useEffect(() => { setTimeout(() => { @@ -53,7 +55,7 @@ function DoctorsPage({ params, matchedCity, matchedState }) {
- +
diff --git a/components/doctors/modal/Content.js b/components/doctors/modal/Content.js index e607ef1..6a7be6f 100644 --- a/components/doctors/modal/Content.js +++ b/components/doctors/modal/Content.js @@ -3,11 +3,14 @@ import RadioContent from "./RadioContent"; import { FormControlLabel, Switch } from "@mui/material"; import specialties from "@/data/specialties.json"; import { addKeyToList } from "@/helper"; +import { useEffect } from "react"; +import { useRouter } from "next/navigation"; const group1 = ["خانم", "آقا", "هر دو"]; const group2 = ["فوق تخصص", "دکترای تخصصی", "متخصص", "دکتری"]; function Content({ data, setData }) { + const router = useRouter(); const parentList = specialties.filter(item => !item.parent); const childrenList = specialties.filter(item => item.parent); @@ -16,33 +19,36 @@ function Content({ data, setData }) { const filteredChildrenList = changedChildrenList.filter(item => item.parent === data.category.id); - console.log(data); const changeData = (value, name) => { - console.log(value); - console.log(name); - - setData({ ...data, [name]: value }) - }; + const current = new URLSearchParams(window.location.search); + current.set(name, value.id || value); + const queryString = current.toString(); + router.push(`/doctors?${queryString}`) + setData({ ...data, [name]: value }); + } return (
-
- -
+ {!!filteredChildrenList.length && ( +
+ +
+ )}
- {/*

- فقط پزشکان دارای نوبت -

*/} - {/* - changeData(event.target.checked, "turn") - } - /> */} changeData(event.target.checked, "turn")} /> } @@ -81,12 +81,10 @@ function Content({ data, setData }) { fontSize: "16px", fontWeight: 500, }, - ".MuiFormControlLabel-root.MuiFormControlLabel-labelPlacementStart": { - marginRight: '0 !important' - } + marginLeft: '0 !important', }} label="فقط پزشکان دارای نوبت" - labelPlacement="start" // متن را سمت راست یا چپ قرار می‌دهد + labelPlacement="start" />
diff --git a/components/doctors/modal/FilterModal.js b/components/doctors/modal/FilterModal.js index 0d825ba..a85beb8 100644 --- a/components/doctors/modal/FilterModal.js +++ b/components/doctors/modal/FilterModal.js @@ -5,12 +5,31 @@ import { styleDefault } from "@/mui"; import { Button, Modal } from "@mui/material"; import { useState } from "react"; import Content from "./Content"; +import { useRouter } from "next/navigation"; -function FilterModal({ data, setData, children }) { +function FilterModal({ data, setData, children, defaultData }) { + const router = useRouter(); const [open, setOpen] = useState(false); + const handleOpen = () => setOpen(true); const handleClose = () => setOpen(false); + function clearFilterParams() { + const currentParams = new URLSearchParams(window.location.search); + const keysToRemove = ['turn', 'expertise', 'degree', 'category', 'gender']; + keysToRemove.forEach((key) => currentParams.delete(key)); + const queryString = currentParams.toString(); + const newUrl = queryString ? `/doctors?${queryString}` : '/doctors'; + + router.push(newUrl); + } + + const deleteData = () => { + setData(defaultData); + clearFilterParams() + handleClose(); + } + return ( <> {/* Button Modal */} @@ -28,7 +47,7 @@ function FilterModal({ data, setData, children }) {

فیلترها