refactor: add location address handling in DateTime component and update Hours component to display address
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
import List from "./List";
|
import List from "./List";
|
||||||
import Loading from "./Loading";
|
import Loading from "./Loading";
|
||||||
|
|
||||||
function Hours({ appo, doctor, hour, setHour, value, nameHours }) {
|
function Hours({ appo, doctor, hour, setHour, value, nameHours, locationAddress }) {
|
||||||
if (appo === "loading") {
|
if (appo === "loading") {
|
||||||
return <Loading />;
|
return <Loading />;
|
||||||
} else if (typeof appo === "string") {
|
} else if (typeof appo === "string") {
|
||||||
@@ -11,7 +11,21 @@ function Hours({ appo, doctor, hour, setHour, value, nameHours }) {
|
|||||||
</p>
|
</p>
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
return <List appo={appo} hour={hour} value={value} setHour={setHour} />;
|
return (
|
||||||
|
<>
|
||||||
|
<List appo={appo} hour={hour} value={value} setHour={setHour} />
|
||||||
|
{locationAddress && (
|
||||||
|
<div className="mt-4 p-3 bg-[#F5F5F5] dark:bg-[#2A2A2A] rounded-lg">
|
||||||
|
<p className="text-[#616161] dark:text-[#A1A1A1] text-[14px] font-medium mb-1">
|
||||||
|
آدرس مطب:
|
||||||
|
</p>
|
||||||
|
<p className="text-[#3B3B3B] dark:text-[#D7D8ED] text-[14px] font-normal">
|
||||||
|
{locationAddress}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</>
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -13,12 +13,30 @@ function DateTime({ date, doctor, setStep }) {
|
|||||||
const [value, setValue] = useState(0);
|
const [value, setValue] = useState(0);
|
||||||
const [hour, setHour] = useState();
|
const [hour, setHour] = useState();
|
||||||
const [appo, setAppo] = useState("تاریخ مورد نظرتان را انتخاب کنید.");
|
const [appo, setAppo] = useState("تاریخ مورد نظرتان را انتخاب کنید.");
|
||||||
|
const [locationAddress, setLocationAddress] = useState(null);
|
||||||
|
|
||||||
const handleChange = (event, newValue) => {
|
const handleChange = (event, newValue) => {
|
||||||
setHour();
|
setHour();
|
||||||
setValue(newValue);
|
setValue(newValue);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// دریافت آدرس بر اساس location_id وقتی ساعت انتخاب میشود
|
||||||
|
useEffect(() => {
|
||||||
|
if (hour && hour.location_id) {
|
||||||
|
request
|
||||||
|
.getDoctorAddress(hour.location_id)
|
||||||
|
.then((res) => {
|
||||||
|
setLocationAddress(res.address);
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.error("Error fetching address:", err);
|
||||||
|
setLocationAddress(null);
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
setLocationAddress(null);
|
||||||
|
}
|
||||||
|
}, [hour]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (date && doctor?.id) {
|
if (date && doctor?.id) {
|
||||||
setAppo("loading");
|
setAppo("loading");
|
||||||
@@ -85,6 +103,7 @@ function DateTime({ date, doctor, setStep }) {
|
|||||||
doctor={doctor}
|
doctor={doctor}
|
||||||
setHour={setHour}
|
setHour={setHour}
|
||||||
nameHours={nameHours}
|
nameHours={nameHours}
|
||||||
|
locationAddress={locationAddress}
|
||||||
/>
|
/>
|
||||||
<SendAppo hour={hour} setStep={setStep} />
|
<SendAppo hour={hour} setStep={setStep} />
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -96,4 +96,6 @@ export const request = {
|
|||||||
Authorization: "",
|
Authorization: "",
|
||||||
},
|
},
|
||||||
}),
|
}),
|
||||||
|
getDoctorAddress: (location_id) =>
|
||||||
|
api.get(`api/v1/clinic-pro/doctor-address/${location_id}`, removeTokenHead),
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user