<hafid> merging new release

1 files changed, 146 insertions, 170 deletions

diff --git a/src/lib/transaction/components/Transaction.jsx b/src/lib/transaction/components/Transaction.jsx
index 9216f7f7..2c1a6208 100644
--- a/src/lib/transaction/components/Transaction.jsx
+++ b/src/lib/transaction/components/Transaction.jsx
@@ -46,6 +46,8 @@ import {
   downloadTaxInvoice,
 } from '@/lib/invoice/utils/invoices';
 import axios from 'axios';
+import InformationSection from '../../treckingAwb/component/InformationSection';
+import { Button } from '@chakra-ui/react';
 const Transaction = ({ id }) => {
   const PPN = process.env.NEXT_PUBLIC_PPN;
   const router = useRouter();
@@ -225,70 +227,32 @@ const Transaction = ({ id }) => {
     transaction.refetch();
   };
 
-  const countWeight = (products) => {
-    if (!products || !Array.isArray(products)) return 0.0;
-
-    const weight = products.reduce(
-      (total, product) => total + (product.weight * product.quantity || 0),
-      0
-    );
-    return weight + ' Kg';
-  };
-
-  // const memoizeVariantGroupCard = useMemo(
-  //   () => (
-  //     <div className='p-4 pt-0 flex flex-col gap-y-3'>
-  //       <VariantGroupCard variants={transaction.data?.products} buyMore />
-  //       <div className='font-medium'>Info Pengiriman</div>
-  //       <div className='flex justify-between mt-1'>
-  //         <p className='text-gray_r-12/70'>Metode Pembayaran</p>
-  //         <p>
-  //           {transaction.data?.paymentType
-  //             ? transaction.data?.paymentType
-  //                 ?.replace(/_/g, ' ')
-  //                 .replace(/\b\w/g, (char) => char.toUpperCase())
-  //             : '-'}
-  //         </p>
-  //       </div>
-  //       <div className='flex justify-between mt-1'>
-  //         <p className='text-gray_r-12/70'>Berat Barang</p>
-  //         <p>{transaction.data?.pickings[0]?.weightTotal}</p>
-  //       </div>
-  //       <hr className='mt-1 border border-gray-100' />
-  //       <div className='flex justify-between mt-1'>
-  //         <p className='text-gray_r-12/70'>Total Belanja</p>
-  //         <p>{currencyFormat(totalAmount)}</p>
-  //       </div>
-  //       <div className='flex justify-between mt-1'>
-  //         <p className='text-gray_r-12/70'>Diskon Belanja</p>
-  //         <p>{'- ' + currencyFormat(totalDiscountAmount)}</p>
-  //       </div>
-  //       <div className='flex justify-between mt-1'>
-  //         <p className='text-gray_r-12/70'>Subtotal</p>
-  //         <p>{currencyFormat(transaction.data?.amountUntaxed)}</p>
-  //       </div>
-  //       <div className='flex justify-between mt-1'>
-  //         <p className='text-gray_r-12/70'>
-  //           PPN {((PPN - 1) * 100).toFixed(0)}%
-  //         </p>
-  //         <p>{currencyFormat(transaction.data?.amountTax)}</p>
-  //       </div>
-  //       <div className='flex justify-between mt-1'>
-  //         <p className='text-gray_r-12/70'>Biaya Pengiriman</p>
-  //         <p>{currencyFormat(transaction.data?.deliveryAmount)}</p>
-  //       </div>
-  //       <div className='flex justify-between mt-1 font-medium'>
-  //         <p className='text-gray_r-12/70'>Asuransi Pengiriman</p>
-  //         <p>{currencyFormat(transaction.data?.amountTotal)}</p>
-  //       </div>
-  //       <div className='flex justify-between mt-1 font-medium'>
-  //         <p>Grand Total</p>
-  //         <p>{currencyFormat(transaction.data?.amountTotal)}</p>
-  //       </div>
-  //     </div>
-  //   ),
-  //   [transaction.data]
-  // );
+  const memoizeVariantGroupCard = useMemo(
+    () => (
+      <div className='p-4 pt-0 flex flex-col gap-y-3'>
+        <VariantGroupCard variants={transaction.data?.products} buyMore />
+        <div className='flex justify-between mt-1'>
+          <p className='text-gray_r-12/70'>Subtotal</p>
+          <p>{currencyFormat(transaction.data?.amountUntaxed)}</p>
+        </div>
+        <div className='flex justify-between mt-1'>
+          <p className='text-gray_r-12/70'>
+            PPN {((PPN - 1) * 100).toFixed(0)}%
+          </p>
+          <p>{currencyFormat(transaction.data?.amountTax)}</p>
+        </div>
+        <div className='flex justify-between mt-1'>
+          <p className='text-gray_r-12/70'>Biaya Pengiriman</p>
+          <p>{currencyFormat(transaction.data?.deliveryAmount)}</p>
+        </div>
+        <div className='flex justify-between mt-1 font-medium'>
+          <p>Grand Total</p>
+          <p>{currencyFormat(transaction.data?.amountTotal)}</p>
+        </div>
+      </div>
+    ),
+    [transaction.data]
+  );
 
   const memoizeVariantGroupCardReject = useMemo(
     () => (
@@ -595,6 +559,16 @@ const Transaction = ({ id }) => {
           <Divider />
 
           <div className='flex flex-col gap-y-4 p-4'>
+            <DescriptionRow label='Status Transaksi'>
+              <div className='flex justify-end'>
+                <TransactionStatusBadge status={transaction.data?.status} />
+              </div>
+            </DescriptionRow>
+            <DescriptionRow label='Status Transaksi'>
+              <div className='flex justify-end font-semibold text-red-500'>
+                {transaction.data?.expectedReadyToShip}
+              </div>
+            </DescriptionRow>
             <DescriptionRow label='No Transaksi'>
               <p className='font-semibold'>{transaction.data?.name}</p>
             </DescriptionRow>
@@ -709,31 +683,7 @@ const Transaction = ({ id }) => {
                 </div>
               </DescriptionRow>
             </div>
-            {/* <div className='flex flex-col gap-y-3 mt-4'>
-              {transaction?.data?.pickings?.map((airway) => (
-                <button
-                  className='shadow rounded-md p-3 text-gray_r-12 font-normal flex justify-between items-center text-left'
-                  key={airway?.id}
-                  onClick={() => setIdAWB(airway?.id)}
-                >
-                  <div>
-                    <span className='text-sm text-gray_r-11'>
-                      No Resi : {airway?.trackingNumber || '-'}{' '}
-                    </span>
-                    <p className='mt-1 font-medium'>{airway?.name}</p>
-                  </div>
-                  <div className='flex gap-x-2'>
-                    <div className='text-sm text-gray-600 badge-green leading-[1.5] mt-1'>
-                      {airway?.delivered ? 'Pesanan Tiba' : 'Sedang Dikirim'}
-                    </div>
-                    <ChevronRightIcon className='w-5 stroke-2' />
-                  </div>
-                </button>
-              ))}
-            </div>
-            {transaction?.data?.pickings == 0 && (
-              <div className='badge-red text-sm px-2'>Belum ada pengiriman</div>
-            )} */}
+            
           </div>
 
           {/* <Divider />
@@ -948,48 +898,25 @@ const Transaction = ({ id }) => {
                 )}
               </div>
 
-              <div className=''>
-                <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-5 h-5 mr-2'
-                    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 Transaksi</span>
-                  <div className='text-justify flex flex-col gap-1'>
-                    <p className='font-bold text-black'>Info Transaksi</p>
-                    <span className='text-black'>
-                      Lorem ipsum dolor sit amet, consectetur adipiscing elit,
-                      sed do eiusmod tempor incididunt ut labore et dolore magna
-                      aliqua.
-                    </span>
-                  </div>
-                </div>
-              </div>
-              <div className='flex flex-row items-center justify-between'>
-                <div className='flex items-center gap-x-2 mb-3'>
-                  <span className='text-h-sm font-medium'>
-                    {transaction?.data?.name}
-                  </span>
-                  <TransactionStatusBadge status={transaction?.data?.status} />
-                </div>
-                <div>
-                  <div className='relative inline-block text-left'>
-                    <button
-                      onClick={() => downloadQuotation(transaction.data)}
-                      type='button'
-                      className='btn-light bg-slate-50 mt-3 w-full gap-2 items-center flex flex-row !text-gray_r-11 px-4 py-3 mb-2'
-                    >
-                      <p>Export to PDF</p>
-                    </button>
-                  </div>
-                </div>
+              {/*new-release*/}
+              {/*<div className='flex items-center justify-between mb-3'>*/}
+              {/*  <div className='flex items-center gap-x-2'>*/}
+              {/*    <span className='text-h-sm font-medium'>*/}
+              {/*      {transaction?.data?.name}*/}
+              {/*    </span>*/}
+              {/*    <TransactionStatusBadge status={transaction?.data?.status} />*/}
+              {/*  </div>*/}
+              {/*  <div className='text-h-sm'>*/}
+              {/*    Estimasi Barang Siap:{' '}*/}
+              {/*    <span className='text-red-500 font-semibold'>*/}
+              {/*      {transaction?.data?.expectedReadyToShip}*/}
+              {/*    </span>*/}
+              {/*  </div>*/}
+              <div className='flex items-center gap-x-2 mb-3'>
+                <span className='text-h-sm font-medium'>
+                  {transaction?.data?.name}
+                </span>
+                <TransactionStatusBadge status={transaction?.data?.status} />
               </div>
               {/* <div className='flex gap-x-4'>
                 <button
@@ -1284,54 +1211,103 @@ const Transaction = ({ id }) => {
                 </div>
               </div>
 
-              <hr className='mt-4 mb-4 border border-gray-100' />
-
-              {/* <div className='text-h-sm font-semibold mt-10 mb-4'>
-                Informasi Pelanggan
-              </div>
-              <div className='grid grid-cols-2 gap-x-4'>
-                <div className='border border-gray_r-6 rounded p-3'>
-                  <div className='font-medium mb-4'>Detail Pelanggan</div>
-                  <SectionContent
-                    address={transaction?.data?.address?.customer}
-                  />
+              <div className='flex gap-x-3'>
+                <div className='w-1/2'>
+                  <div className='text-h-sm font-semibold mt-10 mb-4'>
+                    Informasi Pelanggan
+                  </div>
+                  <div className='border border-gray_r-6 rounded p-3'>
+                    <div className='font-medium mb-4'>Detail Pelanggan</div>
+                    <SectionContent
+                      address={transaction?.data?.address?.customer}
+                    />
+                  </div>
                 </div>
-              </div>
-              <div className='flex '>
                 <div className='w-1/2'>
                   <div className='text-h-sm font-semibold mt-10 mb-4'>
-                    Pengiriman
+                    Informasi Pengiriman
                   </div>
                   {transaction?.data?.pickings.length == 0 && (
                     <div className='badge-red text-sm'>
                       Belum ada pengiriman
                     </div>
                   )}
-                  <div className='grid grid-cols-1 gap-1 w-2/3'>
-                    {transaction?.data?.pickings?.map((airway) => (
-                      <button
-                        className='shadow rounded-md p-3 text-gray_r-12 font-normal flex justify-between items-center text-left h-20'
-                        key={airway?.id}
-                        onClick={() => setIdAWB(airway?.id)}
-                      >
-                        <div>
-                          <span className='text-sm text-gray_r-11'>
-                            No Resi : {airway?.trackingNumber || '-'}{' '}
-                          </span>
-                          <p className='mt-1 font-medium'>{airway?.name}</p>
-                        </div>
-                        <div className='flex gap-x-2'>
-                          <div className='text-sm text-gray-600 badge-green leading-[1.5] mt-1'>
-                            {airway?.delivered
-                              ? 'Pesanan Tiba'
-                              : 'Sedang Dikirim'}
-                          </div>
-                          <ChevronRightIcon className='w-5 stroke-2' />
-                        </div>
-                      </button>
-                    ))}
-                  </div>
+                  {/* <div className='grid grid-cols-1 gap-1 w-1/2'> */}
+                  {transaction?.data?.pickings?.map((airway) => (
+                    <div
+                      key={airway?.id}
+                      className='border border-gray_r-6 rounded p-3'
+                    >
+                      <InformationSection manifests={airway} />
+                      <div className='p-4'>
+                        <button
+                          className='bg-transparent text-red-600 hover:underline p-0 font-semibold'
+                          onClick={() => {
+                            if (airway?.waybillNumber == '-') {
+                              toast.error('Nomor Resi belum tersedia');
+                              return;
+                            }
+                            setIdAWB(airway.id);
+                          }}
+                        >
+                          Lacak Pengiriman
+                        </button>
+                      </div>
+                    </div>
+                    // <button
+                    //   className='shadow rounded-md p-3 text-gray_r-12 font-normal flex justify-between items-center text-left h-20'
+                    //   key={airway?.id}
+                    //   onClick={() => setIdAWB(airway?.id)}
+                    // >
+                    //   <div>
+                    //     <span className='text-sm text-gray_r-11'>
+                    //       No Resi : {airway?.trackingNumber || '-'}{' '}
+                    //     </span>
+                    //     <p className='mt-1 font-medium'>{airway?.name}</p>
+                    //   </div>
+                    //   <div className='flex gap-x-2'>
+                    //     <div className='text-sm text-gray-600 badge-green leading-[1.5] mt-1'>
+                    //       {airway?.delivered
+                    //         ? 'Pesanan Tiba'
+                    //         : 'Sedang Dikirim'}
+                    //     </div>
+                    //     <ChevronRightIcon className='w-5 stroke-2' />
+                    //   </div>
+                    // </button>
+                  ))}
+                  {/* </div> */}
                 </div>
+              </div>
+
+              <div className='flex '>
+                {/*New release*/}
+                {/*  <div className='grid grid-cols-1 gap-1 w-2/3'>*/}
+                {/*    {transaction?.data?.pickings?.map((airway) => (*/}
+                {/*      <button*/}
+                {/*        className='shadow rounded-md p-3 text-gray_r-12 font-normal flex justify-between items-center text-left h-20'*/}
+                {/*        key={airway?.id}*/}
+                {/*        onClick={() => setIdAWB(airway?.id)}*/}
+                {/*      >*/}
+                {/*        <div>*/}
+                {/*          <p className='text-sm text-gray_r-11'>*/}
+                {/*            {airway?.name}*/}
+                {/*          </p>*/}
+                {/*          <span className='text-md text-bold mt-1'>*/}
+                {/*            No Resi : {airway?.trackingNumber || '-'}{' '}*/}
+                {/*          </span>*/}
+                {/*        </div>*/}
+                {/*        <div className='flex gap-x-2'>*/}
+                {/*          <div className='text-sm text-gray-600 badge-green leading-[1.5] mt-1 text-center'>*/}
+                {/*            {airway?.delivered*/}
+                {/*              ? 'Pesanan Tiba'*/}
+                {/*              : 'Sedang Dikirim'}*/}
+                {/*          </div>*/}
+                {/*          <ChevronRightIcon className='w-5 stroke-2' />*/}
+                {/*        </div>*/}
+                {/*      </button>*/}
+                {/*    ))}*/}
+                {/*  </div>*/}
+                {/*</div>*/}
                 <div className='invoice w-1/2 '>
                   <div className='text-h-sm font-semibold mt-10 mb-4 '>
                     Invoice
@@ -1362,7 +1338,7 @@ const Transaction = ({ id }) => {
                     ))}
                   </div>
                 </div>
-              </div> */}
+              </div>
 
               <div className='text-h-sm font-semibold mt-4 mb-4'>
                 Rincian Pembelian