fa/breadcrumb-the-shire
1
0
Fork 1
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix(helpdesk): consolidate card content into compact fact pills

Browse Source 
Remove duplicate metrics row and reason list. Replace with a single
row of compact pills: '5 open', '2 critical' (orange), '1 SLA' (orange),
'↑3' (orange) or '↓2'. No bullet points — pills as flex-wrap row.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Felix Schneider
2026-04-06 00:43:35 +02:00
parent caa1e430a3
commit d5d1e22e87
2 changed files with 32 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
modules/helpdesk/web/js/helpdesk-risk-radar.js
View File

@@ -83,58 +83,30 @@ if (container) {
header.appendChild(scoreBadge);
card.appendChild(header);
// Core metrics row
const metrics = h('div', 'helpdesk-risk-card-metrics');
// Key facts as compact pills
const kpis = customer.kpis || {};
const pills = h('ul', 'helpdesk-risk-card-reasons');
if (kpis.sla_overdue > 0) {
const m = h('span', 'helpdesk-risk-card-metric helpdesk-risk-card-metric-warn');
m.textContent = kpis.sla_overdue + ' ' + d('labelOverdue', 'overdue');
metrics.appendChild(m);
if (kpis.open > 0) {
const li = h('li', '', kpis.open + ' ' + d('labelOpen', 'open'));
pills.appendChild(li);
}
if (kpis.critical > 0) {
const m = h('span', 'helpdesk-risk-card-metric helpdesk-risk-card-metric-warn');
m.textContent = kpis.critical + ' ' + d('labelCritical', 'critical');
metrics.appendChild(m);
const li = h('li', 'helpdesk-risk-card-reason-warn', kpis.critical + ' ' + d('labelCritical', 'critical'));
pills.appendChild(li);
}
const openM = h('span', 'helpdesk-risk-card-metric');
openM.textContent = kpis.open + ' ' + d('labelOpen', 'open');
metrics.appendChild(openM);
if (kpis.net_flow !== 0) {
const flowM = h('span', 'helpdesk-risk-card-metric');
const arrow = kpis.net_flow > 0 ? '↑' : '↓';
flowM.textContent = arrow + Math.abs(kpis.net_flow);
if (kpis.net_flow > 0) flowM.classList.add('helpdesk-risk-card-metric-warn');
metrics.appendChild(flowM);
if (kpis.sla_overdue > 0) {
const li = h('li', 'helpdesk-risk-card-reason-warn', kpis.sla_overdue + ' ' + d('labelSlaBreaches', 'SLA'));
pills.appendChild(li);
}
if (kpis.net_flow > 0) {
const li = h('li', 'helpdesk-risk-card-reason-warn', '↑' + kpis.net_flow);
pills.appendChild(li);
} else if (kpis.net_flow < 0) {
pills.appendChild(h('li', '', '↓' + Math.abs(kpis.net_flow)));
}
card.appendChild(metrics);
// Why at risk — concrete facts
const kpiOpen = kpis.open || 0;
const kpiCritical = kpis.critical || 0;
const kpiSla = kpis.sla_overdue || 0;
const kpiNet = kpis.net_flow || 0;
const kpiOldest = kpis.oldest_open_hours || 0;
const reasons = [];
if (kpiOpen > 0) {
let text = kpiOpen + ' ' + d('labelOpen', 'open');
if (kpiCritical > 0) text += ', ' + kpiCritical + ' ' + d('labelCritical', 'critical');
reasons.push(text);
}
if (kpiNet > 0) reasons.push('↑' + kpiNet + ' ' + d('labelMoreThanResolved', 'more than resolved'));
if (kpiSla > 0) reasons.push(kpiSla + ' ' + d('labelSlaBreaches', 'SLA breaches'));
if (kpiOldest > 168) reasons.push(d('labelOldestTicket', 'Oldest ticket') + ' ' + formatAge(kpiOldest));
if (reasons.length > 0) {
const reasonList = h('ul', 'helpdesk-risk-card-reasons');
for (const r of reasons) {
reasonList.appendChild(h('li', '', r));
}
card.appendChild(reasonList);
}
card.appendChild(pills);
// Click/keyboard to open detail
card.tabIndex = 0;