Files
nobat724_front/components/doctors/modal/Content.js
T

101 lines
3.0 KiB
JavaScript

import AutoCompleteSelect from "@/app/component/element/AutoCompleteSelect";
import RadioContent from "./RadioContent";
import { FormControlLabel, Switch } from "@mui/material";
import { useRouter } from "next/navigation";
import { filterList } from "@/helper";
const group1 = ["خانم", "آقا", "هر دو"];
const group2 = ["فوق تخصص", "دکترای تخصصی", "متخصص", "دکتری"];
function Content({ data, setData }) {
const router = useRouter();
const { parentList, childrenList } = filterList(data);
const changeUrl = (value, name, removeSpecialties) => {
const current = new URLSearchParams(window.location.search);
current.set(name, value.id || value);
if (removeSpecialties) {
current.delete('specialties')
};
const queryString = current.toString();
router.push(`/doctors?${queryString}`)
}
const changeData = (value, name, removeSpecialties) => {
changeUrl(value, name, removeSpecialties);
const newData = data;
newData[name] = value;
if (removeSpecialties) {
newData.specialties = ''
};
setData(newData);
}
return (
<div className="mt-[50px] px-[0px] md:px-[19px] lg:px-[38px] mb-[32px]">
<AutoCompleteSelect
list={parentList}
updateData={(value, name) => changeData(value, name, true)}
sendAll={true}
value={data.category.name}
label="دسته بندی"
name="category"
/>
{!!childrenList.length && (
<div className="mt-[24px]">
<AutoCompleteSelect
list={childrenList}
updateData={changeData}
sendAll={true}
value={data.specialties}
name="specialties"
label="تخصص"
/>
</div>
)}
<div className="mt-[40px] mb-[32px]">
<RadioContent
changeData={changeData}
value={data.gender}
text="جنسیت پزشک"
group={group1}
name='gender'
/>
<span className="block mt-[16px] mb-[24px] w-full h-px bg-[#EFEFEF]"></span>
<RadioContent
changeData={changeData}
value={data.degree}
text="درجه علمی"
group={group2}
name='degree'
/>
<span className="block mt-[16px] mb-[24px] w-full h-px bg-[#EFEFEF]"></span>
<div className="flex items-center justify-start gap-[12px]">
<FormControlLabel
control={
<Switch
checked={data.turn}
onChange={(event) => {
changeData(event.target.checked ? 1 : 0, "turn")
}}
/>
}
sx={{
".MuiFormControlLabel-label": {
color: "#3B3B3B",
fontSize: "16px",
fontWeight: 500,
},
marginLeft: '0 !important',
}}
label="فقط پزشکان دارای نوبت"
labelPlacement="start"
/>
</div>
</div>
</div>
);
}
export default Content;