handle register & retry code & edit phone number & fix bug select city and state & add basic modal to all tabs in dashboard

This commit is contained in:
Ehsan
2025-05-29 05:07:11 +03:30
parent c8e8048d6c
commit e12e6c171c
18 changed files with 313 additions and 34 deletions
-1
View File
@@ -12,7 +12,6 @@ export default async function Clinics() {
);
const clinics = response.data.$data;
console.log(clinics);
return (
<Layout name="/clinics">
+3 -1
View File
@@ -11,6 +11,7 @@ function AutoCompleteSelect({
disabled = false,
listboxProps,
sendAll,
name,
}) {
return (
<Autocomplete
@@ -29,7 +30,8 @@ function AutoCompleteSelect({
updateData(
newValue && sendAll
? newValue
: (newValue && !sendAll && newValue.label) || ""
: (newValue && !sendAll && newValue.label) || "",
name
);
}}
sx={{
+2 -2
View File
@@ -30,12 +30,12 @@ function ModalSearchCity({
useEffect(() => {
if (provinceSelected) {
const selectedState = states.find(
(state) => state.label === provinceSelected,
(state) => state.label === provinceSelected
);
if (selectedState) {
const stateId = selectedState.id;
const filteredCities = cities.filter(
(city) => city.province_id === stateId,
(city) => city.province_id === stateId
);
setFilteredCities(filteredCities);
}
@@ -2,10 +2,11 @@ import PlusB from "@/components/icons/PlusB";
import { Button } from "@mui/material";
import React from "react";
function AddBtn() {
function AddBtn({ handleOpen }) {
return (
<Button
className="!bg-[#5559CE] !w-fit !shadow-none !rounded-[4px] !gap-[4px] !text-[#EFEFEF] !text-[14px] md:!text-[16px] !font-medium"
onClick={handleOpen}
variant="contained"
>
<PlusB />
@@ -4,18 +4,18 @@ import EditB from "@/components/icons/EditB";
import TrashB from "@/components/icons/TrashB";
import { Button, TableCell, TableRow } from "@mui/material";
import Head from "../../components/Head";
import AddBtn from "../../components/AddBtn";
import UpdateBtn from "../../components/UpdateBtn";
import { useState } from "react";
import ModalAddAlergie from "./modal";
function Allergies({ data }) {
const tableHead = ["ردیف", "ماده آلرژی‌زا", "واکنش", "شدت", ""];
const centerTable = [0];
const [open, setOpen] = useState(false);
return (
<div>
<Head text="لیست آلرژی ها">
<UpdateBtn />
<AddBtn />
<ModalAddAlergie open={open} setOpen={setOpen} />
</Head>
<CustomTable
zeroRadius={true}
@@ -0,0 +1,27 @@
import FieldLabel from "@/components/contactUs/FieldLabel";
import Field from "@/app/component/Field";
import AutoCompleteSelect from "@/app/component/element/AutoCompleteSelect";
const listIntensity = [
{ label: "خفیف" },
{ label: "متوسط" },
{ label: "شدید" },
];
function Content() {
return (
<div className="mt-[32px] md:mt-[36px] lg:mt-[40px] flex flex-col gap-[24px] md:gap-[28px] lg:gap-[32px] px-0 sm:px-[52px]">
<FieldLabel title="ماده آلرژی‌زا">
<Field isPlaceHolder={true} title="" type="text" />
</FieldLabel>
<FieldLabel title="واکنش">
<Field isPlaceHolder={true} title="" type="text" />
</FieldLabel>
<FieldLabel title="ماده آلرژی‌زا">
<AutoCompleteSelect list={listIntensity} label="شدت" />
</FieldLabel>
</div>
);
}
export default Content;
@@ -0,0 +1,45 @@
import { styleDefault } from "@/mui";
import AddBtn from "../../../components/AddBtn";
import UpdateBtn from "../../../components/UpdateBtn";
import { Button, Modal } from "@mui/material";
import Content from "./Content";
function ModalAddAlergie({ open, setOpen }) {
const handleOpen = () => setOpen(true);
const handleClose = () => setOpen(false);
return (
<>
{/* Button Modal */}
<>
<UpdateBtn />
<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>
</div>
<Content />
</div>
<Button
className="!mt-[32px] md:!mt-[36px] lg:!mt-[40px] !px-3 !py-2 !text-[16px] !font-medium !w-fit !mr-auto"
onClick={handleClose}
variant="contained"
>
اعمال تغییرات
</Button>
</div>
</Modal>
</>
);
}
export default ModalAddAlergie;
@@ -4,18 +4,18 @@ import EditB from "@/components/icons/EditB";
import TrashB from "@/components/icons/TrashB";
import { Button, TableCell, TableRow } from "@mui/material";
import Head from "../../components/Head";
import AddBtn from "../../components/AddBtn";
import UpdateBtn from "../../components/UpdateBtn";
import { useState } from "react";
import ModalAddHistory from "./modal";
function FamilyHistory({ data }) {
const tableHead = ["ردیف", "بیماری", "نسبت خانوادگی", ""];
const centerTable = [0];
const [open, setOpen] = useState(false);
return (
<div>
<Head text="لیست سابقه خانوادگی بیماری">
<UpdateBtn />
<AddBtn />
<ModalAddHistory open={open} setOpen={setOpen} />
</Head>
<CustomTable
zeroRadius={true}
@@ -0,0 +1,44 @@
import { styleDefault } from "@/mui";
import AddBtn from "../../../components/AddBtn";
import UpdateBtn from "../../../components/UpdateBtn";
import { Button, Modal } from "@mui/material";
function ModalAddHistory({ open, setOpen }) {
const handleOpen = () => setOpen(true);
const handleClose = () => setOpen(false);
return (
<>
{/* Button Modal */}
<>
<UpdateBtn />
<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>
</div>
{/* <Content /> */}
</div>
<Button
className="!mt-[32px] md:!mt-[36px] lg:!mt-[40px] !px-3 !py-2 !text-[16px] !font-medium !w-fit !mr-auto"
onClick={handleClose}
variant="contained"
>
اعمال تغییرات
</Button>
</div>
</Modal>
</>
);
}
export default ModalAddHistory;
@@ -4,18 +4,18 @@ import EditB from "@/components/icons/EditB";
import TrashB from "@/components/icons/TrashB";
import { Button, TableCell, TableRow } from "@mui/material";
import Head from "../../components/Head";
import AddBtn from "../../components/AddBtn";
import UpdateBtn from "../../components/UpdateBtn";
import ModalAddMedications from "./modal";
import { useState } from "react";
function Medications({ data }) {
const tableHead = ["ردیف", "نام دارو", "دوز مصرفی", "تعداد و زمان مصرف", ""];
const centerTable = [0];
const [open, setOpen] = useState(false);
return (
<div>
<Head text="لیست دارو های مصرفی">
<UpdateBtn />
<AddBtn />
<ModalAddMedications open={open} setOpen={setOpen} />
</Head>
<CustomTable
zeroRadius={true}
@@ -0,0 +1,44 @@
import { styleDefault } from "@/mui";
import AddBtn from "../../../components/AddBtn";
import UpdateBtn from "../../../components/UpdateBtn";
import { Button, Modal } from "@mui/material";
function ModalAddMedications({ open, setOpen }) {
const handleOpen = () => setOpen(true);
const handleClose = () => setOpen(false);
return (
<>
{/* Button Modal */}
<>
<UpdateBtn />
<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>
</div>
{/* <Content /> */}
</div>
<Button
className="!mt-[32px] md:!mt-[36px] lg:!mt-[40px] !px-3 !py-2 !text-[16px] !font-medium !w-fit !mr-auto"
onClick={handleClose}
variant="contained"
>
اعمال تغییرات
</Button>
</div>
</Modal>
</>
);
}
export default ModalAddMedications;
@@ -4,18 +4,18 @@ import EditB from "@/components/icons/EditB";
import TrashB from "@/components/icons/TrashB";
import { Button, TableCell, TableRow, Tooltip } from "@mui/material";
import Head from "../../components/Head";
import AddBtn from "../../components/AddBtn";
import UpdateBtn from "../../components/UpdateBtn";
import ModalAddRelatives from "./modal";
import { useState } from "react";
function Relatives({ data }) {
const tableHead = ["ردیف", "نام", "نسبت", "شماره تماس", "آدرس", ""];
const centerTable = [0];
const [open, setOpen] = useState(false);
return (
<div>
<Head text="لیست بستگان">
<UpdateBtn />
<AddBtn />
<ModalAddRelatives open={open} setOpen={setOpen} />
</Head>
<CustomTable
zeroRadius={true}
@@ -0,0 +1,44 @@
import { styleDefault } from "@/mui";
import AddBtn from "../../../components/AddBtn";
import UpdateBtn from "../../../components/UpdateBtn";
import { Button, Modal } from "@mui/material";
function ModalAddRelatives({ open, setOpen }) {
const handleOpen = () => setOpen(true);
const handleClose = () => setOpen(false);
return (
<>
{/* Button Modal */}
<>
<UpdateBtn />
<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>
</div>
{/* <Content /> */}
</div>
<Button
className="!mt-[32px] md:!mt-[36px] lg:!mt-[40px] !px-3 !py-2 !text-[16px] !font-medium !w-fit !mr-auto"
onClick={handleClose}
variant="contained"
>
اعمال تغییرات
</Button>
</div>
</Modal>
</>
);
}
export default ModalAddRelatives;
@@ -4,8 +4,8 @@ import EditB from "@/components/icons/EditB";
import TrashB from "@/components/icons/TrashB";
import { Button, TableCell, TableRow } from "@mui/material";
import Head from "../../components/Head";
import AddBtn from "../../components/AddBtn";
import UpdateBtn from "../../components/UpdateBtn";
import ModalAddSurgeries from "./modal";
import { useState } from "react";
function Surgeries({ data }) {
const tableHead = [
@@ -16,12 +16,12 @@ function Surgeries({ data }) {
"",
];
const centerTable = [0, 3];
const [open, setOpen] = useState(false);
return (
<div>
<Head text="لیست جراحی ها">
<UpdateBtn />
<AddBtn />
<ModalAddSurgeries open={open} setOpen={setOpen} />
</Head>
<CustomTable
zeroRadius={true}
@@ -0,0 +1,44 @@
import { styleDefault } from "@/mui";
import AddBtn from "../../../components/AddBtn";
import UpdateBtn from "../../../components/UpdateBtn";
import { Button, Modal } from "@mui/material";
function ModalAddSurgeries({ open, setOpen }) {
const handleOpen = () => setOpen(true);
const handleClose = () => setOpen(false);
return (
<>
{/* Button Modal */}
<>
<UpdateBtn />
<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>
</div>
{/* <Content /> */}
</div>
<Button
className="!mt-[32px] md:!mt-[36px] lg:!mt-[40px] !px-3 !py-2 !text-[16px] !font-medium !w-fit !mr-auto"
onClick={handleClose}
variant="contained"
>
اعمال تغییرات
</Button>
</div>
</Modal>
</>
);
}
export default ModalAddSurgeries;
+1
View File
@@ -18,6 +18,7 @@ function RegisterPage({ matchedCity }) {
num={num}
uuid={uuid}
setStep={false}
setUuid={setUuid}
setIsSendMsg={setIsSendMsg}
/>
) : (
+29 -7
View File
@@ -1,8 +1,10 @@
import RetryLogin from "@/components/icons/RetryLogin";
import { changeNumToDefault } from "@/helper";
import { request } from "@/services/response";
import { Button } from "@mui/material";
const time_resend_code = 120;
function Recode({ retryIcon, timer, setTimer }) {
function Recode({ retryIcon, timer, setUuid, num, setTimer }) {
const handleTimer = () => {
setTimer("loading");
setTimeout(() => {
@@ -17,18 +19,38 @@ function Recode({ retryIcon, timer, setTimer }) {
}, 1000);
};
const rotateIcon = () => {
retryIcon.current.classList.add("retry-icon");
setTimeout(() => {
retryIcon.current && retryIcon.current.classList.remove("retry-icon");
}, 1000);
};
const handleReq = () => {
rotateIcon();
const interval = setInterval(() => {
rotateIcon();
}, 1200);
request
.sendCode(changeNumToDefault(num), "")
.then((response) => {
clearInterval(interval);
if (response.uuid) {
setUuid(response.uuid);
handleTimer();
}
})
.catch(() => clearInterval(interval));
};
return (
<Button
className="flex !p-1 items-center justify-start gap-1 hover-rotate-90 cursor-pointer"
disabled={typeof timer === "number" && timer !== 0}
onClick={() => {
if (!timer && timer !== "loading") {
handleTimer();
retryIcon.current.classList.add("retry-icon");
setTimeout(() => {
retryIcon.current &&
retryIcon.current.classList.remove("retry-icon");
}, 1000);
// handleTimer();
handleReq();
}
}}
>
@@ -9,7 +9,7 @@ import ArrowRightS from "../../icons/ArrowRightS";
import Recode from "./Recode";
import SendReq from "./SendReq";
function VerificationPage({ setIsSendMsg, uuid, link, num, setStep }) {
function VerificationPage({ setIsSendMsg, uuid, link, setUuid, num, setStep }) {
const retryIcon = useRef();
const [timer, setTimer] = useState(0);
@@ -99,7 +99,13 @@ function VerificationPage({ setIsSendMsg, uuid, link, num, setStep }) {
</p>
</Button>
<Recode retryIcon={retryIcon} timer={timer} setTimer={setTimer} />
<Recode
num={num}
timer={timer}
setUuid={setUuid}
setTimer={setTimer}
retryIcon={retryIcon}
/>
</div>
</div>
<SendReq