[Mon Dashboard] @Guizmos

Et voici celle du serveur HAAS :

type: custom:vertical-stack-in-card
card_mod:
  style: |
    ha-card {
      margin-top: 0em;
        }         
mode: vertical
cards:
  - type: picture-entity
    entity: device_tracker.homeassistant_2
    image: /local/images/hass.png
    show_name: true
    show_state: false
    name: Serveur HASS
    state_image:
      Sécurisé: /local/images/hass.png
      'off': /local/images/hass.png
    tap_action:
      action: url
      confirmation:
        text: de vouloir accéder à Home Assistant
      url_path: >-
        http://x.x.x.x
    hold_action:
      action: none
  - type: entities
    entities:
      - entity: device_tracker.homeassistant_2
        icon: mdi:power
        name: Status Serveur
      - entity: sensor.last_boot
      - type: divider
        style:
          height: 1px
          width: 90%
          margin-left: auto
          margin-right: auto
          background: '#62717b'
  - type: entities
    card_mod:
      style:
        .: |
          #states {
            margin-top: -0.5em;
          }
          #states > div > button-card {
            margin: -0.5em 0 1.4em 1.05em;
          }
        '#states>div>hui-element>hui-markdown-card':
          $:
            ha-card>ha-markdown:
              $: |
                ha-markdown-element {
                  cursor: default;
                }
                ha-markdown-element>p>span {
                  font-family: Raleway;
                  font-size: 1.5em;
                  font-weight: 500;
                  vertical-align: 30%;
                }
                ha-markdown-element>p>span>ha-icon {
                  vertical-align: 10%;
                  opacity: 0.5;
                }
                ha-markdown-element>p>b {
                  font-family: Raleway;
                  font-size: 1.2em;
                  font-weight: 500;
                  line-height: 1.9em;
                  opacity: 0.5;
                }
                ha-markdown-element>ul {
                  font-family: SF Display;
                  font-size: 1.1em;
                  padding-left: 2.5em;
                }
                ha-markdown-element>ul>li {
                  margin-bottom: 0.4em;
                }
                ha-markdown-element>ul>li:last-child {
                  margin-bottom: 0px;
                }
    entities:
      - type: custom:hui-element
        card_type: markdown
        content: >
          {% if states('sensor.hass_version_installed') | regex_search('b') %}
          <span><ha-icon icon="mdi:home-assistant"></ha-icon> Home Assistant {{
          states('sensor.hass_version_installed') }}</span><br> {% if
          states('sensor.hass_version_installed') ==
          states('sensor.hass_version_latest_beta') %} <b>Aucune mise à jour</b>
          {% else %} <b>{{ states('sensor.hass_version_latest_beta') }}
          disponible</b> {{ '\U0001f389' }}

          {% if states('sensor.hass_version_latest_beta') ==
          states('sensor.hass_release_notes_rc') %} {{-
          state_attr('sensor.hass_release_notes_rc', 'body') }} {% endif %} {%
          endif %} {% else %} <span><ha-icon
          icon="mdi:home-assistant"></ha-icon> Home Assistant {{
          states('sensor.hass_version_installed') }}</span><br> {% if
          states('sensor.hass_version_installed') ==
          states('sensor.hass_version_latest') %} <b>Aucune mise à jour</b> {%
          else %} <b>{{ states('sensor.hass_version_latest') }} disponible</b>
          {{ '\U0001f389' }}

          {% if states('sensor.hass_version_latest') ==
          states('sensor.hass_release_notes') %} {{-
          state_attr('sensor.hass_release_notes', 'body') }} {% endif %} {%
          endif %} {% endif %}
      - type: custom:hui-element
        card_type: markdown
        content: >
          <span><ha-icon icon="hacs:hacs"></ha-icon> Community Store {{
          states('sensor.hacs_version') }}</span><br> {% if
          is_state('sensor.hacs', '0') or is_state('sensor.hacs', 'unknown') %}
          <b>Aucune mise à jour</b> {% else %} <b>{{ states('sensor.hacs') }} {{
          'mise à jour disponible' if is_state('sensor.hacs', '1') else 'mises à
          jour disponibles' }}</b> {{ '\U0001f389' }}

          {% for repo in state_attr('sensor.hacs', 'repositories') %} * {{
          repo.display_name }} - Version {{ repo.available_version }} ([{{
          repo.installed_version }}](https://github.com/{{ repo.name
          }}/releases))

          {% endfor %} {% endif %}
      - type: divider
        style:
          height: 1px
          width: 90%
          margin-left: auto
          margin-right: auto
          background: '#62717b'
      - entity: sensor.disk_use_percent_config
      - entity: sensor.memory_free
      - type: divider
        style:
          height: 1px
          width: 90%
          margin-left: auto
          margin-right: auto
          background: '#62717b'
      - entity: sensor.cert_expiry_timestamp
        name: Certificat
        card_mod:
          style:
            hui-generic-entity-row:
              $: |
                /* Couleur de l'icône */ state-badge{
                  color: green;
                }
                /* Couleur de l'état */ .info {
                  color: green;
                  text-transform: uppercase;
                }
            .: |
              /* Couleur de l'état */ .text-content {
                color: green;
              }
  - type: divider
    style:
      height: 1px
      width: 90%
      margin-left: auto
      margin-right: auto
      background: '#62717b'
  - type: horizontal-stack
    cards:
      - type: horizontal-stack
        cards:
          - type: custom:mini-graph-card
            card_mod:
              style: |
                ha-card {
                  font-family: var(--primary-font-family);
                }
                .graph {
                  padding-top: 0px;
                  padding-bottom: 0px;
                }
                .info {
                  padding-bottom: 0px;
                }
                .flex {
                  padding-bottom: 10px;
                }
            entities:
              - sensor.processor_use_percent
            name: CPU
            align_state: center
            align_icon: right
            font_size: 100
            font_size_header: 11
            hours_to_show: 24
            color_thresholds:
              - color: '#ef1d0f'
                value: 100
              - color: '#ef5a0f'
                value: 75
              - color: '#f0da11'
                value: 50
              - color: '#11f13a'
                value: 20
              - color: '#1da4f2'
                value: 0
            line_color: var(--accent-color)
            line_width: 4
            animate: true
            points_per_hour: 2
            show:
              fill: false
              graph: line
              extrema: true
              icon: true
              name: true
      - type: custom:mini-graph-card
        card_mod:
          style: |
            ha-card {
              font-family: var(--primary-font-family);
            }
            .graph {
              padding-top: 0px;
              padding-bottom: 0px;
            }
            .info {
              padding-bottom: 0px;
            }
            .flex {
              padding-bottom: 10px;
            }
        entities:
          - sensor.db_size
        name: Database
        align_state: center
        align_icon: right
        font_size: 100
        font_size_header: 11
        hours_to_show: 24
        line_color: var(--accent-color)
        line_width: 4
        animate: true
        points_per_hour: 2
        show:
          fill: false
          graph: bar
          extrema: true
          icon: true
          name: true

