Yhdistä IMAP/SMTP-asetukset vierekkäin + "Käytä samoja tunnuksia"

Mailbox-lomake näyttää nyt Saapuva (IMAP) ja Lähtevä (SMTP)
vierekkäin. SMTP-puolella on "Käytä samoja tunnuksia kuin
saapuvassa" -checkbox (oletuksena päällä), joka piilottaa
SMTP-kentät ja kopioi IMAP-asetukset tallennettaessa.
Lähettäjän sähköposti ja nimi omana osionaan alhaalla.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-10 22:50:45 +02:00
parent 78f25d0079
commit eaf47d5b78
2 changed files with 87 additions and 69 deletions

View File

@@ -798,68 +798,63 @@
<div id="mailbox-form-container" style="display:none;margin-top:1rem;padding:1rem;background:#f8f9fb;border-radius:8px;"> <div id="mailbox-form-container" style="display:none;margin-top:1rem;padding:1rem;background:#f8f9fb;border-radius:8px;">
<h4 style="color:#0f3460;margin-bottom:0.75rem;" id="mailbox-form-title">Uusi postilaatikko</h4> <h4 style="color:#0f3460;margin-bottom:0.75rem;" id="mailbox-form-title">Uusi postilaatikko</h4>
<input type="hidden" id="mailbox-form-id"> <input type="hidden" id="mailbox-form-id">
<div class="form-grid" style="max-width:600px;"> <div style="max-width:700px;">
<div class="form-group full-width"> <div class="form-grid">
<label>Nimi (näkyy tikettilistassa) *</label> <div class="form-group full-width">
<input type="text" id="mailbox-form-nimi" placeholder="esim. Asiakaspalvelu"> <label>Nimi (näkyy tikettilistassa) *</label>
<input type="text" id="mailbox-form-nimi" placeholder="esim. Asiakaspalvelu">
</div>
</div> </div>
<div class="form-group"> <!-- Saapuva + Lähtevä vierekkäin -->
<label>IMAP-palvelin</label> <div style="display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:0.5rem;">
<input type="text" id="mailbox-form-host" placeholder="mail.example.com"> <!-- Saapuva posti (IMAP) -->
<div>
<h4 style="color:#0f3460;font-size:0.9rem;margin:0 0 0.5rem;">Saapuva posti (IMAP)</h4>
<div class="form-group"><label>Palvelin</label><input type="text" id="mailbox-form-host" placeholder="mail.example.com"></div>
<div class="form-group"><label>Portti</label><input type="number" id="mailbox-form-port" value="993" placeholder="993"></div>
<div class="form-group"><label>Käyttäjätunnus</label><input type="text" id="mailbox-form-user" placeholder="asiakaspalvelu@yritys.fi"></div>
<div class="form-group"><label>Salasana</label><input type="password" id="mailbox-form-password" placeholder="••••••••"></div>
<div class="form-group"><label>Salaus</label>
<select id="mailbox-form-encryption">
<option value="ssl">SSL</option>
<option value="tls">TLS</option>
<option value="notls">Ei salausta</option>
</select>
</div>
</div>
<!-- Lähtevä posti (SMTP) -->
<div>
<h4 style="color:#0f3460;font-size:0.9rem;margin:0 0 0.5rem;">Lähtevä posti (SMTP)</h4>
<div class="form-group">
<label style="display:flex;align-items:center;gap:0.4rem;cursor:pointer;">
<input type="checkbox" id="mailbox-form-smtp-same" checked> Käytä samoja tunnuksia kuin saapuvassa
</label>
</div>
<div id="smtp-custom-fields">
<div class="form-group"><label>Palvelin</label><input type="text" id="mailbox-form-smtp-host" placeholder="mail.yritys.fi"></div>
<div class="form-group"><label>Portti</label><input type="number" id="mailbox-form-smtp-port" value="587" placeholder="587"></div>
<div class="form-group"><label>Käyttäjätunnus</label><input type="text" id="mailbox-form-smtp-user" placeholder="asiakaspalvelu@yritys.fi"></div>
<div class="form-group"><label>Salasana</label><input type="password" id="mailbox-form-smtp-pass" placeholder="••••••••"></div>
<div class="form-group"><label>Salaus</label>
<select id="mailbox-form-smtp-encryption">
<option value="tls">STARTTLS</option>
<option value="ssl">SSL</option>
<option value="none">Ei salausta</option>
</select>
</div>
</div>
</div>
</div> </div>
<div class="form-group"> <!-- Lähettäjätiedot -->
<label>Portti</label> <div class="form-grid" style="margin-top:0.75rem;">
<input type="number" id="mailbox-form-port" value="993" placeholder="993"> <div class="form-group">
</div> <label>Lähettäjän sähköposti</label>
<div class="form-group"> <input type="text" id="mailbox-form-smtp-email" placeholder="asiakaspalvelu@yritys.fi">
<label>Käyttäjätunnus</label> </div>
<input type="text" id="mailbox-form-user" placeholder="asiakaspalvelu@yritys.fi"> <div class="form-group">
</div> <label>Lähettäjän nimi</label>
<div class="form-group"> <input type="text" id="mailbox-form-smtp-name" placeholder="Yritys Asiakaspalvelu">
<label>Salasana</label> </div>
<input type="password" id="mailbox-form-password" placeholder="••••••••">
</div>
<div class="form-group">
<label>Salaus</label>
<select id="mailbox-form-encryption">
<option value="ssl">SSL</option>
<option value="tls">TLS</option>
<option value="notls">Ei salausta</option>
</select>
</div>
<div class="form-group">
<label>Lähettäjän sähköposti</label>
<input type="text" id="mailbox-form-smtp-email" placeholder="asiakaspalvelu@yritys.fi">
</div>
<div class="form-group">
<label>Lähettäjän nimi</label>
<input type="text" id="mailbox-form-smtp-name" placeholder="Yritys Asiakaspalvelu">
</div>
<h4 style="margin:1rem 0 0.5rem;color:#0f3460;font-size:0.9rem;">SMTP-lähetysasetukset</h4>
<p style="font-size:0.78rem;color:#888;margin-bottom:0.5rem;">Jätä tyhjäksi käyttääksesi palvelimen omaa sendmailia</p>
<div class="form-group">
<label>SMTP-palvelin</label>
<input type="text" id="mailbox-form-smtp-host" placeholder="mail.yritys.fi">
</div>
<div class="form-group">
<label>SMTP-portti</label>
<input type="number" id="mailbox-form-smtp-port" value="587" placeholder="587">
</div>
<div class="form-group">
<label>SMTP-käyttäjä</label>
<input type="text" id="mailbox-form-smtp-user" placeholder="asiakaspalvelu@yritys.fi">
</div>
<div class="form-group">
<label>SMTP-salasana</label>
<input type="password" id="mailbox-form-smtp-pass" placeholder="••••••••">
</div>
<div class="form-group">
<label>SMTP-salaus</label>
<select id="mailbox-form-smtp-encryption">
<option value="tls">STARTTLS</option>
<option value="ssl">SSL</option>
<option value="none">Ei salausta</option>
</select>
</div> </div>
</div> </div>
<div style="display:flex;gap:0.5rem;margin-top:0.75rem;"> <div style="display:flex;gap:0.5rem;margin-top:0.75rem;">

