Deploy Inicial do SteelCheck com Docker Build Automatizado

This commit is contained in:
2026-06-23 00:28:34 +00:00
parent e82656e5c2
commit c70f578009
2 changed files with 36 additions and 27 deletions
+27 -27
View File
@@ -9,12 +9,12 @@ const statusClass = (status: 'OK' | 'FALHA' | 'CONFORME' | 'NÃO CONFORME') => {
switch (status) { switch (status) {
case 'OK': case 'OK':
case 'CONFORME': case 'CONFORME':
return 'text-emerald-600 bg-emerald-50 dark:bg-emerald-900/30 dark:text-emerald-400 border border-emerald-200 dark:border-emerald-800'; return 'text-emerald-700 bg-emerald-50 dark:bg-emerald-900/30 dark:text-emerald-400';
case 'FALHA': case 'FALHA':
case 'NÃO CONFORME': case 'NÃO CONFORME':
return 'text-red-600 bg-red-50 dark:bg-red-900/30 dark:text-red-400 border border-red-200 dark:border-red-800'; return 'text-rose-700 bg-rose-50 dark:bg-rose-900/30 dark:text-rose-400';
default: default:
return 'text-slate-600 bg-slate-50 dark:bg-slate-800/50 dark:text-slate-400 border border-slate-200 dark:border-slate-700'; return 'text-slate-600 bg-slate-50 dark:bg-slate-800/50 dark:text-slate-400';
} }
}; };
@@ -123,15 +123,15 @@ export const ReportDisplay: React.FC<ReportDisplayProps> = ({ report }) => {
<span className="w-1.5 h-1.5 bg-slate-400 dark:bg-slate-500 rounded-full"></span> <span className="w-1.5 h-1.5 bg-slate-400 dark:bg-slate-500 rounded-full"></span>
2. Propriedades Mecânicas 2. Propriedades Mecânicas
</h3> </h3>
<div className="flex-grow border border-slate-100 dark:border-slate-800 rounded-xl overflow-hidden bg-white dark:bg-slate-900 shadow-sm flex flex-col justify-between"> <div className="flex-grow border border-slate-100 dark:border-slate-800/60 rounded-2xl overflow-hidden bg-white dark:bg-slate-900 shadow-[0_2px_10px_-3px_rgba(6,81,237,0.05)] flex flex-col justify-between">
<div className="overflow-hidden"> <div className="overflow-hidden">
<table className="w-full table-fixed text-left border-collapse text-xs"> <table className="w-full table-fixed text-left border-collapse text-xs">
<thead> <thead>
<tr className="bg-slate-50 dark:bg-slate-800/50 border-b border-slate-100 dark:border-slate-800 text-[9px] text-slate-400 dark:text-slate-500 font-bold uppercase tracking-wider"> <tr className="bg-slate-50/80 dark:bg-slate-800/40 border-b border-slate-50 dark:border-slate-800/60 text-[9px] text-slate-500 dark:text-slate-400 font-bold uppercase tracking-wider">
<th className="py-2.5 px-2 w-[35%] truncate">Propriedade</th> <th className="py-3 px-3 w-[35%] truncate">Propriedade</th>
<th className="py-2.5 px-1 w-[25%] truncate">Certif.</th> <th className="py-3 px-1 w-[25%] truncate">Certificado</th>
<th className="py-2.5 px-1 w-[15%] text-center truncate">% Rel.</th> <th className="py-3 px-1 w-[15%] text-center truncate">% Rel.</th>
<th className="py-2.5 px-1 w-[25%] text-right truncate">Status</th> <th className="py-3 px-3 w-[25%] text-right truncate">Status</th>
</tr> </tr>
</thead> </thead>
<tbody className="divide-y divide-slate-50 dark:divide-slate-800/50"> <tbody className="divide-y divide-slate-50 dark:divide-slate-800/50">
@@ -140,17 +140,17 @@ export const ReportDisplay: React.FC<ReportDisplayProps> = ({ report }) => {
const diffColor = isPositive ? 'text-emerald-600 dark:text-emerald-400' : 'text-rose-600 dark:text-rose-400'; const diffColor = isPositive ? 'text-emerald-600 dark:text-emerald-400' : 'text-rose-600 dark:text-rose-400';
return ( return (
<tr key={i}> <tr key={i}>
<td className="py-2.5 px-2 truncate"> <td className="py-3 px-3 truncate">
<span className="font-medium text-[10px] block text-slate-800 dark:text-slate-200" title={item.property}>{item.property}</span> <span className="font-semibold text-[11px] block text-slate-700 dark:text-slate-300" title={item.property}>{item.property}</span>
</td> </td>
<td className="py-2.5 px-1 font-mono font-bold text-[10px] text-slate-700 dark:text-slate-300 truncate" title={item.certificate}>{item.certificate}</td> <td className="py-3 px-1 font-mono font-bold text-[11px] text-slate-900 dark:text-slate-100 truncate" title={item.certificate}>{item.certificate}</td>
<td className="py-2.5 px-1 text-center truncate"> <td className="py-3 px-1 text-center truncate">
{item.differencePercentage ? ( {item.differencePercentage ? (
<span className={`text-[9px] font-bold ${diffColor}`}>{item.differencePercentage}</span> <span className={`text-[10px] font-bold ${diffColor}`}>{item.differencePercentage}</span>
) : <span className="text-slate-300 dark:text-slate-600">-</span>} ) : <span className="text-slate-300 dark:text-slate-600">-</span>}
</td> </td>
<td className="py-2.5 px-1 text-right"> <td className="py-3 px-3 text-right">
<span className={`inline-flex items-center gap-1 text-[9px] font-bold px-1.5 py-0.5 rounded ${statusClass(item.status)}`}> <span className={`inline-flex items-center gap-1 text-[10px] font-bold px-2 py-1 rounded-md ${statusClass(item.status)}`}>
{statusIcon(item.status)} {item.status} {statusIcon(item.status)} {item.status}
</span> </span>
</td> </td>
@@ -177,25 +177,25 @@ export const ReportDisplay: React.FC<ReportDisplayProps> = ({ report }) => {
<span className="w-1.5 h-1.5 bg-slate-400 dark:bg-slate-500 rounded-full"></span> <span className="w-1.5 h-1.5 bg-slate-400 dark:bg-slate-500 rounded-full"></span>
3. Composição Química (%) 3. Composição Química (%)
</h3> </h3>
<div className="flex-grow border border-slate-100 dark:border-slate-800 rounded-xl overflow-hidden bg-white dark:bg-slate-900 shadow-sm flex flex-col justify-start"> <div className="flex-grow border border-slate-100 dark:border-slate-800/60 rounded-2xl overflow-hidden bg-white dark:bg-slate-900 shadow-[0_2px_10px_-3px_rgba(6,81,237,0.05)] flex flex-col justify-start">
<div className="overflow-hidden"> <div className="overflow-hidden">
<table className="w-full table-fixed text-left border-collapse text-xs"> <table className="w-full table-fixed text-left border-collapse text-xs">
<thead> <thead>
<tr className="bg-slate-50 dark:bg-slate-800/50 border-b border-slate-100 dark:border-slate-800 text-[9px] text-slate-400 dark:text-slate-500 font-bold uppercase tracking-wider"> <tr className="bg-slate-50/80 dark:bg-slate-800/40 border-b border-slate-50 dark:border-slate-800/60 text-[9px] text-slate-500 dark:text-slate-400 font-bold uppercase tracking-wider">
<th className="py-2 px-2 w-[15%] truncate">Elem.</th> <th className="py-3 px-3 w-[15%] truncate">Elem.</th>
<th className="py-2 px-1 w-[40%] truncate">Norma Referência</th> <th className="py-3 px-1 w-[40%] truncate">Norma de Referência</th>
<th className="py-2 px-1 w-[25%] truncate">Certificado</th> <th className="py-3 px-1 w-[25%] truncate">Valor Certificado</th>
<th className="py-2 px-1 w-[20%] text-right truncate">Status</th> <th className="py-3 px-3 w-[20%] text-right truncate">Status</th>
</tr> </tr>
</thead> </thead>
<tbody className="divide-y divide-slate-50 dark:divide-slate-800/50 font-mono"> <tbody className="divide-y divide-slate-50 dark:divide-slate-800/50 font-mono">
{compliance.chemical.map((item, i) => ( {compliance.chemical.map((item, i) => (
<tr key={i}> <tr key={i}>
<td className="py-2 px-2 font-sans font-medium text-[10px] text-slate-800 dark:text-slate-200 truncate" title={item.element}>{item.element}</td> <td className="py-3 px-3 font-sans font-semibold text-[11px] text-slate-700 dark:text-slate-300 truncate" title={item.element}>{item.element}</td>
<td className="py-2 px-1 text-slate-400 dark:text-slate-500 text-[9px] leading-tight truncate" title={item.norm}>{item.norm}</td> <td className="py-3 px-1 text-slate-500 dark:text-slate-400 text-[10px] leading-tight truncate" title={item.norm}>{item.norm}</td>
<td className="py-2 px-1 font-bold text-[10px] text-slate-700 dark:text-slate-300 truncate" title={item.certificate}>{item.certificate}</td> <td className="py-3 px-1 font-bold text-[11px] text-slate-900 dark:text-slate-100 truncate" title={item.certificate}>{item.certificate}</td>
<td className="py-2 px-1 text-right"> <td className="py-3 px-3 text-right">
<span className={`inline-flex items-center text-[9px] font-bold px-1.5 py-0.5 rounded ${statusClass(item.status)}`}> <span className={`inline-flex items-center text-[10px] font-bold px-2 py-1 rounded-md ${statusClass(item.status)}`}>
{item.status} {item.status}
</span> </span>
</td> </td>
+9
View File
@@ -16,6 +16,11 @@ export const exportAsPdf = async (elementId: string, fileName: string, action: '
} }
try { try {
const isDark = document.documentElement.classList.contains('dark');
if (isDark) {
document.documentElement.classList.remove('dark');
}
const pdf = new jsPDF({ const pdf = new jsPDF({
orientation: 'portrait', orientation: 'portrait',
unit: 'mm', unit: 'mm',
@@ -44,6 +49,10 @@ export const exportAsPdf = async (elementId: string, fileName: string, action: '
pdf.addImage(imgData, 'JPEG', 0, 0, pdfWidth, pdfHeight); pdf.addImage(imgData, 'JPEG', 0, 0, pdfWidth, pdfHeight);
} }
if (isDark) {
document.documentElement.classList.add('dark');
}
if (action === 'download') { if (action === 'download') {
pdf.save(`${fileName}.pdf`); pdf.save(`${fileName}.pdf`);
} else { } else {