Page Designer
The Page Designer is a powerful visual configuration tool for building forms, dashboards, reports, and content pages without coding. It provides a comprehensive field system with 60+ field types, advanced validation, conditional logic, and workflow automation capabilities.
Key Capabilities
- Visual Design: Drag-and-drop interface for building pages
- 60+ Field Types: Input fields, layout components, dashboard widgets, content components, and interactive components
- Advanced Configuration: Validation rules, conditional logic, calculated fields, workflows
- Multi-Mode Support: Forms, Dashboards, Reports, and Content Pages
- Responsive Design: Grid-based responsive layouts with breakpoint configuration
- Data Binding: Dynamic data sources, cascading dropdowns, formula-based calculations
- Workflow Automation: Trigger workflows from field changes or form submission
- Permissions: Field-level and role-based access control
- Theming: CSS variables for colors, fonts, and branding
Quick Start
Create a New Page
- Open Page Designer
- Select a page type: Form, Dashboard, Report, or Content Page
- Drag fields from the Components panel to the canvas
- Configure field properties in the properties panel
- Add validation, conditional logic, and workflows as needed
- Save and publish
Field Configuration
Each field has three main sections:
- Basic Tab: Label, placeholder, description, default value, options
- Display Tab: Visibility, disabled state, styling, decorations
- Data Tab: Default value, persistence, data source configuration
- Validation Tab: Required, validation rules, custom error messages
- Conditional Tab: Show/hide based on other field values
- Help Tab: Inline documentation for end users
Documentation Structure
- Field Types - Complete reference of all 60+ field types with parameters
- Field Properties - Common properties and configuration options
- Advanced Features - Workflows, conditional logic, calculated fields
- Technical Reference - Implementation details for developers
Supported Page Types
| Type | Purpose | Use Cases |
|---|---|---|
| Form | Data entry and collection | User registration, contact forms, surveys |
| Dashboard | Data visualization and KPIs | Analytics, reporting, monitoring |
| Report | Formatted output documents | Invoices, certificates, statements |
| Content | Static or dynamic content pages | Landing pages, documentation, websites |
Field Categories
Form Fields (25+)
Basic input fields for data collection: text, email, number, select, date, file, etc.
Layout Components (20+)
Containers for organizing fields: grid, columns, tabs, accordion, repeater, etc.
Dashboard Widgets (10+)
Data visualization components: charts, KPIs, gauges, maps, timelines, etc.
Content Components (15+)
Content and display components: heading, image, video, alert, navigation, etc.
Interactive Components (5+)
User interaction elements: dialog, drawer, dataview, tree-view, etc.
Getting Started
Start with the Field Types documentation to understand available components, then explore Field Properties for detailed configuration options.
Technical Reference
For developers building or extending the Page Designer:
- Architecture & File Structure - See Technical Implementation Guide
- Renderer Patterns - Component structure and extension guidelines
- Advanced Features - Advanced configuration and customization