jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-18 14:56:37 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add compare to energy sources table (#12762)

Browse Source
This commit is contained in:
Bram Kragten 2022-05-24 17:20:16 +02:00 committed by GitHub
parent 2eaa246a03
commit 8e4e22b6f8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 297 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

295
src/panels/lovelace/cards/energy/hui-energy-sources-table-card.ts
View File

@ -83,6 +83,13 @@ export class HuiEnergySourcesTableCard
let totalGas = 0; let totalGas = 0;
let totalGasCost = 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 types = energySourcesByType(this._data.prefs);
const computedStyles = getComputedStyle(this); const computedStyles = getComputedStyle(this);
@ -123,6 +130,8 @@ export class HuiEnergySourcesTableCard
const gasUnit = getEnergyGasUnit(this.hass, this._data.prefs) || ""; const gasUnit = getEnergyGasUnit(this.hass, this._data.prefs) || "";
const compare = this._data.statsCompare !== undefined;
return html` <ha-card> return html` <ha-card>
${this._config.title ${this._config.title
? html`<h1 class="card-header">${this._config.title}</h1>` ? 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" "ui.panel.lovelace.cards.energy.energy_sources_table.source"
)} )}
</th> </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 <th
class="mdc-data-table__header-cell mdc-data-table__header-cell--numeric" class="mdc-data-table__header-cell mdc-data-table__header-cell--numeric"
role="columnheader" role="columnheader"
@ -173,6 +204,14 @@ export class HuiEnergySourcesTableCard
) || 0; ) || 0;
totalSolar += energy; totalSolar += energy;
const compareEnergy =
(compare &&
calculateStatisticSumGrowth(
this._data!.statsCompare[source.stat_energy_from]
)) ||
0;
totalSolarCompare += compareEnergy;
const modifiedColor = const modifiedColor =
idx > 0 idx > 0
? this.hass.themes.darkMode ? this.hass.themes.darkMode
@ -198,6 +237,16 @@ export class HuiEnergySourcesTableCard
? computeStateName(entity) ? computeStateName(entity)
: source.stat_energy_from} : source.stat_energy_from}
</th> </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 <td
class="mdc-data-table__cell mdc-data-table__cell--numeric" 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"> <th class="mdc-data-table__cell" scope="row">
Solar total Solar total
</th> </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 <td
class="mdc-data-table__cell mdc-data-table__cell--numeric" class="mdc-data-table__cell mdc-data-table__cell--numeric"
> >
@ -237,6 +297,20 @@ export class HuiEnergySourcesTableCard
) || 0; ) || 0;
totalBattery += energyFrom - energyTo; 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 = const modifiedFromColor =
idx > 0 idx > 0
? this.hass.themes.darkMode ? this.hass.themes.darkMode
@ -271,6 +345,17 @@ export class HuiEnergySourcesTableCard
? computeStateName(entityFrom) ? computeStateName(entityFrom)
: source.stat_energy_from} : source.stat_energy_from}
</th> </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 <td
class="mdc-data-table__cell mdc-data-table__cell--numeric" class="mdc-data-table__cell mdc-data-table__cell--numeric"
> >
@ -295,6 +380,20 @@ export class HuiEnergySourcesTableCard
? computeStateName(entityTo) ? computeStateName(entityTo)
: source.stat_energy_from} : source.stat_energy_from}
</th> </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 <td
class="mdc-data-table__cell mdc-data-table__cell--numeric" 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" "ui.panel.lovelace.cards.energy.energy_sources_table.battery_total"
)} )}
</th> </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 <td
class="mdc-data-table__cell mdc-data-table__cell--numeric" class="mdc-data-table__cell mdc-data-table__cell--numeric"
> >
@ -331,6 +444,15 @@ export class HuiEnergySourcesTableCard
this._data!.stats[flow.stat_energy_from] this._data!.stats[flow.stat_energy_from]
) || 0; ) || 0;
totalGrid += energy; totalGrid += energy;
const compareEnergy =
(compare &&
calculateStatisticSumGrowth(
this._data!.statsCompare[flow.stat_energy_from]
)) ||
0;
totalGridCompare += compareEnergy;
const cost_stat = const cost_stat =
flow.stat_cost || flow.stat_cost ||
this._data!.info.cost_sensors[flow.stat_energy_from]; this._data!.info.cost_sensors[flow.stat_energy_from];
@ -343,6 +465,16 @@ export class HuiEnergySourcesTableCard
totalGridCost += cost; totalGridCost += cost;
} }
const costCompare =
compare && cost_stat
? calculateStatisticSumGrowth(
this._data!.statsCompare[cost_stat]
) || 0
: null;
if (costCompare !== null) {
totalGridCostCompare += costCompare;
}
const modifiedColor = const modifiedColor =
idx > 0 idx > 0
? this.hass.themes.darkMode ? this.hass.themes.darkMode
@ -368,6 +500,29 @@ export class HuiEnergySourcesTableCard
? computeStateName(entity) ? computeStateName(entity)
: flow.stat_energy_from} : flow.stat_energy_from}
</th> </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 <td
class="mdc-data-table__cell mdc-data-table__cell--numeric" class="mdc-data-table__cell mdc-data-table__cell--numeric"
> >
@ -406,6 +561,24 @@ export class HuiEnergySourcesTableCard
totalGridCost += cost; 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 = const modifiedColor =
idx > 0 idx > 0
? this.hass.themes.darkMode ? this.hass.themes.darkMode
@ -429,6 +602,29 @@ export class HuiEnergySourcesTableCard
<th class="mdc-data-table__cell" scope="row"> <th class="mdc-data-table__cell" scope="row">
${entity ? computeStateName(entity) : flow.stat_energy_to} ${entity ? computeStateName(entity) : flow.stat_energy_to}
</th> </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 <td
class="mdc-data-table__cell mdc-data-table__cell--numeric" 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" "ui.panel.lovelace.cards.energy.energy_sources_table.grid_total"
)} )}
</th> </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 <td
class="mdc-data-table__cell mdc-data-table__cell--numeric" class="mdc-data-table__cell mdc-data-table__cell--numeric"
> >
@ -482,6 +700,14 @@ export class HuiEnergySourcesTableCard
) || 0; ) || 0;
totalGas += energy; totalGas += energy;
const energyCompare =
(compare &&
calculateStatisticSumGrowth(
this._data!.statsCompare[source.stat_energy_from]
)) ||
0;
totalGasCompare += energyCompare;
const cost_stat = const cost_stat =
source.stat_cost || source.stat_cost ||
this._data!.info.cost_sensors[source.stat_energy_from]; this._data!.info.cost_sensors[source.stat_energy_from];
@ -493,6 +719,16 @@ export class HuiEnergySourcesTableCard
totalGasCost += cost; totalGasCost += cost;
} }
const costCompare =
compare && cost_stat
? calculateStatisticSumGrowth(
this._data!.statsCompare[cost_stat]
) || 0
: null;
if (costCompare !== null) {
totalGasCostCompare += costCompare;
}
const modifiedColor = const modifiedColor =
idx > 0 idx > 0
? this.hass.themes.darkMode ? this.hass.themes.darkMode
@ -518,6 +754,26 @@ export class HuiEnergySourcesTableCard
? computeStateName(entity) ? computeStateName(entity)
: source.stat_energy_from} : source.stat_energy_from}
</th> </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 <td
class="mdc-data-table__cell mdc-data-table__cell--numeric" 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" "ui.panel.lovelace.cards.energy.energy_sources_table.gas_total"
)} )}
</th> </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 <td
class="mdc-data-table__cell mdc-data-table__cell--numeric" 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" "ui.panel.lovelace.cards.energy.energy_sources_table.total_costs"
)} )}
</th> </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"></td>
<td <td
class="mdc-data-table__cell mdc-data-table__cell--numeric" class="mdc-data-table__cell mdc-data-table__cell--numeric"

2
src/translations/en.json
View File

@ -3326,6 +3326,8 @@
"source": "Source", "source": "Source",
"energy": "Energy", "energy": "Energy",
"cost": "Cost", "cost": "Cost",
"previous_energy": "Previous Energy",
"previous_cost": "Previous Cost",
"battery_total": "Battery total", "battery_total": "Battery total",
"total_costs": "Total costs" "total_costs": "Total costs"
}, },