update add trigger for current balance

This commit is contained in:
wayanrivan
2025-05-02 16:29:02 +07:00
parent eb2a1b35b4
commit 30b26216da
2 changed files with 229 additions and 31 deletions

View File

@ -10,8 +10,10 @@ import {
DialogHeader, DialogHeader,
DialogTitle DialogTitle
} from '@/components/ui/dialog'; } from '@/components/ui/dialog';
import { Button } from '@/components/ui/button';
const API_URL = apiConfig.transaction; const API_URL = apiConfig.transaction;
const API_URL_CURRENT_BALANCE = apiConfig.service_wallet;
const DetailApprovalTransaction = () => { const DetailApprovalTransaction = () => {
const { GetData } = useCallApi(); const { GetData } = useCallApi();
@ -51,6 +53,60 @@ const DetailApprovalTransaction = () => {
} }
}, [showDetailDialog]); }, [showDetailDialog]);
const [currentBalance, setCurrentBalance] = useState<number | null>(null);
const [currentBalanceTransfer, setCurrentBalanceTransfer] = useState<number | null>(null);
useEffect(() => {
setCurrentBalance(null);
}, [transactionDetails]);
useEffect(() => {
setCurrentBalanceTransfer(null);
}, [transactionDetails]);
const getCurrentBallanceWallet = async (customerId: string) => {
try {
const responsecurrentbalance = await GetData(
`${API_URL_CURRENT_BALANCE}/dashboard/balance/account/${customerId}`,
{}
);
const match = responsecurrentbalance?.data?.find(
(item: any) => item.id_wallet === transactionDetails?.origin_wallet?.id
);
if (match) {
// console.log('Matched Wallet:', match); // Optional debug
return match.amount;
}
} catch (error) {
console.error('Error fetching current balance', error);
}
return null;
};
const getCurrentBallanceWalletTransfer = async (customerIdtransfer: string) => {
try {
const response = await GetData(
`${API_URL_CURRENT_BALANCE}/dashboard/balance/account/${customerIdtransfer}`,
{}
);
const match = response?.data?.find(
(item: any) => item.id_wallet === transactionDetails?.transfer?.destination_wallet?.id
);
if (match) {
// console.log('Matched Wallet:', match);
return match.amount;
}
} catch (error) {
console.error('Error fetching current balance', error);
}
return null;
};
return ( return (
<Dialog open={showDetailDialog} onOpenChange={setShowDetailDialog}> <Dialog open={showDetailDialog} onOpenChange={setShowDetailDialog}>
@ -471,7 +527,27 @@ const DetailApprovalTransaction = () => {
<p className="text-sm text-gray-500">Description</p> <p className="text-sm text-gray-500">Description</p>
<p className="font-medium">{transactionDetails?.origin_wallet.description}</p> <p className="font-medium">{transactionDetails?.origin_wallet.description}</p>
</div> </div>
<div>
<p className="text-sm text-gray-500">Current Balance</p>
<p className="font-medium">
{currentBalance !== null && currentBalance !== undefined
? new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(currentBalance)
: '-'}
</p>
</div>
</div> </div>
<Button
className="btn btn-primary"
type="button"
onClick={async () => {
const balance = await getCurrentBallanceWallet(transactionDetails?.origin_customer.id);
if (balance !== null) {
setCurrentBalance(balance);
}
}}
>
Generate Current Balance
</Button>
</div> </div>
)} )}
@ -482,16 +558,42 @@ const DetailApprovalTransaction = () => {
{!transactionDetails?.transfer ? ( {!transactionDetails?.transfer ? (
<div className="text-center text-sm text-gray-500">No Data available</div> <div className="text-center text-sm text-gray-500">No Data available</div>
) : ( ) : (
<div className="grid grid-cols-2 gap-4"> <>
<div> <div className="grid grid-cols-2 gap-4">
<p className="text-sm text-gray-500">Name</p> <div>
<p className="font-medium">{transactionDetails.transfer.destination_wallet.name}</p> <p className="text-sm text-gray-500">Name</p>
<p className="font-medium">{transactionDetails.transfer.destination_wallet.name}</p>
</div>
<div>
<p className="text-sm text-gray-500">Description</p>
<p className="font-medium">{transactionDetails.transfer.destination_wallet.description}</p>
</div>
<div>
<p className="text-sm text-gray-500">Current Balance</p>
<p className="font-medium">
{currentBalanceTransfer !== null
? new Intl.NumberFormat('en-US', {
style: 'currency',
currency: 'USD',
}).format(currentBalanceTransfer)
: '-'}
</p>
</div>
</div> </div>
<div> <Button
<p className="text-sm text-gray-500">Description</p> className="btn btn-primary"
<p className="font-medium">{transactionDetails.transfer.destination_wallet.description}</p> type="button"
</div> onClick={async () => {
</div> const customerId = transactionDetails?.transfer?.destination_customer?.id;
const balance = await getCurrentBallanceWalletTransfer(customerId);
if (balance !== null) {
setCurrentBalanceTransfer(balance); // ✅ INI YANG BENAR
}
}}
>
Generate Current Balance
</Button>
</>
)} )}
</div> </div>
)} )}
@ -540,8 +642,8 @@ const DetailApprovalTransaction = () => {
}) })
: ''}</td> : ''}</td>
<td className="px-4 py-2 text-sm text-gray-500">{log.request_body}</td> <td className="px-4 py-2 text-sm text-gray-500">{log.request_body}</td>
<td className="px-4 py-2 text-sm text-gray-500">{log.response_body}</td> <td className="px-4 py-2 text-sm text-gray-500">{log.response_body}</td>
<td className="px-4 py-2 text-sm text-gray-500">{log.request_endpoint}</td> <td className="px-4 py-2 text-sm text-gray-500">{log.request_endpoint}</td>
</tr> </tr>
)) ))
) : ( ) : (

View File

@ -13,11 +13,15 @@ import {
DialogTitle DialogTitle
} from '@/components/ui/dialog'; } from '@/components/ui/dialog';
import { useDataGrid } from '@/components'; import { useDataGrid } from '@/components';
import { Button } from '@/components/ui/button';
const API_URL = apiConfig.transaction; const API_URL = apiConfig.transaction;
const API_URL_CURRENT_BALANCE = apiConfig.service_wallet;
const DetailTransaction = () => { const DetailTransaction = () => {
const { GetData } = useCallApi(); const { GetData } = useCallApi();
// const { reload } = useDataGrid(); // const { reload } = useDataGrid();
const { const {
showDetailDialog, showDetailDialog,
@ -45,7 +49,7 @@ const DetailTransaction = () => {
id: selectedTransactionId id: selectedTransactionId
}); });
setTransactionDetails(response?.data); setTransactionDetails(response?.data);
// console.log(response?.data); // console.log(response?.data.origin_customer.id);
// console.log(selectedTransactionId); // console.log(selectedTransactionId);
} catch (error) { } catch (error) {
console.error('Error fetching transaction', error); console.error('Error fetching transaction', error);
@ -67,6 +71,61 @@ const DetailTransaction = () => {
} }
}, [showDetailDialog]); }, [showDetailDialog]);
const [currentBalance, setCurrentBalance] = useState<number | null>(null);
const [currentBalanceTransfer, setCurrentBalanceTransfer] = useState<number | null>(null);
useEffect(() => {
setCurrentBalance(null);
}, [transactionDetails]);
useEffect(() => {
setCurrentBalanceTransfer(null);
}, [transactionDetails]);
const getCurrentBallanceWallet = async (customerId: string) => {
try {
const responsecurrentbalance = await GetData(
`${API_URL_CURRENT_BALANCE}/dashboard/balance/account/${customerId}`,
{}
);
const match = responsecurrentbalance?.data?.find(
(item: any) => item.id_wallet === transactionDetails?.origin_wallet?.id
);
if (match) {
// console.log('Matched Wallet:', match); // Optional debug
return match.amount;
}
} catch (error) {
console.error('Error fetching current balance', error);
}
return null;
};
const getCurrentBallanceWalletTransfer = async (customerIdtransfer: string) => {
try {
const response = await GetData(
`${API_URL_CURRENT_BALANCE}/dashboard/balance/account/${customerIdtransfer}`,
{}
);
const match = response?.data?.find(
(item: any) => item.id_wallet === transactionDetails?.transfer?.destination_wallet?.id
);
if (match) {
// console.log('Matched Wallet:', match);
return match.amount;
}
} catch (error) {
console.error('Error fetching current balance', error);
}
return null;
};
return ( return (
<Dialog open={showDetailDialog} onOpenChange={setShowDetailDialog}> <Dialog open={showDetailDialog} onOpenChange={setShowDetailDialog}>
@ -231,16 +290,6 @@ const DetailTransaction = () => {
</div> </div>
</div> </div>
<h3 className="font-semibold flex items-center">
Origin Wallet
<span className="ml-2 bg-blue-100 text-blue-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded">
Wallet
</span>
</h3>
<div className="grid grid-cols-2 gap-4">
</div>
<h3 className="font-semibold flex items-center"> <h3 className="font-semibold flex items-center">
Purchase Purchase
<span className="ml-2 bg-blue-100 text-blue-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded"> <span className="ml-2 bg-blue-100 text-blue-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded">
@ -482,7 +531,27 @@ const DetailTransaction = () => {
<p className="text-sm text-gray-500">Description</p> <p className="text-sm text-gray-500">Description</p>
<p className="font-medium">{transactionDetails?.origin_wallet.description}</p> <p className="font-medium">{transactionDetails?.origin_wallet.description}</p>
</div> </div>
<div>
<p className="text-sm text-gray-500">Current Balance</p>
<p className="font-medium">
{currentBalance !== null && currentBalance !== undefined
? new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(currentBalance)
: '-'}
</p>
</div>
</div> </div>
<Button
className="btn btn-primary"
type="button"
onClick={async () => {
const balance = await getCurrentBallanceWallet(transactionDetails?.origin_customer.id);
if (balance !== null) {
setCurrentBalance(balance);
}
}}
>
Generate Current Balance
</Button>
</div> </div>
)} )}
@ -493,16 +562,43 @@ const DetailTransaction = () => {
{!transactionDetails?.transfer ? ( {!transactionDetails?.transfer ? (
<div className="text-sm text-gray-500">No Data available</div> <div className="text-sm text-gray-500">No Data available</div>
) : ( ) : (
<div className="grid grid-cols-2 gap-4"> <>
<div> <div className="grid grid-cols-2 gap-4">
<p className="text-sm text-gray-500">Name</p> <div>
<p className="font-medium">{transactionDetails.transfer.destination_wallet.name}</p> <p className="text-sm text-gray-500">Name</p>
<p className="font-medium">{transactionDetails.transfer.destination_wallet.name}</p>
</div>
<div>
<p className="text-sm text-gray-500">Description</p>
<p className="font-medium">{transactionDetails.transfer.destination_wallet.description}</p>
</div>
<div>
<p className="text-sm text-gray-500">Current Balance</p>
<p className="font-medium">
{currentBalanceTransfer !== null
? new Intl.NumberFormat('en-US', {
style: 'currency',
currency: 'USD',
}).format(currentBalanceTransfer)
: '-'}
</p>
</div>
</div> </div>
<div> <Button
<p className="text-sm text-gray-500">Description</p> className="btn btn-primary"
<p className="font-medium">{transactionDetails.transfer.destination_wallet.description}</p> type="button"
</div> onClick={async () => {
</div> const customerId = transactionDetails?.transfer?.destination_customer?.id;
const balance = await getCurrentBallanceWalletTransfer(customerId);
if (balance !== null) {
setCurrentBalanceTransfer(balance); // ✅ INI YANG BENAR
}
}}
>
Generate Current Balance
</Button>
</>
)} )}
</div> </div>
)} )}