Left side gains a desktop-only breadcrumb "Organisation / Page title" using the current organisation from useAuthStore and a page title resolved by: 1. route.meta.title (if a page sets it explicitly), then 2. matching the active route name against the navItems prop, then 3. humanizing the route name as a last-resort fallback. The chevron separator is suppressed when either side is empty, so portal and pre-org users see just the page title. Mobile preserves the existing hamburger + title text (the breadcrumb is hidden on <lg to keep the topbar single-row). Right side gains a notification bell and a help icon. The bell is a visual placeholder (no badge) — clicking shows a PrimeVue Toast "Notificaties komen binnenkort beschikbaar" until the notification framework lands as a separate sprint. The help icon would normally open https://docs.crewli.app in a new tab, but the host currently serves with a TLS cert that does not cover the name (ERR_TLS_CERT_ALTNAME_INVALID), so the click handler falls back to a Toast. A TODO comment in the source records the target URL and the one-line switch to make once the cert is fixed. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Crewli — Organizer SPA
Main product UI for organisation and event staff (Vue 3 + Vuexy + Vuetify). Lives in this repo; only re-copy from Vuexy when upgrading the template.
Setup
- Install dependencies:
pnpm install
- Create
.env.local:
VITE_API_URL=http://localhost:8000/api/v1
VITE_APP_NAME="Crewli Organizer"
- Dev server uses port 5174 (see
vite.config.tsor run from repo root:make app).
pnpm dev --port 5174
Port
Runs on http://localhost:5174
Production: e.g. VITE_API_URL=https://api.crewli.app/api/v1 and host the SPA at https://crewli.app (see api/.env.example for FRONTEND_APP_URL and SANCTUM_STATEFUL_DOMAINS).