reza added some property

temp
Reza_ashrafi 3 years ago
parent 736dbb5223
commit 8679198a12
  1. 112
      src/components/ProductStatusCard/index.js
  2. 7
      src/views/Product/Desktop/ProductOverAll/index.js

@ -2,7 +2,7 @@ import React from "react";
import { connect } from "react-redux"; import { connect } from "react-redux";
import { userProduct } from "../../redux/actions"; import { userProduct } from "../../redux/actions";
import { toast } from "react-toastify"; import { toast } from "react-toastify";
import separate from '../../utils/separate' import separate from "../../utils/separate";
//components; //components;
import Button from "../Button"; import Button from "../Button";
@ -16,55 +16,79 @@ import tick from "./tick-circle.svg";
import shop from "./icon-shop.svg"; import shop from "./icon-shop.svg";
const ProductStatusCard = ({ const ProductStatusCard = ({
items,
price, price,
discountPrice, offerPrice,
isDark, isDark,
id, id,
userId, userId,
isLogin, isLogin,
pushToCart, pushToCart,
loading, loading,
garanty,
suggestedCounter,
seller,
shippingTime,
}) => { }) => {
return ( return (
<section className="w-full"> <section className="w-full">
<div className="bg-grayF9 rounded-md px-4 py-2 divide-y divide-solid divide-gray-200"> <div className="bg-grayF9 rounded-md px-4 py-2 divide-y divide-solid divide-gray-200">
{items.map((item, index) => ( <div className="flex flex-row items-center justify-between py-3">
<div
className="flex flex-row items-center justify-between py-3"
key={index}
>
<div className="flex flex-row items-center"> <div className="flex flex-row items-center">
<img src={item.icon} alt="" className="w-8" /> <img src={tick} alt="" className="w-8" />
<div className="flex flex-col mr-3"> <div className="flex flex-col mr-3">
<p className="text-sm"> <div className="text-sm">{`توصیه به خرید توسط ${suggestedCounter} نفر`}</div>
<span className="font-bold">{item.subtitle}</span> </div>
{item.title} </div>
</p> <img src={circle} alt="" className="w-5" />
{item.customerSatisfaction && ( </div>
<p className="text-xs mt-1"> {seller && (
رضایت خریداران: <div className="flex flex-row items-center justify-between py-3">
<span className="font-bold text-green-500 mr-2"> <div className="flex flex-row items-center">
{item.customerSatisfactionPercent} <img src={shop} alt="" className="w-8" />
</span> <div className="flex flex-col mr-3 text-sm">
</p> {"فروشنده" + " " + seller}
</div>
</div>
<img src={circle} alt="" className="w-5" />
</div>
)} )}
<div className="flex flex-row items-center justify-between py-3">
<div className="flex flex-row items-center">
<img src={delivery} alt="" className="w-8" />
<div className="flex flex-col mr-3">
<div className="flex flex-row gap-1 text-sm">
&nbsp;{shippingTime}
</div> </div>
</div> </div>
{item.alertIcon && <img src={circle} alt="" className="w-5" />}
</div> </div>
))} <img src={circle} alt="" className="w-5" />
</div>
{garanty && (
<div className="flex flex-row items-center justify-between py-3">
<div className="flex flex-row items-center">
<img src={shield} alt="" className="w-8" />
<div className="flex flex-col mr-3">
<div className="flex flex-row gap-1 text-sm">{garanty}</div>
</div>
</div>
<img src={circle} alt="" className="w-5" />
</div>
)}
{offerPrice && (
<div className="flex flex-col items-center py-3"> <div className="flex flex-col items-center py-3">
<p className="text-xl text-blueC0 font-bold"> <p className="text-xl text-blueC0 font-bold">
{separate(price)} {separate(price)}
<span className="text-sm text-gray-700 font-light mr-1">تومان</span> <span className="text-sm text-gray-700 font-light mr-1">
تومان
</span>
</p> </p>
<p className="text-xs font-light text-gray-600 mt-2"> <p className="text-xs font-light text-gray-600 mt-2">
با خرید این کالا با خرید این کالا
<span>{discountPrice}</span> <span>{offerPrice}</span>
صرفه جویی کنید صرفه جویی کنید
</p> </p>
</div> </div>
)}
<Button <Button
title="اضافه کردن به سبد خرید" title="اضافه کردن به سبد خرید"
backgroundColor={isDark ? "bg-blueC0" : "bg-blueC0"} backgroundColor={isDark ? "bg-blueC0" : "bg-blueC0"}
@ -113,43 +137,3 @@ const mapDispatchToProps = {
}; };
export default connect(mapStateToProps, mapDispatchToProps)(ProductStatusCard); export default connect(mapStateToProps, mapDispatchToProps)(ProductStatusCard);
ProductStatusCard.defaultProps = {
items: [
{
icon: tick,
title: "توصیه به خرید توسط 4420 نفر",
subtitle: null,
alertIcon: false,
customerSatisfaction: false,
customerSatisfactionPercent: null,
},
{
icon: shop,
title: " آپادانا ",
subtitle: " فروشنده",
alertIcon: true,
customerSatisfaction: true,
customerSatisfactionPercent: " 91.5 ",
},
{
icon: delivery,
title: " 20 روز کاری پس از سفارش ",
subtitle: "زمان ارسال",
alertIcon: false,
customerSatisfaction: false,
customerSatisfactionPercent: null,
},
{
icon: shield,
title: "اصالت و سلامت فیزیکی",
subtitle: "گارانتی ",
alertIcon: true,
customerSatisfaction: false,
customerSatisfactionPercent: null,
},
],
productPrice: " 56/894/000 ",
discountPrice: " 540.000 ",
};

@ -29,7 +29,7 @@ export const ProductOverAll = ({ book, grades, isDark, loading }) => {
<StarRating value={book?.rate || 4} /> <StarRating value={book?.rate || 4} />
</div> </div>
<div className="p-2 border-0 border-solid border-r border-gray-100 text-sm text-gray-400"> <div className="p-2 border-0 border-solid border-r border-gray-100 text-sm text-gray-400">
بیش از 160 نفر امتیاز داده اند بیش از {book?.product[type]?.suggestedCounter} نفر امتیاز داده اند
</div> </div>
</div> </div>
</div> </div>
@ -103,7 +103,12 @@ export const ProductOverAll = ({ book, grades, isDark, loading }) => {
<div className="flex flex-col w-1/3"> <div className="flex flex-col w-1/3">
<ProductStatusCard <ProductStatusCard
price={book?.product[type]?.price} price={book?.product[type]?.price}
garanty={book?.product[type]?.garantyText}
suggestedCounter={book?.product[type]?.suggestedCounter}
seller={book?.product[type]?.sellerId}
offerPrice={book?.product[type]?.offerPrice}
id={book?.product[type]?.id} id={book?.product[type]?.id}
shippingTime={book?.product[type]?.shippingTime}
loading={loading} loading={loading}
/> />
</div> </div>

Loading…
Cancel
Save