Flex-table-card

Share your Projects! Dashboards & Frontend
227

Check if this can help you.

228

I am loving this Flex-Table-Card - what an unbelievably flexible card. Can I put values next to an icon in a column?

Here is the code I have written and I am good with what I have now, but I would like to see the standings movement (up or down places) next to the icon

Here is part of my template code:

 columns:
        - name: Current Rank
          data: '[[attribute]]'
          modify: x.current
        - name: Up-Down
          data: '[[attribute]]'
          modify: |-
            if (x.current == x.previous)
              '<ha-icon icon="mdi:minus" >'
            else if (x.current > x.previous)
              '<ha-icon icon="mdi:arrow-down" style="color:red;">' + " " + (x.current-x.previous)
            else if (x.current < x.previous)
              '<ha-icon icon="mdi:arrow-up" style="color:green;" >' + " " + (x.previous-x.current)

And this is what I am currently seeing but it is not adding the values to the right of the icon. Thanks.

standingsarrow
standingsarrow648×557 37 KB

Would like to have it look more like this

standingsarrow2
standingsarrow2789×675 52.5 KB

Update: Figured it out
Just simple formatting

columns:
        - name: Current Rank
          data: '[[attribute]]'
          modify: x.current
        - name: Up-Down
          data: '[[attribute]]'
          modify: |-
            if (x.current == x.previous)
              '<ha-icon icon="mdi:minus" >'
            else if (x.current =="0")
              '<ha-icon icon="mdi:bomb" >'
            else if (x.previous == "0")
              '<div><ha-icon icon="mdi:hand-clap" style="color:blue;"></ha-icon>&nbsp;' +  "New " + '</div>';
            else if (x.current > x.previous)
              '<div><ha-icon icon="mdi:arrow-down" style="color:red;"></ha-icon>&nbsp;' +  "Down "+ (x.current - x.previous) + '</div>';
            else if (x.current < x.previous)
              '<div><ha-icon icon="mdi:arrow-up" style="color:green;"></ha-icon>&nbsp;' + "Up "+ (x.previous - x.current) + '</div>';

moves
moves698×791 66.4 KB

229

Is there a way to hide a row based on one of the column values?

230

Try using auto-entities as an”input filter” and exclude an entity dependently on it’s attribute.

1 Like
231

Fab! That worked nicely. Thank-you

232

How can I arrange the images at the top from left to right?
Maybe a maximum of 4 and then continue at the bottom?

type: custom:flex-table-card
entities:
  include: sensor.keepaprice_drop_notifier
columns:
  - name: Artikel
    data: entries
    modify: >-
      '<a href=/my-home/paket ><img src="' + x.links[1].href +
      '"style="width: 10%"></a>'