Needs
The main interface for our employees monitoring our heatpumps. It is used for maintenance and support of the customers. The SPA is also available for customers in a slimmed down version, with less parameters accessibles. It allows checking historical data (temperatures, pressure, every measures as well as the energy meters), logging operations on the heat pump, managing updates and backup, see the alarm log and change every parameter.
Stack & dependencies
- VueJS 2 with Vue CLI 4
- vue-router
- vuex
- vue-i18n
- vee-validate
- ElementUI
- Highcharts
- Bootstrap
- idb-keyval
- jspdf
Design & screenshots
The design was based of a dashboard theme, but has been personalized and updated.
![](/images/web-app/min/dashboard-list.png)
![](/images/web-app/min/dashboard-heatpump.png)
![](/images/web-app/min/charts-heatpump.png)
![](/images/web-app/min/energy-monthly.png)
![](/images/web-app/min/energy-daily.png)
Screenshots of the web app in Safari on a 16” MacBook Pro