summaryrefslogtreecommitdiff
path: root/src/lib/transaction/components/Transaction.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/lib/transaction/components/Transaction.jsx')
-rw-r--r--src/lib/transaction/components/Transaction.jsx171
1 files changed, 118 insertions, 53 deletions
diff --git a/src/lib/transaction/components/Transaction.jsx b/src/lib/transaction/components/Transaction.jsx
index 8e7cede0..cd3613c0 100644
--- a/src/lib/transaction/components/Transaction.jsx
+++ b/src/lib/transaction/components/Transaction.jsx
@@ -2,7 +2,8 @@ import Spinner from '@/core/components/elements/Spinner/Spinner';
import useTransaction from '../hooks/useTransaction';
import TransactionStatusBadge from './TransactionStatusBadge';
import Divider from '@/core/components/elements/Divider/Divider';
-import { useMemo, useRef, useState } from 'react';
+import { useEffect, useMemo, useRef, useState } from 'react';
+import ImageNext from 'next/image';
import {
downloadPurchaseOrder,
downloadQuotation,
@@ -43,7 +44,9 @@ const Transaction = ({ id }) => {
const [reason, setReason] = useState('');
const auth = useAuth();
const { transaction } = useTransaction({ id });
- const statusApprovalWeb = transaction.data?.approvalStep
+
+ const statusApprovalWeb = transaction.data?.approvalStep;
+
const { queryAirwayBill } = useAirwayBill({ orderId: id });
const [airwayBillPopup, setAirwayBillPopup] = useState(null);
@@ -53,6 +56,7 @@ const Transaction = ({ id }) => {
const [idAWB, setIdAWB] = useState(null);
const openUploadPo = () => setUploadPo(true);
const closeUploadPo = () => setUploadPo(false);
+
const submitUploadPo = async () => {
const file = poFile.current.files[0];
const name = poNumber.current.value;
@@ -82,7 +86,7 @@ const Transaction = ({ id }) => {
const closeCancelTransaction = () => setCancelTransaction(false);
const [rejectTransaction, setRejectTransaction] = useState(false);
-
+
const openRejectTransaction = () => setRejectTransaction(true);
const closeRejectTransaction = () => setRejectTransaction(false);
const submitCancelTransaction = async () => {
@@ -110,13 +114,13 @@ const Transaction = ({ id }) => {
await aprpoveApi({ id });
toast.success('Berhasil melanjutkan approval');
transaction.refetch();
- }
+ };
const handleReject = async () => {
- await rejectApi({ id });
- closeRejectTransaction()
- transaction.refetch();
- }
+ await rejectApi({ id });
+ closeRejectTransaction();
+ transaction.refetch();
+ };
const memoizeVariantGroupCard = useMemo(
() => (
@@ -283,7 +287,13 @@ const Transaction = ({ id }) => {
<MobileView>
<div className='p-4'>
- <StepApproval layer={2} status={'cancel'} className='ml-auto' />
+ {auth?.feature?.soApproval && (
+ <StepApproval
+ layer={statusApprovalWeb}
+ status={transaction?.data?.status}
+ className='ml-auto'
+ />
+ )}
</div>
<div className='flex flex-col gap-y-4 p-4'>
<DescriptionRow label='Status Transaksi'>
@@ -416,33 +426,43 @@ const Transaction = ({ id }) => {
<Divider />
<div className='p-4 pt-0'>
- {transaction.data?.status == 'draft' && auth?.feature.soApproval && (
- <div className='flex gap-x-2'>
- <button
- className='btn-yellow w-full'
- onClick={checkout}
- disabled={
- transaction.data?.status === 'cancel' ? true : false || auth?.webRole === statusApprovalWeb ? true : false
- }
- >
- Approve
- </button>
- <button
- className='btn-solid-red px-7 w-full'
- onClick={checkout}
- disabled={
- transaction.data?.status === 'cancel' ? true : false || auth?.webRole === statusApprovalWeb ? true : false
- }
- >
- Reject
+ {transaction.data?.status == 'draft' &&
+ auth?.feature.soApproval && (
+ <div className='flex gap-x-2'>
+ <button
+ className='btn-yellow w-full'
+ onClick={checkout}
+ disabled={
+ transaction.data?.status === 'cancel'
+ ? true
+ : false || auth?.webRole === statusApprovalWeb
+ ? true
+ : false
+ }
+ >
+ Approve
+ </button>
+ <button
+ className='btn-solid-red px-7 w-full'
+ onClick={checkout}
+ disabled={
+ transaction.data?.status === 'cancel'
+ ? true
+ : false || auth?.webRole === statusApprovalWeb
+ ? true
+ : false
+ }
+ >
+ Reject
+ </button>
+ </div>
+ )}
+ {transaction.data?.status == 'draft' &&
+ !auth?.feature?.soApproval && (
+ <button className='btn-yellow w-full mt-4' onClick={checkout}>
+ Lanjutkan Transaksi
</button>
- </div>
- )}
- {transaction.data?.status == 'draft' && !auth?.feature?.soApproval && (
- <button className='btn-yellow w-full mt-4' onClick={checkout}>
- Lanjutkan Transaksi
- </button>
- )}
+ )}
<button
className='btn-light w-full mt-4'
disabled={transaction.data?.status != 'draft'}
@@ -496,13 +516,20 @@ const Transaction = ({ id }) => {
Download
</button>
{transaction.data?.status == 'draft' &&
- auth?.feature?.soApproval && auth?.webRole && (
+ auth?.feature?.soApproval &&
+ auth?.webRole && (
<div className='flex gap-x-2'>
<button
className='btn-yellow'
onClick={handleApproval}
disabled={
- transaction.data?.status === 'cancel' ? true : false || auth?.webRole === statusApprovalWeb ? true : false || statusApprovalWeb < 1 ? true : false
+ transaction.data?.status === 'cancel'
+ ? true
+ : false || auth?.webRole === statusApprovalWeb
+ ? true
+ : false || statusApprovalWeb < 1
+ ? true
+ : false
}
>
Approve
@@ -511,7 +538,13 @@ const Transaction = ({ id }) => {
className='btn-solid-red px-7'
onClick={openRejectTransaction}
disabled={
- transaction.data?.status === 'cancel' ? true : false || auth?.webRole === statusApprovalWeb ? true : false || statusApprovalWeb < 1 ? true : false
+ transaction.data?.status === 'cancel'
+ ? true
+ : false || auth?.webRole === statusApprovalWeb
+ ? true
+ : false || statusApprovalWeb < 1
+ ? true
+ : false
}
>
Reject
@@ -524,15 +557,16 @@ const Transaction = ({ id }) => {
Lanjutkan Transaksi
</button>
)}
- {transaction.data?.status != 'draft' && !auth?.feature.soApproval && (
- <button
- className='btn-light'
- disabled={transaction.data?.status != 'waiting'}
- onClick={openCancelTransaction}
- >
- Batalkan Transaksi
- </button>
- )}
+ {transaction.data?.status != 'draft' &&
+ !auth?.feature.soApproval && (
+ <button
+ className='btn-light'
+ disabled={transaction.data?.status != 'waiting'}
+ onClick={openCancelTransaction}
+ >
+ Batalkan Transaksi
+ </button>
+ )}
</div>
<div className='grid grid-cols-2 gap-x-6 mt-6'>
@@ -547,7 +581,7 @@ const Transaction = ({ id }) => {
<div>Ketentuan Pembayaran</div>
<div>: {transaction?.data?.paymentTerm}</div>
- {!auth?.feature?.soApproval && (
+ {!auth?.feature?.soApproval ? (
<>
<div>Purchase Order</div>
<div>
@@ -567,6 +601,11 @@ const Transaction = ({ id }) => {
</button>
</div>
</>
+ ) : (
+ <>
+ <div>Site</div>
+ <div>: {transaction?.data?.sitePartner}</div>
+ </>
)}
</div>
</div>
@@ -670,11 +709,37 @@ const Transaction = ({ id }) => {
)}
className='w-[20%] flex-shrink-0'
>
- <Image
- src={product?.parent?.image}
- alt={product?.name}
- className='object-contain object-center border border-gray_r-6 h-32 w-full rounded-md'
- />
+ <div className='relative'>
+ <Image
+ src={product?.parent?.image}
+ alt={product?.name}
+ className='object-contain object-center border border-gray_r-6 h-32 w-full rounded-md'
+ />
+ <div className='absolute top-0 right-4 flex mt-3'>
+ <div className='gambarB '>
+ {product.isSni && (
+ <ImageNext
+ src='/images/sni-logo.png'
+ alt='SNI Logo'
+ className='w-2 h-4 object-contain object-top sm:h-4'
+ width={50}
+ height={50}
+ />
+ )}
+ </div>
+ <div className='gambarC '>
+ {product.isTkdn && (
+ <ImageNext
+ src='/images/TKDN.png'
+ alt='TKDN'
+ className='w-5 h-4 object-contain object-top ml-1 sm:h-4'
+ width={50}
+ height={50}
+ />
+ )}
+ </div>
+ </div>
+ </div>
</Link>
<div className='px-2 text-left'>
<Link