Ajouter les sensors suivants :

########## SQL SIZE ##########
##############################

  - platform: sql
    queries:
      - name: DB Size
        query: 'SELECT ROUND(page_count * page_size / 1024 / 1024, 1) as size FROM pragma_page_count(), pragma_page_size();'
        column: "size"
        unit_of_measurement: "Mo"

########## HASS    ##########
##############################

  - platform: version
    name: hass_version_installed

  - platform: version
    name: hass_version_latest
    source: docker

  - platform: version
    name: hass_version_latest_beta
    beta: true
    source: docker

  - platform: filesize
    file_paths:
      - /config/home-assistant.log

  - platform: command_line
    name: hacs_version
    scan_interval: 86400
    command: >
      grep -oP 'INTEGRATION_VERSION = "\K[^"]+' custom_components/hacs/const.py

*Penser à copier l’image que tu veux dans le dossier : /config/www/images/xxx

3 « J'aime »

Merci Guizmos, j’ai ajouter ça a mon ha ça rend nickel, plus qua l’adapter pour d’autre « Object »

1 « J'aime »

@Guizmos

sauf erreur de ma part je voie pas le code pour la card synology ?

tu pourrais la rajouter stp ?

1 « J'aime »

Salut, je n’ai pas vu le début d’article par manque de temps mais tes deux dernières cartes sont tout simplement magnifiques, j’adore et ça donne vraiment des idées pour les novices (j’en fait parti ^^).
Merci merci

