|
|
|
@ -274,111 +274,116 @@ function ShoppingCart({ |
|
|
|
|
}`}
|
|
|
|
|
> |
|
|
|
|
<div className="flex flex-col flex-1">{layouts[phase]}</div> |
|
|
|
|
{phase !== "address" && ( |
|
|
|
|
<div |
|
|
|
|
className="flex flex-col w-1/4 p-10 bg-white shadow-all rounded-md px-4 py-4" |
|
|
|
|
style={{ height: "fit-content", minWidth: 350 }} |
|
|
|
|
> |
|
|
|
|
<div className="flex flex-col w-full border-t py-2 border-gray-300 border-b"> |
|
|
|
|
<PriceStatus |
|
|
|
|
name="مبلغ سبد خرید" |
|
|
|
|
value={productsLength ? factorInfo?.sumPrice : ""} |
|
|
|
|
type="normal" |
|
|
|
|
/> |
|
|
|
|
<PriceStatus |
|
|
|
|
name="میزان تخفیف" |
|
|
|
|
value={productsLength ? factorInfo?.offPrice : ""} |
|
|
|
|
type="error" |
|
|
|
|
/> |
|
|
|
|
<PriceStatus |
|
|
|
|
name="مالیات بر ارزش افزوده" |
|
|
|
|
value={ |
|
|
|
|
productsLength ? Math.floor(factorInfo?.sumPrice * 0.009) : "" |
|
|
|
|
} |
|
|
|
|
type="error" |
|
|
|
|
/> |
|
|
|
|
</div> |
|
|
|
|
<div className="flex flex-row 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"> |
|
|
|
|
جمع کل سبد خرید |
|
|
|
|
</strong> |
|
|
|
|
<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"> |
|
|
|
|
تومان |
|
|
|
|
</span> |
|
|
|
|
</p> |
|
|
|
|
</div> |
|
|
|
|
{phase === "products" && ( |
|
|
|
|
{console.log(list)} |
|
|
|
|
{list?.length |
|
|
|
|
? phase !== "address" && ( |
|
|
|
|
<div |
|
|
|
|
className="w-full rounded-md flex flex-row justify-center items-center py-2.5 px-3 mt-5 mb-4" |
|
|
|
|
style={{ backgroundColor: "#DEFFF188" }} |
|
|
|
|
className="flex flex-col w-1/4 p-10 bg-white shadow-all rounded-md px-4 py-4" |
|
|
|
|
style={{ height: "fit-content", minWidth: 350 }} |
|
|
|
|
> |
|
|
|
|
<img src={alertIcon} className="w-5 ml-2" /> |
|
|
|
|
<p className="text-xs text-green71 dark:text-white text-justify font-medium"> |
|
|
|
|
هزینه ارسال کالا پس از تعیین محل آدرس مشخص میشود |
|
|
|
|
</p> |
|
|
|
|
</div> |
|
|
|
|
)} |
|
|
|
|
{null && phase === "deliveryForm" && ( |
|
|
|
|
<div className="flex flex-col mt-10"> |
|
|
|
|
<strong className="text-tiny text-blue52 mb-5 font-medium"> |
|
|
|
|
انتخاب شیوه پرداخت |
|
|
|
|
</strong> |
|
|
|
|
<Button |
|
|
|
|
title="از طریق درگاه پرداخت" |
|
|
|
|
backgroundColor="bg-transparent" |
|
|
|
|
border={{ color: "#77777755", width: "1px" }} |
|
|
|
|
width="100%" |
|
|
|
|
color="text-blue52" |
|
|
|
|
onClick={() => {}} |
|
|
|
|
/> |
|
|
|
|
<div className="flex flex-col w-full border-t py-2 border-gray-300 border-b"> |
|
|
|
|
<PriceStatus |
|
|
|
|
name="مبلغ سبد خرید" |
|
|
|
|
value={productsLength ? factorInfo?.sumPrice : ""} |
|
|
|
|
type="normal" |
|
|
|
|
/> |
|
|
|
|
<PriceStatus |
|
|
|
|
name="میزان تخفیف" |
|
|
|
|
value={productsLength ? factorInfo?.offPrice : ""} |
|
|
|
|
type="error" |
|
|
|
|
/> |
|
|
|
|
<PriceStatus |
|
|
|
|
name="مالیات بر ارزش افزوده" |
|
|
|
|
value={ |
|
|
|
|
productsLength |
|
|
|
|
? Math.floor(factorInfo?.sumPrice * 0.009) |
|
|
|
|
: "" |
|
|
|
|
} |
|
|
|
|
type="error" |
|
|
|
|
/> |
|
|
|
|
</div> |
|
|
|
|
<div className="flex flex-row 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"> |
|
|
|
|
جمع کل سبد خرید |
|
|
|
|
</strong> |
|
|
|
|
<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"> |
|
|
|
|
تومان |
|
|
|
|
</span> |
|
|
|
|
</p> |
|
|
|
|
</div> |
|
|
|
|
{phase === "products" && ( |
|
|
|
|
<div |
|
|
|
|
className="w-full rounded-md flex flex-row justify-center items-center py-2.5 px-3 mt-5 mb-4" |
|
|
|
|
style={{ backgroundColor: "#DEFFF188" }} |
|
|
|
|
> |
|
|
|
|
<img src={alertIcon} className="w-5 ml-2" /> |
|
|
|
|
<p className="text-xs text-green71 dark:text-white text-justify font-medium"> |
|
|
|
|
هزینه ارسال کالا پس از تعیین محل آدرس مشخص میشود |
|
|
|
|
</p> |
|
|
|
|
</div> |
|
|
|
|
)} |
|
|
|
|
{null && phase === "deliveryForm" && ( |
|
|
|
|
<div className="flex flex-col mt-10"> |
|
|
|
|
<strong className="text-tiny text-blue52 mb-5 font-medium"> |
|
|
|
|
انتخاب شیوه پرداخت |
|
|
|
|
</strong> |
|
|
|
|
<Button |
|
|
|
|
title="از طریق درگاه پرداخت" |
|
|
|
|
backgroundColor="bg-transparent" |
|
|
|
|
border={{ color: "#77777755", width: "1px" }} |
|
|
|
|
width="100%" |
|
|
|
|
color="text-blue52" |
|
|
|
|
onClick={() => {}} |
|
|
|
|
/> |
|
|
|
|
<br /> |
|
|
|
|
<Button |
|
|
|
|
title="پرداخت در محل" |
|
|
|
|
backgroundColor="bg-transparent" |
|
|
|
|
border={{ color: "#77777755", width: "1px" }} |
|
|
|
|
width="100%" |
|
|
|
|
color="text-blue52" |
|
|
|
|
onClick={() => {}} |
|
|
|
|
/> |
|
|
|
|
<br /> |
|
|
|
|
<br /> |
|
|
|
|
</div> |
|
|
|
|
)} |
|
|
|
|
<br /> |
|
|
|
|
<br /> |
|
|
|
|
<Button |
|
|
|
|
title="پرداخت در محل" |
|
|
|
|
backgroundColor="bg-transparent" |
|
|
|
|
border={{ color: "#77777755", width: "1px" }} |
|
|
|
|
title={ |
|
|
|
|
phase === "deliveryForm" |
|
|
|
|
? "پرداخت" |
|
|
|
|
: userProducts.filter((object) => object.productType === 2) |
|
|
|
|
.length > 0 |
|
|
|
|
? "ادامه فرایند خرید" |
|
|
|
|
: "پرداخت" |
|
|
|
|
} |
|
|
|
|
backgroundColor="bg-blueC0" |
|
|
|
|
border={{ color: "#196EC055", width: "0px" }} |
|
|
|
|
width="100%" |
|
|
|
|
color="text-blue52" |
|
|
|
|
onClick={() => {}} |
|
|
|
|
color="text-white" |
|
|
|
|
onClick={next[phase]} |
|
|
|
|
// loading={loading}
|
|
|
|
|
/> |
|
|
|
|
<br /> |
|
|
|
|
<br /> |
|
|
|
|
{phase === "deliveryForm" && ( |
|
|
|
|
<button |
|
|
|
|
className="bg-transparent mt-4 text-tiny border border-solid border-blueC0 text-green7B rounded-full py-3 flex flex-row justify-center items-center" |
|
|
|
|
onClick={() => setPhase("products")} |
|
|
|
|
> |
|
|
|
|
بازگشت |
|
|
|
|
<img |
|
|
|
|
src={dropdownIcon} |
|
|
|
|
alt="" |
|
|
|
|
className="w-4 transform rotate-90" |
|
|
|
|
/> |
|
|
|
|
</button> |
|
|
|
|
)} |
|
|
|
|
</div> |
|
|
|
|
)} |
|
|
|
|
<br /> |
|
|
|
|
<br /> |
|
|
|
|
<Button |
|
|
|
|
title={ |
|
|
|
|
phase === "deliveryForm" |
|
|
|
|
? "پرداخت" |
|
|
|
|
: userProducts.filter((object) => object.productType === 2) |
|
|
|
|
.length > 0 |
|
|
|
|
? "ادامه فرایند خرید" |
|
|
|
|
: "پرداخت" |
|
|
|
|
} |
|
|
|
|
backgroundColor="bg-blueC0" |
|
|
|
|
border={{ color: "#196EC055", width: "0px" }} |
|
|
|
|
width="100%" |
|
|
|
|
color="text-white" |
|
|
|
|
onClick={next[phase]} |
|
|
|
|
// loading={loading}
|
|
|
|
|
/> |
|
|
|
|
{phase === "deliveryForm" && ( |
|
|
|
|
<button |
|
|
|
|
className="bg-transparent mt-4 text-tiny border border-solid border-blueC0 text-green7B rounded-full py-3 flex flex-row justify-center items-center" |
|
|
|
|
onClick={() => setPhase("products")} |
|
|
|
|
> |
|
|
|
|
بازگشت |
|
|
|
|
<img |
|
|
|
|
src={dropdownIcon} |
|
|
|
|
alt="" |
|
|
|
|
className="w-4 transform rotate-90" |
|
|
|
|
/> |
|
|
|
|
</button> |
|
|
|
|
)} |
|
|
|
|
</div> |
|
|
|
|
)} |
|
|
|
|
) |
|
|
|
|
: null} |
|
|
|
|
</div> |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|