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.
40 lines
1.2 KiB
40 lines
1.2 KiB
import React, { Component } from "react"; |
|
import { Link } from "react-router-dom"; |
|
|
|
import "./index.scss"; |
|
export default class Product extends Component { |
|
render() { |
|
const { data, number } = this.props; |
|
return ( |
|
<article |
|
style={{ minWidth: window.innerWidth / number }} |
|
className="scroll-product d-flex flex-column" |
|
> |
|
<Link to={`/books/${data.id}`}> |
|
<img src={data.image} alt={data.title} /> |
|
<h1>{data.title}</h1> |
|
<h2>{data.subTitle}</h2> |
|
{data.price ? ( |
|
<div className="scroll-product__price d-flex flex-column align-items-center"> |
|
{data.oldPrice ? ( |
|
<div> |
|
<div className="scroll-product__price--old d-flex"> |
|
{data.oldPrice} {window.t("تومان")} |
|
<span></span> |
|
</div> |
|
</div> |
|
) : null} |
|
<div className="scroll-product__price--price"> |
|
{data.price} {window.t("تومان")} |
|
</div> |
|
</div> |
|
) : ( |
|
<div className="scroll-product__notAvailabe"> |
|
{window.t("ناموجود")} |
|
</div> |
|
)} |
|
</Link> |
|
</article> |
|
); |
|
} |
|
}
|
|
|