Files
nobat724_front/components/dashboard/userAccount/detailUser/allergies/modal/index.js
T

72 lines
2.3 KiB
JavaScript

import { styleDefault } from "@/mui";
import AddBtn from "@/components/dashboard/userAccount/components/AddBtn";
import UpdateBtn from "@/components/dashboard/userAccount/components/UpdateBtn";
import { Button, Modal } from "@mui/material";
import Content from "./Content";
import { useState } from "react";
import CloseModalD from "@/components/icons/CloseModalD";
function ModalAddAlergie({ open, setOpen, loading, changeData, updateData }) {
const contentItem = {
substance: "",
reaction: "",
severity: "",
};
const handleOpen = () => setOpen(true);
const handleClose = () => setOpen(false);
const [newItem, setNewItem] = useState({
substance: "",
reaction: "",
severity: "",
});
const handleAddData = () => {
changeData("add", "allergies", null, newItem);
setNewItem(contentItem);
handleClose();
};
return (
<>
{/* Button Modal */}
<>
<UpdateBtn updateData={updateData} loading={loading} />
<AddBtn handleOpen={handleOpen} />
</>
{/* Content Modal */}
<Modal open={open} onClose={handleClose} className="w-full">
<div
style={styleDefault}
className="!px-[16px] !overflow-auto md:!min-w-[580px] md:!px-[24px] lg:!px-[32px] !py-[24px] !bg-[#FFF] !rounded-[8px] !shadow-[0px_1px_24.8px_0px_rgba(204,_204,_204,_0.18)]
!w-full md:!w-fit !h-full md:!h-fit !flex !flex-col !justify-between !max-h-screen md:!max-h-[calc(100%_-_32px)]"
>
<div>
<div className="flex justify-between w-full">
<p className="text-[#3B3B3B] text-[20px] font-bold">
اضافه کردن آلرژی
</p>
<Button onClick={handleClose} className="!p-1" variant="text">
<CloseModalD />
</Button>
</div>
<Content setData={setNewItem} />
</div>
<Button
className="!mt-[32px] md:!mt-[36px] lg:!mt-[40px] !px-3 !py-2 !text-[16px] !font-medium !w-fit !mr-auto"
onClick={handleAddData}
disabled={
!newItem.reaction || !newItem.severity || !newItem.substance
}
variant="contained"
>
اضافه کردن
</Button>
</div>
</Modal>
</>
);
}
export default ModalAddAlergie;