Christian Krakau-Louis
381 lines
22 KiB
HTML
381 lines
22 KiB
HTML
{% extends "layouts/base.html" %}
|
|
{% from "components/ui/card.html" import card, card_header, card_title, card_description, card_content, card_footer %}
|
|
{% from "components/ui/button.html" import button %}
|
|
{% from "components/ui/alert.html" import alert, alert_title, alert_description %}
|
|
{% from "components/ui/input.html" import input, label, form_group %}
|
|
|
|
{% block title %}Settings - DMARQ{% endblock %}
|
|
|
|
{% block page_title %}Settings{% endblock %}
|
|
|
|
{% block content %}
|
|
<div
|
|
x-data="settingsApp()"
|
|
x-init="loadSettings()"
|
|
class="space-y-6 py-4"
|
|
>
|
|
|
|
<!-- Flash message -->
|
|
<template x-if="flashMsg">
|
|
<div :class="flashOk ? 'alert alert-success' : 'alert alert-error'" class="shadow-sm">
|
|
<span x-text="flashMsg"></span>
|
|
</div>
|
|
</template>
|
|
|
|
<!-- ── General ──────────────────────────────────────────────────────── -->
|
|
{% call card() %}
|
|
{% call card_header() %}
|
|
{% call card_title() %}General{% endcall %}
|
|
{% call card_description() %}Basic application settings{% endcall %}
|
|
{% endcall %}
|
|
{% call card_content() %}
|
|
<form @submit.prevent="saveCategory('general')" class="space-y-4">
|
|
<div class="form-control w-full">
|
|
<label class="label"><span class="label-text font-medium">Application Name</span></label>
|
|
<input type="text" x-model="s['general.app_name']"
|
|
class="input input-bordered w-full"
|
|
placeholder="DMARQ" />
|
|
<label class="label"><span class="label-text-alt text-muted-foreground">Display name shown in the navigation bar and page titles</span></label>
|
|
</div>
|
|
<div class="form-control w-full">
|
|
<label class="label"><span class="label-text font-medium">Base URL</span></label>
|
|
<input type="url" x-model="s['general.base_url']"
|
|
class="input input-bordered w-full"
|
|
placeholder="https://dmarc.example.com" />
|
|
<label class="label"><span class="label-text-alt text-muted-foreground">Public URL used in OAuth2 redirect URIs and email links</span></label>
|
|
</div>
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
<div class="form-control w-full">
|
|
<label class="label"><span class="label-text font-medium">Reports Per Page</span></label>
|
|
<input type="number" x-model.number="s['general.reports_per_page']"
|
|
class="input input-bordered w-full" min="5" max="200" />
|
|
<label class="label"><span class="label-text-alt text-muted-foreground">How many reports are shown per page</span></label>
|
|
</div>
|
|
<div class="form-control w-full">
|
|
<label class="label"><span class="label-text font-medium">Session Lifetime (minutes)</span></label>
|
|
<input type="number" x-model.number="s['general.session_lifetime_minutes']"
|
|
class="input input-bordered w-full" min="5" />
|
|
<label class="label"><span class="label-text-alt text-muted-foreground">How long login sessions remain valid</span></label>
|
|
</div>
|
|
</div>
|
|
<div class="flex justify-end">
|
|
<button type="submit" class="btn btn-default btn-md" :disabled="saving">
|
|
<template x-if="!saving">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-2"><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"></path><polyline points="17 21 17 13 7 13 7 21"></polyline><polyline points="7 3 7 8 15 8"></polyline></svg>
|
|
</template>
|
|
<template x-if="saving"><span class="loading loading-spinner loading-xs mr-2"></span></template>
|
|
Save General Settings
|
|
</button>
|
|
</div>
|
|
</form>
|
|
{% endcall %}
|
|
{% endcall %}
|
|
|
|
<!-- ── DMARC Policy Defaults ─────────────────────────────────────────── -->
|
|
{% call card() %}
|
|
{% call card_header() %}
|
|
{% call card_title() %}DMARC Policy Defaults{% endcall %}
|
|
{% call card_description() %}Default values applied when adding a new domain{% endcall %}
|
|
{% endcall %}
|
|
{% call card_content() %}
|
|
<form @submit.prevent="saveCategory('dmarc')" class="space-y-4">
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
<div class="form-control w-full">
|
|
<label class="label"><span class="label-text font-medium">Default Policy</span></label>
|
|
<select x-model="s['dmarc.default_policy']" class="input input-bordered w-full">
|
|
<option value="none">None (monitoring only)</option>
|
|
<option value="quarantine">Quarantine (send to spam)</option>
|
|
<option value="reject">Reject (block delivery)</option>
|
|
</select>
|
|
</div>
|
|
<div class="form-control w-full">
|
|
<label class="label">
|
|
<span class="label-text font-medium">Default Percentage</span>
|
|
<span class="label-text-alt" x-text="(s['dmarc.default_percentage'] || 100) + '%'"></span>
|
|
</label>
|
|
<input type="range" x-model.number="s['dmarc.default_percentage']"
|
|
min="0" max="100"
|
|
class="range range-primary w-full" />
|
|
<label class="label"><span class="label-text-alt text-muted-foreground">Percentage of messages to which the policy is applied (pct tag)</span></label>
|
|
</div>
|
|
</div>
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
<div class="form-control w-full">
|
|
<label class="label"><span class="label-text font-medium">DKIM Alignment (adkim)</span></label>
|
|
<select x-model="s['dmarc.default_adkim']" class="input input-bordered w-full">
|
|
<option value="r">Relaxed</option>
|
|
<option value="s">Strict</option>
|
|
</select>
|
|
</div>
|
|
<div class="form-control w-full">
|
|
<label class="label"><span class="label-text font-medium">SPF Alignment (aspf)</span></label>
|
|
<select x-model="s['dmarc.default_aspf']" class="input input-bordered w-full">
|
|
<option value="r">Relaxed</option>
|
|
<option value="s">Strict</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="flex justify-end">
|
|
<button type="submit" class="btn btn-default btn-md" :disabled="saving">
|
|
<template x-if="!saving">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-2"><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"></path><polyline points="17 21 17 13 7 13 7 21"></polyline><polyline points="7 3 7 8 15 8"></polyline></svg>
|
|
</template>
|
|
<template x-if="saving"><span class="loading loading-spinner loading-xs mr-2"></span></template>
|
|
Save DMARC Defaults
|
|
</button>
|
|
</div>
|
|
</form>
|
|
{% endcall %}
|
|
{% endcall %}
|
|
|
|
<!-- ── DNS Resolver ──────────────────────────────────────────────────── -->
|
|
{% call card() %}
|
|
{% call card_header() %}
|
|
{% call card_title() %}DNS Resolver{% endcall %}
|
|
{% call card_description() %}Choose how DMARQ resolves DNS records for domain lookups{% endcall %}
|
|
{% endcall %}
|
|
{% call card_content() %}
|
|
<form @submit.prevent="saveCategory('dns')" class="space-y-4">
|
|
<div class="form-control w-full">
|
|
<label class="label"><span class="label-text font-medium">DNS Resolver</span></label>
|
|
<select x-model="s['dns.resolver']" class="input input-bordered w-full">
|
|
<option value="system">System (OS default)</option>
|
|
<option value="cloudflare">Cloudflare DoH (1.1.1.1)</option>
|
|
</select>
|
|
<label class="label"><span class="label-text-alt text-muted-foreground">System resolver uses the OS-configured DNS server; Cloudflare uses DNS-over-HTTPS</span></label>
|
|
</div>
|
|
<div class="flex justify-end">
|
|
<button type="submit" class="btn btn-default btn-md" :disabled="saving">
|
|
<template x-if="!saving">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-2"><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"></path><polyline points="17 21 17 13 7 13 7 21"></polyline><polyline points="7 3 7 8 15 8"></polyline></svg>
|
|
</template>
|
|
<template x-if="saving"><span class="loading loading-spinner loading-xs mr-2"></span></template>
|
|
Save DNS Settings
|
|
</button>
|
|
</div>
|
|
</form>
|
|
{% endcall %}
|
|
{% endcall %}
|
|
|
|
<!-- ── Cloudflare Integration ─────────────────────────────────────────── -->
|
|
{% call card() %}
|
|
{% call card_header() %}
|
|
{% call card_title() %}Cloudflare Integration{% endcall %}
|
|
{% call card_description() %}
|
|
Provide a Cloudflare API token and Zone ID to enable automated DNS record management and DoH lookups.
|
|
Obtain your token from <a href="https://dash.cloudflare.com/profile/api-tokens" target="_blank" class="underline">Cloudflare API Tokens</a>.
|
|
{% endcall %}
|
|
{% endcall %}
|
|
{% call card_content() %}
|
|
<form @submit.prevent="saveCategory('cloudflare')" class="space-y-4">
|
|
<div class="form-control w-full">
|
|
<label class="label"><span class="label-text font-medium">API Token</span></label>
|
|
<div class="relative">
|
|
<input :type="showCfToken ? 'text' : 'password'"
|
|
x-model="s['cloudflare.api_token']"
|
|
class="input input-bordered w-full pr-10"
|
|
placeholder="Your Cloudflare API token" />
|
|
<button type="button"
|
|
class="absolute right-2 top-3 text-muted-foreground hover:text-foreground"
|
|
@click="showCfToken = !showCfToken">
|
|
<svg x-show="!showCfToken" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path><circle cx="12" cy="12" r="3"></circle></svg>
|
|
<svg x-show="showCfToken" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"></path><line x1="1" y1="1" x2="23" y2="23"></line></svg>
|
|
</button>
|
|
</div>
|
|
<label class="label"><span class="label-text-alt text-muted-foreground">Stored securely; leave as-is to keep existing token</span></label>
|
|
</div>
|
|
<div class="form-control w-full">
|
|
<label class="label"><span class="label-text font-medium">Zone ID</span></label>
|
|
<input type="text" x-model="s['cloudflare.zone_id']"
|
|
class="input input-bordered w-full"
|
|
placeholder="xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx" />
|
|
<label class="label"><span class="label-text-alt text-muted-foreground">Found on the Cloudflare dashboard overview for your domain</span></label>
|
|
</div>
|
|
<div class="flex justify-end">
|
|
<button type="submit" class="btn btn-default btn-md" :disabled="saving">
|
|
<template x-if="!saving">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-2"><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"></path><polyline points="17 21 17 13 7 13 7 21"></polyline><polyline points="7 3 7 8 15 8"></polyline></svg>
|
|
</template>
|
|
<template x-if="saving"><span class="loading loading-spinner loading-xs mr-2"></span></template>
|
|
Save Cloudflare Settings
|
|
</button>
|
|
</div>
|
|
</form>
|
|
{% endcall %}
|
|
{% endcall %}
|
|
|
|
<!-- ── Notifications ──────────────────────────────────────────────────── -->
|
|
{% call card() %}
|
|
{% call card_header() %}
|
|
{% call card_title() %}Notifications{% endcall %}
|
|
{% call card_description() %}Send alerts through Apprise-compatible targets{% endcall %}
|
|
{% endcall %}
|
|
{% call card_content() %}
|
|
<form @submit.prevent="saveCategory('notifications')" class="space-y-4">
|
|
<div class="form-control">
|
|
<label class="label cursor-pointer justify-start gap-3">
|
|
<input type="checkbox"
|
|
:checked="s['notifications.apprise_enabled'] === 'true'"
|
|
@change="s['notifications.apprise_enabled'] = $event.target.checked ? 'true' : 'false'"
|
|
class="checkbox checkbox-primary" />
|
|
<span class="label-text font-medium">Enable notifications</span>
|
|
</label>
|
|
</div>
|
|
|
|
<template x-if="s['notifications.apprise_enabled'] === 'true'">
|
|
<div class="space-y-4">
|
|
<div class="form-control w-full">
|
|
<label class="label"><span class="label-text font-medium">Apprise Target URLs</span></label>
|
|
<textarea x-model="s['notifications.apprise_urls']"
|
|
class="textarea textarea-bordered w-full min-h-32 font-mono text-sm"
|
|
placeholder="mailto://user:password@example.com slack://token-a/token-b/token-c/channel"></textarea>
|
|
<label class="label"><span class="label-text-alt text-muted-foreground">One target per line. Values are redacted after saving.</span></label>
|
|
</div>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<div class="flex flex-col sm:flex-row justify-end gap-2">
|
|
<button type="button" class="btn btn-outline btn-md" :disabled="saving || testingNotification" @click="sendTestNotification()">
|
|
<template x-if="!testingNotification">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none"
|
|
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-2">
|
|
<path d="m22 2-7 20-4-9-9-4Z"></path>
|
|
<path d="M22 2 11 13"></path>
|
|
</svg>
|
|
</template>
|
|
<template x-if="testingNotification"><span class="loading loading-spinner loading-xs mr-2"></span></template>
|
|
Send Test
|
|
</button>
|
|
<button type="submit" class="btn btn-default btn-md" :disabled="saving">
|
|
<template x-if="!saving">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-2"><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"></path><polyline points="17 21 17 13 7 13 7 21"></polyline><polyline points="7 3 7 8 15 8"></polyline></svg>
|
|
</template>
|
|
<template x-if="saving"><span class="loading loading-spinner loading-xs mr-2"></span></template>
|
|
Save Notification Settings
|
|
</button>
|
|
</div>
|
|
</form>
|
|
{% endcall %}
|
|
{% endcall %}
|
|
|
|
<!-- ── Mail Sources shortcut ──────────────────────────────────────────── -->
|
|
{% call card() %}
|
|
{% call card_header() %}
|
|
{% call card_title() %}Mail Sources{% endcall %}
|
|
{% call card_description() %}
|
|
IMAP, POP3 and Gmail API inbox credentials are managed on the dedicated
|
|
<strong>Mail Sources</strong> page.
|
|
{% endcall %}
|
|
{% endcall %}
|
|
{% call card_content() %}
|
|
<a href="/mail-sources" class="btn btn-default btn-md">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none"
|
|
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="mr-2">
|
|
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
|
|
<polyline points="22,6 12,13 2,6"></polyline>
|
|
</svg>
|
|
Manage Mail Sources
|
|
</a>
|
|
{% endcall %}
|
|
{% endcall %}
|
|
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block scripts %}
|
|
<script>
|
|
function settingsApp() {
|
|
return {
|
|
s: {}, // flat map of key → value (strings)
|
|
saving: false,
|
|
flashMsg: '',
|
|
flashOk: true,
|
|
testingNotification: false,
|
|
showCfToken: false,
|
|
|
|
// Session cookie is sent automatically by the browser (httpOnly, same-origin).
|
|
// No manual auth header needed for API calls from the UI.
|
|
apiHeaders() {
|
|
return { 'Content-Type': 'application/json' };
|
|
},
|
|
|
|
async loadSettings() {
|
|
try {
|
|
const res = await fetch('/api/v1/settings', { headers: this.apiHeaders() });
|
|
if (res.status === 401 || res.status === 403) {
|
|
window.location.href = '/login?next=/settings';
|
|
return;
|
|
}
|
|
if (!res.ok) {
|
|
this.showFlash('Failed to load settings: ' + res.statusText, false);
|
|
return;
|
|
}
|
|
const rows = await res.json();
|
|
const map = {};
|
|
rows.forEach(r => { map[r.key] = r.value ?? ''; });
|
|
this.s = map;
|
|
} catch (err) {
|
|
this.showFlash('Error loading settings: ' + err.message, false);
|
|
}
|
|
},
|
|
|
|
async saveCategory(category) {
|
|
this.saving = true;
|
|
// Collect all keys that belong to this category
|
|
const categoryKeys = Object.keys(this.s).filter(k => k.startsWith(category + '.'));
|
|
const settings = {};
|
|
categoryKeys.forEach(k => { settings[k] = String(this.s[k] ?? ''); });
|
|
try {
|
|
const res = await fetch('/api/v1/settings/bulk', {
|
|
method: 'POST',
|
|
headers: this.apiHeaders(),
|
|
body: JSON.stringify({ settings }),
|
|
});
|
|
if (!res.ok) {
|
|
const data = await res.json().catch(() => ({}));
|
|
this.showFlash('Save failed: ' + (data.detail || res.statusText), false);
|
|
} else {
|
|
const rows = await res.json();
|
|
rows.forEach(r => { this.s[r.key] = r.value ?? ''; });
|
|
this.showFlash('Settings saved successfully.', true);
|
|
}
|
|
} catch (err) {
|
|
this.showFlash('Error saving settings: ' + err.message, false);
|
|
} finally {
|
|
this.saving = false;
|
|
}
|
|
},
|
|
|
|
async sendTestNotification() {
|
|
this.testingNotification = true;
|
|
try {
|
|
await this.saveCategory('notifications');
|
|
const res = await fetch('/api/v1/settings/notifications/test', {
|
|
method: 'POST',
|
|
headers: this.apiHeaders(),
|
|
});
|
|
const data = await res.json().catch(() => ({}));
|
|
if (!res.ok) {
|
|
const detail = data.detail || {};
|
|
this.showFlash('Test failed: ' + (detail.message || data.detail || res.statusText), false);
|
|
} else {
|
|
this.showFlash('Test notification sent.', true);
|
|
}
|
|
} catch (err) {
|
|
this.showFlash('Error sending test notification: ' + err.message, false);
|
|
} finally {
|
|
this.testingNotification = false;
|
|
}
|
|
},
|
|
|
|
showFlash(msg, ok) {
|
|
this.flashMsg = msg;
|
|
this.flashOk = ok;
|
|
setTimeout(() => { this.flashMsg = ''; }, 4000);
|
|
},
|
|
};
|
|
}
|
|
</script>
|
|
{% endblock %}
|