fix settings page

routes/main.py

@@ -901,9 +901,14 @@ def init_routes(main_bp):
     def settings():
         if not current_user.is_admin:
             flash('You do not have permission to access settings.', 'error')
-            return redirect(url_for('main.index'))
+            return redirect(url_for('main.home'))
         
         active_tab = request.args.get('tab', 'colors')
+        # Validate tab parameter
+        valid_tabs = ['colors', 'general', 'email_templates', 'mails', 'security', 'events', 'debugging', 'smtp']
+        if active_tab not in valid_tabs:
+            active_tab = 'colors'
+        
         site_settings = SiteSettings.get_settings()
         company_form = CompanySettingsForm()
         

static/js/events.js

@@ -1,4 +1,9 @@
 document.addEventListener('DOMContentLoaded', function() {
+    // Only initialize if we're on the events tab
+    if (!document.getElementById('events-tab')?.classList.contains('active')) {
+        return;
+    }
+
     // Initialize variables
     let currentPage = parseInt(document.getElementById('currentPage').textContent) || 1;
     let totalPages = parseInt(document.getElementById('totalPages').textContent) || 1;

static/js/mail-log.js

@@ -50,13 +50,17 @@ function updateFilters() {
     
     // Build URL with current page number
     const currentPage = new URLSearchParams(window.location.search).get('page') || 1;
-    const url = `/settings/mails?page=${currentPage}&status=${status}&date_range=${dateRange}&user_id=${userId}&template_id=${templateId}`;
+    const url = `/settings?tab=mails&page=${currentPage}&status=${status}&date_range=${dateRange}&user_id=${userId}&template_id=${templateId}`;
+    
+    // Update URL with current filters
+    window.history.pushState({}, '', url);
     
     window.location.href = url;
 }
 
 function clearFilters() {
-    window.location.href = '/settings/mails';
+    // Reset filters
+    window.location.href = '/settings?tab=mails';
 }
 
 function changePage(page) {
@@ -65,12 +69,16 @@ function changePage(page) {
     const userId = document.getElementById('userFilter').value;
     const templateId = document.getElementById('templateFilter').value;
     
-    window.location.href = `/settings/mails?page=${page}&status=${status}&date_range=${dateRange}&user_id=${userId}&template_id=${templateId}`;
+    // Update URL with new page
+    const url = `/settings?tab=mails&page=${page}&status=${status}&date_range=${dateRange}&user_id=${userId}&template_id=${templateId}`;
+    window.history.pushState({}, '', url);
+    
+    window.location.href = url;
 }
 
 function viewMailDetails(mailId) {
     const csrfToken = document.querySelector('meta[name="csrf-token"]').content;
-    fetch(`/settings/mails/${mailId}`, {
+    fetch(`/settings?tab=mails&mail_id=${mailId}`, {
         headers: {
             'X-CSRF-Token': csrfToken
         }
@@ -99,5 +107,5 @@ function downloadMailLog() {
     const userId = document.getElementById('userFilter').value;
     const templateId = document.getElementById('templateFilter').value;
     
-    window.location.href = `/settings/mails/download?status=${status}&date_range=${dateRange}&user_id=${userId}&template_id=${templateId}`;
+    window.location.href = `/settings?tab=mails&download=true&status=${status}&date_range=${dateRange}&user_id=${userId}&template_id=${templateId}`;
 } 

templates/main/instance_detail.html

@@ -3,6 +3,10 @@
 
 {% block title %}{{ instance.name }} - DocuPulse{% endblock %}
 
+{% block extra_css %}
+<link rel="stylesheet" href="{{ url_for('static', filename='css/settings.css') }}?v={{ 'css/settings.css'|asset_version }}">
+{% endblock %}
+
 {% block content %}
 {{ header(
     title="Instance Details",
@@ -75,10 +79,53 @@
                 </div>
             </div>
 
-            <!-- Content will be added later -->
+            <!-- Tabs Section -->
-            <div class="row">
+            <div class="card">
-                <div class="col-12">
+                <div class="card-header bg-white">
-                    <!-- Content will be added later -->
+                    <ul class="nav nav-tabs card-header-tabs" id="instanceTabs" role="tablist">
+                        <li class="nav-item" role="presentation">
+                            <button class="nav-link active" id="overview-tab" data-bs-toggle="tab" data-bs-target="#overview" type="button" role="tab" aria-controls="overview" aria-selected="true">
+                                <i class="fas fa-info-circle me-2"></i>Overview
+                            </button>
+                        </li>
+                        <li class="nav-item" role="presentation">
+                            <button class="nav-link" id="statistics-tab" data-bs-toggle="tab" data-bs-target="#statistics" type="button" role="tab" aria-controls="statistics" aria-selected="false">
+                                <i class="fas fa-chart-bar me-2"></i>Statistics
+                            </button>
+                        </li>
+                        <li class="nav-item" role="presentation">
+                            <button class="nav-link" id="settings-tab" data-bs-toggle="tab" data-bs-target="#settings" type="button" role="tab" aria-controls="settings" aria-selected="false">
+                                <i class="fas fa-cog me-2"></i>Settings
+                            </button>
+                        </li>
+                    </ul>
+                </div>
+                <div class="card-body">
+                    <div class="tab-content" id="instanceTabsContent">
+                        <!-- Overview Tab -->
+                        <div class="tab-pane fade show active" id="overview" role="tabpanel" aria-labelledby="overview-tab">
+                            <div class="alert alert-info">
+                                <i class="fas fa-info-circle me-2"></i>
+                                Overview content will be available soon.
+                            </div>
+                        </div>
+
+                        <!-- Statistics Tab -->
+                        <div class="tab-pane fade" id="statistics" role="tabpanel" aria-labelledby="statistics-tab">
+                            <div class="alert alert-info">
+                                <i class="fas fa-info-circle me-2"></i>
+                                Statistics content will be available soon.
+                            </div>
+                        </div>
+
+                        <!-- Settings Tab -->
+                        <div class="tab-pane fade" id="settings" role="tabpanel" aria-labelledby="settings-tab">
+                            <div class="alert alert-info">
+                                <i class="fas fa-info-circle me-2"></i>
+                                Settings content will be available soon.
+                            </div>
+                        </div>
+                    </div>
                 </div>
             </div>
         </div>