Skip to content

Frontend (Vue.js) Roadmap

This document outlines the roadmap for the Voltimax Platform web application.

Reference: src/@voltimax/iot-frontend/src/pages/


Phase F1: Energy Advisory UI

Reference: src/Voltimax.EnergyAdvisor/, src/@voltimax/iot-frontend/src/pages/

TaskStatusPriorityDescription
Energy overview dashboard✅ CompleteHighCurrent power flow diagram (grid ↔ battery ↔ solar ↔ load)
Price-based optimization view⚠️ PartialMediumEPEX day-ahead prices with charge/discharge schedule overlay
Battery steering controls❌ Not StartedHighManual mode override, SoC target setting, strategy selection
Optimization history❌ Not StartedMediumHistorical decisions with outcomes, savings calculations

Implementation Status:

Completed:

  • ✅ Energy overview dashboard (OverviewPage.vue) with:
    • Real-time power balance (PowerBalanceCard.vue)
    • Asset freshness indicators (AssetFreshnessCard.vue)
    • Solar forecast integration (SolarForecastCard.vue)
    • Location map visualization (MapCard.vue)
  • ✅ Workflow automation UI (WorkflowsPage.vue)
  • ✅ Battery metrics visualization (BatteryMetricsCard.vue, BatteryStateOfChargeCard.vue)

In Progress:

  • ⚠️ EPEX pricing view exists (experiments/PricingExperimentPage.vue) but:
    • Available as experimental feature only
    • Not integrated into main dashboard
    • No active optimization logic or schedule overlay

Not Started:

  • ❌ Battery steering controls (manual charge/discharge interface)
  • ❌ Strategy selection UI (to trigger gateway strategies)
  • ❌ Optimization history/audit trail viewer

Phase F2: Asset Management

Reference: src/Voltimax.Platform.Api/Endpoints/Assets/, src/@voltimax/iot-frontend/src/pages/

Architecture:

  • Hierarchical asset list with filtering and sorting
  • Type-specific configuration forms (Battery, Solar, Grid, Charger, Building)
  • Multi-select mode for bulk operations
TaskStatusPriorityDescription
Device provisioning wizard✅ CompleteMediumStep-by-step flow: select type > configure > test > activate
Bulk operations UI⚠️ PartialMediumMulti-select with actions (move, configure, delete)
Asset documentation viewer❌ Not StartedLowEmbedded PDF viewer for manuals, datasheets

Implementation Status:

Completed:

  • ✅ Device provisioning wizard (AssetCreatePage.vue) with 5 steps:
    • Device class selection (AssetDeviceClassStep.vue)
    • Basic info/naming (AssetNameStep.vue)
    • Protocol configuration (AssetProtocolStep.vue)
    • Device-specific config (AssetConfigStep.vue)
    • Review step (AssetReviewStep.vue)
  • ✅ Asset list page (AssetsPage.vue) with filtering, sorting, grouping
  • ✅ Multi-select mode with selection management
  • ✅ Bulk delete with confirmation dialog

In Progress:

  • ⚠️ Bulk operations limited to delete only
    • Missing: Bulk enable/disable, bulk configuration updates, bulk export

Not Started:

  • ❌ Asset documentation viewer (PDF/manual embedding)

Phase F3: Gateway Management UI

Reference: src/Voltimax.Edge.Gateway.Service/, src/@voltimax/iot-frontend/src/pages/

TaskStatusPriorityDescription
Gateway list and status⚠️ PartialHighTable with online/offline status, last seen, version, device count
Gateway detail view❌ Not StartedMediumConnected devices, metrics charts, logs tab
Remote configuration⚠️ PartialMediumEdit gateway config with validation, push via device twin
Connection diagnostics❌ Not StartedMediumPing, traceroute, protocol tests via direct methods
Gateway logs viewer⚠️ PartialMediumReal-time log streaming with level filter and search

Implementation Status:

Completed:

  • ✅ Physical location configuration (GatewayConfigurationPage.vue + PhysicalLocationForm.vue)
    • Latitude/longitude input with map preview
    • Location name management

In Progress:

  • ⚠️ Gateway status mixed into overview dashboard (AssetFreshnessCard.vue)
    • Shows asset/gateway health indicators
    • Missing: Dedicated gateway list page, version info, device count
  • ⚠️ Log viewer component exists (LogViewer.vue in AssetDetailLogs.vue)
    • Currently asset-specific, not gateway-specific
    • Has filtering, search, and selection features
    • Missing: Gateway-level log aggregation

Not Started:

  • ❌ Dedicated gateway list/status page
  • ❌ Gateway detail view (comprehensive status, connected devices, metrics)
  • ❌ Network configuration (connection parameters, credentials)
  • ❌ Connection diagnostics (ping, traceroute, protocol tests)
  • ❌ Gateway-specific log streaming and filtering

Phase F4: Administration

Reference: Keycloak Admin API, src/Voltimax.Platform.Api/Endpoints/Admin/, src/@voltimax/iot-frontend/src/pages/

TaskStatusPriorityDescription
User management❌ Not StartedHighCRUD users, assign roles, enable/disable, password reset
Audit log viewer❌ Not StartedMediumSearchable activity log with filters (user, action, date)

Implementation Status:

Completed:

  • ✅ Personal preferences page (PreferencesPage.vue) for current user settings
  • ✅ Organization/location management (LocationsManagementPage.vue) partially implemented

Not Started:

  • ❌ User management UI (list, create, edit, delete users)
  • ❌ Role assignment and permissions management
  • ❌ User enable/disable, password reset workflows
  • ❌ Audit log viewer (system-wide activity tracking)
    • Note: LogViewer.vue component exists but not exposed as audit log UI

Dependencies:

  • Requires Keycloak Admin API integration
  • Requires Platform API audit logging (Phase P1)

Dependencies

Gateway > Frontend Dependencies

Frontend PhaseDepends OnRationale
F1 (Battery steering controls)G1 (Strategy implementations)UI controls for selecting and configuring strategies
F3 (Gateway detail view)G2 (Safety interlocks, offline mode)Display gateway capabilities and operational status