'use client'; import { Document, Image, Page, StyleSheet, Text, View, } from '@react-pdf/renderer'; import { DailyMarketingReport } from '@/types/api/report/marketing'; import { formatCurrency, formatDate, formatNumber } from '@/lib/helper'; interface DailyMarketingReportPDFProps { data?: DailyMarketingReport; } const DailyMarketingReportPDFStyle = StyleSheet.create({ page: { paddingTop: 24, paddingBottom: 64, paddingHorizontal: 16, // Reduce padding to fit more columns orientation: 'landscape', }, companyInfoHeader: { width: '100%', display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'flex-start', marginBottom: 8, }, companyLogo: { width: 64, height: 'auto', }, companyInfoHeaderDate: { paddingTop: 8, fontSize: 10, }, companyName: { fontSize: 12, fontWeight: 'bold', marginBottom: 4, }, companyAddress: { fontSize: 8, maxWidth: 400, marginBottom: 10, }, title: { marginTop: 16, fontSize: 14, lineHeight: '150%', textAlign: 'center', fontFamily: 'Times-Roman', fontWeight: 'bold', }, footer: { width: '100%', display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', paddingHorizontal: 16, position: 'absolute', fontSize: 8, bottom: 30, left: 0, right: 0, textAlign: 'center', color: 'grey', }, // Table Styles table: { width: '100%', marginTop: 16, borderWidth: 1, borderColor: '#000000', borderBottomWidth: 0, fontSize: 7, // Smaller font for report }, tableRow: { flexDirection: 'row', borderBottomWidth: 1, borderBottomColor: '#000000', alignItems: 'center', minHeight: 20, }, tableHeader: { backgroundColor: '#f0f0f0', fontWeight: 'bold', }, // Columns definition (Total 100%) colNo: { width: '3%', padding: 2, textAlign: 'center', borderRightWidth: 1, borderRightColor: '#000000', }, colSoDate: { width: '6%', padding: 2, textAlign: 'left', borderRightWidth: 1, borderRightColor: '#000000', }, colDoDate: { width: '6%', padding: 2, textAlign: 'left', borderRightWidth: 1, borderRightColor: '#000000', }, colAging: { width: '3%', padding: 2, textAlign: 'center', borderRightWidth: 1, borderRightColor: '#000000', }, colWarehouse: { width: '7%', padding: 2, textAlign: 'left', borderRightWidth: 1, borderRightColor: '#000000', }, colCustomer: { width: '9%', padding: 2, textAlign: 'left', borderRightWidth: 1, borderRightColor: '#000000', }, // Reduced slightly colSales: { width: '6%', padding: 2, textAlign: 'left', borderRightWidth: 1, borderRightColor: '#000000', }, colProduct: { width: '8%', padding: 2, textAlign: 'left', borderRightWidth: 1, borderRightColor: '#000000', }, // Reduced slightly colDoNumber: { width: '7%', padding: 2, textAlign: 'left', borderRightWidth: 1, borderRightColor: '#000000', }, colVehicle: { width: '5%', padding: 2, textAlign: 'left', borderRightWidth: 1, borderRightColor: '#000000', }, colMarketingType: { width: '5%', padding: 2, textAlign: 'left', borderRightWidth: 1, borderRightColor: '#000000', }, colQty: { width: '4%', padding: 2, textAlign: 'right', borderRightWidth: 1, borderRightColor: '#000000', }, colAvgWeight: { width: '4%', padding: 2, textAlign: 'right', borderRightWidth: 1, borderRightColor: '#000000', }, colTotalWeight: { width: '5%', padding: 2, textAlign: 'right', borderRightWidth: 1, borderRightColor: '#000000', }, colSalesPrice: { width: '5%', padding: 2, textAlign: 'right', borderRightWidth: 1, borderRightColor: '#000000', }, colHppPrice: { width: '5%', padding: 2, textAlign: 'right', borderRightWidth: 1, borderRightColor: '#000000', }, colSalesAmount: { width: '6%', padding: 2, textAlign: 'right', borderRightWidth: 1, borderRightColor: '#000000', }, colHppAmount: { width: '6%', padding: 2, textAlign: 'right' }, // Last column // Text inside columns cellText: { fontSize: 6, }, headerText: { fontSize: 7, fontWeight: 'bold', textAlign: 'center', }, // Utils doubleDivider: { width: '100%', height: 6, borderTop: '2px solid black', borderBottom: '2px solid black', }, // Summary summaryContainer: { marginTop: 12, flexDirection: 'row', justifyContent: 'flex-end', width: '100%', }, summaryTable: { width: '30%', borderWidth: 1, borderColor: '#000000', fontSize: 8, }, summaryRow: { flexDirection: 'row', padding: 2, borderBottomWidth: 1, borderBottomColor: '#eee', }, summaryLabel: { width: '50%', fontWeight: 'bold', }, summaryValue: { width: '50%', textAlign: 'right', }, }); const DailyMarketingReportPDF = ({ data }: DailyMarketingReportPDFProps) => { const rows = data?.rows || []; const summary = data?.summary; return ( {formatDate(Date.now(), 'DD MMMM YYYY')} PT LUMBUNG TELUR INDONESIA SOHO Building Lt.3 (Paris Van Java), Jalan Karang Tinggal, Kel. Cipedes, Kec. Sukajadi, Kota Bandung 40162 Laporan Penjualan Harian {/* Data Table */} {/* Header */} No Tgl SO Tgl DO Aging Gudang Pelanggan Sales Produk No DO Plat No Tipe Qty Rerata Berat Hrg Jual HPP/kg Total Jual Total HPP {/* Rows */} {rows.map((row, index) => ( {index + 1} {formatDate(row.so_date, 'DD/MM/YYYY')} {formatDate(row.do_date, 'DD/MM/YYYY')} {row.aging_days} {row.warehouse?.name} {row.customer?.name} {row.sales} {row.product?.name} {row.do_number} {row.vehicle_number} {row.marketing_type} {formatNumber(row.qty)} {formatNumber(row.average_weight_kg)} {formatNumber(row.total_weight_kg)} {formatCurrency(row.sales_price_per_kg)} {formatCurrency(row.hpp_price_per_kg)} {formatCurrency(row.sales_amount)} {formatCurrency(row.hpp_amount)} ))} {/* Summary */} Total Qty: {formatNumber(summary?.total_qty ?? 0)} Total Berat (kg): {formatNumber(summary?.total_weight_kg ?? 0)} Total Penjualan: {formatCurrency(summary?.total_sales_amount ?? 0)} Total HPP: {formatCurrency(summary?.total_hpp_amount ?? 0)} `${pageNumber} / ${totalPages}` } fixed /> ); }; export default DailyMarketingReportPDF;