Salut
Je mettrais les codes demain avec plaisr car là je n’ai pas le temps :grin:

Merci pour le message, ça fait plaisir. Je suis débutant aussi, je commence à peine à maîtriser la bête :sweat_smile:.
J’aime bien regarder les autres thèmes, et je pique les idées que j’aime bien en les adaptant a ma sauce. Ça me permet d’avoir les bases des codes.

Voici la card Synology :

type: custom:vertical-stack-in-card
card_mod:
  style: |
    ha-card {
      margin-top: 0em;
        }         
mode: vertical
cards:
  - type: picture-entity
    entity: binary_sensor.dalg_nas_security_status
    image: /local/images/synology.png
    show_name: true
    show_state: false
    name: Synology DS918+
    state_image:
      Sécurisé: /local/images/synology.png
      'off': /local/images/synology.png
    tap_action:
      action: url
      confirmation:
        text: de vouloir accéder au NAS
      url_path: http://xxx
    hold_action:
      action: none
  - type: custom:mini-graph-card
    card_mod:
      style: |
        ha-card {
          font-family: var(--primary-font-family);
          margin-bottom: -10px;
        }
        .graph {
          padding-top: 0px;
          padding-bottom: 0px;
        }
        .info {
          padding-bottom: 0px;
        }
        .flex {
          padding-bottom: 6px;
        }
    entities:
      - sensor.dalg_nas_network_down
      - sensor.dalg_nas_network_up
    name: CPU Température
    align_state: center
    align_icon: right
    color_thresholds:
      - color: '#ef1d0f'
        value: 800
      - color: '#ef5a0f'
        value: 600
      - color: '#f0da11'
        value: 400
      - color: '#11f13a'
        value: 200
      - color: '#1da4f2'
        value: 0
    font_size: 100
    font_size_header: 11
    hours_to_show: 24
    line_color: var(--accent-color)
    line_width: 2
    animate: true
    points_per_hour: 2
    show:
      fill: false
      graph: line
      extrema: true
      icon: true
      name: true
  - type: divider
    style:
      height: 1px
      width: 90%
      margin-left: auto
      margin-right: auto
      background: '#62717b'
  - type: entities
    card_mod:
      style: |
        ha-card {
          font-family: var(--primary-font-family);
          --my-font01-color: {% if states('sensor.dalg_nas_volume_1_volume_used')|int < 70 %} green {% else %} orangered {% endif %};
          --my-font02-color: {% if states('sensor.dalg_nas_volume_1_average_disk_temp')|int < 50 %} green {% else %} orangered {% endif %};
          --my-font03-color: {% if states('sensor.dlg_nas_volume_1_status')== 'normal' %} green {% else %} red {% endif %}
        } 
        .card-content {
          padding-top: 0px;
          padding-bottom: 0px;
        }              
    entities:
      - type: custom:fold-entity-row
        head:
          entity: sensor.dalg_nas_volume_1_status
          name: Volume
          type: custom:multiple-entity-row
          show_state: false
          entities:
            - entity: sensor.dalg_nas_volume_1_volume_used
              name: Utilisé
              format: precision2
              styles:
                color: var(--my-font01-color)
            - entity: sensor.dalg_nas_volume_1_average_disk_temp
              name: Température
              format: precision2
              styles:
                color: var(--my-font02-color)
            - entity: sensor.dalg_nas_volume_1_status
              name: Etat
              format: precision2
              styles:
                color: var(--my-font03-color)
        group_config: null
        secondary_info: last-changed
        padding: 5
        entities:
          - entity: sensor.dalg_nas_drive_1_status
            type: custom:multiple-entity-row
            entities:
              - entity: sensor.dalg_nas_drive_1_temperature
                name: false
          - entity: sensor.dalg_nas_drive_2_status
            type: custom:multiple-entity-row
            entities:
              - entity: sensor.dalg_nas_drive_2_temperature
                name: false
          - entity: sensor.dalg_nas_drive_3_status
            type: custom:multiple-entity-row
            entities:
              - entity: sensor.nas_drive_3_temperature
                name: false
          - entity: sensor.nas_drive_4_status
            type: custom:multiple-entity-row
            entities:
              - entity: sensor.nas_drive_4_temperature
                name: false
      - binary_sensor.nas_update_available
  - type: divider
    style:
      height: 1px
      width: 90%
      margin-left: auto
      margin-right: auto
      background: '#62717b'
  - type: horizontal-stack
    cards:
      - type: horizontal-stack
        cards:
          - type: custom:mini-graph-card
            card_mod:
              style: |
                ha-card {
                  font-family: var(--primary-font-family);
                }
                .graph {
                  padding-top: 0px;
                  padding-bottom: 0px;
                }
                .info {
                  padding-bottom: 0px;
                }
                .flex {
                  padding-bottom: 10px;
                }
            entities:
              - sensor.nas_cpu_utilization_total
            name: CPU
            align_state: center
            align_icon: right
            font_size: 100
            font_size_header: 11
            hours_to_show: 24
            line_color: var(--accent-color)
            line_width: 4
            animate: true
            points_per_hour: 2
            show:
              fill: false
              graph: line
              extrema: true
              icon: true
              name: true
      - type: custom:mini-graph-card
        card_mod:
          style: |
            ha-card {
              font-family: var(--primary-font-family);
            }
            .graph {
              padding-top: 0px;
              padding-bottom: 0px;
            }
            .info {
              padding-bottom: 0px;
            }
            .flex {
              padding-bottom: 10px;
            }
        entities:
          - sensor.dalg_nas_memory_usage_real
        name: RAM
        align_state: center
        align_icon: right
        font_size: 100
        font_size_header: 11
        hours_to_show: 24
        line_color: var(--accent-color)
        line_width: 4
        animate: true
        points_per_hour: 2
        show:
          fill: false
          graph: line
          extrema: true
          icon: true
          name: true

