Files
nobat724_front/components/doctors/head/index.js
T

100 lines
3.2 KiB
JavaScript

import { useState } from "react";
import SearchBar from "../search";
import SortList from "../sortlist";
import { useRouter, useSearchParams } from "next/navigation";
import specialties from "@/data/specialties.json";
// Data
import states from "@/data/state.json";
import cities from "@/data/city.json";
import { QueryForDoctorsFilter, QueryForDoctorsReq } from "@/helper";
import { request } from "@/services/response";
import FilterLocate from "./FilterLocate";
function Head({ matchedCity, matchedState, setDoctors }) {
const searchParams = useSearchParams();
const router = useRouter();
const fieldName = searchParams.get("specialty");
const findItem = (key, name) =>
specialties.find((item) => item[key] === name);
const isParent =
findItem("name", fieldName) && findItem("name", fieldName).parent;
const selectedState = searchParams.get("state") || matchedState?.name;
const selectedCity =
searchParams.get("city") ||
(matchedCity?.name && matchedCity?.id !== "63" ? matchedCity?.name : false);
const defaultFilter = {
state: selectedState && states.find((item) => item.name === selectedState),
city: selectedCity && cities.find((item) => item.name === selectedCity),
category: isParent ? findItem("id", isParent) : findItem("name", fieldName),
specialty: isParent && findItem("name", fieldName),
active: searchParams.get("active") || 0,
gender: searchParams.get("gender") || "هر دو",
degree: searchParams.get("degree") || "همه موارد",
sort: (searchParams.get("sort") && Number(searchParams.get("sort"))) || "",
name: searchParams.get("name") || "",
};
const [filter, setFilter] = useState(defaultFilter);
const setDataInURL = (newFilter) => {
const query = QueryForDoctorsFilter(newFilter);
const searchParams = new URLSearchParams(query).toString();
router.push(`?${searchParams}`);
};
const updateData = (name, value, isReq) => {
const newFilter = { ...filter, [name]: value };
setDataInURL(newFilter);
setFilter(newFilter);
isReq && sendReq(newFilter);
};
const sendReq = (newFilter) => {
const params = QueryForDoctorsReq(newFilter || filter);
return request
.getDoctors(params)
.then((res) => {
setDoctors(res.data);
return res;
})
.catch((err) => {
throw err;
});
};
return (
<div className="flex justify-center gap-[16px] sm:gap-[19px] md:gap-[22px] lg:gap-[24px] flex-col items-center mt-0 md:mt-[40px] lg:mt-[90px]">
<FilterLocate
filter={filter}
sendReq={sendReq}
setFilter={setFilter}
setDataInURL={setDataInURL}
/>
<div className="flex flex-col lg:flex-row items-start lg:items-center justify-center gap-[24px] lg:gap-[32px] w-full">
<SearchBar
filter={filter}
sendReq={sendReq}
setFilter={setFilter}
updateData={updateData}
setDataInURL={setDataInURL}
/>
<SortList
filter={filter}
sendReq={sendReq}
setFilter={setFilter}
updateData={updateData}
setDataInURL={setDataInURL}
/>
</div>
</div>
);
}
export default Head;