181 lines
8.3 KiB
HTML
181 lines
8.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="it">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="description"
|
|
content="OTRS Turbo — Interfaccia moderna per gestione rapida ticket. Accesso diretto al database OTRS.">
|
|
<title>OTRS Turbo — Gestione Ticket Veloce</title>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap"
|
|
rel="stylesheet">
|
|
<link href="https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.snow.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="/css/style.css">
|
|
</head>
|
|
|
|
<body>
|
|
<!-- Sidebar Navigation -->
|
|
<nav class="sidebar" id="sidebar">
|
|
<div class="sidebar-brand" style="border-bottom:none; padding-bottom:4px;">
|
|
<div class="brand-icon">⚡</div>
|
|
<span class="brand-text">OTRS Turbo</span>
|
|
</div>
|
|
<div class="sidebar-timer" id="daily-timer"
|
|
style="padding:var(--space-md) var(--space-lg) var(--space-lg) var(--space-lg); border-bottom:1px solid var(--border-subtle); font-size:0.75rem; color:var(--text-secondary); font-family:monospace; line-height:1.2;">
|
|
<span class="timer-display">0 / 480 | 480</span>
|
|
</div>
|
|
|
|
<ul class="nav-menu">
|
|
<li>
|
|
<a href="#/dashboard" class="nav-link active" data-view="dashboard" id="nav-dashboard">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<rect x="3" y="3" width="7" height="7" rx="1" />
|
|
<rect x="14" y="3" width="7" height="7" rx="1" />
|
|
<rect x="3" y="14" width="7" height="7" rx="1" />
|
|
<rect x="14" y="14" width="7" height="7" rx="1" />
|
|
</svg>
|
|
<span>Dashboard</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="#/tickets" class="nav-link" data-view="tickets" id="nav-tickets">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2" />
|
|
<rect x="9" y="3" width="6" height="4" rx="1" />
|
|
<path d="M9 12h6M9 16h4" />
|
|
</svg>
|
|
<span>Ticket</span>
|
|
<span class="nav-badge" id="open-ticket-count"></span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="#/tickets/my" class="nav-link" data-view="tickets-my" id="nav-tickets-my">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2" />
|
|
<circle cx="12" cy="7" r="4" />
|
|
</svg>
|
|
<span>A mio carico</span>
|
|
<span class="nav-badge" id="my-ticket-count"></span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="#/tickets/new" class="nav-link" data-view="new-ticket" id="nav-new-ticket">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<circle cx="12" cy="12" r="10" />
|
|
<path d="M12 8v8M8 12h8" />
|
|
</svg>
|
|
<span>Nuovo Ticket</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="#/tickets/bulk" class="nav-link" data-view="bulk-tickets" id="nav-bulk-tickets">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
|
|
<circle cx="9" cy="7" r="4"></circle>
|
|
<path d="M23 21v-2a4 4 0 0 0-3-3.87"></path>
|
|
<path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
|
|
</svg>
|
|
<span>Apertura Massiva</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="#/activity" class="nav-link" data-view="activity" id="nav-activity">
|
|
<svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<circle cx="12" cy="12" r="10" />
|
|
<polyline points="12 6 12 12 16 14" />
|
|
</svg>
|
|
<span>Storico Attività Turbo</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
|
|
<div class="sidebar-footer">
|
|
<div class="sidebar-footer-info">
|
|
<div class="connection-dot" id="connection-status"></div>
|
|
<span class="connection-text" id="connection-text">Connessione DB...</span>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Main Content -->
|
|
<main class="main-content" id="main-content">
|
|
<!-- Top Bar -->
|
|
<header class="topbar" id="topbar">
|
|
<div class="topbar-left" style="display:flex; align-items:center; gap:var(--space-md);">
|
|
<h1 class="page-title" id="page-title">Dashboard</h1>
|
|
<div style="display:flex; align-items:center; gap:var(--space-xs);">
|
|
<select class="form-select" id="active-agent-select"
|
|
style="padding: 6px 32px 6px 12px; font-size: 0.85rem; height: 36px; min-width: 180px; margin: 0; background-position: right 10px center; border-color: var(--border-light);"></select>
|
|
<button class="btn btn-ghost btn-sm" id="refresh-lookups-btn"
|
|
style="height:36px; padding:0 10px; min-width:36px;" title="Aggiorna dati locali (code, utenti)">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="width:16px;height:16px;">
|
|
<path d="M21.5 2v6h-6M21.34 15.57a10 10 0 1 1-.57-8.38l5.67-5.67" />
|
|
</svg>
|
|
</button>
|
|
<select class="form-select" id="theme-select"
|
|
style="padding: 6px 32px 6px 12px; font-size: 0.85rem; height: 36px; min-width: 130px; margin: 0; background-position: right 10px center; border-color: var(--border-light);">
|
|
<option value="light">Tema Chiaro</option>
|
|
<option value="dark">Tema Scuro</option>
|
|
<option value="rosso">Rosso</option>
|
|
<option value="naturale">Naturale</option>
|
|
<option value="ice">Ice</option>
|
|
<option value="autunno">Autunno</option>
|
|
<option value="fairytale">Fairytale</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="topbar-right">
|
|
<div class="search-bar" id="global-search-container">
|
|
<svg class="search-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
<circle cx="11" cy="11" r="8" />
|
|
<path d="M21 21l-4.35-4.35" />
|
|
</svg>
|
|
<input type="text" class="search-input" id="global-search"
|
|
placeholder="Cerca ticket (numero, titolo o corpo)..." style="padding-right: 32px;" />
|
|
<button id="global-search-clear"
|
|
style="position: absolute; right: 10px; top: 50%; transform: translateY(-50%); background: none; border: none; padding: 4px; cursor: pointer; color: var(--text-muted); display: none; align-items: center; justify-content: center;"
|
|
title="Cancella ricerca">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
|
style="width:14px;height:14px;display:block;">
|
|
<path d="M18 6L6 18M6 6l12 12" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
<button class="btn btn-primary btn-sm" id="topbar-new-ticket" onclick="window.location.hash='#/tickets/new'">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="width:16px;height:16px;">
|
|
<path d="M12 5v14M5 12h14" />
|
|
</svg>
|
|
Nuovo
|
|
</button>
|
|
</div>
|
|
</header>
|
|
|
|
<!-- View Container -->
|
|
<div class="view-container" id="view-container">
|
|
<!-- Dynamic content rendered here by JS -->
|
|
<div class="loading-screen" id="loading-screen">
|
|
<div class="spinner"></div>
|
|
<p>Caricamento...</p>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<!-- Toast Container -->
|
|
<div class="toast-container" id="toast-container"></div>
|
|
|
|
<!-- Scripts -->
|
|
<script src="https://cdn.jsdelivr.net/npm/quill@2.0.2/dist/quill.js"></script>
|
|
<script src="/js/components/toast.js"></script>
|
|
<script src="/js/components/filters.js"></script>
|
|
<script src="/js/views/dashboard.js"></script>
|
|
<script src="/js/views/ticketList.js"></script>
|
|
<script src="/js/views/ticketDetail.js"></script>
|
|
<script src="/js/views/ticketCreate.js"></script>
|
|
<script src="/js/views/ticketBulk.js"></script>
|
|
<script src="/js/views/activityLog.js"></script>
|
|
<script src="/js/app.js"></script>
|
|
</body>
|
|
|
|
</html> |