init

2025-09-17 08:26:56 +02:00
parent 3ba44e47c1
commit 7af7ba28a0
23 changed files with 2420 additions and 0 deletions
--- a/src/components/circular_progress.py
+++ b/src/components/circular_progress.py
@@ -0,0 +1,49 @@
+from nicegui import ui
+
+
+class MetricCircle:
+    def __init__(self, title: str, value: str, percentage: float, color: str, icon: str):
+        with ui.card().classes('metric-card p-4 text-center'):
+            with ui.column().classes('items-center gap-2'):
+                # Icon at top
+                ui.icon(icon, size='md', color=color)
+
+                # Title
+                ui.label(title).classes('text-sm text-grey-5 font-medium')
+
+                # Circular progress - simplified
+                ui.circular_progress(
+                    value=percentage,
+                    size='60px',
+                    color=color
+                )
+
+                # Value
+                ui.label(value).classes('text-lg font-bold text-white')
+
+
+class LargeMetricCircle:
+    def __init__(self, title: str, value: str, percentage: float, color: str):
+        with ui.card().classes('metric-card p-6 text-center'):
+            with ui.column().classes('items-center gap-3'):
+                # Title
+                ui.label(title).classes('text-sm text-grey-5 font-medium uppercase tracking-wide')
+
+                # Large circular progress - simplified
+                ui.circular_progress(
+                    value=percentage,
+                    size='120px',
+                    color=color
+                )
+
+                # Value below
+                ui.label(f'{int(percentage * 100)}%').classes('text-2xl font-bold text-white')
+                ui.label(value).classes('text-xs text-grey-5')
+
+
+class ColorfulMetricCard:
+    def __init__(self, title: str, icon: str, color: str):
+        with ui.card().classes(f'p-4 text-center animate-fade-in').style(f'background: linear-gradient(135deg, {color}20 0%, {color}10 100%); border: 1px solid {color}40'):
+            with ui.column().classes('items-center gap-2'):
+                ui.icon(icon, size='xl').style(f'color: {color}')
+                ui.label(title).classes('text-sm font-medium text-white')