parent
6bd1f788d3
commit
b073cb6190
7 changed files with 193 additions and 8 deletions
@ -0,0 +1,164 @@ |
||||
import React, { useState, useEffect } from "react"; |
||||
import { connect } from "react-redux"; |
||||
import { toast } from "react-toastify"; |
||||
import { book, userProduct, publicApi } from "../../../../redux/actions"; |
||||
import proxy from "../../../../redux/proxy"; |
||||
import location from "../../../../utils/location"; |
||||
import Button from "../../../../components/Button"; |
||||
import Header from "../../../../components/Header"; |
||||
import Comment from "../../Comment"; |
||||
import Rate from "../../Rate"; |
||||
|
||||
export const ProductOverAll = ({ |
||||
productType, |
||||
getInfo, |
||||
book, |
||||
grades, |
||||
isDark, |
||||
userId, |
||||
pushToCart, |
||||
headerOptions, |
||||
setHeaderOptions, |
||||
}) =>{ |
||||
const [type, setType] = useState("physical"); |
||||
return ( |
||||
|
||||
<div> |
||||
<header |
||||
className={`w-full flex`} |
||||
> |
||||
<img |
||||
src={`https://dnvn.ir/api/v1/file/${book?.fileIds}`} |
||||
alt="" |
||||
style={{height: '320px'}} |
||||
className="-md py-8 px-16 bg-grayF4 mx-4" |
||||
/> |
||||
<div className="flex flex-1 flex-col pr-2 pt-2"> |
||||
<h1 className="text-blue5F mb-3 font-semibold text-xl dark:text-white"> |
||||
{type === "digital" |
||||
? book?.product[0]?.name |
||||
: book?.product[1]?.name} |
||||
</h1> |
||||
<div className="text-blueC0 text-xs dark:text-greenBA"> |
||||
{"پایه" + " " + grades[book?.gradeId]} |
||||
</div> |
||||
</div> |
||||
|
||||
</header> |
||||
<ul |
||||
className="list-none flex flex-row divide-x items-center mt-4" |
||||
style={{ direction: "ltr" }} |
||||
> |
||||
<li className="border-solid border-blueFE flex-1 flex-shrink-0 text-center text-xs font-medium text-blueC0 dark:text-white"> |
||||
{book?.pagesNum} <br /> صفحه |
||||
</li> |
||||
<li className="border-solid border-blueFE flex-1 flex-shrink-0 text-center text-xs font-medium text-blueC0 dark:text-white"> |
||||
{"فیزیکی - دیجیتالی"} <br /> در دسترس |
||||
</li> |
||||
<li className="border-solid border-blueFE flex-1 flex-shrink-0 text-center text-xs font-medium text-blueC0 dark:text-white"> |
||||
{book?.rate} <br /> امتیاز |
||||
</li> |
||||
</ul> |
||||
<h2 className="text-blueC0 text-sm font-semibold mt-7 dark:text-greenBA"> |
||||
نسخه محصول را انتخاب کنید |
||||
</h2> |
||||
<div className="w-full flex flex-row justify-between items-center mt-4"> |
||||
<Button |
||||
title="نسخه فیزیکی" |
||||
backgroundColor={isDark ? "bg-transparent" : "bg-white"} |
||||
border={{ color: isDark ? "#ffffff55" : "#196EC055", width: "1px" }} |
||||
width="49%" |
||||
color={isDark ? "text-white" : "text-blueC0"} |
||||
active={type === "physical"} |
||||
selectable={true} |
||||
onClick={() => setType("physical")} |
||||
/> |
||||
<Button |
||||
title="نسخه دیجیتال" |
||||
backgroundColor={isDark ? "bg-transparent" : "bg-white"} |
||||
border={{ color: isDark ? "#ffffff55" : "#196EC055", width: "1px" }} |
||||
width="49%" |
||||
selectable={true} |
||||
active={type === "digital"} |
||||
color={isDark ? "text-white" : "text-blueC0"} |
||||
onClick={() => setType("digital")} |
||||
/> |
||||
</div> |
||||
<div className="w-full flex flex-row justify-between items-center mt-4"> |
||||
<Button |
||||
onClick={() => |
||||
proxy.status() |
||||
? pushToCart({ |
||||
productId: |
||||
type === "digital" |
||||
? book?.product[0]?.id |
||||
: book?.product[1]?.id, |
||||
userId: userId, |
||||
count: 1, |
||||
}) |
||||
: toast.info("ابتدا وارد حساب کاربری خود شوید.") |
||||
} |
||||
title={ |
||||
"خرید با قیمت" + |
||||
" " + |
||||
(type === "digital" |
||||
? book?.product[0]?.price |
||||
: book?.product[1]?.price) + |
||||
" " + |
||||
"تومان" |
||||
} |
||||
backgroundColor="bg-blueC0" |
||||
border={{ color: "#196EC055", width: "1px" }} |
||||
width="65%" |
||||
color="text-white" |
||||
/> |
||||
<Button |
||||
title="مشاهده نمونه" |
||||
backgroundColor={isDark ? "bg-transparent" : "bg-white"} |
||||
border={{ color: isDark ? "#ffffff55" : "#196EC055", width: "1px" }} |
||||
width="33%" |
||||
color={isDark ? "text-white" : "text-blueC0"} |
||||
/> |
||||
</div> |
||||
<div className="w-full flex flex-row justify-between items-center mt-4"> |
||||
<Button |
||||
title="مشاهده دوره ویدئویی این محصول" |
||||
backgroundColor="bg-blueC0" |
||||
border={{ color: "#196EC055", width: "0px" }} |
||||
bgOpacity="bg-opacity-10" |
||||
width="100%" |
||||
color={isDark ? "text-white" : "text-blueC0"} |
||||
/> |
||||
</div> |
||||
<div className="w-full flex flex-col justify-between items-center mt-4"> |
||||
<Header title="توضیحات" link="#" /> |
||||
<p className="text-xs text-gray1 mt-2 dark:text-white"> |
||||
خالد حسینی تو رمان باد بادک باز مینویسه : ﻣﺮﺩ ﺁﻫﺴﺘﻪ ﺩﺭ ﮔﻮﺵ ﻓﺮﺯﻧﺪ |
||||
ﺗﺎﺯﻩ ﺑﻪ ﺑﻠﻮﻍ ﺭﺳﯿﺪﻩ ﺍﺵ ﺑﺮﺍﯼ ﭘﻨﺪ ﭼﻨﯿﻦ ﻧﺠﻮﺍ ﮐﺮﺩ : ” ﭘﺴﺮﻡ ﺩﺭ ﺯﻧﺪﮔﯽ ﻫﺮﮔﺰ |
||||
ﺩﺯﺩﯼ ﻧﮑﻦ ” ﭘﺴﺮ ﻣﺘﻌﺠﺐ ﻭ ﻣﺒﻬﻮﺕ ﺑﻪ ﭘﺪﺭ ﻧﮕﺎﻩ ﮐﺮﺩ ﺑﺪﯾﻦ ﻣﻌﻨﺎ ﮐﻪ ﺍﻭ ﻫﺮﮔﺰ |
||||
ﺩﺳﺖ ﮐﺞ ﻧﺪﺍﺷﺘﻪ ﭘﺪﺭ ﺑﻪ ﻧﮕﺎﻩ ﻣﺘﻌﺠﺐ ﻓﺮﺯﻧﺪ ﻟﺒﺨﻨﺪﯼ ﺯﺩ ﻭ ﺍﺩﺍﻣﻪ ﺩﺍﺩ : ﺩﺭ |
||||
ﺯﻧﺪﮔﯽ ﺩﺭﻭﻍ ﻧﮕﻮ ﭼﺮﺍ ﮐﻪ ﺍﮔﺮ ﮔﻔﺘﯽ ﺻﺪﺍﻗﺖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺧﯿﺎﻧﺖ ﻧﮑﻦ ﮐﻪ ﺍﮔﺮ |
||||
ﮐﺮﺩﯼ ﻋﺸﻖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺧﺸﻮﻧﺖ ﻧﮑﻦ ﺍﮔﺮ ﮐﺮﺩﯼ ﻣﺤﺒﺖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﻧﺎ ﺣﻖ |
||||
ﻧﮕﻮ ﺍﮔﺮ ﮔﻔﺘﯽ ﺣﻖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ ﺍﯼ، ﺑﯽ ﺣﯿﺎﯾﯽ ﻧﮑﻦ ﺍﮔﺮ ﮐﺮﺩﯼ ﺷﺮﺍﻓﺖ ﺭﺍ ﺩﺯﺩﯾﺪﻩ |
||||
ﺍی... ﭘﺲ ﺩﺭ ﺯﻧﺪﮔﯽ ﻓﻘﻂ ﺩﺯﺩﯼ نکن{" "} |
||||
</p> |
||||
</div> |
||||
</div> |
||||
) |
||||
} |
||||
|
||||
const mapStateToProps = (state) => ({ |
||||
book: state.book.info, |
||||
grades: state.publicApi.grades, |
||||
isDark: state.publicApi.isDark, |
||||
userId: state.user.status.id, |
||||
}); |
||||
|
||||
const mapDispatchToProps = { |
||||
getInfo: book.info, |
||||
pushToCart: userProduct.add, |
||||
setHeaderOptions: publicApi.setHeaderOptions, |
||||
}; |
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(ProductOverAll); |
||||
|
Loading…
Reference in new issue