Kundenansicht neu (Aufträge): "Was wir zuletzt erledigt haben" als Zeitleiste auf der Website-Seite
Je Auftrag eine Überschrift (Titel fett, Status-Pille), ein schmaler Balken mit vier Abschnitten (Stufennamen als Text für Screenreader), bei Rückfrage die Zeile "Wir brauchen eine Info von dir · Im Chat antworten" und eine Zeitleiste mit Haarlinie (Datum TT.MM. und Kurztext, drei sichtbar, "mehr anzeigen"). Fünf Aufträge offen, der Rest hinter "Ältere Aufträge anzeigen". Die Auftragsnummer steht nicht mehr im Text (ruhiger), bleibt als data-auftrag. Die alte baueAktivitaet und ihre toten CSS-Regeln entfallen; die Projektdetails (baueAuftrag, baueArbeiten) bleiben unverändert. Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
f231f4b887
commit
2064bddba6
7 files changed
+241
-37
No files matched your search
@@ -1,4 +1,4 @@
|
||||
/* Kundenansicht neu (P2): Bausteine der Projektdetails und der Aktivität (Auftrag, Änderungen, Arbeiten, Dateien).
|
||||
/* Kundenansicht neu (P2): Bausteine der Projektdetails (Auftrag, Änderungen, Arbeiten, Dateien); die Aktivität der Website-Seite steht in auftrags-zeitleiste.js.
|
||||
Alles über h() und Textknoten, nie als HTML. Kein DOM-Zugriff beim Import. */
|
||||
|
||||
import { api } from './api.js'
|
||||
@@ -8,7 +8,6 @@ import { K, zuAnsicht, fmtBytes, fmtMinuten, fmtUhrzeit, berlinTag } from './ans
|
||||
export const AUFTRAG_SCHRITTE = ['Eingegangen', 'In Arbeit', 'Prüfung', 'Erledigt']
|
||||
const ANZAHL_AENDERUNGEN = 5
|
||||
const ANZAHL_EINTRAEGE = 4
|
||||
const ANZAHL_AKTIVITAET = 3
|
||||
const TON = { new: 'grau', active: 'blau', waiting: 'orange', review: 'violett', done: 'gruen', paused: 'grau', stopped: 'rot' }
|
||||
|
||||
/** Farbton der Status-Pille zum Ton des Servers. */
|
||||
@@ -136,24 +135,6 @@ export function baueDateien(files) {
|
||||
h('tbody', null, zeilen))))
|
||||
}
|
||||
|
||||
/** Aktivität: je Auftrag Kopf und Arbeiten, die drei neuesten sichtbar, „Alle anzeigen (n)“ zeigt den Rest. */
|
||||
export function baueAktivitaet(tickets, jetzt = new Date()) {
|
||||
const liste = Array.isArray(tickets) ? tickets : []
|
||||
if (!liste.length) return leerText('Es wurden noch keine Arbeiten dokumentiert.')
|
||||
const sortiert = [...liste].sort((a, b) => String(b.createdAt || '').localeCompare(String(a.createdAt || '')))
|
||||
const behaelter = h('div', { class: 'kn-aktivitaet' })
|
||||
const zeichne = (alle) => {
|
||||
const knopf = sortiert.length > ANZAHL_AKTIVITAET
|
||||
? h('button', { type: 'button', class: K.knopf, on: { click: () => zeichne(!alle) } }, alle ? 'Weniger anzeigen' : `Alle anzeigen (${sortiert.length})`)
|
||||
: null
|
||||
behaelter.replaceChildren(
|
||||
...sortiert.slice(0, alle ? sortiert.length : ANZAHL_AKTIVITAET).map((t) => h('article', { class: 'kn-auftrag-karte' }, baueAuftrag(t), baueArbeiten(t.entries, 'Noch keine Arbeiten dokumentiert.'))),
|
||||
...(knopf ? [knopf] : []))
|
||||
}
|
||||
zeichne(false)
|
||||
return behaelter
|
||||
}
|
||||
|
||||
/** Die drei Quellen der Projektdetails; jede einzeln, ein Fehler ergibt null. */
|
||||
export async function ladeProjektDetails(projectId, apiFn = api) {
|
||||
const id = encodeURIComponent(projectId)
|
||||
|
||||
Reference in new issue
Block a user