mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-20 21:41:57 +00:00
refactor(FE): Rename payment fields and add initial balance row
This commit is contained in:
@@ -347,13 +347,15 @@ const createPDFDocument = (params: CustomerPaymentExportPDFParams) => {
|
||||
</View>
|
||||
<View style={[pdfStyles.tableCellCenter, { flex: 1.2 }]}>
|
||||
<Text>
|
||||
{item.do_date ? formatDate(item.do_date, 'DD MMM YY') : '-'}
|
||||
{item.trans_date
|
||||
? formatDate(item.trans_date, 'DD MMM YY')
|
||||
: '-'}
|
||||
</Text>
|
||||
</View>
|
||||
<View style={[pdfStyles.tableCellCenter, { flex: 1.2 }]}>
|
||||
<Text>
|
||||
{item.realization_date
|
||||
? formatDate(item.realization_date, 'DD MMM YY')
|
||||
{item.delivery_date
|
||||
? formatDate(item.delivery_date, 'DD MMM YY')
|
||||
: '-'}
|
||||
</Text>
|
||||
</View>
|
||||
@@ -366,7 +368,7 @@ const createPDFDocument = (params: CustomerPaymentExportPDFParams) => {
|
||||
<Text>{item.reference || '-'}</Text>
|
||||
</View>
|
||||
<View style={[pdfStyles.tableCell, { flex: 1.2 }]}>
|
||||
<Text>{item.vehicle_plate || '-'}</Text>
|
||||
<Text>{item.vehicle_numbers || '-'}</Text>
|
||||
</View>
|
||||
<View style={[pdfStyles.tableCellRight, { flex: 0.8 }]}>
|
||||
<Text>{formatNumber(item.qty)}</Text>
|
||||
@@ -390,10 +392,10 @@ const createPDFDocument = (params: CustomerPaymentExportPDFParams) => {
|
||||
<Text>{formatNumber(item.ppn)}%</Text>
|
||||
</View>
|
||||
<View style={[pdfStyles.tableCellRight, { flex: 1.2 }]}>
|
||||
<Text>{formatCurrency(item.total)}</Text>
|
||||
<Text>{formatCurrency(item.total_price)}</Text>
|
||||
</View>
|
||||
<View style={[pdfStyles.tableCellRight, { flex: 1.2 }]}>
|
||||
<Text>{formatCurrency(item.payment)}</Text>
|
||||
<Text>{formatCurrency(item.payment_amount)}</Text>
|
||||
</View>
|
||||
<View style={[pdfStyles.tableCellRight, { flex: 1.2 }]}>
|
||||
<Text style={pdfStyles.textError}>
|
||||
@@ -401,30 +403,28 @@ const createPDFDocument = (params: CustomerPaymentExportPDFParams) => {
|
||||
</Text>
|
||||
</View>
|
||||
<View style={[pdfStyles.tableCell, { flex: 1.5 }]}>
|
||||
{item.notes ? (
|
||||
<Text>{item.notes}</Text>
|
||||
) : (
|
||||
{item.status ? (
|
||||
<View
|
||||
style={[
|
||||
pdfStyles.badge,
|
||||
item.accounts_receivable === 0
|
||||
item.status === 'LUNAS'
|
||||
? pdfStyles.badgeLunas
|
||||
: pdfStyles.badgeBelumLunas,
|
||||
]}
|
||||
>
|
||||
<Text>
|
||||
{item.accounts_receivable === 0
|
||||
? 'Lunas'
|
||||
: 'Belum Lunas'}
|
||||
{item.status === 'LUNAS' ? 'Lunas' : 'Belum Lunas'}
|
||||
</Text>
|
||||
</View>
|
||||
) : (
|
||||
<Text>-</Text>
|
||||
)}
|
||||
</View>
|
||||
<View style={[pdfStyles.tableCell, { flex: 1 }]}>
|
||||
<Text>{item.pickup_info || '-'}</Text>
|
||||
</View>
|
||||
<View style={[pdfStyles.tableCell, { flex: 1.5 }]}>
|
||||
<Text>{item.sales_marketing || '-'}</Text>
|
||||
<Text>{item.sales_person || '-'}</Text>
|
||||
</View>
|
||||
</View>
|
||||
))}
|
||||
|
||||
@@ -24,17 +24,15 @@ export const generateCustomerPaymentExcel = (
|
||||
const excelData: { [key: string]: string | number }[] = customerData.map(
|
||||
(item, index) => ({
|
||||
No: index + 1,
|
||||
'Tanggal DO/Bayar': item.do_date
|
||||
? formatDate(item.do_date, 'DD MMM YYYY')
|
||||
'Tanggal DO/Bayar': item.trans_date
|
||||
? formatDate(item.trans_date, 'DD MMM YYYY')
|
||||
: '',
|
||||
'Tanggal Realisasi': item.realization_date
|
||||
? formatDate(item.realization_date, 'DD MMM YYYY')
|
||||
'Tanggal Realisasi': item.delivery_date
|
||||
? formatDate(item.delivery_date, 'DD MMM YYYY')
|
||||
: '',
|
||||
Aging: formatNumber(item.aging_day || 0),
|
||||
Referensi: item.reference || '',
|
||||
'Nomor Polisi': Array.isArray(item.vehicle_plate)
|
||||
? item.vehicle_plate.join(', ')
|
||||
: '',
|
||||
'Nomor Polisi': item.vehicle_numbers || '',
|
||||
'Ekor/Qty': formatNumber(item.qty || 0),
|
||||
'Berat (Kg)': formatNumber(item.weight || 0),
|
||||
AVG: formatNumber(item.average_weight || 0),
|
||||
@@ -42,12 +40,12 @@ export const generateCustomerPaymentExcel = (
|
||||
CN: formatCurrency(item.credit_note || 0),
|
||||
'Harga Akhir': formatCurrency(item.final_price || 0),
|
||||
'PPN (%)': formatNumber(item.ppn || 0),
|
||||
Total: formatCurrency(item.total || 0),
|
||||
Pembayaran: formatCurrency(item.payment || 0),
|
||||
Total: formatCurrency(item.total_price || 0),
|
||||
Pembayaran: formatCurrency(item.payment_amount || 0),
|
||||
'Saldo Piutang': formatCurrency(item.accounts_receivable || 0),
|
||||
Keterangan: item.notes || '',
|
||||
Keterangan: item.status || '',
|
||||
Pengambilan: item.pickup_info || '',
|
||||
'Sales/Marketing': item.sales_marketing || '',
|
||||
'Sales/Marketing': item.sales_person || '',
|
||||
})
|
||||
);
|
||||
|
||||
|
||||
@@ -302,24 +302,37 @@ const CustomerPaymentTab = () => {
|
||||
{
|
||||
id: 'no',
|
||||
header: 'No',
|
||||
cell: (props) => props.row.index + 1,
|
||||
cell: (props) => {
|
||||
const isInitialBalanceRow =
|
||||
Object.keys(props.row.original).length === 1 &&
|
||||
'accounts_receivable' in props.row.original;
|
||||
return isInitialBalanceRow ? 'Saldo Awal' : props.row.index;
|
||||
},
|
||||
footer: () => <div className='font-semibold text-gray-900'>Total</div>,
|
||||
},
|
||||
{
|
||||
id: 'do_date_or_payment_date',
|
||||
header: 'Tanggal DO/Bayar',
|
||||
accessorKey: 'do_date',
|
||||
accessorKey: 'trans_date',
|
||||
cell: (props) => {
|
||||
const value = props.row.original.do_date;
|
||||
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');
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'realization_date',
|
||||
header: 'Tanggal Realisasi',
|
||||
accessorKey: 'realization_date',
|
||||
accessorKey: 'delivery_date',
|
||||
cell: (props) => {
|
||||
const value = props.row.original.realization_date;
|
||||
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');
|
||||
},
|
||||
},
|
||||
@@ -328,6 +341,10 @@ const CustomerPaymentTab = () => {
|
||||
header: 'Aging',
|
||||
accessorKey: 'aging_day',
|
||||
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'>
|
||||
@@ -341,6 +358,10 @@ const CustomerPaymentTab = () => {
|
||||
header: 'Referensi',
|
||||
accessorKey: 'reference',
|
||||
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 || '-';
|
||||
},
|
||||
@@ -348,9 +369,13 @@ const CustomerPaymentTab = () => {
|
||||
{
|
||||
id: 'vehicle_plate',
|
||||
header: 'Nomor Polisi',
|
||||
accessorKey: 'vehicle_plate',
|
||||
accessorKey: 'vehicle_numbers',
|
||||
cell: (props) => {
|
||||
const value = props.row.original.vehicle_plate;
|
||||
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 || '-';
|
||||
},
|
||||
},
|
||||
@@ -359,6 +384,10 @@ const CustomerPaymentTab = () => {
|
||||
header: 'Ekor/Qty',
|
||||
accessorKey: 'qty',
|
||||
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>;
|
||||
},
|
||||
@@ -373,6 +402,10 @@ const CustomerPaymentTab = () => {
|
||||
header: 'Berat (Kg)',
|
||||
accessorKey: 'weight',
|
||||
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>;
|
||||
},
|
||||
@@ -387,6 +420,10 @@ const CustomerPaymentTab = () => {
|
||||
header: 'AVG',
|
||||
accessorKey: 'average_weight',
|
||||
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>;
|
||||
},
|
||||
@@ -399,6 +436,10 @@ const CustomerPaymentTab = () => {
|
||||
header: 'Harga Awal',
|
||||
accessorKey: 'price',
|
||||
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>;
|
||||
},
|
||||
@@ -413,6 +454,10 @@ const CustomerPaymentTab = () => {
|
||||
header: 'CN',
|
||||
accessorKey: 'credit_note',
|
||||
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>;
|
||||
},
|
||||
@@ -427,6 +472,10 @@ const CustomerPaymentTab = () => {
|
||||
header: 'Harga Akhir',
|
||||
accessorKey: 'final_price',
|
||||
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>;
|
||||
},
|
||||
@@ -441,6 +490,10 @@ const CustomerPaymentTab = () => {
|
||||
header: 'PPN (%)',
|
||||
accessorKey: 'ppn',
|
||||
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>;
|
||||
},
|
||||
@@ -451,9 +504,13 @@ const CustomerPaymentTab = () => {
|
||||
{
|
||||
id: 'total',
|
||||
header: 'Total',
|
||||
accessorKey: 'total',
|
||||
accessorKey: 'total_price',
|
||||
cell: (props) => {
|
||||
const value = props.row.original.total;
|
||||
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>;
|
||||
},
|
||||
footer: () => (
|
||||
@@ -465,9 +522,13 @@ const CustomerPaymentTab = () => {
|
||||
{
|
||||
id: 'payment',
|
||||
header: 'Pembayaran',
|
||||
accessorKey: 'payment',
|
||||
accessorKey: 'payment_amount',
|
||||
cell: (props) => {
|
||||
const value = props.row.original.payment;
|
||||
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>;
|
||||
},
|
||||
footer: () => (
|
||||
@@ -495,9 +556,13 @@ const CustomerPaymentTab = () => {
|
||||
{
|
||||
id: 'notes',
|
||||
header: 'Keterangan',
|
||||
accessorKey: 'notes',
|
||||
accessorKey: 'status',
|
||||
cell: (props) => {
|
||||
const value = props.row.original.notes;
|
||||
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) {
|
||||
return '-';
|
||||
@@ -522,6 +587,10 @@ const CustomerPaymentTab = () => {
|
||||
header: 'Pengambilan',
|
||||
accessorKey: 'pickup_info',
|
||||
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 || '-';
|
||||
},
|
||||
@@ -529,9 +598,13 @@ const CustomerPaymentTab = () => {
|
||||
{
|
||||
id: 'sales_marketing',
|
||||
header: 'Sales/Marketing',
|
||||
accessorKey: 'sales_marketing',
|
||||
accessorKey: 'sales_person',
|
||||
cell: (props) => {
|
||||
const value = props.row.original.sales_marketing;
|
||||
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 || '-';
|
||||
},
|
||||
},
|
||||
@@ -754,9 +827,14 @@ const CustomerPaymentTab = () => {
|
||||
collapsible={true}
|
||||
>
|
||||
<Table
|
||||
data={customerReport.rows}
|
||||
data={[
|
||||
{
|
||||
accounts_receivable: customerReport.initial_balance,
|
||||
} as CustomerPaymentReport['rows'][0],
|
||||
...customerReport.rows,
|
||||
]}
|
||||
columns={tableColumns}
|
||||
pageSize={10}
|
||||
pageSize={customerReport.rows.length + 1}
|
||||
renderFooter={customerReport.rows.length > 0}
|
||||
className={{
|
||||
containerClassName: 'w-full',
|
||||
|
||||
+11
-9
@@ -2,12 +2,12 @@ import { BaseCustomer } from '@/types/api/master-data/customer';
|
||||
import { BaseMetadata } from '@/types/api/api-general';
|
||||
|
||||
export type CustomerPaymentRow = {
|
||||
id: number;
|
||||
do_date: string;
|
||||
realization_date: string;
|
||||
aging_day: number | null;
|
||||
transaction_type: string;
|
||||
transaction_id: number;
|
||||
trans_date: string;
|
||||
delivery_date: string | null;
|
||||
reference: string;
|
||||
vehicle_plate: string[];
|
||||
vehicle_numbers: string;
|
||||
qty: number;
|
||||
weight: number;
|
||||
average_weight: number;
|
||||
@@ -15,12 +15,13 @@ export type CustomerPaymentRow = {
|
||||
credit_note: number;
|
||||
final_price: number;
|
||||
ppn: number;
|
||||
total: number;
|
||||
payment: number;
|
||||
total_price: number;
|
||||
payment_amount: number;
|
||||
accounts_receivable: number;
|
||||
notes: string;
|
||||
aging_day: number;
|
||||
status: string;
|
||||
pickup_info: string;
|
||||
sales_marketing: string;
|
||||
sales_person: string;
|
||||
};
|
||||
|
||||
export type CustomerPaymentSummary = {
|
||||
@@ -37,6 +38,7 @@ export type CustomerPaymentSummary = {
|
||||
|
||||
export type CustomerPaymentReport = BaseMetadata & {
|
||||
customer: BaseCustomer;
|
||||
initial_balance: number;
|
||||
rows: CustomerPaymentRow[];
|
||||
summary: CustomerPaymentSummary;
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user