Alihaghighattalab
69 lines
3.6 KiB
TypeScript
69 lines
3.6 KiB
TypeScript
import { CardAdd } from "iconsax-react"
|
||
import { DialogComponent } from "../common/dialog"
|
||
import { FC } from "react"
|
||
import { Input } from "../common/input"
|
||
import { Button } from "@headlessui/react"
|
||
import { bankCarts, findBankByPAN } from "../../utility/cart"
|
||
import { Controller, SubmitHandler, useForm } from "react-hook-form"
|
||
import { AddNewCartInterface } from "../../types"
|
||
import { yupResolver } from "@hookform/resolvers/yup"
|
||
import { AddNewCardSchema } from "../../schema"
|
||
import { ErrorComponent } from "../common/error"
|
||
|
||
type Props = {
|
||
isOpen: boolean,
|
||
close: () => void
|
||
}
|
||
export const AddNewCardDialog: FC<Props> = ({ isOpen, close }) => {
|
||
const { handleSubmit, formState: { errors }, control } = useForm<AddNewCartInterface>({
|
||
resolver: yupResolver(AddNewCardSchema)
|
||
})
|
||
const createNewCard: SubmitHandler<AddNewCartInterface> = async (data) => {
|
||
const finalData: any = {
|
||
id: bankCarts?.length + 1,
|
||
bankName: findBankByPAN(data.cartNumber).name,
|
||
bankPersianName: findBankByPAN(data.cartNumber).name_farsi,
|
||
cartNumber: data?.cartNumber.toString(),
|
||
cartOwner: `${data.name} ${data?.family}`,
|
||
shabaNumber: data?.shabaNumber,
|
||
}
|
||
bankCarts.push(finalData)
|
||
close()
|
||
}
|
||
return (
|
||
<DialogComponent isOpen={isOpen} close={close} title="ایجاد حساب بانکی جدید" subTitle="لطفا اطلاعات را با دقت وارد نمایید" icon={<CardAdd color="#11212D" className="size-[50px]" />}>
|
||
<form onSubmit={handleSubmit(createNewCard)} className="flex flex-col gap-[42px] mt-9">
|
||
<div className="w-full flex flex-col gap-6">
|
||
<Controller control={control} name="name" render={({ field }) => (
|
||
<div>
|
||
<Input placeholder="نام صاحب کارت" field={field} className="bg-auth-form" />
|
||
<ErrorComponent show={errors.name} message={errors.name?.message} />
|
||
</div>
|
||
)} />
|
||
<Controller control={control} name="family" render={({ field }) => (
|
||
<div>
|
||
<Input field={field} placeholder="نام خانوادگی صاحب کارت" className="bg-auth-form" />
|
||
<ErrorComponent show={errors.family} message={errors.family?.message} />
|
||
</div>
|
||
)} />
|
||
<Controller control={control} name="cartNumber" render={({ field }) => (
|
||
<div>
|
||
<Input field={field} placeholder="شماره کارت" className="bg-auth-form" />
|
||
<ErrorComponent show={errors.cartNumber} message={errors.cartNumber?.message} />
|
||
</div>
|
||
)} />
|
||
<Controller control={control} name="shabaNumber" render={({ field }) => (
|
||
<div>
|
||
<Input field={field} placeholder="شماره شبا" className="bg-auth-form" />
|
||
<ErrorComponent show={errors.shabaNumber} message={errors.shabaNumber?.message} />
|
||
</div>
|
||
)} />
|
||
</div>
|
||
<div className="flex flex-col gap-[6px]">
|
||
<Button type="submit" className="w-full bg-primary-color text-white">ایجاد حساب</Button>
|
||
<Button onClick={close} className="w-full bg-transparent text-primary-color">لغو</Button>
|
||
</div>
|
||
</form>
|
||
</DialogComponent>
|
||
)
|
||
} |