From c897a78ae04bbdb51cb442c2a85c579487aca614 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Thu, 7 Aug 2025 15:10:02 +0700
Subject: <hafid> fixing mobile(ongoing)

---
 src/lib/transaction/components/Transaction.jsx  | 105 ++++++++++++++++--------
 src/lib/variant/components/VariantGroupCard.jsx |   7 +-
 2 files changed, 78 insertions(+), 34 deletions(-)

(limited to 'src/lib')

diff --git a/src/lib/transaction/components/Transaction.jsx b/src/lib/transaction/components/Transaction.jsx
index 842567f8..c9c0b1cc 100644
--- a/src/lib/transaction/components/Transaction.jsx
+++ b/src/lib/transaction/components/Transaction.jsx
@@ -45,9 +45,11 @@ import {
   downloadInvoice,
   downloadTaxInvoice,
 } from '@/lib/invoice/utils/invoices';
+import { Download } from 'lucide-react';
 import axios from 'axios';
 import InformationSection from '../../treckingAwb/component/InformationSection';
 import { Button } from '@chakra-ui/react';
+import { div } from 'lodash-contrib';
 const Transaction = ({ id }) => {
   const PPN = process.env.NEXT_PUBLIC_PPN;
   const router = useRouter();
@@ -195,6 +197,7 @@ const Transaction = ({ id }) => {
     }
     toast.success('Berhasil melanjutkan pesanan');
     transaction.refetch();
+    // console.log(transaction);
 
     /* const midtrans = async () => {
         for (const product of products) deleteItemCart({ productId: product.id });
@@ -526,7 +529,7 @@ const Transaction = ({ id }) => {
 
           <div className='flex flex-row justify-between items-center gap-2 px-4'>
             <div className='flex flex-col justify-start items-start gap-2'>
-              <div className='font-medium'>Status Transaksi</div>
+              <div className='font-semibold'>{transaction.data?.name}</div>
               <TransactionStatusBadge status={transaction.data?.status} />
             </div>
             <div>
@@ -559,16 +562,6 @@ 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>
@@ -580,9 +573,6 @@ const Transaction = ({ id }) => {
             <DescriptionRow label='Purchase Order'>
               {transaction.data?.purchaseOrderName || '-'}
             </DescriptionRow>
-            <DescriptionRow label='Ketentuan Pembayaran'>
-              {transaction.data?.paymentTerm || '-'}
-            </DescriptionRow>
             <DescriptionRow label='Nama Sales'>
               {transaction.data?.sales}
             </DescriptionRow>
@@ -591,6 +581,7 @@ const Transaction = ({ id }) => {
           <Divider />
 
           <div className='p-4'>
+            {transaction.data?.pickings?.length != 0 &&(
             <div className='flex flex-row justify-between items-center'>
               <div className='font-medium'>Info Pengiriman</div>
               <span
@@ -600,8 +591,14 @@ const Transaction = ({ id }) => {
                 Lihat Detail
               </span>
             </div>
+            )}
             <hr className='mt-4 mb-4 border border-gray-100' />
             <div className='flex flex-col gap-y-4'>
+            <DescriptionRow label='Estimasi Pengiriman'>
+              <div className='flex font-semibold text-red-500'>
+                {transaction.data?.expectedReadyToShip}
+              </div>
+            </DescriptionRow>
               <DescriptionRow label='Dokumen Pengiriman'>
                 <p className='text-red-500 font-semibold text-start'>
                   {transaction.data?.pickings?.length == 0
@@ -686,7 +683,7 @@ const Transaction = ({ id }) => {
             
           </div>
 
-          {/* <Divider />
+          <Divider />
 
           <div className='p-4'>
             <p className='font-medium'>Invoice</p>
@@ -715,17 +712,17 @@ const Transaction = ({ id }) => {
                 <div className='badge-red text-sm px-2'>Belum ada invoice</div>
               )}
             </div>
-          </div> */}
+          </div>
 
           <Divider />
 
-          {/* {!auth?.feature.soApproval && (
+          {!auth?.feature.soApproval && (
             <div className='p-4 flex flex-col gap-y-4'>
               <DescriptionRow label='Purchase Order'>
                 {transaction.data?.purchaseOrderName || '-'}
               </DescriptionRow>
-              <div className='flex items-center'>
-                <p className='text-gray_r-11 leading-none'>Dokumen PO</p>
+              <div className='flex items-center justify-between'>
+                <p className='text-gray_r-11 leading-none'>Dokumen PO : </p>
                 <button
                   type='button'
                   className='inline-block text-danger-500'
@@ -747,26 +744,22 @@ const Transaction = ({ id }) => {
             </div>
           )}
 
-          <Divider /> */}
+          <Divider />
 
           <div className='font-medium p-4'>Detail Produk</div>
           {transaction?.data?.products.length > 0 ? (
             <div className='p-4 pt-0 flex flex-col gap-y-3'>
-              <VariantGroupCard variants={transaction.data?.products} buyMore />
+              <VariantGroupCard variants={transaction.data?.products}/>
               <div className='font-medium'>Rincian Pembayaran</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())
-                    : '-'}
+                   {transaction.data?.paymentTerm || '-'}
                 </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 + ' Kg'}</p>
