TIMOR-TELECOM/revenue-fe
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
wayanrivan
2025-05-06 15:42:51 +07:00
parent 896c472ce8
commit 4d0d6fd039
4 changed files with 125 additions and 97 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
src/pages/transaction/approval-transaction/blocks/DetailApprovalTransaction.tsx
View File

@ -202,14 +202,20 @@ const DetailApprovalTransaction = () => {
<div> <div>
<p className="text-sm text-gray-500">Amount</p> <p className="text-sm text-gray-500">Amount</p>
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase?.amount) ?? new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.transfer.amount)}</p> <p className="font-medium">
{(transactionDetails?.purchase?.amount ?? transactionDetails?.transfer?.amount) != null
? new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(
transactionDetails.purchase?.amount ?? transactionDetails.transfer?.amount
)
: "-"}
</p>
</div> </div>
<div> <div>
<p className="text-sm text-gray-500">Fee</p> <p className="text-sm text-gray-500">Fee</p>
<p className="font-medium"> <p className="font-medium">
{transactionDetails?.kind === 'P' {(transactionDetails?.transfer?.fee_amount ?? transactionDetails?.purchase?.fee_amount ?? 0)
? transactionDetails?.purchase.fee_amount.toLocaleString('en-US', { style: 'currency', currency: 'USD' }) .toLocaleString('en-US', { style: 'currency', currency: 'USD' })}
: transactionDetails?.transfer.fee_amount.toLocaleString('en-US', { style: 'currency', currency: 'USD' })}
</p> </p>
</div> </div>
<div> <div>
@ -290,19 +296,33 @@ const DetailApprovalTransaction = () => {
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-4">
<div> <div>
<p className="text-sm text-gray-500">Amount</p> <p className="text-sm text-gray-500">Amount</p>
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.amount)}</p> <p className="font-medium">
{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(
transactionDetails?.purchase?.amount ?? transactionDetails?.transfer?.amount ?? 0
)}
</p>
</div> </div>
<div> <div>
<p className="text-sm text-gray-500">Cashback</p> <p className="text-sm text-gray-500">Cashback</p>
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.cashback)}</p> <p className="font-medium">
{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(
transactionDetails?.purchase?.cashback ?? transactionDetails?.transfer?.cashback ?? 0
)}
</p>
</div> </div>
<div> <div>
<p className="text-sm text-gray-500">Cashback Point</p> <p className="text-sm text-gray-500">Cashback Point</p>
<p className="font-medium">{transactionDetails?.purchase.cashback_point}</p> <p className="font-medium">
{transactionDetails?.purchase?.cashback_point ?? transactionDetails?.transfer?.cashback_point ?? 0}
</p>
</div> </div>
<div> <div>
<p className="text-sm text-gray-500">Fee Amount</p> <p className="text-sm text-gray-500">Fee Amount</p>
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.fee_amount)}</p> <p className="font-medium">
{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(
transactionDetails?.purchase?.fee_amount ?? transactionDetails?.transfer?.fee_amount ?? 0
)}
</p>
</div> </div>
</div> </div>
</div> </div>

25
src/pages/transaction/approval-transaction/hooks/ApprovalTransactionContext.tsx
View File

@ -270,28 +270,19 @@ const ApprovalTransactionProvider = ({ children }: { children: React.ReactNode }
}); });
} }
// Constructing filter object with dynamic properties
const formattedFilter: any = { const formattedFilter: any = {
"Transactions.transaction_date": { "Transactions.transaction_date": {
from: `${startdate} 00:00:00`, from: `${startdate} 00:00:00`,
to: `${enddate} 23:59:59`, to: `${enddate} 23:59:59`
}, }
}; };
if (transactioncode) { if (transactioncode) {
formattedFilter["Transactions.code"] = { like: `%${transactioncode}%` }; formattedFilter["$or"] = [
} { "Transactions.code": { like: `%${transactioncode}%` } },
{ "Transactions.msisdn": { like: `${transactioncode}` } },
if (transactioncode) { { "origin_customer.fullname": { like: `${transactioncode}` } }
formattedFilter["Transactions.msisdn"] = { ];
like: `${transactioncode}`
};
}
if (transactioncode) {
formattedFilter["Transactions.fullname"] = {
like: `${transactioncode}`
};
} }
// Handle approval status filter // Handle approval status filter

136
src/pages/transaction/history-transaction/blocks/DetailTransaction.tsx
View File

