render daily energy graphs
This commit is contained in:
@@ -1,54 +1,17 @@
|
||||
<rt-require dependency="./../energy/energy" as="Energy"/>
|
||||
<rt-require dependency="./../power/power" as="Power"/>
|
||||
<div id="layout">
|
||||
<div class="alert alert-warning" rt-if="this.state.requesting_data">Loading data...</div>
|
||||
<div class="alert alert-warning" rt-if="this.state.requesting_data">Retrieving houses...</div>
|
||||
<h1 rt-if="this.state.house">{this.state.house.name}</h1>
|
||||
<h3 rt-if="this.state.view">{this.view_name}</h3>
|
||||
|
||||
<div>
|
||||
<select class="form-control" onChange="{this.setView}">
|
||||
<option rt-repeat="view in this.state.views" value="{view[0]}" key="view-{view[0]}">{view[1]}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div rt-if="this.state.houses">
|
||||
<select class="form-control" onChange="{this.setHouse}">
|
||||
<option rt-repeat="house in this.state.houses" value="{house.data.id}" key="{house.react_key}">{house.data.name}</option>
|
||||
</select>
|
||||
</div>
|
||||
<select class="form-control" onChange="{this.setView}">
|
||||
<option rt-repeat="view in this.state.views" value="{view[0]}" key="view-{view[0]}">{view[1]}</option>
|
||||
</select>
|
||||
<select rt-if="this.state.houses" class="form-control" onChange="{this.setHouse}">
|
||||
<option rt-repeat="house in this.state.houses" value="{house.data.id}" key="{house.react_key}">{house.data.name}</option>
|
||||
</select>
|
||||
|
||||
<table class="table" rt-if="this.state.view === 'energy' && this.state.house">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Day</th>
|
||||
<th>Consumption (kWh)</th>
|
||||
<th>Production (kWh)</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr rt-repeat="energy_datum in this.state.house.energy_data" key="{energy_datum.react_key}">
|
||||
<td></td>
|
||||
<td>{energy_datum.day_to_s}</td>
|
||||
<td>{energy_datum.consumption_to_s}</td>
|
||||
<td>{energy_datum.production_to_s}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<table class="table" rt-if="this.state.view === 'power' && this.state.house">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Time</th>
|
||||
<th>Consumption (W)</th>
|
||||
<th>Production (W)</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr rt-repeat="power_datum in this.state.house.power_data" key="{power_datum.react_key}">
|
||||
<td></td>
|
||||
<td>{power_datum.time_to_s}</td>
|
||||
<td>{power_datum.consumption_to_s}</td>
|
||||
<td>{power_datum.production_to_s}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<Energy rt-if="this.state.house && this.state.view === 'energy'" house="{this.state.house}"></Energy>
|
||||
<Power rt-if="this.state.house && this.state.view === 'power'" house="{this.state.house}"></Power>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user