122 lines
4.0 KiB
TypeScript
122 lines
4.0 KiB
TypeScript
'use client'
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
import { Input } from "@/components/ui/input";
|
|
import { Label } from "@/components/ui/label";
|
|
import Link from 'next/link'
|
|
import { useForm, SubmitHandler } from "react-hook-form"
|
|
import axios, {AxiosInstance, AxiosResponse} from "axios";
|
|
import {useState} from "react";
|
|
import {
|
|
Popover,
|
|
PopoverContent,
|
|
PopoverTrigger,
|
|
} from "@/components/ui/popover"
|
|
|
|
import {useRouter} from "next/navigation";
|
|
import Image from "next/image";
|
|
|
|
type Inputs = {
|
|
mobile: number
|
|
}
|
|
|
|
const Page = ()=>{
|
|
|
|
const router = useRouter()
|
|
|
|
const [errorMessage, setErrorMessage] = useState<string | null>(null)
|
|
|
|
const {
|
|
register,
|
|
handleSubmit,
|
|
watch,
|
|
formState: { errors },
|
|
} = useForm<Inputs>()
|
|
const onSubmit: SubmitHandler<Inputs> = async (data) => {
|
|
|
|
try {
|
|
setErrorMessage(null)
|
|
const result: AxiosResponse = await axios.post(`${process.env.NEXT_PUBLIC_API_URL}/auth/mojri/mobile/`,data)
|
|
if (result.status === 200) {
|
|
router.push(`/login/${data.mobile}/`)
|
|
} else {
|
|
setErrorMessage("خطا در ارسال کد ورورد")
|
|
}
|
|
} catch (e: any) {
|
|
setErrorMessage("شماره موبایل صحیح نیست!")
|
|
}
|
|
|
|
}
|
|
|
|
|
|
return (
|
|
<div className="bg-slate-200 h-screen pt-4">
|
|
<div className="drop-shadow-md flex flex-col w-[90%] md:w-[400px] m-auto p-4 bg-white rounded-lg">
|
|
|
|
<div className="flex flex-col mb-8 text-center items-center justify-center">
|
|
|
|
<Image src={'/logo.png'} width={200} height={100} alt={'a'}/>
|
|
|
|
|
|
</div>
|
|
|
|
<form onSubmit={handleSubmit(onSubmit)} className="flex flex-col gap-y-2">
|
|
|
|
<div>
|
|
<Label>
|
|
شماره موبایل
|
|
<Input type={'text'} {...register("mobile", {
|
|
required: "شماره موبایل الزامی است",
|
|
pattern: {
|
|
value: /^(\+98|0)?9\d{9}$/,
|
|
message: "شماره موبایل وارد شده صحیح نیست"
|
|
}
|
|
})}/>
|
|
</Label>
|
|
<p className={'text-sm mt-1'}>{errors?.mobile?.message}</p>
|
|
</div>
|
|
|
|
|
|
<div className="text-center">
|
|
<Button className="bg-blue-600">ارسال کد ورود</Button>
|
|
</div>
|
|
|
|
<p>{errorMessage}</p>
|
|
|
|
</form>
|
|
|
|
<div className="border-b-[1px] border-slate-200 mt-4 mb-4"></div>
|
|
|
|
<div className="flex flex-col gap-y-2">
|
|
|
|
<p className="text-center text-xs">در صورتی که هنوز عضو نیستید ابتدا ثبت نام کنید</p>
|
|
|
|
<div className="text-center">
|
|
<Link href="/register" className="bg-red-800 text-xs p-[0.4rem] m-0 rounded-md text-white">ثبت نام در باشگاه</Link>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
<div className={'flex flex-row justify-center'}>
|
|
<Popover>
|
|
<PopoverTrigger className={'text-center m-auto'}>
|
|
<p className={'text-center text-gray-500 text-sm mt-2 underline'}>
|
|
برنامه نویسی و توسعه: واحد فناوری اطلاعات (محمد جواد فصاحت)
|
|
</p>
|
|
</PopoverTrigger>
|
|
<PopoverContent className={'text-center text-sm m-auto'}>
|
|
تلفن تماس : 09202202129
|
|
</PopoverContent>
|
|
</Popover>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
)
|
|
}
|
|
|
|
export default Page; |