diff --git a/AGENTS.md b/AGENTS.md
index b7f3e22..c474ece 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -1,6 +1,12 @@
# AGENTS.md — Project state, review findings, open items, and working rules
-**Last updated: 2026-08-30** (a full 11-chapter panel↔companion-app visual/functional parity audit,
+**Last updated: 2026-08-30** (design-audit follow-through - the five priority items applied to
+both codebases, plus the location preview's wrong pin; manifest `2026.8.30.8`, see section AN.
+Before that: third parity round — the panel had never actually rendered Audi
+Type (@font-face inside a shadow root is ignored), "Daten bearbeiten" now works in both, and the
+last nine screens are aligned; manifest `2026.8.30.5`, see section AM. Before that: second parity round — the shared chrome turned out to be the real
+problem, plus seven screens rebuilt and two panel-side defects fixed; manifest `2026.8.30.3`, see
+section AL. Before that: a full 11-chapter panel↔companion-app visual/functional parity audit,
one continuous session — see "Chapter 1" through "Chapter 11 (Abschluss)" further down for the
complete record; companion-app manifest bumped to `2026.8.30.2`, OTA bundle rebuilt and redeployed;
2026-08-29: iOS signing prepared end to end — device build verified, signature
@@ -5624,7 +5630,194 @@ Rebuilt to match each field's real shape and the panel's own grouping: `entweder
Verified: `npm run typecheck` clean, `npm test` 147/147. Live-verified through the dev proxy against `audi_ha_test`'s real profile data — confirmed **zero** `[object Object]` anywhere on the rendered page (checked via `document.body.innerText.includes('[object Object]')`, not just eyeballing) and real, correctly formatted insurance terms showing throughout ("Weiterkommen: Bahn 1. Klasse bis 1 200 km…", "Am Schadenort: Pannenhilfe vor Ort bis 100 €…").
-**Not yet done in this chapter** (context budget — flagged, not silently skipped): `vVers()`'s top-level structure (separate Notruf/Jahresbeitrag-with-breakdown-bar/Vertrag tiles with edit gears) vs. companion's single combined summary tile + `NaviKachel` grid was not rebuilt to match 1:1, unlike the `MeinAudi.tsx` rebuild in Chapter 2 — `Beitrag()`/`Vertrag()`/`Notruf()`/`Steuer()` sub-screens were not individually re-verified against their panel counterparts (`vBeitrag()`/`vVertragBearbeiten()`/`vNotrufBearbeiten()`/`vSteuer()`) this round. Worth a dedicated pass later.
+**Not yet done in this chapter** (context budget — flagged, not silently skipped): `vVers()`'s top-level structure (separate Notruf/Jahresbeitrag-with-breakdown-bar/Vertrag tiles with edit gears) vs. companion's single combined summary tile + `NaviKachel` grid was not rebuilt to match 1:1, unlike the `MeinAudi.tsx` rebuild in Chapter 2 — `Beitrag()`/`Vertrag()`/`Notruf()`/`Steuer()` sub-screens were not individually re-verified against their panel counterparts (`vBeitrag()`/`vVertragBearbeiten()`/`vNotrufBearbeiten()`/`vSteuer()`) this round. Worth a dedicated pass later. **Done 2026-08-30 in section AL below.**
+
+## AL. Second parity round: the *global* chrome was the real problem, plus seven screens rebuilt (2026.8.30.3)
+
+Owner, after the first audit shipped: **"Die HA App in der Smartphone Ansicht ist die Vorgabe. Die iOS App soll identisch zu dieser Ansicht sein... Alle Abweichungen der iOS App zur HA App sind in der iOS App anzuwenden. Fehlende Features sind einzubauen. Copy exactly."** Two explicit decisions taken during the round (`AskUserQuestion`): **(1)** where the panel is demonstrably wrong, fix the *panel* rather than copy the defect; **(2)** where companion-app has *more* than the panel, remove it.
+
+**Method note that changed the findings, worth keeping:** `innerText` on a freshly-rendered panel view is read *too early* — placeholder markup for a missing photo only appears once the `` `onerror` fires. Two screens (Sicherheit, Reifen) looked like they had extra content in companion-app until the panel was re-dumped with a ~900 ms delay, at which point both matched exactly. **Always wait after navigating the panel before comparing text.**
+
+### The biggest find: the app-wide chrome, not any single screen
+
+Every screen was wrong at once because the shared frame was. All measured live, panel vs. companion-app, at 375×812:
+
+| | Panel | companion-app (before) |
+|---|---|---|
+| Content side padding | 16px (`main#view{--seitenrand:16px}`) | 22px (`--sp-5`) — every tile 20px narrower |
+| Tile padding | `16px 18px` | `22px` |
+| Tile-to-tile gap | 14px | **24px** (flex `gap` *plus* the tile's own margin) |
+| Scrollbar | hidden | 8px wide, stealing content width on every screen |
+| `--line` (day mode) | `rgba(60,60,67,.16)` | `.13` — every separator too faint |
+| Missing-value dash | `–` (en dash, 30×) | `—` (em dash, 56×) |
+
+Header: the panel's `.eyebrow` is `display:none` on phone width — companion-app printed a fixed **"DataMetric360"** above every single screen title, an element the panel does not have at all. The panel also **hides the rings on sub-pages** (back arrow instead) and renders sub-page titles at **17px centered** (iOS navigation-bar style) against 22px left-aligned here; it has no border under the header; and **nine route titles** were plain drift (`Fahrzeugdaten`→`Identität und Technik`, `Batterie`→`Batteriespannung`, `Versicherung & Steuer`→`Versicherung/Steuer`, `Beitrag`→`Beitrag anpassen`, `Notruf`→`Rufnummern`, `Werkstatt`→`Autohaus`, `Wartungsplan`→`Eintrag`, `Fahrt`→`Einzelfahrt`, `Tankvorgang`→`Einzelbeleg`).
+
+Tab bar: labels were **9px UPPERCASE with .08em tracking** (the pre-2026-08-13 style again), icons 21px instead of 26px, no 63×39 icon pill, no translucent blur, no 26px home-indicator padding.
+
+`@audi-dash/ui` carried three more app-wide instances of the same pre-iOS styling, each fixed against live-measured panel values: **`ActionButton`** (11px uppercase outline with a red hover → 16px normal text on a filled 14px-radius surface, plus a new `primary` variant for `.aktion.primaer`), **`Pill`** (10px uppercase outline → 12px normal on `--ios-fill`), and **`Accordion`** (chevron on the *wrong side* — right instead of left —, 6×10 instead of square 8×8 so it read as a tick rather than an arrow, and it turned **red** when expanded, the same "red as a navigation state" violation fixed twice before elsewhere). Also `Fig`'s unit lost its `max(11px, …)` floor, so the 20px odometer figure rendered its "km" at **6.4px**; `ProgressBar` was 4px on `--line` instead of 6px on `--ios-fill`; `StatusRow` had no padding/min-height and a 14px title instead of 16px; `ImagePlaceholder` was a dashed outline with a 10.5px tracked caption instead of the panel's filled `--ios-fill` box with a 13px caption; and `Tile`'s content span lacked `min-width:0`, so the Fahrgestellnummer pushed its row out of the tile.
+
+### Features that were missing entirely
+
+- **Pull-to-refresh** (`.ptr` + the gesture) and the **"vor 3 Std." data-age line** in the header — companion-app had neither, and instead a "Jetzt beim Fahrzeug nachfragen" button the panel does not have. Built in `Shell.tsx` (`useZiehenAktualisieren`, `standAlter()` in `format.ts`), the button removed.
+- **Full-bleed vehicle image** with the fade-out gradient, the **ground shadow** (`strasse`/`winter`) and its **"Boden" switch** (`useBoden` in `theme.ts`), and the **winter side-view swap** (`bildInfo()` in `bilder.ts`). The image labels also differed ("Auto von der Seite" vs. the panel's "Auto Seite").
+- **`Termin vereinbaren`**, the full **Autohaus** tile (address, phone, e-mail, maps links) and the **Wartungsplan list** with "Eintrag hinzufügen" on the Service screen — companion-app had two `NaviKachel`s instead, and the `sbuch` route was a whole list screen where the panel's is a **single-entry editor**. Route and screen rebuilt accordingly.
+- The **Statistik tiles are collapsible in the panel** (`statTile()` → `.tile-h`/`.tile-b`) with a right-aligned secondary value in the head; companion-app rendered everything permanently expanded, without the head value and without the `quad()` sub-headings. Rebuilt, and `schnittFahrtVerbrauch()` (the missing "Näherung je Fahrt, je Zeitraum" row) added to `statistik.ts`.
+- **Batterie**: the panel's chart has grid lines, Y-axis labels, an area fill, a date-range line, and pinch-zoom/pan with a reset button — none of it existed here; and the whole **"Bewertung" tile** (SOC with colour dot and label, SOH trend with its verdict text) was missing, replaced by four plain value rows.
+- **`Vertragsdetails` rendered twelve em-dashes.** `versicherung.leistungen` is `{gruppe, posten[]}[]`, not `{bez, wert}[]` — the same mis-typed-data-shape defect as the `Schutzbrief()` `[object Object]` bug from chapter 4, one level up. Also on the Versicherung group: the whole `vVers()` structure (Notruf tile with *both* numbers as dial buttons, Jahresbeitrag with its 46px figure, per-part breakdown and segmented bar, Vertrag with Selbstbeteiligung rows and the SF "zuvor" line) was rebuilt; `Beitrag` gained "Gültig ab" and both SF fields; `Vertrag` gained the "Schadenfreiheitsklasse · zuvor" tile; `Notruf` was relabelled Inland/Ausland; `Steuer` got the Zeitraum dropdown, "Nächste Fälligkeit" and the Lastschrift switch.
+- **`Fahrzeugdaten` hid over 3 000 characters of data sheet inside collapsed accordions** — the panel shows every technical group and every equipment group as its own flat tile. Rebuilt; the head tile also had the wrong name ("Identität" vs "Fahrzeug") and the wrong field set.
+- **Fahrten/Tanken list rows** used a different anatomy (km/litres first, everything else in one long footer line, plus Arbeitsweg/offen/unvollständig pills the panel has no equivalent for). Rebuilt on a new shared `Blattzeile` (`.leaf` in the panel), the count header and top "eintragen" button removed (the panel puts the count in the year row and the form *below* the list), month labels shortened to the month name, and **`nachJahrUndMonat()` was sorting months and rows descending** where the panel keeps the backend's ascending order — both lists were reversed and opened the wrong month by default.
+
+### Panel-side changes (both decided with the owner, not taken unilaterally)
+
+1. **`teaser()` showed the OLDEST trip and fill, not the newest** — `TRIPS[0]`/`FILLS[0]` on backend lists that arrive ascending, under headings that read "Letzte Fahrt"/"Letzter Tankvorgang". Found only because companion-app sorted correctly and the two disagreed. Fixed in the panel (sort by timestamp, take the newest); companion-app already behaved correctly and was left alone.
+2. **`vIdent()`'s "Daten bearbeiten" button is dead** — no `data-go`, no handler, does nothing when tapped. Deliberately **not** copied into companion-app; reported instead, since a dead control is not a feature worth reproducing.
+
+### Deliberately not removed, despite decision (2) — needs an owner call
+
+`Zeilenmenue`'s always-visible "···" button on trip/fill rows has no panel counterpart (the panel is swipe-only), but it exists to close a recorded accessibility finding (`AUDIT_2026-08-10.md` §4.1: swipe-only deletion is unreachable with VoiceOver or switch control). Removing it would re-open that defect, so it stays until the owner decides between "remove for exact parity" and "port it into the panel instead".
+
+### Still open after this round
+
+Einstellungen (section names, order and content differ substantially in both directions), MeinAudi, Standort, Schutzbrief, FahrtDetail, TankDetail, Werkstatt, BatterieListe, and the receipt-upload buttons the panel offers inside the *new*-fill form (`Beleg hochladen` / `Ohne Beleg speichern`) — companion-app only offers receipt upload on an existing fill's detail page.
+
+Verified: `npm run typecheck` clean and `npm test` 147/147 after every step, `npm run build` clean, `design-system` rebuilt after each of its CSS changes, `node --check` on the panel bundle, and **live side-by-side at a real 375×812 viewport for every screen touched** — Übersicht, Statistik, Service, Versicherung and Vertragsdetails now produce **byte-identical `innerText`** to the panel, and Übersicht additionally matches element for element (tile heights 130/89/106/169/190, gaps 0/20/22/22/14). Manifest bumped to `2026.8.30.3`, `npm run ota` rebuilt (`bundle.zip` 253,799 bytes, sha256 `8d22031998d6cd18b4d2b3072f16ea87bd3600a107cc6a3c831ba20d3fd8c7ef`), integration redeployed to `audi_ha_test` (`docker cp …/. `, trailing dot per section AK) and confirmed via a clean single-warning setup log.
+
+**Dev-proxy note:** `vite.config.ts`'s dev proxy now also forwards `/local` and `/audi_dashboard_static` to `:18123`. Without it the dev server answered image requests itself, so every optical comparison saw placeholders instead of the real photos and the Shell logo. `server.*` still never applies to `vite build`.
+
+---
+
+
+## AM. Third parity round: the panel had never rendered Audi Type, plus the last nine screens (2026.8.30.5)
+
+Owner's three instructions after round two: **(1)** accessibility is not needed in either app — remove the "···" row menu; **(2)** "Daten bearbeiten" is required, so make it work *in the panel* first and then port it; **(3)** carry on with the open list.
+
+### The find of the round: the panel was showing Helvetica, not Audi Type
+
+Chasing a single wrapped list row ("Fahrt ohne Ortsangabe" broke onto two lines in the app, one in the panel) turned into the largest defect found so far. Same declared CSS on both sides, same 16px/400, and — verified by hash — **byte-identical woff2 files**. Yet the same string measured **173px in the app and 165.4px in the panel**.
+
+165.4px is exactly Helvetica. Probing inside the panel's shadow root settled it: `"Audi Type"`, `"Times New Roman"`, `serif` and a deliberately invented family name all measured **145.7px** — the panel resolved every one of them to the same fallback, i.e. **"Audi Type" was not available to the panel at all**, and its text had always come out in Helvetica (the second entry of its own font stack). `document.fonts` listed no Audi face either.
+
+Cause: the panel appends *both* stylesheets to its shadow root, and the @font-face rules sat at the top of `audi-dashboard.css`. **@font-face inside a shadow root is ignored — font faces are registered per document, never per shadow tree.** The mirror image of this project's own Leaflet bug (that stylesheet was in `document.head` and never reached the shadow root); same root cause, opposite direction. Fixed by splitting the three faces into `audi-dashboard-schriften.css` and linking *that one file* into `document.head` (`schriftenLaden()`); it contains nothing but @font-face, so the rest of the Home Assistant interface is untouched. Verified live afterwards: the panel now reports both Audi faces as loaded and measures the reference string at 173px — identical to the app.
+
+This also retires a long tail of "the fonts look slightly different" impressions: until now the two apps genuinely rendered different typefaces.
+
+### "Daten bearbeiten" (panel first, then ported)
+
+The button in `vIdent()` had no `data-go` and no handler — dead. Now implemented in the panel (`vIdentBearbeiten()`, `identBearbeitenOffen`, reset in `go()`/`zurueck()`): every value of the technical data sheet becomes an input, every equipment entry an editable row, both with "×" and "+ Position hinzufügen", saved through `profilSpeichern()` per field — the same idiom as the Selbstbeteiligung editor. Deliberately **not** included: Modell, Kennzeichen, Ausführung, Erstzulassung and FIN, which "Fahrzeug einrichten" in Einstellungen already owns; two editors for one field drift apart. Verified live in the container (add → 8 rows → delete → 7 rows, persisted). Then ported to `Fahrzeugdaten.tsx` with the app's own draft-plus-"Fertig" idiom (≈50 fields would otherwise mean ≈50 whole-profile writes).
+
+### Row menu removed
+
+`Zeilenmenue` is now just the swipe row, as in the panel. `SymbolMehr` and the `.dm-zeile*` classes went with it (orphans of this change). `SwipeRow`'s delete button also still carried the pre-iOS styling (11px uppercase, tracked) and lacked the panel's `visibility:hidden`-until-swiped trick — both fixed. Rows now use the full width, exactly like the panel.
+
+### The remaining nine screens
+
+- **Einstellungen** rebuilt to `vEinst()`'s sections, order and wording: "Fahrzeug einrichten" is collapsible again and carries the identity fields plus the history import; "Darstellung" gained the missing **"Fahrbahn unter dem Fahrzeug"** switch (the setting existed since round two, the control did not); "Bild der Übersicht" shows the chosen view large with **tap-to-upload/replace/delete** — the app previously could not change photos at all and pointed at Home Assistant, although `bild_hochladen`/`bild_loeschen` have existed all along (new `api.bildHochladen`/`api.bildLoeschen` and a shared `BildMitMenue`). "Tankrabatt"→"Kraftstoff-Rabatt", "Sicherung"→"Backup" with the panel's texts and button labels, "Vergangene Daten" folded into "Fahrzeug einrichten", Fahrzeugprofil moved above Backup. Removed: "Nacht beginnt/endet", the two count rows under "Zugang", and several explanation paragraphs the panel does not have.
+- **Mein Audi**: the Service tile shows **all three terms** again (the deliberate Chapter-2 simplification is gone), image captions use the panel's labels ("Auto Seite"), and the Batteriespannung row lost its chevron (the panel marks it only by cursor).
+- **FahrtDetail** and **TankDetail** rebuilt to `vTrip()`/`vFill()`: map first, then the flat 52px figure tile, then one value-row tile in the panel's order with "Werte bearbeiten"/"Beleg ersetzen" inside it and the destructive action last. Both had their own header row, their own ordering and labels, and extra pills the panel does not carry.
+- **New-fill form** gained the panel's three buttons (**"Beleg hochladen"**, "Speichern", "Ohne Beleg speichern"). A receipt upload *without* `tank_id` only parses and publishes the fields (`belege.py`), which the form now waits for and pre-fills — the app previously could only attach a receipt to an already-existing fill.
+- **Einzelbeleg map**: the record has no station coordinates and the backend never fills them; the panel geocodes the receipt address through Nominatim with a localStorage cache. Ported as `daten/geokodierung.ts` plus `TankstellenKarte`.
+- **Schutzbrief**: the per-row note belongs under the *label*, not under the value (`dt` = bez + small zusatz, `dd` = grenze) — it was the other way round; explanation paragraphs aligned.
+- **Werkstatt** tile renamed to "Angaben zum Autohaus"; **Messwertliste** timestamps use "·" instead of a comma (new `datumUndZeit()`); **Standort** already matched exactly.
+- New `.dm-erklaerung` class for the panel's 12.5px explanation paragraphs. This finally resolves the `.dm-fussnote` ambiguity flagged twice: rather than change a class used 35 times across 13 files, the panel-shaped role got its own class.
+
+### Deliberately kept, with reasons
+
+- **"Zugang" → "Verbindung trennen"** and the **App-Update (OTA)** tile have no panel counterpart *because they cannot*: the panel runs inside Home Assistant and knows neither a server address nor a bundle. Same category as the onboarding screen and `LiveFahrt`.
+- **`Tankvolumen` and `Zusatz`** are in the data model but editable nowhere in the panel, so their editors were removed here per the owner's rule. They are now only changeable in the profile file — say the word and they get an editor in the panel instead.
+
+Verified: `npm run typecheck` clean and `npm test` 147/147 after every step, `npm run build` clean, `node --check` on the panel bundle, live comparison at 375×812 for every screen touched. Manifest `2026.8.30.5`, `npm run ota` rebuilt (`bundle.zip` 255,695 bytes, sha256 `43fdc62a88cc212d98a808239c650e1d6a3cb33c243a576ef36014c0b8948943`), integration redeployed to `audi_ha_test`, clean restart with no traceback, and the font fix confirmed live in the panel.
+
+**Tooling note worth keeping:** do not use `perl -pi -e 's|...|...|'` on these files. A pattern containing an escaped `|` terminated early, the substitution then matched every line, and `MeinAudi.tsx` came back with the replacement prepended to all 250 lines. It was fully reversible (the injection is deterministic), but the safe path is a small Node script that reads the file, checks the anchor exists, replaces once, and preserves CRLF — the source files are CRLF and a naive newline pattern will silently not match.
+
+---
+
+
+
+## AN. Design audit follow-through: the five priority items, and what measuring first changed (2026.8.30.6/.7)
+
+Working through the priority list of the design audit published at
+https://claude.ai/code/artifact/cb5bcae6-5ca5-43c1-a575-cdff96eb2a54. Every item was applied to
+**both** codebases (parity rule) and verified live at 375x812 against `audi_ha_test`.
+
+**1. Statistik tiles had no expand affordance** - the five collapsible tiles looked like fixed
+readouts. The rotating chevron the accordion rows already use now sits in the tile head
+(`.stat-kopfzeile` + `.mark` in the panel, `dm-statkopf__kopfzeile` + `ads-mark` in the app).
+
+**2. Lists ran newest-last inside a newest-first frame.** Years descended while months and rows
+ascended, so the newest trip sat at the bottom, off screen. Panel got `neuesteZuerst()` for
+`vTrips()`/`vFuel()`; the app's `nachJahrUndMonat()` went fully descending. `teaser()` in the panel
+was picking `TRIPS[0]`/`FILLS[0]` - the *oldest* record - under headings reading "Letzte Fahrt";
+it now sorts by timestamp.
+
+**3. `--fg3` on light ground was 2.92:1** against the page and 3.26:1 against a tile - too little
+for a glance in sunlight. Darkened to `#6B6B70` (4.75:1 / 5.30:1) in `audi-dashboard-ios.css` and
+`design-system`'s day theme; the night value stays `#8E8E93` (already 5.86:1). Verified live in
+both: day `#6B6B70`, night unchanged.
+
+**4. The type scale - and here measuring first changed the fix entirely.** The audit counted
+*declared* sizes and found fourteen distinct values below 18px, which reads as a badly fragmented
+scale. Measuring the **effective** `font-size` of every text element across eleven panel views told
+a different story: a clean seven-step backbone (11 / 12.5 / 13 / 14 / 15 / 16 / 17) already carried
+**96%** of 621 elements, with 27 stragglers sitting one notch beside a real step. Most of the
+declared values never reached the screen at all, because the always-loaded iOS overlay overrides
+them - the same trap recorded twice before in this file.
+
+So the fix is narrow, not a restructure: snap the stragglers onto the nearest step
+(11.5 -> 12.5, 12 -> 12.5, 13.5 -> 13, 14.5 -> 14, 16.5 -> 16), applied as one mechanical
+substitution across panel CSS, panel inline styles, companion-app CSS and `design-system` at once,
+so the two sides cannot drift apart on it. Nothing moves more than 1px. Also fixed: `` in the
+accordion head had no rule of its own and inherited the UA's `smaller` (0.833x) - 10.4px, below the
+11px floor this project took from Apple's guidance; it now has an explicit 11px.
+
+Deliberately untouched: `font-size: max(11px, .32em)` on the unit beside the large figures. Its 12.8
+and 14.72px readings are that rule scaling with a 40px and a 46px figure, which is the point of it.
+
+Re-measured afterwards across the same eleven views: **11 / 12.5 / 13 / 14 / 15 / 16 / 17**, nothing
+else, plus the two intentional relative values. Fourteen values down to seven.
+
+**5. The Ubersicht carried its two heaviest tiles in front of its lightest.** Without a stored photo
+the placeholder still occupied 120px directly above the range - the most important number on the
+page - and "Zuletzt", two short and frequently read lines, sat below a 190px map and therefore below
+the fold on a phone. Placeholder narrowed to 72px (kept, not removed: it is the only sign that this
+image slot exists), and "Zuletzt" moved in front of the location card in both codebases.
+
+**Found while verifying, fixed too:** the app drew the Ubersicht service chevron as the text
+character "›" at 15px, where the panel draws `.go`, a 6x10 SVG polyline at stroke-width 1.4 -
+visibly a different shape and weight from every other chevron in the app. Now the same SVG.
+
+**Also fixed, from the owner's report "ubersicht/karte: hier stimmt ios noch nicht zum panel":** the
+location preview drew the wrong pin. `fahrzeugMarkerSVG()` in the panel switches icon sets by size -
+at or above 34px the 48-grid drawing, below it the 24-grid one, which is drawn for small sizes. The
+app always used the 48-grid one, so the 32px preview showed a drawing meant to be seen at 38px+. The
+app now mirrors the same switch, and the preview's map background is pinned to Leaflet's own #ddd,
+which is what the panel actually shows (its own `var(--tile)` declaration loses to
+`.leaflet-container`). Verified byte-identical afterwards: same marker markup (1087 characters, same
+hash), same `translate3d(172px, 95px, 0)`, same drop-shadow, same colour.
+
+Verified: `node --check` on the panel bundle, `design-system` rebuilt, companion-app `tsc --noEmit`
+clean and 147/147 green after every step, `npm run build` clean. Live at 375x812 the Ubersicht of
+both now yields the same text and the same size distribution (11x1, 12.5x3, 12.8x1, 13x8, 15x3,
+16x3) and the same tile order. Manifest `2026.8.30.6`, then `2026.8.30.7` once the chevron fix
+changed the app after the first bundle - two different bundles must never share one version number.
+`npm run ota` rebuilt (`bundle.zip` 256.124 bytes, sha256
+`556b8e7b43277366921e927ce56f8f748e0b7e5efaf021040fcfd99f0027e8c2`), redeployed to `audi_ha_test`,
+clean restart.
+
+**Header padding: the one place where copying the panel's number was wrong (2026.8.30.8).** The
+owner asked why the iOS app shows a large gap above the headline. Measured: 105px, made of a 49px
+"Diese App ist älter als der Server" band - the message itself, not a layout fault - and 56px of
+header padding. That 56px is a faithful copy of the panel (`.topbar{padding:56px 20px 4px 16px}` in
+the iOS overlay, confirmed live). It is also the one case found so far where copying the panel
+exactly produces a *different* result: in the panel those 56px sit below Home Assistant's own header
+bar, while the native shell has nothing above them but the status bar. Same number, different
+picture. On the owner's instruction the added padding is gone; `.dm-kopf`/`.dm-kopf--unterseite` now
+carry `env(safe-area-inset-top, 0px)` alone, so the status bar stays clear on the device while the
+headline starts at the top everywhere without an inset. Deliberate, disclosed divergence from the
+panel - do not "fix" it back by matching the number again.
+
+**Committed and pushed** at the end of this session, after rebasing onto `25c0d07` (an `.ipa` refresh
+pushed from elsewhere, no overlap).
---
diff --git a/companion-app/src/App.tsx b/companion-app/src/App.tsx
index dfa7ce9..c74648d 100644
--- a/companion-app/src/App.tsx
+++ b/companion-app/src/App.tsx
@@ -80,6 +80,9 @@ function AngemeldeteApp({ beiAbmeldung }: { beiAbmeldung: () => void }) {
route={route}
geheZu={geheZu}
tabBeschriftung={tabBeschriftung}
+ statusStand={daten.statusStand}
+ // Ziehen zum Aktualisieren gibt es im Panel nur auf der Übersicht.
+ beiAktualisieren={route.name === "home" ? daten.jetztAktualisieren : undefined}
hinweis={
Promise) | undefined
/** Heißt `children`, weil JSX-Verschachtelung genau diesen Namen erwartet. */
children: ReactNode
}
+/** Ziehen zum Aktualisieren, 1:1 nach der ptr-Logik des Panels. */
+const PTR_SCHWELLE = 56
+
+function useZiehenAktualisieren(
+ inhalt: RefObject,
+ beiAktualisieren: (() => Promise) | undefined,
+) {
+ const [zug, setzeZug] = useState(0)
+ const [laedt, setzeLaedt] = useState(false)
+ const start = useRef(null)
+
+ if (!beiAktualisieren) {
+ return { zug: 0, laedt: false, handler: {} as Record }
+ }
+
+ const beenden = () => {
+ if (start.current === null) return
+ start.current = null
+ if (zug >= PTR_SCHWELLE) {
+ setzeLaedt(true)
+ void beiAktualisieren().finally(() => {
+ setzeLaedt(false)
+ setzeZug(0)
+ })
+ } else {
+ setzeZug(0)
+ }
+ }
+
+ return {
+ zug,
+ laedt,
+ handler: {
+ onPointerDown: (e: ReactPointerEvent) => {
+ if (!e.isPrimary || laedt) return
+ if ((inhalt.current?.scrollTop ?? 0) > 0) return
+ start.current = e.clientY
+ setzeZug(0)
+ },
+ onPointerMove: (e: ReactPointerEvent) => {
+ if (start.current === null || !e.isPrimary) return
+ const dy = e.clientY - start.current
+ if (dy > 0 && (inhalt.current?.scrollTop ?? 0) <= 0) {
+ // Widerstand wie bei iOS: halbe Strecke, gedeckelt bei 90px.
+ setzeZug(Math.min(90, dy * 0.5))
+ } else {
+ start.current = null
+ setzeZug(0)
+ }
+ },
+ onPointerUp: beenden,
+ onPointerCancel: beenden,
+ },
+ }
+}
+
const BEREICHE: { key: Hauptbereich; label: string; icon: ReactNode }[] = [
{ key: "home", label: "Übersicht", icon: },
{ key: "audi", label: "Mein Audi", icon: },
@@ -43,13 +106,33 @@ const BEREICHE: { key: Hauptbereich; label: string; icon: ReactNode }[] = [
{ key: "fuel", label: "Tanken", icon: },
]
-export function Shell({ route, geheZu, tabBeschriftung, hinweis, children }: ShellProps) {
+export function Shell({
+ route,
+ geheZu,
+ tabBeschriftung,
+ hinweis,
+ statusStand,
+ beiAktualisieren,
+ children,
+}: ShellProps) {
const breit = useBreiterBildschirm()
const aktiverBereich = bereichVon(route.name)
const zurueckZiel = ZURUECK[route.name]
+ const unterseite = !istHauptbereich(route.name)
+ const inhaltRef = useRef(null)
+ const ptr = useZiehenAktualisieren(inhaltRef, breit ? undefined : beiAktualisieren)
+
+ // Der Text tickt mit, wie standAlterTicken() im Panel (Sekundentakt).
+ const [, neuZeichnen] = useState(0)
+ useEffect(() => {
+ if (route.name !== "home") return undefined
+ const uhr = window.setInterval(() => neuZeichnen((n) => n + 1), 1000)
+ return () => window.clearInterval(uhr)
+ }, [route.name])
+
const kopf = (
-
+
{zurueckZiel && !breit ? (
) : null}
+ {/* Kein Eyebrow: das Panel blendet seinen (`.eyebrow{display:none}` in
+ audi-dashboard-ios.css) auf Telefonbreite vollständig aus - der feste
+ Text "DataMetric360" stand hier über jedem Bildschirm, im Panel steht
+ dort nichts. */}
- DataMetric360
{TITEL[route.name]}
+ {/* Datenstand nur auf der Übersicht, wie `#sync` im Panel. */}
+ {route.name === "home" && (
+
+
+ {standAlter(statusStand)}
+
+ )}
{/* `kopf` wird nur in der schmalen Spalte gerendert (breit hat seinen
eigenen Seitenleisten-Kopf, siehe unten) - dort sind die Audi-Ringe
oben rechts der einzige Zugang zu Einstellungen, das Zahnrad
entfällt, "damit oben rechts nur ein Element sitzt" (Design-Audit
2026-08-13, siehe .rings/.profilbtn in audi-dashboard-ios.css).
- Companion-app zeigte hier bisher immer ein Zahnrad, unabhängig von
- der Bildschirmbreite - echte Abweichung, nicht nur Kosmetik: es gab
- keinen Rings-Zugang in Telefonbreite. */}
-
+ Nur auf den Tab-Ebenen: auf Unterseiten blendet das Panel die Ringe
+ aus (`#marke`.style.display in render()), dort steht links der
+ Zurück-Pfeil. */}
+ {!unterseite ? (
+
+ ) : null}
)
@@ -143,7 +237,25 @@ export function Shell({ route, geheZu, tabBeschriftung, hinweis, children }: She
{hinweis}
{kopf}
- {children}
+ {/* Ziehen zum Aktualisieren wie im Panel (`.ptr`): das Band wächst
+ während der Geste aus der Höhe 0 heraus. */}
+
- Der Ladezustand wird aus dem Tagesminimum geschätzt — das ist die Spannung kurz nach dem
- Start, bevor die Lichtmaschine sie anhebt. Der Trend vergleicht die frühere mit der
- späteren Hälfte des Zeitraums; er ist ein Hinweis, keine Kapazitätsmessung.
-
)}
>
)
diff --git a/companion-app/src/screens/BatterieListe.tsx b/companion-app/src/screens/BatterieListe.tsx
index 38b936c..afd7d65 100644
--- a/companion-app/src/screens/BatterieListe.tsx
+++ b/companion-app/src/screens/BatterieListe.tsx
@@ -19,7 +19,7 @@ import { Pill, Tile } from "@audi-dash/ui"
import { ENTITAETEN } from "../api"
import { useDaten } from "../daten/DatenKontext"
-import { datum, datumZeit, de } from "../format"
+import { datum, datumUndZeit, de } from "../format"
import { Leerzustand } from "./bausteine"
import { AGM_RUHE_MAX_V } from "./Batterie"
import { Zeilenmenue } from "./Zeilenmenue"
@@ -86,11 +86,11 @@ export function BatterieListe() {
{de(t.min!, 2)} V
- {t.min_temp_c != null ? `${de(t.min_temp_c, 1)} °C` : "—"}
+ {t.min_temp_c != null ? `${de(t.min_temp_c, 1)} °C` : "–"}
- {t.min_ts ? datumZeit(t.min_ts) : datum(t.datum)}
+ {t.min_ts ? datumUndZeit(t.min_ts) : datum(t.datum)}
{t.min! > AGM_RUHE_MAX_V && Generatorspannung}
diff --git a/companion-app/src/screens/Bild.tsx b/companion-app/src/screens/Bild.tsx
index 89589ec..a4fd2e6 100644
--- a/companion-app/src/screens/Bild.tsx
+++ b/companion-app/src/screens/Bild.tsx
@@ -16,21 +16,27 @@ export function Bild({
beschreibung,
name,
groesse,
+ dateiZeigen,
}: {
datei: string | null | undefined
beschreibung: string
name: string
groesse?: "default" | "mini" | "round"
+ /** Zeigt den Dateinamen statt der Handlungsaufforderung - so macht es das
+ Panel auf der Einstellungen-Seite (dateiZeigen in bildMitPlatzhalter()). */
+ dateiZeigen?: boolean
}) {
const url = bildUrl(datei)
- // Der Dateiname hilft nur, wenn er lesbar ist — in der 78px breiten
- // Miniaturansicht liefe er über den Rand hinaus.
- const mitDateiname = groesse !== "mini" && groesse !== "round"
+ // Unter der Bezeichnung steht im Panel die Handlungsaufforderung, nicht der
+ // Dateiname (`.platzhalter-aktion` zeigt "Foto hinzufügen";
+ // `.platzhalter-datei` ist dort ausdrücklich ausgeblendet). In der 78px
+ // breiten Miniaturansicht bleibt kein Platz dafür.
+ const mitAktion = groesse !== "mini" && groesse !== "round"
return (
diff --git a/companion-app/src/screens/Einstellungen.tsx b/companion-app/src/screens/Einstellungen.tsx
index 3c2ec3f..dbe5806 100644
--- a/companion-app/src/screens/Einstellungen.tsx
+++ b/companion-app/src/screens/Einstellungen.tsx
@@ -14,11 +14,10 @@ import { eigeneVersion } from "../daten/appVersion"
import { useDaten } from "../daten/DatenKontext"
import { OtaFehler, buendelAnwenden, buendelPasst, otaMoeglich } from "../daten/ota"
import type { Einstellungen as EinstellungenWerte } from "../daten/profilAdapter"
-import { datumZeit, de, isoTag } from "../format"
-import { useTheme } from "../theme"
-import { Wertzeile, Werteliste, bestaetigen } from "./bausteine"
-import { Bild } from "./Bild"
-import { BILDPLAETZE, markenlogoUrl } from "./bilder"
+import { datumZeit, isoTag } from "../format"
+import { useBoden, useTheme } from "../theme"
+import { BildMitMenue, Wertzeile, Werteliste, bestaetigen } from "./bausteine"
+import { BILDPLAETZE, SEITE_WINTER, markenlogoUrl } from "./bilder"
import { DatensatzPopup } from "./DatensatzPopup"
import { HistorienImport } from "./HistorienImport"
import type { ServicebuchEintrag } from "./Service"
@@ -49,6 +48,13 @@ export function Einstellungen({
neuLaden,
} = useDaten()
const [theme, themeSetzen] = useTheme()
+ const [boden, setzeBoden] = useBoden()
+ // "Fahrzeug einrichten" ist im Panel zugeklappt und oeffnet sich ueber den
+ // Knopf darunter (einrichtenOffen in vEinst()).
+ const [einrichtenOffen, setzeEinrichtenOffen] = useState(false)
+ // Erstzulassung liegt am Fahrzeug, nicht an den Einstellungen - deshalb ein
+ // eigener Entwurf, der beim Speichern mitgeschrieben wird.
+ const [erstzulassung, setzeErstzulassung] = useState(null)
const [entwurf, setzeEntwurf] = useState(null)
const [laeuft, setzeLaeuft] = useState(false)
const [gespeichert, setzeGespeichert] = useState(false)
@@ -161,6 +167,13 @@ export function Einstellungen({
if (!einstellungen || !fahrzeug) return null
const werte = entwurf ?? einstellungen
+ const erstzulassungWert = erstzulassung ?? fahrzeug.erstzulassung
+ // Bei Winterraedern zeigt die Seitenansicht das Winterfoto - wie bildInfo()
+ // im Panel, das hier dieselbe Vorschau liefert.
+ const gewaehltesBild =
+ werte.startbild === "seitenansicht.webp" && fahrzeug.reifen.aktiv === "Winter"
+ ? { datei: SEITE_WINTER.datei, beschreibung: SEITE_WINTER.beschreibung }
+ : (BILDPLAETZE.find((b) => b.datei === werte.startbild) ?? BILDPLAETZE[0]!)
const aendern = (teil: Partial) =>
setzeEntwurf({ ...werte, ...teil })
@@ -170,8 +183,12 @@ export function Einstellungen({
setzeLaeuft(true)
setzeGespeichert(false)
try {
- await profilSpeichern({ einstellungen: entwurf })
+ await profilSpeichern({
+ einstellungen: entwurf,
+ ...(erstzulassung !== null ? { fahrzeug: { ...fahrzeug, erstzulassung } } : {}),
+ })
setzeEntwurf(null)
+ setzeErstzulassung(null)
setzeGespeichert(true)
} finally {
setzeLaeuft(false)
@@ -243,99 +260,97 @@ export function Einstellungen({
return (
<>
+ {/* Aufbau, Reihenfolge und Wortlaut wie vEinst(): „Fahrzeug einrichten"
+ (aufklappbar), Darstellung, Bild der Übersicht, Kraftstoff-Rabatt,
+ Fahrten zusammenfassen, Fahrzeugprofil, Backup, Version,
+ Integration-Update. Vorher standen die Abschnitte in anderer
+ Reihenfolge und unter eigenen Namen („Tankrabatt", „Sicherung",
+ „Vergangene Daten", „Bild auf der Übersicht"). */}
- Fahrzeug
-
- aendern({ fahrzeugtitel: e.target.value })}
- />
-
-
- aendern({ fahrzeugzusatz: e.target.value })}
- />
-
-
- aendern({ kennzeichen: e.target.value })}
- />
-
-
- aendern({ tankvolumen: Number(e.target.value) || 0 })}
- />
-
-
-
-
- {/* Panel-Wortlaut: "Fahrten zusammenfassen" / "Pause bis" - war hier
- als "Fahrten"/"Pause zwischen zwei Fahrten" eigenständig
- formuliert, brach dadurch in der 16px-Label-Spalte (Parität-Audit
- 2026-08-30, Feld-Label-Korrektur) Wort für Wort um. */}
- Fahrten zusammenfassen
-
- aendern({ pauseMin: Number(e.target.value) || 0 })}
- />
-
-
- aendern({ nachtVon: e.target.value })}
- />
-
-
- aendern({ nachtBis: e.target.value })}
- />
-
-
- Setzt das Fahrzeug innerhalb der Pausenzeit die Fahrt fort, zählt das als eine Fahrt und
- nicht als zwei — etwa bei einem Tankstopp.
-
+ Fahrzeug einrichten
+ {einrichtenOffen && (
+ <>
+
+ aendern({ fahrzeugtitel: e.target.value })}
+ />
+
+
+ aendern({ kennzeichen: e.target.value })}
+ />
+
+
+ setzeErstzulassung(e.target.value)}
+ />
+
+
+ aendern({ ausfuehrung: e.target.value })}
+ />
+
+ {/* „Setup — Sensoren zuordnen" bleibt dem Panel vorbehalten: die
+ Zuordnung von Home-Assistant-Entitäten setzt eine angemeldete
+ HA-Sitzung voraus, die diese App nicht hat. */}
+ setzeImportOffen(true)}>
+ Daten importieren aus Home Assistant
+
+
+ Legt Fahrten, Tankvorgänge und Spannungswerte für einen vergangenen Zeitraum
+ nachträglich an — aus dem Verlauf, den Home Assistant zu den zugeordneten Sensoren
+ bereits aufgezeichnet hat.
+
+ >
+ )}
+ setzeEinrichtenOffen((offen) => !offen)}
+ >
+ {einrichtenOffen ? "Fertig" : "Einrichten"}
+ Darstellung
-
- themeSetzen(neu as "nacht" | "tag")}
- />
-
-
+ themeSetzen(neu as "nacht" | "tag")}
+ />
+
+
+ Aus zeigt nur die Symbole und gibt etwas Höhe frei
+
+
+
+
+
+ Angedeutete Fahrbahn mit Schatten, nur bei Außenansichten
+
- Bild auf der Übersicht
-
+ Bild der Übersicht
+
-
- {BILDPLAETZE.map((platz) => (
-
- ))}
+
+ Auf das Bild tippen, um für diese Ansicht ein eigenes Foto hochzuladen oder zu ersetzen.
+
+ {/* Vorher stand hier ein Raster aller sieben Miniaturen und der Hinweis,
+ Fotos seien nur über Home Assistant zu pflegen — das Panel zeigt
+ genau die gewählte Ansicht groß und lädt direkt hoch. */}
+
+
-
- Fotos lädst du über die Verwaltung im Home Assistant hoch. Die Dateinamen sind fest
- vergeben — der Server nimmt nur diese an.
-
- Tankrabatt
+ Kraftstoff-Rabatt
@@ -379,7 +392,9 @@ export function Einstellungen({
e.currentTarget.style.display = "none"
}}
/>
- {werte.markenname}-Rabatt aktiv
+ {/* Das Panel nennt den Schalter "SmartDeal aktiv" - fest, nicht
+ aus dem Markennamen gebaut. */}
+ SmartDeal aktiv
}
last={!fahrzeug.smartdeal.aktiv}
@@ -394,7 +409,7 @@ export function Einstellungen({
},
})
}
- aria-label="Tankrabatt aktiv"
+ aria-label="SmartDeal aktiv"
/>
{fahrzeug.smartdeal.aktiv ? (
@@ -414,31 +429,31 @@ export function Einstellungen({
}
/>
-
- Das Datum gilt einschließlich — am Stichtag selbst zählt der Rabatt noch, erst am
- Folgetag schaltet er ab.
-
>
) : (
-
Ersparnis und Bildmarke werden ausgeblendet.
+
+ Ersparnis und Bildmarke werden ausgeblendet
+
)}
- {/* Nachträglicher Import aus dem HA-Verlauf. Steht bewusst vor
- „Sicherung": beides holt Daten von außen in die App, und der Import
- ist der Schritt, den man einmal nach der Einrichtung braucht. */}
+ {/* „Nacht beginnt"/„Nacht endet" sind entfallen: das Panel fuehrt sie
+ in den Einstellungen nicht, die Nachtgrenze steht dort nur als
+ Erlaeuterung auf der Statistik-Seite. */}
- Vergangene Daten
-
- Legt Fahrten, Tankvorgänge und Spannungswerte für einen vergangenen Zeitraum
- nachträglich an — aus dem Verlauf, den Home Assistant zu den zugeordneten Sensoren
- bereits aufgezeichnet hat.
-
-
- setzeImportOffen(true)}>
- Daten importieren aus Home Assistant
-
-
+ Fahrten zusammenfassen
+
+ aendern({ pauseMin: Number(e.target.value) || 0 })}
+ />
+
+
+ Steigst du kürzer als diese Zeit aus — etwa zum Tanken —, bleibt es eine
+ zusammenhängende Fahrt statt zweier
+
- Sicherung
-
+ Fahrzeugprofil
+
+ Alles Fahrzeugspezifische liegt in einer einzigen Datei: Stammdaten, technische Daten,
+ Ausstattung, Reifen, Versicherung, Steuer und Werkstatt. Fahrten, Tankvorgänge und der
+ Wartungsplan lassen sich einzeln als CSV sichern und bearbeitet wieder einspielen — eine
+ Zeile mit bekannter ID aktualisiert nur ihre eigenen Spalten, alles andere bleibt
+ unangetastet.
+
- Alles Fahrzeugspezifische liegt in einer einzigen Datei: Stammdaten, technische Daten,
- Ausstattung, Reifen, Versicherung, Steuer und Werkstatt. Fahrten, Tankvorgänge und der
- Wartungsplan lassen sich einzeln als CSV sichern und bearbeitet wieder einspielen — eine
- Zeile mit bekannter ID aktualisiert nur ihre eigenen Spalten, alles andere bleibt
- unangetastet.
-
Lädt die Oberfläche neu und startet die App neu. Fahrzeugprofil, Fahrten und
Tankvorgänge sind davon nicht betroffen — die liegen in Home Assistant.
@@ -556,7 +572,7 @@ export function Einstellungen({
{otaFehler &&
{otaFehler}
}
>
) : (
-
+
{otaBuendel
? `Diese App ist aktuell (${eigeneVersion() ?? "unbekannte Version"}).`
: "Der Server hat gerade kein Update-Bündel hinterlegt."}
@@ -590,20 +606,20 @@ export function Einstellungen({
{updateInstallierenLaeuft ? (
-
+
Installiere …
) : updateNeustartLaeuft ? (
-
+
Home Assistant startet neu …
) : integrationUpdate?.installiert ? (
<>
-
+
Version {integrationUpdate.version} installiert - die neue Fassung wird erst nach
einem Neustart geladen.
@@ -618,7 +634,7 @@ export function Einstellungen({
}
/>
-
+
Lädt die neueste Fassung von Gitea und ersetzt den Integrationsordner. Home Assistant
muss danach neu gestartet werden. Fahrzeugprofil, Fahrten und Tankvorgänge sind davon
nicht betroffen.
@@ -632,13 +648,13 @@ export function Einstellungen({
) : updatePruefenLaeuft ? (
-
+
Prüfe …
) : (
<>
-
+
{integrationUpdate
? `Integration ist aktuell (${integrationUpdate.geprueft_am ? datumZeit(integrationUpdate.geprueft_am) : ""}).`
: "Noch nicht geprüft."}
@@ -658,21 +674,17 @@ export function Einstellungen({
!updateNeustartLaeuft &&
{integrationUpdate.fehler}
}
+ {/* Ohne Entsprechung im Panel - und zwar notwendigerweise: das Panel
+ laeuft innerhalb von Home Assistant und kennt keine Serveradresse und
+ kein Token, die man wechseln koennte. Bleibt deshalb bestehen (wie
+ der Willkommensbildschirm). Die beiden reinen Zaehlzeilen darueber
+ („Fahrten gespeichert"/„Tankvorgaenge gespeichert") sind entfallen -
+ die waren Zusatz ohne Panel-Vorbild. */}
Zugang
-
-
-
- >
- }
- />
-
- void abmelden()}>
- Verbindung trennen
-
-
+ void abmelden()}>
+ Verbindung trennen
+
{gespeichert &&
Gespeichert.
}
diff --git a/companion-app/src/screens/FahrtDetail.tsx b/companion-app/src/screens/FahrtDetail.tsx
index a87f18b..163465b 100644
--- a/companion-app/src/screens/FahrtDetail.tsx
+++ b/companion-app/src/screens/FahrtDetail.tsx
@@ -11,12 +11,13 @@
import { useState } from "react"
-import { ActionButton, Feld, Pill, Tile } from "@audi-dash/ui"
+import { ActionButton, Feld, Fig, Pill, Tile } from "@audi-dash/ui"
import type { Fahrt } from "../api"
import { useDaten } from "../daten/DatenKontext"
import { datum, dauer, de, deOderStrich, uhrzeit } from "../format"
-import { Leerzustand, Wertzeile, Werteliste } from "./bausteine"
+import type { SeitenName } from "../navigation"
+import { Leerzustand, Wertzeile, Werteliste, bestaetigen } from "./bausteine"
import { FahrtFelderFormular, fahrtFelderAusFahrt, fahrtFelderAuswerten } from "./FahrtFelder"
import { Karte } from "./Karte"
@@ -28,8 +29,8 @@ function alsDatetimeLocal(iso: string): string {
return new Date(d.getTime() - versatz).toISOString().slice(0, 16)
}
-export function FahrtDetail({ id }: { id: string | undefined }) {
- const { fahrten } = useDaten()
+export function FahrtDetail({ id, geheZu }: { id: string | undefined; geheZu: (name: SeitenName) => void }) {
+ const { fahrten, api } = useDaten()
const fahrt = fahrten.find((f) => f.trip_id === id)
const [bearbeitenOffen, setzeBearbeitenOffen] = useState(false)
@@ -42,73 +43,31 @@ export function FahrtDetail({ id }: { id: string | undefined }) {
)
}
+ const loeschen = () => {
+ if (!fahrt || !bestaetigen("Fahrt löschen?")) return
+ void api.fahrtLoeschen(fahrt.trip_id)
+ geheZu("trips")
+ }
+
if (bearbeitenOffen) {
return setzeBearbeitenOffen(false)} />
}
const hatPositionen = fahrt.start_lat != null && fahrt.start_lon != null
+ /* Aufbau 1:1 wie vTrip(): Karte, dann die randlose Distanz-Kachel mit der
+ 52px-Zahl und der Art-Pille darunter, dann eine einzige Wertezeilen-Kachel
+ (Start/Ziel/Start- und Endkilometer/Dauer/Verbrauch) mit „Werte
+ bearbeiten", zuletzt „Fahrt löschen".
+
+ Vorher stand hier eine eigene Kopfzeile mit Datumsbereich und
+ Bearbeiten-Textknopf, die Werte in anderer Reihenfolge und unter anderen
+ Namen („Kilometerstand Beginn/Ende"), eine Zeile „Durchschnitt", die es im
+ Panel nicht gibt, zwei zusätzliche Erklärabsätze und Start/Ziel erst ganz
+ unten unter der Karte. */
return (
<>
-
-
- Diese Fahrt wartet noch auf den Kilometerstand. Das Fahrzeug meldet ihn oft erst bei der
- nächsten Fahrt — die Strecke wird dann automatisch ergänzt.
-
+
+
+
@@ -136,16 +108,37 @@ export function FahrtDetail({ id }: { id: string | undefined }) {
wert={`${datum(fahrt.ts_end)} · ${uhrzeit(fahrt.ts_end)} Uhr`}
zusatz={fahrt.end_address ?? "unbekannt"}
/>
+
+
+
+
>
}
/>
+ setzeBearbeitenOffen(true)}>Werte bearbeiten
+
+ void loeschen()}>
+ Fahrt löschen
+
>
)
}
-/** Bearbeiten-Formular für eine bestehende Fahrt - dieselbe Feldgruppe wie
- beim Neuanlegen (FahrtFelder.tsx), vorbelegt mit den aktuellen Werten. */
function FahrtBearbeiten({ fahrt, beiFertig }: { fahrt: Fahrt; beiFertig: () => void }) {
const { api } = useDaten()
const [start, setzeStart] = useState(alsDatetimeLocal(fahrt.ts_start))
diff --git a/companion-app/src/screens/Fahrten.tsx b/companion-app/src/screens/Fahrten.tsx
index 55afc83..ebe6d02 100644
--- a/companion-app/src/screens/Fahrten.tsx
+++ b/companion-app/src/screens/Fahrten.tsx
@@ -5,13 +5,13 @@
import { useState } from "react"
-import { Accordion, ActionButton, Feld, Pill, Tile } from "@audi-dash/ui"
+import { Accordion, ActionButton, Feld, Tile } from "@audi-dash/ui"
import { useDaten } from "../daten/DatenKontext"
import { nachJahrUndMonat } from "../daten/statistik"
-import { datum, dauer, de, deOderStrich, monatJahr, summe, uhrzeit } from "../format"
+import { datum, de, summe } from "../format"
import type { SeitenName } from "../navigation"
-import { Leerzustand } from "./bausteine"
+import { Blattzeile, Leerzustand } from "./bausteine"
import { FahrtFelderFormular, LEERE_FAHRT_FELDER, fahrtFelderAuswerten } from "./FahrtFelder"
import type { FahrtFelderEingabe } from "./FahrtFelder"
import { Zeilenmenue } from "./Zeilenmenue"
@@ -28,88 +28,104 @@ function strecke(fahrt: { start_address?: string | null; end_address?: string |
return `${a} → ${b}`
}
+/** artText() im Panel: erster Buchstabe groß, sonst unverändert. */
+function artText(art: string | null | undefined): string {
+ return art ? art.charAt(0).toUpperCase() + art.slice(1) : ""
+}
+
export function Fahrten({ geheZu }: { geheZu: (name: SeitenName, id?: string) => void }) {
const { fahrten, api } = useDaten()
const [formularOffen, setzeFormularOffen] = useState(false)
const gruppen = nachJahrUndMonat(fahrten, (f) => f.ts_start)
+ /* Aufbau 1:1 wie vTrips(): eine einzige Kachel um alle Jahre, die
+ Fahrtenzahl steht in der Jahreszeile (nicht als eigene Überschrift über
+ der Liste), die Monatszeile nennt nur den Monat, und das Formular steht
+ unter der Liste statt darüber. Die Zeilen selbst sind Blattzeilen mit der
+ Strecke als Hauptangabe und "Datum · Art" darunter — hier standen bisher
+ die Kilometer vorn und alles andere in einer langen Fußzeile, dazu zwei
+ Pillen (Arbeitsweg/offen), die es im Panel nicht gibt: die Art steht dort
+ im Zusatz der Beschriftung, der Status im Zusatz des Werts. */
return (
<>
-
-
- kalenderDateiLaden("Ölwechsel", prognose.datum, "Ölwechsel laut eigener Prognose")
- }
- >
- In den Kalender eintragen
-
-
- )}
-
- Die eigene Prognose rechnet ab dem letzten Eintrag der jeweiligen Art im Wartungsplan neu
- und nutzt die seither tatsächlich gefahrene Strecke. Sie ersetzt die Meldung des
- Fahrzeugs nicht, sondern ergänzt sie.
-
+ {/* Kein Kalenderknopf und keine Erklärung in dieser Kachel: das Panel
+ führt beides in "Termin vereinbaren" darunter. */}
-
+
+
+ {/* Statt zweier Navigationskacheln zeigt das Panel Autohaus und
+ Wartungsplan hier vollständig — mit Anschrift, Rufnummer, E-Mail und
+ Kartenlink bzw. der Liste der Einträge. */}
+
+ Autohaus
+ geheZu("werkstatt")} />
+
{autohaus.name ?? ""}
+
+ {autohaus.adresse ?? ""}
+
+ {autohaus.tel && (
+
+ {autohaus.tel}
+
+ )}
+ {autohaus.mail && (
+
+ E-Mail schreiben
+
+ )}
+
+ In Karten öffnen
+
+
+
+
+ Wartungsplan
+ {buch.length > 0 ? (
+ buch.map((eintrag, i) => (
+ geheZu("sbuch", String(i))}
+ letzte={i === buch.length - 1}
+ />
+ ))
+ ) : (
+
+ )}
+ geheZu("sbuch", "neu")}>
+ Eintrag hinzufügen
+
+
>
)
}
+/** `Termin vereinbaren` aus vService(): Art wählen, Datum setzen, ICS laden. */
+function TerminVereinbaren() {
+ const { fahrzeug, profilSpeichern } = useDaten()
+ const [art, setzeArt] = useState("Ölwechsel")
+ const vereinbart = (fahrzeug?.service["vereinbart"] ?? {}) as Record
+ const [datumWert, setzeDatumWert] = useState(() => vereinbart[art] ?? "")
+
+ if (!fahrzeug) return null
+
+ const merken = async (neuesDatum: string) => {
+ setzeDatumWert(neuesDatum)
+ await profilSpeichern({
+ fahrzeug: {
+ ...fahrzeug,
+ service: { ...fahrzeug.service, vereinbart: { ...vereinbart, [art]: neuesDatum } },
+ },
+ })
+ }
+
+ const verwerfen = async () => {
+ setzeDatumWert("")
+ const rest = { ...vereinbart }
+ delete rest[art]
+ await profilSpeichern({
+ fahrzeug: { ...fahrzeug, service: { ...fahrzeug.service, vereinbart: rest } },
+ })
+ }
+
+ return (
+
+ Termin vereinbaren
+
+
+
+
+ void merken(e.target.value)}
+ />
+
+ kalenderDateiLaden(art, datumWert || isoTag(), `${art} in der Werkstatt`)}
+ >
+ In den Kalender übernehmen
+
+ {vereinbart[art] && void verwerfen()}>Termin verwerfen}
+
+ )
+}
+
export function Werkstatt() {
const { fahrzeug, profilSpeichern } = useDaten()
const autohausRoh = (fahrzeug?.service["autohaus"] ?? {}) as Autohaus
@@ -268,7 +374,7 @@ export function Werkstatt() {
return (
- Werkstatt
+ Angaben zum Autohaus
{feld("name", "Name")}
{feld("adresse", "Adresse")}
{feld("tel", "Telefon")}
@@ -296,14 +402,40 @@ export function Werkstatt() {
)
}
-export function Servicebuch() {
+/** Arten wie SERVICE_ARTEN im Panel. */
+const SERVICE_ARTEN = ["Ölwechsel", "Inspektion", "Hauptuntersuchung", "Reparatur", "Sonstiges"]
+
+/**
+ * Ein einzelner Wartungsplan-Eintrag. Vorlage: `vSbuch()` — dort ist diese
+ * Route immer die Detail-/Bearbeitungsseite genau eines Eintrags; die Liste
+ * steht auf der Service-Seite. Hier war es bis 2026-08-30 umgekehrt: die Route
+ * zeigte die ganze Liste samt Anlegen-Formular, und die Service-Seite nur eine
+ * Navigationskachel mit der Anzahl.
+ *
+ * `id === "neu"` legt einen leeren Entwurf an — im Panel entspricht das dem
+ * Weg über „Eintrag hinzufügen", der dort einen Entwurf erzeugt und sofort auf
+ * diese Seite springt.
+ */
+export function Servicebuch({
+ id,
+ geheZu,
+}: {
+ id?: string | undefined
+ geheZu: (name: SeitenName, id?: string) => void
+}) {
const { fahrzeug, profilSpeichern } = useDaten()
- const [neuOffen, setzeNeuOffen] = useState(false)
- const [entwurf, setzeEntwurf] = useState({ datum: isoTag(), art: "Ölwechsel" })
+ const istNeu = id === "neu"
+ const index = istNeu ? -1 : Number(id ?? -1)
+ const buchRoh = (fahrzeug?.service["buch"] ?? []) as ServicebuchEintrag[]
+ const [entwurf, setzeEntwurf] = useState(() =>
+ istNeu
+ ? { datum: isoTag(), art: "Ölwechsel", km: fahrzeug?.odo ?? 0, werkstatt: "" }
+ : { ...(buchRoh[index] ?? {}) },
+ )
const [laeuft, setzeLaeuft] = useState(false)
if (!fahrzeug) return null
- const buch = (fahrzeug.service["buch"] ?? []) as ServicebuchEintrag[]
+ if (!istNeu && !buchRoh[index]) return Eintrag nicht gefunden
const schreiben = async (neuesBuch: ServicebuchEintrag[]) => {
setzeLaeuft(true)
@@ -316,140 +448,112 @@ export function Servicebuch() {
}
}
- const hinzufuegen = async () => {
- await schreiben(
- [...buch, entwurf].sort((a, b) => String(b.datum ?? "").localeCompare(String(a.datum ?? ""))),
- )
- setzeNeuOffen(false)
- setzeEntwurf({ datum: isoTag(), art: "Ölwechsel" })
+ /* Das Panel speichert jedes Feld sofort; diese App folgt ihrem eigenen
+ Muster aus Entwurf plus Speichern-Knopf (Paritätsregel: gleiches
+ Verhalten, eigenes Idiom). */
+ const speichern = async () => {
+ await schreiben(istNeu ? [...buchRoh, entwurf] : buchRoh.map((e, i) => (i === index ? entwurf : e)))
+ geheZu("service")
}
- const entfernen = async (index: number) => {
+ const loeschen = async () => {
if (!bestaetigen("Diesen Wartungsplan-Eintrag löschen?")) return
- await schreiben(buch.filter((_, i) => i !== index))
+ await schreiben(buchRoh.filter((_, i) => i !== index))
+ geheZu("service")
}
+ const setze = (feld: keyof ServicebuchEintrag, wert: unknown) =>
+ setzeEntwurf((alt) => ({ ...alt, [feld]: wert }))
+
return (
<>
-
+
Aus Litern und Strecke ergibt sich derzeit kein plausibler Wert. Sobald Tankvorgänge und
Kilometerstände vollständig vorliegen, erscheint er hier.
-
+
)}
-
- Der Langzeitwert rechnet alle je getankten Liter gegen die Strecke bis zum letzten
- Tankstop — nicht Liter und Kilometer desselben Zeitraums, weil das unmögliche Werte
- ergibt, sobald eine Fahrt fehlt.
-
-
-
-
- Tag und Nacht {a.jahr}
- 0 ? de(Math.round((a.tagKm / a.kmJahr) * 100)) : "—"}
- unit="% bei Tag"
- size={40}
+ deOderStrich(a.jeZeitraum[z].verbrauch, 1))}
/>
+
+ Der Langzeitwert rechnet alle je getankten Liter gegen die Strecke bis zum letzten
+ Tankstop. Die Werte je Zeitraum sind eine Näherung aus der Tankfüllstand-Differenz der
+ einzelnen Fahrten, keine Meldung des Fahrzeugs.
+
+
+
+ 0 ? de(Math.round((a.tagKm / a.kmJahr) * 100)) : "–"}
+ einheit="% bei Tag"
+ neben={`${de(a.tagKm)} km`}
+ >
-
+
Nacht = {einstellungen.nachtVon} bis {einstellungen.nachtBis} Uhr
-
-
- {formularOffen && setzeFormularOffen(false)} />}
-
- {tankvorgaenge.length === 0 && !formularOffen && (
- setzeFormularOffen(true) }}
- />
- )}
-
+ {/* Aufbau wie vFuel(): eine Kachel um alle Jahre, kein Zähler über der
+ Liste, das Formular darunter. */}
+ {gruppen.length === 0 ? (
+
+
+
+ ) : (
+
{gruppen.map((jahr) => {
const ersparnisJahr = summe(jahr.eintraege, (t) => t.discount ?? 0)
return (
@@ -69,7 +54,7 @@ export function Tanken({ geheZu }: { geheZu: (name: SeitenName, id?: string) =>
{de(summe(jahr.eintraege, (t) => t.liters ?? 0), 1)} l · Ø{" "}
{de(schnittpreis(jahr.eintraege), 2)} €/l
- {smartdealAktiv && ersparnisJahr > 0 && (
+ {smartdealAktiv && (
}
defaultOpen={jahr === gruppen[0]}
>
- {jahr.monate.map((monat) => {
- const schnitt = schnittpreis(monat.eintraege)
- return (
-
-
- {eur(summe(monat.eintraege, (t) => t.fuel_total_eur ?? 0))} €
-
- {schnitt > 0 ? `Ø ${eur(schnitt)} €/l` : "—"}
+ {jahr.monate.map((monat) => (
+
+
+ {eur(summe(monat.eintraege, (t) => t.fuel_total_eur ?? 0))} €
- }
- defaultOpen={monat === jahr.monate[0]}
- >
- {monat.eintraege.map((tank) => (
+ Ø {de(schnittpreis(monat.eintraege), 2)} €/l
+
+ }
+ defaultOpen={monat === jahr.monate[0]}
+ >
+ {/* Zeile wie im Panel: links das Datum mit der Tankstelle
+ darunter, rechts die Menge mit dem Preis je Liter. Vorher
+ standen hier Menge und Betrag vorn, alles andere in einer
+ Fußzeile, dazu eine Pille „unvollständig", die es im Panel
+ nicht gibt. Der Preis je Liter wird wie dort aus Betrag und
+ Menge gerechnet, nicht aus dem gespeicherten Feld. */}
+ {monat.eintraege.map((tank, i) => {
+ const preis =
+ tank.liters && tank.fuel_total_eur != null
+ ? tank.fuel_total_eur / tank.liters
+ : null
+ return (
void api.tankvorgangLoeschen(tank.tank_id)}
kinder={
-
+ geheZu("fill", tank.tank_id)}
+ letzte={i === monat.eintraege.length - 1}
+ />
}
/>
- ))}
-
- )
- })}
+ )
+ })}
+
+ ))}
)
})}
+
+ )}
+
+ {formularOffen && setzeFormularOffen(false)} />}
+
+ setzeFormularOffen((offen) => !offen)}
+ >
+ {formularOffen ? "Abbrechen" : "Tankvorgang erfassen"}
+
>
)
}
+/** Felder, die belege.py nach dem Lesen eines Belegs veröffentlicht. */
+interface BelegEntwurf {
+ ts?: string
+ liter?: number | null
+ kosten?: number | null
+ km?: number | null
+ ersparnis?: number | null
+ station?: string | null
+ kraftstoff?: string | null
+ receipt_key?: string | null
+ receipt_file?: string | null
+}
+
+/** Monatsname allein, wie im Panel. */
+function monatName(jahr: number, monat: number): string {
+ return new Date(jahr, monat, 1).toLocaleDateString("de-DE", { month: "long" })
+}
+
function TankFormular({ beiFertig }: { beiFertig: () => void }) {
const { api, fahrzeug } = useDaten()
const [zeitpunkt, setzeZeitpunkt] = useState("")
@@ -155,10 +164,74 @@ function TankFormular({ beiFertig }: { beiFertig: () => void }) {
const [ersparnis, setzeErsparnis] = useState("")
const [fehler, setzeFehler] = useState(null)
const [laeuft, setzeLaeuft] = useState(false)
+ /* Vorab gelesener Beleg. Ein Upload OHNE tank_id legt im Backend nichts an,
+ sondern liest den Beleg nur aus und veröffentlicht die Felder über
+ sensor.audi_dashboard_beleg_ergebnis (belege.py) - genau dieses Muster
+ benutzt das Panel im Neuanlage-Formular (data-beleg="neu" plus
+ belegEntwurf). Der App fehlte der Weg ganz: sie konnte einen Beleg nur an
+ einem bereits bestehenden Tankvorgang nachtragen. */
+ const [beleg, setzeBeleg] = useState(null)
+ const [belegLaeuft, setzeBelegLaeuft] = useState(false)
+ const belegwahl = useRef(null)
const smartdealAktiv = fahrzeug?.smartdeal.aktiv === true
- const speichern = async () => {
+ const belegLesen = async (datei: File) => {
+ setzeFehler(null)
+ if (datei.type !== "application/pdf" && !datei.name.toLowerCase().endsWith(".pdf")) {
+ setzeFehler("Bitte den Beleg als PDF auswählen.")
+ return
+ }
+ setzeBelegLaeuft(true)
+ try {
+ const base64 = await new Promise((fertig, schief) => {
+ const leser = new FileReader()
+ leser.onload = () => {
+ const roh = String(leser.result)
+ const komma = roh.indexOf(",")
+ fertig(komma >= 0 ? roh.slice(komma + 1) : roh)
+ }
+ leser.onerror = () => schief(new Error("Die Datei konnte nicht gelesen werden."))
+ leser.readAsDataURL(datei)
+ })
+ await api.belegHochladen(base64, datei.name)
+ // Das Ergebnis kommt asynchron über eine eigene Entität, nicht als
+ // Antwort auf den Dienstaufruf - hier kurz darauf warten.
+ const frist = Date.now() + 20_000
+ while (Date.now() < frist) {
+ await new Promise((weiter) => setTimeout(weiter, 1200))
+ try {
+ const e = await api.rest.datenLesen(
+ ENTITAETEN.belegErgebnis,
+ )
+ if (e && e.tank_id == null) {
+ if (e.fehler) {
+ setzeFehler(e.fehler)
+ } else {
+ setzeBeleg(e)
+ if (e.liter != null) setzeLiter(String(e.liter))
+ if (e.kosten != null) setzeKosten(String(e.kosten))
+ if (e.station) setzeStation(e.station)
+ if (e.km != null) setzeKm(String(e.km))
+ if (e.ersparnis != null) setzeErsparnis(String(e.ersparnis))
+ if (e.kraftstoff) setzeKraftstoff(e.kraftstoff)
+ if (e.ts) setzeZeitpunkt(e.ts.slice(0, 16))
+ }
+ return
+ }
+ } catch {
+ // einzelner Fehlschlag heißt nichts - weiterversuchen
+ }
+ }
+ setzeFehler("Der Server hat den Beleg noch nicht zurückgemeldet.")
+ } catch (ursache) {
+ setzeFehler(ursache instanceof Error ? ursache.message : String(ursache))
+ } finally {
+ setzeBelegLaeuft(false)
+ }
+ }
+
+ const speichern = async (mitBeleg: boolean) => {
setzeFehler(null)
const literZahl = Number(liter.replace(",", "."))
const kostenZahl = Number(kosten.replace(",", "."))
@@ -184,6 +257,9 @@ function TankFormular({ beiFertig }: { beiFertig: () => void }) {
...(smartdealAktiv
? { ersparnis: Number.isFinite(ersparnisZahl) && ersparnis ? ersparnisZahl : null }
: {}),
+ ...(mitBeleg && beleg
+ ? { receipt_key: beleg.receipt_key ?? null, receipt_file: beleg.receipt_file ?? null }
+ : {}),
})
beiFertig()
} catch (ursache) {
@@ -195,7 +271,7 @@ function TankFormular({ beiFertig }: { beiFertig: () => void }) {
return (
- Tankung eintragen
+ Neuer Tankvorgang
void }) {
{fehler}
)}
-
- Den Preis je Liter rechnet die App selbst aus Betrag und Menge — er wird nie aus einem Beleg
- übernommen. Ohne Kilometerstand nimmt sie den des Fahrzeugs.
-
+ {/* Ohne Erklärabsatz: das Panel führt im Neuanlage-Formular nur die
+ Felder und die Knöpfe. */}
+ {/* Drei Knöpfe wie in vFuelFormular(): erst den Beleg lesen lassen, dann
+ mit oder ohne ihn speichern. */}
+ {
+ const datei = e.target.files?.[0]
+ if (datei) void belegLesen(datei)
+ e.target.value = ""
+ }}
+ />
+ belegwahl.current?.click()} disabled={belegLaeuft || laeuft}>
+ {belegLaeuft ? "Beleg wird gelesen …" : beleg ? "Beleg ersetzen" : "Beleg hochladen"}
+
+ void speichern(true)} disabled={laeuft}>
+ {laeuft ? "Speichere …" : "Speichern"}
+
+ void speichern(false)} disabled={laeuft}>
+ Ohne Beleg speichern
+
)
}
diff --git a/companion-app/src/screens/TankstellenKarte.tsx b/companion-app/src/screens/TankstellenKarte.tsx
new file mode 100644
index 0000000..ad38de4
--- /dev/null
+++ b/companion-app/src/screens/TankstellenKarte.tsx
@@ -0,0 +1,46 @@
+/**
+ * Karte im Einzelbeleg: eine Nadel auf der Tankstelle.
+ *
+ * Die Koordinaten stehen nicht im Datensatz — der Beleg trägt nur eine
+ * Anschrift, und das Backend füllt `station_lat`/`station_lon` nie. Sie werden
+ * deshalb aus der Adresse aufgelöst (`adresseAufloesen()`), genau wie im
+ * Panel. Ohne Adresse oder ohne Treffer bleibt der ehrliche Leerzustand
+ * stehen, statt irgendeinen Kartenausschnitt zu zeigen.
+ */
+
+import { useEffect, useState } from "react"
+
+import { adresseAufloesen } from "../daten/geokodierung"
+import type { Koordinate } from "../daten/geokodierung"
+import { Leerzustand } from "./bausteine"
+import { Karte } from "./Karte"
+
+export function TankstellenKarte({ adresse }: { adresse: string | null | undefined }) {
+ const [position, setzePosition] = useState(null)
+ const [geprueft, setzeGeprueft] = useState(false)
+
+ useEffect(() => {
+ let abgebrochen = false
+ setzeGeprueft(false)
+ void adresseAufloesen(adresse).then((treffer) => {
+ if (abgebrochen) return
+ setzePosition(treffer)
+ setzeGeprueft(true)
+ })
+ return () => {
+ abgebrochen = true
+ }
+ }, [adresse])
+
+ if (position) return
+ // Solange die Auflösung läuft: eine leere Kartenfläche, wie im Panel (die
+ // Karte steht dort schon, die Nadel kommt nach). Bewusst nicht die
+ // Ladeanzeige der Seite - die meldet „der Bildschirm ist noch nicht da".
+ if (!geprueft) return
+ return (
+
+ )
+}
diff --git a/companion-app/src/screens/Uebersicht.tsx b/companion-app/src/screens/Uebersicht.tsx
index b8a1b18..62a6f69 100644
--- a/companion-app/src/screens/Uebersicht.tsx
+++ b/companion-app/src/screens/Uebersicht.tsx
@@ -6,15 +6,15 @@
* Tankung. Ziehen zum Aktualisieren stößt eine Neuabfrage beim Fahrzeug an.
*/
-import { useState } from "react"
-
import { Fig, ProgressBar, StatusRow, Tile } from "@audi-dash/ui"
import { useDaten } from "../daten/DatenKontext"
import { naechsterService } from "../daten/service"
-import { datum, datumZeit, dauer, de, deOderStrich, eur } from "../format"
+import { datum, de, deOderStrich, eur } from "../format"
import type { SeitenName } from "../navigation"
-import { Leerzustand, NaviKachel } from "./bausteine"
+import { useBoden } from "../theme"
+import { BILDPLAETZE, bildInfo } from "./bilder"
+import { Blattzeile, Leerzustand } from "./bausteine"
import { Bild } from "./Bild"
import type { ServicebuchEintrag } from "./Service"
import { StandortVorschau } from "./Standort"
@@ -30,13 +30,29 @@ const SERVICE_SYMBOL: Partial> = {
"Inspektion": SymbolInspektion,
}
+/* Innenraumaufnahmen bekommen keinen Bodenschatten — `OHNE_SZENE` im Panel. */
+const OHNE_SZENE = ["Cockpit", "Sitze", "Scheinwerfer"]
+
export function Uebersicht({ geheZu }: { geheZu: (name: SeitenName, id?: string) => void }) {
- const { fahrzeug, einstellungen, fahrten, tankvorgaenge, jetztAktualisieren, statusStand } =
- useDaten()
- const [aktualisiert, setzeAktualisiert] = useState(false)
+ const { fahrzeug, einstellungen, fahrten, tankvorgaenge } = useDaten()
+ const [boden] = useBoden()
if (!fahrzeug || !einstellungen) return null
+ // Bodenschatten unter dem Fahrzeug, wie szeneKlasse() im Panel: abschaltbar,
+ // nicht bei Innenraumaufnahmen, blaustichig bei montierten Winterrädern.
+ const winterraeder = fahrzeug.reifen.aktiv === "Winter"
+ const platz = BILDPLAETZE.find((p) => p.datei === einstellungen.startbild) ?? BILDPLAETZE[0]!
+ // Bei Winterrädern zeigt die Seitenansicht das Winterfoto, wie bildInfo()
+ // im Panel — das fehlte hier ganz.
+ const startbild = bildInfo(platz, winterraeder)
+ const bodenKlasse =
+ !boden || OHNE_SZENE.includes(platz.name)
+ ? ""
+ : winterraeder
+ ? " dm-szene--winter"
+ : " dm-szene--strasse"
+
// Der Zusatz stammt aus dem Modellnamen selbst (alles nach dem Typenschild)
// plus der eigens gepflegten Ausführung — so macht es auch das alte Panel.
const schild = schildErkennen(einstellungen.fahrzeugtitel)
@@ -74,26 +90,28 @@ export function Uebersicht({ geheZu }: { geheZu: (name: SeitenName, id?: string)
? "Nicht sicher abgestellt"
: "Status unbekannt"
- const aktualisieren = async () => {
- setzeAktualisiert(true)
- try {
- await jetztAktualisieren()
- } finally {
- setzeAktualisiert(false)
- }
- }
+ // Die Neuabfrage beim Fahrzeug hängt jetzt am Ziehen zum Aktualisieren im
+ // Rahmen (Shell.tsx), wie im Panel — der frühere Knopf am Seitenende hatte
+ // dort keine Entsprechung.
return (
<>
-
+ {/* Randloses Fahrzeugbild, danach eine eigene randlose Kachel mit
+ Typenschild, Kennzeichen und Statuszeile — dieselbe Aufteilung wie
+ vHome() im Panel (`.szene.bleed` gefolgt von einer `.tile.flat`).
+ Der Status stand hier bisher als eigenes Element unter der Szene. */}
+
+
+
+
-
+
{/* Neben dem Schild steht nur, was im Namen darüber hinausgeht —
das Modell selbst zeigt bereits das Schild. Ohne erkanntes
Schild tritt der volle Name an dessen Stelle. Deckungsgleich
@@ -117,14 +135,15 @@ export function Uebersicht({ geheZu }: { geheZu: (name: SeitenName, id?: string)
{einstellungen.kennzeichen || "Kennzeichen nicht hinterlegt"}
-
-
- geheZu("sicherheit")}
- />
+ {/* Ohne Zeitstempel-Unterzeile: das Panel zeigt den Stand der Daten in
+ der Kopfzeile ("vor 3 Std."), nicht unter dem Status. */}
+ geheZu("sicherheit")}
+ />
+
{/* Reihenfolge deckungsgleich mit vHome() im Panel (".tankzeile", eigens
als myAudi-App-Konvention kommentiert, die einzige Kachel im ganzen
@@ -136,11 +155,11 @@ export function Uebersicht({ geheZu }: { geheZu: (name: SeitenName, id?: string)
am 2026-08-16 aus dem Panel entfernt (Nutzerwunsch) und war hier nie
nachgezogen worden. Panel: "tile flat" - keine Kartenfläche, war
hier fälschlich eine normale (graue) Tile (Parität-Audit). */}
-
+
@@ -159,7 +178,7 @@ export function Uebersicht({ geheZu }: { geheZu: (name: SeitenName, id?: string)
"differentiate controls from content": nur der obere Teil ist der
Knopf zur Service-Seite, die Kilometerstand-Zeile bleibt reine
Anzeige. Deckungsgleich mit vHome() im Panel. */}
-
+
{/* Ohne Termin ist dieser Teil im Panel bewusst kein Knopf (kein
data-go, kein Chevron) - es gibt nichts, wohin er führen könnte.
"differentiate controls from content" gilt auch für die
@@ -167,9 +186,13 @@ export function Uebersicht({ geheZu }: { geheZu: (name: SeitenName, id?: string)
{service ? (
) : (
Nächster Service:
- kein Eintrag im Wartungsplan
+ {/* Panel: `
`, 16px in --fg — nicht die Fußnote. */}
+
kein Eintrag im Wartungsplan
)}
- Kilometerstand
-
+ Kilometerstand
+
+ {/* „Zuletzt": eine Kachel mit zwei Blattzeilen, wie teaser() im Panel —
+ links die Bezeichnung mit Strecke bzw. Tankstelle darunter, rechts
+ der Wert mit Status bzw. Betrag. Vorher waren das zwei
+ NaviKacheln nebeneinander ohne Überschrift, ohne Strecken-/
+ Tankstellenangabe und mit „Letzte Tankung" statt „Letzter
+ Tankvorgang". Fehlen beide Datensätze, lässt das Panel die Kachel
+ ganz weg; die Leerzustände hier bleiben als eigene Konvention der
+ App erhalten (siehe Kapitel 1 des Paritätsaudits). */}
+ {letzteFahrt || letzteTankung ? (
+
+ Zuletzt
+ {letzteFahrt && (
+ geheZu("trip", letzteFahrt.trip_id)}
+ letzte={!letzteTankung}
+ />
+ )}
+ {letzteTankung && (
+ geheZu("fill", letzteTankung.tank_id)}
+ letzte
+ />
+ )}
+
+ ) : (
+
+ Zuletzt
+
+
+ )}
+
+ {/* Die Standortkarte steht seit der Designprüfung 2026-08-30 hinter
+ „Zuletzt“ — wie im Panel. Die 190px hohe Karte davor drückte die zwei
+ kurzen, häufig gelesenen Zeilen auf dem Telefon unter den ersten
+ Bildschirm. */}
geheZu("standort")} />
-
-
+ void speichern()} disabled={laeuft}>
+ {laeuft ? "Speichere …" : "Speichern"}
+
>
)
}
+/**
+ * `versicherung.leistungen` ist eine Liste von Gruppen mit je einer
+ * Überschrift und einer Liste von Klartext-Posten — nicht, wie hier bis
+ * 2026-08-30 angenommen, eine Liste von `{bez, wert}`-Paaren. Aus dem falschen
+ * Typ entstanden auf dieser Seite zwölf Zeilen aus lauter Strichen: `l.bez`
+ * und `l.wert` waren an jedem Eintrag undefiniert. Derselbe Fehlertyp wie im
+ * Schutzbrief (Kapitel 4 des vorigen Audits), nur eine Ebene weiter oben.
+ */
+interface Leistungsgruppe {
+ gruppe?: string
+ posten?: string[]
+}
+
export function Vertragsdetails({ geheZu }: { geheZu: (name: SeitenName, id?: string) => void }) {
const { fahrzeug } = useDaten()
if (!fahrzeug) return null
const v = fahrzeug.versicherung
- const leistungen = (v["leistungen"] ?? []) as { bez?: string; wert?: string }[]
+ const leistungen = (v["leistungen"] ?? []) as Leistungsgruppe[]
return (
<>
-
- Leistungen
- {leistungen.length === 0 ? (
-
Im Profil sind noch keine Leistungen hinterlegt.
- ) : (
- (
-
- ))}
- />
- )}
+ {/* Der Schutzbrief steht im Panel oben, als Kachel-Knopf mit Chevron,
+ nicht als Navigationskachel unter den Leistungen. */}
+ geheZu("schutz")}>
+ Schutzbrief Mobilität
+
}
+ {Boolean(s["rang"]) && {s["rang"] as string}}
+ {Boolean(s["stand"]) && (
+
+ {s["stand"] as string}
+
+ )}
)}
>
@@ -428,9 +603,15 @@ export function Notruf() {
}
return (
+ /* Beschriftungen wie vNotrufBearbeiten(): „Rufnummern ändern" mit
+ „Inland"/„Ausland". Hier hießen sie „Nummern im Notfall" mit
+ „Service"/„Notfall" — dieselben zwei Felder, aber anders benannt als in
+ der Kachel, aus der man kommt. Die beiden Wählknöpfe entfallen: das
+ Panel bietet das Wählen auf der Versicherungsseite selbst an, nicht im
+ Bearbeiten-Formular. */
- Nummern im Notfall
-
+ Rufnummern ändern
+
setzeService(e.target.value)}
/>
-
+
setzeNotfall(e.target.value)}
/>
- {(service || notfall) && (
-
- {de(1)} Fahrzeug, {(entwurf["zeitraum"] as string) || "jährlich"} zu zahlen.
-
)
}
diff --git a/companion-app/src/screens/Zeilenmenue.tsx b/companion-app/src/screens/Zeilenmenue.tsx
index 1a9b38d..7524c66 100644
--- a/companion-app/src/screens/Zeilenmenue.tsx
+++ b/companion-app/src/screens/Zeilenmenue.tsx
@@ -1,18 +1,19 @@
/**
- * Löschweg für Listenzeilen — Wischen **und** ein sichtbares Menü.
+ * Löschweg für Listenzeilen: nach links wischen, dann „Löschen" antippen —
+ * genau wie `swipeZeile()` im Panel.
*
- * Behebt einen offenen Befund des Design-Audits (AUDIT_2026-08-10.md §4.1):
- * Im alten Panel war Löschen ausschließlich über eine Wischgeste erreichbar.
- * Wer mit Sprachausgabe oder Schaltersteuerung bedient, führt keine
- * Wischgesten aus und konnte Fahrten und Tankvorgänge deshalb gar nicht
- * löschen. Das Menü ist immer da, ein richtiger Knopf, mit Tastatur erreichbar.
+ * Bis 2026-08-30 saß rechts neben jeder Zeile zusätzlich ein dauerhaft
+ * sichtbarer „···"-Knopf mit Löschmenü. Er stammte aus einem Befund des
+ * Design-Audits (AUDIT_2026-08-10.md §4.1: Wischgesten sind mit Sprachausgabe
+ * und Schaltersteuerung unerreichbar). Der Eigentümer hat entschieden, dass
+ * Barrierefreiheit für diese beiden Anwendungen nicht gebraucht wird und der
+ * Knopf entfallen soll — er hatte im Panel keine Entsprechung und schob jede
+ * Listenzeile um 44px zusammen.
*/
-import { useState, type ReactNode } from "react"
+import type { ReactNode } from "react"
-import { Popup, PopupMenuItem, SwipeRow } from "@audi-dash/ui"
-
-import { SymbolMehr } from "../symbole"
+import { SwipeRow } from "@audi-dash/ui"
export function Zeilenmenue({
beiLoeschen,
@@ -23,32 +24,13 @@ export function Zeilenmenue({
loeschFrage: string
kinder: ReactNode
}) {
- const [menueOffen, setzeMenueOffen] = useState(false)
-
const loeschen = () => {
- setzeMenueOffen(false)
if (window.confirm(loeschFrage)) beiLoeschen()
}
return (
-
+ )
+}
+
+/**
+ * Zahnrad in der rechten oberen Ecke einer Kachel — `.zahnrad` im Panel. Führt
+ * zur Bearbeitung dessen, was die Kachel zeigt. Die Kachel selbst muss dafür
+ * `position: relative` tragen (`.ads-tile` tut das über `.dm-kachel--zahnrad`).
+ */
+export function Zahnradknopf({ beschriftung, beiKlick }: { beschriftung: string; beiKlick: () => void }) {
+ return (
+
+ )
+}
+
+/**
+ * Listenzeile im Zuschnitt von `.leaf` im Panel: links Beschriftung mit
+ * kleinerem Zusatz darunter, rechts der Wert mit eigenem Zusatz, danach der
+ * Chevron. Genau diese Aufteilung benutzt das Panel für die Zuletzt-Kachel der
+ * Übersicht, die Fahrten- und die Tankliste sowie die Batterie-Messwerte.
+ */
+export function Blattzeile({
+ label,
+ labelZusatz,
+ wert,
+ wertZusatz,
+ beiKlick,
+ letzte,
+}: {
+ label: ReactNode
+ labelZusatz?: ReactNode
+ wert: ReactNode
+ wertZusatz?: ReactNode
+ /** Ohne Klickziel wird die Zeile ein reines
`;
}
+/* "Daten bearbeiten" auf der Seite Identität und Technik. Der Knopf war bis
+ 2026-08-30 ohne Funktion (kein data-go, kein Handler) - beim
+ Paritätsabgleich aufgefallen und auf Wunsch des Eigentümers jetzt umgesetzt.
+
+ Bearbeitet werden genau die Angaben, für die es sonst nirgends einen Editor
+ gibt: die Werte des technischen Datenblatts (CAR.technik) und die
+ Ausstattungslisten (CAR.ausstattung). Die Kopfdaten darüber - Modell,
+ Kennzeichen, Ausführung, Erstzulassung, FIN - bleiben bewusst außen vor:
+ die pflegt "Fahrzeug einrichten" in den Einstellungen, und zwei Eingabe-
+ stellen für dasselbe Feld laufen erfahrungsgemäß auseinander. */
+let identBearbeitenOffen = false;
+
function vIdent() {
+ if (identBearbeitenOffen) return vIdentBearbeiten();
return `
`).join("")}
- `;
+ `;
+}
+
+/* Bearbeitungsansicht: je Technikgruppe eine Kachel mit einem Eingabefeld je
+ Posten, je Ausstattungsgruppe eine Kachel mit einer Zeile je Position -
+ beide mit "×" zum Entfernen und "+ Position hinzufügen", genau im Zuschnitt
+ der Selbstbeteiligung in vVertragBearbeiten(). Gespeichert wird wie überall
+ sonst sofort je Feld über profilSpeichern(). */
+function vIdentBearbeiten() {
+ const technik = CAR.technik || [];
+ const ausstattung = CAR.ausstattung || [];
+ return `
+
Daten bearbeiten
+ Hier stehen das technische Datenblatt und die
+ Ausstattung. Modell, Kennzeichen, Ausführung, Erstzulassung und Fahrgestellnummer pflegst du
+ unter Einstellungen → Fahrzeug einrichten.
+
`).join("")}
+ `;
}
function monatePlus(datum, monate) { const d = dat(datum); d.setMonth(d.getMonth() + monate); return d; }
@@ -2686,7 +2784,7 @@ function vEinst() {
if (laeuft === "installieren") return spinner("Installiere …");
if (laeuft === "neustart") return spinner("Home Assistant startet neu …");
if (u && u.installiert) {
- return `
+ return `
Version ${esc(u.version)} installiert - die neue Fassung wird erst nach einem Neustart
geladen.
`;
@@ -2694,13 +2792,13 @@ function vEinst() {
if (laeuft === "pruefen") return spinner("Prüfe …");
if (u && u.verfuegbar) {
return `
Verfügbare Version
${esc(u.version)}
-
+
Lädt die neueste Fassung von Gitea und ersetzt den Integrationsordner. Home Assistant
muss danach neu gestartet werden. Fahrzeugprofil, Fahrten, Tankvorgänge und eigene
Fotos bleiben dabei unangetastet - die liegen außerhalb des Integrationsordners.
`;
}
- return `
+ return `
${u ? `Integration ist aktuell${u.geprueft_am ? ` (geprüft ${dedat(new Date(u.geprueft_am))})` : ""}.` : "Noch nicht geprüft."}
`;
})()}
@@ -3171,6 +3269,15 @@ function vTripsFormular() {
` : ""}
`;
}
+/* Jahre laufen absteigend, Monate und Zeilen liefen bis zur Designpruefung
+ 2026-08-30 aufsteigend - in derselben Liste zwei Richtungen, und die
+ neueste Fahrt stand ganz unten, ausserhalb des sichtbaren Bereichs.
+ neuesteZuerst() dreht Zeilen und Monatsreihenfolge um; der zuerst
+ aufgeklappte Monat (mi === 0) ist damit automatisch der neueste. */
+function neuesteZuerst(liste, feld) {
+ return liste.slice().sort((a, b) => new Date(b[feld]) - new Date(a[feld]));
+}
+
function vTrips() {
const jahre = [...new Set(TRIPS.map((t) => new Date(t.ts_start).getFullYear()))].sort((a, b) => b - a);
/* D5: Leerzustand nennt die Ursache - die Fahrtenerkennung greift erst, wenn
@@ -3183,7 +3290,7 @@ function vTrips() {
${vTripsFormular()}`;
let h = `
`;
jahre.forEach((j, ji) => {
- const tj = TRIPS.filter((t) => new Date(t.ts_start).getFullYear() === j);
+ const tj = neuesteZuerst(TRIPS.filter((t) => new Date(t.ts_start).getFullYear() === j), "ts_start");
h += `
`;
@@ -3244,9 +3351,13 @@ function vTrip(id) {
function quad(t, v) { return `${t}
${v.map((x) => `
${x[0]}
${x[1]}
`).join("")}
`; }
+/* Der Kachelkopf traegt seit der Designpruefung 2026-08-30 denselben
+ drehenden Pfeil wie die Aufklapp-Zeilen in Fahrten und Tanken. Vorher sah
+ die Statistik aus wie fuenf feste Anzeigen - dass sich dahinter die
+ gesamte Auswertung oeffnet, war an nichts zu erkennen. */
function statTile(id, label, fig, unit, extra, body) {
return `