From 39b5e05a5fcc7ca26342f37e85c6585d1dacb3a5 Mon Sep 17 00:00:00 2001
From: "HATEC\\SPVDEV001" <tri.susilo@altama.co.id>
Date: Tue, 5 Mar 2024 14:37:44 +0700
Subject: add address & expedisi di page quotation - template stepper approval

---
 src/lib/quotation/components/Quotation.jsx | 116 ++++++++++++++++++++++++++++-
 1 file changed, 112 insertions(+), 4 deletions(-)

(limited to 'src/lib/quotation/components')

diff --git a/src/lib/quotation/components/Quotation.jsx b/src/lib/quotation/components/Quotation.jsx
index baf1492c..fbb0627c 100644
--- a/src/lib/quotation/components/Quotation.jsx
+++ b/src/lib/quotation/components/Quotation.jsx
@@ -24,6 +24,8 @@ import {
   SectionExpedisi,
   SectionListService,
   SectionValidation,
+  calculateEstimatedArrival,
+  splitDuration,
 } from '../../checkout/components/CheckoutSection';
 import addressesApi from '@/lib/address/api/addressesApi';
 import { getItemAddress } from '@/core/utils/address';
@@ -64,6 +66,7 @@ const Quotation = () => {
   const [biayaKirim, setBiayaKirim] = useState(0);
   const [selectedExpedisiService, setselectedExpedisiService] = useState(null);
   const [etd, setEtd] = useState(null);
+  const [etdFix, setEtdFix] = useState(null);
 
   const expedisiValidation = useRef(null);
 
@@ -170,6 +173,19 @@ const Quotation = () => {
     }
   }, [selectedExpedisi]);
 
