@@ -28,13 +28,12 @@ For Enedis, the interval is **3 days**
...
@@ -28,13 +28,12 @@ For Enedis, the interval is **3 days**
For GRDF, the interval is **5 days**
For GRDF, the interval is **5 days**
For EGL, the interval is **5 days**
For EGL, the interval is **5 days**
## ConsumptionView
## ConsumptionView
### Description
### Description
This view is the main view of the application. It displays an agreggation view of all connected fluids.
This view is the main view of the application. It displays an agreggation view of all connected fluids.
It is the entrypoint to several children components that each handles a particular feature :
It is the entrypoint to several children components that each handles a particular feature :
- DateNavigator
- DateNavigator
- FluidButtons
- FluidButtons
...
@@ -44,17 +43,15 @@ It is the entrypoint to several children components that each handles a particul
...
@@ -44,17 +43,15 @@ It is the entrypoint to several children components that each handles a particul
The submenu (FluidButtons), allows the user to switch between the different fluids and the multifluid view.
The submenu (FluidButtons), allows the user to switch between the different fluids and the multifluid view.
### Rules
### Rules
1. If no fluids are connected, this view will display the multifluid view with the *KonnectorViewerList* component which shows buttons that allow user to connect its first fluids. These buttons redirects to the chosen fluid section with the connection form.
1. If no fluids are connected, this view will display the multifluid view with the _KonnectorViewerList_ component which shows buttons that allow user to connect its first fluids. These buttons redirects to the chosen fluid section with the connection form.
2. If at least one fluid is connected, the multi fluid view and the connected fluids views are shown (electricity, water, gas).
2. If at least one fluid is connected, the multi fluid view and the connected fluids views are shown (electricity, water, gas).
3. For the multifluid view, Fluids are displayed in multi fluid color and in euro
3. For the multifluid view, Fluids are displayed in multi fluid color and in euro
4. Fluid is displayed in the given fluid color and unit (kWh for electricity and gaz, l for water)
4. Fluid is displayed in the given fluid color and unit (kWh for electricity and gaz, l for water)
5. TimeStep available are the folowing: week, month, year, 5 years and day for electricity fluid
5. TimeStep available are the folowing: week, month, year, 5 years and day for electricity fluid
6. If user has selected day time step and change the fluid, the week time step will be selected by default.
6. If user has selected day time step and change the fluid, the week time step will be selected by default.
## DateNavigator
## DateNavigator
### Description
### Description
...
@@ -90,37 +87,113 @@ It is splitted in 3 distinct parts:
...
@@ -90,37 +87,113 @@ It is splitted in 3 distinct parts:
- The FluidSlides
- The FluidSlides
- The TimeStep Navigator
- The TimeStep Navigator
### Rules
### Rules
| Component | Rules |
| ----------- | ------------------------------ |
| ConsumptionVisualizer | <ul><li>Calls the *DataloadConsumptionVisualizer* component that shows the dataload of the selected timeStep and fluid</li><li>For multifluid, we show the total consumption of all connected fluid, and the consumption fluid by fluid, all in €</li><li>We display a message according to the data state as explained in the [DataLoad Consumption Visualizer](./#dataload-consumption-visualizer)</li></ul>|
|FluidSlides | This component calls the fluidSwipe component which is handled by the library *react-swipeable-views*, and allows the user to swipe accross the selected timestep. This library loads the slides before and after the current slide, so we reduce the loading time between slides.|
|TimeStepSelector| This component allows the user to change the current Timestep, or to return to today's date with a button|
| ConsumptionVisualizer | <ul><li>Calls the _DataloadConsumptionVisualizer_ component that shows the dataload of the selected timeStep and fluid</li><li>For multifluid, we show the total consumption of all connected fluid, and the consumption fluid by fluid, all in €</li><li>We display a message according to the data state as explained in the [DataLoad Consumption Visualizer](./#dataload-consumption-visualizer)</li></ul> |
| FluidSlides | This component calls the fluidSwipe component which is handled by the library _react-swipeable-views_, and allows the user to swipe accross the selected timestep. This library loads the slides before and after the current slide, so we reduce the loading time between slides. |
| TimeStepSelector | This component allows the user to change the current Timestep, or to return to today's date with a button |
## DataLoad Consumption Visualizer
## DataLoad Consumption Visualizer
### Description
### Description
This view displays the load of a specified fluid (electricity, water, gas) or the total consumption on the multifluid screen.
This view displays the load of a specified fluid (electricity, water, gas) or the total consumption on the multifluid screen.
It also allows to navigate between the singlefluid views.
The display will be done in function of the data state.
### Rules
### Rules to define data state
1. The Load is displayed in the given fluid color and unit (kWh for electricity and gaz, l for water)
The data state is define in the "ConsumptionFormatter" service following theses rules :
2. For the dataloads > 1000, it will display a mega unit (MWh for electricity and gaz, m3 for water)
3. If it's multifluid view, we show the total consumption in €
#### For single fluid
4. While the last data date is between today's date and the interval mentionned above : we consider the data as *upcoming*
5. If the last data date is before the interval (eg: lastDataDate = 8 days) : we consider the data as *outdated*
| Condition | State |
6. If the a data is missing but there is other data after: we consider the data as *missing*, which means it is probably the supplier's fault or the customer's device
| At least one fluid have a data and another fluids with empty data | AGGREGATED_WITH_EMPTY |
| All fluids have valid data | AGGREGATED_VALID |
| All fluid have a hole or missing data | AGGREGATED_HOLE_OR_MISSING |
| At least one fluid have a data and another fluids with a missing or hole data | AGGREGATED_WITH_HOLE_OR_MISSING |
| At least one fluid have upcoming or coming data and other fluid doesn’t have missing or hole data | AGGREGATED_WITH_COMING |
| All fluid have coming data | AGGREGATED_COMING |
### Display of the specific cases (component: DataloadNoValue)
This display appear instead of the traditionnal one (described below). It is used to display a general message which override the value. Here are the rules :
| Condition | Displayed label | Comments |
| --- | --- | --- |
| Single fluid && dataload state = EMPTY | Pas de données | |
| Single fluid && dataload state = VALID | - | |
| Single fluid && dataload state = HOLE | Pas de données | |
| Single fluid && dataload state = MISSING | Données manquantes | Displayed in red and clickable (scroll to the konnector card) |
| Single fluid && dataload state = UPCOMING | À venir | |
| Single fluid && dataload state = COMING | À venir | |
| Multi fluid && dataload state = AGGREGATED_EMPTY | Pas de données | |
| Multi fluid && dataload state = AGGREGATED_WITH_EMPTY | - | |
| Multi fluid && dataload state = AGGREGATED_VALID | - | |
| Multi fluid && dataload state = AGGREGATED_WITH_COMING | - | |
| Multi fluid && dataload state = AGGREGATED_HOLE_OR_MISSING | Données manquantes | |
| Multi fluid && dataload state = AGGREGATED_WITH_HOLE_OR_MISSING | - | |
| Multi fluid && dataload state = AGGREGATED_COMING | À venir | |
### Display of the load values
In function of the fluid type (single or multi) and of the data state, the display will be adapted.
#### Display of the main value (component: DataloadSectionValue)
Used to display the load or price in function of following rules :