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