Unterstützung: Mitarbeiter tragen sich selbst als Unterstützung ein

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-09-30 14:58:58 +00:00
1 parent d83bbfb48d
commit bc9d673ff7
@@ -0,0 +1,80 @@
+import { useState } from 'react'
+import { FaTimes } from 'react-icons/fa'
+import { parseSupporters, supportMinutes } from '../lib/support'
+import { stepLabel } from '../lib/timeSteps'
+
+/* "Ich habe unterstuetzt": die eigene Unterstuetzung bei einem fremden Arbeitsblatt
+   eintragen, aendern oder entfernen. Andere Eintraege und die Zeiten bleiben unberuehrt. */
+export default function OwnSupportModal({ worksheet, currentUserId, onClose, onSave }) {
+  const existing = parseSupporters(worksheet.supporters).find((s) => s.employeeId === currentUserId)
+  const [task, setTask] = useState(existing?.task || '')
+  const [saving, setSaving] = useState(false)
+  const [error, setError] = useState('')
+
+  const save = async (value) => {
+    setSaving(true)
+    setError('')
+    const result = await onSave(worksheet, value)
+    if (result?.success) {
+      onClose()
+      return
+    }
+    setError(result?.error || 'Speichern fehlgeschlagen')
+    setSaving(false)
+  }
+
+  const handleSubmit = (e) => {
+    e.preventDefault()
+    if (!task.trim()) {
+      setError('Bitte angeben, wobei du unterstützt hast.')
+      return
+    }
+    save(task.trim())
+  }
+
+  return (
+    <div className="overlay">
+      <span className="overlay-close" onClick={onClose}>
+        <FaTimes />
+      </span>
+      <div className="overlay-content" style={{ maxWidth: 480 }}>
+        <h2 className="mb-2">Unterstützung eintragen</h2>
+        <p className="text-grey" style={{ fontSize: '14px', marginBottom: '16px' }}>
+          WSID {worksheet.wsid} · {worksheet.employeeName}
+          <br />Dir werden {stepLabel(supportMinutes(worksheet.totalTime))} angerechnet.
+        </p>
+
+        {error && (
+          <div className="bg-red text-white p-2 mb-2" style={{ borderRadius: '4px' }}>
+            {error}
+          </div>
+        )}
+
+        <form onSubmit={handleSubmit}>
+          <div className="form-group">
+            <label className="form-label" htmlFor="own-support-task">Wobei?</label>
+            <input
+              id="own-support-task"
+              className="form-control"
+              maxLength={200}
+              required
+              value={task}
+              onChange={(e) => setTask(e.target.value)}
+              autoFocus
+            />
+          </div>
+          <div className="text-center mt-2 flex gap-2" style={{ justifyContent: 'center' }}>
+            <button type="submit" className="btn btn-dark" disabled={saving}>
+              {saving ? 'Speichert...' : 'Speichern'}
+            </button>
+            {existing && (
+              <button type="button" className="btn" disabled={saving} onClick={() => save(null)}>
+                Eintrag entfernen
+              </button>
+            )}
+          </div>
+        </form>
+      </div>
+    </div>
+  )
+}