Files
nobat724_front/components/doctors/index.js
T

94 lines
3.1 KiB
JavaScript

"use client";
import { useState } from "react";
import SearchBar from "./search";
import SortList from "./sortlist";
import { Button } from "@mui/material";
import ListDoctors from "./listDoctors";
import LocationD from "../icons/LocationD";
import ModalSearchCity from "@/app/component/modalSearchCity";
// Data
import specialties from "@/data/specialties.json";
function DoctorsPage({ params, matchedCity, matchedState, list }) {
const fieldName = params.field;
const [doctors, setDoctors] = useState(list);
const [open, setOpen] = useState(false);
const [fields, setFields] = useState({
search: "",
stars: "",
});
const [selected, setSelected] = useState({
province: matchedState?.name || params?.province,
city: matchedCity?.name || params?.city,
});
const findItem = (key, name) =>
specialties.find((item) => item[key] === name);
const isParent =
findItem("name", fieldName) && findItem("name", fieldName).parent;
const dataParent =
findItem("name", fieldName) && isParent && findItem("id", isParent);
const defaultData = {
category: isParent ? findItem("id", isParent) : findItem("name", fieldName),
specialties: isParent && findItem("name", fieldName),
turn: params && params.hasOwnProperty("turn") ? JSON.parse(params.turn) : 1,
gender: params.gender || "هر دو",
degree: params.degree || "همه موارد",
};
const [data, setData] = useState(defaultData);
const [confirmedData, setConfirmedData] = useState(defaultData);
return (
<div className="pt-[95px] sm:pt-[120px] padding-responsive">
<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]">
<ModalSearchCity
open={open}
setOpen={setOpen}
selected={selected}
state={matchedState}
setSelected={setSelected}
>
<Button
className="!flex !ml-auto !w-fit !px-3 !py-1 !items-center !justify-start !gap-2 !cursor-pointer"
onClick={() => setOpen(true)}
>
<LocationD />
<h1 className="text-[#525252] text-[16px] font-semibold">
{" "}
{selected.province || "استان"}
{" / "}
{selected.city || "شهر"}
</h1>
</Button>
</ModalSearchCity>
<div className="flex flex-col lg:flex-row items-start lg:items-center justify-center gap-[24px] lg:gap-[32px] w-full">
<SearchBar
data={data}
fields={fields}
setData={setData}
setFields={setFields}
setDoctors={setDoctors}
matchedCity={matchedCity}
matchedState={matchedState}
confirmedData={confirmedData}
setConfirmedData={setConfirmedData}
/>
<SortList
fields={fields}
setFields={setFields}
data={data}
setData={setData}
/>
</div>
</div>
<ListDoctors list={doctors} />
</div>
);
}
export default DoctorsPage;