refactor(FE): refactor UI Sales Order and Delivery Order

This commit is contained in:
randy-ar
2026-02-02 22:00:42 +07:00
parent a57f65a420
commit 17589cb2b4
15 changed files with 2338 additions and 821 deletions
@@ -6,6 +6,7 @@ import { useMemo, useState } from 'react';
import { formatDate, formatNumber } from '@/lib/helper';
import pdfStyles from '@/components/pages/marketing/pdf/styles/MarketingPDFStyles';
import toast from 'react-hot-toast';
import { useSearchParams } from 'next/navigation';
interface SalesOrderExportProps {
data?: Marketing;
@@ -15,6 +16,9 @@ interface SalesOrderExportProps {
const SalesOrderExport = ({ data }: SalesOrderExportProps) => {
const [isGeneratingPDF, setIsGeneratingPDF] = useState(false);
const salesData = data;
const searchParams = useSearchParams();
const action = searchParams.get('action');
const id = searchParams.get('id');
const handleDownloadPDF = async () => {
if (!salesData) {
@@ -24,24 +28,32 @@ const SalesOrderExport = ({ data }: SalesOrderExportProps) => {
setIsGeneratingPDF(true);
try {
const blob = await pdf(<PDFDocument data={salesData} />).toBlob();
const url = URL.createObjectURL(blob);
const url = window.URL.createObjectURL(blob);
const link = document.createElement('a');
link.style.display = 'none';
link.href = url;
link.download = `${salesData?.so_number || 'sales-order'}.pdf`;
link.setAttribute('target', '_blank');
link.setAttribute('rel', 'noopener noreferrer');
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
URL.revokeObjectURL(url);
// Delay cleanup to ensure download starts
setTimeout(() => {
document.body.removeChild(link);
window.URL.revokeObjectURL(url);
}, 150);
} catch (error) {
toast.error('Failed to generate PDF. Please try again.');
} finally {
setIsGeneratingPDF(false);
window.location.href = `/marketing?action=${action}&id=${id}`;
}
};
if (!salesData) {
return (
<div className='flex items-center justify-center min-h-screen'>
<div className='flex items-start justify-start'>
<div className='text-gray-500'>No sales order data available</div>
</div>
);
@@ -49,12 +61,14 @@ const SalesOrderExport = ({ data }: SalesOrderExportProps) => {
return salesData?.so_number && salesData.so_number !== 'Belum dibuat' ? (
<Button
color='primary'
className='w-fit min-w-32 flex items-center justify-start gap-1 px-2 py-1 text-sm font-mono'
variant='outline'
color='none'
className='w-fit text-sm px-3 py-2.5 rounded-lg border-base-content/10 text-base-content/50'
onClick={handleDownloadPDF}
isLoading={isGeneratingPDF}
type='button'
>
<Icon icon='material-symbols:file-open-outline' width={16} height={16} />
<Icon icon='heroicons:document-text' width={20} height={20} />
{salesData.so_number}
</Button>
) : null;
@@ -71,11 +85,6 @@ const PDFDocument = ({ data }: { data: Marketing }) => {
<Page size='A4' style={pdfStyles.page}>
{/* Header Section */}
<View style={pdfStyles.header}>
<Image
src={'https://placehold.co/120x30/png'}
style={pdfStyles.logo}
id={'mbu-logo'}
/>
<Text style={pdfStyles.companyInfo}>PT LUMBUNG TELUR INDONESIA</Text>
<Text style={pdfStyles.address}>
SOHO Building Lt.3 (Paris Van Java), Jalan Karang Tinggal, Kel.