add column status
This commit is contained in:
wayanrivan
@ -683,7 +683,7 @@ const DetailApprovalTransaction = () => {
|
||||
<table className="min-w-full table-auto">
|
||||
<thead>
|
||||
<tr className="bg-gray-100">
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Type</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Transaction Status</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Request Date</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Response Date</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Response Body</th>
|
||||
@ -695,7 +695,25 @@ const DetailApprovalTransaction = () => {
|
||||
{transactionDetails?.log && transactionDetails?.log.length > 0 ? (
|
||||
transactionDetails.log.map((log: { type: string, request_endpoint: string, status: string; request_date: string; response_date: string; request_body: string; response_body: string; response_code: number }, index: number) => (
|
||||
<tr key={index} className="border-t">
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.type || ''}</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">
|
||||
{(() => {
|
||||
let status;
|
||||
if (log.status === 'C') {
|
||||
status = 'COMPLETE';
|
||||
} else if (log.status === 'F') {
|
||||
status = 'FAILED';
|
||||
} else if (log.status === 'O') {
|
||||
status = 'ON PROCESS';
|
||||
} else if (log.status === 'P') {
|
||||
status = 'PENDING';
|
||||
} else if (log.status === 'R') {
|
||||
status = 'ROLLBACK';
|
||||
} else if (log.status === 'S') {
|
||||
status = 'REVERSAL';
|
||||
}
|
||||
return status;
|
||||
})()}
|
||||
</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.request_date
|
||||
? new Date(log.request_date).toLocaleDateString('en-GB', {
|
||||
day: '2-digit',
|
||||
@ -737,10 +755,10 @@ const DetailApprovalTransaction = () => {
|
||||
<pre style={{ fontFamily: 'monospace', whiteSpace: 'pre-wrap' }}>
|
||||
{(() => {
|
||||
try {
|
||||
if (log.request_body === null) {
|
||||
if (log.response_body === null) {
|
||||
return '';
|
||||
}
|
||||
const parsed = JSON.parse(log.request_body);
|
||||
const parsed = JSON.parse(log.response_body);
|
||||
return JSON.stringify(parsed, null, 2) ?? '';
|
||||
} catch (e) {
|
||||
return log.response_body ?? ''; // fallback: tampilkan as-is jika gagal parse
|
||||
@ -840,7 +858,7 @@ const DetailApprovalTransaction = () => {
|
||||
<table className="min-w-full table-auto">
|
||||
<thead>
|
||||
<tr className="bg-gray-100">
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Type</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Status</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Request Date</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Response Date</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Response Body</th>
|
||||
@ -850,9 +868,27 @@ const DetailApprovalTransaction = () => {
|
||||
</thead>
|
||||
<tbody>
|
||||
{transactionDetails?.p24 && transactionDetails?.p24.length > 0 ? (
|
||||
transactionDetails.p24.map((log: { request_endpoint: string, type: string; request_date: string; response_date: string; request_body: string; response_body: string; response_code: number }, index: number) => (
|
||||
transactionDetails.p24.map((log: { status: string,request_endpoint: string, type: string; request_date: string; response_date: string; request_body: string; response_body: string; response_code: number }, index: number) => (
|
||||
<tr key={index} className="border-t">
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.type ?? ''}</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">
|
||||
{(() => {
|
||||
let status;
|
||||
if (log.status === 'C') {
|
||||
status = 'COMPLETE';
|
||||
} else if (log.status === 'F') {
|
||||
status = 'FAILED';
|
||||
} else if (log.status === 'O') {
|
||||
status = 'ON PROCESS';
|
||||
} else if (log.status === 'P') {
|
||||
status = 'PENDING';
|
||||
} else if (log.status === 'R') {
|
||||
status = 'ROLLBACK';
|
||||
} else if (log.status === 'S') {
|
||||
status = 'REVERSAL';
|
||||
}
|
||||
return status;
|
||||
})()}
|
||||
</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.request_date
|
||||
? new Date(log.request_date).toLocaleDateString('en-GB', {
|
||||
day: '2-digit',
|
||||
@ -883,10 +919,10 @@ const DetailApprovalTransaction = () => {
|
||||
if (log.response_code === null) {
|
||||
return '';
|
||||
}
|
||||
const parsed = JSON.parse(log.request_body);
|
||||
const parsed = JSON.parse(log.response_body);
|
||||
return JSON.stringify(parsed, null, 2);
|
||||
} catch (e) {
|
||||
return log.request_body; // fallback: tampilkan as-is jika gagal parse
|
||||
return log.response_body; // fallback: tampilkan as-is jika gagal parse
|
||||
}
|
||||
})()}
|
||||
</pre>
|
||||
|
||||
@ -49,6 +49,7 @@ const DetailTransaction = () => {
|
||||
id: selectedTransactionId
|
||||
});
|
||||
setTransactionDetails(response?.data);
|
||||
console.log(response?.data);
|
||||
// console.log(selectedTransactionId);
|
||||
} catch (error) {
|
||||
console.error('Error fetching transaction', error);
|
||||
@ -744,7 +745,7 @@ const DetailTransaction = () => {
|
||||
<table className="min-w-full table-auto">
|
||||
<thead>
|
||||
<tr className="bg-gray-100">
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Type</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Status</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Request Date</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Response Date</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Response Body</th>
|
||||
@ -756,7 +757,25 @@ const DetailTransaction = () => {
|
||||
{transactionDetails?.log && transactionDetails?.log.length > 0 ? (
|
||||
transactionDetails.log.map((log: { type: string, request_endpoint: string, status: string; request_date: string; response_date: string; request_body: string; response_body: string; response_code: number }, index: number) => (
|
||||
<tr key={index} className="border-t">
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.type || ''}</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">
|
||||
{(() => {
|
||||
let status;
|
||||
if (log.status === 'C') {
|
||||
status = 'COMPLETE';
|
||||
} else if (log.status === 'F') {
|
||||
status = 'FAILED';
|
||||
} else if (log.status === 'O') {
|
||||
status = 'ON PROCESS';
|
||||
} else if (log.status === 'P') {
|
||||
status = 'PENDING';
|
||||
} else if (log.status === 'R') {
|
||||
status = 'ROLLBACK';
|
||||
} else if (log.status === 'S') {
|
||||
status = 'REVERSAL';
|
||||
}
|
||||
return status;
|
||||
})()}
|
||||
</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.request_date
|
||||
? new Date(log.request_date).toLocaleDateString('en-GB', {
|
||||
day: '2-digit',
|
||||
@ -798,10 +817,10 @@ const DetailTransaction = () => {
|
||||
<pre style={{ fontFamily: 'monospace', whiteSpace: 'pre-wrap' }}>
|
||||
{(() => {
|
||||
try {
|
||||
if (log.request_body === null) {
|
||||
if (log.response_body === null) {
|
||||
return '';
|
||||
}
|
||||
const parsed = JSON.parse(log.request_body);
|
||||
const parsed = JSON.parse(log.response_body);
|
||||
return JSON.stringify(parsed, null, 2) ?? '';
|
||||
} catch (e) {
|
||||
return log.response_body ?? ''; // fallback: tampilkan as-is jika gagal parse
|
||||
@ -900,7 +919,7 @@ const DetailTransaction = () => {
|
||||
<table className="min-w-full table-auto">
|
||||
<thead>
|
||||
<tr className="bg-gray-100">
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Type</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Status</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Request Date</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Response Date</th>
|
||||
<th className="px-4 py-2 text-left text-sm text-gray-500">Response Body</th>
|
||||
@ -910,9 +929,27 @@ const DetailTransaction = () => {
|
||||
</thead>
|
||||
<tbody>
|
||||
{transactionDetails?.p24 && transactionDetails?.p24.length > 0 ? (
|
||||
transactionDetails.p24.map((log: { request_endpoint: string, type: string; request_date: string; response_date: string; request_body: string; response_body: string; response_code: number }, index: number) => (
|
||||
transactionDetails.p24.map((log: { status: string,request_endpoint: string, type: string; request_date: string; response_date: string; request_body: string; response_body: string; response_code: number }, index: number) => (
|
||||
<tr key={index} className="border-t">
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.type ?? ''}</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">
|
||||
{(() => {
|
||||
let status;
|
||||
if (log.status === 'C') {
|
||||
status = 'COMPLETE';
|
||||
} else if (log.status === 'F') {
|
||||
status = 'FAILED';
|
||||
} else if (log.status === 'O') {
|
||||
status = 'ON PROCESS';
|
||||
} else if (log.status === 'P') {
|
||||
status = 'PENDING';
|
||||
} else if (log.status === 'R') {
|
||||
status = 'ROLLBACK';
|
||||
} else if (log.status === 'S') {
|
||||
status = 'REVERSAL';
|
||||
}
|
||||
return status;
|
||||
})()}
|
||||
</td>
|
||||
<td className="px-4 py-2 text-sm text-gray-500">{log.request_date
|
||||
? new Date(log.request_date).toLocaleDateString('en-GB', {
|
||||
day: '2-digit',
|
||||
|
||||
Reference in New Issue
Block a user