48 lines
1.9 KiB
JavaScript
48 lines
1.9 KiB
JavaScript
import { Button } from "@mui/material"
|
|
import ArrowRightS from "../icons/ArrowRightS"
|
|
import OTPForm from "./element/OTPForm"
|
|
import ArrowLeftOrangeS from "../icons/ArrowLeftOrangeS"
|
|
|
|
function SetCodePage({ setIsSendMsg }) {
|
|
|
|
const handleOTP = (e) => {
|
|
e.target.nextElementSibling &&
|
|
e.target.nextElementSibling.focus()
|
|
}
|
|
|
|
return (
|
|
<div className='rounded-[16px] mt-[32px] border border-solid border-[#EFEFEF] bg-[#FFF] p-[40px] pb-[48px] min-w-[425px]'>
|
|
<div
|
|
className="cursor-pointer"
|
|
onClick={() => setIsSendMsg(false)}
|
|
>
|
|
<ArrowRightS />
|
|
</div>
|
|
<p className='text-[#525252] mt-4 text-[18px] font-bold'>کد تایید را وارد نمایید</p>
|
|
<p className='text-[#616161] mt-[24px] text-[14px] font-normal text-right'>
|
|
کد تایید برای شماره 09013261200 ارسال شد.
|
|
</p>
|
|
<div className='mt-[32px] mb-[48px]'>
|
|
<div className="w-full mb-[27px] flex items-center justify-center gap-2 sm:gap-6" dir='ltr'>
|
|
<OTPForm handleOTP={handleOTP} />
|
|
<OTPForm handleOTP={handleOTP} />
|
|
<OTPForm handleOTP={handleOTP} />
|
|
<OTPForm handleOTP={handleOTP} />
|
|
<OTPForm handleOTP={handleOTP} />
|
|
</div>
|
|
<Button className="flex items-center justify-start gap-1">
|
|
<p className="text-[#F17732] text-[14px] font-medium">دریافت مجدد کد تایید</p>
|
|
<ArrowLeftOrangeS />
|
|
</Button>
|
|
</div>
|
|
<Button
|
|
fullWidth
|
|
variant='contained'
|
|
onClick={() => setIsSendMsg(true)}
|
|
className='!rounded-[8px] !bg-[#5559CE]'
|
|
>تایید</Button>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default SetCodePage |