From a89605b888395c6019d274405eb7788cd9438912 Mon Sep 17 00:00:00 2001 From: Gabriele Cimaschi Date: Thu, 9 Jul 2026 08:36:03 +0200 Subject: [PATCH] =?UTF-8?q?feat:=20gestione=20gruppi=20di=20ticket.=20feat?= =?UTF-8?q?:=20miglioramento=20filtri=20ticket=20a=20mio=20carico=20e=20ti?= =?UTF-8?q?cket.=20feat:=20possiblit=C3=A0=20di=20copiare=20il=20numero=20?= =?UTF-8?q?del=20tocket=20con=20pulsante=20copia?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .agents/rules/notifiche-browser.md | 5 + activityDb.js | 30 ++ public/index.html | 31 +- public/js/app.js | 92 +++++ public/js/components/filters.js | 603 +++++++++++++++++++++-------- public/js/views/signatures.js | 3 +- public/js/views/ticketCreate.js | 18 +- public/js/views/ticketDetail.js | 82 +++- public/js/views/ticketGroups.js | 579 +++++++++++++++++++++++++++ public/js/views/ticketList.js | 45 ++- routes/groups.js | 241 ++++++++++++ routes/presets.js | 72 ++++ routes/tickets.js | 51 ++- server.js | 4 + 14 files changed, 1674 insertions(+), 182 deletions(-) create mode 100644 .agents/rules/notifiche-browser.md create mode 100644 public/js/views/ticketGroups.js create mode 100644 routes/groups.js create mode 100644 routes/presets.js diff --git a/.agents/rules/notifiche-browser.md b/.agents/rules/notifiche-browser.md new file mode 100644 index 0000000..d0bea2e --- /dev/null +++ b/.agents/rules/notifiche-browser.md @@ -0,0 +1,5 @@ +--- +trigger: always_on +--- + +Non usare le notifiche native dei browser. \ No newline at end of file diff --git a/activityDb.js b/activityDb.js index 545e6c5..75d4f4e 100644 --- a/activityDb.js +++ b/activityDb.js @@ -47,6 +47,36 @@ db.exec(` ) `); +db.exec(` + CREATE TABLE IF NOT EXISTS ticket_groups ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + nome TEXT NOT NULL, + descrizione TEXT, + master_ticket_id INTEGER, + created_at TEXT NOT NULL DEFAULT (strftime('%Y-%m-%dT%H:%M:%fZ', 'now')) + ) +`); + +db.exec(` + CREATE TABLE IF NOT EXISTS ticket_group_members ( + group_id INTEGER NOT NULL, + ticket_id INTEGER NOT NULL, + PRIMARY KEY (group_id, ticket_id), + FOREIGN KEY (group_id) REFERENCES ticket_groups (id) ON DELETE CASCADE + ) +`); + +db.exec(` + CREATE TABLE IF NOT EXISTS filter_presets ( + id INTEGER PRIMARY KEY AUTOINCREMENT, + agent_id INTEGER NOT NULL, + name TEXT NOT NULL, + page_mode TEXT NOT NULL, + filters_json TEXT NOT NULL, + created_at TEXT NOT NULL DEFAULT (strftime('%Y-%m-%dT%H:%M:%fZ', 'now')) + ) +`); + try { db.exec(`ALTER TABLE agent_settings ADD COLUMN tickets_per_page INTEGER NOT NULL DEFAULT 50`); } catch (e) { diff --git a/public/index.html b/public/index.html index eaff90b..a9c9ab7 100644 --- a/public/index.html +++ b/public/index.html @@ -60,6 +60,17 @@ +
  • + + + + + + + + Gruppi Ticket + +
  • @@ -80,6 +91,16 @@ Apertura Massiva
    • +
    +
  • + + + + + + Firme Email + +
  • @@ -89,15 +110,6 @@ Storico Attività Turbo
    • -
  • - - - - - - Firme Email - -
    • @@ -186,6 +198,7 @@ + diff --git a/public/js/app.js b/public/js/app.js index cafb357..5d4f67f 100644 --- a/public/js/app.js +++ b/public/js/app.js @@ -142,6 +142,11 @@ const App = { titleEl.textContent = 'Apertura Massiva Ticket'; TicketBulkView.render(); + } else if (hash === '#/tickets/groups') { + document.getElementById('nav-ticket-groups')?.classList.add('active'); + titleEl.textContent = 'Gruppi ticket'; + TicketGroupsView.render(); + } else if (hash === '#/activity') { document.getElementById('nav-activity')?.classList.add('active'); titleEl.textContent = 'Storico Attività'; @@ -721,6 +726,93 @@ const App = { }); }); }, + + /** Custom prompt dialog in the center of the screen */ + prompt(title, message, options = {}) { + return new Promise((resolve) => { + const overlay = document.createElement('div'); + overlay.style.position = 'fixed'; + overlay.style.top = '0'; + overlay.style.left = '0'; + overlay.style.width = '100vw'; + overlay.style.height = '100vh'; + overlay.style.background = 'rgba(0, 0, 0, 0.6)'; + overlay.style.backdropFilter = 'blur(4px)'; + overlay.style.display = 'flex'; + overlay.style.alignItems = 'center'; + overlay.style.justifyContent = 'center'; + overlay.style.zIndex = '99999'; + overlay.style.opacity = '0'; + overlay.style.transition = 'opacity 0.2s ease'; + + const card = document.createElement('div'); + card.style.background = 'var(--bg-card, #1e1e2e)'; + card.style.border = '1px solid var(--border-subtle, #313244)'; + card.style.borderRadius = 'var(--radius-lg, 12px)'; + card.style.padding = 'var(--space-lg, 24px)'; + card.style.width = '100%'; + card.style.maxWidth = '400px'; + card.style.boxShadow = 'var(--shadow-lg, 0 10px 30px rgba(0,0,0,0.5))'; + card.style.transform = 'scale(0.9)'; + card.style.transition = 'transform 0.2s ease'; + card.className = 'prompt-dialog-card'; + + card.innerHTML = ` +

    ${title}

    +

    ${message}

    + +
    + + +
    + `; + + overlay.appendChild(card); + document.body.appendChild(overlay); + + const input = card.querySelector('#prompt-input-field'); + + requestAnimationFrame(() => { + overlay.style.opacity = '1'; + card.style.transform = 'scale(1)'; + setTimeout(() => { + if (input) input.focus(); + }, 50); + }); + + const cleanUp = (resultValue) => { + overlay.style.opacity = '0'; + card.style.transform = 'scale(0.9)'; + setTimeout(() => { + overlay.remove(); + resolve(resultValue); + }, 200); + }; + + const btnCancel = card.querySelector('#prompt-btn-cancel'); + const btnOk = card.querySelector('#prompt-btn-ok'); + + btnCancel.addEventListener('click', () => cleanUp(null)); + btnOk.addEventListener('click', () => { + const val = input ? input.value : ''; + cleanUp(val); + }); + + if (input) { + input.addEventListener('keydown', (e) => { + if (e.key === 'Enter') { + btnOk.click(); + } else if (e.key === 'Escape') { + btnCancel.click(); + } + }); + } + + overlay.addEventListener('click', (e) => { + if (e.target === overlay) cleanUp(null); + }); + }); + }, }; // Start the app when DOM is ready diff --git a/public/js/components/filters.js b/public/js/components/filters.js index 106a569..f599a5a 100644 --- a/public/js/components/filters.js +++ b/public/js/components/filters.js @@ -26,6 +26,16 @@ const Filters = { } }, + customerCache: {}, + presets: [], + selectedPresetId: null, + + saveCustomerCache() { + try { + localStorage.setItem('otrs_turbo_customer_cache', JSON.stringify(this.customerCache)); + } catch (e) { /* ignore */ } + }, + // Dynamic state getter based on active mode get state() { return this.allStates[this.currentMode]; @@ -50,6 +60,11 @@ const Filters = { const activeAgentId = localStorage.getItem('activeAgentId') || '1'; this.allStates.my.user_id = activeAgentId; } + + const savedCache = localStorage.getItem('otrs_turbo_customer_cache'); + if (savedCache) { + this.customerCache = JSON.parse(savedCache); + } } catch (e) { /* ignore */ } }, @@ -79,37 +94,31 @@ const Filters = { return params; }, - /** Helper to compute trigger button label text */ - getStateMultiselectLabel(lookups) { - const selectedList = Array.isArray(this.state.state_id) - ? this.state.state_id - : (typeof this.state.state_id === 'string' && this.state.state_id ? this.state.state_id.split(',') : []); - + /** Helper to compute trigger button label text for multiselect dropdowns */ + getMultiselectLabel(selectedVal, itemsList, labelField = 'name', idField = 'id') { + const selectedList = Array.isArray(selectedVal) + ? selectedVal + : (typeof selectedVal === 'string' && selectedVal ? selectedVal.split(',') : []); + if (selectedList.length === 0) { return 'Tutti'; } - const selectedNames = (lookups.states || []) - .filter(s => selectedList.includes(String(s.id))) - .map(s => s.name); - - if (selectedNames.length === (lookups.states || []).length) { + + const selectedNames = (itemsList || []) + .filter(item => selectedList.includes(String(item[idField]))) + .map(item => typeof labelField === 'function' ? labelField(item) : item[labelField]); + + if (selectedNames.length === 0) { return 'Tutti'; - } else if (selectedNames.length <= 2) { + } + + if (selectedNames.length <= 2) { return selectedNames.join(', '); } else { return `${selectedNames.length} selezionati`; } }, - /** Update label DOM element dynamically */ - updateStateMultiselectLabel(lookups) { - const labelEl = document.getElementById('state-multiselect-label'); - if (labelEl) { - labelEl.textContent = this.getStateMultiselectLabel(lookups); - } - }, - - /** Helper to compute trigger button label text for customer users */ getCustomerUserMultiselectLabel(lookups) { const selectedList = Array.isArray(this.state.customer_user_id) ? this.state.customer_user_id @@ -118,13 +127,22 @@ const Filters = { if (selectedList.length === 0) { return 'Tutti'; } - const selectedNames = (lookups.customerUsers || []) - .filter(u => selectedList.includes(String(u.login))) - .map(u => `${u.last_name} ${u.first_name}`); + + const selectedNames = selectedList.map(login => { + if (this.customerCache && this.customerCache[login]) { + return this.customerCache[login]; + } + const found = (lookups.customerUsers || []).find(u => String(u.login) === String(login)); + if (found) { + const fullName = `${found.last_name} ${found.first_name}`.trim(); + this.customerCache[login] = fullName; + this.saveCustomerCache(); + return fullName; + } + return login; + }); - if (selectedNames.length === (lookups.customerUsers || []).length) { - return 'Tutti'; - } else if (selectedNames.length <= 2) { + if (selectedNames.length <= 2) { return selectedNames.join(', '); } else { return `${selectedNames.length} selezionati`; @@ -145,72 +163,147 @@ const Filters = { * @returns {string} HTML string */ renderBar(lookups) { - const makeOptions = (items, valueKey, labelKey, selectedVal) => { - return items.map(item => { - const val = item[valueKey]; - const label = typeof labelKey === 'function' ? labelKey(item) : item[labelKey]; - const sel = String(val) === String(selectedVal) ? 'selected' : ''; - return ``; - }).join(''); - }; - - const currentLabel = this.getStateMultiselectLabel(lookups); + const stateLabel = this.getMultiselectLabel(this.state.state_id, lookups.states); + const queueLabel = this.getMultiselectLabel(this.state.queue_id, lookups.queues); + const priorityLabel = this.getMultiselectLabel(this.state.priority_id, lookups.priorities); + const ownerLabel = this.getMultiselectLabel(this.state.user_id, lookups.users, u => `${u.first_name} ${u.last_name}`); const customerUserLabel = this.getCustomerUserMultiselectLabel(lookups); + const presetOptions = (this.presets || []).map(p => { + const sel = String(p.id) === String(this.selectedPresetId) ? 'selected' : ''; + return ``; + }).join(''); + return `
    +
    + Preset +
    + + + +
    +
    + +
    Stato -
    - ${App.escapeHtml(currentLabel)} +
    + ${App.escapeHtml(stateLabel)} ▼