Use billable time for Teamspace comparisons

frontend/src/views/TicketDetailPage.tsx

@@ -206,22 +206,32 @@ export function TicketDetailPage({ periodType, period, ticketId, onNavigate }: T
   const savedDayBillingInput = (day: string) => formatHoursInput(dayBillingMap.get(day));
   const isDayBillingDirty = (day: string) => (dayBillingInputs[day] ?? "") !== savedDayBillingInput(day);
   const sessionGroups = useMemo(() => {
-    const groups = new Map<string, { key: string; label: string; totalMinutes: number; sessions: SessionEntry[] }>();
+    const groups = new Map<
+      string,
+      { key: string; label: string; totalMinutes: number; nonBillableMinutes: number; openMinutes: number; sessions: SessionEntry[] }
+    >();
 
     for (const session of data?.sessions ?? []) {
       const key = sessionDayKey(session.started_at);
       const group = groups.get(key);
+      const billedMinutes = session.billing_status === "billed" ? session.rounded_minutes : 0;
+      const nonBillableMinutes = session.billing_status === "non_billable" ? session.rounded_minutes : 0;
+      const openMinutes = session.billing_status === null ? session.rounded_minutes : 0;
 
       if (group) {
         group.sessions.push(session);
-        group.totalMinutes += session.rounded_minutes;
+        group.totalMinutes += billedMinutes;
+        group.nonBillableMinutes += nonBillableMinutes;
+        group.openMinutes += openMinutes;
         continue;
       }
 
       groups.set(key, {
         key,
         label: formatDate(session.started_at),
-        totalMinutes: session.rounded_minutes,
+        totalMinutes: billedMinutes,
+        nonBillableMinutes,
+        openMinutes,
         sessions: [session]
       });
     }
@@ -551,7 +561,7 @@ export function TicketDetailPage({ periodType, period, ticketId, onNavigate }: T
           </div>
           <div className="flex flex-wrap items-center gap-2">
             <div className="flex items-center gap-2 rounded-md border bg-muted/30 px-3 py-2 text-sm">
-              <span className="text-muted-foreground">{periodLabel} gesamt</span>
+              <span className="text-muted-foreground">{periodLabel} abgerechnet</span>
               <span className="font-semibold">{formatMinutes(periodTotalMinutes)}</span>
             </div>
             <div className="flex items-center gap-2 rounded-md border bg-muted/30 px-3 py-2 text-sm">
@@ -568,7 +578,9 @@ export function TicketDetailPage({ periodType, period, ticketId, onNavigate }: T
                 <div className="flex flex-col gap-2 border-b bg-muted/40 px-3 py-2 sm:flex-row sm:items-center sm:justify-between">
                   <p className="font-medium">{group.label}</p>
                   <div className="flex flex-wrap items-center gap-2">
-                    <Badge variant="outline">Tag gesamt {formatMinutes(group.totalMinutes)}</Badge>
+                    <Badge variant="outline">Tag abgerechnet {formatMinutes(group.totalMinutes)}</Badge>
+                    {group.nonBillableMinutes > 0 ? <Badge variant="secondary">Nicht {formatMinutes(group.nonBillableMinutes)}</Badge> : null}
+                    {group.openMinutes > 0 ? <Badge variant="warning">Offen {formatMinutes(group.openMinutes)}</Badge> : null}
                     <div className="flex items-center gap-2 text-xs text-muted-foreground">
                       <label htmlFor={`crm-billing-${group.key}`}>Teamspace</label>
                       <Input