"feat: Implement printer management
This commit is contained in:
@@ -416,6 +416,12 @@
|
||||
</svg>
|
||||
Logs
|
||||
</a>
|
||||
<a href="{{ url_for('admin_page', tab='ssl') }}" class="tab-modern {{ 'active' if active_tab == 'ssl' else '' }}">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" />
|
||||
</svg>
|
||||
SSL
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Tab Content -->
|
||||
@@ -658,11 +664,270 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<!-- SSL Tab -->
|
||||
{% if active_tab == 'ssl' %}
|
||||
<div class="content-card-modern">
|
||||
<div class="flex flex-col md:flex-row md:justify-between md:items-center mb-8 gap-4">
|
||||
<h3 class="text-3xl font-bold text-slate-900 dark:text-white">SSL-Zertifikatsverwaltung</h3>
|
||||
<button onclick="loadSSLInfo()" class="btn-modern">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"/>
|
||||
</svg>
|
||||
Aktualisieren
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
|
||||
<!-- Zertifikatsinformationen -->
|
||||
<div class="form-modern">
|
||||
<h4 class="text-xl font-semibold text-slate-900 dark:text-white mb-6">Aktuelles Zertifikat</h4>
|
||||
<div id="ssl-info-container">
|
||||
<div class="text-center py-8">
|
||||
<div class="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600 mx-auto"></div>
|
||||
<p class="mt-2 text-slate-600 dark:text-slate-400">Lade Zertifikatsinformationen...</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- SSL-Aktionen -->
|
||||
<div class="form-modern">
|
||||
<h4 class="text-xl font-semibold text-slate-900 dark:text-white mb-6">Zertifikatsverwaltung</h4>
|
||||
<div class="space-y-4">
|
||||
<button onclick="generateSSLCertificate()" class="btn-modern w-full justify-center">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6" />
|
||||
</svg>
|
||||
Neues Zertifikat generieren
|
||||
</button>
|
||||
|
||||
<button onclick="installSSLCertificate()" class="btn-success-modern w-full justify-center">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4" />
|
||||
</svg>
|
||||
Im System installieren
|
||||
</button>
|
||||
|
||||
<button onclick="copyToRaspberry()" class="btn-modern w-full justify-center">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" />
|
||||
</svg>
|
||||
Auf Raspberry Pi kopieren
|
||||
</button>
|
||||
|
||||
<button onclick="validateSSLCertificate()" class="btn-modern w-full justify-center">
|
||||
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
Zertifikat validieren
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Erweiterte Optionen -->
|
||||
<div class="form-modern mt-8">
|
||||
<h4 class="text-xl font-semibold text-slate-900 dark:text-white mb-6">Erweiterte Optionen</h4>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div>
|
||||
<label for="ssl-key-size" class="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-2">Schlüsselgröße (Bits)</label>
|
||||
<select id="ssl-key-size" class="input-modern w-full">
|
||||
<option value="2048">2048 Bit</option>
|
||||
<option value="4096" selected>4096 Bit (Empfohlen)</option>
|
||||
<option value="8192">8192 Bit</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label for="ssl-validity" class="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-2">Gültigkeitsdauer (Tage)</label>
|
||||
<input type="number" id="ssl-validity" value="365" min="30" max="3650" class="input-modern w-full">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<!-- Weitere Tabs können hier hinzugefügt werden -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// SSL-Verwaltungsfunktionen
|
||||
async function loadSSLInfo() {
|
||||
const container = document.getElementById('ssl-info-container');
|
||||
container.innerHTML = `
|
||||
<div class="text-center py-8">
|
||||
<div class="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600 mx-auto"></div>
|
||||
<p class="mt-2 text-slate-600 dark:text-slate-400">Lade Zertifikatsinformationen...</p>
|
||||
</div>
|
||||
`;
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/ssl/info');
|
||||
const data = await response.json();
|
||||
|
||||
if (data.exists) {
|
||||
const cert = data.certificate;
|
||||
const isExpired = cert.is_expired;
|
||||
const daysUntilExpiry = cert.days_until_expiry;
|
||||
|
||||
container.innerHTML = `
|
||||
<div class="space-y-4">
|
||||
<div class="flex items-center justify-between p-4 bg-white dark:bg-slate-700 rounded-lg">
|
||||
<span class="font-medium text-slate-900 dark:text-white">Status</span>
|
||||
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium ${isExpired ? 'bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200' : daysUntilExpiry < 30 ? 'bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200' : 'bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200'}">
|
||||
${isExpired ? 'Abgelaufen' : daysUntilExpiry < 30 ? 'Läuft bald ab' : 'Gültig'}
|
||||
</span>
|
||||
</div>
|
||||
<div class="p-4 bg-white dark:bg-slate-700 rounded-lg">
|
||||
<div class="text-sm text-slate-600 dark:text-slate-400 mb-1">Gültig bis</div>
|
||||
<div class="font-medium text-slate-900 dark:text-white">${cert.not_valid_after}</div>
|
||||
</div>
|
||||
<div class="p-4 bg-white dark:bg-slate-700 rounded-lg">
|
||||
<div class="text-sm text-slate-600 dark:text-slate-400 mb-1">Verbleibende Tage</div>
|
||||
<div class="font-medium text-slate-900 dark:text-white">${daysUntilExpiry} Tage</div>
|
||||
</div>
|
||||
<div class="p-4 bg-white dark:bg-slate-700 rounded-lg">
|
||||
<div class="text-sm text-slate-600 dark:text-slate-400 mb-1">Schlüsselgröße</div>
|
||||
<div class="font-medium text-slate-900 dark:text-white">${cert.key_size || 'Unbekannt'} Bit</div>
|
||||
</div>
|
||||
<div class="p-4 bg-white dark:bg-slate-700 rounded-lg">
|
||||
<div class="text-sm text-slate-600 dark:text-slate-400 mb-1">Fingerprint (SHA256)</div>
|
||||
<div class="font-mono text-xs text-slate-900 dark:text-white break-all">${cert.fingerprint}</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
} else {
|
||||
container.innerHTML = `
|
||||
<div class="text-center py-8">
|
||||
<svg class="w-16 h-16 text-slate-400 mx-auto mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" />
|
||||
</svg>
|
||||
<p class="text-slate-600 dark:text-slate-400">Kein SSL-Zertifikat gefunden</p>
|
||||
<p class="text-sm text-slate-500 dark:text-slate-500 mt-2">Generieren Sie ein neues Zertifikat</p>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
} catch (error) {
|
||||
container.innerHTML = `
|
||||
<div class="text-center py-8">
|
||||
<svg class="w-16 h-16 text-red-400 mx-auto mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
<p class="text-red-600 dark:text-red-400">Fehler beim Laden der Zertifikatsinformationen</p>
|
||||
<p class="text-sm text-slate-500 dark:text-slate-500 mt-2">${error.message}</p>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
}
|
||||
|
||||
async function generateSSLCertificate() {
|
||||
const keySize = document.getElementById('ssl-key-size').value;
|
||||
const validity = document.getElementById('ssl-validity').value;
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/ssl/generate', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'X-CSRFToken': document.querySelector('meta[name="csrf-token"]').getAttribute('content')
|
||||
},
|
||||
body: JSON.stringify({
|
||||
key_size: parseInt(keySize),
|
||||
validity_days: parseInt(validity)
|
||||
})
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (data.success) {
|
||||
alert('SSL-Zertifikat erfolgreich generiert!');
|
||||
loadSSLInfo();
|
||||
} else {
|
||||
alert('Fehler beim Generieren des SSL-Zertifikats: ' + data.error);
|
||||
}
|
||||
} catch (error) {
|
||||
alert('Fehler beim Generieren des SSL-Zertifikats: ' + error.message);
|
||||
}
|
||||
}
|
||||
|
||||
async function installSSLCertificate() {
|
||||
try {
|
||||
const response = await fetch('/api/ssl/install', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'X-CSRFToken': document.querySelector('meta[name="csrf-token"]').getAttribute('content')
|
||||
}
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (data.success) {
|
||||
alert('SSL-Zertifikat erfolgreich im System installiert!');
|
||||
} else {
|
||||
alert('Fehler bei der Installation: ' + data.error);
|
||||
}
|
||||
} catch (error) {
|
||||
alert('Fehler bei der Installation: ' + error.message);
|
||||
}
|
||||
}
|
||||
|
||||
async function copyToRaspberry() {
|
||||
const host = prompt('Raspberry Pi Hostname:', 'raspberrypi');
|
||||
if (!host) return;
|
||||
|
||||
const user = prompt('Benutzername:', 'pi');
|
||||
if (!user) return;
|
||||
|
||||
try {
|
||||
const response = await fetch('/api/ssl/copy-raspberry', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'X-CSRFToken': document.querySelector('meta[name="csrf-token"]').getAttribute('content')
|
||||
},
|
||||
body: JSON.stringify({
|
||||
host: host,
|
||||
user: user
|
||||
})
|
||||
});
|
||||
|
||||
const data = await response.json();
|
||||
|
||||
if (data.success) {
|
||||
alert('SSL-Zertifikat erfolgreich auf Raspberry Pi kopiert!');
|
||||
} else {
|
||||
alert('Fehler beim Kopieren: ' + data.error);
|
||||
}
|
||||
} catch (error) {
|
||||
alert('Fehler beim Kopieren: ' + error.message);
|
||||
}
|
||||
}
|
||||
|
||||
async function validateSSLCertificate() {
|
||||
try {
|
||||
const response = await fetch('/api/ssl/validate');
|
||||
const data = await response.json();
|
||||
|
||||
if (data.valid) {
|
||||
alert('SSL-Zertifikat ist gültig!');
|
||||
} else {
|
||||
alert('SSL-Zertifikat ist ungültig oder läuft bald ab: ' + data.message);
|
||||
}
|
||||
} catch (error) {
|
||||
alert('Fehler bei der Validierung: ' + error.message);
|
||||
}
|
||||
}
|
||||
|
||||
// SSL-Informationen beim Laden des SSL-Tabs laden
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
if (window.location.search.includes('tab=ssl')) {
|
||||
loadSSLInfo();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block scripts %}
|
||||
|
||||
Reference in New Issue
Block a user