update
This commit is contained in:
@ -202,14 +202,20 @@ const DetailApprovalTransaction = () => {
|
||||
|
||||
<div>
|
||||
<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>
|
||||
<p className="text-sm text-gray-500">Fee</p>
|
||||
<p className="font-medium">
|
||||
{transactionDetails?.kind === 'P'
|
||||
? transactionDetails?.purchase.fee_amount.toLocaleString('en-US', { style: 'currency', currency: 'USD' })
|
||||
: 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>
|
||||
</div>
|
||||
<div>
|
||||
@ -290,19 +296,33 @@ const DetailApprovalTransaction = () => {
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
|
||||
@ -270,28 +270,19 @@ const ApprovalTransactionProvider = ({ children }: { children: React.ReactNode }
|
||||
});
|
||||
}
|
||||
|
||||
// Constructing filter object with dynamic properties
|
||||
const formattedFilter: any = {
|
||||
"Transactions.transaction_date": {
|
||||
from: `${startdate} 00:00:00`,
|
||||
to: `${enddate} 23:59:59`,
|
||||
},
|
||||
to: `${enddate} 23:59:59`
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
if (transactioncode) {
|
||||
formattedFilter["Transactions.code"] = { like: `%${transactioncode}%` };
|
||||
}
|
||||
|
||||
if (transactioncode) {
|
||||
formattedFilter["Transactions.msisdn"] = {
|
||||
like: `${transactioncode}`
|
||||
};
|
||||
}
|
||||
|
||||
if (transactioncode) {
|
||||
formattedFilter["Transactions.fullname"] = {
|
||||
like: `${transactioncode}`
|
||||
};
|
||||
formattedFilter["$or"] = [
|
||||
{ "Transactions.code": { like: `%${transactioncode}%` } },
|
||||
{ "Transactions.msisdn": { like: `${transactioncode}` } },
|
||||
{ "origin_customer.fullname": { like: `${transactioncode}` } }
|
||||
];
|
||||
}
|
||||
|
||||
// Handle approval status filter
|
||||
|
||||
@ -49,7 +49,7 @@ const DetailTransaction = () => {
|
||||
id: selectedTransactionId
|
||||
});
|
||||
setTransactionDetails(response?.data);
|
||||
// console.log(response?.data.origin_customer.id);
|
||||
// console.log(response?.data);
|
||||
// console.log(selectedTransactionId);
|
||||
} catch (error) {
|
||||
console.error('Error fetching transaction', error);
|
||||
@ -221,14 +221,20 @@ const DetailTransaction = () => {
|
||||
</div>
|
||||
<div>
|
||||
<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>
|
||||
<p className="text-sm text-gray-500">Fee</p>
|
||||
<p className="font-medium">
|
||||
{transactionDetails?.kind === 'P'
|
||||
? transactionDetails?.purchase.fee_amount.toLocaleString('en-US', { style: 'currency', currency: 'USD' })
|
||||
: 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>
|
||||
</div>
|
||||
<div>
|
||||
@ -299,69 +305,91 @@ const DetailTransaction = () => {
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<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>
|
||||
<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>
|
||||
<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>
|
||||
<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">
|
||||
{(() => {
|
||||
let providertype;
|
||||
if (transactionDetails?.purchase.product.provider.type === 'h2h') {
|
||||
providertype = 'HOST TO HOST';
|
||||
} else if (transactionDetails?.purchase.product.provider.type === 'agent') {
|
||||
providertype = 'AGENT';
|
||||
}
|
||||
return providertype;
|
||||
})()}
|
||||
{new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(
|
||||
transactionDetails?.purchase?.fee_amount ?? transactionDetails?.transfer?.fee_amount ?? 0
|
||||
)}
|
||||
</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>
|
||||
<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 && (
|
||||
<div className="space-y-4">
|
||||
@ -397,7 +425,7 @@ const DetailTransaction = () => {
|
||||
<div>
|
||||
<p className="text-sm text-gray-500">Fee</p>
|
||||
<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>
|
||||
</div>
|
||||
<div>
|
||||
|
||||
@ -265,30 +265,19 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => {
|
||||
});
|
||||
}
|
||||
|
||||
// Build filter object dynamically
|
||||
const formattedFilter: any = {
|
||||
"Transactions.transaction_date": {
|
||||
from: `${startdate} 00:00:00`,
|
||||
to: `${enddate} 23:59:59`
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
if (transactioncode) {
|
||||
formattedFilter["Transactions.code"] = {
|
||||
like: `%${transactioncode}%`
|
||||
};
|
||||
}
|
||||
|
||||
if (transactioncode) {
|
||||
formattedFilter["Transactions.msisdn"] = {
|
||||
like: `${transactioncode}`
|
||||
};
|
||||
}
|
||||
|
||||
if (transactioncode) {
|
||||
formattedFilter["Transactions.fullname"] = {
|
||||
like: `${transactioncode}`
|
||||
};
|
||||
formattedFilter["$or"] = [
|
||||
{ "Transactions.code": { like: `%${transactioncode}%` } },
|
||||
{ "Transactions.msisdn": { like: `${transactioncode}` } },
|
||||
{ "origin_customer.fullname": { like: `${transactioncode}` } }
|
||||
];
|
||||
}
|
||||
|
||||
// if (transactionstatus) {
|
||||
@ -298,7 +287,7 @@ const TransactionProvider = ({ children }: { children: React.ReactNode }) => {
|
||||
if (type) {
|
||||
formattedFilter["Transactions.kind"] = type;
|
||||
}
|
||||
|
||||
|
||||
const response = await GetData(`${API_URL}/transaction/history`, {
|
||||
limit,
|
||||
page: page + 1,
|
||||
|
||||
Reference in New Issue
Block a user