+  useEffect(() => {
+    if (selectedServiceType) {
+      let serviceType = selectedServiceType.split(',');
+      setBiayaKirim(serviceType[0]);
+      setselectedExpedisiService(serviceType[1]);
+      setEtd(serviceType[2]);
+    }
+  }, [selectedServiceType]);
+
+  useEffect(() => {
+    if (etd) setEtdFix(calculateEstimatedArrival(etd));
+  }, [etd]);
+
   // end set up address and carrier
 
   useEffect(() => {
@@ -248,6 +264,10 @@ const Quotation = () => {
       partner_invoice_id: auth.partnerId,
       user_id: auth.id,
       order_line: JSON.stringify(productOrder),
+      delivery_amount: biayaKirim,
+      carrier_id: selectedCarrierId,
+      estimated_arrival_days: splitDuration(etd),
+      delivery_service_type: selectedExpedisiService,
     };
     const isSuccess = await checkoutApi({ data });
     setIsLoading(false);
@@ -278,6 +298,68 @@ const Quotation = () => {
 
         <Divider />
 
+        {selectedCarrierId == SELF_PICKUP_ID && (
+          <div className='p-4'>
+            <div
+              class='flex items-center p-4 mb-4 text-sm border border-yellow-500 text-yellow-800 rounded-lg bg-yellow-50'
+              role='alert'
+            >
+              <svg
+                class='flex-shrink-0 inline w-4 h-4 mr-3'
+                aria-hidden='true'
+                fill='currentColor'
+                viewBox='0 0 20 20'
+              >
+                <path d='M10 .5a9.5 9.5 0 1 0 9.5 9.5A9.51 9.51 0 0 0 10 .5ZM9.5 4a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM12 15H8a1 1 0 0 1 0-2h1v-3H8a1 1 0 0 1 0-2h2a1 1 0 0 1 1 1v4h1a1 1 0 0 1 0 2Z' />
+              </svg>
+              <span class='sr-only'>Info</span>
+              <div className='text-justify'>
+                Fitur Self Pickup, hanya berlaku untuk customer di area jakarta.
+                Apa bila memilih fitur ini, anda akan dihubungi setelah barang
+                siap diambil.
+              </div>
+            </div>
+          </div>
+        )}
+
+        {selectedCarrierId == SELF_PICKUP_ID && (
+          <PickupAddress label='Alamat Pickup' />
+        )}
+        {selectedCarrierId != SELF_PICKUP_ID && (
+          <Skeleton
+            isLoaded={!!selectedAddress.invoicing && !!selectedAddress.shipping}
+            minHeight={320}
+          >
+            <SectionAddress
+              address={selectedAddress.shipping}
+              label='Alamat Pengiriman'
+              url='/my/address?select=shipping'
+            />
+            <Divider />
+            <SectionAddress
+              address={selectedAddress.invoicing}
+              label='Alamat Penagihan'
+              url='/my/address?select=invoice'
+            />
+          </Skeleton>
+        )}
+        <Divider />
+        <SectionValidation address={selectedAddress.invoicing} />
+        <SectionExpedisi
+          address={selectedAddress.shipping}
+          listExpedisi={listExpedisi}
+          setSelectedExpedisi={setSelectedExpedisi}
+          checkWeigth={checkWeigth}
+          checkoutValidation={checkoutValidation}
+          expedisiValidation={expedisiValidation}
+          loadingRajaOngkir={loadingRajaOngkir}
+        />
+        <Divider />
+        <SectionListService
+          listserviceExpedisi={listserviceExpedisi}
+          setSelectedServiceType={setSelectedServiceType}
+        />
+
         <div className='p-4 flex flex-col gap-y-4'>
           {products && (
             <VariantGroupCard openOnClick={false} variants={products} />
@@ -313,12 +395,25 @@ const Quotation = () => {
               <div className='text-gray_r-11'>PPN 11%</div>
               <div>{currencyFormat(cartCheckout?.tax)}</div>
             </div>
+            <div className='flex gap-x-2 justify-between'>
+              <div className='text-gray_r-11'>
+                Biaya Kirim <p className='text-xs mt-3'>{etdFix}</p>
+              </div>
+              <div>
+                {currencyFormat(
+                  Math.round(parseInt(biayaKirim * 1.1) / 1000) * 1000
+                )}
+              </div>
+            </div>
           </div>
           <hr className='my-4 border-gray_r-6' />
           <div className='flex gap-x-2 justify-between mb-4'>
             <div>Grand Total</div>
             <div className='font-semibold text-gray_r-12'>
-              {currencyFormat(cartCheckout?.grandTotal)}
+              {currencyFormat(
+                cartCheckout?.grandTotal +
+                  Math.round(parseInt(biayaKirim * 1.1) / 1000) * 1000
+              )}
             </div>
           </div>
           <p className='text-caption-2 text-gray_r-10 mb-2'>
@@ -428,6 +523,16 @@ const Quotation = () => {
                   <div className='text-gray_r-11'>PPN 11%</div>
                   <div>{currencyFormat(cartCheckout?.tax)}</div>
                 </div>
+                <div className='flex gap-x-2 justify-between'>
+                  <div className='text-gray_r-11'>
+                    Biaya Kirim <p className='text-xs mt-3'>{etdFix}</p>
+                  </div>
+                  <div>
+                    {currencyFormat(
+                      Math.round(parseInt(biayaKirim * 1.1) / 1000) * 1000
+                    )}
+                  </div>
+                </div>
               </div>
 
               <hr className='my-4 border-gray_r-6' />
@@ -435,12 +540,15 @@ const Quotation = () => {
               <div className='flex gap-x-2 justify-between mb-4'>
                 <div>Grand Total</div>
                 <div className='font-semibold text-gray_r-12'>
-                  {currencyFormat(cartCheckout?.grandTotal)}
+                  {currencyFormat(
+                    cartCheckout?.grandTotal +
+                      Math.round(parseInt(biayaKirim * 1.1) / 1000) * 1000
+                  )}
                 </div>
               </div>
-              <p className='text-caption-2 text-gray_r-11 mb-2'>
+              {/* <p className='text-caption-2 text-gray_r-11 mb-2'>
                 *) Belum termasuk biaya pengiriman
-              </p>
+              </p> */}
               <p className='text-caption-2 text-gray_r-11 leading-5'>
                 Dengan melakukan pembelian melalui website Indoteknik, saya
                 menyetujui{' '}
-- 
cgit v1.2.3