@ -49,7 +49,7 @@ const DetailTransaction = () => {
id: selectedTransactionId id: selectedTransactionId
}); });
setTransactionDetails(response?.data); setTransactionDetails(response?.data);
// console.log(response?.data.origin_customer.id); // console.log(response?.data);
// console.log(selectedTransactionId); // console.log(selectedTransactionId);
} catch (error) { } catch (error) {
console.error('Error fetching transaction', error); console.error('Error fetching transaction', error);
@ -221,14 +221,20 @@ const DetailTransaction = () => {
</div> </div>
<div> <div>
<p className="text-sm text-gray-500">Amount</p> <p className="text-sm text-gray-500">Amount</p>
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase?.amount) ?? new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.transfer.amount)}</p> <p className="font-medium">
{(transactionDetails?.purchase?.amount ?? transactionDetails?.transfer?.amount) != null
? new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(
transactionDetails.purchase?.amount ?? transactionDetails.transfer?.amount
)
: "-"}
</p>
</div> </div>
<div> <div>
<p className="text-sm text-gray-500">Fee</p> <p className="text-sm text-gray-500">Fee</p>
<p className="font-medium"> <p className="font-medium">
{transactionDetails?.kind === 'P' {(transactionDetails?.transfer?.fee_amount ?? transactionDetails?.purchase?.fee_amount ?? 0)
? transactionDetails?.purchase.fee_amount.toLocaleString('en-US', { style: 'currency', currency: 'USD' }) .toLocaleString('en-US', { style: 'currency', currency: 'USD' })}
: transactionDetails?.transfer.fee_amount.toLocaleString('en-US', { style: 'currency', currency: 'USD' })}
</p> </p>
</div> </div>
<div> <div>
@ -299,69 +305,91 @@ const DetailTransaction = () => {
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-4">
<div> <div>
<p className="text-sm text-gray-500">Amount</p> <p className="text-sm text-gray-500">Amount</p>
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.amount)}</p> <p className="font-medium">
{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(
transactionDetails?.purchase?.amount ?? transactionDetails?.transfer?.amount ?? 0
)}
</p>
</div> </div>
<div> <div>
<p className="text-sm text-gray-500">Cashback</p> <p className="text-sm text-gray-500">Cashback</p>
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.cashback)}</p> <p className="font-medium">
{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(
transactionDetails?.purchase?.cashback ?? transactionDetails?.transfer?.cashback ?? 0
)}
</p>
</div> </div>
<div> <div>
<p className="text-sm text-gray-500">Cashback Point</p> <p className="text-sm text-gray-500">Cashback Point</p>
<p className="font-medium">{transactionDetails?.purchase.cashback_point}</p> <p className="font-medium">
{transactionDetails?.purchase?.cashback_point ?? transactionDetails?.transfer?.cashback_point ?? 0}
</p>
</div> </div>
<div> <div>
<p className="text-sm text-gray-500">Fee Amount</p> <p className="text-sm text-gray-500">Fee Amount</p>
<p className="font-medium">{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.fee_amount)}</p>
</div>
</div>
</div>
)}
{activeTab === 'detail' && transactionDetails?.kind === 'P' && (
<div className="space-y-4">
<h3 className="font-semibold flex items-center">
Product Information
<span className="ml-2 bg-blue-100 text-blue-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded">
Product Info
</span>
</h3>
<div className="grid grid-cols-2 gap-4">
<div>
<p className="text-sm text-gray-500">Product Name</p>
<p className="font-medium">{transactionDetails?.purchase.product.name}</p>
</div>
<div>
<p className="text-sm text-gray-500">Price Cash</p>
{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(transactionDetails?.purchase.product.price_cash)}
</div>
<div>
<p className="text-sm text-gray-500">Price Point</p>
<p className="font-medium">{transactionDetails?.purchase.product.price_point}</p>
</div>
<div>
<p className="text-sm text-gray-500">Product Type</p>
<p className="font-medium">{transactionDetails?.purchase.product.type}</p>
</div>
<div>
<p className="text-sm text-gray-500">Provider Name</p>
<p className="font-medium">{transactionDetails?.purchase.product.provider.description}</p>
</div>
<div>
<p className="text-sm text-gray-500">Provider Type</p>
<p className="font-medium"> <p className="font-medium">
{(() => { {new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(
let providertype; transactionDetails?.purchase?.fee_amount ?? transactionDetails?.transfer?.fee_amount ?? 0
if (transactionDetails?.purchase.product.provider.type === 'h2h') { )}
providertype = 'HOST TO HOST';
} else if (transactionDetails?.purchase.product.provider.type === 'agent') {
providertype = 'AGENT';
}
return providertype;
})()}
</p> </p>
</div> </div>
</div> </div>
</div> </div>
)} )}
{/* {activeTab === 'detail' && transactionDetails?.kind === 'P' && ( */}
<div className="space-y-4">
<h3 className="font-semibold flex items-center">
Product Information
<span className="ml-2 bg-blue-100 text-blue-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded">
Product Info
</span>
</h3>
<div className="grid grid-cols-2 gap-4">
<div>
<p className="text-sm text-gray-500">Product Name</p>
<p className="font-medium">
{transactionDetails?.purchase?.product?.name ?? "-"}
</p>
</div>
<div>
<p className="text-sm text-gray-500">Price Cash</p>
<p className="font-medium">
{transactionDetails?.purchase?.product?.price_cash != null
? new Intl.NumberFormat("en-US", { style: "currency", currency: "USD" }).format(transactionDetails.purchase.product.price_cash)
: "-"}
</p>
</div>
<div>
<p className="text-sm text-gray-500">Price Point</p>
<p className="font-medium">
{transactionDetails?.purchase?.product?.price_point ?? "-"}
</p>
</div>
<div>
<p className="text-sm text-gray-500">Product Type</p>
<p className="font-medium">
{transactionDetails?.purchase?.product?.type ?? "-"}
</p>
</div>
<div>
<p className="text-sm text-gray-500">Provider Name</p>
<p className="font-medium">
{transactionDetails?.purchase?.product?.provider?.description ?? "-"}
</p>
</div>
<div>
<p className="text-sm text-gray-500">Provider Type</p>
<p className="font-medium">
{transactionDetails?.purchase?.product?.provider?.type === "h2h"
? "HOST TO HOST"
: transactionDetails?.purchase?.product?.provider?.type === "agent"
? "AGENT"
: "-"}
</p>
</div>
</div>
</div>
{/* )} */}
{activeTab === 'detail' && transactionDetails?.kind != 'P' && transactionDetails?.transfer != null && ( {activeTab === 'detail' && transactionDetails?.kind != 'P' && transactionDetails?.transfer != null && (
<div className="space-y-4"> <div className="space-y-4">
@ -397,7 +425,7 @@ const DetailTransaction = () => {
<div> <div>
<p className="text-sm text-gray-500">Fee</p> <p className="text-sm text-gray-500">Fee</p>
<p className="font-medium"> <p className="font-medium">
{transactionDetails?.transfer.fee_amount.toLocaleString('en-US', { style: 'currency', currency: 'USD' })} {(transactionDetails?.transfer?.fee_amount ?? transactionDetails?.purchase?.fee_amount ?? 0).toLocaleString('en-US', { style: 'currency', currency: 'USD' })}
</p> </p>
</div> </div>
<div> <div>

25
src/pages/transaction/history-transaction/hooks/TransactionContext.tsx
View File

@ -265,30 +265,19 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => {
}); });
} }
// Build filter object dynamically
const formattedFilter: any = { const formattedFilter: any = {
"Transactions.transaction_date": { "Transactions.transaction_date": {
from: `${startdate} 00:00:00`, from: `${startdate} 00:00:00`,
to: `${enddate} 23:59:59` to: `${enddate} 23:59:59`
} }
}; };
if (transactioncode) { if (transactioncode) {
formattedFilter["Transactions.code"] = { formattedFilter["$or"] = [
like: `%${transactioncode}%` { "Transactions.code": { like: `%${transactioncode}%` } },
}; { "Transactions.msisdn": { like: `${transactioncode}` } },
} { "origin_customer.fullname": { like: `${transactioncode}` } }
];
if (transactioncode) {
formattedFilter["Transactions.msisdn"] = {
like: `${transactioncode}`
};
}
if (transactioncode) {
formattedFilter["Transactions.fullname"] = {
like: `${transactioncode}`
};
} }
// if (transactionstatus) { // if (transactionstatus) {
@ -298,7 +287,7 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => {
if (type) { if (type) {
formattedFilter["Transactions.kind"] = type; formattedFilter["Transactions.kind"] = type;
} }
const response = await GetData(`${API_URL}/transaction/history`, { const response = await GetData(`${API_URL}/transaction/history`, {
limit, limit,
page: page + 1, page: page + 1,