Asiakaspalvelu: alinavi-uudelleenjärjestely + tikettityyppien hallinta
Vastauspohjat, Säännöt ja Asetukset siirretty omiksi alinaveikseen tikettilistan overlay-napeista. Säännöt-välilehdelle lisätty tikettityyppien hallinta (lisää/poista). Tyypit tallennetaan tietokantaan yrityskohtaisesti ja populoidaan dynaamisesti kaikkiin dropdown-valikoihin. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
297
index.html
297
index.html
@@ -1066,6 +1066,9 @@
|
||||
<div class="sub-tab-bar" id="support-sub-tab-bar">
|
||||
<button class="sub-tab active" data-support-subtab="support-tickets">Tiketit</button>
|
||||
<button class="sub-tab" data-support-subtab="support-ohjeet">Ohjeet</button>
|
||||
<button class="sub-tab" data-support-subtab="support-saannot">Säännöt</button>
|
||||
<button class="sub-tab" data-support-subtab="support-vastauspohjat">Vastauspohjat</button>
|
||||
<button class="sub-tab" data-support-subtab="support-asetukset">Asetukset</button>
|
||||
</div>
|
||||
<div id="subtab-support-tickets" class="sub-tab-content active">
|
||||
<div class="main-container">
|
||||
@@ -1079,11 +1082,6 @@
|
||||
</div>
|
||||
<select id="ticket-type-filter" style="padding:9px 12px;border:2px solid #e0e0e0;border-radius:8px;font-size:0.88rem;">
|
||||
<option value="">Kaikki tyypit</option>
|
||||
<option value="laskutus">Laskutus</option>
|
||||
<option value="tekniikka">Tekniikka</option>
|
||||
<option value="vika">Vika</option>
|
||||
<option value="abuse">Abuse</option>
|
||||
<option value="muu">Muu</option>
|
||||
</select>
|
||||
<select id="ticket-status-filter" style="padding:9px 12px;border:2px solid #e0e0e0;border-radius:8px;font-size:0.88rem;">
|
||||
<option value="">Kaikki avoimet</option>
|
||||
@@ -1101,9 +1099,6 @@
|
||||
<label style="display:flex;align-items:center;gap:0.4rem;font-size:0.85rem;color:#777;cursor:pointer;white-space:nowrap;">
|
||||
<input type="checkbox" id="ticket-show-closed"> Suljetut
|
||||
</label>
|
||||
<button class="btn-secondary" id="btn-ticket-templates" style="padding:7px 14px;font-size:0.82rem;">📝 Vastauspohjat</button>
|
||||
<button class="btn-secondary" id="btn-ticket-rules" style="padding:7px 14px;font-size:0.82rem;">⚙ Säännöt</button>
|
||||
<button class="btn-secondary" id="btn-ticket-settings" style="padding:7px 14px;font-size:0.82rem;">⚙ Omat asetukset</button>
|
||||
<label style="display:flex;align-items:center;gap:0.4rem;font-size:0.82rem;color:#777;cursor:pointer;white-space:nowrap;margin-left:auto;">
|
||||
<input type="checkbox" id="ticket-auto-refresh" checked> Autopäivitys
|
||||
<select id="ticket-refresh-interval" style="padding:3px 6px;border:1px solid #ddd;border-radius:5px;font-size:0.8rem;">
|
||||
@@ -1193,150 +1188,154 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Sääntönäkymä -->
|
||||
<div id="ticket-rules-view" style="display:none;">
|
||||
<button class="btn-secondary" id="btn-rules-back" style="color:#555;border-color:#ddd;margin-bottom:1rem;">← Takaisin tiketteihin</button>
|
||||
<div class="table-card" style="padding:1.5rem;">
|
||||
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;">
|
||||
<h3 style="color:#0f3460;margin:0;">Automaattisäännöt</h3>
|
||||
<button class="btn-primary" id="btn-add-rule" style="font-size:0.85rem;">+ Lisää sääntö</button>
|
||||
</div>
|
||||
<p style="color:#888;font-size:0.85rem;margin-bottom:1rem;">Säännöt soveltuvat automaattisesti uusiin tiketteihin haettaessa sähköposteja. Ensimmäinen täsmäävä sääntö voittaa.</p>
|
||||
<div id="rules-list"></div>
|
||||
</div>
|
||||
<!-- Sääntölomake -->
|
||||
<div id="rule-form-container" class="table-card" style="padding:1.5rem;margin-top:1rem;display:none;">
|
||||
<h4 style="color:#0f3460;margin-bottom:1rem;" id="rule-form-title">Uusi sääntö</h4>
|
||||
<input type="hidden" id="rule-form-id">
|
||||
<div class="form-grid" style="max-width:600px;">
|
||||
<div class="form-group full-width">
|
||||
<label>Säännön nimi *</label>
|
||||
<input type="text" id="rule-form-name" placeholder="esim. Sulje notifikaatiot">
|
||||
</div>
|
||||
<div class="form-group full-width" style="margin-top:0.5rem;">
|
||||
<label style="font-weight:600;color:#0f3460;">Ehdot (kaikki täytetyt pitää täsmätä)</label>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Lähettäjä sisältää</label>
|
||||
<input type="text" id="rule-form-from" placeholder="esim. noreply@">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Vastaanottaja sisältää</label>
|
||||
<input type="text" id="rule-form-to" placeholder="esim. abuse@ tai laskutus@">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Otsikko sisältää</label>
|
||||
<input type="text" id="rule-form-subject" placeholder="esim. saatavuuskysely">
|
||||
</div>
|
||||
<div class="form-group full-width" style="margin-top:0.5rem;">
|
||||
<label style="font-weight:600;color:#0f3460;">Toimenpiteet</label>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Aseta tila</label>
|
||||
<select id="rule-form-status">
|
||||
<option value="">Ei muuteta</option>
|
||||
<option value="suljettu">Suljettu</option>
|
||||
<option value="kasittelyssa">Käsittelyssä</option>
|
||||
<option value="ratkaistu">Ratkaistu</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Aseta tyyppi</label>
|
||||
<select id="rule-form-type">
|
||||
<option value="">Ei muuteta</option>
|
||||
<option value="laskutus">Laskutus</option>
|
||||
<option value="tekniikka">Tekniikka</option>
|
||||
<option value="vika">Vika</option>
|
||||
<option value="abuse">Abuse</option>
|
||||
<option value="muu">Muu</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Aseta prioriteetti</label>
|
||||
<select id="rule-form-priority">
|
||||
<option value="">Ei muuteta</option>
|
||||
<option value="normaali">Normaali</option>
|
||||
<option value="tärkeä">Tärkeä</option>
|
||||
<option value="urgent">Kiireellinen</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Aseta tagit (pilkulla eroteltuna)</label>
|
||||
<input type="text" id="rule-form-tags" placeholder="esim. notification, automaatti">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Auto-close (päivää)</label>
|
||||
<input type="number" id="rule-form-autoclose" min="0" max="365" placeholder="esim. 7" style="max-width:120px;">
|
||||
</div>
|
||||
</div>
|
||||
<div style="display:flex;gap:0.5rem;margin-top:1rem;">
|
||||
<button class="btn-primary" id="btn-save-rule">Tallenna</button>
|
||||
<button class="btn-secondary" id="btn-cancel-rule">Peruuta</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Vastauspohjien hallinta -->
|
||||
<div id="ticket-templates-view" style="display:none;">
|
||||
<button class="btn-secondary" id="btn-templates-back" style="color:#555;border-color:#ddd;margin-bottom:1rem;">← Takaisin tiketteihin</button>
|
||||
<div class="table-card" style="padding:1.5rem;">
|
||||
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;">
|
||||
<h3 style="color:#0f3460;margin:0;">Vastauspohjat</h3>
|
||||
<button class="btn-primary" id="btn-add-tpl" style="font-size:0.85rem;">+ Lisää pohja</button>
|
||||
</div>
|
||||
<p style="color:#888;font-size:0.85rem;margin-bottom:1rem;">Yrityksen yhteiset vastauspohjat tiketteihin. Valittavissa vastauslomakkeen valikosta kaikille käyttäjille.</p>
|
||||
<div id="tpl-list"></div>
|
||||
</div>
|
||||
<!-- Pohjanlomake -->
|
||||
<div id="tpl-form-container" class="table-card" style="padding:1.5rem;margin-top:1rem;display:none;">
|
||||
<h4 style="color:#0f3460;margin-bottom:1rem;" id="tpl-form-title">Uusi vastauspohja</h4>
|
||||
<input type="hidden" id="tpl-form-id">
|
||||
<div class="form-grid" style="max-width:600px;">
|
||||
<div class="form-group full-width">
|
||||
<label>Nimi *</label>
|
||||
<input type="text" id="tpl-form-name" placeholder="esim. Kuittaus vastaanotettu">
|
||||
</div>
|
||||
<div class="form-group full-width">
|
||||
<label>Sisältö *</label>
|
||||
<textarea id="tpl-form-body" rows="6" placeholder="Kiitos viestistäsi! Olemme vastaanottaneet asiasi ja palaamme siihen mahdollisimman pian."></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display:flex;gap:0.5rem;margin-top:1rem;">
|
||||
<button class="btn-primary" id="btn-save-tpl">Tallenna</button>
|
||||
<button class="btn-secondary" id="btn-cancel-tpl">Peruuta</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Omat asetukset -näkymä -->
|
||||
<div id="ticket-settings-view" style="display:none;">
|
||||
<div style="display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem;">
|
||||
<button class="btn-secondary" onclick="closeTicketSettings()">← Takaisin</button>
|
||||
<h2 style="color:#0f3460;font-size:1.15rem;margin:0;">Omat asetukset</h2>
|
||||
</div>
|
||||
|
||||
<div class="table-card" style="padding:1.5rem;margin-bottom:1.5rem;">
|
||||
<h3 style="color:#0f3460;font-size:1rem;margin-bottom:0.75rem;">Sähköpostiallekirjoitukset</h3>
|
||||
<p style="color:#888;font-size:0.82rem;margin-bottom:1rem;">Allekirjoitus liitetään automaattisesti sähköpostivastausten loppuun.</p>
|
||||
<div id="ticket-settings-signatures"></div>
|
||||
</div>
|
||||
|
||||
<div class="table-card" style="padding:1.5rem;margin-bottom:1.5rem;">
|
||||
<h3 style="color:#0f3460;font-size:1rem;margin-bottom:0.75rem;">Postilaatikoiden näkyvyys</h3>
|
||||
<p style="color:#888;font-size:0.82rem;margin-bottom:1rem;">Poista rasti postilaatikoista joiden tikettejä et halua nähdä.</p>
|
||||
<div id="ticket-settings-mailbox-visibility"></div>
|
||||
</div>
|
||||
|
||||
<div style="display:flex;gap:0.75rem;">
|
||||
<button class="btn-primary" id="btn-save-ticket-settings">Tallenna asetukset</button>
|
||||
<button class="btn-secondary" onclick="closeTicketSettings()">Peruuta</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div><!-- /subtab-support-tickets -->
|
||||
|
||||
<!-- Sub-tab: Säännöt -->
|
||||
<div id="subtab-support-saannot" class="sub-tab-content">
|
||||
<div class="main-container">
|
||||
<div class="table-card" style="padding:1.5rem;">
|
||||
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;">
|
||||
<h3 style="color:#0f3460;margin:0;">Automaattisäännöt</h3>
|
||||
<button class="btn-primary" id="btn-add-rule" style="font-size:0.85rem;">+ Lisää sääntö</button>
|
||||
</div>
|
||||
<p style="color:#888;font-size:0.85rem;margin-bottom:1rem;">Säännöt soveltuvat automaattisesti uusiin tiketteihin haettaessa sähköposteja. Ensimmäinen täsmäävä sääntö voittaa.</p>
|
||||
<div id="rules-list"></div>
|
||||
</div>
|
||||
<!-- Sääntölomake -->
|
||||
<div id="rule-form-container" class="table-card" style="padding:1.5rem;margin-top:1rem;display:none;">
|
||||
<h4 style="color:#0f3460;margin-bottom:1rem;" id="rule-form-title">Uusi sääntö</h4>
|
||||
<input type="hidden" id="rule-form-id">
|
||||
<div class="form-grid" style="max-width:600px;">
|
||||
<div class="form-group full-width">
|
||||
<label>Säännön nimi *</label>
|
||||
<input type="text" id="rule-form-name" placeholder="esim. Sulje notifikaatiot">
|
||||
</div>
|
||||
<div class="form-group full-width" style="margin-top:0.5rem;">
|
||||
<label style="font-weight:600;color:#0f3460;">Ehdot (kaikki täytetyt pitää täsmätä)</label>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Lähettäjä sisältää</label>
|
||||
<input type="text" id="rule-form-from" placeholder="esim. noreply@">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Vastaanottaja sisältää</label>
|
||||
<input type="text" id="rule-form-to" placeholder="esim. abuse@ tai laskutus@">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Otsikko sisältää</label>
|
||||
<input type="text" id="rule-form-subject" placeholder="esim. saatavuuskysely">
|
||||
</div>
|
||||
<div class="form-group full-width" style="margin-top:0.5rem;">
|
||||
<label style="font-weight:600;color:#0f3460;">Toimenpiteet</label>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Aseta tila</label>
|
||||
<select id="rule-form-status">
|
||||
<option value="">Ei muuteta</option>
|
||||
<option value="suljettu">Suljettu</option>
|
||||
<option value="kasittelyssa">Käsittelyssä</option>
|
||||
<option value="ratkaistu">Ratkaistu</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Aseta tyyppi</label>
|
||||
<select id="rule-form-type">
|
||||
<option value="">Ei muuteta</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Aseta prioriteetti</label>
|
||||
<select id="rule-form-priority">
|
||||
<option value="">Ei muuteta</option>
|
||||
<option value="normaali">Normaali</option>
|
||||
<option value="tärkeä">Tärkeä</option>
|
||||
<option value="urgent">Kiireellinen</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Aseta tagit (pilkulla eroteltuna)</label>
|
||||
<input type="text" id="rule-form-tags" placeholder="esim. notification, automaatti">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label>Auto-close (päivää)</label>
|
||||
<input type="number" id="rule-form-autoclose" min="0" max="365" placeholder="esim. 7" style="max-width:120px;">
|
||||
</div>
|
||||
</div>
|
||||
<div style="display:flex;gap:0.5rem;margin-top:1rem;">
|
||||
<button class="btn-primary" id="btn-save-rule">Tallenna</button>
|
||||
<button class="btn-secondary" id="btn-cancel-rule">Peruuta</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Tikettityyppien hallinta -->
|
||||
<div class="table-card" style="padding:1.5rem;margin-top:1rem;">
|
||||
<h4 style="color:#0f3460;margin-bottom:0.5rem;">Tikettityypit</h4>
|
||||
<p style="color:#888;font-size:0.85rem;margin-bottom:1rem;">Hallitse yrityksen tikettityyppejä. Käytössä olevia tyyppejä ei voi poistaa.</p>
|
||||
<div id="ticket-types-list"></div>
|
||||
<div style="display:flex;gap:0.5rem;margin-top:0.75rem;align-items:center;">
|
||||
<input type="text" id="new-ticket-type-value" placeholder="tunnus (esim. myynti)" style="max-width:160px;">
|
||||
<input type="text" id="new-ticket-type-label" placeholder="Nimi (esim. Myynti)" style="max-width:160px;">
|
||||
<button class="btn-primary" id="btn-add-ticket-type" style="font-size:0.85rem;">+ Lisää</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /subtab-support-saannot -->
|
||||
|
||||
<!-- Sub-tab: Vastauspohjat -->
|
||||
<div id="subtab-support-vastauspohjat" class="sub-tab-content">
|
||||
<div class="main-container">
|
||||
<div class="table-card" style="padding:1.5rem;">
|
||||
<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;">
|
||||
<h3 style="color:#0f3460;margin:0;">Vastauspohjat</h3>
|
||||
<button class="btn-primary" id="btn-add-tpl" style="font-size:0.85rem;">+ Lisää pohja</button>
|
||||
</div>
|
||||
<p style="color:#888;font-size:0.85rem;margin-bottom:1rem;">Yrityksen yhteiset vastauspohjat tiketteihin. Valittavissa vastauslomakkeen valikosta kaikille käyttäjille.</p>
|
||||
<div id="tpl-list"></div>
|
||||
</div>
|
||||
<!-- Pohjanlomake -->
|
||||
<div id="tpl-form-container" class="table-card" style="padding:1.5rem;margin-top:1rem;display:none;">
|
||||
<h4 style="color:#0f3460;margin-bottom:1rem;" id="tpl-form-title">Uusi vastauspohja</h4>
|
||||
<input type="hidden" id="tpl-form-id">
|
||||
<div class="form-grid" style="max-width:600px;">
|
||||
<div class="form-group full-width">
|
||||
<label>Nimi *</label>
|
||||
<input type="text" id="tpl-form-name" placeholder="esim. Kuittaus vastaanotettu">
|
||||
</div>
|
||||
<div class="form-group full-width">
|
||||
<label>Sisältö *</label>
|
||||
<textarea id="tpl-form-body" rows="6" placeholder="Kiitos viestistäsi! Olemme vastaanottaneet asiasi ja palaamme siihen mahdollisimman pian."></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display:flex;gap:0.5rem;margin-top:1rem;">
|
||||
<button class="btn-primary" id="btn-save-tpl">Tallenna</button>
|
||||
<button class="btn-secondary" id="btn-cancel-tpl">Peruuta</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /subtab-support-vastauspohjat -->
|
||||
|
||||
<!-- Sub-tab: Asetukset -->
|
||||
<div id="subtab-support-asetukset" class="sub-tab-content">
|
||||
<div class="main-container">
|
||||
<div class="table-card" style="padding:1.5rem;margin-bottom:1.5rem;">
|
||||
<h3 style="color:#0f3460;font-size:1rem;margin-bottom:0.75rem;">Sähköpostiallekirjoitukset</h3>
|
||||
<p style="color:#888;font-size:0.82rem;margin-bottom:1rem;">Allekirjoitus liitetään automaattisesti sähköpostivastausten loppuun.</p>
|
||||
<div id="ticket-settings-signatures"></div>
|
||||
</div>
|
||||
|
||||
<div class="table-card" style="padding:1.5rem;margin-bottom:1.5rem;">
|
||||
<h3 style="color:#0f3460;font-size:1rem;margin-bottom:0.75rem;">Postilaatikoiden näkyvyys</h3>
|
||||
<p style="color:#888;font-size:0.82rem;margin-bottom:1rem;">Poista rasti postilaatikoista joiden tikettejä et halua nähdä.</p>
|
||||
<div id="ticket-settings-mailbox-visibility"></div>
|
||||
</div>
|
||||
|
||||
<div style="display:flex;gap:0.75rem;">
|
||||
<button class="btn-primary" id="btn-save-ticket-settings">Tallenna asetukset</button>
|
||||
</div>
|
||||
</div>
|
||||
</div><!-- /subtab-support-asetukset -->
|
||||
|
||||
<!-- Sub-tab: Ohjeet -->
|
||||
<div id="subtab-support-ohjeet" class="sub-tab-content">
|
||||
<div class="main-container">
|
||||
|
||||
Reference in New Issue
Block a user