Ordering Portal
Dashboard & Search
Project search and navigation in the Ordering Portal
Dashboard & Search
The Dashboard is the landing page of the Ordering Portal. It provides a powerful project search and quick access to order management.
Dashboard Layout
The dashboard (GET /) shows:
- Page title: "Order Dashboard"
- "Create New Project & Order" button — top right, links to project creation flow
- Search section — the primary interaction point
Project Search
The search uses jQuery UI Autocomplete connected to the v3 API.
How It Works
- Type at least 2 characters into the search box
- After a 200ms debounce, the portal queries
/v3/api/ordering/projects - Results appear in a dropdown with rich project information
- Click a result to navigate to
/project/{id}/view
What You Can Search By
| Search Field | Example |
|---|---|
| Address | "123 Smith Street" |
| SPI | "1\PC123456" |
| Client Job Number | "JOB-2024-001" |
Search Result Display
Each result in the dropdown shows:
| Field | Description |
|---|---|
| Job ID | Internal project identifier |
| Lot | Lot number from the project |
| Address | Full property address |
| Division | Customer's company division |
| Estate | Estate/development name |
| Permit Issued | Date building permit was issued (if applicable) |
Search Behaviour
- Results are cached in-memory (JavaScript Map) to avoid repeated API calls for the same query
- The search input is auto-focused when the page loads
- A loading indicator appears while fetching results
- If no results are found, a "No projects found" message appears
Quick Actions
From the dashboard, customers can:
- Search and open a project — click a search result
- Create a new project — click "Create New Project & Order" button
- Navigate via sidebar — use the sidebar menu to access order lists, projects, or start a new order
Navigation Flow
Dashboard
├── Search result clicked → Project View (/project/{id}/view)
├── "Create New Project" → Project Select (/project/select)
└── Sidebar links → Order lists, Projects, New Order wizard