Terminplaner: Staff-Aktivierung nur mit Zustimmung in Textform (Modus on), WOMS

Im Dialog "Terminplaner ohne Zahlung aktivieren?" erscheinen, wenn das Portal
termine.textformNoetig meldet, der Haken (Leistungsbeschreibung und AVV in
der Fassung, Ausschluss Gesundheitsbereich), das Datum der Zustimmung und der
Weg (Chat | E-Mail) sowie die Textvorlage fuer den Chat mit Kopierknopf
(versionierte Adressen aus dem Portal). "Ja" bleibt gesperrt, bis alles
stimmt (canSubmitTextform mit minDate = Fassung); der Rumpf traegt
textformDate und textformChannel. News und Abschalten bleiben unveraendert.

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

src/components/customer/CustomerFunktionen.jsx

@@ -6,8 +6,10 @@ import { copyText } from '../CopyableCredential'
 import { getFunktionen, setFeature, getTermineAnleitung } from '../../lib/teamApi'
 import {
   FUNKTIONEN, ZUSTAND, AKTION_LABEL, funktionOf, aktionen, mergeFunktion, siteKeyOf, abgeschaltetText,
-  hindernisText, panelModell, anleitungOffen,
+  hindernisText, panelModell, anleitungOffen, textformNoetig, textformAnsicht, textformBereit,
 } from '../../lib/funktionenView'
+import { CHANNELS, channelLabel } from '../../lib/analyseView'
+import { berlinYmd } from '../../lib/format'
 import '../../styles/admin-areas.css'
 
 // Reiter "Funktionen": News-Pinnwand und Terminplaner je Projekt an/aus wie im frueheren Admin-Panel (Kundenliste, Zeile "Funktionen")
@@ -111,8 +113,57 @@ function AnleitungPanel({ customerId, projectId, feature, reloadKey }) {
   )
 }
 
