parent
							
								
									5a8c845e5b
								
							
						
					
					
						commit
						a3833a74a4
					
				
				 1 changed files with 111 additions and 0 deletions
			
			
		| @ -0,0 +1,111 @@ | |||||||
|  | import React from "react"; | ||||||
|  | 
 | ||||||
|  | const ProductDescription = ({ | ||||||
|  |     navTitles, | ||||||
|  |     items, | ||||||
|  |     addToCart | ||||||
|  | }) =>{ | ||||||
|  |     return( | ||||||
|  |         <> | ||||||
|  |             <div className="flex w-full rounded  bg-gray-200 justify-center mt-6 "> | ||||||
|  |                 <ul className="w-full flex justify-center"> | ||||||
|  |                     {navTitles.map(item => <li key={`NavTitle_${item.id}`} 
 | ||||||
|  |                     className={`p-6 mx-4 cursor-pointer
 | ||||||
|  |                      ${item.isActive ? 'border-0 border-b-4 border-solid border-blue-500' : null}` | ||||||
|  |                      } 
 | ||||||
|  |                      onClick={() => item.isActive ? null : item.isActive = !item.isActive }> | ||||||
|  |                          {item.title}</li>)} | ||||||
|  |                 </ul> | ||||||
|  |             </div> | ||||||
|  |             <div className="flex w-full "> | ||||||
|  |                 <div className="flex-1 "> | ||||||
|  |                    {items.map(e => ( | ||||||
|  |                        
 | ||||||
|  |                             e.items.map(item => ( | ||||||
|  |                                     <ul className="flex w-full flex-1 my-2 items-center"> | ||||||
|  |                                     <li className="py-4 px-8  min-w-md bg-gray-200 ml-4 text-blueC0" style={{minWidth: '300px'}}>{item.title}</li> | ||||||
|  |                                     <li className="py-4 px-8  min-w-md bg-gray-200 ml-4 w-full">{item.description}</li> | ||||||
|  |                                     </ul>   | ||||||
|  |                                 )) | ||||||
|  |                             
 | ||||||
|  |                         
 | ||||||
|  |                    ))} 
 | ||||||
|  |                 </div> | ||||||
|  |                 <div className="my-2"> | ||||||
|  |                     {addToCart} | ||||||
|  |                 </div> | ||||||
|  | 
 | ||||||
|  |             </div> | ||||||
|  |         </> | ||||||
|  |     ); | ||||||
|  | }; | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | export default ProductDescription; | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | 
 | ||||||
|  | ProductDescription.defaultProps = { | ||||||
|  |     navTitles: [ | ||||||
|  |         { | ||||||
|  |             id: 0, | ||||||
|  |             title: 'مشخصات', | ||||||
|  |             isActive: true, | ||||||
|  |             name: 'moshakhasat' | ||||||
|  |         }, | ||||||
|  |         { | ||||||
|  |             id: 1, | ||||||
|  |             title: 'نقد و بررسی', | ||||||
|  |             isActive: false | ||||||
|  |         }, | ||||||
|  |         { | ||||||
|  |             id: 2, | ||||||
|  |             title: 'برسش و باسخ', | ||||||
|  |             isActive:false | ||||||
|  |         }, | ||||||
|  |     ], | ||||||
|  |     items: [ | ||||||
|  |         { | ||||||
|  |             name: 'moshakhasat', | ||||||
|  |             items: [ | ||||||
|  |                 { | ||||||
|  |                     title : 'وزن کتاب', | ||||||
|  |                     description: '۱ کیلوگرم' | ||||||
|  |                 }, | ||||||
|  |                 { | ||||||
|  |                     title : 'تعداد صفحات', | ||||||
|  |                     description: '400 صفحه' | ||||||
|  |                 }, | ||||||
|  |                 { | ||||||
|  |                     title : 'نوع کاغذ', | ||||||
|  |                     description: 'گلاسه' | ||||||
|  |                 }, | ||||||
|  |                 { | ||||||
|  |                     title : 'شماره شابک', | ||||||
|  |                     description: '1225548218000005818765' | ||||||
|  |                 }, | ||||||
|  |                 { | ||||||
|  |                     title : 'انتشارات', | ||||||
|  |                     description: 'رزمندگان' | ||||||
|  |                 }, | ||||||
|  |                 { | ||||||
|  |                     title : 'نویسنده و یا معلف', | ||||||
|  |                     description: 'یک نویسنده گمنام' | ||||||
|  |                 }, | ||||||
|  |                 { | ||||||
|  |                     title : 'قطع', | ||||||
|  |                     description: 'خشتی' | ||||||
|  |                 }, | ||||||
|  |                 { | ||||||
|  |                     title : 'سال انتشار', | ||||||
|  |                     description: '1399' | ||||||
|  |                 }, | ||||||
|  |         ] | ||||||
|  |         } | ||||||
|  |     ] | ||||||
|  |     
 | ||||||
|  | } | ||||||
					Loading…
					
					
				
		Reference in new issue