new features

frontend/src/pages/FahrzeugDetail.tsx

@@ -526,8 +526,8 @@ const WartungTab: React.FC<WartungTabProps> = ({ fahrzeugId, wartungslog, onAdde
                   <Typography variant="body2" color="text.secondary" sx={{ mt: 0.25 }}>
                     {[
                       entry.km_stand != null && `${entry.km_stand.toLocaleString('de-DE')} km`,
-                      entry.kraftstoff_liter != null && `${entry.kraftstoff_liter.toFixed(1)} L`,
-                      entry.kosten != null && `${entry.kosten.toFixed(2)} €`,
+                      entry.kraftstoff_liter != null && `${Number(entry.kraftstoff_liter).toFixed(1)} L`,
+                      entry.kosten != null && `${Number(entry.kosten).toFixed(2)} €`,
                       entry.externe_werkstatt && entry.externe_werkstatt,
                     ].filter(Boolean).join(' · ')}
                   </Typography>
@@ -818,7 +818,7 @@ const AusruestungTab: React.FC<AusruestungTabProps> = ({ equipment, vehicleId: _
 function FahrzeugDetail() {
   const { id } = useParams<{ id: string }>();
   const navigate = useNavigate();
-  const { isAdmin, canChangeStatus } = usePermissions();
+  const { isAdmin, canChangeStatus, canManageMaintenance } = usePermissions();
   const notification = useNotification();
 
   const [vehicle, setVehicle]     = useState<FahrzeugDetailType | null>(null);
@@ -959,6 +959,8 @@ function FahrzeugDetail() {
             value={activeTab}
             onChange={(_, v) => setActiveTab(v)}
             aria-label="Fahrzeug Detailansicht"
+            variant="scrollable"
+            scrollButtons="auto"
           >
             <Tab label="Übersicht" />
             <Tab
@@ -988,7 +990,7 @@ function FahrzeugDetail() {
             fahrzeugId={vehicle.id}
             wartungslog={vehicle.wartungslog ?? []}
             onAdded={fetchVehicle}
-            canWrite={canChangeStatus}
+            canWrite={canManageMaintenance}
           />
         </TabPanel>