fix(FE): fixing response data debt supplier

This commit is contained in:
randy-ar
2026-01-13 10:46:52 +07:00
parent eb1337292b
commit 6702dd7dc6
6 changed files with 484 additions and 70 deletions
@@ -155,7 +155,7 @@ const createPDFDocument = (params: DebtSupplierExportPDFParams) => {
{/* Title and Supplier Info */}
<View style={pdfStyles.titleSection}>
<Text style={pdfStyles.mainTitle}>
Laporan &gt; Hutang Supplier
Laporan &gt; Rekapitulasi Hutang ke Supplier
</Text>
<Text style={pdfStyles.supplierTitle}>
{supplierReport.supplier.name}
@@ -169,19 +169,19 @@ const createPDFDocument = (params: DebtSupplierExportPDFParams) => {
<View style={[pdfStyles.tableCellHeader, { flex: 0.5 }]}>
<Text>No</Text>
</View>
<View style={[pdfStyles.tableCellHeader, { flex: 1 }]}>
<View style={[pdfStyles.tableCellHeader, { flex: 1.5 }]}>
<Text>No. PR</Text>
</View>
<View style={[pdfStyles.tableCellHeader, { flex: 1 }]}>
<View style={[pdfStyles.tableCellHeader, { flex: 1.5 }]}>
<Text>No. PO</Text>
</View>
<View style={[pdfStyles.tableCellHeader, { flex: 1 }]}>
<Text>Tgl PR</Text>
<Text>Tgl Terima</Text>
</View>
<View style={[pdfStyles.tableCellHeader, { flex: 1 }]}>
<Text>Tgl PO</Text>
</View>
<View style={[pdfStyles.tableCellHeader, { flex: 0.8 }]}>
<View style={[pdfStyles.tableCellHeader, { flex: 0.6 }]}>
<Text>Aging</Text>
</View>
<View style={[pdfStyles.tableCellHeader, { flex: 1 }]}>
@@ -194,15 +194,15 @@ const createPDFDocument = (params: DebtSupplierExportPDFParams) => {
<Text>Tgl Jatuh Tempo</Text>
</View>
<View style={[pdfStyles.tableCellHeader, { flex: 1 }]}>
<Text>Status JT</Text>
<Text>Status Jatuh Tempo</Text>
</View>
<View style={[pdfStyles.tableCellHeaderRight, { flex: 1.2 }]}>
<View style={[pdfStyles.tableCellHeaderRight, { flex: 1.5 }]}>
<Text>Total Harga</Text>
</View>
<View style={[pdfStyles.tableCellHeaderRight, { flex: 1.2 }]}>
<View style={[pdfStyles.tableCellHeaderRight, { flex: 1.5 }]}>
<Text>Pembayaran</Text>
</View>
<View style={[pdfStyles.tableCellHeaderRight, { flex: 1.2 }]}>
<View style={[pdfStyles.tableCellHeaderRight, { flex: 1.5 }]}>
<Text>Hutang</Text>
</View>
<View style={[pdfStyles.tableCellHeader, { flex: 1 }]}>
@@ -227,23 +227,31 @@ const createPDFDocument = (params: DebtSupplierExportPDFParams) => {
<View style={[pdfStyles.tableCellNo, { flex: 0.5 }]}>
<Text>{index + 1}</Text>
</View>
<View style={[pdfStyles.tableCell, { flex: 1 }]}>
<View style={[pdfStyles.tableCell, { flex: 1.5 }]}>
<Text>{item.pr_number || '-'}</Text>
</View>
<View style={[pdfStyles.tableCell, { flex: 1 }]}>
<View style={[pdfStyles.tableCell, { flex: 1.5 }]}>
<Text>{item.po_number || '-'}</Text>
</View>
<View style={[pdfStyles.tableCellCenter, { flex: 1 }]}>
<Text>
{item.pr_date ? formatDate(item.pr_date, 'DD MMM YY') : '-'}
{item.received_date
? item.received_date != '-'
? formatDate(item.received_date, 'DD MMM YY')
: '-'
: '-'}
</Text>
</View>
<View style={[pdfStyles.tableCellCenter, { flex: 1 }]}>
<Text>
{item.po_date ? formatDate(item.po_date, 'DD MMM YY') : '-'}
{item.po_date
? item.po_date != '-'
? formatDate(item.po_date, 'DD MMM YY')
: '-'
: '-'}
</Text>
</View>
<View style={[pdfStyles.tableCellCenter, { flex: 0.8 }]}>
<View style={[pdfStyles.tableCellCenter, { flex: 0.6 }]}>
<Text>{formatNumber(item.aging)} Hari</Text>
</View>
<View style={[pdfStyles.tableCell, { flex: 1 }]}>
@@ -255,20 +263,43 @@ const createPDFDocument = (params: DebtSupplierExportPDFParams) => {
<View style={[pdfStyles.tableCellCenter, { flex: 1 }]}>
<Text>
{item.due_date
? formatDate(item.due_date, 'DD MMM YY')
? item.due_date != '-'
? formatDate(item.due_date, 'DD MMM YY')
: '-'
: '-'}
</Text>
</View>
<View style={[pdfStyles.tableCell, { flex: 1 }]}>
<Text>{item.due_status || '-'}</Text>
</View>
<View style={[pdfStyles.tableCellRight, { flex: 1.2 }]}>
<View
style={[
pdfStyles.tableCellRight,
{
flex: 1.5,
color: item.total_price < 0 ? 'red' : 'black',
},
]}
>
<Text>{formatCurrency(item.total_price)}</Text>
</View>
<View style={[pdfStyles.tableCellRight, { flex: 1.2 }]}>
<View
style={[
pdfStyles.tableCellRight,
{
flex: 1.5,
color: item.payment_price < 0 ? 'red' : 'black',
},
]}
>
<Text>{formatCurrency(item.payment_price)}</Text>
</View>
<View style={[pdfStyles.tableCellRight, { flex: 1.2 }]}>
<View
style={[
pdfStyles.tableCellRight,
{ flex: 1.5, color: item.debt_price < 0 ? 'red' : 'black' },
]}
>
<Text>{formatCurrency(item.debt_price)}</Text>
</View>
<View style={[pdfStyles.tableCell, { flex: 1 }]}>
@@ -286,7 +317,10 @@ const createPDFDocument = (params: DebtSupplierExportPDFParams) => {
<View style={[pdfStyles.tableCellNo, { flex: 0.5 }]}>
<Text>Total</Text>
</View>
<View style={[pdfStyles.tableCell, { flex: 1 }]}>
<View style={[pdfStyles.tableCell, { flex: 1.5 }]}>
<Text></Text>
</View>
<View style={[pdfStyles.tableCell, { flex: 1.5 }]}>
<Text></Text>
</View>
<View style={[pdfStyles.tableCell, { flex: 1 }]}>
@@ -295,10 +329,7 @@ const createPDFDocument = (params: DebtSupplierExportPDFParams) => {
<View style={[pdfStyles.tableCell, { flex: 1 }]}>
<Text></Text>
</View>
<View style={[pdfStyles.tableCell, { flex: 1 }]}>
<Text></Text>
</View>
<View style={[pdfStyles.tableCellCenter, { flex: 0.8 }]}>
<View style={[pdfStyles.tableCellCenter, { flex: 0.6 }]}>
<Text>{formatNumber(supplierReport.total.aging)} Hari</Text>
</View>
<View style={[pdfStyles.tableCell, { flex: 1 }]}>
@@ -313,17 +344,46 @@ const createPDFDocument = (params: DebtSupplierExportPDFParams) => {
<View style={[pdfStyles.tableCell, { flex: 1 }]}>
<Text></Text>
</View>
<View style={[pdfStyles.tableCellRight, { flex: 1.2 }]}>
<View
style={[
pdfStyles.tableCellRight,
{
flex: 1.5,
color:
supplierReport.total.total_price < 0 ? 'red' : 'black',
},
]}
>
<Text>
{formatCurrency(supplierReport.total.total_price)}
</Text>
</View>
<View style={[pdfStyles.tableCellRight, { flex: 1.2 }]}>
<View
style={[
pdfStyles.tableCellRight,
{
flex: 1.5,
color:
supplierReport.total.payment_price < 0
? 'red'
: 'black',
},
]}
>
<Text>
{formatCurrency(supplierReport.total.payment_price)}
</Text>
</View>
<View style={[pdfStyles.tableCellRight, { flex: 1.2 }]}>
<View
style={[
pdfStyles.tableCellRight,
{
flex: 1.5,
color:
supplierReport.total.debt_price < 0 ? 'red' : 'black',
},
]}
>
<Text>{formatCurrency(supplierReport.total.debt_price)}</Text>
</View>
<View style={[pdfStyles.tableCell, { flex: 1 }]}>
@@ -1,7 +1,7 @@
'use client';
import * as XLSX from 'xlsx';
import { formatDate, formatCurrency, formatNumber } from '@/lib/helper';
import { formatDate } from '@/lib/helper';
import { DebtSupplier } from '@/types/api/report/debt-supplier';
interface DebtSupplierExportExcelParams {
@@ -26,22 +26,28 @@ export const generateDebtSupplierExcel = (
No: index + 1,
'Nomor PR': item.pr_number || '',
'Nomor PO': item.po_number || '',
'Tanggal PR': item.pr_date
? formatDate(item.pr_date, 'DD MMM YYYY')
: '',
'Tanggal Terima': item.received_date
? item.received_date != '-'
? formatDate(item.received_date, 'MM/DD/YYYY')
: '-'
: '-',
'Tanggal PO': item.po_date
? formatDate(item.po_date, 'DD MMM YYYY')
: '',
'Aging (Hari)': formatNumber(item.aging || 0),
? item.po_date != '-'
? formatDate(item.po_date, 'MM/DD/YYYY')
: '-'
: '-',
'Aging (Hari)': item.aging || 0,
Area: item.area?.name || '',
Gudang: item.warehouse?.name || '',
'Tanggal Jatuh Tempo': item.due_date
? formatDate(item.due_date, 'DD MMM YYYY')
: '',
? item.due_date != '-'
? formatDate(item.due_date, 'MM/DD/YYYY')
: '-'
: '-',
'Status Jatuh Tempo': item.due_status || '',
'Total Harga': formatCurrency(item.total_price || 0),
'Harga Pembayaran': formatCurrency(item.payment_price || 0),
'Harga Hutang': formatCurrency(item.debt_price || 0),
'Total Harga': item.total_price || 0,
'Harga Pembayaran': item.payment_price || 0,
'Harga Hutang': item.debt_price || 0,
Status: item.status || '',
'Nomor Perjalanan': item.travel_number || '',
})
@@ -52,18 +58,16 @@ export const generateDebtSupplierExcel = (
No: 'Total',
'Nomor PR': '',
'Nomor PO': '',
'Tanggal PR': '',
'Tanggal Terima': '',
'Tanggal PO': '',
'Aging (Hari)': formatNumber(supplierReport.total.aging || 0),
'Aging (Hari)': supplierReport.total.aging || 0,
Area: '',
Gudang: '',
'Tanggal Jatuh Tempo': '',
'Status Jatuh Tempo': '',
'Total Harga': formatCurrency(supplierReport.total.total_price || 0),
'Harga Pembayaran': formatCurrency(
supplierReport.total.payment_price || 0
),
'Harga Hutang': formatCurrency(supplierReport.total.debt_price || 0),
'Total Harga': supplierReport.total.total_price || 0,
'Harga Pembayaran': supplierReport.total.payment_price || 0,
'Harga Hutang': supplierReport.total.debt_price || 0,
Status: '',
'Nomor Perjalanan': '',
});
@@ -256,12 +256,16 @@ const DebtSupplierTab = () => {
},
},
{
id: 'pr_date',
header: 'Tanggal PR',
accessorKey: 'pr_date',
id: 'received_date',
header: 'Tanggal Terima',
accessorKey: 'received_date',
cell: (props) => {
const value = props.row.original.pr_date;
return formatDate(value, 'DD MMM YYYY');
const value = props.row.original.received_date;
return value
? value != '-'
? formatDate(value, 'DD MMM YYYY')
: '-'
: '-';
},
},
{
@@ -270,7 +274,11 @@ const DebtSupplierTab = () => {
accessorKey: 'po_date',
cell: (props) => {
const value = props.row.original.po_date;
return formatDate(value, 'DD MMM YYYY');
return value
? value != '-'
? formatDate(value, 'DD MMM YYYY')
: '-'
: '-';
},
},
{
@@ -310,7 +318,11 @@ const DebtSupplierTab = () => {
accessorKey: 'due_date',
cell: (props) => {
const value = props.row.original.due_date;
return formatDate(value, 'DD MMM YYYY');
return value
? value != '-'
? formatDate(value, 'DD MMM YYYY')
: '-'
: '-';
},
},
{
@@ -328,11 +340,19 @@ const DebtSupplierTab = () => {
accessorKey: 'total_price',
cell: (props) => {
const value = props.row.original.total_price;
return <div className='text-right'>{formatCurrency(value)}</div>;
return (
<div className={`text-right ${value < 0 ? 'text-red-500' : ''}`}>
{formatCurrency(value)}
</div>
);
},
footer: () => {
const value = supplier.total.total_price;
return <div className='text-right'>{formatCurrency(value)}</div>;
return (
<div className={`text-right ${value < 0 ? 'text-red-500' : ''}`}>
{formatCurrency(value)}
</div>
);
},
},
{
@@ -341,11 +361,19 @@ const DebtSupplierTab = () => {
accessorKey: 'payment_price',
cell: (props) => {
const value = props.row.original.payment_price;
return <div className='text-right'>{formatCurrency(value)}</div>;
return (
<div className={`text-right ${value < 0 ? 'text-red-500' : ''}`}>
{formatCurrency(value)}
</div>
);
},
footer: () => {
const value = supplier.total.payment_price;
return <div className='text-right'>{formatCurrency(value)}</div>;
return (
<div className={`text-right ${value < 0 ? 'text-red-500' : ''}`}>
{formatCurrency(value)}
</div>
);
},
},
{
@@ -392,7 +420,7 @@ const DebtSupplierTab = () => {
<>
<div className='w-full p-0 sm:p-4 flex flex-col gap-4'>
<Card
subtitle='Laporan > Kontrol Hutang Supplier'
subtitle='Laporan > Rekapitulasi Hutang ke Supplier'
className={{ wrapper: 'w-full', body: 'p-1!' }}
>
<div className='mb-4 flex justify-end gap-2 [&_button]:px-4'>
+292
View File
@@ -0,0 +1,292 @@
[
{
"supplier": {
"id": 1,
"name": "PT CHAROEN POKPHAND INDONESIA Tbk",
"alias": "CPI",
"category": "SAPRONAK"
},
"initial_balance": -9680000,
"rows": [
{
"pr_number": "PR-TEST-202501-01",
"po_number": "PO-TEST-202501-01",
"po_date": "2025-01-15",
"received_date": "2025-01-15",
"aging": 0,
"area": {
"id": 1,
"name": "Bandung"
},
"warehouse": {
"id": 3,
"name": "Gudang Kandang Bandung 1",
"type": "KANDANG",
"area": {
"id": 1,
"name": "Bandung"
}
},
"due_date": "2025-02-14",
"due_status": "Sudah Jatuh Tempo",
"total_price": 5610000,
"payment_price": 0,
"debt_price": -5610000,
"status": "Belum Lunas",
"travel_number": "-",
"balance": -15290000
},
{
"pr_number": "PR-TEST-202501-02",
"po_number": "PO-TEST-202501-02",
"po_date": "2025-01-15",
"received_date": "2025-01-15",
"aging": 0,
"area": {
"id": 1,
"name": "Bandung"
},
"warehouse": {
"id": 4,
"name": "Gudang Kandang Bandung 2",
"type": "KANDANG",
"area": {
"id": 1,
"name": "Bandung"
}
},
"due_date": "2025-02-14",
"due_status": "Sudah Jatuh Tempo",
"total_price": 5035000,
"payment_price": 0,
"debt_price": -5035000,
"status": "Belum Lunas",
"travel_number": "-",
"balance": -20325000
},
{
"pr_number": "INIT-90001",
"po_number": "SALDO-AWAL",
"po_date": "-",
"received_date": "2026-01-05",
"aging": 0,
"due_date": "-",
"due_status": "-",
"total_price": 0,
"payment_price": -10000000,
"debt_price": -30325000,
"status": "Pembayaran",
"travel_number": "-",
"balance": -30325000
},
{
"pr_number": "PR-LTI-9001",
"po_number": "PO-LTI-9001",
"po_date": "2026-01-10",
"received_date": "2026-01-10",
"aging": 2,
"area": {
"id": 1,
"name": "Bandung"
},
"warehouse": {
"id": 3,
"name": "Gudang Kandang Bandung 1",
"type": "KANDANG",
"area": {
"id": 1,
"name": "Bandung"
}
},
"due_date": "2026-02-09",
"due_status": "Mendekati Jatuh Tempo",
"total_price": 52500000,
"payment_price": 2000000,
"debt_price": -50500000,
"status": "Belum Lunas",
"travel_number": "SJ-9001",
"balance": -82825000
},
{
"pr_number": "PAY-OUT-90001",
"po_number": "PO-LTI-9001",
"po_date": "-",
"received_date": "2026-01-10",
"aging": 0,
"due_date": "-",
"due_status": "-",
"total_price": 0,
"payment_price": 2000000,
"debt_price": -80825000,
"status": "Pembayaran",
"travel_number": "-",
"balance": -80825000
},
{
"pr_number": "PR-LTI-0001",
"po_number": "PO-LTI-0001",
"po_date": "2026-01-10",
"received_date": "2026-01-10",
"aging": 2,
"area": {
"id": 1,
"name": "Bandung"
},
"warehouse": {
"id": 3,
"name": "Gudang Kandang Bandung 1",
"type": "KANDANG",
"area": {
"id": 1,
"name": "Bandung"
}
},
"due_date": "2026-02-09",
"due_status": "Mendekati Jatuh Tempo",
"total_price": 52500000,
"payment_price": 1800000,
"debt_price": -50700000,
"status": "Belum Lunas",
"travel_number": "3232",
"balance": -133325000
},
{
"pr_number": "PAY-OUT-00003",
"po_number": "PO-LTI-0001",
"po_date": "-",
"received_date": "2026-01-10",
"aging": 0,
"due_date": "-",
"due_status": "-",
"total_price": 0,
"payment_price": 2000000,
"debt_price": -131325000,
"status": "Pembayaran",
"travel_number": "-",
"balance": -131325000
},
{
"pr_number": "PAY-OUT-90002",
"po_number": "2323",
"po_date": "-",
"received_date": "2026-01-11",
"aging": 0,
"due_date": "-",
"due_status": "-",
"total_price": 0,
"payment_price": 200000,
"debt_price": -131125000,
"status": "Pembayaran",
"travel_number": "-",
"balance": -131125000
},
{
"pr_number": "PAY-OUT-00002",
"po_number": "2323",
"po_date": "-",
"received_date": "2026-01-11",
"aging": 0,
"due_date": "-",
"due_status": "-",
"total_price": 0,
"payment_price": 200000,
"debt_price": -130925000,
"status": "Pembayaran",
"travel_number": "-",
"balance": -130925000
},
{
"pr_number": "INIT-00001",
"po_number": "PO-LTI-0001",
"po_date": "-",
"received_date": "2026-01-11",
"aging": 0,
"due_date": "-",
"due_status": "-",
"total_price": 0,
"payment_price": -200000,
"debt_price": -131125000,
"status": "Pembayaran",
"travel_number": "-",
"balance": -131125000
},
{
"pr_number": "PR-LTI-9002",
"po_number": "PO-LTI-9002",
"po_date": "2026-01-12",
"received_date": "2026-01-12",
"aging": 0,
"area": {
"id": 1,
"name": "Bandung"
},
"warehouse": {
"id": 3,
"name": "Gudang Kandang Bandung 1",
"type": "KANDANG",
"area": {
"id": 1,
"name": "Bandung"
}
},
"due_date": "2026-02-11",
"due_status": "Mendekati Jatuh Tempo",
"total_price": 30000000,
"payment_price": 5000000,
"debt_price": -25000000,
"status": "Belum Lunas",
"travel_number": "SJ-9002",
"balance": -161125000
},
{
"pr_number": "PAY-OUT-90003",
"po_number": "PO-LTI-9002",
"po_date": "-",
"received_date": "2026-01-12",
"aging": 0,
"due_date": "-",
"due_status": "-",
"total_price": 0,
"payment_price": 5000000,
"debt_price": -156125000,
"status": "Pembayaran",
"travel_number": "-",
"balance": -156125000
},
{
"pr_number": "PR-LTI-0002",
"po_number": "PO-LTI-0002",
"po_date": "2026-01-12",
"received_date": "2026-01-12",
"aging": 0,
"area": {
"id": 1,
"name": "Bandung"
},
"warehouse": {
"id": 4,
"name": "Gudang Kandang Bandung 2",
"type": "KANDANG",
"area": {
"id": 1,
"name": "Bandung"
}
},
"due_date": "2026-02-11",
"due_status": "Mendekati Jatuh Tempo",
"total_price": 45000000,
"payment_price": 0,
"debt_price": -45000000,
"status": "Belum Lunas",
"travel_number": "232",
"balance": -201125000
}
],
"total": {
"aging": 2,
"total_price": 190645000,
"payment_price": 8800000,
"debt_price": -181845000
}
}
]
+29
View File
@@ -0,0 +1,29 @@
/**
* Dummy data for DebtSupplier
* Generated from: debt-supplier.dummy.json
*
* This file is auto-generated. Do not edit manually.
*/
import { DebtSupplier } from '../../types/api/report/debt-supplier';
import { BaseApiResponse } from '@/types/api/api-general';
import dummyData from './debt-supplier.dummy.json';
/**
* Get dummy DebtSupplier data
* @returns Promise with BaseApiResponse containing DebtSupplier
*/
export async function getDummyDebtSupplier(): Promise<
BaseApiResponse<DebtSupplier[]> | undefined
> {
return new Promise((resolve) => {
setTimeout(() => {
resolve({
code: 200,
status: 'success',
message: 'Data retrieved successfully',
data: dummyData as unknown as DebtSupplier[],
});
}, 500);
});
}
+14 -13
View File
@@ -1,19 +1,26 @@
import { BaseMetadata } from '@/types/api/api-general';
import { Area } from '@/types/api/master-data/area';
import { Supplier } from '@/types/api/master-data/supplier';
import { Warehouse } from '@/types/api/master-data/warehouse';
export type DebtSupplier = BaseMetadata & {
export interface DebtSupplier {
supplier: Supplier;
initial_balance: number;
rows: DebtRow[];
total: DebtTotal;
};
}
export type DebtRow = {
export interface DebtTotal {
aging: number;
total_price: number;
payment_price: number;
debt_price: number;
}
export interface DebtRow {
pr_number: string;
po_number: string;
pr_date: string;
po_date: string;
received_date: string;
aging: number;
area: Area;
warehouse: Warehouse;
@@ -24,11 +31,5 @@ export type DebtRow = {
debt_price: number;
status: string;
travel_number: string;
};
export type DebtTotal = {
aging: number;
total_price: number;
payment_price: number;
debt_price: number;
};
balance: number;
}