2 « J'aime »

Pour information, j’utilise le thème « Noctis » pour HA

Merci pour le partage

parcontre en dessous de l’image tu indique CPU température mais rien ne s’affiche… ou alors tu tes tromper dan le code quelque part non ?

Effectivement c’est une coquille. A la base c’était affiché un graph pour la température :slight_smile:

C’est juste le nom à changer (ligne 45 de la card)

bonjour ,
merci pour le partage du code de ton dashboard. J’ai voulu tester ton code pour savoir s’il y a des maj disponible pour HA et hacs. J’ai bien ajouter les sensors , mais au reboot j’ai c’est erreur.

Logger: homeassistant.components.command_line
Source: components/command_line/__init__.py:41
Integration: command_line (documentation, issues)
First occurred: 12:10:03 (1 occurrences)
Last logged: 12:10:03

Command failed: grep -oP 'INTEGRATION_VERSION = "\K[^"]+' custom_components/hacs/const.py

d’ou est le soucis?

ca viens de ce sensor:

  - platform: command_line
    name: hacs_version
    scan_interval: 86400
    command: >
      grep -oP 'INTEGRATION_VERSION = "\K[^"]+' custom_components/hacs/const.py

Effectivement, le code hacs_version est déprécié.
Tu peux retirer le sensor et le code de la card.

