BI Dashboard

A flat, server-free dashboard for the Brandize BI webhook (Summe je Abgangsland). It shows the gross revenue (Brutto inkl. USt) per departure country for a selected period, with KPI cards, a bar chart and a detail table.

Run

Just open index.html in a browser (double-click it). No server, no build step.

The page calls the webhook directly:

https://brandize.app.n8n.cloud/webhook/bi-dashboard

The webhook sends CORS headers (it reflects the request Origin, including null for file://), so a direct browser call works.

The left sidebar groups reports by topic:

Amazon → Umsatz je Abgangsland (Brutto inkl. USt je Abgangsland)
Amazon → VAT Summary (USt-Übersicht je Land)
ODOO → Dashboard (placeholder, to follow)

Both groups start collapsed, so no submenu is visible when the page opens. Clicking a topic expands its submenu; clicking a submenu item switches the view.

Authentication

The webhooks are protected with HTTP Basic Auth. The dashboard asks for the credentials when they are needed: the first request is sent without them, and when the webhook answers 401, a login prompt appears. The entered credentials are sent as an Authorization: Basic ... header on every request and kept in sessionStorage for the rest of the browser session (so a reload does not prompt again). If the webhook rejects them (401), the prompt reappears. Storage is best-effort: on file:// it may be unavailable, in which case credentials are kept in memory only.

CSV export

The header has a CSV button that downloads the data of the currently displayed dashboard, as a semicolon-delimited UTF-8 file (with BOM) including a Gesamt row:

Umsatz je Abgangsland → umsatz-je-abgangsland_YYYY-MMM.csv
VAT Summary → vat-summary_YYYY-MMM.csv

The button is disabled on dashboards without data (e.g. the ODOO placeholder).

Filter

A shared filter bar sits above every dashboard (labelled Filter with a funnel icon and the hint gilt für alle Dashboards). It holds the Zeitraum month + year selector (e.g. 2026-SEP) and the reload button, and stays visible across all views. The previous month is preselected. The selected period is sent to the webhook as ?month=YYYY-MMM, matching the %(month)s parameter used in ../sql/Summe_je_Abgangsland.sql.

Data sources

One request to the webhook returns both datasets, which are read by key:

Summe je Abgangsland → the Umsatz je Abgangsland report
VAT Summary → the VAT Summary report

Files

File	Purpose
`index.html`	Dashboard markup
`styles.css`	Styling
`app.js`	Data loading, parsing and rendering

2.7 KiB Raw Blame History