From cd01ba82733062db99075ad7690bdb52fb85745a Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Fri, 3 Feb 2023 17:03:45 +0700
Subject: no message

---
 src/pages/shop/checkout.js        |  2 ++
 src/pages/shop/product/[slug].js  | 21 ++++++---------------
 src/pages/shop/quotation/index.js | 34 ++++++++++++++++------------------
 3 files changed, 24 insertions(+), 33 deletions(-)

(limited to 'src/pages/shop')

diff --git a/src/pages/shop/checkout.js b/src/pages/shop/checkout.js
index 875cf0f1..8a540bcd 100644
--- a/src/pages/shop/checkout.js
+++ b/src/pages/shop/checkout.js
@@ -195,6 +195,7 @@ export default function Checkout() {
 
                   { selectedAddress.shipping && (
                     <div className="mt-4 text-caption-1">
+                      <div className="badge-red mb-2">{ selectedAddress.invoicing.type.charAt(0).toUpperCase() + selectedAddress.invoicing.type.slice(1) + ' Address' }</div>
                       <p className="font-medium">{ selectedAddress.shipping.name }</p>
                       <p className="mt-2 text-gray_r-11">{ selectedAddress.shipping.mobile }</p>
                       <p className="mt-1 text-gray_r-11">{ selectedAddress.shipping.street }, { selectedAddress.shipping?.city?.name }</p>
@@ -261,6 +262,7 @@ export default function Checkout() {
 
                   { selectedAddress.invoicing && (
                     <div className="mt-4 text-caption-1">
+                      <div className="badge-red mb-2">{ selectedAddress.invoicing.type.charAt(0).toUpperCase() + selectedAddress.invoicing.type.slice(1) + ' Address' }</div>
                       <p className="font-medium">{ selectedAddress.invoicing.name }</p>
                       <p className="mt-2 text-gray_r-11">{ selectedAddress.invoicing.mobile }</p>
                       <p className="mt-1 text-gray_r-11">{ selectedAddress.invoicing.street } { selectedAddress.invoicing.street2 }</p>
diff --git a/src/pages/shop/product/[slug].js b/src/pages/shop/product/[slug].js
index 03fac0be..c3d34806 100644
--- a/src/pages/shop/product/[slug].js
+++ b/src/pages/shop/product/[slug].js
@@ -15,6 +15,8 @@ import LineDivider from "@/components/elements/LineDivider";
 import { HeartIcon as HeartIconSolid } from "@heroicons/react/24/solid";
 import { useAuth } from "@/core/utils/auth";
 import { HeartIcon } from "@heroicons/react/24/outline";
+import { LazyLoadComponent } from "react-lazy-load-image-component";
+import ProductSimilar from "@/components/products/ProductSimilar";
 
 export async function getServerSideProps( context ) {
   const { slug } = context.query;
@@ -37,7 +39,6 @@ export default function ProductDetail({ product }) {
   const { slug } = router.query;
   const [selectedVariant, setSelectedVariant] = useState("");
   const [quantity, setQuantity] = useState("1");
-  const [similarProducts, setSimilarProducts] = useState(null);
   const [activeVariant, setActiveVariant] = useState({
     id: product.id,
     code: product.code,
@@ -82,15 +83,6 @@ export default function ProductDetail({ product }) {
     }
   }, [ product ]);
 
-  useEffect(() => {
-    setSimilarProducts(null);
-    const getSimilarProducts = async () => {
-      const dataSimilarProducts = await apiOdoo('GET', `/api/v1/product/${getIdFromSlug(slug)}/similar?limit=20`);
-      setSimilarProducts(dataSimilarProducts);
-    }
-    if (slug) getSimilarProducts();
-  }, [slug]);
-
   useEffect(() => {
     if (selectedVariant != '') {
       let newActiveVariant = product.variants.filter((variant) => {
@@ -281,11 +273,10 @@ export default function ProductDetail({ product }) {
         </div>
 
         <LineDivider />
-
-        <div className="p-4">
-          <h2 className="font-bold mb-4">Kamu Mungkin Juga Suka</h2>
-          <ProductSlider products={similarProducts}/>
-        </div>
+        
+        <LazyLoadComponent>
+          <ProductSimilar productId={getIdFromSlug(slug || '')} />
+        </LazyLoadComponent>
         
         <Footer />
       </Layout>
diff --git a/src/pages/shop/quotation/index.js b/src/pages/shop/quotation/index.js
index cf2b956d..e1c196db 100644
--- a/src/pages/shop/quotation/index.js
+++ b/src/pages/shop/quotation/index.js
@@ -16,8 +16,7 @@ export default function Quotation() {
   const router = useRouter();
   const [ auth ] = useAuth();
   const [ products, setProducts ] = useState([]);
-  const [ totalPriceBeforeTax, setTotalPriceBeforeTax ] = useState(0);
-  const [ totalTaxAmount, setTotalTaxAmount ] = useState(0);
+  const [ totalAmount, setTotalAmount ] = useState(0);
   const [ totalDiscountAmount, setTotalDiscountAmount ] = useState(0);
 
   useEffect(() => {
@@ -43,18 +42,13 @@ export default function Quotation() {
 
   useEffect(() => {
     if (products) {
-      const productsSelected = products.filter((product) => product.selected == true);
-      let calculateTotalPriceBeforeTax = 0;
-      let calculateTotalTaxAmount = 0;
+      let calculateTotalAmount = 0;
       let calculateTotalDiscountAmount = 0;
-      productsSelected.forEach(product => {
-        let priceBeforeTax = product.price.price / 1.11; 
-        calculateTotalPriceBeforeTax += priceBeforeTax * product.quantity;
-        calculateTotalTaxAmount += (product.price.price - priceBeforeTax) * product.quantity;
+      products.forEach(product => {
+        calculateTotalAmount += product.price.price * product.quantity;
         calculateTotalDiscountAmount += (product.price.price - product.price.price_discount) * product.quantity;
       });
-      setTotalPriceBeforeTax(calculateTotalPriceBeforeTax);
-      setTotalTaxAmount(calculateTotalTaxAmount);
+      setTotalAmount(calculateTotalAmount);
       setTotalDiscountAmount(calculateTotalDiscountAmount);
     }
   }, [products]);
@@ -102,22 +96,26 @@ export default function Quotation() {
           <hr className="my-4 border-gray_r-6"/>
           <div className="flex flex-col gap-y-4">
             <div className="flex gap-x-2 justify-between">
-              <p>Subtotal</p>
-              <p className="font-medium">{currencyFormat(totalPriceBeforeTax)}</p>
+              <p>Total Belanja</p>
+              <p className="font-medium">{currencyFormat(totalAmount)}</p>
             </div>
             <div className="flex gap-x-2 justify-between">
-              <p>PPN 11%</p>
-              <p className="font-medium">{currencyFormat(totalTaxAmount)}</p>
+              <p>Total Diskon</p>
+              <p className="font-medium text-red_r-11">{'- ' + currencyFormat(totalDiscountAmount)}</p>
             </div>
             <div className="flex gap-x-2 justify-between">
-              <p>Total Diskon</p>
-              <p className="font-medium text-red_r-11">- {currencyFormat(totalDiscountAmount)}</p>
+              <p>Subtotal</p>
+              <p className="font-medium">{currencyFormat(totalAmount - totalDiscountAmount)}</p>
+            </div>
+            <div className="flex gap-x-2 justify-between">
+              <p>PPN 11% (Incl.)</p>
+              <p className="font-medium">{currencyFormat((totalAmount - totalDiscountAmount) * 0.11)}</p>
             </div>
           </div>
           <hr className="my-4 border-gray_r-6"/>
           <div className="flex gap-x-2 justify-between mb-4">
             <p>Grand Total</p>
-            <p className="font-medium text-yellow_r-11">{currencyFormat(totalPriceBeforeTax + totalTaxAmount - totalDiscountAmount)}</p>
+            <p className="font-medium text-yellow_r-11">{currencyFormat(totalAmount - totalDiscountAmount)}</p>
           </div>
           <p className="text-caption-2 text-gray_r-10 mb-2">*) Belum termasuk biaya pengiriman</p>
           <p className="text-caption-2 text-gray_r-10 leading-5">
-- 
cgit v1.2.3