View File

@@ -2532,9 +2532,24 @@ function showMailboxForm(mb = null) {
document.getElementById('mailbox-form-smtp-user').value = mb ? (mb.smtp_user || '') : ''; document.getElementById('mailbox-form-smtp-user').value = mb ? (mb.smtp_user || '') : '';
document.getElementById('mailbox-form-smtp-pass').value = mb ? (mb.smtp_password || '') : ''; document.getElementById('mailbox-form-smtp-pass').value = mb ? (mb.smtp_password || '') : '';
document.getElementById('mailbox-form-smtp-encryption').value = mb ? (mb.smtp_encryption || 'tls') : 'tls'; document.getElementById('mailbox-form-smtp-encryption').value = mb ? (mb.smtp_encryption || 'tls') : 'tls';
// "Käytä samoja tunnuksia" — oletuksena päällä uudelle, olemassa olevalle tarkistetaan
const sameCheck = document.getElementById('mailbox-form-smtp-same');
if (mb) {
// Jos SMTP-host on tyhjä tai sama kuin IMAP -> samoja tunnuksia
const smtpIsSame = !mb.smtp_host || mb.smtp_host === mb.imap_host;
sameCheck.checked = smtpIsSame;
} else {
sameCheck.checked = true;
}
toggleSmtpFields();
document.getElementById('mailbox-form-container').style.display = ''; document.getElementById('mailbox-form-container').style.display = '';
} }
function toggleSmtpFields() {
const same = document.getElementById('mailbox-form-smtp-same').checked;
document.getElementById('smtp-custom-fields').style.display = same ? 'none' : '';
}
function editMailbox(id) { function editMailbox(id) {
const mb = mailboxesData.find(m => m.id === id); const mb = mailboxesData.find(m => m.id === id);
if (mb) showMailboxForm(mb); if (mb) showMailboxForm(mb);
@@ -2548,22 +2563,30 @@ async function deleteMailbox(id, nimi) {
} catch (e) { alert(e.message); } } catch (e) { alert(e.message); }
} }
// SMTP "Käytä samoja tunnuksia" -checkbox toggle
document.getElementById('mailbox-form-smtp-same').addEventListener('change', toggleSmtpFields);
document.getElementById('btn-save-mailbox').addEventListener('click', async () => { document.getElementById('btn-save-mailbox').addEventListener('click', async () => {
const useSame = document.getElementById('mailbox-form-smtp-same').checked;
const imapHost = document.getElementById('mailbox-form-host').value;
const imapUser = document.getElementById('mailbox-form-user').value;
const imapPass = document.getElementById('mailbox-form-password').value;
const imapEnc = document.getElementById('mailbox-form-encryption').value;
const data = { const data = {
id: document.getElementById('mailbox-form-id').value || undefined, id: document.getElementById('mailbox-form-id').value || undefined,
nimi: document.getElementById('mailbox-form-nimi').value, nimi: document.getElementById('mailbox-form-nimi').value,
imap_host: document.getElementById('mailbox-form-host').value, imap_host: imapHost,
imap_port: parseInt(document.getElementById('mailbox-form-port').value) || 993, imap_port: parseInt(document.getElementById('mailbox-form-port').value) || 993,
imap_user: document.getElementById('mailbox-form-user').value, imap_user: imapUser,
imap_password: document.getElementById('mailbox-form-password').value, imap_password: imapPass,
imap_encryption: document.getElementById('mailbox-form-encryption').value, imap_encryption: imapEnc,
smtp_from_email: document.getElementById('mailbox-form-smtp-email').value, smtp_from_email: document.getElementById('mailbox-form-smtp-email').value,
smtp_from_name: document.getElementById('mailbox-form-smtp-name').value, smtp_from_name: document.getElementById('mailbox-form-smtp-name').value,
smtp_host: document.getElementById('mailbox-form-smtp-host').value, smtp_host: useSame ? imapHost : document.getElementById('mailbox-form-smtp-host').value,
smtp_port: parseInt(document.getElementById('mailbox-form-smtp-port').value) || 587, smtp_port: useSame ? 587 : (parseInt(document.getElementById('mailbox-form-smtp-port').value) || 587),
smtp_user: document.getElementById('mailbox-form-smtp-user').value, smtp_user: useSame ? imapUser : document.getElementById('mailbox-form-smtp-user').value,
smtp_password: document.getElementById('mailbox-form-smtp-pass').value, smtp_password: useSame ? imapPass : document.getElementById('mailbox-form-smtp-pass').value,
smtp_encryption: document.getElementById('mailbox-form-smtp-encryption').value, smtp_encryption: useSame ? 'tls' : document.getElementById('mailbox-form-smtp-encryption').value,
aktiivinen: true, aktiivinen: true,
}; };
try { try {