fix: return error details in import response for debugging

Problem: Errors during import were logged but not visible to user.

Changes:
- Backend: Collect error messages and return in response (first 10 errors)
- Frontend: Display error details in import result box
- UI: Red background when errors > 0, shows detailed error messages

Now users can see exactly which rows failed and why.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

backend/routers/vitals_baseline.py

@@ -307,6 +307,7 @@ async def import_apple_health_baseline(
     updated = 0
     skipped = 0
     errors = 0
+    error_details = []  # Collect error messages
 
     with get_db() as conn:
         cur = get_cursor(conn)
@@ -378,14 +379,15 @@ async def import_apple_health_baseline(
 
             except Exception as e:
                 import traceback
-                error_detail = f"Row error: {str(e)}\nTraceback: {traceback.format_exc()}"
-                logger.error(error_detail)
-                print(error_detail)  # Force output to Docker logs
+                error_msg = f"Row {date if 'date' in locals() else 'unknown'}: {str(e)}"
+                error_details.append(error_msg)
+                logger.error(f"{error_msg}\n{traceback.format_exc()}")
                 errors += 1
 
     return {
         "inserted": inserted,
         "updated": updated,
         "skipped": skipped,
-        "errors": errors
+        "errors": errors,
+        "error_details": error_details[:10]  # Return first 10 errors
     }

frontend/src/pages/VitalsPage.jsx

@@ -947,10 +947,18 @@ function ImportTab({ onImportComplete }) {
       {error && <div style={{ padding: 10, background: '#FCEBEB', border: '1px solid #D85A30', borderRadius: 8, fontSize: 13, color: '#D85A30', marginBottom: 12 }}>{error}</div>}
 
       {result && (
-        <div style={{ padding: 12, background: '#E8F7F0', border: '1px solid #1D9E75', borderRadius: 8, fontSize: 13, color: '#085041', marginBottom: 12 }}>
-          <strong>Import erfolgreich ({result.type === 'omron' ? 'Omron' : 'Apple Health'}):</strong><br />
+        <div style={{ padding: 12, background: result.errors > 0 ? '#FCEBEB' : '#E8F7F0', border: `1px solid ${result.errors > 0 ? '#D85A30' : '#1D9E75'}`, borderRadius: 8, fontSize: 13, color: result.errors > 0 ? '#D85A30' : '#085041', marginBottom: 12 }}>
+          <strong>Import {result.errors > 0 ? 'mit Fehlern' : 'erfolgreich'} ({result.type === 'omron' ? 'Omron' : 'Apple Health'}):</strong><br />
           {result.inserted} neu · {result.updated} aktualisiert · {result.skipped} übersprungen
           {result.errors > 0 && <> · {result.errors} Fehler</>}
+          {result.error_details && result.error_details.length > 0 && (
+            <div style={{ marginTop: 8, padding: 8, background: 'rgba(0,0,0,0.05)', borderRadius: 4, fontSize: 12, fontFamily: 'monospace' }}>
+              <strong>Fehler-Details:</strong>
+              {result.error_details.map((err, i) => (
+                <div key={i} style={{ marginTop: 4 }}>• {err}</div>
+              ))}
+            </div>
+          )}
         </div>
       )}