Files
zeroclock/docs/plans/2026-02-17-clients-view-navrail-reorg-design.md
2026-02-17 22:44:50 +02:00

73 lines
2.2 KiB
Markdown

# Clients View & NavRail Reorganization Design
**Goal:** Add a Clients management view and reorder the NavRail into a logical workflow.
---
## NavRail Reorder
**Current:** Dashboard, Timer, Projects, Entries, Reports, Invoices, Settings
**New order (workflow flow):**
1. Dashboard (`LayoutDashboard`) — Overview
2. Timer (`Clock`) — Primary action
3. Clients (`Users`) — **NEW** — Set up clients first
4. Projects (`FolderKanban`) — Projects belong to clients
5. Entries (`List`) — Time entries belong to projects
6. Invoices (`FileText`) — Bill clients for entries
7. Reports (`BarChart3`) — Analytics across everything
8. Settings (`Settings`) — Utility, always last
**Files:** `src/components/NavRail.vue`, `src/router/index.ts`
---
## Clients View
### Layout
- **Header**: "Clients" title + "+ Add" button (top right)
- **Card grid**: 1-3 columns responsive (same as Projects.vue)
- Each card: name (bold), company subtitle (if set), email (tertiary)
- Hover reveals edit/delete icons (same pattern as Projects)
- **Empty state**: `Users` icon + "No clients yet" + "Create Client" CTA
### Create/Edit Dialog
Two sections in the form:
**Contact Info:**
- Name (text, required)
- Email (text, optional)
- Phone (text, optional)
- Address (textarea, optional)
**Billing Details** (collapsible section — collapsed on create, open if data exists on edit):
- Company (text) — Business name for invoice header
- Tax ID (text) — VAT/Tax number shown on invoices
- Payment Terms (text) — e.g. "Net 30", "Due on receipt"
- Notes (textarea) — Internal notes
### Delete Confirmation
Same pattern as Projects — "Delete Client" with warning text.
---
## Backend Changes
### Database Migration
Add columns to `clients` table via `ALTER TABLE ADD COLUMN` statements in `init_db`:
- `company TEXT`
- `phone TEXT`
- `tax_id TEXT`
- `payment_terms TEXT`
- `notes TEXT`
### Rust Changes
- Expand `Client` struct with new fields (all `Option<String>`)
- Update `get_clients` SELECT to include new columns
- Update `create_client` INSERT to include new columns
- Update `update_client` UPDATE to include new columns
- Update `export_data` client query to include new columns
### Store Changes
- Expand `Client` interface in `src/stores/clients.ts` with new optional fields