import React, { useState, useEffect } from "react"; import { userProduct, userFactor, publicApi, dialog, } from "../../redux/actions"; import { useNavigate } from "react-router-dom"; import separate from "../../utils/separate"; import { toast } from "react-toastify"; import DeliveryForm from "../DeliveryForm"; import Product from "./Product"; import Address from "../Address"; import Code from "./Code"; import Button from "../../components/Button"; import Empty from "../../components/Empty"; //assets import dropdownIcon from "../../assets/icons/white-dropdown.svg"; import alertIcon from "../../assets/icons/alert.svg"; import { connect } from "react-redux"; function ShoppingCart({ isDark, isMobile, list, factorInfo, user, getList, getFactorInfo, headerOptions, setHeaderOptions, desktopContentTransform, userProducts, payFactor, loading, setDialog, isLogin, }) { const [phase, setPhase] = useState("products"); const navigation = useNavigate(); useEffect(() => { console.log("gl1") if (isLogin) getList(); getFactorInfo({ userId: user?.id }); setHeaderOptions(headerOptions); }, []); useEffect(() => { if (phase === "products") { setHeaderOptions(headerOptions); } }, [phase]); const productsLength = userProducts?.filter( (product) => product.condition < 2 )?.length; const next = { products: () => productsLength ? userProducts.filter((object) => object.productType === 2).length > 0 ? setPhase("deliveryForm") : setDialog({ type: "confirm", text: "به درگاه پرداخت بریم؟", open: true, accept: () => payFactor({ userId: user.id }), }) : toast.info("ابتدا یک محصول را به سبد خرید خود اضافه کنید."), deliveryForm: () => setDialog({ type: "confirm", text: "به درگاه پرداخت بریم؟", open: true, accept: () => payFactor({ userId: user.id }), }), profile: () => { console.log("Set profile"); console.log("Go to shaparak"); }, }; const Table = () => { return (
کالاهای انتخابی تعداد سفارش
); }; const PriceStatus = ({ name, value, type }) => { return isMobile ? (
{name} {separate(Math.floor(value))} تومان
) : (
{name} {separate(Math.floor(value))} تومان
); }; const layouts = { products: isMobile ? ( <> {list .sort((a, b) => a?.id - b?.id) .map( (product, index) => product.condition < 2 && ( ) )} ) : productsLength ? ( ) : ( navigation("/products")} /> // سبد خرید شما خالی است. ), deliveryForm: , address:
, }; return isMobile ? (
{productsLength ? ( <>
{layouts[phase]}
{phase !== "address" && ( <>
{/* */}
جمع کل سبد خرید

{separate(productsLength ? factorInfo?.payPrice : 0) + " " + "تومان"}

هزینه ارسال کالا پس از تعیین محل آدرس مشخص می‌شود

)} )} ) : ( navigation("/products")} /> )}
) : (
{layouts[phase]}
{console.log(list)} {list?.filter((product) => product?.condition < 2)?.length ? phase !== "address" && (
{/* */}
جمع کل سبد خرید

{separate(productsLength ? factorInfo?.payPrice : "")} تومان

{phase === "products" && (

هزینه ارسال کالا پس از تعیین محل آدرس مشخص می‌شود

)} {null && phase === "deliveryForm" && (
انتخاب شیوه پرداخت
)}

)}
) : null}
); } const mapStateToProps = (state) => ({ isDark: state.publicApi.isDark, isMobile: state.publicApi.isMobile, list: state.userProduct.list, payPrice: state.userProduct.sum, factorInfo: state.userFactor.info, user: state.user.status, hasPhysical: state.userProduct.hasPhysical, desktopContentTransform: state.publicApi.desktopContentTransform, userProducts: state.userProduct.list, loading: state.userProduct.loading, isLogin: state.user.status, }); const mapDispatchToProps = { getList: userProduct.list, getInfo: userProduct.info, getFactorInfo: userFactor.info, payFactor: userFactor.payment, setHeaderOptions: publicApi.setHeaderOptions, setDialog: dialog.set, }; export default connect(mapStateToProps, mapDispatchToProps)(ShoppingCart);