Make expired/expiring items clickable for edit/delete
- Tap on any expired or expiring item opens the detail modal - From the modal: edit quantity/location/expiry, delete, or use - Same behavior as regular inventory items - Added showAlertItemDetail() function (loads inventory then shows modal) - Visual feedback on tap (scale + highlight)
This commit is contained in:
@@ -256,6 +256,16 @@ body {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.alert-item-clickable {
|
||||
cursor: pointer;
|
||||
transition: background 0.15s, transform 0.1s;
|
||||
}
|
||||
|
||||
.alert-item-clickable:active {
|
||||
background: rgba(255,255,255,0.95);
|
||||
transform: scale(0.98);
|
||||
}
|
||||
|
||||
.alert-item-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
+10
-2
@@ -382,7 +382,7 @@ async function loadDashboard() {
|
||||
else if (days <= 30) { badgeText = `${days}g`; badgeClass = 'expiring-soon'; }
|
||||
else { const m = Math.round(days/30); badgeText = m <= 1 ? `${days}g` : `~${m} mesi`; badgeClass = 'expiring-later'; }
|
||||
return `
|
||||
<div class="alert-item">
|
||||
<div class="alert-item alert-item-clickable" onclick="showAlertItemDetail(${item.id}, ${item.product_id})">
|
||||
<div class="alert-item-info">
|
||||
<span class="alert-item-name">${escapeHtml(item.name)}</span>
|
||||
${item.brand ? `<span class="alert-item-brand">${escapeHtml(item.brand)}</span>` : ''}
|
||||
@@ -407,7 +407,7 @@ async function loadDashboard() {
|
||||
else daysText = `Da ${days}g`;
|
||||
const safety = getExpiredSafety(item, days);
|
||||
return `
|
||||
<div class="alert-item expired-item">
|
||||
<div class="alert-item expired-item alert-item-clickable" onclick="showAlertItemDetail(${item.id}, ${item.product_id})">
|
||||
<div class="alert-item-info">
|
||||
<span class="alert-item-name">${escapeHtml(item.name)}</span>
|
||||
${item.brand ? `<span class="alert-item-brand">${escapeHtml(item.brand)}</span>` : ''}
|
||||
@@ -513,6 +513,14 @@ function dashItemTap(inventoryId, productId) {
|
||||
});
|
||||
}
|
||||
|
||||
function showAlertItemDetail(inventoryId, productId) {
|
||||
// Load full inventory so modal works (same pattern as dashItemTap)
|
||||
api('inventory_list').then(data => {
|
||||
currentInventory = data.inventory || [];
|
||||
showItemDetail(inventoryId, productId);
|
||||
});
|
||||
}
|
||||
|
||||
function formatQuantity(qty, unit) {
|
||||
if (!qty && qty !== 0) return '';
|
||||
const n = parseFloat(qty);
|
||||
|
||||
Reference in New Issue
Block a user