feat: FASE 6.5 - Report PDF (WeasyPrint + Kaleido)
Add PDF report generation for Metrologist dashboard with SPC and measurement reports including SVG charts, capability indices, and company logo embedding. New files: - server/services/report_service.py (Jinja2 + Plotly/Kaleido + WeasyPrint) - server/routers/reports.py (2 GET endpoints with auth) - server/templates/reports/ (base, spc, measurement HTML templates) Modified: - server/main.py (register reports router) - client dashboard (download buttons + proxy routes) - i18n strings IT/EN Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,190 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<style>
|
||||
@page {
|
||||
size: A4;
|
||||
margin: 2cm 1.5cm;
|
||||
@bottom-center {
|
||||
content: "Page " counter(page) " / " counter(pages);
|
||||
font-family: 'Inter', sans-serif;
|
||||
font-size: 8pt;
|
||||
color: #64748B;
|
||||
}
|
||||
}
|
||||
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
|
||||
body {
|
||||
font-family: 'Inter', 'Helvetica Neue', Arial, sans-serif;
|
||||
font-size: 10pt;
|
||||
color: #1e293b;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.mono { font-family: 'JetBrains Mono', 'Courier New', monospace; }
|
||||
|
||||
/* Header */
|
||||
.report-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 3px solid #2563EB;
|
||||
padding-bottom: 12px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.report-header .logo-area {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
}
|
||||
.report-header .logo-area img {
|
||||
max-height: 50px;
|
||||
max-width: 120px;
|
||||
}
|
||||
.report-header .company-name {
|
||||
font-size: 14pt;
|
||||
font-weight: 700;
|
||||
color: #2563EB;
|
||||
}
|
||||
.report-header .report-title {
|
||||
font-size: 11pt;
|
||||
font-weight: 600;
|
||||
color: #64748B;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* Footer */
|
||||
.report-footer {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
text-align: center;
|
||||
font-size: 7pt;
|
||||
color: #94a3b8;
|
||||
padding-top: 8px;
|
||||
border-top: 1px solid #e2e8f0;
|
||||
}
|
||||
|
||||
/* Section */
|
||||
.section { margin-bottom: 16px; }
|
||||
.section-title {
|
||||
font-size: 11pt;
|
||||
font-weight: 700;
|
||||
color: #2563EB;
|
||||
border-bottom: 1px solid #e2e8f0;
|
||||
padding-bottom: 4px;
|
||||
margin-bottom: 10px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
/* Tables */
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
font-size: 9pt;
|
||||
}
|
||||
th {
|
||||
background-color: #2563EB;
|
||||
color: white;
|
||||
font-weight: 600;
|
||||
text-align: left;
|
||||
padding: 6px 8px;
|
||||
}
|
||||
td {
|
||||
padding: 5px 8px;
|
||||
border-bottom: 1px solid #e2e8f0;
|
||||
}
|
||||
tr:nth-child(even) td { background-color: #f8fafc; }
|
||||
|
||||
/* Badge colors */
|
||||
.pass { color: #059669; font-weight: 600; }
|
||||
.warning { color: #d97706; font-weight: 600; }
|
||||
.fail { color: #dc2626; font-weight: 600; }
|
||||
|
||||
.pass-bg { background-color: #ecfdf5; }
|
||||
.warning-bg { background-color: #fffbeb; }
|
||||
.fail-bg { background-color: #fef2f2; }
|
||||
|
||||
/* Capability colors */
|
||||
.cap-good { color: #059669; }
|
||||
.cap-marginal { color: #d97706; }
|
||||
.cap-poor { color: #dc2626; }
|
||||
|
||||
/* Filters info box */
|
||||
.info-box {
|
||||
background-color: #f1f5f9;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 4px;
|
||||
padding: 8px 12px;
|
||||
margin-bottom: 12px;
|
||||
font-size: 9pt;
|
||||
}
|
||||
.info-box .label { font-weight: 600; color: #64748B; }
|
||||
|
||||
/* Chart container */
|
||||
.chart-container {
|
||||
text-align: center;
|
||||
margin: 10px 0;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
.chart-container svg {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/* Summary cards */
|
||||
.summary-grid {
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.summary-card {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #e2e8f0;
|
||||
}
|
||||
.summary-card .number {
|
||||
font-size: 18pt;
|
||||
font-weight: 700;
|
||||
font-family: 'JetBrains Mono', monospace;
|
||||
}
|
||||
.summary-card .label {
|
||||
font-size: 8pt;
|
||||
color: #64748B;
|
||||
text-transform: uppercase;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
/* Page break */
|
||||
.page-break { page-break-before: always; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Header -->
|
||||
<div class="report-header">
|
||||
<div class="logo-area">
|
||||
{% if company.logo_base64 %}
|
||||
<img src="{{ company.logo_base64 }}" alt="Logo">
|
||||
{% endif %}
|
||||
<span class="company-name">{{ company.company_name }}</span>
|
||||
</div>
|
||||
<div class="report-title">
|
||||
{% block report_title %}Report{% endblock %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
{% block content %}{% endblock %}
|
||||
|
||||
<!-- Footer -->
|
||||
<div class="report-footer">
|
||||
Generated {{ generated_at.strftime('%Y-%m-%d %H:%M') }} — Powered by TieMeasureFlow
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user