+                <p>{(transaction.data?.products?.reduce((total, item) => total + (item.weight || 0), 0)) + ' Kg'}</p>
               </div>
               <hr className='mt-1 border border-gray-100' />
               <div className='flex justify-between mt-1'>
@@ -822,7 +815,7 @@ const Transaction = ({ id }) => {
           {transaction.data?.status === 'draft' && (
             <div className='p-4 pt-0'>
               <button
-                className='btn-yellow w-full mt-4'
+                className='btn-light w-full mt-4'
                 disabled={transaction.data?.status != 'draft'}
                 onClick={() => downloadQuotation(transaction.data)}
               >
@@ -834,6 +827,15 @@ const Transaction = ({ id }) => {
               >
                 Batalkan Transaksi
               </button>
+              {transaction.data?.status == 'draft' &&
+              transaction?.data?.purchaseOrderFile && (
+                <button
+                  className='btn-yellow w-full mt-4'
+                  onClick={openContinueTransaction}
+                >
+                  Lanjutkan Transaksi
+                </button>
+              )}
             </div>
           )}
         </MobileView>
@@ -876,15 +878,44 @@ const Transaction = ({ id }) => {
                   {transaction?.data?.name}
                 </span>
                 <TransactionStatusBadge status={transaction?.data?.status} />
+                {transaction.data?.status === 'draft' && (
+                  <div className='flex items-center justify-between w-full'>
+                    <button
+                      type='button'
+                      className='btn-light px-3 py-2'
+                      onClick={() => downloadQuotation(transaction.data)}
+                    >
+                      <Download size={12} />
+                    </button>
+
+                    <div className="flex gap-x-4">
+                      <button
+                        className='btn-solid-red'
+                        onClick={openCancelTransaction}
+                      >
+                        Batalkan Transaksi
+                      </button>
+                      {transaction.data?.status == 'draft' &&
+                      transaction?.data?.purchaseOrderFile && (
+                        <button
+                          className='btn-yellow'
+                          onClick={openContinueTransaction}
+                        >
+                          Lanjutkan Transaksi
+                        </button>
+                      )}
+                    </div>
+                  </div>
+                )}
               </div>
-              {transaction.data?.status === 'draft' && (
+              {/* {transaction.data?.status === 'draft' && (
                 <div className='flex gap-x-4'>
                   <button
                     type='button'
-                    className='btn-yellow px-3 py-2 mr-auto'
+                    className='btn-light px-3 py-2 mr-auto'
                     onClick={() => downloadQuotation(transaction.data)}
                   >
-                    Download
+                    <Download size={12} />
                   </button>
                   <button
                     className='btn-solid-red'
@@ -892,8 +923,18 @@ const Transaction = ({ id }) => {
                   >
                     Batalkan Transaksi
                   </button>
+                    
+                {transaction.data?.status == 'draft' &&
+                transaction?.data?.purchaseOrderFile && (
+                  <button
+                    className='btn-yellow'
+                    onClick={openContinueTransaction}
+                  >
+                    Lanjutkan Transaksi
+                  </button>
+                )}
                 </div>
-              )}
+              )} */}
 
               <div className='grid grid-cols-2 gap-x-6 mt-4'>
                 <div className='grid grid-cols-[35%_65%] gap-y-4'>
diff --git a/src/lib/variant/components/VariantGroupCard.jsx b/src/lib/variant/components/VariantGroupCard.jsx
index 1e921546..7db9703b 100644
--- a/src/lib/variant/components/VariantGroupCard.jsx
+++ b/src/lib/variant/components/VariantGroupCard.jsx
@@ -10,7 +10,10 @@ const VariantGroupCard = ({ variants, ...props }) => {
   return (
     <>
       {variantsToShow?.map((variant, index) => (
-        <>
+        <div
+          key={index}
+          className='shadow border border-gray rounded-md p-4 mb-1 shadow-sm bg-white'
+        >
           <VariantCard key={index} product={variant} {...props} />
           {variant.program &&
             variant.program.items &&
@@ -48,7 +51,7 @@ const VariantGroupCard = ({ variants, ...props }) => {
                 </div>
               </div>
             ))}
-        </>
+        </div>
       ))}
       {variants.length > 2 && (
         <button
-- 
cgit v1.2.3