+// Zustimmung des Kunden in Textform (Terminplaner im Modus on): Haken, Datum, Weg und die Textvorlage fuer den Chat. Die Pflichtangaben
+// prueft textformBereit (funktionenView); das Portal prueft sie noch einmal. Links nur als geprueftes https (textformAnsicht).
+function TextformPanel({ termine, value, onChange, projectId, today, disabled }) {
+  const ansicht = textformAnsicht(termine)
+  const { label, links, vorlage } = ansicht
+  return (
+    <div className="area-row funktionen-panel">
+      <label className="area-inline" style={{ alignItems: 'flex-start', flexWrap: 'nowrap' }}>
+        <input type="checkbox" style={{ marginTop: 3 }} checked={value.confirmed} disabled={disabled} onChange={(e) => onChange({ ...value, confirmed: e.target.checked })} />
+        <span>
+          {label.before}
+          {links.lb ? <a href={links.lb} target="_blank" rel="noopener noreferrer">{label.lb}</a> : label.lb}
+          {label.between}
+          {links.avv ? <a href={links.avv} target="_blank" rel="noopener noreferrer">{label.avv}</a> : label.avv}
+          {label.after}
+        </span>
+      </label>
+      <div className="area-inline">
+        <label>
+          Datum der Zustimmung:{' '}
+          <input type="date" required className="form-control" value={value.date} min={ansicht.version} max={today} disabled={disabled} onChange={(e) => onChange({ ...value, date: e.target.value })} />
+        </label>
+        <span role="radiogroup" aria-label="Weg der Zustimmung" className="area-inline">
+          <span>Weg:</span>
+          {CHANNELS.map((c) => (
+            <label key={c} className="area-inline">
+              <input type="radio" name={`termine-weg-${projectId}`} value={c} checked={value.channel === c} disabled={disabled} onChange={() => onChange({ ...value, channel: c })} />
+              {channelLabel(c)}
+            </label>
+          ))}
+        </span>
+      </div>
+      {vorlage ? (
+        <details>
+          <summary style={{ cursor: 'pointer' }}>Textvorlage für den Chat</summary>
+          <p style={{ margin: '6px 0', whiteSpace: 'pre-wrap' }}>{vorlage}</p>
+          <KopierKnopf text={vorlage} label="Vorlage kopieren" />
+        </details>
+      ) : (
+        <div className="area-summary warn">Die Adressen der Unterlagen fehlen; die Chat-Vorlage ist nicht verfügbar.</div>
+      )}
+    </div>
+  )
+}
+
+const LEERE_TEXTFORM = { confirmed: false, date: '', channel: '' }
+
 export default function CustomerFunktionen({ customerId }) {
   const [projects, setProjects] = useState(null)
+  const [termine, setTermine] = useState(null) // Portal-Feld termine: { textformNoetig, avvVersion, links }
+  const [textform, setTextform] = useState(LEERE_TEXTFORM)
   const [error, setError] = useState(null)
   const [confirm, setConfirm] = useState(null) // { projectId, key, action }
   const [note, setNote] = useState('')
@@ -124,7 +175,7 @@ export default function CustomerFunktionen({ customerId }) {
   const load = useCallback(() => {
     setError(null)
     getFunktionen(customerId)
-      .then(({ projects: list }) => setProjects(list || []))
+      .then(({ projects: list, termine: feld }) => { setProjects(list || []); setTermine(feld || null) })
       .catch((err) => setError(err.message || 'Funktionen konnten nicht geladen werden.'))
   }, [customerId])
   useEffect(() => { load() }, [load])
@@ -134,12 +185,17 @@ export default function CustomerFunktionen({ customerId }) {
     setBusy(true)
     setStatus(null)
     try {
-      const { projects: changed } = await setFeature(customerId, key, { projectId, action, note: note.trim() })
+      const mitTextform = textformNoetig(key, action, termine)
+      const { projects: changed } = await setFeature(customerId, key, {
+        projectId, action, note: note.trim(),
+        ...(mitTextform ? { textformDate: textform.date, textformChannel: textform.channel } : {}),
+      })
       // Die Antwort enthaelt das ganze Projekt; uebernommen wird nur die geaenderte Funktion
       const updated = changed?.[0]
       if (updated) setProjects((list) => mergeFunktion(list, updated.projectId, key, updated))
       setConfirm(null)
       setNote('')
+      setTextform(LEERE_TEXTFORM)
       setStatus({ ok: true, text: 'Gespeichert.' })
     } catch (err) {
       setConfirm(null)
@@ -151,7 +207,8 @@ export default function CustomerFunktionen({ customerId }) {
     }
   }
 
-  const ask = (projectId, key, action) => { setNote(''); setConfirm({ projectId, key, action }) }
+  const ask = (projectId, key, action) => { setNote(''); setTextform(LEERE_TEXTFORM); setConfirm({ projectId, key, action }) }
+  const heute = berlinYmd(new Date())
   const panelOffen = (projectId) => (Object.prototype.hasOwnProperty.call(panel, projectId) ? panel[projectId] : anleitungOffen(window.location.search, projectId))
   const togglePanel = (projectId) => setPanel((p) => ({ ...p, [projectId]: !panelOffen(projectId) }))
 
@@ -169,6 +226,8 @@ export default function CustomerFunktionen({ customerId }) {
           const isConfirming = confirm?.projectId === p.projectId && confirm?.key === f.key
           const hatAnleitung = f.key === 'termine' && feature.state !== 'off'
           const anleitungOffenHier = hatAnleitung && panelOffen(p.projectId)
+          const braucheTextform = isConfirming && textformNoetig(f.key, confirm.action, termine)
+          const textformFehlt = braucheTextform && !textformBereit({ ...textform, today: heute }, termine)
           return (
             <Fragment key={`${p.projectId}:${f.key}`}>
               <div className="area-row funktionen-row">
@@ -200,7 +259,7 @@ export default function CustomerFunktionen({ customerId }) {
                     <Fragment>
                       <span>{f.bestaetigen[confirm.action]}</span>
                       <input className="form-control" placeholder="Notiz (optional)" maxLength={120} value={note} onChange={(e) => setNote(e.target.value)} style={{ maxWidth: 220 }} />
-                      <Button size="sm" variant="primary" onClick={save} disabled={busy}>{busy ? <FaSpinner className="spinner" /> : 'Ja'}</Button>
+                      <Button size="sm" variant="primary" onClick={save} disabled={busy || textformFehlt}>{busy ? <FaSpinner className="spinner" /> : 'Ja'}</Button>
                       <Button size="sm" variant="ghost" onClick={() => setConfirm(null)} disabled={busy}>Abbrechen</Button>
                     </Fragment>
                   ) : (
@@ -219,6 +278,9 @@ export default function CustomerFunktionen({ customerId }) {
                   )}
                 </span>
               </div>
+              {braucheTextform && (
+                <TextformPanel termine={termine} value={textform} onChange={setTextform} projectId={p.projectId} today={heute} disabled={busy} />
+              )}
               {anleitungOffenHier && (
                 <AnleitungPanel customerId={customerId} projectId={p.projectId} feature={feature} reloadKey={panelReload[p.projectId] || 0} />
               )}

src/lib/funktionenView.js

@@ -2,6 +2,7 @@
 // Einarbeiten der Portal-Antwort. Rein, unter Node testbar.
 
 import { fmtYmd, fmtBerlin } from './format'
+import { canSubmitTextform } from './analyseView'
 
 /** Funktionen in Anzeigereihenfolge; key = Schluessel im Portal (features[key], POST /funktionen/:customerId/:key). */
 export const FUNKTIONEN = [
@@ -162,3 +163,63 @@ export function mergeFunktion(projects, projectId, key, aktualisiert) {
   if (!view) return projects
   return projects.map((p) => (p.projectId === projectId ? { ...p, features: { ...p.features, [key]: view } } : p))
 }
+
+// --- Aktivieren (ohne Zahlung) mit Zustimmung in Textform (Modus on des Terminplaners; Portal: GET /funktionen/:customerId => termine) ---
+
+/** true, wenn diese Aktion die Zustimmung in Textform braucht: nur "Aktivieren (ohne Zahlung)" des Terminplaners und nur, wenn das Portal es verlangt (termine.textformNoetig === true). */
+export const textformNoetig = (key, action, termine) => key === 'termine' && action === 'activate' && termine?.textformNoetig === true
+
+/** Kaestchentext (wie im Portal-Nachweis, ohne Datum und Weg); die beiden Links setzt die Komponente. */
+export const termineTextformLabel = (version) => ({
+  before: 'Der Kunde hat der ',
+  lb: 'Leistungsbeschreibung Terminplaner',
+  between: ' und dem ',
+  avv: 'Auftragsverarbeitungsvertrag Terminplaner',
+  after: ` (Fassung ${version}) in Textform zugestimmt und bestätigt, dass sein Angebot nicht im Gesundheitsbereich liegt.`,
+})
+
+/** Textvorlage fuer den Chat (Kopierknopf); links = die versionierten Adressen aus dem Portal (termine.links). */
+export const termineChatTemplate = (version, links) =>
+  `Damit wir den Terminplaner für Dich einschalten können, brauchen wir Deine Zustimmung in Textform. Es gelten die Leistungsbeschreibung Terminplaner und der Auftragsverarbeitungsvertrag Terminplaner in der Fassung ${version}: ${links.lb} · ${links.avv}. Bitte antworte hier mit „Ich stimme zu“ und bestätige, dass Dein Angebot nicht im Gesundheitsbereich liegt.`
+
+/** Nur geprüfte https-Adressen werden Links; alles andere ''. */
+const httpsUrl = (wert) => {
+  if (typeof wert !== 'string') return ''
+  try {
+    return new URL(wert).protocol === 'https:' ? wert : ''
+  } catch {
+    return ''
+  }
+}
+
+/**
+ * Alles, was der Bestaetigungsdialog zeigt, aus dem Portal-Feld termine: { version, links { lb, avv } (nur https, sonst ''), label, vorlage }.
+ * vorlage nur, wenn Fassung und beide Adressen da sind (eine Vorlage mit leeren Adressen geht nie an den Kunden), sonst ''.
+ */
+export function textformAnsicht(termine) {
+  const version = typeof termine?.avvVersion === 'string' ? termine.avvVersion : ''
+  const links = { lb: httpsUrl(termine?.links?.lb), avv: httpsUrl(termine?.links?.avv) }
+  return {
+    version,
+    links,
+    label: termineTextformLabel(version),
+    vorlage: version && links.lb && links.avv ? termineChatTemplate(version, links) : '',
+  }
+}
+
+/** Alle drei Pflichtangaben (Haken, Datum zwischen Fassung und heute, Weg); ohne Fassung im Portal-Feld nie bereit. */
+export function textformBereit({ confirmed, date, channel, today }, termine) {
+  const minDate = typeof termine?.avvVersion === 'string' ? termine.avvVersion : ''
+  if (!minDate) return false
+  return canSubmitTextform({ confirmed, date, channel, today, minDate })
+}
+
+/** Rumpf fuer POST /funktionen/:customerId/:key; Datum und Weg der Textform nur beim Aktivieren und nur, wenn beide da sind. */
+export function featureBody({ projectId, action, note, textformDate, textformChannel }) {
+  const body = { projectId, action, note }
+  if (action === 'activate' && textformDate && textformChannel) {
+    body.textformDate = textformDate
+    body.textformChannel = textformChannel
+  }
+  return body
+}

src/lib/teamApi.js

@@ -1,7 +1,7 @@
 import { account } from './appwrite'
 import { createFinanceRequest } from './financeRequest'
 import { createJwtCache } from './serverpulsAuth'
-import { anleitungPfad } from './funktionenView'
+import { anleitungPfad, featureBody } from './funktionenView'
 
 /**
  * Client fuer den Team-Eingang des Kundenportals (/api/team): alle Mitarbeiter, Appwrite-JWT (Bearer).
@@ -93,9 +93,12 @@ export const markStorageDone = (id) => request(`/storage-tasks/${enc(id)}/done`,
 // --- Funktionen (News-Pinnwand, Terminplaner je Projekt) ---
 
 export const getFunktionen = (customerId) => request(`/funktionen/${enc(customerId)}`)
-/** Aktivieren (ohne Zahlung) oder Abschalten einer Funktion (key: news | termine); Antwort { projects: [das eine Projekt] }. */
-export const setFeature = (customerId, key, { projectId, action, note }) =>
-  request(`/funktionen/${enc(customerId)}/${enc(key)}`, { method: 'POST', body: { projectId, action, note } })
+/**
+ * Aktivieren (ohne Zahlung) oder Abschalten einer Funktion (key: news | termine); Antwort { projects: [das eine Projekt] }.
+ * Terminplaner im Modus on: beim Aktivieren zusaetzlich textformDate (JJJJ-MM-TT) und textformChannel (chat | email).
+ */
+export const setFeature = (customerId, key, { projectId, action, note, textformDate, textformChannel }) =>
+  request(`/funktionen/${enc(customerId)}/${enc(key)}`, { method: 'POST', body: featureBody({ projectId, action, note, textformDate, textformChannel }) })
 export const setNewsFeature = (customerId, body) => setFeature(customerId, 'news', body)
 /** Einbauanleitung des Terminplaners: { stand, warnungen, abschnitte, text, state, ticketWoid, ticketVersion, hindernis } (Aufbereitung: panelModell). */
 export const getTermineAnleitung = (customerId, projectId) => request(anleitungPfad(customerId, projectId))