bakery-admin/bakery-ia
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix UI issues 2

Browse Source
This commit is contained in:
Urtzi Alfaro
2025-12-29 21:52:53 +01:00
parent 02f0c91a15
commit e494ea8635
6 changed files with 395 additions and 219 deletions
Download Patch File Download Diff File Expand all files Collapse all files

85
frontend/src/pages/app/database/sustainability/SustainabilityPage.tsx
View File

@@ -8,7 +8,6 @@ import {
Target,
Droplets,
TreeDeciduous,
Calendar,
Download,
FileText,
Info
@@ -45,34 +44,34 @@ const SustainabilityPage: React.FC = () => {
['WASTE METRICS'],
['Total Waste (kg)', metrics.waste_metrics.total_waste_kg.toFixed(2)],
['Production Waste (kg)', metrics.waste_metrics.production_waste_kg.toFixed(2)],
['Inventory Waste (kg)', metrics.waste_metrics.inventory_waste_kg.toFixed(2)],
['Expired Waste (kg)', metrics.waste_metrics.expired_waste_kg.toFixed(2)],
['Waste Percentage (%)', metrics.waste_metrics.waste_percentage.toFixed(2)],
[],
['SDG 12.3 COMPLIANCE'],
['Status', metrics.sdg_compliance.sdg_12_3.status_label],
['Reduction Achieved (%)', metrics.sdg_compliance.sdg_12_3.reduction_achieved.toFixed(2)],
['Progress to Target (%)', metrics.sdg_compliance.sdg_12_3.progress_to_target.toFixed(2)],
['Target (%)', metrics.sdg_compliance.sdg_12_3.target_percentage],
['Target (%)', metrics.sdg_compliance.sdg_12_3.target_reduction],
[],
['ENVIRONMENTAL IMPACT'],
['CO2 Emissions (kg)', metrics.environmental_impact.co2_emissions.kg.toFixed(2)],
['CO2 Emissions (tons)', metrics.environmental_impact.co2_emissions.tons.toFixed(4)],
['Trees to Offset', metrics.environmental_impact.co2_emissions.trees_to_offset.toFixed(1)],
['Equivalent Car KM', metrics.environmental_impact.co2_emissions.car_km_equivalent.toFixed(0)],
['Equivalent Car KM', metrics.environmental_impact.human_equivalents.car_km_equivalent.toFixed(0)],
['Water Footprint (liters)', metrics.environmental_impact.water_footprint.liters.toFixed(0)],
['Water Footprint (m³)', metrics.environmental_impact.water_footprint.cubic_meters.toFixed(2)],
['Equivalent Showers', metrics.environmental_impact.water_footprint.shower_equivalent.toFixed(0)],
['Equivalent Showers', metrics.environmental_impact.human_equivalents.showers_equivalent.toFixed(0)],
['Land Use (m²)', metrics.environmental_impact.land_use.square_meters.toFixed(2)],
['Land Use (hectares)', metrics.environmental_impact.land_use.hectares.toFixed(4)],
[],
['FINANCIAL IMPACT'],
['Waste Cost (EUR)', metrics.financial_impact.waste_cost_eur.toFixed(2)],
['Potential Monthly Savings (EUR)', metrics.financial_impact.potential_monthly_savings.toFixed(2)],
['ROI on Prevention (%)', metrics.financial_impact.roi_on_waste_prevention.toFixed(2)],
['Annual Projection (EUR)', metrics.financial_impact.annual_projection.toFixed(2)],
[],
['AVOIDED WASTE (AI PREDICTIONS)'],
['Waste Avoided (kg)', metrics.avoided_waste.total_waste_avoided_kg.toFixed(2)],
['Cost Savings (EUR)', metrics.avoided_waste.cost_savings_eur.toFixed(2)],
['Waste Avoided (kg)', metrics.avoided_waste.waste_avoided_kg.toFixed(2)],
['AI Assisted Batches', metrics.avoided_waste.ai_assisted_batches],
['CO2 Avoided (kg)', metrics.avoided_waste.environmental_impact_avoided.co2_kg.toFixed(2)],
['Water Saved (liters)', metrics.avoided_waste.environmental_impact_avoided.water_liters.toFixed(0)],
[],
@@ -214,76 +213,6 @@ const SustainabilityPage: React.FC = () => {
);
}
// Check if we have insufficient data
if (metrics.data_sufficient === false) {
return (
<div className="space-y-6 p-4 sm:p-6">
<PageHeader
title={t('sustainability:page.title', 'Sostenibilidad')}
description={t('sustainability:page.description', 'Seguimiento de impacto ambiental y cumplimiento SDG 12.3')}
/>
<Card className="p-8">
<div className="text-center py-12 max-w-2xl mx-auto">
<div className="mb-6 inline-flex items-center justify-center w-20 h-20 bg-blue-500/10 rounded-full">
<Info className="w-10 h-10 text-blue-600" />
</div>
<h3 className="text-xl font-semibold text-[var(--text-primary)] mb-3">
{t('sustainability:insufficient_data.title', 'Collecting Sustainability Data')}
</h3>
<p className="text-base text-[var(--text-secondary)] mb-6">
{t('sustainability:insufficient_data.description',
'Start producing batches to see your sustainability metrics and SDG compliance status.'
)}
</p>
<div className="bg-[var(--bg-secondary)] rounded-lg p-6 mb-6">
<h4 className="text-sm font-medium text-[var(--text-primary)] mb-3">
{t('sustainability:insufficient_data.requirements_title', 'Minimum Requirements')}
</h4>
<ul className="text-sm text-[var(--text-secondary)] space-y-2 text-left max-w-md mx-auto">
<li className="flex items-start gap-2">
<span className="text-blue-600 mt-0.5">•</span>
<span>
{t('sustainability:insufficient_data.req_production',
'At least 50kg of production over the analysis period'
)}
</span>
</li>
<li className="flex items-start gap-2">
<span className="text-blue-600 mt-0.5">•</span>
<span>
{t('sustainability:insufficient_data.req_baseline',
'90 days of production history for accurate baseline calculation'
)}
</span>
</li>
<li className="flex items-start gap-2">
<span className="text-blue-600 mt-0.5">•</span>
<span>
{t('sustainability:insufficient_data.req_tracking',
'Production batches with waste tracking enabled'
)}
</span>
</li>
</ul>
</div>
<div className="flex items-center justify-center gap-2 text-sm text-[var(--text-tertiary)]">
<Calendar className="w-4 h-4" />
<span>
{t('sustainability:insufficient_data.current_production',
'Current production: {{production}}kg of {{required}}kg minimum',
{
production: metrics.current_production_kg?.toFixed(1) || '0.0',
required: metrics.minimum_production_required_kg || 50
}
)}
</span>
</div>
</div>
</Card>
</div>
);
}
return (
<div className="space-y-6 p-4 sm:p-6">
{/* Page Header */}