From f89ecec8ff4942389125477e09284c44379f1470 Mon Sep 17 00:00:00 2001
From: Claude <claude@webklar.local>
Date: Wed, 7 Oct 2026 14:45:56 +0000
Subject: [PATCH] =?UTF-8?q?Arbeitsbl=C3=A4tter:=20Abzeichen=20=E2=80=9Eabg?=
 =?UTF-8?q?erechnet=20(Rechnungsnummer)=E2=80=9C=20f=C3=BCr=20alle,=20Warn?=
 =?UTF-8?q?ung=20beim=20=C3=84ndern=20der=20Zeit?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
---
 src/components/WorksheetList.jsx       | 17 +++++++++++++++++
 src/components/WorksheetTimesModal.jsx | 10 ++++++++++
 src/hooks/useAbgerechnet.js            | 21 +++++++++++++++++++++
 3 files changed, 48 insertions(+)
 create mode 100644 src/hooks/useAbgerechnet.js

diff --git a/src/components/WorksheetList.jsx b/src/components/WorksheetList.jsx
index b9daa22..a4a9c8f 100644
--- a/src/components/WorksheetList.jsx
+++ b/src/components/WorksheetList.jsx
@@ -1,6 +1,8 @@
 import { EmptyState } from './ui'
 import { needsTimeEntry, isGitWorksheet } from '../lib/ticketForm'
 import { parseSupporters } from '../lib/support'
+import { useAbgerechnet } from '../hooks/useAbgerechnet'
+import { abgerechnetText, ticketIdsOf } from '../lib/projektkontoView'
 import {
   showAboToggle,
   statusAfterLabel,
@@ -23,6 +25,8 @@ export default function WorksheetList({
   onOwnSupport,
   currentUserId,
 }) {
+  // Hooks laufen immer, auch bei den frühen Rückgaben unten; die Abzeichen sehen alle Mitarbeiter und zeigen nie Beträge
+  const abgerechnet = useAbgerechnet(ticketIdsOf(worksheets))
   if (loading) return <div className="loading">Wird geladen …</div>
 
   if (!worksheets || worksheets.length === 0) {
@@ -35,6 +39,7 @@ export default function WorksheetList({
         const when = worksheetWhen(ws)
         const kind = worksheetKindLabel(ws)
         const badge = worksheetBadge(ws)
+        const billed = abgerechnetText(abgerechnet, ws.$id)
         const lines = supportLines(ws)
         const status = statusAfterLabel(ws)
         const time = timeLabel(ws)
@@ -58,6 +63,18 @@ export default function WorksheetList({
                 {kind && <span className="muted">{kind}</span>}
                 <span className="faint xs num">WSID {ws.wsid}</span>
                 {badge && <span className={`badge ${badge.tone}`}>{badge.text}</span>}
+                {billed && (
+                  <span
+                    className="badge blue"
+                    title={
+                      billed === 'abgerechnet (Entwurf)'
+                        ? 'Dieses Arbeitsblatt steht in einem Rechnungsentwurf.'
+                        : 'Dieses Arbeitsblatt ist auf einer Rechnung abgerechnet.'
+                    }
+                  >
+                    {billed}
+                  </span>
+                )}
                 {showAbo ? (
                   <button
                     type="button"
diff --git a/src/components/WorksheetTimesModal.jsx b/src/components/WorksheetTimesModal.jsx
index a6a4415..41be96b 100644
--- a/src/components/WorksheetTimesModal.jsx
+++ b/src/components/WorksheetTimesModal.jsx
@@ -5,6 +5,8 @@ import { Button, DateTimeInput, Dialog, DurationSelect, Field } from './ui'
 import { roundUpToStep, isValidStep } from '../lib/timeSteps'
 import { parseSupporters, validateSupporters } from '../lib/support'
 import SupportersEditor from './SupportersEditor'
+import { useAbgerechnet } from '../hooks/useAbgerechnet'
+import { abgerechnetWarnung, ticketIdsOf } from '../lib/projektkontoView'
 
 // Gespeichert ist dd.mm.yyyy / hhmm, die Kalender-Felder brauchen yyyy-mm-dd / hh:mm
 const formFromWorksheet = (worksheet) => ({
@@ -23,6 +25,8 @@ const NO_EMPLOYEES_STATE = { employees: [], loading: false, error: null }
  */
 export default function WorksheetTimesModal({ worksheet, currentUserId, onClose, onSave, employeesState = NO_EMPLOYEES_STATE }) {
   const isGit = isGitWorksheet(worksheet)
+  const abgerechnet = useAbgerechnet(ticketIdsOf([worksheet]))
+  const warnung = abgerechnetWarnung(abgerechnet, worksheet.$id)
   const [formData, setFormData] = useState(() => formFromWorksheet(worksheet))
   // null = die Arbeitszeit folgt Beginn und Ende (aufgerundet auf 15 Minuten). Passte sie
   // schon vorher nicht dazu, wurde sie von Hand gewaehlt (z.B. ohne Pause) und bleibt stehen.
@@ -117,6 +121,12 @@ export default function WorksheetTimesModal({ worksheet, currentUserId, onClose,
         {isGit && <><br />Das Ende ist der Zeitpunkt des Git-Pushs. Trag ein, wann die Arbeit begonnen hat.</>}
       </p>
 
+      {warnung && (
+        <p className="msg warn" role="alert">
+          {warnung}
+        </p>
+      )}
+
       <Field label="Beginn" htmlFor="worksheet-times-start">
         <DateTimeInput
           id="worksheet-times-start"
diff --git a/src/hooks/useAbgerechnet.js b/src/hooks/useAbgerechnet.js
new file mode 100644
index 0000000..934489b
--- /dev/null
+++ b/src/hooks/useAbgerechnet.js
@@ -0,0 +1,21 @@
+import { useEffect, useState } from 'react'
+import { getAbgerechnet } from '../lib/teamApi'
+
+const NICHTS = Object.freeze({})
+
+/**
+ * Arbeitsblatt-Kennung -> Rechnungsnummer oder „Entwurf“ für die Tickets in `ticketIds` (Team-Route, alle Mitarbeiter,
+ * ohne Beträge). Ein Fehler verbirgt nur die Abzeichen, das Arbeitsblatt bleibt bedienbar; der Hook wirft nie.
+ */
+export function useAbgerechnet(ticketIds) {
+  const key = (ticketIds || []).join(',')
+  const [state, setState] = useState({ key: '', map: NICHTS })
+  useEffect(() => {
+    if (!key) return undefined
+    let cancelled = false
+    Promise.all(key.split(',').map((id) => getAbgerechnet(id).then((r) => r?.abgerechnet || NICHTS).catch(() => NICHTS)))
+      .then((maps) => { if (!cancelled) setState({ key, map: Object.assign({}, ...maps) }) })
+    return () => { cancelled = true }
+  }, [key])
+  return state.key === key ? state.map : NICHTS
+}