1 files changed, 48 insertions, 18 deletions
diff --git a/src/lib/checkout/components/FinishCheckout.jsx b/src/lib/checkout/components/FinishCheckout.jsx
index 92245e31..fa600389 100644
--- a/src/lib/checkout/components/FinishCheckout.jsx
+++ b/src/lib/checkout/components/FinishCheckout.jsx
@@ -1,27 +1,57 @@
-import Link from '@/core/components/elements/Link/Link'
+import Link from 'next/link';
+import Image from '~/components/ui/image';
+import whatsappUrl from '@/core/utils/whatsappUrl';
+import { useEffect, useState } from 'react';
+import odooApi from '@/core/api/odooApi';
 
 const FinishCheckout = ({ query }) => {
+  const [data, setData] = useState();
+
+  useEffect(() => {
+    const fetchData = async () => {
+      const so_order = query?.order_id?.replaceAll('_', '/');
+      const data = await odooApi(
+        'GET',
+        `/api/v1/sale_order_number?sale_number=${so_order}`
+      );
+      setData(data[0]);
+    };
+    fetchData();
+  }, [query]);
   return (
-    <div className='mx-auto container p-4 md:p-0 mt-0 md:mt-10'>
-      <div className='rounded-xl bg-warning-100 text-center border border-warning-300 w-full md:w-1/2 mx-auto'>
-        <div className='px-4 py-6 text-warning-900'>
-          <p className='font-semibold mb-2'>Terima Kasih atas Pembelian Anda</p>
-          <p className='text-warning-800 mb-4 leading-6'>
-            Rincian belanja sudah kami kirimkan ke email anda. Mohon dicek kembali. jika tidak
-            menerima email, anda dapat menghubungi kami disini.
-          </p>
-          <p className='mb-2 font-medium'>{query?.order_id?.replaceAll('-', '/')}</p>
-          <p className='text-caption-2 text-warning-800'>No. Transaksi</p>
-        </div>
+    <div className='flex flex-col items-center'>
+      <Image
+        src='/images/CHECKOUT-PESANAN.svg'
+        alt='Checkout Pesanan'
+        width={450}
+        height={450}
+      />
+      <div className='text-title-sm md:text-title-lg text-center font-semibold'>
+        Terima Kasih atas Pembelian Kamu
+      </div>
+      <div className='flex flex-col justify-center items-center text-body-2 md:text-body-1 text-center mt-3 px-24 md:px-36 py-4 border-2 gap-y-2 rounded'>
+        <p className='font-bold'>No. Transaksi</p>
+        <p className='mb-2 font-medium text-red-500 text-xl'>
+          {query?.order_id?.replaceAll('_', '/')}
+        </p>
         <Link
-          href='/my/quotations'
-          className='bg-warning-400 text-warning-900 rounded-b-xl py-4 block'
+          href={`/my/quotations/${data?.id}`}
+          className='btn-solid-red rounded-md text-base'
         >
-          Lihat detail pembelian Anda disini
+          Cek Detail Transaksi
         </Link>
       </div>
+      <div className='mt-2 text-center leading-6 text-base'>
+        Rincian pembelian sudah kami kirimkan ke email kamu. Mohon dicek
+        kembali. jika tidak menerima email,
+        <br /> kamu dapat menghubungi kami{' '}
+        <a className='text-red-500' href={whatsappUrl()}>
+          di sini
+        </a>{' '}
+        atau kirim rincian pesanan ulang.
+      </div>
     </div>
-  )
-}
+  );
+};
 
-export default FinishCheckout
+export default FinishCheckout;