feat(unified-mobile-desktop-ui): Complete US-511 - Detailed Invoices - Eliminare Buton Filtru Duplicat

Implemented by Ralph autonomous loop.
Iteration: 11

Co-Authored-By: Claude <noreply@anthropic.com>

scripts/ralph/prd.json

@@ -240,8 +240,8 @@
         "npm run build passes",
         "Verify in browser: un singur buton de filtre"
       ],
-      "passes": false,
+      "passes": true,
-      "notes": ""
+      "notes": "Completed in iteration 11"
     },
     {
       "id": "US-512",

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!

src/modules/reports/views/DetailedInvoicesView.vue

@@ -91,17 +91,17 @@
           </div>
         </div>
 
-        <!-- Mobile Filter Chips (compact summary) -->
+        <!-- US-511: Mobile Filter Chips - display-only (filter action is in MobileTopBar) -->
-        <!-- US-510: Removed type filter chip - type is determined by route -->
+        <div v-if="isMobile && hasActiveFilters" class="mobile-filter-summary">
-        <div v-if="isMobile" class="mobile-filter-summary">
+          <div v-if="searchTerm" class="filter-chip active">
-          <div v-if="searchTerm" class="filter-chip active" @click="openFilters">
             <i class="pi pi-search"></i>
             <span>{{ searchTerm }}</span>
-            <i class="pi pi-times" @click.stop="clearSearch"></i>
+            <i class="pi pi-times" @click="clearSearch"></i>
           </div>
-          <div class="filter-chip" @click="openFilters">
+          <div v-if="selectedPeriod !== 'all'" class="filter-chip active">
             <i class="pi pi-calendar"></i>
             <span>{{ getPeriodLabel(selectedPeriod) }}</span>
+            <i class="pi pi-times" @click="clearPeriod"></i>
           </div>
         </div>
 
@@ -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;
+  /* US-511: Removed cursor:pointer - chips are display-only, only close icon is clickable */
-  transition: background var(--transition-fast);
-}
-
-.filter-chip:active {
-  background: var(--surface-border);
 }
 
 .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 */