feat(ui-fixes-phase6): Complete US-703 - Navigare Hamburger pe Paginile Analize

Implemented by Ralph autonomous loop.
Iteration: 3

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

scripts/ralph/prd.json

@@ -190,8 +190,8 @@
         "Pattern identic cu InvoicesView.vue (liniile 4-11, 33-42)",
         "npm run build passes"
       ],
-      "passes": false,
+      "passes": true,
-      "notes": "REVERT NECESAR: S-a schimbat greșit de la show-menu la show-back. Revino la pattern InvoicesView."
+      "notes": "Completed in iteration 3"
     },
     {
       "id": "US-704",

scripts/ralph/progress.txt

@@ -387,3 +387,9 @@ PRD: tasks/prd-mobile-ui-fixes-phase5.md
 [2026-01-13 22:29:59] Working on story: US-702
 [2026-01-13 22:29:59] Running Claude... (log: /workspace/roa2web/scripts/ralph/logs/iteration_2_US-702.log)
 [2026-01-13 22:31:33] SUCCESS: Story US-702 passed!
+[2026-01-13 22:31:33] Changes committed
+[2026-01-13 22:31:33] Progress: 12/15 stories completed
+[2026-01-13 22:31:35] === Iteration 3/15 ===
+[2026-01-13 22:31:35] Working on story: US-703
+[2026-01-13 22:31:35] Running Claude... (log: /workspace/roa2web/scripts/ralph/logs/iteration_3_US-703.log)
+[2026-01-13 22:34:32] SUCCESS: Story US-703 passed!

src/modules/reports/views/DetailedInvoicesView.vue

@@ -1,15 +1,25 @@
 <template>
-  <!-- US-501: Mobile Top Bar -->
+  <!-- US-703: Mobile Top Bar with Hamburger Menu (not back button) -->
-  <!-- US-603: Title is now "Facturi Detaliate" with tabs below -->
   <MobileTopBar
     v-if="isMobile"
     title="Facturi Detaliate"
-    :show-back="true"
+    :show-menu="true"
     :actions="topBarActions"
-    @back-click="goBack"
+    @menu-click="showDrawer = true"
     @action-click="handleTopBarAction"
   />
 
+  <!-- US-703: Mobile Drawer Menu (replaces navigation via back button) -->
+  <MobileDrawerMenu
+    v-model="showDrawer"
+    :user="authStore.user"
+    :companies-store="companyStore"
+    :period-store="periodStore"
+    @logout="handleLogout"
+    @company-changed="handleCompanyChanged"
+    @period-changed="handlePeriodChanged"
+  />
+
   <!-- US-603: Mobile Tabs for Clienți/Furnizori -->
   <div v-if="isMobile" class="mobile-tabs-container">
     <div class="mobile-tabs">
@@ -498,11 +508,12 @@ import Paginator from 'primevue/paginator'
 import { useToast } from 'primevue/usetoast'
 import MobileTopBar from '@shared/components/mobile/MobileTopBar.vue'
 import MobileBottomNav from '@shared/components/mobile/MobileBottomNav.vue'
+import MobileDrawerMenu from '@shared/components/mobile/MobileDrawerMenu.vue'
 import BottomSheet from '@shared/components/mobile/BottomSheet.vue'
 import Menu from 'primevue/menu'
 import SplitButton from 'primevue/splitbutton'
 import { useDashboardStore } from '@reports/stores/dashboard'
-import { useCompanyStore, useAccountingPeriodStore } from '@reports/stores/sharedStores'
+import { useCompanyStore, useAccountingPeriodStore, useAuthStore } from '@reports/stores/sharedStores'
 import * as XLSX from 'xlsx'
 import jsPDF from 'jspdf'
 import 'jspdf-autotable'
@@ -513,6 +524,10 @@ const toast = useToast()
 const dashboardStore = useDashboardStore()
 const companyStore = useCompanyStore()
 const periodStore = useAccountingPeriodStore()
+const authStore = useAuthStore()
+
+// US-703: Drawer state for hamburger menu
+const showDrawer = ref(false)
 
 // US-603: Tab state - initialized from route meta or query param
 const activeTab = ref(route.query.tab === 'suppliers' ? 'suppliers' : (route.meta.invoiceType || 'clients'))
@@ -741,6 +756,23 @@ const goBack = () => {
   router.push('/reports/dashboard')
 }
 
+// US-703: Handlers for MobileDrawerMenu
+const handleLogout = async () => {
+  await authStore.logout()
+  router.push('/login')
+}
+
+const handleCompanyChanged = (company) => {
+  // Company store watcher handles the refresh
+  if (company) {
+    loadDetailedData()
+  }
+}
+
+const handlePeriodChanged = () => {
+  // Period store watcher handles the refresh
+}
+
 // US-501: Top bar action handler
 const handleTopBarAction = (action, event) => {
   if (action.icon === 'pi pi-filter') {

src/modules/reports/views/MaturityAnalysisView.vue

@@ -1,10 +1,21 @@
 <template>
-  <!-- US-608: Mobile Top Bar with Back Button -->
+  <!-- US-703: Mobile Top Bar with Hamburger Menu (not back button) -->
   <MobileTopBar
     v-if="isMobile"
     title="Scadențe"
-    :show-back="true"
+    :show-menu="true"
-    @back-click="goBack"
+    @menu-click="showDrawer = true"
+  />
+
+  <!-- US-703: Mobile Drawer Menu (replaces navigation via back button) -->
+  <MobileDrawerMenu
+    v-model="showDrawer"
+    :user="authStore.user"
+    :companies-store="companyStore"
+    :period-store="periodStore"
+    @logout="handleLogout"
+    @company-changed="handleCompanyChanged"
+    @period-changed="handlePeriodChanged"
   />
 
   <!-- US-608: Mobile Tabs (sticky below MobileTopBar) - like DetailedInvoicesView -->
@@ -95,12 +106,18 @@ import { useRouter, useRoute } from 'vue-router'
 import Button from 'primevue/button'
 import MobileTopBar from '@shared/components/mobile/MobileTopBar.vue'
 import MobileBottomNav from '@shared/components/mobile/MobileBottomNav.vue'
+import MobileDrawerMenu from '@shared/components/mobile/MobileDrawerMenu.vue'
 import MaturityAnalysisCard from '@reports/components/dashboard/cards/MaturityAnalysisCard.vue'
-import { useCompanyStore } from '@reports/stores/sharedStores'
+import { useCompanyStore, useAuthStore, useAccountingPeriodStore } from '@reports/stores/sharedStores'
 
 const router = useRouter()
 const route = useRoute()
 const companyStore = useCompanyStore()
+const authStore = useAuthStore()
+const periodStore = useAccountingPeriodStore()
+
+// US-703: Drawer state for hamburger menu
+const showDrawer = ref(false)
 
 // Detectare mobile - reactive with resize listener
 const windowWidth = ref(window.innerWidth)
@@ -143,6 +160,22 @@ const goBack = () => {
   router.push('/reports/dashboard')
 }
 
+// US-703: Handlers for MobileDrawerMenu
+const handleLogout = async () => {
+  await authStore.logout()
+  router.push('/login')
+}
+
+const handleCompanyChanged = (company) => {
+  // Company store watcher handles the refresh
+  console.log('Company changed:', company?.id_firma)
+}
+
+const handlePeriodChanged = () => {
+  // Period store watcher handles the refresh
+  console.log('Period changed')
+}
+
 // Handle period change from MaturityAnalysisCard
 const handlePeriodChange = (period) => {
   console.log('Maturity period changed:', period)