mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-18 06:46:35 +00:00
Add compare to energy sources table (#12762)
This commit is contained in:
Bram Kragten
GitHub
parent
2eaa246a03
commit
8e4e22b6f8
@ -83,6 +83,13 @@ export class HuiEnergySourcesTableCard
|
||||
let totalGas = 0;
|
||||
let totalGasCost = 0;
|
||||
|
||||
let totalGridCompare = 0;
|
||||
let totalGridCostCompare = 0;
|
||||
let totalSolarCompare = 0;
|
||||
let totalBatteryCompare = 0;
|
||||
let totalGasCompare = 0;
|
||||
let totalGasCostCompare = 0;
|
||||
|
||||
const types = energySourcesByType(this._data.prefs);
|
||||
|
||||
const computedStyles = getComputedStyle(this);
|
||||
@ -123,6 +130,8 @@ export class HuiEnergySourcesTableCard
|
||||
|
||||
const gasUnit = getEnergyGasUnit(this.hass, this._data.prefs) || "";
|
||||
|
||||
const compare = this._data.statsCompare !== undefined;
|
||||
|
||||
return html` <ha-card>
|
||||
${this._config.title
|
||||
? html`<h1 class="card-header">${this._config.title}</h1>`
|
||||
@ -142,6 +151,28 @@ export class HuiEnergySourcesTableCard
|
||||
"ui.panel.lovelace.cards.energy.energy_sources_table.source"
|
||||
)}
|
||||
</th>
|
||||
${compare
|
||||
? html`<th
|
||||
class="mdc-data-table__header-cell mdc-data-table__header-cell--numeric"
|
||||
role="columnheader"
|
||||
scope="col"
|
||||
>
|
||||
${this.hass.localize(
|
||||
"ui.panel.lovelace.cards.energy.energy_sources_table.previous_energy"
|
||||
)}
|
||||
</th>
|
||||
${showCosts
|
||||
? html`<th
|
||||
class="mdc-data-table__header-cell mdc-data-table__header-cell--numeric"
|
||||
role="columnheader"
|
||||
scope="col"
|
||||
>
|
||||
${this.hass.localize(
|
||||
"ui.panel.lovelace.cards.energy.energy_sources_table.previous_cost"
|
||||
)}
|
||||
</th>`
|
||||
: ""}`
|
||||
: ""}
|
||||
<th
|
||||
class="mdc-data-table__header-cell mdc-data-table__header-cell--numeric"
|
||||
role="columnheader"
|
||||
@ -173,6 +204,14 @@ export class HuiEnergySourcesTableCard
|
||||
) || 0;
|
||||
totalSolar += energy;
|
||||
|
||||
const compareEnergy =
|
||||
(compare &&
|
||||
calculateStatisticSumGrowth(
|
||||
this._data!.statsCompare[source.stat_energy_from]
|
||||
)) ||
|
||||
0;
|
||||
totalSolarCompare += compareEnergy;
|
||||
|
||||
const modifiedColor =
|
||||
idx > 0
|
||||
? this.hass.themes.darkMode
|
||||
@ -198,6 +237,16 @@ export class HuiEnergySourcesTableCard
|
||||
? computeStateName(entity)
|
||||
: source.stat_energy_from}
|
||||
</th>
|
||||
${compare
|
||||
? html`<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${formatNumber(compareEnergy, this.hass.locale)} kWh
|
||||
</td>
|
||||
${showCosts
|
||||
? html`<td class="mdc-data-table__cell"></td>`
|
||||
: ""}`
|
||||
: ""}
|
||||
<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
@ -214,6 +263,17 @@ export class HuiEnergySourcesTableCard
|
||||
<th class="mdc-data-table__cell" scope="row">
|
||||
Solar total
|
||||
</th>
|
||||
${compare
|
||||
? html`<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${formatNumber(totalSolarCompare, this.hass.locale)}
|
||||
kWh
|
||||
</td>
|
||||
${showCosts
|
||||
? html`<td class="mdc-data-table__cell"></td>`
|
||||
: ""}`
|
||||
: ""}
|
||||
<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
@ -237,6 +297,20 @@ export class HuiEnergySourcesTableCard
|
||||
) || 0;
|
||||
totalBattery += energyFrom - energyTo;
|
||||
|
||||
const energyFromCompare =
|
||||
(compare &&
|
||||
calculateStatisticSumGrowth(
|
||||
this._data!.statsCompare[source.stat_energy_from]
|
||||
)) ||
|
||||
0;
|
||||
const energyToCompare =
|
||||
(compare &&
|
||||
calculateStatisticSumGrowth(
|
||||
this._data!.statsCompare[source.stat_energy_to]
|
||||
)) ||
|
||||
0;
|
||||
totalBatteryCompare += energyFromCompare - energyToCompare;
|
||||
|
||||
const modifiedFromColor =
|
||||
idx > 0
|
||||
? this.hass.themes.darkMode
|
||||
@ -271,6 +345,17 @@ export class HuiEnergySourcesTableCard
|
||||
? computeStateName(entityFrom)
|
||||
: source.stat_energy_from}
|
||||
</th>
|
||||
${compare
|
||||
? html`<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${formatNumber(energyFromCompare, this.hass.locale)}
|
||||
kWh
|
||||
</td>
|
||||
${showCosts
|
||||
? html`<td class="mdc-data-table__cell"></td>`
|
||||
: ""}`
|
||||
: ""}
|
||||
<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
@ -295,6 +380,20 @@ export class HuiEnergySourcesTableCard
|
||||
? computeStateName(entityTo)
|
||||
: source.stat_energy_from}
|
||||
</th>
|
||||
${compare
|
||||
? html`<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${formatNumber(
|
||||
energyToCompare * -1,
|
||||
this.hass.locale
|
||||
)}
|
||||
kWh
|
||||
</td>
|
||||
${showCosts
|
||||
? html`<td class="mdc-data-table__cell"></td>`
|
||||
: ""}`
|
||||
: ""}
|
||||
<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
@ -313,6 +412,20 @@ export class HuiEnergySourcesTableCard
|
||||
"ui.panel.lovelace.cards.energy.energy_sources_table.battery_total"
|
||||
)}
|
||||
</th>
|
||||
${compare
|
||||
? html` <td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${formatNumber(
|
||||
totalBatteryCompare,
|
||||
this.hass.locale
|
||||
)}
|
||||
kWh
|
||||
</td>
|
||||
${showCosts
|
||||
? html`<td class="mdc-data-table__cell"></td>`
|
||||
: ""}`
|
||||
: ""}
|
||||
<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
@ -331,6 +444,15 @@ export class HuiEnergySourcesTableCard
|
||||
this._data!.stats[flow.stat_energy_from]
|
||||
) || 0;
|
||||
totalGrid += energy;
|
||||
|
||||
const compareEnergy =
|
||||
(compare &&
|
||||
calculateStatisticSumGrowth(
|
||||
this._data!.statsCompare[flow.stat_energy_from]
|
||||
)) ||
|
||||
0;
|
||||
totalGridCompare += compareEnergy;
|
||||
|
||||
const cost_stat =
|
||||
flow.stat_cost ||
|
||||
this._data!.info.cost_sensors[flow.stat_energy_from];
|
||||
@ -343,6 +465,16 @@ export class HuiEnergySourcesTableCard
|
||||
totalGridCost += cost;
|
||||
}
|
||||
|
||||
const costCompare =
|
||||
compare && cost_stat
|
||||
? calculateStatisticSumGrowth(
|
||||
this._data!.statsCompare[cost_stat]
|
||||
) || 0
|
||||
: null;
|
||||
if (costCompare !== null) {
|
||||
totalGridCostCompare += costCompare;
|
||||
}
|
||||
|
||||
const modifiedColor =
|
||||
idx > 0
|
||||
? this.hass.themes.darkMode
|
||||
@ -368,6 +500,29 @@ export class HuiEnergySourcesTableCard
|
||||
? computeStateName(entity)
|
||||
: flow.stat_energy_from}
|
||||
</th>
|
||||
${compare
|
||||
? html`<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${formatNumber(compareEnergy, this.hass.locale)} kWh
|
||||
</td>
|
||||
${showCosts
|
||||
? html`<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${costCompare !== null
|
||||
? formatNumber(
|
||||
costCompare,
|
||||
this.hass.locale,
|
||||
{
|
||||
style: "currency",
|
||||
currency: this.hass.config.currency!,
|
||||
}
|
||||
)
|
||||
: ""}
|
||||
</td>`
|
||||
: ""}`
|
||||
: ""}
|
||||
<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
@ -406,6 +561,24 @@ export class HuiEnergySourcesTableCard
|
||||
totalGridCost += cost;
|
||||
}
|
||||
|
||||
const energyCompare =
|
||||
((compare &&
|
||||
calculateStatisticSumGrowth(
|
||||
this._data!.statsCompare[flow.stat_energy_to]
|
||||
)) ||
|
||||
0) * -1;
|
||||
totalGridCompare += energyCompare;
|
||||
|
||||
const costCompare =
|
||||
compare && cost_stat
|
||||
? (calculateStatisticSumGrowth(
|
||||
this._data!.statsCompare[cost_stat]
|
||||
) || 0) * -1
|
||||
: null;
|
||||
if (costCompare !== null) {
|
||||
totalGridCostCompare += costCompare;
|
||||
}
|
||||
|
||||
const modifiedColor =
|
||||
idx > 0
|
||||
? this.hass.themes.darkMode
|
||||
@ -429,6 +602,29 @@ export class HuiEnergySourcesTableCard
|
||||
<th class="mdc-data-table__cell" scope="row">
|
||||
${entity ? computeStateName(entity) : flow.stat_energy_to}
|
||||
</th>
|
||||
${compare
|
||||
? html`<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${formatNumber(energyCompare, this.hass.locale)} kWh
|
||||
</td>
|
||||
${showCosts
|
||||
? html`<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${costCompare !== null
|
||||
? formatNumber(
|
||||
costCompare,
|
||||
this.hass.locale,
|
||||
{
|
||||
style: "currency",
|
||||
currency: this.hass.config.currency!,
|
||||
}
|
||||
)
|
||||
: ""}
|
||||
</td>`
|
||||
: ""}`
|
||||
: ""}
|
||||
<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
@ -457,6 +653,28 @@ export class HuiEnergySourcesTableCard
|
||||
"ui.panel.lovelace.cards.energy.energy_sources_table.grid_total"
|
||||
)}
|
||||
</th>
|
||||
${compare
|
||||
? html`<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${formatNumber(totalGridCompare, this.hass.locale)}
|
||||
kWh
|
||||
</td>
|
||||
${showCosts
|
||||
? html`<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${formatNumber(
|
||||
totalGridCostCompare,
|
||||
this.hass.locale,
|
||||
{
|
||||
style: "currency",
|
||||
currency: this.hass.config.currency!,
|
||||
}
|
||||
)}
|
||||
</td>`
|
||||
: ""}`
|
||||
: ""}
|
||||
<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
@ -482,6 +700,14 @@ export class HuiEnergySourcesTableCard
|
||||
) || 0;
|
||||
totalGas += energy;
|
||||
|
||||
const energyCompare =
|
||||
(compare &&
|
||||
calculateStatisticSumGrowth(
|
||||
this._data!.statsCompare[source.stat_energy_from]
|
||||
)) ||
|
||||
0;
|
||||
totalGasCompare += energyCompare;
|
||||
|
||||
const cost_stat =
|
||||
source.stat_cost ||
|
||||
this._data!.info.cost_sensors[source.stat_energy_from];
|
||||
@ -493,6 +719,16 @@ export class HuiEnergySourcesTableCard
|
||||
totalGasCost += cost;
|
||||
}
|
||||
|
||||
const costCompare =
|
||||
compare && cost_stat
|
||||
? calculateStatisticSumGrowth(
|
||||
this._data!.statsCompare[cost_stat]
|
||||
) || 0
|
||||
: null;
|
||||
if (costCompare !== null) {
|
||||
totalGasCostCompare += costCompare;
|
||||
}
|
||||
|
||||
const modifiedColor =
|
||||
idx > 0
|
||||
? this.hass.themes.darkMode
|
||||
@ -518,6 +754,26 @@ export class HuiEnergySourcesTableCard
|
||||
? computeStateName(entity)
|
||||
: source.stat_energy_from}
|
||||
</th>
|
||||
${compare
|
||||
? html` <td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${formatNumber(energyCompare, this.hass.locale)}
|
||||
${gasUnit}
|
||||
</td>
|
||||
${showCosts
|
||||
? html`<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${costCompare !== null
|
||||
? formatNumber(costCompare, this.hass.locale, {
|
||||
style: "currency",
|
||||
currency: this.hass.config.currency!,
|
||||
})
|
||||
: ""}
|
||||
</td>`
|
||||
: ""}`
|
||||
: ""}
|
||||
<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
@ -545,6 +801,28 @@ export class HuiEnergySourcesTableCard
|
||||
"ui.panel.lovelace.cards.energy.energy_sources_table.gas_total"
|
||||
)}
|
||||
</th>
|
||||
${compare
|
||||
? html`<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${formatNumber(totalGasCompare, this.hass.locale)}
|
||||
${gasUnit}
|
||||
</td>
|
||||
${showCosts
|
||||
? html`<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
${formatNumber(
|
||||
totalGasCostCompare,
|
||||
this.hass.locale,
|
||||
{
|
||||
style: "currency",
|
||||
currency: this.hass.config.currency!,
|
||||
}
|
||||
)}
|
||||
</td>`
|
||||
: ""}`
|
||||
: ""}
|
||||
<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
>
|
||||
@ -570,6 +848,23 @@ export class HuiEnergySourcesTableCard
|
||||
"ui.panel.lovelace.cards.energy.energy_sources_table.total_costs"
|
||||
)}
|
||||
</th>
|
||||
${compare
|
||||
? html`<td class="mdc-data-table__cell">
|
||||
${formatNumber(
|
||||
totalGasCostCompare + totalGridCostCompare,
|
||||
this.hass.locale,
|
||||
{
|
||||
style: "currency",
|
||||
currency: this.hass.config.currency!,
|
||||
}
|
||||
)}
|
||||
</td>
|
||||
${showCosts
|
||||
? html`<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
></td>`
|
||||
: ""}`
|
||||
: ""}
|
||||
<td class="mdc-data-table__cell"></td>
|
||||
<td
|
||||
class="mdc-data-table__cell mdc-data-table__cell--numeric"
|
||||
|
||||
@ -3326,6 +3326,8 @@
|
||||
"source": "Source",
|
||||
"energy": "Energy",
|
||||
"cost": "Cost",
|
||||
"previous_energy": "Previous Energy",
|
||||
"previous_cost": "Previous Cost",
|
||||
"battery_total": "Battery total",
|
||||
"total_costs": "Total costs"
|
||||
},
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user