gitea-admin/lti-web-client
1
0
Fork 0
mirror of https://gitlab.com/mbugroup/lti-web-client.git synced 2026-05-20 13:32:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(FE): Simplify table cells and render initial balance row

Browse Source
This commit is contained in:
rstubryan
2026-01-14 15:46:03 +07:00
parent 08c28f4077
commit ab2175d903
1 changed files with 45 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/pages/report/finance/tab/CustomerPaymentTab.tsx
+45 -76
View File
@@ -302,49 +302,35 @@ const CustomerPaymentTab = () => {
{
id: 'no',
header: 'No',
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
return isInitialBalanceRow ? 'Saldo Awal' : props.row.index;
},
cell: (props) => props.row.index,
footer: () => <div className='font-semibold text-gray-900'>Total</div>,
},
{
id: 'do_date_or_payment_date',
header: 'Tanggal DO/Bayar',
accessorKey: 'trans_date',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return '-';
const value = props.row.original.trans_date;
return formatDate(value, 'DD MMM YYYY');
return value ? formatDate(value, 'DD MMM YYYY') : '-';
},
},
{
id: 'realization_date',
header: 'Tanggal Realisasi',
accessorKey: 'delivery_date',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return '-';
const value = props.row.original.delivery_date;
return formatDate(value, 'DD MMM YYYY');
return value ? formatDate(value, 'DD MMM YYYY') : '-';
},
},
{
id: 'aging',
header: 'Aging',
accessorKey: 'aging_day',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return '-';
const value = props.row.original.aging_day;
return (
<div className='text-center'>
@@ -357,11 +343,8 @@ const CustomerPaymentTab = () => {
id: 'reference',
header: 'Referensi',
accessorKey: 'reference',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return '-';
const value = props.row.original.reference;
return value || '-';
},
@@ -370,11 +353,8 @@ const CustomerPaymentTab = () => {
id: 'vehicle_plate',
header: 'Nomor Polisi',
accessorKey: 'vehicle_numbers',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return '-';
const value = props.row.original.vehicle_numbers;
return value || '-';
},
@@ -383,11 +363,8 @@ const CustomerPaymentTab = () => {
id: 'qty',
header: 'Ekor/Qty',
accessorKey: 'qty',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return <div className='text-right'>-</div>;
const value = props.row.original.qty;
return <div className='text-right'>{formatNumber(value)}</div>;
},
@@ -401,11 +378,8 @@ const CustomerPaymentTab = () => {
id: 'weight',
header: 'Berat (Kg)',
accessorKey: 'weight',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return <div className='text-right'>-</div>;
const value = props.row.original.weight;
return <div className='text-right'>{formatNumber(value)}</div>;
},
@@ -419,11 +393,8 @@ const CustomerPaymentTab = () => {
id: 'average_weight',
header: 'AVG',
accessorKey: 'average_weight',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return <div className='text-right'>-</div>;
const value = props.row.original.average_weight;
return <div className='text-right'>{formatNumber(value)}</div>;
},
@@ -435,11 +406,8 @@ const CustomerPaymentTab = () => {
id: 'price',
header: 'Harga Awal',
accessorKey: 'price',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return <div className='text-right'>-</div>;
const value = props.row.original.price;
return <div className='text-right'>{formatCurrency(value)}</div>;
},
@@ -453,11 +421,8 @@ const CustomerPaymentTab = () => {
id: 'credit_note',
header: 'CN',
accessorKey: 'credit_note',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return <div className='text-right'>-</div>;
const value = props.row.original.credit_note;
return <div className='text-right'>{formatCurrency(value)}</div>;
},
@@ -471,11 +436,8 @@ const CustomerPaymentTab = () => {
id: 'final_price',
header: 'Harga Akhir',
accessorKey: 'final_price',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return <div className='text-right'>-</div>;
const value = props.row.original.final_price;
return <div className='text-right'>{formatCurrency(value)}</div>;
},
@@ -489,11 +451,8 @@ const CustomerPaymentTab = () => {
id: 'ppn',
header: 'PPN (%)',
accessorKey: 'ppn',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return <div className='text-right'>-</div>;
const value = props.row.original.ppn;
return <div className='text-right'>{formatNumber(value)}%</div>;
},
@@ -505,11 +464,8 @@ const CustomerPaymentTab = () => {
id: 'total',
header: 'Total',
accessorKey: 'total_price',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return <div className='text-right'>-</div>;
const value = props.row.original.total_price;
return <div className='text-right'>{formatCurrency(value)}</div>;
},
@@ -523,11 +479,8 @@ const CustomerPaymentTab = () => {
id: 'payment',
header: 'Pembayaran',
accessorKey: 'payment_amount',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return <div className='text-right'>-</div>;
const value = props.row.original.payment_amount;
return <div className='text-right'>{formatCurrency(value)}</div>;
},
@@ -541,6 +494,7 @@ const CustomerPaymentTab = () => {
id: 'accounts_receivable',
header: 'Saldo Piutang',
accessorKey: 'accounts_receivable',
enableSorting: false,
cell: (props) => {
const value = props.row.original.accounts_receivable;
return (
@@ -557,11 +511,8 @@ const CustomerPaymentTab = () => {
id: 'notes',
header: 'Keterangan',
accessorKey: 'status',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return '-';
const value = props.row.original.status;
if (!value) {
@@ -586,11 +537,8 @@ const CustomerPaymentTab = () => {
id: 'pickup_info',
header: 'Pengambilan',
accessorKey: 'pickup_info',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return '-';
const value = props.row.original.pickup_info;
return value || '-';
},
@@ -599,11 +547,8 @@ const CustomerPaymentTab = () => {
id: 'sales_marketing',
header: 'Sales/Marketing',
accessorKey: 'sales_person',
enableSorting: false,
cell: (props) => {
const isInitialBalanceRow =
Object.keys(props.row.original).length === 1 &&
'accounts_receivable' in props.row.original;
if (isInitialBalanceRow) return '-';
const value = props.row.original.sales_person;
return value || '-';
},
@@ -854,6 +799,30 @@ const CustomerPaymentTab = () => {
'px-4 py-3 text-xs text-gray-900 whitespace-nowrap',
paginationClassName: 'hidden',
}}
renderCustomRow={(row) => {
if (row.index === 0) {
return (
<tr
className='hover:bg-gray-50 transition-colors border-b border-l border-r border-b-gray-200 border-l-gray-200 border-r-gray-200'
key={row.index}
>
<td
className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap'
colSpan={15}
></td>
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap'>
<div className='text-right text-error'>
{formatCurrency(row.original.accounts_receivable)}
</div>
</td>
<td
className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap'
colSpan={4}
></td>
</tr>
);
}
}}
/>
</Card>
);