feat: Tooltip optimiert und Einheiten in System-Übersicht ergänzt

- Tooltip-Werte in beiden Charts (Spannung & Temperatur) auf exakt zwei Nachkommastellen formatiert (z. B. 2.00).
- Einheit °C für Temperaturen und V für Spannungen im Tooltip ergänzt.
- Auch in der Kachel-Übersicht oberhalb der Charts werden die Werte mit Einheiten (V, °C) und zwei Nachkommastellen angezeigt.

pages/system.tsx

@@ -44,7 +44,7 @@ const SystemPage = () => {
 
   const labels = history.map((h) => new Date(h.time).toLocaleTimeString());
 
-  const formatValue = (value: number) => parseFloat(value.toFixed(2));
+  const formatValue = (value: number) => value.toFixed(2);
 
   const voltageDatasets = [
     {
@@ -87,7 +87,7 @@ const SystemPage = () => {
     },
     {
       label: "CPU Temp",
-      data: history.map((h) => h["CPU Temp"]),
+      data: history.map((h) => Number(formatValue(h["CPU Temp"]))),
       borderColor: "rgba(251,191,36,1)",
       backgroundColor: "rgba(251,191,36,0.5)",
       fill: false,
@@ -122,6 +122,17 @@ const SystemPage = () => {
       legend: {
         position: "bottom" as const,
       },
+      tooltip: {
+        callbacks: {
+          label: function (context: any) {
+            const label = context.dataset.label || "";
+            const value =
+              context.parsed.y !== null ? context.parsed.y.toFixed(2) : "";
+            const unit = label.includes("Temp") ? "°C" : "V";
+            return `${label}: ${value} ${unit}`;
+          },
+        },
+      },
     },
   };
 
@@ -132,12 +143,18 @@ const SystemPage = () => {
       </h1>
 
       <div className="grid grid-cols-2 gap-4 mb-8">
-        {Object.entries(voltages).map(([key, value]) => (
-          <div key={key} className="p-4 border rounded shadow">
-            <h2 className="font-semibold">{key}</h2>
-            <p>{formatValue(value)}</p>
-          </div>
-        ))}
+        {Object.entries(voltages).map(([key, value]) => {
+          const formattedValue = formatValue(value);
+          const unit = key.includes("Temp") ? "°C" : "V";
+          return (
+            <div key={key} className="p-4 border rounded shadow">
+              <h2 className="font-semibold">{key}</h2>
+              <p>
+                {formattedValue} {unit}
+              </p>
+            </div>
+          );
+        })}
       </div>
 
       <div className="grid grid-cols-1 xl:grid-cols-2 gap-8">