Booking management dashboard with payment details #11

Closed
opened 2026-07-07 21:55:16 -06:00 by jhodgkin · 0 comments
Owner

Goal

Full-featured photographer dashboard at /dashboard (protected by #10 OIDC) for managing bookings and tracking payments.

Layout

Sidebar nav with four panels: Overview, Calendar, Bookings, Payments. Header shows logged-in user name and Logout button.

Overview panel (default)

Stat cards: upcoming sessions this month, pending payment count (badge alert if > 0), confirmed bookings, estimated monthly revenue. Next 5 upcoming bookings listed below.

Calendar panel

Month view with booked dates color-coded: confirmed (green), pending payment (yellow), cancelled (red). Click date opens a slide-out detail panel.

Bookings panel

Sortable filterable table: Client, Date, Type, Length, Location, Contract (signed/unsigned), Payment status, Actions. Filter by date range, booking status, payment status; search by name/email. Row expansion shows full booking detail including payment block.

Payment detail block

Shown in expanded booking rows and in Payments panel:

  • Session price based on type and length from config
  • Exact Venmo note string the client was shown (for matching)
  • Payment status badge: pending / pending_confirmation / confirmed / refunded
  • Timestamp of when client clicked I have sent payment
  • Confirm Payment button triggers PATCH + n8n webhook for confirmation email
  • Mark Refunded button with optional note
  • Open Venmo deep link to cross-check in the app

Payments panel

Dedicated payment list with bulk confirm checkboxes, monthly revenue summary, and CSV export.

API endpoints (all require OIDC session from #10)

  • GET /api/admin/bookings with filters: status, payment_status, from, to, search
  • GET /api/admin/bookings/:id
  • PATCH /api/admin/bookings/:id
  • GET /api/admin/bookings/:id/contract — stream signed PDF
  • GET /api/admin/payments/export — CSV
  • GET /api/admin/stats — counts and revenue totals

Tech

src/dashboard.html as vanilla JS SPA matching the portfolio color theme. Session checked via GET /api/auth/me on load; redirects to login if 401.

Acceptance

  • All panels show real SQLite data
  • Confirming payment updates Overview badge immediately
  • CSV export has all columns
  • PDF download works
  • Dashboard is inaccessible without active Authentik session
## Goal Full-featured photographer dashboard at /dashboard (protected by #10 OIDC) for managing bookings and tracking payments. ## Layout Sidebar nav with four panels: Overview, Calendar, Bookings, Payments. Header shows logged-in user name and Logout button. ## Overview panel (default) Stat cards: upcoming sessions this month, pending payment count (badge alert if > 0), confirmed bookings, estimated monthly revenue. Next 5 upcoming bookings listed below. ## Calendar panel Month view with booked dates color-coded: confirmed (green), pending payment (yellow), cancelled (red). Click date opens a slide-out detail panel. ## Bookings panel Sortable filterable table: Client, Date, Type, Length, Location, Contract (signed/unsigned), Payment status, Actions. Filter by date range, booking status, payment status; search by name/email. Row expansion shows full booking detail including payment block. ## Payment detail block Shown in expanded booking rows and in Payments panel: - Session price based on type and length from config - Exact Venmo note string the client was shown (for matching) - Payment status badge: pending / pending_confirmation / confirmed / refunded - Timestamp of when client clicked I have sent payment - Confirm Payment button triggers PATCH + n8n webhook for confirmation email - Mark Refunded button with optional note - Open Venmo deep link to cross-check in the app ## Payments panel Dedicated payment list with bulk confirm checkboxes, monthly revenue summary, and CSV export. ## API endpoints (all require OIDC session from #10) - GET /api/admin/bookings with filters: status, payment_status, from, to, search - GET /api/admin/bookings/:id - PATCH /api/admin/bookings/:id - GET /api/admin/bookings/:id/contract — stream signed PDF - GET /api/admin/payments/export — CSV - GET /api/admin/stats — counts and revenue totals ## Tech src/dashboard.html as vanilla JS SPA matching the portfolio color theme. Session checked via GET /api/auth/me on load; redirects to login if 401. ## Acceptance - All panels show real SQLite data - Confirming payment updates Overview badge immediately - CSV export has all columns - PDF download works - Dashboard is inaccessible without active Authentik session
Sign in to join this conversation.
No Label
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: jhodgkin/lisilou-portfolio#11