denysdovhan / vacuum-card

Vacuum cleaner card for Home Assistant Lovelace UI
https://denysdovhan.com/smart-home
MIT License
864 stars 525 forks source link

support state value templates #743

Open thatkookooguy opened 2 months ago

thatkookooguy commented 2 months ago

Is your feature request related to a problem? Please describe. In the new roborock home assistant integration, you have a separate sensor.roborock_s8_pro_ultra_status to report a more specific status (like cleaning the mop or charging). I want to merge the normal status with this one, or show it somewhere in the card Describe the solution you'd like an option to set a different entity for the status report, or just use a template

Describe alternatives you've considered adding it under the normal state with card mod this is what I currently do to show both (but it doesn't work on the dashboard view. only the preview):

type: custom:vacuum-card
entity: vacuum.roborock_s8_pro_ultra
card_mod:
  style: |
    .metadata .status {
      flex-wrap: wrap;
    }

    .metadata .status:after {
      content: '{{ states('sensor.roborock_s8_pro_ultra_status') | replace('_', ' ') }}';
      display: block;
      text-transform: capitalize;
      color: var(--vc-secondary-text-color);
      width: 100%;
      opacity: 0.6;
    }

    .metadata .status .status-text {
      margin-left: 28px;
    }
stats:
  default:
    - entity_id: sensor.roborock_s8_pro_ultra_filter_time_left
      unit: hours
      subtitle: Filter
      value_template: '{{ (value | float(0) / 3600) | round(1) }}'
    - unit: hours
      entity_id: sensor.roborock_s8_pro_ultra_side_brush_time_left
      subtitle: Side brush
      value_template: '{{ (value | float(0) / 3600) | round(1) }}'
    - entity_id: sensor.roborock_s8_pro_ultra_main_brush_time_left
      value_template: '{{ (value | float(0) / 3600) | round(1) }}'
      unit: hours
      subtitle: Main brush
    - entity_id: sensor.roborock_s8_pro_ultra_sensor_time_left
      value_template: '{{ (value | float(0) / 3600) | round(1) }}'
      unit: hours
      subtitle: Sensors
  cleaning:
    - entity_id: sensor.roborock_s8_pro_ultra_cleaning_time
      value_template: '{{ (value | float(0) / 3600) | round(1) }}'
      unit: minutes
      subtitle: Cleaning time
    - entity_id: sensor.roborock_s8_pro_ultra_main_brush_time_left
      value_template: '{{ (value | float(0) / 3600) | round(1) }}'
      subtitle: Main brush
      unit: hours
shortcuts:
  - name: Clean living room
    service: script.clean_living_room
    icon: mdi:sofa
  - name: Clean bedroom
    service: script.clean_bedroom
    icon: mdi:bed-empty
  - name: Clean kitchen
    service: script.clean_kitchen
    icon: mdi:silverware-fork-knife

image

thatkookooguy commented 2 months ago

this worked to make the addition to the card persistent:

type: custom:mod-card
card:
  type: custom:vacuum-card
  entity: vacuum.roborock_s8_pro_ultra
  show_name: true
  show_status: true
  show_toolbar: true
  compact_view: false
  stats:
    default:
      - entity_id: sensor.roborock_s8_pro_ultra_filter_time_left
        unit: hours
        subtitle: Filter
        value_template: '{{ (value | float(0) / 3600) | round(1) }}'
      - unit: hours
        entity_id: sensor.roborock_s8_pro_ultra_side_brush_time_left
        subtitle: Side brush
        value_template: '{{ (value | float(0) / 3600) | round(1) }}'
      - entity_id: sensor.roborock_s8_pro_ultra_main_brush_time_left
        value_template: '{{ (value | float(0) / 3600) | round(1) }}'
        unit: hours
        subtitle: Main brush
      - entity_id: sensor.roborock_s8_pro_ultra_sensor_time_left
        value_template: '{{ (value | float(0) / 3600) | round(1) }}'
        unit: hours
        subtitle: Sensors
    cleaning:
      - entity_id: sensor.roborock_s8_pro_ultra_cleaning_time
        value_template: '{{ (value | float(0) / 3600) | round(1) }}'
        unit: minutes
        subtitle: Cleaning time
      - entity_id: sensor.roborock_s8_pro_ultra_main_brush_time_left
        value_template: '{{ (value | float(0) / 3600) | round(1) }}'
        subtitle: Main brush
        unit: hours
  shortcuts:
    - name: Clean living room
      service: script.clean_living_room
      icon: mdi:sofa
    - name: Clean bedroom
      service: script.clean_bedroom
      icon: mdi:bed-empty
    - name: Clean kitchen
      service: script.clean_kitchen
      icon: mdi:silverware-fork-knife
card_mod:
  style:
    vacuum-card $: |
      .metadata .status {
        flex-wrap: wrap;
      }

      .metadata .status::after {
        content: '{{ states('sensor.roborock_s8_pro_ultra_status') | replace('_', ' ') }}';
        display: block;
        text-transform: capitalize;
        color: var(--vc-secondary-text-color);
        width: 100%;
        opacity: 0.6;
      }

      .metadata .status .status-text {
        margin-left: 28px;
      }

        .metadata .status .status-text {
          margin-left: 28px;
        }

It's the same code just inside a custom:mod-card and using $ to penetrate the shadow dom isolation

github-actions[bot] commented 5 days ago

There hasn't been any activity on this issue recently. This issue has now been marked as stale and will be closed if no further activity occurs. Please, update to the latest version and check if that solves the issue. Thank you for your contributions!