- type: custom:hui-element
        card_type: markdown
        content: >
          <span><ha-icon icon="hacs:hacs"></ha-icon> Community Store </span><br>
          {% if is_state('sensor.hacs', '0') or is_state('sensor.hacs',
          'unknown') %} <b>Aucune mise à jour</b> {% else %} <b>{{
          states('sensor.hacs') }} {{ 'mise à jour disponible' if
          is_state('sensor.hacs', '1') else 'mises à jour disponibles' }}</b> {{
          '\U0001f389' }}

          {% for repo in state_attr('sensor.hacs', 'repositories') %} * {{
          repo.display_name }} - Version {{ repo.available_version }} ([{{
          repo.installed_version }}](https://github.com/{{ repo.name
          }}/releases))

          {% endfor %} {% endif %}
1 « J'aime »

OK, dommage c’était sympa.

C’est juste le numéro de version de hacs qui ne fonctionne pas. Si tu as des mises à jour dans hacs, elles s’afficheront :+1:

Exemple:

J’ai enlever ta carte + le sensor et j’ai se message:

Logger: homeassistant.components.filesize.sensor
Source: components/filesize/sensor.py:34
Integration: filesize (documentation, issues)
First occurred: 16:04:21 (1 occurrences)
Last logged: 16:04:21

Filepath /config/home-assistant.log is not valid or allowed

pourtant home-assistant.log existe bien dans /config/

Edit:
c’est j’ai trouvé pour mon erreur.

Salut, en installant ta carte j’ai eu le même soucis avec hacs alors je suis aller voir dans le fichier const.py et j’ai modifié ainsi

command: >
      grep -oP 'INTEGRATION_VERSION = "\K[^"]+' custom_components/hacs/const.py

Par

command: >
      grep -oP 'VERSION_STORAGE = "\K[^"]+' custom_components/hacs/const.py

J’ai bien la version :slightly_smiling_face: la 6 jcrois, j’ai fait ça tard hier et je rentre à peine du boulot là.

PS: p’tite question, qu’apporte de plus ta nouvelle commande?

Bien tenté, mais je sais pas trop à quoi correspond cette donnée…
La version de hacs que j’ai c’est la 1.19.3
Malheureusement il n’y a aucune référence a ça dans le fichier const.py.

J’ai cherché rapidement dans les autres fichiers .py mais pas trouvé non plus…

Si quelqu’un a une idée ou une solution je suis preneur aussi :sweat_smile:

PS: le nouveau code est identique à l’ancien mais j’ai supprimé le bout de code qui affichait le numéro de version de hacs

1 « J'aime »

Dans manifest.json il y a:

    ],
    "version": "1.19.3"
}

Es ce que c’est exploitable?

hacs

type: markdown
content: >-
  <span><ha-icon icon="hacs:hacs"></ha-icon> Hacs Community Store
  {{states('sensor.hacs_version') }}  </span><br> {% if is_state('sensor.hacs',
  '0') or is_state('sensor.hacs','unknown') %} <b>Aucune mise à jour</b> {% else
  %} <b>{{states('sensor.hacs') }} {{ 'mise à jour disponible' if
  is_state('sensor.hacs', '1') else 'mises à jour disponibles' }}</b>
  {{'\U0001f389' }}

  {% for repo in state_attr('sensor.hacs', 'repositories') %} -
  {{repo.display_name }} - New: {{ repo.available_version }} / Current:
  {{repo.installed_version }}  https://github.com/{{ repo.name}}/releases 
  {% endfor %} {% endif %}

Ajouter dans configuration.yaml

  - platform: command_line
    name: hacs_version
    scan_interval: 86400
    command: >
      grep -oP '"version": "\K[^"]+' custom_components/hacs/manifest.json
2 « J'aime »

Merci pour ton partage et ta solution WarC0zes
J’étais en train de regarder dans cette direction :slight_smile: Tu m’as devancé