Step Tree Made

main
Pedram Keshavarzi 3 years ago
parent a6119549f6
commit 024b912860
  1. 340
      src/view/register/index.js

@ -114,7 +114,7 @@ const Register = ({ activeLogin }) => {
id: 12,
title: 'پایه دوازدهم'
},
]
return (
@ -142,32 +142,32 @@ const Register = ({ activeLogin }) => {
<span
className=" w-2 mt-2 border-r-4 border-solid border-red46OP"
style={{
// transform: "translateX(-1px)",
}}
></span>
</div>
<h1 className="text-gray-400 font-bold">{item.title}</h1>
</div>
<h1 className="text-gray-400 font-bold">{item.title}</h1>
</div>
)
)
)
)
}
</div>
</div>
</div>
</div>
</div>
{/* Content */}
{/* Content */}
<div className="w-4/5 mx-10 flex flex-col items-start text-right b">
{
steps == 0 &&
<>
<div className="w-full px-10 pb-6 border-b border-solid border-gray-200">
<div className="w-4/5 mx-10 flex flex-col items-start text-right b">
{
steps == 0 &&
<>
<div className="w-full px-10 pb-6 border-b border-solid border-gray-200">
<div className="mb-4">
<h1 className="font-black">مشخصات هویتی دانش آموز</h1>
<p className="font-bold text-gray-300 text-sm">اطلاعات هویتی دانش آموز را با دقت تکمیل و عکس مدارک را بارگزاری نمایید</p>
@ -175,194 +175,250 @@ const Register = ({ activeLogin }) => {
<div className="flex">
<div className="flex w-2/5 ">
<div className="ml-2">
<Input title="نام" borderType="rounded" gapSize="8" direction='rtl'/>
<Input title="کدملی" borderType="rounded" gapSize="12" id={1} type='number'/>
<Input title="نام" borderType="rounded" gapSize="8" direction='rtl' />
<Input title="کدملی" borderType="rounded" gapSize="12" id={1} type='number' />
</div>
<div className="mr-2">
<Input title="نام خانوادگی" borderType="rounded" id={2} direction='rtl'/>
<Input title="تاریخ تولد" borderType="rounded" gapSize="16" id={3} type='number'/>
<Input title="نام خانوادگی" borderType="rounded" id={2} direction='rtl' />
<Input title="تاریخ تولد" borderType="rounded" gapSize="16" id={3} type='number' />
</div>
</div>
<div className="w-3/5 flex justify-center">
<div className="w-2/5 mx-4">
<FileInput title="بارگزای صفحه اول شناسنامه" />
</div>
<div className="w-2/5 mx-4">
<FileInput title="بارگزای صفحه اول شناسنامه" />
<FileInput title="بارگزای صفحه اول شناسنامه" />
</div>
<div className="w-2/5 mx-4">
<FileInput title="بارگزای صفحه اول شناسنامه" />
</div>
</div>
</div>
</div>
<div className="w-full px-10 py-10 border-b flex items-center border-solid border-gray-200">
<div className="">
</div>
<div className="w-full px-10 py-10 border-b flex items-center border-solid border-gray-200">
<div className="">
<h1 className="font-black">پایه تحصیلی</h1>
<p className="font-bold text-gray-300 text-sm">لطفا پایه تحصیلی دانش آموز را وارد کنید</p>
</div>
<select className="bg-white border border-solid border-gray-300 w-48 p-3 rounded-lg text-gray-400 outline-red52 mx-6">
{grades.map((item) =>(
{grades.map((item) => (
<option key={`Grade__${item.id}`}>{item.title}</option>
))}
</select>
</div>
<div className="w-full px-10 py-8 flex flex-col ">
<div className="mb-4">
<div className="w-full px-10 py-8 flex flex-col ">
<div className="mb-4">
<h1 className="font-black">مشخصات هویتی دانش آموز</h1>
<p className="font-bold text-gray-300 text-sm">اطلاعات هویتی دانش آموز را با دقت تکمیل و عکس مدارک را بارگزاری نمایید</p>
</div>
<div className="flex justify-between items-center">
<Input title="نام مدرسه" borderType="rounded" gapSize="20" direction='rtl' id={4}/>
<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}</option>
<div className="flex justify-between items-center">
<Input title="نام مدرسه" borderType="rounded" gapSize="20" direction='rtl' id={4} />
<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}</option>
))}
</select>
<Input title="نام" borderType="rounded" gapSize="8" direction='rtl' id={5}/>
<Input title="کدملی" borderType="rounded" gapSize="12" id={6} type='number'/>
</div>
<div className="flex pt-10 justify-end">
<div className="w-40">
<Button borderType='rounded' title='مرحله بعد' onClick={() =>
<Input title="نام" borderType="rounded" gapSize="8" direction='rtl' id={5} />
<Input title="کدملی" borderType="rounded" gapSize="12" id={6} type='number' />
</div>
<div className="flex pt-10 justify-end">
<div className="w-40">
<Button borderType='rounded' title='مرحله بعد' onClick={() =>
setSteps(1)
} />
</div>
</div>
</div>
</div>
</div>
</>
}
{
steps == 1 &&
<>
<div className="w-full px-10 pb-6 border-b border-solid border-gray-200">
</>
}
{
steps == 1 &&
<>
<div className="w-full px-10 pb-6 border-b border-solid border-gray-200">
<div className="mb-4">
<h1 className="font-black">مشخصات هویتی پدر</h1>
<p className="font-bold text-gray-300 text-sm">لطفا اطلاعات مربوط هویتی پدر را وارد کنید</p>
</div>
<div className="flex">
<Input title="نام" borderType="rounded" gapSize="8" direction='rtl'/>
<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} />
</div>
<Input title="نام" borderType="rounded" gapSize="8" direction='rtl' />
<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} />
</div>
<div className="flex">
<Input title="تلفن همراه" borderType="rounded" type='number' id={4}/>
<Input title="شغل" borderType="rounded" direction='rtl' gapSize="8" id={5} />
<Input title="محل کار" borderType="rounded" id={6} direction='rtl'/>
<Input title="تلفن محل کار" borderType="rounded" gapSize="28" id={7} type='number'/>
</div>
<Input title="تلفن همراه" borderType="rounded" type='number' id={4} />
<Input title="شغل" borderType="rounded" direction='rtl' gapSize="8" id={5} />
<Input title="محل کار" borderType="rounded" id={6} direction='rtl' />
<Input title="تلفن محل کار" borderType="rounded" gapSize="28" id={7} type='number' />
</div>
</div>
<div className="w-full px-10 py-6 border-b border-solid border-gray-200">
<div className="w-full px-10 py-6 border-b border-solid border-gray-200">
<div className="mb-4">
<h1 className="font-black">مشخصات هویتی پدر</h1>
<p className="font-bold text-gray-300 text-sm">لطفا اطلاعات مربوط هویتی پدر را وارد کنید</p>
</div>
<div className="flex">
<Input title="نام" borderType="rounded" gapSize="8" direction='rtl' id={8}/>
<Input title="کدملی" borderType="rounded" gapSize="12" id={9} type='number'/>
<Input title="نام خانوادگی" borderType="rounded" id={10} direction='rtl'/>
<Input title="مدرک نحصیلی" borderType="rounded" gapSize="20" id={11} />
</div>
<Input title="نام" borderType="rounded" gapSize="8" direction='rtl' id={8} />
<Input title="کدملی" borderType="rounded" gapSize="12" id={9} type='number' />
<Input title="نام خانوادگی" borderType="rounded" id={10} direction='rtl' />
<Input title="مدرک نحصیلی" borderType="rounded" gapSize="20" id={11} />
</div>
<div className="flex">
<Input title="تلفن همراه" borderType="rounded" type='number' id={12}/>
<Input title="شغل" borderType="rounded" direction='rtl' gapSize="8" id={13} />
<Input title="محل کار" borderType="rounded" id={14} direction='rtl'/>
<Input title="تلفن محل کار" borderType="rounded" gapSize="28" id={15} type='number'/>
</div>
<Input title="تلفن همراه" borderType="rounded" type='number' id={12} />
<Input title="شغل" borderType="rounded" direction='rtl' gapSize="8" id={13} />
<Input title="محل کار" borderType="rounded" id={14} direction='rtl' />
<Input title="تلفن محل کار" borderType="rounded" gapSize="28" id={15} type='number' />
</div>
</div>
<div className="w-full px-10 py-8 flex flex-col ">
<div className="mb-4">
<div className="w-full px-10 py-8 flex flex-col ">
<div className="mb-4">
<h1 className="font-black">زندگی با خانواده </h1>
<p className="font-bold text-gray-300 text-sm">در این قسمت مشخص کنید دانشس آموز به همراه چه کسانی زندگی میکند </p>
</div>
<div className="flex justify-between items-center">
<div className="w-4/5 flex">
<div className="flex justify-between items-center">
<div className="w-4/5 flex">
<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}</option>
))}
</select>
<Input title="تعداد افراد خانواده" borderType="rounded" type='number' gapSize="40" direction='rtl' id={16}/>
</div>
<Input title="نشانی محل سکونت" borderType="rounded" gapSize="40" id={17} />
</div>
<div className="flex justify-start items-center">
<div className="w-2/5 flex">
<Input title="تعداد افراد خانواده" borderType="rounded" type='number' gapSize="40" direction='rtl' id={16} className="w-1/2"/>
<Input title="تعداد افراد خانواده" borderType="rounded" type='number' gapSize="40" direction='rtl' id={16} className="w-1/2"/>
</div>
</div>
<div className="flex pt-10 justify-end">
<div className="w-40 mx-4">
<Button borderType='rounded' title='بازگشت به مرحله قبل' type='outlined' onClick={() =>
{grades.map((item) => (
<option key={`Grade__${item.id}`}>{item.title}</option>
))}
</select>
<Input title="تعداد افراد خانواده" borderType="rounded" type='number' gapSize="40" direction='rtl' id={16} />
</div>
<Input title="نشانی محل سکونت" borderType="rounded" gapSize="40" id={17} />
</div>
<div className="flex justify-start items-center">
<div className="w-2/5 flex">
<Input title="تعداد افراد خانواده" borderType="rounded" type='number' gapSize="40" direction='rtl' id={16} className="w-1/2" />
<Input title="تعداد افراد خانواده" borderType="rounded" type='number' gapSize="40" direction='rtl' id={16} className="w-1/2" />
</div>
</div>
<div className="flex pt-10 justify-end">
<div className="w-40 mx-4">
<Button borderType='rounded' title='بازگشت به مرحله قبل' type='outlined' onClick={() =>
setSteps(0)
} />
</div>
<div className="w-40">
<Button borderType='rounded' title='مرحله بعد' onClick={() =>
</div>
<div className="w-40">
<Button borderType='rounded' title='مرحله بعد' onClick={() =>
setSteps(2)
} />
</div>
</div>
</div>
</div>
</>
}
</>
}
{
steps == 2 &&
<>
<div className="w-full px-10 pb-6 border-b border-solid border-gray-200">
<div className="mb-4">
<h1 className="font-black">قوانین و مقررات ثبت نام</h1>
<p className="font-bold text-gray-300 text-sm">لطفا اطلاعات مربوط هویتی پدر را وارد کنید</p>
</div>
<p className="text-gray-500">
بند اول: موارد مربوط به آموزش مخاطبین
پیر مردی هر روز تو محله می دید پسر کی با کفش های پاره و پای برهنه با توپ پلاستیکی فوتبال بازی می کند، روزی رفت ی کتانی نو خرید و اومد و به پسرک گفت بیا این کفشا رو بپوشپسرک کفشا رو پوشید و خوشحال رو به پیر مرد کرد و گفت: شما خدایید؟! پیر مرد لبش را گزید و گفت نه! پسرک گفت پس دوست خدایی، چون من دیشب فقط به خدا گفتم كه کفش ندارم
هر نفسی که فرو می بریم، مرگی را که مدام به ما دست اندازی میکند پس میزند... در نهایت این مرگ است که باید پیروز شود، زیرا از هنگام تولد بخشی از سرنوشت ما شده و فقط مدت کوتاهی پیش از بلعیدن طعمه اش، با آن بازی می کند. با این همه، ما تا آنجا که ممکن است، با علاقه فراوان و دلواپسی زیاد به زندگی ادامه می دهیم، همان طور که تا آنجا که ممکن است طولانی تر در یک حباب صابون می دمیم تا بزرگتر شود، گر چه با قطعیتی تمام می دانیم که خواهد ترکید.
پیر مردی هر روز تو محله می دید پسر کی با کفش های پاره و پای برهنه با توپ پلاستیکی فوتبال بازی می کند، روزی رفت ی کتانی نو خرید و اومد و به پسرک گفت بیا این کفشا رو بپوشپسرک کفشا رو پوشید و خوشحال رو به پیر مرد کرد و گفت: شما خدایید؟! پیر مرد لبش را گزید و گفت نه! پسرک گفت پس دوست خدایی، چون من دیشب فقط به خدا گفتم كه کفش ندارم
بند دوم: موارد مربوط به آموزش مخاطبین
خالد حسینی تو رمان باد بادک باز مینویسه : ﻣﺮﺩ ﺁﻫﺴﺘﻪ ﺩﺭ ﮔﻮﺵ ﻓﺮﺯﻧﺪ ﺗﺎﺯﻩ ﺑﻪ ﺑﻠﻮﻍ ﺭﺳﯿﺪﻩ ﺍﺵ ﺑﺮﺍﯼ ﭘﻨﺪ ﭼﻨﯿﻦ ﻧﺠﻮﺍ ﮐﺮﺩ : ﭘﺴﺮﻡ ﺩﺭ ﺯﻧﺪﮔﯽ ﻫﺮﮔﺰ ﺩﺯﺩﯼ ﻧﮑﻦ ﭘﺴﺮ ﻣﺘﻌﺠﺐ ﻣﺒﻬﻮﺕ ﺑﻪ ﭘﺪﺭ ﻧﮕﺎﻩ ﮐﺮﺩ ﺑﺪﯾﻦ ﻣﻌﻨﺎ ﮐﻪ ﺍﻭ ﻫﺮﮔﺰ ﺩﺳﺖ ﮐﺞ ﻧﺪﺍﺷﺘﻪ ﭘﺪﺭ ﺑﻪ ﻧﮕﺎﻩ ﻣﺘﻌﺠﺐ ﻓﺮﺯﻧﺪ ﻟﺒﺨﻨﺪﯼ ﺯﺩ ﺍﺩﺍﻣﻪ ﺩﺍﺩ : ﺩﺭ ﺯﻧﺪﮔﯽ ﺩﺭﻭﻍ ﻧﮕﻮ ﭼﺮﺍ ﮐﻪ ﺍﮔﺮ ﮔﻔﺘﯽ ﺻﺪﺍﻗﺖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺧﯿﺎﻧﺖ ﻧﮑﻦ ﮐﻪ ﺍﮔﺮ ﮐﺮﺩﯼ ﻋﺸﻖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺧﺸﻮﻧﺖ ﻧﮑﻦ ﺍﮔﺮ ﮐﺮﺩﯼ ﻣﺤﺒﺖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﻧﺎ ﺣﻖ ﻧﮕﻮ ﺍﮔﺮ ﮔﻔﺘﯽ ﺣﻖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺑﯽ ﺣﯿﺎﯾﯽ ﻧﮑﻦ ﺍﮔﺮ ﮐﺮﺩﯼ ﺷﺮﺍﻓﺖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍی... ﭘﺲ ﺩﺭ ﺯﻧﺪﮔﯽ ﻓﻘﻂ ﺩﺯﺩﯼ نکن
پیر مردی هر روز تو محله می دید پسر کی با کفش های پاره و پای برهنه با توپ پلاستیکی فوتبال بازی می کند، روزی رفت ی کتانی نو خرید و اومد و به پسرک گفت بیا این کفشا رو بپوشپسرک کفشا رو پوشید و خوشحال رو به پیر مرد کرد و گفت: شما خدایید؟! پیر مرد لبش را گزید و گفت نه! پسرک گفت پس دوست خدایی، چون من دیشب فقط به خدا گفتم كه کفش ندارم
هر نفسی که فرو می بریم، مرگی را که مدام به ما دست اندازی میکند پس میزند... در نهایت این مرگ است که باید پیروز شود، زیرا از هنگام تولد بخشی از سرنوشت ما شده و فقط مدت کوتاهی پیش از بلعیدن طعمه اش، با آن بازی می کند. با این همه، ما تا آنجا که ممکن است، با علاقه فراوان و دلواپسی زیاد به زندگی ادامه می دهیم، همان طور که تا آنجا که ممکن است طولانی تر در یک حباب صابون می دمیم تا بزرگتر شود، گر چه با قطعیتی تمام می دانیم که خواهد ترکید.
پیر مردی هر روز تو محله می دید پسر کی با کفش های پاره و پای برهنه با توپ پلاستیکی فوتبال بازی می کند، روزی رفت ی کتانی نو خرید و اومد و به پسرک گفت بیا این کفشا رو بپوشپسرک کفشا رو پوشید و خوشحال رو به پیر مرد کرد و گفت: شما خدایید؟! پیر مرد لبش را گزید و گفت نه! پسرک گفت پس دوست خدایی، چون من دیشب فقط به خدا گفتم كه کفش ندارم
بند سوم: موارد مربوط به آموزش مخاطبین
خالد حسینی تو رمان باد بادک باز مینویسه : ﻣﺮﺩ ﺁﻫﺴﺘﻪ ﺩﺭ ﮔﻮﺵ ﻓﺮﺯﻧﺪ ﺗﺎﺯﻩ ﺑﻪ ﺑﻠﻮﻍ ﺭﺳﯿﺪﻩ ﺍﺵ ﺑﺮﺍﯼ ﭘﻨﺪ ﭼﻨﯿﻦ ﻧﺠﻮﺍ ﮐﺮﺩ : ﭘﺴﺮﻡ ﺩﺭ ﺯﻧﺪﮔﯽ ﻫﺮﮔﺰ ﺩﺯﺩﯼ ﻧﮑﻦ ﭘﺴﺮ ﻣﺘﻌﺠﺐ ﻣﺒﻬﻮﺕ ﺑﻪ ﭘﺪﺭ ﻧﮕﺎﻩ ﮐﺮﺩ ﺑﺪﯾﻦ ﻣﻌﻨﺎ ﮐﻪ ﺍﻭ ﻫﺮﮔﺰ ﺩﺳﺖ ﮐﺞ ﻧﺪﺍﺷﺘﻪ ﭘﺪﺭ ﺑﻪ ﻧﮕﺎﻩ ﻣﺘﻌﺠﺐ ﻓﺮﺯﻧﺪ ﻟﺒﺨﻨﺪﯼ ﺯﺩ ﺍﺩﺍﻣﻪ ﺩﺍﺩ : ﺩﺭ ﺯﻧﺪﮔﯽ ﺩﺭﻭﻍ ﻧﮕﻮ ﭼﺮﺍ ﮐﻪ ﺍﮔﺮ ﮔﻔﺘﯽ ﺻﺪﺍﻗﺖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺧﯿﺎﻧﺖ ﻧﮑﻦ ﮐﻪ ﺍﮔﺮ ﮐﺮﺩﯼ ﻋﺸﻖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺧﺸﻮﻧﺖ ﻧﮑﻦ ﺍﮔﺮ ﮐﺮﺩﯼ ﻣﺤﺒﺖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﻧﺎ ﺣﻖ ﻧﮕﻮ ﺍﮔﺮ ﮔﻔﺘﯽ ﺣﻖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺑﯽ ﺣﯿﺎﯾﯽ ﻧﮑﻦ ﺍﮔﺮ ﮐﺮﺩﯼ ﺷﺮﺍﻓﺖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍی... ﭘﺲ ﺩﺭ ﺯﻧﺪﮔﯽ ﻓﻘﻂ ﺩﺯﺩﯼ نکن
</p>
</div>
<div className="flex items-center px-10 py-6">
<input type="checkbox" className="w-6 h-6"/>
<label className="mr-4 font-bold text-gray-500">
اینجانبان
<span className="text-red52 font-bold"> اصغر تقی غلی خوان </span>
و
<span className="text-red52 font-bold"> بتول کلاغ تپه زاده </span>
سرپرست های دانش آموز
<span className="text-red52 font-bold"> امیر سام تقی غلی خوان </span>
با قوانین و مقررات موافقت نموده و تمامی موارد به عهده اینجانب میباشد
</label>
</div>
<div className="w-full flex pt-10 justify-end">
<div className="w-40 mx-4">
<Button borderType='rounded' title='بازگشت به مرحله قبل' type='outlined' onClick={() =>
setSteps(1)
} />
</div>
<div className="w-40">
<Button borderType='rounded' title='مرحله بعد' onClick={() =>
setSteps(3)
} />
</div>
</div>
</>
}
</div>
</div>
</div>
);
</div>
);
};
export default Register;
export default Register;
Loading…
Cancel
Save