@ -11,65 +11,176 @@ import Stepper from "../../../components/Stepper";
import { connect } from "react-redux" ; import { connect } from "react-redux" ;
import { toast } from "react-toastify" ; import { toast } from "react-toastify" ;
import Checkbox from "../../../components/Checkbox" ; import Checkbox from "../../../components/Checkbox" ;
import { user , publicApi } from "../../../redux/actions" ;
import _onInput from "../../../utils/onInput" ;
const MobileRegister = ( { activeLogin , isMobile } ) => { import persian from "react-date-object/calendars/persian"
import persian _fa from "react-date-object/locales/persian_fa"
import DatePicker , { DateObject } from "react-multi-date-picker" ;
import "react-multi-date-picker/styles/colors/red.css"
import "react-multi-date-picker/styles/layouts/mobile.css"
const MobileRegister = ( {
activeLogin ,
isMobile ,
getProvince ,
getCity ,
province ,
city ,
user ,
setProfile
} ) => {
const [ steps , setSteps ] = useState ( 0 ) ; const [ steps , setSteps ] = useState ( 0 ) ;
const [ index , setIndex ] = useState ( 1 ) ; const [ index , setIndex ] = useState ( 1 ) ;
const [ register , setRegister ] = useState ( false ) ; const [ register , setRegister ] = useState ( false ) ;
const timeoutRef = useRef ( null ) ; const timeoutRef = useRef ( null ) ;
const [ activeStep , setActiveStep ] = useState ( [ true , false , false , false ] ) ; const [ activeStep , setActiveStep ] = useState ( [ true , false , false , false ] ) ;
const [ error , setError ] = useState ( '' ) ; const [ error , setError ] = useState ( '' ) ;
const [ selectedState , setSelectedState ] = useState ( null ) ;
const [ selectedCity , setSelectedCity ] = useState ( null ) ;
useEffect ( ( ) => { useEffect ( ( ) => {
window . scrollTo ( 0 , 0 ) window . scrollTo ( 0 , 0 )
} , [ steps ] ) } , [ steps ] )
useEffect ( ( ) => {
getProvince ( ) ;
getCity ( ) ;
} , [ ] )
useEffect ( ( ) => {
if ( user ? . firstName !== null ) {
setUserInfo ( {
... userInfo ,
firstName : user . firstName ,
lastName : user . lastName ,
nationalId : user . nationalId ,
// birthDate: user.birthDate.toLocaleDateString('fa-IR'),
gender : user . gender ,
previousSchoolName : user . previousSchoolName ,
previousSchoolType : user . previousSchoolType ,
zone : user . zone ,
familyMemberCount : user . familyMemberCount ,
phone : user . phone ,
address : user . address
} )
}
} , [ user ] )
const madraks = [
{
id : 0 ,
title : 'مدرک تحصیلی'
} ,
{
id : 1 ,
title : 'ابتدایی'
} ,
{
id : 2 ,
title : 'راهنمایی'
} ,
{
id : 3 ,
title : 'دیپلم'
} ,
{
id : 4 ,
title : 'فوق دیپلم'
} ,
{
id : 5 ,
title : 'کارشناسی'
} ,
{
id : 6 ,
title : 'کارشناسی ارشد'
} ,
{
id : 7 ,
title : 'دکتری عمومی'
} ,
{
id : 8 ,
title : 'دکترای حرفه
} ,
{
id : 9 ,
title : 'دکترای تخصصی'
} ,
{
id : 10 ,
title : 'فوق تخصص'
} ,
]
const genders = [
{
id : 0 ,
title : 'جنسیت'
} ,
{
id : 1 ,
title : 'آقا' ,
} ,
{
id : 2 ,
title : 'خانم' ,
}
]
const [ userInfo , setUserInfo ] = useState ( { const [ userInfo , setUserInfo ] = useState ( {
name : null , firstN ame: null ,
familyName : null , last Name: null ,
nationalId : null , nationalId : null ,
birthDate : null , birthDate : null ,
sex : null , gender : null ,
grade : null , gradeIds : null ,
schoolName : null , previousSchoolName : null ,
city : null , previousSchoolType : null ,
state : null , cityId : null ,
fatherName : null , provinceId : null ,
fatherNationalId : null , zone : null ,
fatherFamilyName : null , fatherInfo : {
fatherJob : null , firstName : null ,
fatherMajor : null , nationalId : null ,
fatherPhoneNumber : null , lastName : null ,
fatherJobAddress : null , job : null ,
fatherJobPhoneNumber : null , education : null ,
motherName : null , cellphone : null ,
motherNationalId : null , workPlace : null ,
motherFamilyName : null , workPhone : null ,
motherJob : null , } ,
motherMajor : null , motherInfo : {
motherPhoneNumber : null , firstName : null ,
motherJobAddress : null , nationalId : null ,
motherJobPhoneNumber : null , lastName : null ,
job : null ,
familyNumber : null , education : null ,
cellphone : null ,
workPlace : null ,
workPhone : null ,
} ,
familyMemberCount : null ,
address : null , address : null ,
homePhoneNumber : null , phone : null ,
rulesAccepted : false ,
} ) ; } ) ;
const finalViewInfo = [ const finalViewInfo = [
{ {
title : 'نام' , title : 'نام' ,
value : userInfo . name value : userInfo . firstN ame
} , } ,
{ {
title : 'نام خانوادگی' , title : 'نام خانوادگی' ,
value : userInfo . familyName value : userInfo . last Name
} , } ,
{ {
title : 'جنسیت' , title : 'جنسیت' ,
value : userInfo . sex value : userInfo . gender
} , } ,
{ {
title : 'کد ملی' , title : 'کد ملی' ,
@ -77,87 +188,87 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
} , } ,
{ {
title : 'تاریخ تولد' , title : 'تاریخ تولد' ,
value : userInfo . birthDate value : userInfo . birthDate ? . toLocaleDateString ( 'fa-IR' )
} , } ,
{ {
title : 'نام مدرسه ' , title : 'نام مدرسه ' ,
value : userInfo . schoolName value : userInfo . previou sS choolName
} , } ,
{ {
title : 'شهر' , title : 'شهر' ,
value : userInfo . city value : userInfo . cityId
} , } ,
{ {
title : 'منطقه' , title : 'منطقه' ,
value : userInfo . stat e value : userInfo . zon e
} , } ,
{ {
title : 'نام' , title : 'نام' ,
value : userInfo . fatherName value : userInfo . fatherInfo . first Name
} , } ,
{ {
title : 'نام خانوادگی' , title : 'نام خانوادگی' ,
value : userInfo . fatherFamily Name value : userInfo . fatherInfo . last Name
} , } ,
{ {
title : 'کدملی' , title : 'کدملی' ,
value : userInfo . fatherN ationalId value : userInfo . fatherInfo . n ationalId
} , } ,
{ {
title : 'مدرک تحصیلی' , title : 'مدرک تحصیلی' ,
value : userInfo . fatherMajor value : madraks . find ( itm => itm . id == userInfo . fatherInfo . education ) ? . title
} , } ,
{ {
title : 'تلفن همراه' , title : 'تلفن همراه' ,
value : userInfo . fatherPhoneNumber value : userInfo . fatherInfo . cellphone
} , } ,
{ {
title : 'شغل' , title : 'شغل' ,
value : userInfo . fatherJ ob value : userInfo . fatherInfo . j ob
} , } ,
{ {
title : 'محل کار' , title : 'محل کار' ,
value : userInfo . fatherJobAddress value : userInfo . fatherInfo . workPlace
} , } ,
{ {
title : 'تلفن محل کار' , title : 'تلفن محل کار' ,
value : userInfo . fatherJobPhoneNumber value : userInfo . fatherInfo . workPhone
} , } ,
{ {
title : 'نام' , title : 'نام' ,
value : userInfo . motherName value : userInfo . motherInfo . first Name
} , } ,
{ {
title : 'نام خانوادگی' , title : 'نام خانوادگی' ,
value : userInfo . motherFamily Name value : userInfo . motherInfo . last Name
} , } ,
{ {
title : 'کدملی' , title : 'کدملی' ,
value : userInfo . motherN ationalId value : userInfo . motherInfo . n ationalId
} , } ,
{ {
title : 'مدرک تحصیلی' , title : 'مدرک تحصیلی' ,
value : userInfo . motherMajor value : madraks . find ( itm => itm . id == userInfo . motherInfo . education ) ? . title
} , } ,
{ {
title : 'تلفن همراه' , title : 'تلفن همراه' ,
value : userInfo . motherPhoneNumber value : userInfo . motherInfo . cellphone
} , } ,
{ {
title : 'شغل' , title : 'شغل' ,
value : userInfo . motherJ ob value : userInfo . motherInfo . j ob
} , } ,
{ {
title : 'محل کار' , title : 'محل کار' ,
value : userInfo . motherJobAddress value : userInfo . motherInfo . workPlace
} , } ,
{ {
title : 'تلفن محل کار' , title : 'تلفن محل کار' ,
value : userInfo . motherJobPhoneNumber value : userInfo . motherInfo . workPhone
} , } ,
{ {
title : 'تعداد افراد خانواده' , title : 'تعداد افراد خانواده' ,
value : userInfo . familyNumber value : userInfo . familyMemberCount
} , } ,
{ {
title : 'نشانی محل سکونت' , title : 'نشانی محل سکونت' ,
@ -165,7 +276,7 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
} , } ,
{ {
title : 'تلفن ثابت' , title : 'تلفن ثابت' ,
value : userInfo . homePhoneNumber value : userInfo . phone
} , } ,
] ; ] ;
@ -212,10 +323,7 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
} , } ,
] ]
const grades = [ const grades = [
{
id : 0 ,
title : ''
} ,
{ {
id : 1 , id : 1 ,
title : 'پایه اول' title : 'پایه اول'
@ -268,9 +376,24 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
] ]
const CostumeDatePickerInput = ( { openCalendar , value , handleValueChange , title } ) => {
return (
< Input
onFocus = { openCalendar }
value = { value }
onChange = { handleValueChange }
title = { title }
className = { 'w-full' }
// type='date'
id = { 3 }
/ >
)
}
return ( return (
< div className = "flex w-full px-4 justify-center py-20" style = { { direction : 'rtl' } } > < div className = "flex w-full px-4 justify-center py-20" style = { { direction : 'rtl' } } >
< div className = "w-full flex flex-col " > < div className = "w-full flex flex-col " >
@ -287,38 +410,74 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
< div className = "w-full border-b border-solid border-gray-200" > < div className = "w-full border-b border-solid border-gray-200" >
< div className = "mb-4 flex w-full justify-between font-black text-red52" > < div className = "mb-4 flex w-full justify-between font-black text-red52" >
< h1 className = "" > مشخصات هویتی دانش آموز < / h 1 > < h1 className = "" > مشخصات هویتی دانش آموز < / h 1 >
< p > مرحله ۱ از ۴ < / p > < p > مرحله ۱ از ۴ < / p >
< / d i v > < / d i v >
< div className = "flex w-full flex-col" > < div className = "flex w-full flex-col" >
< Input className = { 'w-full' } title = "نام" borderType = "rounded" gapSize = "8" direction = 'rtl' id = { 0 } value = { userInfo . firstName } onChange = { ( e ) => setUserInfo ( { ... userInfo , firstName : _onInput . noNumber ( e . target . value ) } ) } / >
< Input className = { 'w-full' } title = "نام خانوادگی" borderType = "rounded" id = { 1 } direction = 'rtl' value = { userInfo . lastName } onChange = { ( e ) => setUserInfo ( { ... userInfo , lastName : _onInput . noNumber ( e . target . value ) } ) } / >
< Input className = { 'w-full' } title = "کدملی" borderType = "rounded" gapSize = "12" id = { 2 } type = 'textNumber' max = { 10 } value = { userInfo . nationalId } onChange = { e => setUserInfo ( { ... userInfo , nationalId : _onInput . numberOnly ( e . target . value ) } ) } / >
< DatePicker
format = "YYYY/MM/DD"
onChange = { ( e ) => {
// console.log(e)
var s = new Date ( e . unix * 1000 )
// console.log(date)
setUserInfo ( { ... userInfo , birthDate : s } )
} }
calendar = { persian }
className = "red rmdp-mobile"
locale = { persian _fa }
maxDate = "1396/01/01"
currentDate = {
new DateObject ( {
year : 2017 ,
month : 1 ,
day : 1
} )
}
renderButton = { ( direction , handleClick ) => {
return < p className = "text-red-500 cursor-pointer font-bold mx-2"
onClick = { ( ) => handleClick ( ) }
>
{ direction === "right" ? ">" : "<" }
< / p >
}
}
< Input title = "نام" borderType = "rounded" gapSize = "8" direction = 'rtl' id = { 0 } / > render = { < CostumeDatePickerInput title = 'تاریخ تولد' / > }
< Input title = "کدملی" borderType = "rounded" gapSize = "12" id = { 1 } type = 'number' / >
< Input title = "جنسیت" borderType = "rounded" gapSize = "16" id = { 2 } / >
< Input title = "نام خانوادگی" borderType = "rounded" id = { 3 } direction = 'rtl' / >
< Input title = "تاریخ تولد" borderType = "rounded" gapSize = "16" id = { 4 } type = 'number' / >
< br > < / b r > / >
< FileInput title = "بارگزاری صفحه اول شناسنامه" id = { 1 } / > < select
< br > < / b r > onChange = { e => setUserInfo ( { ... userInfo , gender : e . target . value } ) }
< FileInput title = "بارگزاری عکس پرسنلی" id = { 2 } / > className = "bg-white border border-solid border-gray-200 w-full px-3 rounded text-gray-400 outline-red52 py-1 h-12 mt-6" >
{ genders . map ( ( item ) => (
< option key = { ` gender ${ item . id } ` } value = { item . id } > { item . title } < / o p t i o n >
) ) }
< / s e l e c t >
< br > < / b r >
< FileInput title = "بارگزاری صفحه اول شناسنامه" id = { 1 } mobile / >
< br > < / b r >
< FileInput title = "بارگزاری عکس پرسنلی" id = { 2 } mobile / >
< br > < / b r >
< / d i v > < / d i v >
< / d i v > < / d i v >
< div className = "w-full py-10 leading-normal border-b flex flex-col items-center border-solid border-gray-200" > < div className = "w-full py-10 pb-5 leading-normal border-b flex flex-col items-center border-solid border-gray-200" >
< div className = "w-full pb-2" > < div className = "w-full pb-2" >
< h1 className = "font-black" > پایه تحصیلی < / h 1 > < h1 className = "font-black" > پایه تحصیلی < / h 1 >
< p className = "font-bold text-gray-300 text-sm" > لطفا پایه تحصیلی دانش آموز را وارد کنید < / p > < p className = "font-bold text-gray-300 text-sm" > لطفا پایه تحصیلی دانش آموز را وارد کنید < / p >
< / d i v > < / d i v >
< select className = "bg-white border border-solid border-gray-300 w-full p-3 rounded-lg text-gray-400 outline-red52 mx-6" > < select
onChange = { e => setUserInfo ( { ... userInfo , gradeIds : e . target . value } ) }
className = "bg-white border border-solid border-gray-300 w-full p-3 rounded-md text-gray-400 outline-red52" >
{ grades . map ( ( item ) => ( { grades . map ( ( item ) => (
< option key = { ` Grade__ ${ item . id } ` } > { item . title } < / o p t i o n > < option key = { ` Grade__ ${ item . id } ` } value = { item . id } > { item . title } < / o p t i o n >
) ) } ) ) }
< / s e l e c t > < / s e l e c t >
< / d i v > < / d i v >
@ -328,15 +487,39 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
< p className = "font-bold text-gray-300 text-sm" > اطلاعات هویتی دانش آموز را با دقت تکمیل و عکس مدارک را بارگزاری نمایید < / p > < p className = "font-bold text-gray-300 text-sm" > اطلاعات هویتی دانش آموز را با دقت تکمیل و عکس مدارک را بارگزاری نمایید < / p >
< / d i v > < / d i v >
< div className = "flex flex-col items-center" > < div className = "flex flex-col items-center" >
< Input title = "نام مدرسه" borderType = "rounded" gapSize = "20" direction = 'rtl' id = { 5 } / > < Input className = { 'w-full' } title = "نام مدرسه" borderType = "rounded" gapSize = "20" direction = 'rtl' id = { 4 } value = { userInfo . previousSchoolName } onChange = { e => setUserInfo ( { ... userInfo , previousSchoolName : e . target . value } ) } / >
< select className = "bg-white border border-solid border-gray-200 w-full px-3 rounded text-gray-400 outline-red52 mx-2 h-12 mt-6" >
{ grades . map ( ( item ) => ( < select
< option key = { ` Grade__ ${ item . id } ` } > { item . title } < / o p t i o n > className = "bg-white border border-solid border-gray-200 w-full p-3 rounded-md text-gray-400 outline-red52 mt-6"
) ) } onChange = { e => { setSelectedState ( e . target . value ) ; setUserInfo ( { ... userInfo , previousSchoolType : e . target . value } ) } } >
< option value = { null } > نوع مدرسه < / o p t i o n >
< option value = { 1 } > دولتی < / o p t i o n >
< option value = { 2 } > نیمه دولتی < / o p t i o n >
< option value = { 3 } > غیر انتفاعی < / o p t i o n >
< option value = { 4 } > تیزهوشان < / o p t i o n >
< / s e l e c t >
< select
className = "bg-white border border-solid border-gray-200 w-full p-3 rounded-md text-gray-400 outline-red52 mr-0 mt-6"
onChange = { e => { setSelectedState ( e . target . value ) ; setUserInfo ( { ... userInfo , provinceId : e . target . value } ) } } >
< option value = { null } > استان < / o p t i o n >
{
province ? . map ( ( item ) => < option value = { item . id } > { item . name } < / o p t i o n > )
}
< / s e l e c t >
< select
className = "bg-white border border-solid border-gray-200 w-full p-3 rounded-md text-gray-400 outline-red52 mr-0 mt-6"
onChange = { ( e ) => { setSelectedCity ( e . target . value ) ; setUserInfo ( { ... userInfo , cityId : e . target . value } ) } } >
< option value = { null } >
شهر
< / o p t i o n >
{
city ? . filter ( itm => itm . provinceId == selectedState ) . map ( ( city ) => < option value = { city . id } > { city . name } < / o p t i o n > )
}
< / s e l e c t > < / s e l e c t >
< Input title = "شهر" borderType = "rounded" gapSize = "8" direction = 'rtl' id = { 6 } / >
< Input title = "منطقه" borderType = "rounded" gapSize = "12" id = { 7 } type = 'number' / >
< Input title = "استان" borderType = "rounded" gapSize = "12" id = { 8 } type = 'number' / > < Input className = { 'w-full' } title = "منطقه " borderType = "rounded" gapSize = "12" id = { 5 } type = 'number' value = { userInfo . zone } onChange = { ( e ) => setUserInfo ( { ... userInfo , zone : e . target . value } ) } / >
< / d i v > < / d i v >
< div className = "flex pt-10 justify-end" > < div className = "flex pt-10 justify-end" >
@ -344,28 +527,13 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
< Button borderType = 'rounded' title = 'مرحله بعد' onClick = { ( ) => { < Button borderType = 'rounded' title = 'مرحله بعد' onClick = { ( ) => {
const inputs = document . querySelectorAll ( '.Login-box-form-item-input' ) const inputs = document . querySelectorAll ( '.Login-box-form-item-input' )
// if (inputs[0].value) {
// if (inputs[0].value) {
setSteps ( 1 ) setSteps ( 1 )
setActiveStep ( [ true , true , false , false ] ) setActiveStep ( [ true , true , false , false ] )
setError ( '' ) setError ( '' )
// } else {
// } else {
// toast.warn('لطفا تمامی فیلد ها را پر کنید')
// toast.warn('لطفا تمامی فیلد ها را پر کنید')
// }
// }
setUserInfo ( prevState => {
return {
... prevState ,
name : document . getElementById ( 'Login-box-form-item-input-name0' ) . value ,
nationalId : document . getElementById ( 'Login-box-form-item-input-name1' ) . value ,
sex : document . getElementById ( 'Login-box-form-item-input-name2' ) . value ,
familyName : document . getElementById ( 'Login-box-form-item-input-name3' ) . value ,
birthDate : document . getElementById ( 'Login-box-form-item-input-name4' ) . value ,
schoolName : document . getElementById ( 'Login-box-form-item-input-name5' ) . value ,
city : document . getElementById ( 'Login-box-form-item-input-name6' ) . value ,
state : document . getElementById ( 'Login-box-form-item-input-name7' ) . value ,
}
} )
} } / > } } / >
< / d i v > < / d i v >
< / d i v > < / d i v >
@ -378,9 +546,9 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
steps == 1 && steps == 1 &&
< form className = "w-full" > < form className = "w-full" >
< div className = "mb-4 flex w-full justify-between font-black text-red52" > < div className = "mb-4 flex w-full justify-between font-black text-red52" >
< h1 className = "" > مشخصات هویتی خانواده دانش آموز < / h 1 > < h1 className = "" > مشخصات هویتی خانواده دانش آموز < / h 1 >
< p > مرحله ۲ از ۴ < / p > < p > مرحله ۲ از ۴ < / p >
< / d i v > < / d i v >
< div className = "w-full pb-6 border-b border-solid border-gray-200" > < div className = "w-full pb-6 border-b border-solid border-gray-200" >
< div className = "mb-4" > < div className = "mb-4" >
< h1 className = "font-black" > مشخصات هویتی پدر < / h 1 > < h1 className = "font-black" > مشخصات هویتی پدر < / h 1 >
@ -389,26 +557,51 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
< div className = "flex flex-col" > < div className = "flex flex-col" >
< Input title = "نام" borderType = "rounded" gapSize = "8" direction = 'rtl' id = { 0 } / >
< Input title = "کدملی" borderType = "rounded" gapSize = "12" id = { 1 } type = 'number' / >
< Input title = "نام خانوادگی" borderType = "rounded" id = { 2 } direction = 'rtl' / >
< Input title = "مدرک نحصیلی" borderType = "rounded" gapSize = "20" id = { 3 } / >
< Input className = { 'w-full' } title = "نام" borderType = "rounded" gapSize = "8" direction = 'rtl' id = { 0 }
value = { userInfo . fatherInfo . firstName }
onChange = { e => setUserInfo ( {
... userInfo , fatherInfo : {
... userInfo . fatherInfo ,
firstName : _onInput . noNumber ( e . target . value )
}
} ) } / >
< Input className = { 'w-full' } title = "نام خانوادگی" borderType = "rounded" id = { 1 } direction = 'rtl' value = { userInfo . fatherInfo . lastName }
onChange = { e => setUserInfo ( { ... userInfo , fatherInfo : { ... userInfo . fatherInfo , lastName : _onInput . noNumber ( e . target . value ) } } ) } / >
< Input className = { 'w-full' } title = "کدملی" borderType = "rounded" gapSize = "12" id = { 2 } type = 'text' max = { 10 } value = { userInfo . fatherInfo . nationalId }
onChange = { e => setUserInfo ( {
... userInfo , fatherInfo : {
... userInfo . fatherInfo ,
nationalId : _onInput . numberOnly ( e . target . value )
}
} ) } / >
< select className = "bg-white border border-solid border-gray-200 w-full px-3 rounded text-gray-400 outline-red52 py-1 h-12 mt-6"
onChange = { e => setUserInfo ( {
... userInfo , fatherInfo : {
... userInfo . fatherInfo ,
education : e . target . value
}
} ) } >
{ madraks . map ( ( item ) => (
< option key = { ` madraks ${ item . id } ` } value = { item . id } > { item . title } < / o p t i o n >
) ) }
< / s e l e c t >
< Input title = "تلفن همراه" borderType = "rounded" type = 'number' id = { 4 } / > < Input className = { 'w-full' } title = "تلفن همراه" borderType = "rounded" max = { 11 } id = { 3 } value = { userInfo . fatherInfo . cellphone } onChange = { e => setUserInfo ( {
< Input title = "شغل" borderType = "rounded" direction = 'rtl' gapSize = "8" id = { 5 } / > ... userInfo , fatherInfo : {
... userInfo . fatherInfo ,
cellphone : _onInput . phonenumber ( e . target . value )
}
} ) } / >
< Input className = { 'w-full' } title = "شغل" borderType = "rounded" direction = 'rtl' gapSize = "8" id = { 4 } value = { userInfo . fatherInfo . job }
onChange = { e => setUserInfo ( { ... userInfo , fatherInfo : { ... userInfo . fatherInfo , job : e . target . value } } ) } / >
< Input title = "محل کار" borderType = "rounded" id = { 6 } direction = 'rtl' / > < Input className = { 'w-full' } title = "محل کار" borderType = "rounded" id = { 5 } direction = 'rtl' value = { userInfo . fatherInfo . workPlace }
< Input title = "تلفن محل کار" borderType = "rounded" gapSize = "28" id = { 7 } type = 'number' / >
onChange = { e => setUserInfo ( { ... userInfo , fatherInfo : { ... userInfo . fatherInfo , workPlace : e . target . value } } ) } / >
< Input className = { 'w-full' } title = "تلفن محل کار" borderType = "rounded" gapSize = "28" id = { 6 } type = 'text' max = { 11 } value = { userInfo . fatherInfo . workPhone }
onChange = { e => setUserInfo ( { ... userInfo , fatherInfo : { ... userInfo . fatherInfo , workPhone : _onInput . numberOnly ( e . target . value ) } } ) } / >
@ -425,25 +618,60 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
< div className = "flex w-full flex-col" > < div className = "flex w-full flex-col" >
< Input title = "نام" borderType = "rounded" gapSize = "8" direction = 'rtl' id = { 8 } / > < Input className = { 'w-full' } title = "نام" borderType = "rounded" gapSize = "8" direction = 'rtl' id = { 7 } value = { userInfo . motherInfo . firstName }
< Input title = "کدملی" borderType = "rounded" gapSize = "12" id = { 9 } type = 'number' / > onChange = { e => setUserInfo ( { ... userInfo , motherInfo : { ... userInfo . motherInfo , firstName : _onInput . noNumber ( e . target . value ) } } ) } / >
< Input title = "نام خانوادگی" borderType = "rounded" id = { 10 } direction = 'rtl' / >
< Input title = "مدرک نحصیلی" borderType = "rounded" gapSize = "20" id = { 11 } / >
< Input className = { 'w-full' } title = "نام خانوادگی" borderType = "rounded" id = { 8 } direction = 'rtl' value = { userInfo . motherInfo . lastName }
onChange = { e => setUserInfo ( { ... userInfo , motherInfo : { ... userInfo . motherInfo , lastName : _onInput . noNumber ( e . target . value ) } } ) } / >
< Input className = { 'w-full' } title = "کدملی" borderType = "rounded" gapSize = "12" id = { 9 } type = 'text' max = { 10 } value = { userInfo . motherInfo . nationalId }
onChange = { e => setUserInfo ( { ... userInfo , motherInfo : { ... userInfo . motherInfo , nationalId : _onInput . numberOnly ( e . target . value ) } } ) } / >
< select className = "bg-white border border-solid border-gray-200 w-full px-3 rounded text-gray-400 outline-red52 py-1 h-12 mt-6"
onChange = { e => setUserInfo ( {
... userInfo , motherInfo : {
... userInfo . motherInfo ,
education : e . target . value
}
} ) } >
{ madraks . map ( ( item ) => (
< option key = { ` madraks ${ item . id } ` } value = { item . id } > { item . title } < / o p t i o n >
) ) }
< / s e l e c t >
< Input className = { 'w-full' } title = "تلفن همراه" borderType = "rounded" type = 'text' id = { 10 } max = { 11 } value = { userInfo . motherInfo . cellphone }
onChange = { e => setUserInfo ( {
< Input title = "تلفن همراه" borderType = "rounded" type = 'number' id = { 12 } / > ... userInfo , motherInfo : {
< Input title = "شغل" borderType = "rounded" direction = 'rtl' gapSize = "8" id = { 13 } / > ... userInfo . motherInfo ,
cellphone : _onInput . phonenumber ( e . target . value )
}
< Input title = "محل کار" borderType = "rounded" id = { 14 } direction = 'rtl' / > } ) } / >
< Input title = "تلفن محل کار" borderType = "rounded" gapSize = "28" id = { 15 } type = 'number' / > < Input className = { 'w-full' } title = "شغل" borderType = "rounded" direction = 'rtl' gapSize = "8" id = { 11 } value = { userInfo . motherInfo . job }
onChange = { e => setUserInfo ( {
... userInfo , motherInfo : {
... userInfo . motherInfo ,
job : e . target . value
}
} ) } / >
< Input className = { 'w-full' } title = "محل کار" borderType = "rounded" id = { 12 } direction = 'rtl'
value = { userInfo . motherInfo . workPlace }
onChange = { e => setUserInfo ( {
... userInfo , motherInfo : {
... userInfo . motherInfo ,
workPlace : e . target . value
}
} ) } / >
< Input className = { 'w-full' } title = "تلفن محل کار" borderType = "rounded" gapSize = "28" id = { 13 } type = 'text' max = { 11 }
value = { userInfo . motherInfo . workPhone }
onChange = { e => setUserInfo ( {
... userInfo , motherInfo : {
... userInfo . motherInfo ,
workPhone : _onInput . numberOnly ( e . target . value )
}
} ) } / >
@ -459,19 +687,14 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
< / d i v > < / d i v >
< div className = "flex flex-col items-center" > < div className = "flex flex-col items-center" >
< select className = "bg-white border border-solid border-gray-200 w-full px-3 rounded text-gray-400 outline-red52 mx-2 h-12 mt-6" >
{ grades . map ( ( item ) => (
< option key = { ` Grade__ ${ item . id } ` } > { item . title } < / o p t i o n >
) ) }
< / s e l e c t >
< Input title = "تعداد افراد خانواده" borderType = "rounded" type = 'number' gapSize = "40" direction = 'rtl' id = { 16 } / >
< Input title = "نشانی محل سکونت" borderType = "rounded" gapSize = "40" id = { 17 } / > < Input className = { 'w-full' } title = "تعداد افراد خانواده" borderType = "rounded" type = 'number' gapSize = "40" direction = 'rtl' id = { 14 } value = { userInfo . familyMemberCount } onChange = { e => setUserInfo ( { ... userInfo , familyMemberCount : e . target . value } ) } / >
< Input className = { 'w-full' } title = "تلفن ثابت" borderType = "rounded" gapSize = "40" direction = 'rtl' id = { 15 } max = { 11 } value = { userInfo . phone } onChange = { e => setUserInfo ( { ... userInfo , phone : _onInput . numberOnly ( e . target . value ) } ) } / >
< Input title = "نشانی محل سکونت" borderType = "rounded" gapSize = "40" id = { 16 } direction = 'rtl' value = { userInfo . address } onChange = { e => setUserInfo ( { ... userInfo , address : e . target . value } ) } / >
< Input title = "تلفن ثابت" borderType = "rounded" type = 'number' gapSize = "40" direction = 'rtl' id = { 18 } / >
< Input title = "تعداد افراد خانواده" borderType = "rounded" type = 'number' gapSize = "40" direction = 'rtl' id = { 19 } / >
@ -487,45 +710,12 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
< div className = "w-1/2 mr-2" > < div className = "w-1/2 mr-2" >
< Button borderType = 'rounded' title = 'مرحله بعد' onClick = { ( ) => { < Button borderType = 'rounded' title = 'مرحله بعد' onClick = { ( ) => {
const inputs = document . querySelectorAll ( '.Login-box-form-item-input' ) const inputs = document . querySelectorAll ( '.Login-box-form-item-input' )
// if (inputs[0].value) {
setSteps ( 2 ) ;
setActiveStep ( [ true , true , true , false ] )
// } else {
// alert('لطفا تمامی فیلد ها را پر کنید')
// }
setUserInfo ( prevState => {
return {
... prevState ,
fatherName : document . getElementById ( 'Login-box-form-item-input-name0' ) . value ,
fatherNationalId : document . getElementById ( 'Login-box-form-item-input-name1' ) . value ,
fatherFamilyName : document . getElementById ( 'Login-box-form-item-input-name2' ) . value ,
fatherMajor : document . getElementById ( 'Login-box-form-item-input-name3' ) . value ,
fatherPhoneNumber : document . getElementById ( 'Login-box-form-item-input-name4' ) . value ,
fatherJob : document . getElementById ( 'Login-box-form-item-input-name5' ) . value ,
fatherJobAddress : document . getElementById ( 'Login-box-form-item-input-name6' ) . value ,
fatherJobPhoneNumber : document . getElementById ( 'Login-box-form-item-input-name7' ) . value ,
motherName : document . getElementById ( 'Login-box-form-item-input-name8' ) . value ,
motherNationalId : document . getElementById ( 'Login-box-form-item-input-name9' ) . value ,
motherFamilyName : document . getElementById ( 'Login-box-form-item-input-name10' ) . value ,
motherMajor : document . getElementById ( 'Login-box-form-item-input-name11' ) . value ,
motherPhoneNumber : document . getElementById ( 'Login-box-form-item-input-name12' ) . value ,
motherJob : document . getElementById ( 'Login-box-form-item-input-name13' ) . value ,
motherJobAddress : document . getElementById ( 'Login-box-form-item-input-name14' ) . value ,
motherJobPhoneNumber : document . getElementById ( 'Login-box-form-item-input-name15' ) . value ,
familyNumber : document . getElementById ( 'Login-box-form-item-input-name16' ) . value ,
address : document . getElementById ( 'Login-box-form-item-input-name17' ) . value ,
homePhoneNumber : document . getElementById ( 'Login-box-form-item-input-name18' ) . value ,
setSteps ( 2 ) ;
setActiveStep ( [ true , true , true , false ] )
}
} )
} } / > } } / >
< / d i v > < / d i v >
@ -540,13 +730,13 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
steps == 2 && steps == 2 &&
< > < >
< div className = "w-full pb-6 border-b border-solid border-gray-200" > < div className = "w-full pb-6 border-b border-solid border-gray-200" >
< div className = "mb-4 flex w-full justify-between font-black text-red52" > < div className = "mb-4 flex w-full justify-between font-black text-red52" >
< h1 className = "" > تایید قوانین و مقررات < / h 1 > < h1 className = "" > تایید قوانین و مقررات < / h 1 >
< p > مرحله ۳ از ۴ < / p > < p > مرحله ۳ از ۴ < / p >
< / d i v > < / d i v >
< p className = "text-gray-500 text-sm overflow-x-hidden overflow-scroll w-full" style = { { height : '60vh' } } > < p className = "text-gray-500 text-sm text-justify pl-2 overflow-x-hidden overflow-scroll w-full" style = { { height : '60vh' } } >
بند اول : موارد مربوط به آموزش مخاطبین بند اول : موارد مربوط به آموزش مخاطبین
پیر مردی هر روز تو محله می دید پسر کی با کفش های پاره و پای برهنه با توپ پلاستیکی فوتبال بازی می کند ، روزی رفت ی کتانی نو خرید و اومد و به پسرک گفت بیا این کفشا رو بپوش … پسرک کفشا رو پوشید و خوشحال رو به پیر مرد کرد و گفت : شما خدایید ؟ ! پیر مرد لبش را گزید و گفت نه ! پسرک گفت پس دوست خدایی ، چون من دیشب فقط به خدا گفتم كه کفش ندارم پیر مردی هر روز تو محله می دید پسر کی با کفش های پاره و پای برهنه با توپ پلاستیکی فوتبال بازی می کند ، روزی رفت ی کتانی نو خرید و اومد و به پسرک گفت بیا این کفشا رو بپوش … پسرک کفشا رو پوشید و خوشحال رو به پیر مرد کرد و گفت : شما خدایید ؟ ! پیر مرد لبش را گزید و گفت نه ! پسرک گفت پس دوست خدایی ، چون من دیشب فقط به خدا گفتم كه کفش ندارم
هر نفسی که فرو می بریم ، مرگی را که مدام به ما دست اندازی می کند پس می زند ... در نهایت این مرگ است که باید پیروز شود ، زیرا از هنگام تولد بخشی از سرنوشت ما شده و فقط مدت کوتاهی پیش از بلعیدن طعمه اش ، با آن بازی می کند . با این همه ، ما تا آنجا که ممکن است ، با علاقه فراوان و دلواپسی زیاد به زندگی ادامه می دهیم ، همان طور که تا آنجا که ممکن است طولانی تر در یک حباب صابون می دمیم تا بزرگتر شود ، گر چه با قطعیتی تمام می دانیم که خواهد ترکید . هر نفسی که فرو می بریم ، مرگی را که مدام به ما دست اندازی می کند پس می زند ... در نهایت این مرگ است که باید پیروز شود ، زیرا از هنگام تولد بخشی از سرنوشت ما شده و فقط مدت کوتاهی پیش از بلعیدن طعمه اش ، با آن بازی می کند . با این همه ، ما تا آنجا که ممکن است ، با علاقه فراوان و دلواپسی زیاد به زندگی ادامه می دهیم ، همان طور که تا آنجا که ممکن است طولانی تر در یک حباب صابون می دمیم تا بزرگتر شود ، گر چه با قطعیتی تمام می دانیم که خواهد ترکید .
@ -563,16 +753,21 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
< / d i v > < / d i v >
< div className = "flex items-start text-xs py-6" > < div className = "flex items-start text-xs py-6" >
< Checkbox name = "TAEED_REGISTER_MOBILE" / > < Checkbox name = { 'PARENTS_CHECKED' } onChange = { e =>
e . target . checked ? setUserInfo ( { ... userInfo , rulesAccepted : true } )
: setUserInfo ( { ... userInfo , rulesAccepted : false } )
} / >
< label className = "mr-4 font-bold text-gray-500" > < label className = "mr-4 font-bold text-gray-500" >
اینجانبان اینجانبان
< span className = "text-red52 font-bold" > { userInfo . fatherName } { userInfo . fatherFamilyName } < / s p a n > < span className = "text-red52 font-bold" > { userInfo . fatherInfo . first Name } { userInfo . fatherInfo . last Name } < / s p a n >
و و
< span className = "text-red52 font-bold" > { userInfo . motherName } { userInfo . motherFamilyName } < / s p a n > < span className = "text-red52 font-bold" > { userInfo . motherInfo . first Name } { userInfo . motherInfo . last Name } < / s p a n >
سرپرست های دانش آموز سرپرست های دانش آموز
< span className = "text-red52 font-bold" > { userInfo . n ame} { userInfo . family Name} < / s p a n > < span className = "text-red52 font-bold" > { userInfo . firstN ame} { userInfo . last Name} < / s p a n >
با قوانین و مقررات موافقت نموده و تمامی موارد به عهده اینجانب میباشد با قوانین و مقررات موافقت نموده و تمامی موارد به عهده اینجانب میباشد
< / l a b e l > < / l a b e l >
< / d i v > < / d i v >
< div className = "w-full flex pt-10 justify-between" > < div className = "w-full flex pt-10 justify-between" >
< div className = "w-1/2 ml-2" > < div className = "w-1/2 ml-2" >
@ -598,67 +793,67 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
steps == 3 && steps == 3 &&
< > < >
< div className = "w-full pb-6" > < div className = "w-full pb-6" >
< div className = "mb-4 flex w-full justify-between font-black text-red52" > < div className = "mb-4 flex w-full justify-between font-black text-red52" >
< h1 className = "" > تایید اطلاعات < / h 1 > < h1 className = "" > تایید اطلاعات < / h 1 >
< p > مرحله ۴ از ۴ < / p > < p > مرحله ۴ از ۴ < / p >
< / d i v > < / d i v >
< div className = "flex flex-col border-b border-solid border-gray-300 leading-7 pb-6" > < div className = "flex flex-col border-b border-solid border-gray-300 leading-7 pb-6" >
< h1 className = "font-bold mb-2 text-lg" > مشخصات دانش آموز < / h 1 > < h1 className = "font-bold mb-2 text-lg" > مشخصات دانش آموز < / h 1 >
{ {
finalViewInfo . slice ( 0 , 8 ) . map ( item => ( finalViewInfo . slice ( 0 , 8 ) . map ( item => (
< div className = "flex items-center" > < div className = "flex items-center" >
< h3 className = "text-red26 font-bold" > { item . title } < / h 3 > : < p c l a s s N a m e = " m r - 2 t e x t - r e d 5 2 " > { i t e m . v a l u e } < / p > < h3 className = "text-red26 font-bold" > { item . title } < / h 3 > : < p c l a s s N a m e = " m r - 2 t e x t - r e d 5 2 " > { i t e m . v a l u e } < / p >
< / d i v > < / d i v >
) ) ) )
} }
< / d i v > < / d i v >
< div className = "flex flex-col border-b border-solid border-gray-300 leading-7 py-6" > < div className = "flex flex-col border-b border-solid border-gray-300 leading-7 py-6" >
< h1 className = "font-bold mb-2 text-lg" > مشخصات پدر دانش آموز < / h 1 > < h1 className = "font-bold mb-2 text-lg" > مشخصات پدر دانش آموز < / h 1 >
{ {
finalViewInfo . slice ( 8 , 16 ) . map ( item => ( finalViewInfo . slice ( 8 , 16 ) . map ( item => (
< div className = "flex items-center" > < div className = "flex items-center" >
< h3 className = "text-red26 font-bold" > { item . title } < / h 3 > : < p c l a s s N a m e = " m r - 2 t e x t - r e d 5 2 " > { i t e m . v a l u e } < / p > < h3 className = "text-red26 font-bold" > { item . title } < / h 3 > : < p c l a s s N a m e = " m r - 2 t e x t - r e d 5 2 " > { i t e m . v a l u e } < / p >
< / d i v > < / d i v >
) ) ) )
} }
< / d i v > < / d i v >
< div className = "flex flex-col border-b border-solid border-gray-300 leading-7 py-6" > < div className = "flex flex-col border-b border-solid border-gray-300 leading-7 py-6" >
< h1 className = "font-bold mb-2 text-lg" > مشخصات مادر دانش آموز < / h 1 > < h1 className = "font-bold mb-2 text-lg" > مشخصات مادر دانش آموز < / h 1 >
{ {
finalViewInfo . slice ( 16 , 24 ) . map ( item => ( finalViewInfo . slice ( 16 , 24 ) . map ( item => (
< div className = "flex items-center" > < div className = "flex items-center" >
< h3 className = "text-red26 font-bold" > { item . title } < / h 3 > : < p c l a s s N a m e = " m r - 2 t e x t - r e d 5 2 " > { i t e m . v a l u e } < / p > < h3 className = "text-red26 font-bold" > { item . title } < / h 3 > : < p c l a s s N a m e = " m r - 2 t e x t - r e d 5 2 " > { i t e m . v a l u e } < / p >
< / d i v > < / d i v >
) ) ) )
} }
< / d i v > < / d i v >
< div className = "flex flex-col border-b border-solid border-gray-300 leading-7 py-6" > < div className = "flex flex-col border-b border-solid border-gray-300 leading-7 py-6" >
< h1 className = "font-bold mb-2 text-lg" > مشخصات خانواده دانش آموز < / h 1 > < h1 className = "font-bold mb-2 text-lg" > مشخصات خانواده دانش آموز < / h 1 >
{ {
finalViewInfo . slice ( 24 , 27 ) . map ( item => ( finalViewInfo . slice ( 24 , 27 ) . map ( item => (
< div className = "flex items-center" > < div className = "flex items-center" >
< h3 className = "text-red26 font-bold" > { item . title } < / h 3 > : < p c l a s s N a m e = " m r - 2 t e x t - r e d 5 2 " > { i t e m . v a l u e } < / p > < h3 className = "text-red26 font-bold" > { item . title } < / h 3 > : < p c l a s s N a m e = " m r - 2 t e x t - r e d 5 2 " > { i t e m . v a l u e } < / p >
< / d i v > < / d i v >
) ) ) )
} }
< / d i v > < / d i v >
< / d i v > < / d i v >
< div className = "w-full flex pt-10 justify-between" > < div className = "w-full flex pt-10 justify-between" >
< div className = "w-1/2 ml-2" > < div className = "w-1/2 ml-2" >
< Button borderType = 'rounded' title = 'بازگشت به مرحله قبل' type = 'outlined' onClick = { ( ) => { < Button borderType = 'rounded' title = 'بازگشت به مرحله قبل' type = 'outlined' onClick = { ( ) => {
setSteps ( 2 ) setSteps ( 2 )
setActiveStep ( [ true , true , true , false ] ) setActiveStep ( [ true , true , true , false ] )
} } / > } } / >
< / d i v > < / d i v >
< div className = "w-1/2 mr-2" > < div className = "w-1/2 mr-2" >
< Button borderType = 'rounded' title = 'ورود' to = '/' onClick = { ( ) => < Button borderType = 'rounded' title = 'تایید' to = '/' onClick = { ( ) =>
activeLogin ( ) setProfile ( userInfo )
} / > } / >
< / d i v >
< / d i v > < / d i v >
< / d i v >
@ -676,7 +871,16 @@ const MobileRegister = ({ activeLogin, isMobile }) => {
} ; } ;
const mapStateToProps = ( state ) => ( { const mapStateToProps = ( state ) => ( {
isMobile : state . publicApi . isMobile , isMobile : state . publicApi . isMobile ,
province : state . publicApi . province ,
city : state . publicApi . city ,
user : state . user . status ,
} ) } )
const mapDispatchToProps = {
setProfile : user . setProfile ,
getProvince : publicApi . getProvince ,
getCity : publicApi . getCity ,
}
export default connect ( mapStateToProps ) ( MobileRegister ) ; export default connect ( mapStateToProps , mapDispatchToProps ) ( MobileRegister ) ;
