@@ -281,6 +351,34 @@
+ Asiakaspalvelu-sähköpostin IMAP-asetukset. Käytetään tikettien hakuun.
+
Endpoint:
GET https://intra.cuitunet.fi/api.php?action=saatavuus
diff --git a/script.js b/script.js
index 9f1a10b..970c2ba 100644
--- a/script.js
+++ b/script.js
@@ -186,6 +186,7 @@ document.querySelectorAll('.tab').forEach(tab => {
if (target === 'leads') loadLeads();
if (target === 'archive') loadArchive();
if (target === 'changelog') loadChangelog();
+ if (target === 'support') { loadTickets(); showTicketListView(); }
if (target === 'users') loadUsers();
if (target === 'settings') loadSettings();
});
@@ -838,6 +839,12 @@ const actionLabels = {
lead_delete: 'Poisti liidin',
lead_to_customer: 'Muutti liidin asiakkaaksi',
config_update: 'Päivitti asetukset',
+ ticket_fetch: 'Haki sähköpostit',
+ ticket_reply: 'Vastasi tikettiin',
+ ticket_status: 'Muutti tiketin tilaa',
+ ticket_assign: 'Osoitti tiketin',
+ ticket_note: 'Lisäsi muistiinpanon',
+ ticket_delete: 'Poisti tiketin',
};
async function loadChangelog() {
@@ -937,6 +944,262 @@ document.getElementById('user-form').addEventListener('submit', async (e) => {
} catch (e) { alert(e.message); }
});
+// ==================== TICKETS (ASIAKASPALVELU) ====================
+
+let tickets = [];
+let currentTicketId = null;
+let ticketReplyType = 'reply';
+
+const ticketStatusLabels = {
+ uusi: 'Uusi',
+ kasittelyssa: 'Käsittelyssä',
+ odottaa: 'Odottaa vastausta',
+ ratkaistu: 'Ratkaistu',
+ suljettu: 'Suljettu',
+};
+
+async function loadTickets() {
+ try {
+ tickets = await apiCall('tickets');
+ renderTickets();
+ } catch (e) { console.error(e); }
+}
+
+function renderTickets() {
+ const query = document.getElementById('ticket-search-input').value.toLowerCase().trim();
+ const statusFilter = document.getElementById('ticket-status-filter').value;
+ let filtered = tickets;
+ if (query) {
+ filtered = filtered.filter(t =>
+ (t.subject || '').toLowerCase().includes(query) ||
+ (t.from_name || '').toLowerCase().includes(query) ||
+ (t.from_email || '').toLowerCase().includes(query)
+ );
+ }
+ if (statusFilter) {
+ filtered = filtered.filter(t => t.status === statusFilter);
+ }
+
+ const ttbody = document.getElementById('tickets-tbody');
+ const noTickets = document.getElementById('no-tickets');
+ if (filtered.length === 0) {
+ ttbody.innerHTML = '';
+ noTickets.style.display = 'block';
+ document.getElementById('tickets-table').style.display = 'none';
+ } else {
+ noTickets.style.display = 'none';
+ document.getElementById('tickets-table').style.display = 'table';
+ ttbody.innerHTML = filtered.map(t => {
+ const lastType = t.last_message_type === 'reply_out' ? '→' : (t.last_message_type === 'note' ? '📝' : '←');
+ return `
+ | ${ticketStatusLabels[t.status] || t.status} |
+ ${esc(t.subject)} |
+ ${esc(t.from_name || t.from_email)} |
+ ${lastType} ${t.message_count} |
+ ${esc(t.assigned_to || '-')} |
+ ${esc((t.updated || '').substring(0, 16))} |
+
`;
+ }).join('');
+ }
+ document.getElementById('ticket-count').textContent = `${tickets.length} tikettiä`;
+
+ // Status summary
+ const counts = {};
+ tickets.forEach(t => { counts[t.status] = (counts[t.status] || 0) + 1; });
+ const parts = [];
+ if (counts.uusi) parts.push(`${counts.uusi} uutta`);
+ if (counts.kasittelyssa) parts.push(`${counts.kasittelyssa} käsittelyssä`);
+ if (counts.odottaa) parts.push(`${counts.odottaa} odottaa`);
+ document.getElementById('ticket-status-summary').textContent = parts.join(' · ');
+}
+
+document.getElementById('ticket-search-input').addEventListener('input', () => renderTickets());
+document.getElementById('ticket-status-filter').addEventListener('change', () => renderTickets());
+
+document.getElementById('tickets-tbody').addEventListener('click', (e) => {
+ const row = e.target.closest('tr');
+ if (row && row.dataset.ticketId) showTicketDetail(row.dataset.ticketId);
+});
+
+async function showTicketDetail(id) {
+ try {
+ const ticket = await apiCall('ticket_detail&id=' + encodeURIComponent(id));
+ currentTicketId = id;
+
+ // Header
+ document.getElementById('ticket-detail-header').innerHTML = `
+
+
+
${esc(ticket.subject)}
+
+ ${esc(ticket.from_name)} <${esc(ticket.from_email)}> · Luotu ${esc(ticket.created)}
+
+
+
+
+
+
+
+
`;
+
+ // Load users for assignment dropdown
+ try {
+ const users = await apiCall('users');
+ const assignSelect = document.getElementById('ticket-assign-select');
+ users.forEach(u => {
+ const opt = document.createElement('option');
+ opt.value = u.username;
+ opt.textContent = u.nimi || u.username;
+ if (u.username === ticket.assigned_to) opt.selected = true;
+ assignSelect.appendChild(opt);
+ });
+ } catch (e) { /* non-admin may not access users */ }
+
+ // Status change handler
+ document.getElementById('ticket-status-select').addEventListener('change', async function() {
+ try {
+ await apiCall('ticket_status', 'POST', { id: currentTicketId, status: this.value });
+ } catch (e) { alert(e.message); }
+ });
+
+ // Assign handler
+ document.getElementById('ticket-assign-select').addEventListener('change', async function() {
+ try {
+ await apiCall('ticket_assign', 'POST', { id: currentTicketId, assigned_to: this.value });
+ } catch (e) { alert(e.message); }
+ });
+
+ // Delete handler
+ document.getElementById('btn-ticket-delete').addEventListener('click', async () => {
+ if (!confirm('Poistetaanko tiketti "' + ticket.subject + '"?')) return;
+ try {
+ await apiCall('ticket_delete', 'POST', { id: currentTicketId });
+ showTicketListView();
+ loadTickets();
+ } catch (e) { alert(e.message); }
+ });
+
+ // Thread messages
+ const thread = document.getElementById('ticket-thread');
+ thread.innerHTML = (ticket.messages || []).map(m => {
+ const isOut = m.type === 'reply_out';
+ const isNote = m.type === 'note';
+ const typeClass = isOut ? 'ticket-msg-out' : (isNote ? 'ticket-msg-note' : 'ticket-msg-in');
+ const typeIcon = isOut ? '→ Vastaus' : (isNote ? '📝 Muistiinpano' : '← Saapunut');
+ return `
`;
+ }).join('');
+
+ // Show detail, hide list
+ document.getElementById('ticket-list-view').style.display = 'none';
+ document.getElementById('ticket-detail-view').style.display = 'block';
+
+ // Reset reply form
+ document.getElementById('ticket-reply-body').value = '';
+ document.getElementById('ticket-reply-body').placeholder = 'Kirjoita vastaus...';
+ ticketReplyType = 'reply';
+ document.querySelectorAll('.btn-reply-tab').forEach(b => b.classList.remove('active'));
+ document.querySelector('.btn-reply-tab[data-reply-type="reply"]').classList.add('active');
+ document.getElementById('btn-send-reply').textContent = 'Lähetä vastaus';
+
+ } catch (e) { alert(e.message); }
+}
+
+function showTicketListView() {
+ document.getElementById('ticket-detail-view').style.display = 'none';
+ document.getElementById('ticket-list-view').style.display = 'block';
+ currentTicketId = null;
+}
+
+document.getElementById('btn-ticket-back').addEventListener('click', () => {
+ showTicketListView();
+ loadTickets();
+});
+
+// Reply type tabs
+document.querySelectorAll('.btn-reply-tab').forEach(btn => {
+ btn.addEventListener('click', () => {
+ document.querySelectorAll('.btn-reply-tab').forEach(b => b.classList.remove('active'));
+ btn.classList.add('active');
+ ticketReplyType = btn.dataset.replyType;
+ const textarea = document.getElementById('ticket-reply-body');
+ const sendBtn = document.getElementById('btn-send-reply');
+ if (ticketReplyType === 'note') {
+ textarea.placeholder = 'Kirjoita sisäinen muistiinpano...';
+ sendBtn.textContent = 'Tallenna muistiinpano';
+ } else {
+ textarea.placeholder = 'Kirjoita vastaus...';
+ sendBtn.textContent = 'Lähetä vastaus';
+ }
+ });
+});
+
+// Send reply or note
+document.getElementById('btn-send-reply').addEventListener('click', async () => {
+ const body = document.getElementById('ticket-reply-body').value.trim();
+ if (!body) { alert('Kirjoita viesti ensin'); return; }
+ if (!currentTicketId) return;
+
+ const btn = document.getElementById('btn-send-reply');
+ btn.disabled = true;
+ btn.textContent = 'Lähetetään...';
+
+ try {
+ const action = ticketReplyType === 'note' ? 'ticket_note' : 'ticket_reply';
+ await apiCall(action, 'POST', { id: currentTicketId, body });
+ // Reload the detail view
+ await showTicketDetail(currentTicketId);
+ } catch (e) {
+ alert(e.message);
+ } finally {
+ btn.disabled = false;
+ btn.textContent = ticketReplyType === 'note' ? 'Tallenna muistiinpano' : 'Lähetä vastaus';
+ }
+});
+
+// Fetch emails
+document.getElementById('btn-fetch-emails').addEventListener('click', async () => {
+ const btn = document.getElementById('btn-fetch-emails');
+ const status = document.getElementById('ticket-fetch-status');
+ btn.disabled = true;
+ btn.textContent = '⏳ Haetaan...';
+ status.style.display = 'block';
+ status.className = '';
+ status.style.background = '#f0f7ff';
+ status.style.color = '#0f3460';
+ status.textContent = 'Yhdistetään sähköpostipalvelimeen...';
+
+ try {
+ const result = await apiCall('ticket_fetch', 'POST');
+ status.style.background = '#eafaf1';
+ status.style.color = '#27ae60';
+ status.textContent = `Valmis! ${result.new_tickets} uutta tikettiä, ${result.threaded} ketjutettu viestiä. Yhteensä ${result.total} tikettiä.`;
+ await loadTickets();
+ } catch (e) {
+ status.style.background = '#fef2f2';
+ status.style.color = '#e74c3c';
+ status.textContent = 'Virhe: ' + e.message;
+ } finally {
+ btn.disabled = false;
+ btn.textContent = '📧 Hae postit';
+ setTimeout(() => { status.style.display = 'none'; }, 8000);
+ }
+});
+
// ==================== SETTINGS ====================
async function loadSettings() {
@@ -946,6 +1209,12 @@ async function loadSettings() {
document.getElementById('settings-cors').value = (config.cors_origins || ['https://cuitunet.fi', 'https://www.cuitunet.fi']).join('\n');
const key = config.api_key || 'AVAIN';
document.getElementById('api-example-url').textContent = `api.php?action=saatavuus&key=${key}&osoite=Kauppakatu+5&postinumero=20100&kaupunki=Turku`;
+ // IMAP settings
+ document.getElementById('settings-imap-host').value = config.imap_host || '';
+ document.getElementById('settings-imap-port').value = config.imap_port || 993;
+ document.getElementById('settings-imap-user').value = config.imap_user || '';
+ document.getElementById('settings-imap-password').value = config.imap_password || '';
+ document.getElementById('settings-imap-encryption').value = config.imap_encryption || 'ssl';
} catch (e) { console.error(e); }
}
@@ -962,6 +1231,11 @@ document.getElementById('btn-save-settings').addEventListener('click', async ()
const config = await apiCall('config_update', 'POST', {
api_key: document.getElementById('settings-api-key').value,
cors_origins: document.getElementById('settings-cors').value,
+ imap_host: document.getElementById('settings-imap-host').value,
+ imap_port: document.getElementById('settings-imap-port').value,
+ imap_user: document.getElementById('settings-imap-user').value,
+ imap_password: document.getElementById('settings-imap-password').value,
+ imap_encryption: document.getElementById('settings-imap-encryption').value,
});
alert('Asetukset tallennettu!');
} catch (e) { alert(e.message); }
diff --git a/style.css b/style.css
index 7ec9338..7bbb053 100644
--- a/style.css
+++ b/style.css
@@ -1088,6 +1088,153 @@ span.empty {
color: #888;
}
+/* Ticket status badges */
+.ticket-status {
+ display: inline-block;
+ padding: 3px 10px;
+ border-radius: 12px;
+ font-size: 0.75rem;
+ font-weight: 600;
+ letter-spacing: 0.3px;
+ white-space: nowrap;
+}
+
+.ticket-status-uusi {
+ background: #3498db;
+ color: #fff;
+}
+
+.ticket-status-kasittelyssa {
+ background: #f39c12;
+ color: #fff;
+}
+
+.ticket-status-odottaa {
+ background: #f1c40f;
+ color: #333;
+}
+
+.ticket-status-ratkaistu {
+ background: #2ecc71;
+ color: #fff;
+}
+
+.ticket-status-suljettu {
+ background: #bdc3c7;
+ color: #555;
+}
+
+/* Ticket thread */
+.ticket-thread {
+ display: flex;
+ flex-direction: column;
+ gap: 0.75rem;
+ margin: 1.25rem 0;
+ padding: 1rem 0;
+ border-top: 2px solid #f0f2f5;
+ border-bottom: 2px solid #f0f2f5;
+ max-height: 60vh;
+ overflow-y: auto;
+}
+
+.ticket-message {
+ border-radius: 10px;
+ padding: 0.75rem 1rem;
+ position: relative;
+}
+
+.ticket-msg-in {
+ background: #f0f7ff;
+ border-left: 3px solid #3498db;
+}
+
+.ticket-msg-out {
+ background: #eafaf1;
+ border-left: 3px solid #2ecc71;
+}
+
+.ticket-msg-note {
+ background: #fffbea;
+ border-left: 3px solid #f39c12;
+}
+
+.ticket-msg-header {
+ display: flex;
+ align-items: center;
+ gap: 0.5rem;
+ margin-bottom: 0.5rem;
+ font-size: 0.82rem;
+ color: #555;
+ flex-wrap: wrap;
+}
+
+.ticket-msg-type {
+ font-size: 0.75rem;
+ font-weight: 600;
+ text-transform: uppercase;
+ letter-spacing: 0.3px;
+ opacity: 0.7;
+}
+
+.ticket-msg-time {
+ margin-left: auto;
+ color: #999;
+ font-size: 0.78rem;
+}
+
+.ticket-msg-body {
+ font-size: 0.9rem;
+ line-height: 1.6;
+ color: #333;
+ white-space: pre-wrap;
+ word-break: break-word;
+}
+
+/* Ticket reply form */
+.ticket-reply-form {
+ padding-top: 1rem;
+}
+
+.ticket-reply-form textarea {
+ width: 100%;
+ padding: 10px 12px;
+ border: 2px solid #e0e0e0;
+ border-radius: 8px;
+ font-size: 0.9rem;
+ font-family: inherit;
+ resize: vertical;
+ transition: border-color 0.2s, box-shadow 0.2s;
+}
+
+.ticket-reply-form textarea:focus {
+ outline: none;
+ border-color: #0f3460;
+ box-shadow: 0 0 0 3px rgba(15, 52, 96, 0.1);
+}
+
+.btn-reply-tab {
+ background: #f0f2f5;
+ border: 2px solid transparent;
+ padding: 6px 14px;
+ border-radius: 8px;
+ font-size: 0.82rem;
+ font-weight: 600;
+ cursor: pointer;
+ color: #888;
+ transition: all 0.15s;
+}
+
+.btn-reply-tab:hover {
+ color: #555;
+ background: #e8ebf0;
+}
+
+.btn-reply-tab.active {
+ color: #0f3460;
+ background: #fff;
+ border-color: #0f3460;
+}
+
/* Changelog */
.nowrap {
white-space: nowrap;