feat: possibilità di ingrandire gli elenchi delle pagine dashbaord, ticket e ticket a mio carico

public/js/views/dashboard.js

@@ -88,7 +88,19 @@ const DashboardView = {
 
         <!-- Recent Tickets -->
         <div class="card">
-          <div class="card-title">Ticket Recenti</div>
+          <div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:var(--space-md); flex-wrap:wrap; gap:var(--space-xs);">
+            <div class="card-title" style="margin-bottom:0;">Ticket Recenti</div>
+            <div style="display:flex; align-items:center; gap:var(--space-xs); font-size:0.85rem; color:var(--text-secondary);">
+              <span>Mostra:</span>
+              <select id="dashboard-preview-limit" class="form-select" style="padding: 4px 28px 4px 8px; font-size: 0.8rem; height: 28px; min-width: 70px; margin: 0; background-position: right 8px center; border-color: var(--border-light);">
+                <option value="5" ${stats.preview_limit === 5 ? 'selected' : ''}>5</option>
+                <option value="10" ${stats.preview_limit === 10 ? 'selected' : ''}>10</option>
+                <option value="20" ${stats.preview_limit === 20 ? 'selected' : ''}>20</option>
+                <option value="50" ${stats.preview_limit === 50 ? 'selected' : ''}>50</option>
+                <option value="100" ${stats.preview_limit === 100 ? 'selected' : ''}>100</option>
+              </select>
+            </div>
+          </div>
           ${(stats.recent_tickets || []).length > 0 ? `
             <table class="recent-tickets-table">
               <thead>
@@ -132,6 +144,24 @@ const DashboardView = {
         });
       });
 
+      // Bind preview limit change event
+      const limitSelect = document.getElementById('dashboard-preview-limit');
+      if (limitSelect) {
+        limitSelect.addEventListener('change', async () => {
+          const newLimit = parseInt(limitSelect.value, 10);
+          try {
+            await App.api('/api/dashboard/settings', {
+              method: 'POST',
+              body: JSON.stringify({ preview_limit: newLimit }),
+            });
+            Toast.success(`Limite anteprima aggiornato a ${newLimit} ticket!`);
+            this.render();
+          } catch (err) {
+            Toast.error('Errore durante il salvataggio dell\'impostazione: ' + err.message);
+          }
+        });
+      }
+
       // Update open ticket count in sidebar badge
       const badge = document.getElementById('open-ticket-count');
       if (badge) {

public/js/views/ticketList.js

@@ -19,6 +19,16 @@ const TicketListView = {
       // Fetch lookups for filter dropdowns
       await App.ensureLookups();
 
+      // Fetch agent settings for tickets_per_page
+      try {
+        const settings = await App.api('/api/dashboard/settings');
+        if (settings && settings.tickets_per_page) {
+          this.perPage = settings.tickets_per_page;
+        }
+      } catch (err) {
+        console.warn('Failed to load agent settings:', err);
+      }
+
       // Build query params
       const isMyTickets = window.location.hash.startsWith('#/tickets/my');
       Filters.currentMode = isMyTickets ? 'my' : 'general';
@@ -168,6 +178,19 @@ const TicketListView = {
 
   renderPagination(page, per_page, total, total_pages, isTop) {
     const marginStyle = isTop ? 'margin-bottom: var(--space-md); margin-top: 0;' : 'margin-top: var(--space-md); margin-bottom: 0;';
+    const limitSelectHtml = `
+      <div style="display:inline-flex; align-items:center; gap:var(--space-xs); font-size:0.8rem; color:var(--text-secondary); margin-right:var(--space-md);">
+        <span>Righe:</span>
+        <select class="form-select ticket-per-page-select" style="padding: 2px 24px 2px 6px; font-size: 0.75rem; height: 26px; min-width: 65px; margin: 0; background-position: right 6px center; border-color: var(--border-light);">
+          <option value="10" ${per_page === 10 ? 'selected' : ''}>10</option>
+          <option value="20" ${per_page === 20 ? 'selected' : ''}>20</option>
+          <option value="50" ${per_page === 50 ? 'selected' : ''}>50</option>
+          <option value="100" ${per_page === 100 ? 'selected' : ''}>100</option>
+          <option value="200" ${per_page === 200 ? 'selected' : ''}>200</option>
+        </select>
+      </div>
+    `;
+
     if (total_pages > 1) {
       return `
         <div class="pagination" style="${marginStyle}">
@@ -175,6 +198,7 @@ const TicketListView = {
             Mostrando ${((page - 1) * per_page) + 1}–${Math.min(page * per_page, total)} di ${total} ticket
           </div>
           <div class="pagination-controls">
+            ${limitSelectHtml}
             <button class="pagination-btn" data-page="1" ${page <= 1 ? 'disabled' : ''}>«</button>
             <button class="pagination-btn" data-page="${page - 1}" ${page <= 1 ? 'disabled' : ''}>‹</button>
             ${this.renderPageButtons(page, total_pages)}
@@ -187,7 +211,9 @@ const TicketListView = {
       return `
         <div class="pagination" style="${marginStyle}">
           <div class="pagination-info">${total} ticket totali</div>
-          <div></div>
+          <div class="pagination-controls">
+            ${limitSelectHtml}
+          </div>
         </div>
       `;
     }
@@ -400,6 +426,25 @@ const TicketListView = {
         this.render();
       });
     });
+
+    // Page size change
+    document.querySelectorAll('.ticket-per-page-select').forEach(select => {
+      select.addEventListener('change', async () => {
+        const newLimit = parseInt(select.value, 10);
+        try {
+          await App.api('/api/dashboard/settings', {
+            method: 'POST',
+            body: JSON.stringify({ tickets_per_page: newLimit }),
+          });
+          Toast.success(`Righe per pagina aggiornate a ${newLimit}!`);
+          this.perPage = newLimit;
+          this.currentPage = 1;
+          this.render();
+        } catch (err) {
+          Toast.error('Errore durante il salvataggio dell\'impostazione: ' + err.message);
+        }
+      });
+    });
   },
 
   updateBatchBar() {