claus/N22
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix ugens madplan: standalone button-card i stedet for entities-nested

Browse Source 
- button-card som entity-row i entities-kort understøtter ikke custom_fields korrekt
- Bruger nu standalone custom:button-card direkte under cards
- Forenklet JS: var i stedet for const/let, \x27 i stedet for escaped quotes
- Undgår em-dash og andre special chars
This commit is contained in:
Claus Dethlefsen
2026-04-19 13:41:27 +02:00
parent 27228815ba
commit acb2540890
1 changed files with 64 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dashboards/views/04c_madplan.yaml
+64 -67
View File
@@ -65,71 +65,68 @@ cards:
service: script.mad_announcement
# 📅 Ugens madplan
- type: entities
title: Ugens madplan
show_header_toggle: false
entities:
- type: custom:button-card
entity: sensor.mealie_madplan_ugen
show_icon: false
show_name: false
show_state: false
styles:
card:
- padding: 0
- background: none
- box-shadow: none
custom_fields:
week: |
[[[
if (!entity || !entity.attributes || !entity.attributes.items)
return 'Ingen madplan data';
const items = entity.attributes.items;
const dayNames = ['Søndag','Mandag','Tirsdag','Onsdag','Torsdag','Fredag','Lørdag'];
const today = new Date().toISOString().slice(0,10);
const meals = {};
items.forEach(function(item) {
if (item.recipe && item.recipe.name) {
meals[item.date] = { name: item.recipe.name, slug: item.recipe.slug || '' };
}
});
const now = new Date();
const dayOfWeek = now.getDay();
const monday = new Date(now);
monday.setDate(now.getDate() - (dayOfWeek === 0 ? 6 : dayOfWeek - 1));
let html = '<div style="width:100%">';
for (let i = 0; i < 7; i++) {
const d = new Date(monday);
d.setDate(monday.getDate() + i);
const dateStr = d.toISOString().slice(0,10);
const dayName = dayNames[d.getDay()];
const meal = meals[dateStr];
const isToday = dateStr === today;
const bg = isToday ? 'var(--primary-color)' : 'transparent';
const textColor = isToday ? 'white' : 'var(--primary-text-color)';
const dayColor = isToday ? 'rgba(255,255,255,0.7)' : 'var(--secondary-text-color)';
const weight = isToday ? 'bold' : 'normal';
const radius = isToday ? '8px' : '0';
const border = isToday ? 'none' : '1px solid var(--divider-color)';
const mealName = meal ? meal.name : '—';
const slug = meal ? meal.slug : '';
const link = slug ? 'http://anneclaus.dk:9925/g/home/r/' + slug : '';
const cursor = slug ? 'pointer' : 'default';
const clickAttr = slug ? ' onclick="window.open(\'' + link + '\',\'_blank\')"' : '';
html += '<div style="display:flex;align-items:center;padding:10px 12px;'
+ 'background:' + bg + ';border-radius:' + radius + ';'
+ 'border-bottom:' + border + ';cursor:' + cursor + '"'
+ clickAttr + '>'
+ '<div style="width:70px;font-size:12px;color:' + dayColor
+ ';text-transform:uppercase;font-weight:600">' + dayName + '</div>'
+ '<div style="flex:1;font-size:15px;color:' + textColor
+ ';font-weight:' + weight + '">' + mealName + '</div>'
+ '</div>';
}
html += '</div>';
return html;
]]]
extra_styles: |
#week {
width: 100%;
- type: custom:button-card
entity: sensor.mealie_madplan_ugen
name: Ugens madplan
show_icon: false
show_name: true
show_state: false
styles:
card:
- padding: 0
- border-radius: 12px
name:
- font-size: 16px
- font-weight: bold
- padding: 12px 12px 4px 12px
- justify-self: start
custom_fields:
week: |
[[[
if (!entity || !entity.attributes || !entity.attributes.items)
return '<div>Ingen madplan data</div>';
var items = entity.attributes.items;
var dayNames = ['Søndag','Mandag','Tirsdag','Onsdag','Torsdag','Fredag','Lørdag'];
var today = new Date().toISOString().slice(0,10);
var meals = {};
for (var j = 0; j < items.length; j++) {
var it = items[j];
if (it.recipe && it.recipe.name) {
meals[it.date] = { name: it.recipe.name, slug: it.recipe.slug || '' };
}
}
var now = new Date();
var dow = now.getDay();
var monday = new Date(now);
monday.setDate(now.getDate() - (dow === 0 ? 6 : dow - 1));
var html = '<div style="width:100%">';
for (var i = 0; i < 7; i++) {
var d = new Date(monday);
d.setDate(monday.getDate() + i);
var dateStr = d.toISOString().slice(0,10);
var dayName = dayNames[d.getDay()];
var meal = meals[dateStr];
var isToday = dateStr === today;
var bg = isToday ? 'var(--primary-color)' : 'transparent';
var tc = isToday ? 'white' : 'var(--primary-text-color)';
var dc = isToday ? 'rgba(255,255,255,0.7)' : 'var(--secondary-text-color)';
var fw = isToday ? 'bold' : 'normal';
var br = isToday ? '8px' : '0';
var bb = isToday ? 'none' : '1px solid var(--divider-color)';
var mn = meal ? meal.name : '-';
var sl = meal ? meal.slug : '';
var lnk = sl ? 'http://anneclaus.dk:9925/g/home/r/' + sl : '';
var cur = sl ? 'pointer' : 'default';
var oc = sl ? ' onclick="window.open(\x27' + lnk + '\x27,\x27_blank\x27)"' : '';
html += '<div style="display:flex;align-items:center;padding:10px 12px;background:' + bg + ';border-radius:' + br + ';border-bottom:' + bb + ';cursor:' + cur + '"' + oc + '>';
html += '<div style="width:70px;font-size:12px;color:' + dc + ';text-transform:uppercase;font-weight:600">' + dayName + '</div>';
html += '<div style="flex:1;font-size:15px;color:' + tc + ';font-weight:' + fw + '">' + mn + '</div>';
html += '</div>';
}
html += '</div>';
return html;
]]]
extra_styles: |
#week {
width: 100%;
}