Messages : 3,494
Sujets : 46
Inscription : Mar 2013
C'est joli et ergonomique mais il manque le code !
Messages : 474
Sujets : 26
Inscription : Feb 2020
02/01/2025, 18:36:33
(Modification du message : 02/01/2025, 18:40:21 par XeNo.)
(02/01/2025, 14:39:37)Ives a écrit : C'est joli et ergonomique mais il manque le code !
Voici la page complète (à insérer dans "editeur de configuration {}" de lovelace)
Je n'ai pu mettre que la partie de gauche et le journalier (le forum m'a dit "trop long", 65536 caractères max et il y en avait 420699 !
Ca manque encore d'ergonomie, comme je force certaines valeurs dans les écartements, la vue sur le téléphone n'est pas encore optimisée..
A savoir qu'il faut aussi créer autant de switch virtuels que de section à déplier.
Dans "Appareils et Services"
Dans Entrées, Creer une entrée, Sélectionner "Interrupteur"
Il faut les appeler sous cette forme :
show_details_tempo_total_daily
...
show_details_tempo_prises_monthly
...
show_details_tempo_chauffagesdb_yearly
Cela crée des input_boolean.show_details_tempo_chauffagesdb_yearly qui sont basculés en cliquant sur la section maître
La partie de gauche :
Code : - title: Energie Tempo
path: energie-tempo
cards:
- type: vertical-stack
title: États Tempo
cards:
- type: horizontal-stack
horizontal: true
cards:
- type: custom:mushroom-template-card
entity: sensor.rte_tempo_couleur_actuelle
primary: '{{ states(entity) }}'
layout: horizontal
secondary: Aujourd'hui
icon: mdi:calendar-multiselect
icon_color: >
{% if is_state('sensor.rte_tempo_couleur_actuelle', 'Blanc')
%}
black
{% else %}
white
{% endif %}
tap_action:
action: more-info
card_mod:
style:
.: |
ha-card {
{% if is_state('sensor.rte_tempo_couleur_actuelle', 'Rouge') %}
background-color: red;
{% elif is_state('sensor.rte_tempo_couleur_actuelle', 'Blanc') %}
background-color: white;
{% elif is_state('sensor.rte_tempo_couleur_actuelle', 'Bleu') %}
background-color: DodgerBlue;
{% elif is_state('sensor.rte_tempo_couleur_actuelle', 'NON_DEFINI') %}
background-color: lightgrey;
{% endif %};
}
mushroom-state-info$: |
.container {
{% if is_state('sensor.rte_tempo_couleur_actuelle', 'Blanc') %}
--card-primary-color: black;
--card-secondary-color: black;
{% else %}
--card-primary-color: white;
--card-secondary-color: white;
{% endif %}
--card-secondary-font-size: 11px;
--card-primary-font-size: 17px;
}
- type: custom:mushroom-template-card
entity: sensor.rte_tempo_prochaine_couleur
primary: '{{ states(entity) }}'
layout: horizontal
secondary: Demain
icon: mdi:calendar-multiselect
icon_color: >
{% if is_state('sensor.rte_tempo_prochaine_couleur', 'Blanc')
%}
black
{% else %}
white
{% endif %}
tap_action:
action: more-info
card_mod:
style:
.: |
ha-card {
{% if is_state('sensor.rte_tempo_prochaine_couleur', 'Rouge') %}
background-color: red;
{% elif is_state('sensor.rte_tempo_prochaine_couleur', 'Blanc') %}
background-color: white;
{% elif is_state('sensor.rte_tempo_prochaine_couleur', 'Bleu') %}
background-color: DodgerBlue;
{% elif is_state('sensor.rte_tempo_prochaine_couleur', 'NON_DEFINI') %}
background-color: lightgrey;
{% endif %};
}
mushroom-state-info$: |
.container {
{% if is_state('sensor.rte_tempo_prochaine_couleur', 'Blanc') %}
--card-primary-color: black;
--card-secondary-color: black;
{% else %}
--card-primary-color: white;
--card-secondary-color: white;
{% endif %}
--card-secondary-font-size: 11px;
--card-primary-font-size: 17px;
}
- type: horizontal-stack
cards:
- type: custom:mushroom-template-card
entity: sensor.rte_tempo_cycle_jours_restants_bleu
primary: null
multiline_secondary: true
secondary: >
{{ (states('sensor.rte_tempo_cycle_jours_restants_bleu'))
}}j/300
tap_action:
action: more-info
card_mod:
style:
mushroom-state-info$: |
.container {
--card-primary-color: DodgerBlue;
--card-secondary-color: DodgerBlue;
--card-primary-font-size: 14px;
--card-secondary-font-size: 14px;
--card-primary-font-weight: 500;
--card-secondary-font-weight: 500;
align-items: center;
}
- type: custom:mushroom-template-card
entity: sensor.rte_tempo_cycle_jours_restants_blanc
primary: null
multiline_secondary: true
secondary: >
{{ (states('sensor.rte_tempo_cycle_jours_restants_blanc'))
}}j/43
tap_action:
action: more-info
card_mod:
style:
mushroom-state-info$: |
.container {
--card-primary-color: grey;
--card-secondary-color: grey;
--card-primary-font-size: 14px;
--card-secondary-font-size: 14px;
--card-primary-font-weight: 500;
--card-secondary-font-weight: 500;
align-items: center;
}
- type: custom:mushroom-template-card
entity: sensor.rte_tempo_cycle_jours_restants_rouge
primary: null
multiline_secondary: true
secondary: >
{{ (states('sensor.rte_tempo_cycle_jours_restants_rouge'))
}}j/22
tap_action:
action: more-info
card_mod:
style:
mushroom-state-info$: |
.container {
--card-primary-color: tomato;
--card-secondary-color: tomato;
--card-primary-font-size: 14px;
--card-secondary-font-size: 14px;
--card-primary-font-weight: 500;
--card-secondary-font-weight: 500;
align-items: center;
}
- type: custom:mushroom-template-card
entity: sensor.rte_tempo_prochaine_couleur
icon: mdi:lightning-bolt-circle
primary: Période actuelle
layout: horizontal
secondary: >-
{{ states('sensor.tarif_en_cours_texte') }} - {{
states('input_number.tarif_actuel_tempo') }} €/kWh
tap_action:
action: none
card_mod:
style: |
ha-state-icon {
--icon-symbol-size: 40px;
{% if states('sensor.tarif_en_cours_texte') == 'Bleu HC' %}
color: #5F87C7;
{% elif states('sensor.tarif_en_cours_texte') == 'Bleu HP' %}
color: #1057C8;
{% elif states('sensor.tarif_en_cours_texte') == 'Blanc HC' %}
color: #9F9F9F;
{% elif states('sensor.tarif_en_cours_texte') == 'Blanc HP' %}
color: #555555;
{% elif states('sensor.tarif_en_cours_texte') == 'Rouge HC' %}
color: #E89E8E;
{% elif states('sensor.tarif_en_cours_texte') == 'Rouge HP' %}
color: #E85130;
{% endif %}
}
- type: custom:fold-entity-row
head:
type: section
label: Grille tarifaire Tempo
icon: mdi:currency-eur
entities:
- entity: input_number.electricite_general_cout_kwh_bleu_hc
type: custom:multiple-entity-row
name: Tempo Bleu
icon: mdi:currency-eur
state_header: Heures Creuses
state_color: true
entities:
- entity: input_number.electricite_general_cout_kwh_bleu_hp
name: Heures Pleines
- entity: input_number.electricite_general_cout_kwh_blanc_hc
type: custom:multiple-entity-row
name: Tempo Blanc
icon: mdi:currency-eur
state_header: Heures Creuses
state_color: true
entities:
- entity: input_number.electricite_general_cout_kwh_blanc_hp
name: Heures Pleines
- entity: input_number.electricite_general_cout_kwh_rouge_hc
type: custom:multiple-entity-row
name: Tempo Rouge
icon: mdi:currency-eur
state_header: Heures Creuses
state_color: true
entities:
- entity: input_number.electricite_general_cout_kwh_rouge_hp
name: Heures Pleines
- type: custom:gap-card
Messages : 474
Sujets : 26
Inscription : Feb 2020
Et la première colonne pour le Jour :
Je suis obligé d'arrêter à Lumières, sinon trop de caractères..
A copier/coller en changeant les termes daily par monthly puis par yearly pour moi ici.
Code : - type: vertical-stack
cards:
- type: vertical-stack
cards:
- type: custom:mushroom-title-card
title: Jour
- type: horizontal-stack
horizontal: true
cards:
- type: custom:mushroom-template-card
primary: Total
secondary: ' {{ states(''sensor.energy_total_daily'') }} kWh - {{ states(''sensor.cout_total_daily'') }} €'
layout: horizontal
icon: mdi:lightning-bolt-circle
tap_action:
action: call-service
service: input_boolean.toggle
service_data:
entity_id: input_boolean.show_details_tempo_total_daily
card_mod:
style:
.: |
ha-card {
height: 40px !important;
}
ha-state-icon {
--icon-symbol-size: 30px;
}
mushroom-state-info$: |
.container {
flex-direction: row !important;
align-items: baseline;
gap: 230px;
}
- type: conditional
conditions:
- entity: input_boolean.show_details_tempo_total_daily
state_not: 'off'
card:
type: vertical-stack
cards:
- type: horizontal-stack
horizontal: true
cards:
- type: custom:mushroom-template-card
entity: sensor.cout_total_daily_bleu_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_usage_daily_bleu_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #5F87C7;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_daily_bleu_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_usage_daily_bleu_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #1057C8;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_daily_blanc_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_usage_daily_blanc_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #9F9F9F;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_daily_blanc_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_usage_daily_blanc_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #555555;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_daily_rouge_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_usage_daily_rouge_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #E89E8E;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_daily_rouge_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_usage_daily_rouge_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #E85130;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: horizontal-stack
horizontal: true
cards:
- type: custom:gap-card
height: 40px
- type: custom:mushroom-template-card
primary: ECS
secondary: ' {{ states(''sensor.energy_total_ecs_daily'') }} kWh - {{ states(''sensor.cout_total_ecs_daily'') }} €'
layout: horizontal
icon: mdi:lightning-bolt-circle
tap_action:
action: call-service
service: input_boolean.toggle
service_data:
entity_id: input_boolean.show_details_tempo_ecs_daily
card_mod:
style:
.: |
ha-card {
height: 40px !important;
width: 400px;
}
ha-state-icon {
--icon-symbol-size: 30px;
}
mushroom-state-info$: |
.container {
flex-direction: row !important;
align-items: baseline;
gap: 182px;
}
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: conditional
conditions:
- entity: input_boolean.show_details_tempo_ecs_daily
state_not: 'off'
card:
type: vertical-stack
cards:
- type: horizontal-stack
horizontal: true
cards:
- type: custom:mushroom-template-card
entity: sensor.cout_total_ecs_daily_bleu_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_ecs_usage_daily_bleu_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #5F87C7;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_ecs_daily_bleu_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_ecs_usage_daily_bleu_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #1057C8;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_ecs_daily_blanc_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_ecs_usage_daily_blanc_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #9F9F9F;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_ecs_daily_blanc_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_ecs_usage_daily_blanc_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #555555;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_ecs_daily_rouge_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_ecs_usage_daily_rouge_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #E89E8E;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_ecs_daily_rouge_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_ecs_usage_daily_rouge_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #E85130;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: horizontal-stack
horizontal: true
cards:
- type: custom:gap-card
height: 40px
- type: custom:mushroom-template-card
primary: LT
secondary: ' {{ states(''sensor.energy_total_lt_daily'') }} kWh - {{ states(''sensor.cout_total_lt_daily'') }} €'
layout: horizontal
icon: mdi:lightning-bolt-circle
tap_action:
action: call-service
service: input_boolean.toggle
service_data:
entity_id: input_boolean.show_details_tempo_lt_daily
card_mod:
style:
.: |
ha-card {
height: 40px !important;
width: 400px;
}
ha-state-icon {
--icon-symbol-size: 30px;
}
mushroom-state-info$: |
.container {
flex-direction: row !important;
align-items: baseline;
gap: 200px;
}
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: conditional
conditions:
- entity: input_boolean.show_details_tempo_lt_daily
state_not: 'off'
card:
type: vertical-stack
cards:
- type: horizontal-stack
horizontal: true
cards:
- type: custom:mushroom-template-card
entity: sensor.cout_total_lt_daily_bleu_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_lt_usage_daily_bleu_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #5F87C7;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_lt_daily_bleu_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_lt_usage_daily_bleu_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #1057C8;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_lt_daily_blanc_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_lt_usage_daily_blanc_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #9F9F9F;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_lt_daily_blanc_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_lt_usage_daily_blanc_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #555555;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_lt_daily_rouge_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_lt_usage_daily_rouge_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #E89E8E;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_lt_daily_rouge_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_lt_usage_daily_rouge_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #E85130;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: horizontal-stack
horizontal: true
cards:
- type: custom:gap-card
height: 40px
- type: custom:mushroom-template-card
primary: Prises
secondary: ' {{ states(''sensor.energy_total_prises_daily'') }} kWh - {{ states(''sensor.cout_total_prises_daily'') }} €'
layout: horizontal
icon: mdi:lightning-bolt-circle
tap_action:
action: call-service
service: input_boolean.toggle
service_data:
entity_id: input_boolean.show_details_tempo_prises_daily
card_mod:
style:
.: |
ha-card {
height: 40px !important;
width: 400px;
}
ha-state-icon {
--icon-symbol-size: 30px;
}
mushroom-state-info$: |
.container {
flex-direction: row !important;
align-items: baseline;
gap: 175px;
}
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: conditional
conditions:
- entity: input_boolean.show_details_tempo_prises_daily
state_not: 'off'
card:
type: vertical-stack
cards:
- type: horizontal-stack
horizontal: true
cards:
- type: custom:mushroom-template-card
entity: sensor.cout_total_prises_daily_bleu_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_prises_usage_daily_bleu_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #5F87C7;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_prises_daily_bleu_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_prises_usage_daily_bleu_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #1057C8;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_prises_daily_blanc_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_prises_usage_daily_blanc_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #9F9F9F;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_prises_daily_blanc_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_prises_usage_daily_blanc_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #555555;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_prises_daily_rouge_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_prises_usage_daily_rouge_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #E89E8E;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_prises_daily_rouge_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_prises_usage_daily_rouge_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #E85130;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: horizontal-stack
horizontal: true
cards:
- type: custom:gap-card
height: 40px
- type: custom:mushroom-template-card
primary: Lumières
secondary: ' {{ states(''sensor.energy_total_lumieres_daily'') }} kWh - {{ states(''sensor.cout_total_lumieres_daily'') }} €'
layout: horizontal
icon: mdi:lightning-bolt-circle
tap_action:
action: call-service
service: input_boolean.toggle
service_data:
entity_id: input_boolean.show_details_tempo_lumieres_daily
card_mod:
style:
.: |
ha-card {
height: 40px !important;
width: 400px;
}
ha-state-icon {
--icon-symbol-size: 30px;
}
mushroom-state-info$: |
.container {
flex-direction: row !important;
align-items: baseline;
gap: 156px;
}
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: custom:gap-card
height: 40px
- type: conditional
conditions:
- entity: input_boolean.show_details_tempo_lumieres_daily
state_not: 'off'
card:
type: vertical-stack
cards:
- type: horizontal-stack
horizontal: true
cards:
- type: custom:mushroom-template-card
entity: sensor.cout_total_lumieres_daily_bleu_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_lumieres_usage_daily_bleu_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #5F87C7;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_lumieres_daily_bleu_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_lumieres_usage_daily_bleu_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #1057C8;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_lumieres_daily_blanc_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_lumieres_usage_daily_blanc_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #9F9F9F;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_lumieres_daily_blanc_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_lumieres_usage_daily_blanc_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #555555;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_lumieres_daily_rouge_hc
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_lumieres_usage_daily_rouge_hc_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #E89E8E;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
- type: custom:mushroom-template-card
entity: sensor.cout_total_lumieres_daily_rouge_hp
primary: '{{ states(entity) }} €'
layout: vertical
secondary: >-
{{
states('sensor.energy_total_lumieres_usage_daily_rouge_hp_kwh')
}} kWh
card_mod:
style:
.: |
ha-card {
background-color: #E85130;
height: 40px !important;
width: 72px;
}
mushroom-state-info$: |
.container {
--card-primary-color: white;
--card-secondary-color: white;
--card-secondary-font-size: 9px;
--card-primary-font-size: 14px;
}
Messages : 3,494
Sujets : 46
Inscription : Mar 2013
02/01/2025, 18:43:29
(Modification du message : 02/01/2025, 19:12:59 par Ives.)
En revanche, je comprends que ce n'est pas responsive web et j'ai toujours évité de type de carte car mon Dashboard s'affiche correctement aussi bien sur mon écran tactile de 23", la tablette ou les smartphones (max ou non)
Je viens de tester sur 3 colonnes pour la conso totale et l'affichage est correct sur le PC ainsi que sur mon iphone pro max.
![[Image: 8r31.jpg]](https://zupimages.net/up/25/01/8r31.jpg)
En revanche, sur 4 colonnes il y a du texte rogné
![[Image: 3hx2.jpg]](https://zupimages.net/up/25/01/3hx2.jpg)
Messages : 3,494
Sujets : 46
Inscription : Mar 2013
Bonjour,
Je viens de modifier la partie de mon Dashboard relative aux consommations en tarif TEMPO et j'en profite pour remercier XeNo pour le partage !
J'ai les consommations Jour, semaine, Mois et Année
Voici les pages pour la consommation du mois ; il faut cliquer sur la carte de l'appareil pour afficher le détail des consommations/coûts des 6 tarifs.
![[Image: wf00.jpg]](https://zupimages.net/up/25/02/wf00.jpg)
![[Image: 5516.jpg]](https://zupimages.net/up/25/02/5516.jpg)
J'ai utilisé un fond gris pour les éclairages d'une même pièce et il suffit de cliquer sur l'un deux pour découvrir le détail des consommations et des coûts de tous les éclairages de la pièce (6 tarifs).
J'ai un Dahboard unique pour afficher sur un écran tactile 23", écrans PC, tablette et les smartphones. Voici ce que ça donne sur le smartphone
![[Image: tyue.jpg]](https://zupimages.net/up/25/02/tyue.jpg)
Messages : 3,494
Sujets : 46
Inscription : Mar 2013
23/05/2025, 16:51:36
(Modification du message : 23/05/2025, 16:52:08 par Ives.)
Bonjour,
[modifications du 23-05-25]
Utilisation de fenêtres pop-up afin d'alléger la barre de navigation située au-dessus de l'écran ainsi que la page d'accueil
Remplacement de la quasi totalité des cartes mushroom par les cartes tuiles intégrées à HA.
Messages : 1,219
Sujets : 33
Inscription : May 2017
(10/11/2024, 11:46:10)XeNo a écrit : En m'étant trompé de référence lors de ma commande de filtres à eau, je me suis aperçu d'un manquement dans ma gestion.
J'ai donc optimisé un peu la chose pour pouvoir choisir le/les filtres à changer.
Les automations présentées précédemment sont toujours d'actualité (dynamisme, couleur, animation, etc.) mais cette fois ci, on scinde les filtres, et surtout on peu choisir ce qu'on veut changer (ou pas)
Voici donc ce que ça donne à présent :
Dashboard
En cliquant dessus pour changer le/les filtre(s) (on peut ajouter autant de niveau de filtration que voulu, il faudra juste refaire toutes les conditions de tuile -ce qui est assez long je vous l'avoue !) :
Les différents types de filtres (liste construite en fonction de ce qui est disponible sur le commerce ou dans les habitudes, on peut le changer facilement)
L'entrée agenda qui est générée (qui s'adapte si on change l'un des filtres ou les 2)
Il y a un bug d'affichage dans l'entrée d'agenda, elle ne prend pas le retour à la ligne, pourtant il y est bien :
Voici les éléments à créer dans les "entrées" de HA (ici pour 2 étages de filtration, à répéter au besoin donc)
Je suis en train de repenser la gestion de l'eau du forage et de l'eau de pluie dans la réserve.
Quelle type de compteur d'eau utilisez-vous pour mesurer les volumes??
Messages : 3,494
Sujets : 46
Inscription : Mar 2013
(29/06/2025, 10:51:52)richardpub a écrit : Je suis en train de repenser la gestion de l'eau du forage et de l'eau de pluie dans la réserve.
Quelle type de compteur d'eau utilisez-vous pour mesurer les volumes?? Bonjour,
J'ai des Hager TXE 771 et Zennio KCI 4S0
Messages : 1,219
Sujets : 33
Inscription : May 2017
Hier, 05:41:17
(Modification du message : Hier, 06:08:51 par richardpub.)
Merci Ives,
Avec ta réponse je découvre les signaux S0.
Mais je ne compte pas utiliser le compteur d’eau de la ville, mais un compteur sur le forage et celui ci est mécanique et inaccessible.
Je cherche donc un compteur à mettre directement dans le local où arrive l’eau du forage, et un dans la maison pour définir les changements de filtres et de lampe UV
Messages : 3,494
Sujets : 46
Inscription : Mar 2013
Hier, 08:23:43
(Modification du message : Hier, 08:25:20 par Ives.)
J'ai 3 sous-compteurs comme celui-ci (1 impulsion / 1 Litre) :
https://www.domadoo.fr/fr/suivi-energie/...litre.html
Messages : 1,219
Sujets : 33
Inscription : May 2017
Et tu as quelle interface KNX derrière ce compteur??
sinon j'ai trouvé celui-ci qui est en KNX direct.
Messages : 3,494
Sujets : 46
Inscription : Mar 2013
Déjà répondu : Hager TXE 771 et Zennio KCI 4S0 !
Avec le compteur Domadoo et celui-ci tu fais la même chose pour moitié prix (l'application arcus est a même).
![[Image: pi25.png]](https://zupimages.net/up/25/27/pi25.png)
Messages : 1,219
Sujets : 33
Inscription : May 2017
Merci du tuyau. Ca se précise pour moi.
Sinon quelle techno est utilisée pour les compteurs en S0??
Messages : 3,494
Sujets : 46
Inscription : Mar 2013
Un compteur d'eau comme de Gioanola délivre une impulsion par litre et il suffit de la renseigner dans les paramètres du KCI 4 S0 de cette façon :
![[Image: ujwk.png]](https://zupimages.net/up/25/27/ujwk.png)
|
Mon Dashboard Home assistant
![[Image: 8r31.jpg]](https://zupimages.net/viewer.php?id=25/01/8r31.jpg)
![[Image: 3hx2.jpg]](https://zupimages.net/viewer.php?id=25/01/3hx2.jpg)
![[Image: wf00.jpg]](https://zupimages.net/viewer.php?id=25/02/wf00.jpg)
![[Image: 5516.jpg]](https://zupimages.net/viewer.php?id=25/02/5516.jpg)
![[Image: tyue.jpg]](https://zupimages.net/viewer.php?id=25/02/tyue.jpg)
![[Image: pi25.png]](https://zupimages.net/viewer.php?id=25/27/pi25.png)
![[Image: ujwk.png]](https://zupimages.net/viewer.php?id=25/27/ujwk.png)