|
|
|
import React, { useState } from "react";
|
|
|
|
import { useForm } from "react-hook-form";
|
|
|
|
import DateRangePicker from "../DateRangePicker";
|
|
|
|
|
|
|
|
import Input from "./Input";
|
|
|
|
|
|
|
|
const FormInput = () => {
|
|
|
|
const { register, getValues } = useForm();
|
|
|
|
const [selectedInput, setSelectedInput] = useState(false);
|
|
|
|
|
|
|
|
return (
|
|
|
|
<div className="mx-72 mt-20 flex flex-row items-center justify-between divide-x-2 divide-[#F3F3F3] divide-x-reverse bg-white p-4 py-7 border border-gray-200 rounded-sm shadow-sm">
|
|
|
|
<div className="flex-grow flex-1 flex flex-col gap-y-4 px-4">
|
|
|
|
<Input
|
|
|
|
register={register("firstName")}
|
|
|
|
// defaultValue={info?.firstName}
|
|
|
|
label="نام "
|
|
|
|
type="text"
|
|
|
|
borderClassname={`border-transparent `}
|
|
|
|
className={``}
|
|
|
|
// borderClassname={` ${
|
|
|
|
// selectedInput === true ? "border-[#2483E1]" : "border-[#E0E0E0]"
|
|
|
|
// }`}
|
|
|
|
// onClick={() => setSelectedInput(true)}
|
|
|
|
/>
|
|
|
|
<Input
|
|
|
|
register={register("lastName")}
|
|
|
|
label="نام خانوادگی"
|
|
|
|
type="text"
|
|
|
|
borderClassname={`border-transparent `}
|
|
|
|
className={``}
|
|
|
|
/>
|
|
|
|
<Input
|
|
|
|
register={register("birthYear")}
|
|
|
|
label="تاریخ تولد"
|
|
|
|
type="number"
|
|
|
|
borderClassname={`border-transparent `}
|
|
|
|
className={``}
|
|
|
|
/>
|
|
|
|
<select className="customizeSelect rounded text-xs mx-1 py-2 bg-[#F9F9F9] focus:bg-white border-[#E0E0E0] focus:border-[#2483E1] focus:ring-transparent">
|
|
|
|
<option>میزان تحصیلات</option>
|
|
|
|
<option>کارشناسی</option>
|
|
|
|
<option>ارشد</option>
|
|
|
|
<option>دکتری</option>
|
|
|
|
</select>{" "}
|
|
|
|
<Input
|
|
|
|
register={register("gender")}
|
|
|
|
label="جنسیت"
|
|
|
|
type="number"
|
|
|
|
borderClassname={`border-transparent `}
|
|
|
|
className={``}
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
<div className="flex-grow flex-1 flex flex-col gap-y-4 px-4">
|
|
|
|
<Input
|
|
|
|
register={register("mobileNumber")}
|
|
|
|
label="شماره تماس"
|
|
|
|
type="number"
|
|
|
|
borderClassname={`border-transparent `}
|
|
|
|
className={``}
|
|
|
|
/>
|
|
|
|
<Input
|
|
|
|
register={register("job")}
|
|
|
|
label="شغل"
|
|
|
|
type="text"
|
|
|
|
borderClassname={`border-transparent `}
|
|
|
|
className={``}
|
|
|
|
/>
|
|
|
|
<select className="customizeSelect rounded text-xs mx-1 py-2 bg-[#F9F9F9] focus:bg-white border-[#E0E0E0] focus:border-[#2483E1] focus:ring-transparent">
|
|
|
|
<option>شهر مبدا</option>
|
|
|
|
<option>تهران</option>
|
|
|
|
<option>تهران</option>
|
|
|
|
<option>تهران</option>
|
|
|
|
</select>
|
|
|
|
<Input
|
|
|
|
register={register("foundus")}
|
|
|
|
label="نحوه آشنایی با موکب"
|
|
|
|
type="text"
|
|
|
|
borderClassname={`border-transparent `}
|
|
|
|
className={``}
|
|
|
|
/>
|
|
|
|
<Input
|
|
|
|
register={register("idCard")}
|
|
|
|
label="کد ملی"
|
|
|
|
type="number"
|
|
|
|
borderClassname={`border-transparent `}
|
|
|
|
className={``}
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
<div className="flex-grow flex-1 flex flex-col px-4">
|
|
|
|
<Input
|
|
|
|
register={register("lastName")}
|
|
|
|
label="تاریخ ورود"
|
|
|
|
type="text"
|
|
|
|
borderClassname={`border-transparent `}
|
|
|
|
className={``}
|
|
|
|
/>
|
|
|
|
<DateRangePicker />
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
export default FormInput;
|