handle all pages dashboard & register api

This commit is contained in:
Ehsan
2025-05-24 22:17:55 +03:30
parent 7dfad1847a
commit 5fa740ad1b
19 changed files with 549 additions and 182 deletions
+2 -2
View File
@@ -12,7 +12,7 @@ import Detail from "@/components/booking/detail";
import FailedPay from "@/components/booking/failedPay"; import FailedPay from "@/components/booking/failedPay";
import LogInPage from "@/components/register/LogInPage"; import LogInPage from "@/components/register/LogInPage";
import SuccessPay from "@/components/booking/successPay"; import SuccessPay from "@/components/booking/successPay";
import SetCodePage from "@/components/register/SetCodePage"; import VerificationPage from "@/components/register/verificationPage";
function BookingPage({ slug, matchedCity }) { function BookingPage({ slug, matchedCity }) {
const doctor = doctors.find((item) => item.id === +slug); const doctor = doctors.find((item) => item.id === +slug);
@@ -29,7 +29,7 @@ function BookingPage({ slug, matchedCity }) {
const elements = [ const elements = [
<Date doctor={doctor} setStep={setStep} />, <Date doctor={doctor} setStep={setStep} />,
<LogInPage setIsSendMsg={false} setStep={setStep} />, <LogInPage setIsSendMsg={false} setStep={setStep} />,
<SetCodePage setIsSendMsg={false} link={false} setStep={setStep} />, <VerificationPage setIsSendMsg={false} link={false} setStep={setStep} />,
<Detail <Detail
isForAnother={isForAnother} isForAnother={isForAnother}
setIsForAnother={setIsForAnother} setIsForAnother={setIsForAnother}
@@ -0,0 +1,22 @@
import PlusB from "@/components/icons/PlusB";
import { Button } from "@mui/material";
import React from "react";
function Head({ text }) {
return (
<div className="w-full flex mb-[40px] items-center justify-between">
<p className="text-[#525252] dark:text-[#A1A1A1] text-[20px] font-bold">
{text}
</p>
<Button
className="!bg-[#5559CE] !w-fit !shadow-none !rounded-[4px] !gap-[4px] !text-[#EFEFEF] !text-[14px] md:!text-[16px] !font-medium"
variant="contained"
>
<PlusB />
اضافه کردن
</Button>
</div>
);
}
export default Head;
@@ -11,7 +11,6 @@ function HeadTab({
setIsTurnsDetails, setIsTurnsDetails,
components, components,
}) { }) {
return ( return (
<> <>
{isTurnsDetails ? ( {isTurnsDetails ? (
@@ -50,9 +49,7 @@ function HeadTab({
handleChange={handleChange} handleChange={handleChange}
/> />
</div> </div>
<div className="mt-[24px] sm:mt-[28px] md:mt-[32px] px-0 md:px-[24px]"> <div className="mt-[22px] px-0 md:px-[24px]">{components[tab]}</div>
{components[tab]}
</div>
</> </>
)} )}
</> </>
@@ -34,6 +34,7 @@ function ContentTabs({
}) { }) {
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [tab, setTab] = useState(0); const [tab, setTab] = useState(0);
const data = profileData[0];
const handleChange = (event, newValue) => { const handleChange = (event, newValue) => {
// setValue(newValue); // setValue(newValue);
@@ -57,12 +58,12 @@ function ContentTabs({
// <Comments user={user} loading={loading} />, // <Comments user={user} loading={loading} />,
// <Messages user={user} loading={loading} />, // <Messages user={user} loading={loading} />,
// <NotfoundDashboard />, // <NotfoundDashboard />,
<Disease data={profileData} />, <Disease data={data} />,
<Allergies />, <Allergies data={data} />,
<Medications />, <Medications data={data} />,
<Surgeries />, <Surgeries data={data} />,
<FamilyHistory />, <FamilyHistory data={data} />,
<Relatives />, <Relatives data={data} />,
]; ];
return ( return (
@@ -1,7 +1,68 @@
function Allergies() { import CustomTable from "@/app/component/CustomTable";
import TextLoading from "@/app/component/loading/Text";
import EditB from "@/components/icons/EditB";
import TrashB from "@/components/icons/TrashB";
import { Button, TableCell, TableRow } from "@mui/material";
import Head from "../../components/Head";
function Allergies({ data }) {
const tableHead = ["ردیف", "ماده آلرژی‌زا", "واکنش", "شدت", ""];
const centerTable = [0];
return ( return (
<div>Allergies</div> <div>
) <Head text="لیست آلرژی ها" />
<CustomTable
zeroRadius={true}
tableHead={tableHead}
centerTable={centerTable}
>
{data.allergies.map((row, idx) => (
<TableRow
key={idx}
className="!border-0 !border-b !border-[#DBDBDB] dark:!border-transparent"
>
<TableCell
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="center"
>
<TextLoading width={15} height={18} loading={false}>
{idx + 1}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.substance}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.reaction}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.severity}
</TextLoading>
</TableCell>
<TableCell
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="right"
>
<div className="flex items-center justify-center gap-[4px]">
<Button className="!min-w-fit !p-1" variant="text">
<TrashB />
</Button>
<Button className="!min-w-fit !p-1" variant="text">
<EditB />
</Button>
</div>
</TableCell>
</TableRow>
))}
</CustomTable>
</div>
);
} }
export default Allergies export default Allergies;
@@ -1,20 +1,23 @@
import CustomTable from "@/app/component/CustomTable"; import CustomTable from "@/app/component/CustomTable";
import CircularLoading from "@/app/component/loading/Circular";
import TextLoading from "@/app/component/loading/Text"; import TextLoading from "@/app/component/loading/Text";
import { TableCell, TableRow } from "@mui/material"; import EditB from "@/components/icons/EditB";
import TrashB from "@/components/icons/TrashB";
import { Button, Switch, TableCell, TableRow } from "@mui/material";
import Head from "../../components/Head";
function Disease({ data }) { function Disease({ data }) {
const tableHead = ["شماره", "اسم", "وضعیت"]; const tableHead = ["ردیف", "اسم", "وضعیت", ""];
const centerTable = [0, 4]; const centerTable = [0];
return ( return (
<div className="hidden md:flex"> <div>
<Head text="لیست بیماری ها" />
<CustomTable <CustomTable
zeroRadius={true} zeroRadius={true}
tableHead={tableHead} tableHead={tableHead}
centerTable={centerTable} centerTable={centerTable}
> >
{data.map((row, idx) => ( {data.disease.map((row, idx) => (
<TableRow <TableRow
key={idx} key={idx}
className="!border-0 !border-b !border-[#DBDBDB] dark:!border-transparent" className="!border-0 !border-b !border-[#DBDBDB] dark:!border-transparent"
@@ -27,21 +30,29 @@ function Disease({ data }) {
{idx + 1} {idx + 1}
</TextLoading> </TextLoading>
</TableCell> </TableCell>
<TableCell <TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="center"
>
<TextLoading width={15} height={18} loading={false}> <TextLoading width={15} height={18} loading={false}>
{row.name} {row.name}
</TextLoading> </TextLoading>
</TableCell> </TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{/* {row.status} */}
<Switch defaultChecked={row.status === "true"} />
</TextLoading>
</TableCell>
<TableCell <TableCell
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap" className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="center" align="right"
> >
<TextLoading width={15} height={18} loading={false}> <div className="flex items-center justify-center gap-[4px]">
{row.status} <Button className="!min-w-fit !p-1" variant="text">
</TextLoading> <TrashB />
</Button>
<Button className="!min-w-fit !p-1" variant="text">
<EditB />
</Button>
</div>
</TableCell> </TableCell>
</TableRow> </TableRow>
))} ))}
@@ -1,7 +1,63 @@
function FamilyHistory() { import CustomTable from "@/app/component/CustomTable";
import TextLoading from "@/app/component/loading/Text";
import EditB from "@/components/icons/EditB";
import TrashB from "@/components/icons/TrashB";
import { Button, TableCell, TableRow } from "@mui/material";
import Head from "../../components/Head";
function FamilyHistory({ data }) {
const tableHead = ["ردیف", "بیماری", "نسبت خانوادگی", ""];
const centerTable = [0];
return ( return (
<div>FamilyHistory</div> <div>
) <Head text="لیست سابقه خانوادگی بیماری" />
<CustomTable
zeroRadius={true}
tableHead={tableHead}
centerTable={centerTable}
>
{data.family_history.map((row, idx) => (
<TableRow
key={idx}
className="!border-0 !border-b !border-[#DBDBDB] dark:!border-transparent"
>
<TableCell
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="center"
>
<TextLoading width={15} height={18} loading={false}>
{idx + 1}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.disease}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.relation}
</TextLoading>
</TableCell>
<TableCell
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="right"
>
<div className="flex items-center justify-center gap-[4px]">
<Button className="!min-w-fit !p-1" variant="text">
<TrashB />
</Button>
<Button className="!min-w-fit !p-1" variant="text">
<EditB />
</Button>
</div>
</TableCell>
</TableRow>
))}
</CustomTable>
</div>
);
} }
export default FamilyHistory export default FamilyHistory;
@@ -1,7 +1,68 @@
function Medications() { import CustomTable from "@/app/component/CustomTable";
import TextLoading from "@/app/component/loading/Text";
import EditB from "@/components/icons/EditB";
import TrashB from "@/components/icons/TrashB";
import { Button, TableCell, TableRow } from "@mui/material";
import Head from "../../components/Head";
function Medications({ data }) {
const tableHead = ["ردیف", "نام دارو", "دوز مصرفی", "تعداد و زمان مصرف", ""];
const centerTable = [0];
return ( return (
<div>Medications</div> <div>
) <Head text="لیست دارو های مصرفی" />
<CustomTable
zeroRadius={true}
tableHead={tableHead}
centerTable={centerTable}
>
{data.medications.map((row, idx) => (
<TableRow
key={idx}
className="!border-0 !border-b !border-[#DBDBDB] dark:!border-transparent"
>
<TableCell
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="center"
>
<TextLoading width={15} height={18} loading={false}>
{idx + 1}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.name}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.dose}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.frequency}
</TextLoading>
</TableCell>
<TableCell
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="right"
>
<div className="flex items-center justify-center gap-[4px]">
<Button className="!min-w-fit !p-1" variant="text">
<TrashB />
</Button>
<Button className="!min-w-fit !p-1" variant="text">
<EditB />
</Button>
</div>
</TableCell>
</TableRow>
))}
</CustomTable>
</div>
);
} }
export default Medications export default Medications;
@@ -1,7 +1,84 @@
function Relatives() { import CustomTable from "@/app/component/CustomTable";
import TextLoading from "@/app/component/loading/Text";
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";
function Relatives({ data }) {
const tableHead = ["ردیف", "نام", "نسبت", "شماره تماس", "ایمیل", "آدرس", ""];
const centerTable = [0];
return ( return (
<div>Relatives</div> <div>
) <Head text="لیست بستگان" />
<CustomTable
zeroRadius={true}
tableHead={tableHead}
centerTable={centerTable}
>
{data.relatives.map((row, idx) => (
<TableRow
key={idx}
className="!border-0 !border-b !border-[#DBDBDB] dark:!border-transparent"
>
<TableCell
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="center"
>
<TextLoading width={15} height={18} loading={false}>
{idx + 1}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.name}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.relation}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{`${row.contact.phone?.replace("+", "")}+`}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.contact.email}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<Tooltip title={row.contact.address || ""} arrow>
<div className="truncate max-w-[150px] cursor-default">
<TextLoading width={15} height={18} loading={false}>
{(row.contact.address || "").substring(0, 15)}
{row.contact.address?.length > 15 ? "…" : ""}
</TextLoading>
</div>
</Tooltip>
</TableCell>
<TableCell
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="right"
>
<div className="flex items-center justify-center gap-[4px]">
<Button className="!min-w-fit !p-1" variant="text">
<TrashB />
</Button>
<Button className="!min-w-fit !p-1" variant="text">
<EditB />
</Button>
</div>
</TableCell>
</TableRow>
))}
</CustomTable>
</div>
);
} }
export default Relatives export default Relatives;
@@ -1,7 +1,77 @@
function Surgeries() { import CustomTable from "@/app/component/CustomTable";
import TextLoading from "@/app/component/loading/Text";
import EditB from "@/components/icons/EditB";
import TrashB from "@/components/icons/TrashB";
import { Button, TableCell, TableRow } from "@mui/material";
import Head from "../../components/Head";
function Surgeries({ data }) {
const tableHead = [
"ردیف",
"نوع جراحی",
"نام بیمارستان",
"سال انجام جراحی",
"",
];
const centerTable = [0, 3];
return ( return (
<div>Surgeries</div> <div>
) <Head text="لیست جراحی ها" />
<CustomTable
zeroRadius={true}
tableHead={tableHead}
centerTable={centerTable}
>
{data.surgeries.map((row, idx) => (
<TableRow
key={idx}
className="!border-0 !border-b !border-[#DBDBDB] dark:!border-transparent"
>
<TableCell
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="center"
>
<TextLoading width={15} height={18} loading={false}>
{idx + 1}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.type}
</TextLoading>
</TableCell>
<TableCell className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap">
<TextLoading width={15} height={18} loading={false}>
{row.hospital}
</TextLoading>
</TableCell>
<TableCell
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="center"
>
<TextLoading width={15} height={18} loading={false}>
{row.year}
</TextLoading>
</TableCell>
<TableCell
className="!pr-[18px] dark:!border-transparent !text-[#616161] dark:!text-[#A1A1A1] !text-[16px] !font-medium !text-nowrap"
align="right"
>
<div className="flex items-center justify-center gap-[4px]">
<Button className="!min-w-fit !p-1" variant="text">
<TrashB />
</Button>
<Button className="!min-w-fit !p-1" variant="text">
<EditB />
</Button>
</div>
</TableCell>
</TableRow>
))}
</CustomTable>
</div>
);
} }
export default Surgeries export default Surgeries;
@@ -2,7 +2,6 @@ import { useState } from "react";
import Form from "./Form"; import Form from "./Form";
import { styleDefault } from "@/mui"; import { styleDefault } from "@/mui";
import { Box, Button, Modal } from "@mui/material"; import { Box, Button, Modal } from "@mui/material";
import { validate_phone_number } from "./validate";
// Icons // Icons
import PlusB from "@/components/icons/PlusB"; import PlusB from "@/components/icons/PlusB";
+2 -2
View File
@@ -1,7 +1,7 @@
"use client"; "use client";
import RegisterPage from "@/components/register"; import RegisterPage from "@/components/register";
import SetCodePage from "@/components/register/SetCodePage"; import VerificationPage from "@/components/register/verificationPage";
import LogInPage from "@/components/register/LogInPage"; import LogInPage from "@/components/register/LogInPage";
import { useState } from "react"; import { useState } from "react";
@@ -11,7 +11,7 @@ function ContentVerify() {
return ( return (
<RegisterPage> <RegisterPage>
{isSendMsg ? ( {isSendMsg ? (
<SetCodePage <VerificationPage
setIsSendMsg={setIsSendMsg} setIsSendMsg={setIsSendMsg}
link={`/account/${localStorage.getItem("doctor-id")}`} link={`/account/${localStorage.getItem("doctor-id")}`}
/> />
+30 -31
View File
@@ -25,38 +25,37 @@ function LogInPage({ setIsSendMsg, num, setNum, matchedCity }) {
// } // }
}; };
const handleReq = async () => { const handleReq = async () => {
try { // try {
const res = await axios.post( // const res = await axios.post(
"https://back-dev.clinic-pro.ir/api/v1/user/auth?_format=json", // "https://back-dev.clinic-pro.ir/api/v1/user/auth?_format=json",
{ mobile_number: changeNumToDefault(num) }, // { mobile_number: changeNumToDefault(num) },
{ // {
withCredentials: true, // withCredentials: true,
headers: { // headers: {
"Content-Type": "application/json", // "Content-Type": "application/json",
}, // },
}
);
console.log(res);
if (res.data) {
setIsSendMsg(true);
}
} catch (err) {
console.error("Request failed:", err);
}
// setLoading(true);
// request
// .sendCode(changeNumToDefault(num))
// .then((response) => {
// setLoading(false);
// if (response) {
// // setNum("");
// setIsSendMsg(true);
// } // }
// }) // );
// .catch(() => { // console.log(res);
// setLoading(false); // if (res.data) {
// }); // setIsSendMsg(true);
// }
// } catch (err) {
// console.error("Request failed:", err);
// }
setLoading(true);
request
.sendCode(changeNumToDefault(num))
.then((response) => {
setLoading(false);
if (response) {
// setNum("");
setIsSendMsg(true);
}
})
.catch(() => {
setLoading(false);
});
}; };
return ( return (
+2 -2
View File
@@ -1,6 +1,6 @@
"use client"; "use client";
import SetCodePage from "@/components/register/SetCodePage"; import VerificationPage from "@/components/register/verificationPage";
import LogInPage from "@/components/register/LogInPage"; import LogInPage from "@/components/register/LogInPage";
import { useState } from "react"; import { useState } from "react";
import LayoutRegister from "./LayoutRegister"; import LayoutRegister from "./LayoutRegister";
@@ -12,7 +12,7 @@ function RegisterPage({ matchedCity }) {
return ( return (
<LayoutRegister matchedCity={matchedCity}> <LayoutRegister matchedCity={matchedCity}>
{isSendMsg ? ( {isSendMsg ? (
<SetCodePage <VerificationPage
num={num} num={num}
setIsSendMsg={setIsSendMsg} setIsSendMsg={setIsSendMsg}
setStep={false} setStep={false}
@@ -0,0 +1,53 @@
import RetryLogin from "@/components/icons/RetryLogin";
import { Button } from "@mui/material";
const time_resend_code = 120;
function Recode({ retryIcon, timer, setTimer }) {
const handleTimer = () => {
setTimer("loading");
setTimeout(() => {
setTimer(time_resend_code);
let timePresent = time_resend_code;
const timerInterval = setInterval(() => {
timePresent--;
setTimer(timePresent);
!timePresent && clearInterval(timerInterval);
}, 1000);
}, 1000);
};
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);
}
}}
>
{timer && timer !== "loading" ? (
<p className="text-[#F17732] text-[14px] font-normal select-none">
{timer} ثانیه
</p>
) : (
<>
<div ref={retryIcon}>
<RetryLogin />
</div>
<p className="text-[#F17732] text-[14px] font-normal select-none">
دریافت مجدد کد
</p>
</>
)}
</Button>
);
}
export default Recode;
@@ -1,17 +1,14 @@
import { useRef, useState } from "react"; import { useRef, useState } from "react";
import { Button } from "@mui/material"; import { Button } from "@mui/material";
import OTPForm from "./element/OTPForm"; import OTPForm from "../element/OTPForm";
import EditLogin from "../icons/EditLogin"; import EditLogin from "../../icons/EditLogin";
import RetryLogin from "../icons/RetryLogin"; import ArrowRightS from "../../icons/ArrowRightS";
import ArrowRightS from "../icons/ArrowRightS";
import { request } from "@/services/response"; import { request } from "@/services/response";
import { changeNumToDefault } from "@/helper"; import { changeNumToDefault } from "@/helper";
import axios from "axios"; import Recode from "./Recode";
const time_resend_code = 120; function VerificationPage({ setIsSendMsg, link, num, setStep }) {
function SetCodePage({ setIsSendMsg, link, num, setStep }) {
const retryIcon = useRef(); const retryIcon = useRef();
const [timer, setTimer] = useState(0); const [timer, setTimer] = useState(0);
@@ -48,58 +45,45 @@ function SetCodePage({ setIsSendMsg, link, num, setStep }) {
} }
}; };
const handleTimer = () => {
setTimer("loading");
setTimeout(() => {
setTimer(time_resend_code);
let timePresent = time_resend_code;
const timerInterval = setInterval(() => {
timePresent--;
setTimer(timePresent);
!timePresent && clearInterval(timerInterval);
}, 1000);
}, 1000);
};
const handleReq = async () => { const handleReq = async () => {
const formData = new URLSearchParams(); // const formData = new URLSearchParams();
formData.append("grant_type", "mobile"); // formData.append("grant_type", "mobile");
formData.append("client_id", process.env.NEXT_PUBLIC_CLIENT_ID); // formData.append("client_id", process.env.NEXT_PUBLIC_CLIENT_ID);
formData.append("client_secret", process.env.NEXT_PUBLIC_CLIENT_SECRET); // formData.append("client_secret", process.env.NEXT_PUBLIC_CLIENT_SECRET);
formData.append("mobile_number", changeNumToDefault(num)); // formData.append("mobile_number", changeNumToDefault(num));
formData.append("code", code.join("")); // formData.append("code", code.join(""));
try { // try {
const res = await axios.post( // const res = await axios.post(
"https://back-dev.clinic-pro.ir/oauth/token", // "https://back-dev.clinic-pro.ir/oauth/token",
formData, // formData,
{ // {
withCredentials: true, // withCredentials: true,
headers: { // headers: {
"Content-Type": "application/x-www-form-urlencoded", // "Content-Type": "application/x-www-form-urlencoded",
}, // },
} // }
); // );
console.log(res); // console.log(res);
} catch (err) { // } catch (err) {
console.error("Request failed:", err); // console.error("Request failed:", err);
} // }
// setLoading(true);
// request setLoading(true);
// .getToken( request
// "mobile", .getToken(
// process.env.NEXT_PUBLIC_CLIENT_ID, "mobile",
// process.env.NEXT_PUBLIC_CLIENT_SECRET, process.env.NEXT_PUBLIC_CLIENT_ID,
// changeNumToDefault(num), process.env.NEXT_PUBLIC_CLIENT_SECRET,
// code.join("") changeNumToDefault(num),
// ) code.join("")
// .then((response) => { )
// setLoading(false); .then((response) => {
// }) setLoading(false);
// .catch((err) => { })
// setLoading(false); .catch((err) => {
// }); setLoading(false);
});
}; };
return ( return (
@@ -120,7 +104,7 @@ function SetCodePage({ setIsSendMsg, link, num, setStep }) {
کد تایید را وارد نمایید کد تایید را وارد نمایید
</p> </p>
<p className="text-[#616161] mt-[16px] sm:mt-[19px] md:mt-[22px] lg:mt-[24px] text-[14px] font-normal text-right"> <p className="text-[#616161] mt-[16px] sm:mt-[19px] md:mt-[22px] lg:mt-[24px] text-[14px] font-normal text-right">
کد تایید برای شماره 09013261200 ارسال شد. کد تایید برای شماره <span dir="ltr">09{num}</span> ارسال شد.
</p> </p>
<div className="mt-[26px] sm:mt-[28px] md:mt-[30px] lg:mt-[32px] mb-[56px] sm:mb-[47px] md:mb-[38px] lg:mb-[30px]"> <div className="mt-[26px] sm:mt-[28px] md:mt-[30px] lg:mt-[32px] mb-[56px] sm:mb-[47px] md:mb-[38px] lg:mb-[30px]">
<div className="mb-[27px]" dir="ltr"> <div className="mb-[27px]" dir="ltr">
@@ -163,35 +147,7 @@ function SetCodePage({ setIsSendMsg, link, num, setStep }) {
</p> </p>
</Button> </Button>
<Button <Recode retryIcon={retryIcon} timer={timer} setTimer={setTimer} />
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);
}
}}
>
{timer && timer !== "loading" ? (
<p className="text-[#F17732] text-[14px] font-normal select-none">
{timer} ثانیه
</p>
) : (
<>
<div ref={retryIcon}>
<RetryLogin />
</div>
<p className="text-[#F17732] text-[14px] font-normal select-none">
دریافت مجدد کد
</p>
</>
)}
</Button>
</div> </div>
</div> </div>
<Button <Button
@@ -215,4 +171,4 @@ function SetCodePage({ setIsSendMsg, link, num, setStep }) {
); );
} }
export default SetCodePage; export default VerificationPage;
+11 -11
View File
@@ -9,7 +9,7 @@
{ {
"id": 2, "id": 2,
"name": "دیابت", "name": "دیابت",
"status": "false" "status": "true"
}, },
{ {
"id": 3, "id": 3,
@@ -19,17 +19,17 @@
{ {
"id": 4, "id": 4,
"name": "بیماری قلبی عروقی", "name": "بیماری قلبی عروقی",
"status": "false" "status": "true"
}, },
{ {
"id": 5, "id": 5,
"name": "سرطان", "name": "سرطان",
"status": "false" "status": "true"
}, },
{ {
"id": 6, "id": 6,
"name": "آلزایمر", "name": "آلزایمر",
"status": "false" "status": "true"
}, },
{ {
"id": 7, "id": 7,
@@ -39,7 +39,7 @@
{ {
"id": 8, "id": 8,
"name": "بیماری کلیوی", "name": "بیماری کلیوی",
"status": "false" "status": "true"
}, },
{ {
"id": 9, "id": 9,
@@ -59,7 +59,7 @@
{ {
"id": 12, "id": 12,
"name": "اضطراب مزمن", "name": "اضطراب مزمن",
"status": "false" "status": "true"
}, },
{ {
"id": 13, "id": 13,
@@ -74,7 +74,7 @@
{ {
"id": 15, "id": 15,
"name": "پرکاری تیروئید", "name": "پرکاری تیروئید",
"status": "false" "status": "true"
}, },
{ {
"id": 16, "id": 16,
@@ -89,7 +89,7 @@
{ {
"id": 18, "id": 18,
"name": "هپاتیت C", "name": "هپاتیت C",
"status": "false" "status": "true"
}, },
{ {
"id": 19, "id": 19,
@@ -99,17 +99,17 @@
{ {
"id": 20, "id": 20,
"name": "COVID-19", "name": "COVID-19",
"status": "false" "status": "true"
}, },
{ {
"id": 21, "id": 21,
"name": "لوپوس", "name": "لوپوس",
"status": "false" "status": "true"
}, },
{ {
"id": 22, "id": 22,
"name": "ام‌اس (MS)", "name": "ام‌اس (MS)",
"status": "false" "status": "true"
}, },
{ {
"id": 23, "id": 23,
+2
View File
@@ -10,6 +10,8 @@ const api = axios.create({
headers: { headers: {
"Content-Type": "application/json", "Content-Type": "application/json",
Authorization: `Bearer ${cookies.get("access")}`, Authorization: `Bearer ${cookies.get("access")}`,
Cookie:
"SESS318c6addec00b99e23988eb0e987826b=HpiIBmiGFlESY-f3IhkXEE5sq0mKVT-loNm5TiTN-UstIzn1",
}, },
}); });
+2
View File
@@ -25,6 +25,8 @@ export const request = {
"Content-Type": "application/x-www-form-urlencoded", "Content-Type": "application/x-www-form-urlencoded",
Authorization: "", Authorization: "",
withCredentials: true, withCredentials: true,
Cookie:
"SESS318c6addec00b99e23988eb0e987826b=HpiIBmiGFlESY-f3IhkXEE5sq0mKVT-loNm5TiTN-UstIzn1",
}, },
}); });
}, },