134 lines
4.7 KiB
HTML
134 lines
4.7 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Settings - Das File Storage{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="nav-tabs">
|
|
<a href="/dashboard" class="nav-tab">📂 My Files</a>
|
|
<a href="/settings" class="nav-tab active">⚙️ Settings</a>
|
|
{% if is_admin %}
|
|
<a href="/admin" class="nav-tab">👑 Admin Panel</a>
|
|
{% endif %}
|
|
</div>
|
|
|
|
{% if message %}
|
|
<div class="alert alert-success">
|
|
{{ message }}
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if error %}
|
|
<div class="alert alert-error">
|
|
{{ error }}
|
|
</div>
|
|
{% endif %}
|
|
|
|
<h2>Account Settings</h2>
|
|
|
|
<div style="display: grid; gap: 30px; margin-top: 30px;">
|
|
<!-- Change Password -->
|
|
<div style="border: 1px solid #e5e7eb; padding: 25px; border-radius: 8px;">
|
|
<h3 style="margin-bottom: 15px; color: #374151;">🔒 Change Password</h3>
|
|
<form method="POST" action="/settings/change-password">
|
|
<div class="form-group">
|
|
<label for="current_password">Current Password</label>
|
|
<input type="password" id="current_password" name="current_password" required>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="new_password">New Password</label>
|
|
<input type="password" id="new_password" name="new_password" required minlength="8">
|
|
<small style="color: #6b7280;">Minimum 8 characters</small>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="confirm_password">Confirm New Password</label>
|
|
<input type="password" id="confirm_password" name="confirm_password" required>
|
|
</div>
|
|
<button type="submit" class="btn btn-primary">Update Password</button>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- API Key -->
|
|
<div style="border: 1px solid #e5e7eb; padding: 25px; border-radius: 8px;">
|
|
<h3 style="margin-bottom: 15px; color: #374151;">🔑 API Key</h3>
|
|
<p style="color: #6b7280; margin-bottom: 15px;">
|
|
Use this key for API authentication with the X-API-Key header.
|
|
</p>
|
|
|
|
<div style="background: #f9fafb; padding: 15px; border-radius: 6px; margin-bottom: 15px;">
|
|
<div style="display: flex; gap: 10px; align-items: center;">
|
|
<input
|
|
type="text"
|
|
id="apiKey"
|
|
value="{{ api_key }}"
|
|
readonly
|
|
style="flex: 1; padding: 10px; border: 1px solid #d1d5db; border-radius: 4px; font-family: monospace; font-size: 12px;"
|
|
>
|
|
<button onclick="copyApiKey()" class="btn btn-secondary btn-small">📋 Copy</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="alert alert-info" style="margin-bottom: 15px;">
|
|
<strong>⚠️ Warning:</strong> Regenerating will invalidate your current API key. All applications using the old key will stop working.
|
|
</div>
|
|
|
|
<button onclick="regenerateApiKey()" class="btn btn-danger">🔄 Regenerate API Key</button>
|
|
</div>
|
|
|
|
<!-- Account Info -->
|
|
<div style="border: 1px solid #e5e7eb; padding: 25px; border-radius: 8px;">
|
|
<h3 style="margin-bottom: 15px; color: #374151;">👤 Account Information</h3>
|
|
<div style="display: grid; gap: 15px;">
|
|
<div>
|
|
<strong style="color: #6b7280;">Username:</strong>
|
|
<div style="margin-top: 5px;">{{ username }}</div>
|
|
</div>
|
|
<div>
|
|
<strong style="color: #6b7280;">Account Type:</strong>
|
|
<div style="margin-top: 5px;">
|
|
{% if is_admin %}
|
|
<span class="admin-badge">Administrator</span>
|
|
{% else %}
|
|
Regular User
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<strong style="color: #6b7280;">Total Files:</strong>
|
|
<div style="margin-top: 5px;">{{ file_count }} files</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% endblock %}
|
|
|
|
{% block extra_scripts %}
|
|
<script>
|
|
function copyApiKey() {
|
|
const input = document.getElementById('apiKey');
|
|
input.select();
|
|
document.execCommand('copy');
|
|
alert('API Key copied to clipboard!');
|
|
}
|
|
|
|
async function regenerateApiKey() {
|
|
if (!confirm('Are you sure? This will invalidate your current API key!')) {
|
|
return;
|
|
}
|
|
|
|
try {
|
|
const response = await fetch('/api/users/me/api-key/regenerate', {
|
|
method: 'POST'
|
|
});
|
|
|
|
if (response.ok) {
|
|
window.location.reload();
|
|
} else {
|
|
alert('Failed to regenerate API key');
|
|
}
|
|
} catch (error) {
|
|
alert('Failed to regenerate API key: ' + error.message);
|
|
}
|
|
}
|
|
</script>
|
|
{% endblock %} |