diff --git a/scripts/ralph/prd.json b/scripts/ralph/prd.json
index 7066a4c..ea84e94 100644
--- a/scripts/ralph/prd.json
+++ b/scripts/ralph/prd.json
@@ -240,8 +240,8 @@
"npm run build passes",
"Verify in browser: un singur buton de filtre"
],
- "passes": false,
- "notes": ""
+ "passes": true,
+ "notes": "Completed in iteration 11"
},
{
"id": "US-512",
diff --git a/scripts/ralph/progress.txt b/scripts/ralph/progress.txt
index a5b5bc1..84b9736 100644
--- a/scripts/ralph/progress.txt
+++ b/scripts/ralph/progress.txt
@@ -130,3 +130,9 @@ Design Reference: src/modules/reports/views/InvoicesView.vue
[2026-01-12 22:48:40] Working on story: US-510
[2026-01-12 22:48:40] Running Claude... (log: /workspace/roa2web/scripts/ralph/logs/iteration_10_US-510.log)
[2026-01-12 22:55:24] SUCCESS: Story US-510 passed!
+[2026-01-12 22:55:25] Changes committed
+[2026-01-12 22:55:25] Progress: 10/19 stories completed
+[2026-01-12 22:55:27] === Iteration 11/100 ===
+[2026-01-12 22:55:27] Working on story: US-511
+[2026-01-12 22:55:27] Running Claude... (log: /workspace/roa2web/scripts/ralph/logs/iteration_11_US-511.log)
+[2026-01-12 22:57:13] SUCCESS: Story US-511 passed!
diff --git a/src/modules/reports/views/DetailedInvoicesView.vue b/src/modules/reports/views/DetailedInvoicesView.vue
index d13f67e..83ac4d3 100644
--- a/src/modules/reports/views/DetailedInvoicesView.vue
+++ b/src/modules/reports/views/DetailedInvoicesView.vue
@@ -91,17 +91,17 @@
-
-
-
-
+
+
+
{{ searchTerm }}
-
+
-
+
{{ getPeriodLabel(selectedPeriod) }}
+
@@ -710,6 +710,12 @@ const clearSearch = () => {
handleSearch()
}
+// US-511: Clear period filter from chip
+const clearPeriod = () => {
+ selectedPeriod.value = 'all'
+ loadDetailedData()
+}
+
const handleSearch = () => {
firstRow.value = 0
expandedGroups.value.clear()
@@ -947,7 +953,7 @@ onUnmounted(() => {
border-top: 1px solid var(--surface-border);
}
-/* Mobile Filter Summary */
+/* Mobile Filter Summary - US-511: Display-only chips showing active filters */
.mobile-filter-summary {
display: flex;
gap: var(--space-sm);
@@ -964,12 +970,7 @@ onUnmounted(() => {
border-radius: var(--radius-full);
font-size: var(--text-sm);
color: var(--text-color);
- cursor: pointer;
- transition: background var(--transition-fast);
-}
-
-.filter-chip:active {
- background: var(--surface-border);
+ /* US-511: Removed cursor:pointer - chips are display-only, only close icon is clickable */
}
.filter-chip.active {
@@ -977,9 +978,28 @@ onUnmounted(() => {
color: var(--color-primary);
}
+/* US-511: Close icon on filter chips - clickable to remove that filter */
.filter-chip .pi-times {
font-size: 0.75rem;
- padding: 2px;
+ padding: var(--space-xs);
+ cursor: pointer;
+ border-radius: var(--radius-full);
+ transition: background var(--transition-fast);
+ /* Ensure touch target is adequate */
+ min-width: 24px;
+ min-height: 24px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin: calc(-1 * var(--space-xs)) calc(-1 * var(--space-xs)) calc(-1 * var(--space-xs)) 0;
+}
+
+.filter-chip .pi-times:hover {
+ background: var(--surface-hover);
+}
+
+.filter-chip .pi-times:active {
+ background: var(--surface-border);
}
/* Loading State */