You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

180 lines
6.4 KiB

import React from "react";
import proxy from "~/Redux/proxy";
import { toast } from "react-toastify";
import { connect } from "react-redux";
import { userProduct } from "~/Redux/actions";
import { Link, useHistory } from "react-router-dom";
import "./index.scss";
import document_red from "~/assets/icons/document-red.png";
import ebook_blue from "~/assets/icons/e-book-blue.png";
import basket_white from "~/assets/icons/basket-white.png";
const maxDesktopSize = 1250;
const fontSize = {
desktop: {
div: window.innerWidth > maxDesktopSize ? 13 : window.innerWidth / 95,
strong: window.innerWidth > maxDesktopSize ? 24 : window.innerWidth / 70,
span: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 80,
button: window.innerWidth > maxDesktopSize ? 18 : window.innerWidth / 80,
p: window.innerWidth > maxDesktopSize ? 12 : window.innerWidth / 100,
h2: window.innerWidth > maxDesktopSize ? 12 : window.innerWidth / 100,
},
};
function AddToCart(props) {
let history = useHistory();
const {
price,
off,
supportItems,
page,
info,
sampleFileId,
productType,
} = props;
function Navigate({ path }) {
history.push(path);
}
let productId = localStorage.getItem("pushToCart");
if (productId) {
localStorage.removeItem("pushToCart");
props.pushToCart({
productId,
userId: props.id,
count: 1,
});
setTimeout(() => history.push("/cart"), 2000);
}
// if (this.state.path) return Navigate({ path: this.state.path });
return (
<>
{window.innerWidth > 1000 ? (
<section className="product-addtocart d-flex flex-column">
<div className="product-addtocart__box d-flex flex-column">
<div className="product-addtocart__box--price d-flex ">
<div
style={{ fontSize: fontSize.desktop.div, width: "100%" }}
className="flex-column"
>
<div
style={{ fontSize: 14, fontWeight: "bold", width: "100%" }}
className="d-flex"
>
{/* {info.product[productType].name} */}
{info.product[0].name}
</div>
<div style={{ float: "left" }}>
<strong style={{ fontSize: fontSize.desktop.strong }}>
{price}
</strong>{" "}
تومان
</div>
</div>
{off ? (
<span style={{ fontSize: fontSize.desktop.span }}>
{off} تومان تخفیف
</span>
) : null}
</div>
<Link
to={"/pdf/" + sampleFileId}
// href={file(sampleFileId)}
// target="_blank"
// rel="noopener noreferrer"
style={{ fontSize: fontSize.desktop.button }}
className="product-addtocart__box--sampleButton"
>
مشاهده نمونه کتاب
<img src={document_red} alt="" />
</Link>
<Link
// to={`/products/${
// page === "digital"
// ? `physical/${window.location.pathname.slice(
// window.location.pathname.lastIndexOf("/") + 1,
// window.location.pathname.length
// )}`
// : `digital/${window.location.pathname.slice(
// window.location.pathname.lastIndexOf("/") + 1,
// window.location.pathname.length
// )}`
// }`}
style={{ fontSize: fontSize.desktop.button, opacity: 0.3 }}
className="product-addtocart__box--digitalButton"
>
{page === "digital" ? "کتاب چاپی" : window.t("نسخه الکترونیک")}
<img src={ebook_blue} alt="" />
</Link>
<button
style={{ fontSize: fontSize.desktop.button }}
className="product-addtocart__box--addButton"
onClick={() => {
if (proxy.status())
props.pushToCart({
productId:
page === "digital"
? info.product[0].id
: info.product[0].id,
userId: props.id,
count: 1,
});
else {
toast.info(window.t("جهت ادامه فرآیند خرید وارد حساب خود شوید"));
localStorage.setItem("afterLogin", window.location.pathname);
localStorage.setItem(
"pushToCart",
page === "digital" ? info.product[0].id : info.product[0].id
);
Navigate({ path: "/auth" });
}
}}
>
افزودن به سبد خرید
<img src={basket_white} alt="" />
</button>
<div className="product-addtocart__box--accept d-flex">
<input type="checkbox" checked={true} />
<Link
to="/page/privacy"
style={{ fontSize: "13px", margin: 0, padding: 0 }}
>
شرایط استفاده از دانوین و حریم خصوصی را مطالعه کرده ام
</Link>
</div>
<div className="product-addtocart__box--accept d-flex">
<input type="checkbox" checked={true} />
<Link
to="/page/returning"
style={{ fontSize: "13px", margin: 0, padding: 0 }}
>
شرایط مرجوع کردن کالا در دانوین
</Link>
</div>
</div>
<footer className="product-addtocart__footer d-flex justify-content-between mt-3">
{supportItems.map((item, i) => (
<div className="d-flex flex-column align-items-center" key={i}>
<img src={item.icon} alt={item.name} />
<h2 style={{ fontSize: fontSize.desktop.h2 }}>{item.title}</h2>
</div>
))}
</footer>
</section>
) : null}
</>
);
}
export default connect(
(state) => ({
loading: state.userProduct.loading,
info: state.book.info,
id: state.user.status.id,
}),
{ pushToCart: userProduct.add }
)(AddToCart);