feat: replace html2canvas with native high-quality browser printing
This commit is contained in:
@@ -120,18 +120,17 @@ const App: React.FC = () => {
|
||||
}, [handleReset]);
|
||||
|
||||
const handleExport = (action: 'preview' | 'download') => {
|
||||
if (reportsData && reportsData.length > 0) {
|
||||
const fileName = `Relatorio_SteelCheck_${reportsData[0].identification.certificateNumber || 'analise'}`;
|
||||
exportAsPdf('printable-report-container', fileName, action);
|
||||
}
|
||||
// Both actions now use native high-quality browser printing/PDF saving
|
||||
window.print();
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="min-h-screen">
|
||||
{isLoading && <Loader />}
|
||||
<Header onReset={handleReset} onClearKey={handleClearKey} hasKey={hasKey} provider={provider} />
|
||||
<div className="min-h-screen print:bg-white print:m-0 print:p-0">
|
||||
<div className="print:hidden">
|
||||
{isLoading && <Loader />}
|
||||
<Header onReset={handleReset} onClearKey={handleClearKey} hasKey={hasKey} provider={provider} />
|
||||
|
||||
<main className="container mx-auto p-4 sm:p-6 md:p-8 max-w-7xl">
|
||||
<main className="container mx-auto p-4 sm:p-6 md:p-8 max-w-7xl">
|
||||
{!hasKey ? (
|
||||
<ApiKeySetup onKeySave={handleKeySave} />
|
||||
) : !reportsData ? (
|
||||
@@ -199,9 +198,10 @@ const App: React.FC = () => {
|
||||
</div>
|
||||
)}
|
||||
</main>
|
||||
</div>
|
||||
|
||||
{reportsData && (
|
||||
<div className="absolute -left-[9999px] top-0 opacity-0" aria-hidden="true">
|
||||
<div className="hidden print:block print:w-[210mm] print:mx-auto" aria-hidden="true">
|
||||
<PrintableReport reports={reportsData} />
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -15,7 +15,7 @@ export const PrintableReport: React.FC<PrintableReportProps> = ({ reports }) =>
|
||||
style={{ width: '210mm', background: 'white' }}
|
||||
>
|
||||
{reports.map((report, idx) => (
|
||||
<div key={idx} className="report-page pdf-export bg-white" style={{ minHeight: '297mm' }}>
|
||||
<div key={idx} className="report-page bg-white" style={{ minHeight: '297mm' }}>
|
||||
<ReportDisplay report={report} />
|
||||
</div>
|
||||
))}
|
||||
|
||||
@@ -30,21 +30,38 @@
|
||||
animation: fade-in 0.5s ease-out forwards;
|
||||
}
|
||||
|
||||
/* Force black text for PDF generation */
|
||||
.pdf-export .text-slate-400,
|
||||
.pdf-export .text-slate-500,
|
||||
.pdf-export .text-slate-600,
|
||||
.pdf-export .text-slate-700,
|
||||
.pdf-export .text-slate-800,
|
||||
.pdf-export .text-slate-900,
|
||||
.pdf-export .text-slate-300,
|
||||
.pdf-export .text-slate-200 {
|
||||
color: #000000 !important;
|
||||
}
|
||||
/* High-quality native browser printing */
|
||||
@media print {
|
||||
* {
|
||||
-webkit-print-color-adjust: exact !important;
|
||||
print-color-adjust: exact !important;
|
||||
}
|
||||
|
||||
@page {
|
||||
margin: 0;
|
||||
size: A4;
|
||||
}
|
||||
|
||||
/* Also ensure borders are clearly visible */
|
||||
.pdf-export .border-slate-100,
|
||||
.pdf-export .border-slate-200,
|
||||
.pdf-export .border-slate-50 {
|
||||
border-color: #cbd5e1 !important; /* slate-300 */
|
||||
body {
|
||||
background: white !important;
|
||||
}
|
||||
|
||||
/* Force black text for PDF generation */
|
||||
.report-page .text-slate-400,
|
||||
.report-page .text-slate-500,
|
||||
.report-page .text-slate-600,
|
||||
.report-page .text-slate-700,
|
||||
.report-page .text-slate-800,
|
||||
.report-page .text-slate-900,
|
||||
.report-page .text-slate-300,
|
||||
.report-page .text-slate-200 {
|
||||
color: #000000 !important;
|
||||
}
|
||||
|
||||
/* Also ensure borders are clearly visible */
|
||||
.report-page .border-slate-100,
|
||||
.report-page .border-slate-200,
|
||||
.report-page .border-slate-50 {
|
||||
border-color: #cbd5e1 !important; /* slate-300 */
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user