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