@ -41,6 +41,7 @@ function ShoppingCart({
const [ phase , setPhase ] = useState ( "products" ) ;
const navigation = useNavigate ( ) ;
useEffect ( ( ) => {
console . log ( "gl1" ) ;
if ( isLogin ) getList ( ) ;
getFactorInfo ( { userId : user ? . id } ) ;
setHeaderOptions ( headerOptions ) ;
@ -56,42 +57,40 @@ function ShoppingCart({
return userProducts ? . filter ( ( product ) => product . condition < 2 ) ? . length ;
} , [ userProducts ] ) ;
const next = useMemo ( ( ) => {
return {
products : ( ) =>
productsLength
? userProducts . filter ( ( object ) => object . productType === 2 ) ? . length
? 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" ) ;
} ,
} ;
} , [ userProducts , user ] ) ;
const next = {
products : ( ) =>
productsLength
? userProducts . filter ( ( object ) => object . productType === 2 ) . length > 0
? setPhase ( "deliveryForm" )
: setDialog ( {
type : "confirm" ,
text : window . t ( "به درگاه پرداخت بریم؟" ) ,
open : true ,
accept : ( ) => payFactor ( { userId : user . id } ) ,
} )
: toast . info ( window . t ( "ابتدا یک محصول را به سبد خرید خود اضافه کنید." ) ) ,
deliveryForm : ( ) =>
setDialog ( {
type : "confirm" ,
text : window . t ( "به درگاه پرداخت بریم؟" ) ,
open : true ,
accept : ( ) => payFactor ( { userId : user . id } ) ,
} ) ,
profile : ( ) => {
console . log ( "Set profile" ) ;
console . log ( "Go to shaparak" ) ;
} ,
} ;
const Table = React . useCallback ( ( ) => {
return (
< div className = "w-full flex flex-col" >
< header className = "w-full flex gap-10" >
< strong className = "w-3/4 pb-2 border-b border-solid border-gray-200 text-gray70 text-sm font-normal" >
کالاهای انتخابی
{ window . t ( "کالاهای انتخابی" ) }
< / s t r o n g >
< strong className = "w-1/4 pb-2 border-b border-solid border-gray-200 text-gray70 text-sm font-normal" >
تعداد سفارش
{ window . t ( "تعداد سفارش" ) }
< / s t r o n g >
< / h e a d e r >
< ul className = "w-full mt-2 list-none p-0" >
@ -111,95 +110,88 @@ function ShoppingCart({
) ;
} , [ userProducts ] ) ;
const PriceStatus = useCallback (
( { name , value , type } ) => {
return (
< React . Fragment >
< div className = "w-full flex lg:hidden justify-between py-3" >
< strong className = "font-semibold text-tiny dark:text-white text-blue5F" >
{ name }
< / s t r o n g >
< span
className = "font-medium text-lg dark:text-white"
style = { {
color : ! isDark
? type === "error"
? "#F1420D"
: "rgb(6, 186, 206)"
: "" ,
} }
>
{ separate ( Math . floor ( value ) ) }
< span
style = { {
color : ! isDark ? ( type === "error" ? "#F1420D" : "" ) : "" ,
} }
className = "text-sm mr-2"
>
تومان
< / s p a n >
< / s p a n >
< / d i v >
< div className = "w-full hidden lg:flex justify-between py-4" >
< strong className = "font-semibold text-tiny dark:text-white text-blue5F" >
{ name }
< / s t r o n g >
{ value ? (
< span
className = "font-medium text-lg dark:text-white"
style = { {
color : ! isDark
? type === "error"
? "#F1420D"
: "rgb(6, 186, 206)"
: "" ,
} }
>
{ separate ( Math . floor ( value ) ) }
< span
style = { {
color : ! isDark ? ( type === "error" ? "#F1420D" : "" ) : "" ,
} }
className = "text-sm mr-2"
>
تومان
< / s p a n >
< / s p a n >
) : null }
< / d i v >
< / R e a c t . F r a g m e n t >
) ;
} ,
[ useless ]
) ;
const PriceStatus = ( { name , value , type } ) => {
return isMobile ? (
< div className = "w-full flex flex-row justify-between py-3" >
< strong className = "font-semibold text-tiny dark:text-white text-blue5F" >
{ name }
< / s t r o n g >
< span
className = "font-medium text-lg dark:text-white"
style = { {
color : ! isDark
? type === "error"
? "#F1420D"
: "rgb(6, 186, 206)"
: "" ,
} }
>
{ separate ( Math . floor ( value ) ) }
< span
style = { {
color : ! isDark ? ( type === "error" ? "#F1420D" : "" ) : "" ,
} }
className = "text-sm mr-2"
>
{ window . t ( "تومان" ) }
< / s p a n >
< / s p a n >
< / d i v >
) : (
< div className = "w-full flex flex-row justify-between py-4" >
< strong className = "font-semibold text-tiny dark:text-white text-blue5F" >
{ name }
< / s t r o n g >
< span
className = "font-medium text-lg dark:text-white"
style = { {
color : ! isDark
? type === "error"
? "#F1420D"
: "rgb(6, 186, 206)"
: "" ,
} }
>
{ separate ( Math . floor ( value ) ) }
< span
style = { {
color : ! isDark ? ( type === "error" ? "#F1420D" : "" ) : "" ,
} }
className = "text-sm mr-2"
>
{ window . t ( "تومان" ) }
< / s p a n >
< / s p a n >
< / d i v >
) ;
} ;
const layouts = useMemo ( ( ) => {
return {
products : isMobile ? (
< >
{ userProducts
. sort ( ( a , b ) => a ? . id - b ? . id )
. map (
( product , index ) =>
product . condition < 2 && (
< Product loading = { loading } key = { index } product = { product } / >
)
) }
< Code / >
< / >
) : productsLength ? (
< Table / >
) : (
< Empty
text = "سبد خرید شما خالی است."
buttonText = "فروشگاه"
buttonAction = { ( ) => navigation ( "/products" ) }
/ >
) ,
deliveryForm : < DeliveryForm setPhase = { setPhase } / > ,
address : < Address setPhase = { setPhase } / > ,
} ;
} , [ isMobile , userProducts , loading ] ) ;
const layouts = {
products : isMobile ? (
< >
{ userProducts
. sort ( ( a , b ) => a ? . id - b ? . id )
. map (
( product , index ) =>
product . condition < 2 && (
< Product loading = { loading } key = { index } product = { product } / >
)
) }
< Code / >
< / >
) : productsLength ? (
< Table / >
) : (
< Empty
text = { window . t ( "سبد خرید شما خالی است." ) }
buttonText = { window . t ( "فروشگاه" ) }
buttonAction = { ( ) => navigation ( "/products" ) }
/ >
// <strong className="text-blueC0">سبد خرید شما خالی است.</strong>
) ,
deliveryForm : < DeliveryForm setPhase = { setPhase } / > ,
address : < Address setPhase = { setPhase } / > ,
} ;
return isMobile ? (
< div className = "w-full flex flex-col px-4 pb-24" >
@ -210,30 +202,25 @@ function ShoppingCart({
< >
< div className = "flex flex-col w-full border-t border-gray-300 border-b" >
< PriceStatus
name =
value = { factorInfo ? . sumPrice ? factorInfo ? . sumPrice : null }
name = { window . t ( ) }
value = { productsLength ? factorInfo ? . sumPrice : 0 }
type = "normal"
/ >
< PriceStatus
name =
value = { factorInfo ? . offPrice ? factorInfo ? . offPrice : null }
name = { window . t ( ) }
value = { productsLength ? factorInfo ? . offPrice : 0 }
type = "error"
/ >
{ / * < P r i c e S t a t u s
name = "مالیات بر ارزش افزوده"
value = { productsLength ? factorInfo ? . sumPrice * 0.009 : 0 }
type = "error"
/> */ }
< / d i v >
< div className = "flex justify-between items-center w-full py-3" >
< strong className = "font-bold text-tiny text-blue5F dark:text-white" >
جمع کل سبد خرید
{ window . t ( "جمع کل سبد خرید" ) }
< / s t r o n g >
{ factorInfo ? . payFactor ? (
< p className = "font-medium text-greenBA text-lg dark:text-white" >
{ separate ( factorInfo ? . payPrice ) + + "تومان" }
< / p >
) : null }
< p className = "font-medium text-greenBA text-lg dark:text-white" >
{ separate ( productsLength ? factorInfo ? . payPrice : 0 ) +
+
window . t ( "تومان" ) }
< / p >
< / d i v >
< div
className = "w-full rounded-md flex justify-center items-center py-2.5 px-3 mt-5 mb-4"
@ -241,11 +228,13 @@ function ShoppingCart({
>
< img src = { alertIcon } className = "w-5 ml-2" / >
< p className = "text-xs text-green71 dark:text-white text-justify font-medium" >
هزینه ارسال کالا پس از تعیین محل آدرس مشخص می شود
{ window . t (
"هزینه ارسال کالا پس از تعیین محل آدرس مشخص می
) }
< / p >
< / d i v >
< Button
title = "ادامه فرایند خرید"
text = { window . t ( "ادامه فرایند خرید" ) }
backgroundColor = "bg-blueC0"
border = { { color : "#196EC055" , width : "0px" } }
width = "100%"
@ -258,7 +247,6 @@ function ShoppingCart({
onClick = { ( ) => setPhase ( "products" ) }
>
{ window . t ( "بازگشت" ) }
< img
src = { dropdownIcon }
alt = ""
@ -271,7 +259,7 @@ function ShoppingCart({
< / >
) : (
< Empty
text =
text = { window . t ( ) }
buttonText = "فروشگاه"
buttonAction = { ( ) => navigation ( "/products" ) }
/ >
@ -292,22 +280,18 @@ function ShoppingCart({
>
< div className = "flex flex-col w-full border-t py-2 border-gray-300 border-b" >
< PriceStatus
name =
value = { factorInfo ? . sumPrice ? factorInfo ? . sumPrice : null }
name = { window . t ( ) }
value = { productsLength ? factorInfo ? . sumPrice : "" }
type = "normal"
/ >
< PriceStatus
name = "هزینه حمل و نقل"
value = {
factorInfo ? . transportPrice
? factorInfo ? . transportPrice
: " "
}
name = { window . t ( "هزینه حمل و نقل" ) }
value = { productsLength ? factorInfo ? . transportPrice : 0 }
type = "error"
/ >
< PriceStatus
name =
value = { factorInfo ? . offPrice ? factorInfo ? . offPrice : null }
name = { window . t ( "میزان تخفیف" ) }
value = { productsLength ? factorInfo ? . offPrice : "" }
type = "error"
/ >
{ / * < P r i c e S t a t u s
@ -322,35 +306,35 @@ function ShoppingCart({
< / d i v >
< div className = "flex justify-between items-center w-full py-4 border-t border-b border-grayDB border-solid" >
< strong className = "font-semibold text-tiny text-blue5F dark:text-white" >
جمع کل سبد خرید
{ window . t ( "جمع کل سبد خرید" ) }
< / s t r o n g >
{ factorInfo ? . payPrice ? (
< p className = "font-medium text-greenBA text-lg dark:text-white" >
{ separate ( factorInfo ? . payPrice ) }
< span className = "font-medium text-greenBA text-sm mr-2" >
تومان
< / s p a n >
< / p >
) : null }
< p className = "font-medium text-greenBA text-lg dark:text-white" >
{ separate ( productsLength ? factorInfo ? . payPrice : "" ) }
< span className = "font-medium text-greenBA text-sm mr-2" >
{ window . t ( "تومان" ) }
< / s p a n >
< / p >
< / d i v >
{ phase === "products" && (
< div
className = "w-full rounded-md flex justify-center items-center py-2.5 px-3 mt-5 mb-4"
style = { { backgroundColor : "#DEFFF188" } }
>
< img src = { alertIcon } className = "w-5 ml-2" / >
< img src = { alertIcon } className = "w-5 ml-2" alt = "" / >
< p className = "text-xs text-green71 dark:text-white text-justify font-medium" >
هزینه ارسال کالا پس از تعیین محل آدرس مشخص می شود
{ window . t (
"هزینه ارسال کالا پس از تعیین محل آدرس مشخص می
) }
< / p >
< / d i v >
) }
{ null && phase === "deliveryForm" && (
< div className = "flex flex-col mt-10" >
< strong className = "text-tiny text-blue52 mb-5 font-medium" >
انتخاب شیوه پرداخت
{ window . t ( "انتخاب شیوه پرداخت" ) }
< / s t r o n g >
< Button
title =
title = { window . t ( ) }
backgroundColor = "bg-transparent"
border = { { color : "#77777755" , width : "1px" } }
width = "100%"
@ -359,7 +343,7 @@ function ShoppingCart({
/ >
< br / >
< Button
title =
title = { window . t ( ) }
backgroundColor = "bg-transparent"
border = { { color : "#77777755" , width : "1px" } }
width = "100%"
@ -375,11 +359,11 @@ function ShoppingCart({
< Button
title = {
phase === "deliveryForm"
?
? window . t ( )
: userProducts . filter ( ( object ) => object . productType === 2 )
. length > 0
?
:
? window . t ( )
: window . t ( )
}
backgroundColor = "bg-blueC0"
border = { { color : "#196EC055" , width : "0px" } }
