reza added empty to cart

temp
Reza_ashrafi 3 years ago
parent 3726ef9f14
commit fcb2390215
  1. 5
      src/components/Empty/index.js
  2. 21
      src/views/ShoppingCart/index.js

@ -5,9 +5,12 @@ export const Empty = ({ text, buttonText, buttonAction }) => {
return ( return (
<div <div
className="flex-1 flex flex-col justify-center items-center" className="flex-1 flex flex-col justify-center items-center"
style={{ minHeight: 'calc(100vh - 120px)' }} style={{ minHeight: "calc(100vh - 120px)" }}
> >
<strong className="text-lg font-bold text-gray1">{text}</strong> <strong className="text-lg font-bold text-gray1">{text}</strong>
{buttonText && (
<button className="transform translate-y-20 py-2 px-6 text-base rounded-md bg-blueC0 text-white" onClick={() => buttonAction()}>{buttonText}</button>
)}
</div> </div>
); );
}; };

@ -5,6 +5,7 @@ import {
publicApi, publicApi,
dialog, dialog,
} from "../../redux/actions"; } from "../../redux/actions";
import { useNavigate } from "react-router-dom";
import separate from "../../utils/separate"; import separate from "../../utils/separate";
import { toast } from "react-toastify"; import { toast } from "react-toastify";
import DeliveryForm from "../DeliveryForm"; import DeliveryForm from "../DeliveryForm";
@ -12,6 +13,7 @@ import Product from "./Product";
import Address from "../Address"; import Address from "../Address";
import Code from "./Code"; import Code from "./Code";
import Button from "../../components/Button"; import Button from "../../components/Button";
import Empty from "../../components/Empty";
//assets //assets
import dropdownIcon from "../../assets/icons/dropdown-blue.svg"; import dropdownIcon from "../../assets/icons/dropdown-blue.svg";
@ -36,7 +38,7 @@ function ShoppingCart({
setDialog, setDialog,
}) { }) {
const [phase, setPhase] = useState("products"); const [phase, setPhase] = useState("products");
const navigation = useNavigate();
useEffect(() => { useEffect(() => {
getList(); getList();
getFactorInfo({ userId: user?.id }); getFactorInfo({ userId: user?.id });
@ -165,17 +167,13 @@ function ShoppingCart({
const layouts = { const layouts = {
products: isMobile ? ( products: isMobile ? (
<> <>
{productsLength ? ( {list
list
.sort((a, b) => a?.id - b?.id) .sort((a, b) => a?.id - b?.id)
.map( .map(
(product, index) => (product, index) =>
product.condition < 2 && ( product.condition < 2 && (
<Product loading={loading} key={index} product={product} /> <Product loading={loading} key={index} product={product} />
) )
)
) : (
<strong className="text-blueC0">سبد خرید شما خالی است.</strong>
)} )}
<Code /> <Code />
</> </>
@ -190,6 +188,9 @@ function ShoppingCart({
return isMobile ? ( return isMobile ? (
<div className="w-full flex flex-col px-4 pb-24"> <div className="w-full flex flex-col px-4 pb-24">
{productsLength ? (
<>
{" "}
<div className="flex flex-col flex-1">{layouts[phase]}</div> <div className="flex flex-col flex-1">{layouts[phase]}</div>
{phase !== "address" && ( {phase !== "address" && (
<> <>
@ -250,6 +251,14 @@ function ShoppingCart({
)} )}
</> </>
)} )}
</>
) : (
<Empty
text="سبد خرید شما خالی است."
buttonText="فروشگاه"
buttonAction={() => navigation('/products')}
/>
)}
</div> </div>
) : ( ) : (
<div <div

Loading…
Cancel
Save