|  |  |  | @ -1,9 +1,9 @@ | 
			
		
	
		
			
				
					|  |  |  |  | import React from "react"; | 
			
		
	
		
			
				
					|  |  |  |  | import React, { useState } from "react"; | 
			
		
	
		
			
				
					|  |  |  |  | import Button from "../../components/Button"; | 
			
		
	
		
			
				
					|  |  |  |  | import Input from "../../components/input"; | 
			
		
	
		
			
				
					|  |  |  |  | import Map from '../../components/Map' | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | const ContactUs = () => { | 
			
		
	
		
			
				
					|  |  |  |  | import { connect } from "react-redux"; | 
			
		
	
		
			
				
					|  |  |  |  | const ContactUs = ({isMobile}) => { | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  |     const departments = [ | 
			
		
	
	
		
			
				
					|  |  |  | @ -27,15 +27,94 @@ const ContactUs = () => { | 
			
		
	
		
			
				
					|  |  |  |  |         }, | 
			
		
	
		
			
				
					|  |  |  |  |     ] | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  |     const [phase, setPhase] = useState(1); | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  |     return ( | 
			
		
	
		
			
				
					|  |  |  |  |         isMobile ? 
 | 
			
		
	
		
			
				
					|  |  |  |  |         <div className="w-full flex flex-col py-20 px-4 pb-40"> | 
			
		
	
		
			
				
					|  |  |  |  |             <h1 className="w-full text-right text-red52 font-bold">تماس با ما</h1> | 
			
		
	
		
			
				
					|  |  |  |  |             <div className="flex w-full rtl mt-4 justify-between  py-1 bg-gray-100 border border-gray-300 rounded-xl"> | 
			
		
	
		
			
				
					|  |  |  |  |                 <button className={`w-1/2 rounded-xl mx-1 h-12 ${phase == 1 ? 'bg-red5B font-bold text-white' : 'text-red5B'}`} | 
			
		
	
		
			
				
					|  |  |  |  |                 onClick={() => setPhase(1)} | 
			
		
	
		
			
				
					|  |  |  |  |                 > | 
			
		
	
		
			
				
					|  |  |  |  |                     فرم تماس با ما | 
			
		
	
		
			
				
					|  |  |  |  |                 </button> | 
			
		
	
		
			
				
					|  |  |  |  |                 <button className={`w-1/2 rounded-xl mx-1 font-bold h-12 ${phase == 2 ? 'bg-red5B text-white' : 'text-red5B'}`} | 
			
		
	
		
			
				
					|  |  |  |  |                 onClick={() => setPhase(2)} | 
			
		
	
		
			
				
					|  |  |  |  |                 > | 
			
		
	
		
			
				
					|  |  |  |  |                     اطلاعات تماس | 
			
		
	
		
			
				
					|  |  |  |  |                 </button> | 
			
		
	
		
			
				
					|  |  |  |  |             </div> | 
			
		
	
		
			
				
					|  |  |  |  |             { | 
			
		
	
		
			
				
					|  |  |  |  |                 phase == 1 ? 
 | 
			
		
	
		
			
				
					|  |  |  |  |                 <div className="w-full rtl"> | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  |                 <form className="flex flex-col w-full"> | 
			
		
	
		
			
				
					|  |  |  |  |                     <Input title='نام' gapSize='8' id={0} style={{ width: '100%' }} /> | 
			
		
	
		
			
				
					|  |  |  |  |                     <Input title='ایمیل' gapSize='8' id={1} style={{ width: '100%', background: 'rgba(249, 249, 249, 0.75)' }} /> | 
			
		
	
		
			
				
					|  |  |  |  |                     <select className="bg-white border border-solid border-gray-200 w-full my-4 p-3 rounded-lg text-gray-400 outline-red52"> | 
			
		
	
		
			
				
					|  |  |  |  |                         {departments.map((item, index) => ( | 
			
		
	
		
			
				
					|  |  |  |  |                             <option key={`Grade__${index}`}>{item.title}</option> | 
			
		
	
		
			
				
					|  |  |  |  |                         ))} | 
			
		
	
		
			
				
					|  |  |  |  |                     </select> | 
			
		
	
		
			
				
					|  |  |  |  |                     <textarea className="w-full border-gray-200 border p-3 rounded-lg text-gray-400 outline-red52" rows='7' cols='70' placeholder="متن پیام را اینجا تایپ کنید"> | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  |                     </textarea> | 
			
		
	
		
			
				
					|  |  |  |  |                     <div className="w-full flex" style={{direction: 'ltr'}}> | 
			
		
	
		
			
				
					|  |  |  |  |                             <Button title='ارسال پیام' className='w-full'/> | 
			
		
	
		
			
				
					|  |  |  |  |                     </div> | 
			
		
	
		
			
				
					|  |  |  |  |                 </form> | 
			
		
	
		
			
				
					|  |  |  |  |             </div> | 
			
		
	
		
			
				
					|  |  |  |  |                     : | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  |                     <div className="flex flex-col w-full rtl mr-32 mt-4"> | 
			
		
	
		
			
				
					|  |  |  |  |                         <div className="w-full rounded-xl overflow-hidden my-4 " style={{height:'215px'}}> | 
			
		
	
		
			
				
					|  |  |  |  |                     <Map /> | 
			
		
	
		
			
				
					|  |  |  |  |                     </div> | 
			
		
	
		
			
				
					|  |  |  |  |                     <div className="flex w-full text-right flex-col mb-4 items-start"> | 
			
		
	
		
			
				
					|  |  |  |  |                         
 | 
			
		
	
		
			
				
					|  |  |  |  |                             <div className="w-full p-2 border-b border-gray-200"> | 
			
		
	
		
			
				
					|  |  |  |  |                                 <h1 className="text-red52 text-md p-1 pr-0 font-black">آدرس ما</h1> | 
			
		
	
		
			
				
					|  |  |  |  |                                 <p className="text-gray-400 text-sm">تهران خیابان انقلاب بین ابوریحان و فلسطین بن بست سروش پلاک  2</p> | 
			
		
	
		
			
				
					|  |  |  |  |                             </div> | 
			
		
	
		
			
				
					|  |  |  |  |                             <div className="w-full p-2 border-b border-gray-200"> | 
			
		
	
		
			
				
					|  |  |  |  |                                 <h1 className="text-red52 text-md p-1 pr-0 font-black">شماره تماس</h1> | 
			
		
	
		
			
				
					|  |  |  |  |                                 <p className="text-gray-400 text-sm"> 02163462405 - 02163462406 </p> | 
			
		
	
		
			
				
					|  |  |  |  |                             </div> | 
			
		
	
		
			
				
					|  |  |  |  |                     
 | 
			
		
	
		
			
				
					|  |  |  |  |                             <div className="w-full p-2 border-b border-gray-200"> | 
			
		
	
		
			
				
					|  |  |  |  |                                 <h1 className="text-red52 text-md p-1 pr-0 font-black"> ایمیل سازمانی </h1> | 
			
		
	
		
			
				
					|  |  |  |  |                                 <p className="text-gray-400 text-sm">Info@Azmoonsample.ir</p> | 
			
		
	
		
			
				
					|  |  |  |  |                             </div> | 
			
		
	
		
			
				
					|  |  |  |  |                     
 | 
			
		
	
		
			
				
					|  |  |  |  |                    
 | 
			
		
	
		
			
				
					|  |  |  |  |                         
 | 
			
		
	
		
			
				
					|  |  |  |  |                             <div className="w-full p-2 "> | 
			
		
	
		
			
				
					|  |  |  |  |                                 <h1 className="text-red52 text-md p-1 pr-0 font-black"> شماره پیامک </h1> | 
			
		
	
		
			
				
					|  |  |  |  |                                 <p className="text-gray-400  text-sm">300000000008762144</p> | 
			
		
	
		
			
				
					|  |  |  |  |                                 <p className="text-gray-400 text-sm">توجه داشته باشید تمامی پیامک ها از سامانه آزمون از طریق همین سرشماره برای شما ارسال خواهد شد</p> | 
			
		
	
		
			
				
					|  |  |  |  |                             </div> | 
			
		
	
		
			
				
					|  |  |  |  |                          
 | 
			
		
	
		
			
				
					|  |  |  |  |                     
 | 
			
		
	
		
			
				
					|  |  |  |  |                         
 | 
			
		
	
		
			
				
					|  |  |  |  |                     </div> | 
			
		
	
		
			
				
					|  |  |  |  |                    
 | 
			
		
	
		
			
				
					|  |  |  |  |                     
 | 
			
		
	
		
			
				
					|  |  |  |  |                 </div> | 
			
		
	
		
			
				
					|  |  |  |  |             } | 
			
		
	
		
			
				
					|  |  |  |  |         </div> | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  |             : | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  |         <div className=" w-full text-right" style={{ direction: 'rtl', marginTop: '6.5%', paddingRight: '8.5%' }}> | 
			
		
	
		
			
				
					|  |  |  |  |             <h1 className="w-2/3 border-b border-gray-300 text-3xl font-bold text-red52 py-4">تماس با ما</h1> | 
			
		
	
		
			
				
					|  |  |  |  |             <div className="flex "> | 
			
		
	
		
			
				
					|  |  |  |  |                 <div className="w-1/3"> | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  |                     <form className="flex flex-col w-full"> | 
			
		
	
		
			
				
					|  |  |  |  |                         <Input title='نام' gapSize='8' id={0} style={{ width: '50%' }} /> | 
			
		
	
		
			
				
					|  |  |  |  |                         <Input title='ایمیل' gapSize='8' id={1} style={{ width: '50%' }} /> | 
			
		
	
		
			
				
					|  |  |  |  |                         <Input title='نام' gapSize='8' id={0} style={{ width: '100%' }} /> | 
			
		
	
		
			
				
					|  |  |  |  |                         <Input title='ایمیل' gapSize='8' id={1} style={{ width: '100%' }} /> | 
			
		
	
		
			
				
					|  |  |  |  |                         <select className="bg-white border border-solid border-gray-200 w-full my-4 p-3 rounded-lg text-gray-400 outline-red52"> | 
			
		
	
		
			
				
					|  |  |  |  |                             {departments.map((item, index) => ( | 
			
		
	
		
			
				
					|  |  |  |  |                                 <option key={`Grade__${index}`}>{item.title}</option> | 
			
		
	
	
		
			
				
					|  |  |  | @ -87,4 +166,12 @@ const ContactUs = () => { | 
			
		
	
		
			
				
					|  |  |  |  |     ); | 
			
		
	
		
			
				
					|  |  |  |  | }; | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  | export default ContactUs; | 
			
		
	
		
			
				
					|  |  |  |  | const mapStateToProps = (state) => ({ | 
			
		
	
		
			
				
					|  |  |  |  |     isDark: state.publicApi.isDark, | 
			
		
	
		
			
				
					|  |  |  |  |     isMobile: state.publicApi.isMobile, | 
			
		
	
		
			
				
					|  |  |  |  |   }); | 
			
		
	
		
			
				
					|  |  |  |  |   
 | 
			
		
	
		
			
				
					|  |  |  |  |   const mapDispatchToProps = { | 
			
		
	
		
			
				
					|  |  |  |  |   }; | 
			
		
	
		
			
				
					|  |  |  |  |   
 | 
			
		
	
		
			
				
					|  |  |  |  |   export default connect(mapStateToProps, mapDispatchToProps)(ContactUs); |